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>

Properties#

Methods#

hasListeners()#

hasListeners(): boolean;

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

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

Returns#

boolean

Inherited from#

Subscribable.hasListeners

isFocused()#

isFocused(): boolean;

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

isFocused can be used to get the current focus state.

Returns#

boolean

onFocus()#

onFocus(): void;

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

onFocus notifies all subscribed listeners with the current focus state.

Returns#

void

onSubscribe()#

protected onSubscribe(): void;

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

Returns#

void

Overrides#

Subscribable.onSubscribe

onUnsubscribe()#

protected onUnsubscribe(): void;

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

Returns#

void

Overrides#

Subscribable.onUnsubscribe

setEventListener()#

setEventListener(setup: SetupFn): void;

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

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

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:107

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

Parameters#

focused?#

boolean

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:27

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#

(): void;

Returns#

void

Example#

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

unsubscribe()

Inherited from#

Subscribable.subscribe