Defined in: react-pacer/src/debouncer/useDebouncer.ts:13

• Omit<Debouncer<TFn>, "store">

TFn extends AnyFunction

TSelected = { }

readonly state: Readonly<TSelected>;

readonly state: Readonly<TSelected>;

Defined in: react-pacer/src/debouncer/useDebouncer.ts:39

Reactive state that will be updated and re-rendered when the debouncer state changes

Use this instead of debouncer.store.state

readonly store: Store<Readonly<DebouncerState<TFn>>>;

readonly store: Store<Readonly<DebouncerState<TFn>>>;

Defined in: react-pacer/src/debouncer/useDebouncer.ts:45

Use debouncer.state instead of debouncer.store.state if you want to read reactive state. The state on the store object is not reactive, as it has not been wrapped in a useStore hook internally. Although, you can make the state reactive by using the useStore in your own usage.

Subscribe: <TSelected>(props) => ReactNode | Promise<ReactNode>;

Subscribe: <TSelected>(props) => ReactNode | Promise<ReactNode>;

Defined in: react-pacer/src/debouncer/useDebouncer.ts:30

A React HOC (Higher Order Component) that allows you to subscribe to the debouncer state.

This is useful for opting into state re-renders for specific parts of the debouncer state deep in your component tree without needing to pass a selector to the hook.

TSelected

ReactNode | (state) => ReactNode

(state) => TSelected

ReactNode | Promise<ReactNode>

<debouncer.Subscribe selector={(state) => ({ isPending: state.isPending })}>
  {({ isPending }) => (
    <div>{isPending ? 'Loading...' : 'Ready'}</div>
  )}
</debouncer.Subscribe>

<debouncer.Subscribe selector={(state) => ({ isPending: state.isPending })}>
  {({ isPending }) => (
    <div>{isPending ? 'Loading...' : 'Ready'}</div>
  )}
</debouncer.Subscribe>