FocusManager

Defined in: packages/query-core/src/focusManager.ts:14

The FocusManager manages the focus state within TanStack Query.

It can be used to change the default event listeners or to manually change the focus state.

Extends#

• Subscribable<Listener>

Methods#

hasListeners()#

hasListeners(): boolean;

Defined in: packages/query-core/src/subscribable.ts:43

Returns true while at least one listener is registered, false once they have all unsubscribed.

Returns#

boolean

true if at least one listener is registered.

Inherited from#

Subscribable.hasListeners

isFocused()#

isFocused(): boolean;

Defined in: packages/query-core/src/focusManager.ts:130

isFocused can be used to get the current focus state.

Returns#

boolean

The focus state set with setFocused, or otherwise whether the document is visible.

onFocus()#

onFocus(): void;

Defined in: packages/query-core/src/focusManager.ts:119

onFocus notifies all subscribed listeners with the current focus state.

Returns#

void

setEventListener()#

setEventListener(setup: SetupFn): void;

Defined in: packages/query-core/src/focusManager.ts:78

setEventListener can be used to set a custom event listener that will be used to determine the focus state. The provided setup function receives a setFocused callback: call it with a boolean to manually set the focus state, or with no arguments to re-evaluate the current focus state and notify subscribers.

Parameters#

setup#

SetupFn

Receives the setFocused callback, registers the event listener, and may return a cleanup function that is called when the listener is replaced or no longer needed.

Returns#

void

Example#

import { focusManager } from '@tanstack/query-core'

focusManager.setEventListener((handleFocus) => {
  const listener = () => handleFocus()
  // Listen to visibilitychange
  if (typeof window !== 'undefined' && window.addEventListener) {
    window.addEventListener('visibilitychange', listener, false)
  }

  return () => {
    // Be sure to unsubscribe if a new handler is set
    window.removeEventListener('visibilitychange', listener)
  }
})

setFocused()#

setFocused(focused?: boolean): void;

Defined in: packages/query-core/src/focusManager.ts:108

setFocused can be used to manually set the focus state. Set undefined to fall back to the default focus check.

Parameters#

focused?#

boolean

The focus state, or undefined to use the default focus check.

Returns#

void

Example#

import { focusManager } from '@tanstack/query-core'

// Set focused
focusManager.setFocused(true)

// Set unfocused
focusManager.setFocused(false)

// Fallback to the default focus check
focusManager.setFocused(undefined)

subscribe()#

subscribe(listener: Listener): () => void;

Defined in: packages/query-core/src/subscribable.ts:28

Registers a listener to be called on every update this object notifies about. Returns a function that removes the listener again — call it to stop listening. The base class never drops a listener on its own, though some subclasses clear all of theirs in destroy().

Parameters#

listener#

Listener

Called on each update, with whatever the subclass passes to its subscribers.

Returns#

A function that removes the listener.

(): void;

Returns#

void

Example#

const unsubscribe = subscribable.subscribe(() => {
  // react to the update
})

unsubscribe()

Inherited from#

Subscribable.subscribe