@tanstack/pacer 0.14.0 → 0.15.1

package/src/async-rate-limiter.ts

@@ -1,5 +1,6 @@
 import { Store } from '@tanstack/store'
-import { parseFunctionOrValue } from './utils'
+import { createKey, parseFunctionOrValue } from './utils'
+import { emitChange, pacerEventClient } from './event-client'
 import type { AnyAsyncFunction } from './types'
 
 export interface AsyncRateLimiterState<TFn extends AnyAsyncFunction> {
@@ -39,6 +40,10 @@ export interface AsyncRateLimiterState<TFn extends AnyAsyncFunction> {
    * Number of function executions that have completed successfully
    */
   successCount: number
+  /**
+   * Number of times maybeExecute has been called (for reduction calculations)
+   */
+  maybeExecuteCount: number
 }
 
 function getDefaultAsyncRateLimiterState<
@@ -50,10 +55,11 @@ function getDefaultAsyncRateLimiterState<
     isExceeded: false,
     isExecuting: false,
     lastResult: undefined,
+    maybeExecuteCount: 0,
     rejectionCount: 0,
     settleCount: 0,
-    successCount: 0,
     status: 'idle',
+    successCount: 0,
   }
 }
 
@@ -71,6 +77,11 @@ export interface AsyncRateLimiterOptions<TFn extends AnyAsyncFunction> {
    * Initial state for the rate limiter
    */
   initialState?: Partial<AsyncRateLimiterState<TFn>>
+  /**
+   * Optional key to identify this async rate limiter instance.
+   * If provided, the async rate limiter will be identified by this key in the devtools and PacerProvider if applicable.
+   */
+  key?: string
   /**
    * Maximum number of executions allowed within the time window.
    * Can be a number or a function that returns a number.
@@ -127,7 +138,7 @@ export interface AsyncRateLimiterOptions<TFn extends AnyAsyncFunction> {
 
 const defaultOptions: Omit<
   Required<AsyncRateLimiterOptions<any>>,
-  'initialState' | 'onError' | 'onReject' | 'onSettled' | 'onSuccess'
+  'initialState' | 'onError' | 'onReject' | 'onSettled' | 'onSuccess' | 'key'
 > = {
   enabled: true,
   limit: 1,
@@ -206,6 +217,7 @@ export class AsyncRateLimiter<TFn extends AnyAsyncFunction> {
   readonly store: Store<Readonly<AsyncRateLimiterState<TFn>>> = new Store<
     AsyncRateLimiterState<TFn>
   >(getDefaultAsyncRateLimiterState<TFn>())
+  key: string
   options: AsyncRateLimiterOptions<TFn>
   #timeoutIds: Set<NodeJS.Timeout> = new Set()
 
@@ -213,6 +225,7 @@ export class AsyncRateLimiter<TFn extends AnyAsyncFunction> {
     public fn: TFn,
     initialOptions: AsyncRateLimiterOptions<TFn>,
   ) {
+    this.key = createKey(initialOptions.key)
     this.options = {
       ...defaultOptions,
       ...initialOptions,
@@ -222,6 +235,12 @@ export class AsyncRateLimiter<TFn extends AnyAsyncFunction> {
     for (const executionTime of this.#getExecutionTimesInWindow()) {
       this.#setCleanupTimeout(executionTime)
     }
+
+    pacerEventClient.on('d-AsyncRateLimiter', (event) => {
+      if (event.payload.key !== this.key) return
+      this.#setState(event.payload.store.state)
+      this.setOptions(event.payload.options)
+    })
   }
 
   /**
@@ -251,6 +270,7 @@ export class AsyncRateLimiter<TFn extends AnyAsyncFunction> {
         status,
       }
     })
+    emitChange('AsyncRateLimiter', this)
   }
 
   /**
@@ -302,6 +322,10 @@ export class AsyncRateLimiter<TFn extends AnyAsyncFunction> {
   maybeExecute = async (
     ...args: Parameters<TFn>
   ): Promise<ReturnType<TFn> | undefined> => {
+    this.#setState({
+      maybeExecuteCount: this.store.state.maybeExecuteCount + 1,
+    })
+
     this.#cleanupOldExecutions()
 
     const relevantExecutionTimes = this.#getExecutionTimesInWindow()

package/src/async-throttler.ts

@@ -1,5 +1,6 @@
 import { Store } from '@tanstack/store'
-import { parseFunctionOrValue } from './utils'
+import { createKey, parseFunctionOrValue } from './utils'
+import { emitChange, pacerEventClient } from './event-client'
 import type { AnyAsyncFunction, OptionalKeys } from './types'
 
 export interface AsyncThrottlerState<TFn extends AnyAsyncFunction> {
@@ -27,6 +28,10 @@ export interface AsyncThrottlerState<TFn extends AnyAsyncFunction> {
    * The result from the most recent successful function execution
    */
   lastResult: ReturnType<TFn> | undefined
+  /**
+   * Number of times maybeExecute has been called (for reduction calculations)
+   */
+  maybeExecuteCount: number
   /**
    * Timestamp when the next execution can occur in milliseconds
    */
@@ -55,6 +60,7 @@ function getDefaultAsyncThrottlerState<
     lastArgs: undefined,
     lastExecutionTime: 0,
     lastResult: undefined,
+    maybeExecuteCount: 0,
     nextExecutionTime: undefined,
     settleCount: 0,
     status: 'idle',
@@ -76,6 +82,11 @@ export interface AsyncThrottlerOptions<TFn extends AnyAsyncFunction> {
    * Initial state for the async throttler
    */
   initialState?: Partial<AsyncThrottlerState<TFn>>
+  /**
+   * Optional key to identify this async throttler instance.
+   * If provided, the async throttler will be identified by this key in the devtools and PacerProvider if applicable.
+   */
+  key?: string
   /**
    * Whether to execute the function immediately when called
    * Defaults to true
@@ -189,6 +200,7 @@ export class AsyncThrottler<TFn extends AnyAsyncFunction> {
   readonly store: Store<Readonly<AsyncThrottlerState<TFn>>> = new Store<
     AsyncThrottlerState<TFn>
   >(getDefaultAsyncThrottlerState<TFn>())
+  key: string
   options: AsyncThrottlerOptions<TFn>
   #abortController: AbortController | null = null
   #timeoutId: NodeJS.Timeout | null = null
@@ -200,12 +212,18 @@ export class AsyncThrottler<TFn extends AnyAsyncFunction> {
     public fn: TFn,
     initialOptions: AsyncThrottlerOptions<TFn>,
   ) {
+    this.key = createKey(initialOptions.key)
     this.options = {
       ...defaultOptions,
       ...initialOptions,
       throwOnError: initialOptions.throwOnError ?? !initialOptions.onError,
     }
     this.#setState(this.options.initialState ?? {})
+    pacerEventClient.on('d-AsyncThrottler', (event) => {
+      if (event.payload.key !== this.key) return
+      this.#setState(event.payload.store.state as AsyncThrottlerState<TFn>)
+      this.setOptions(event.payload.options)
+    })
   }
 
   /**
@@ -240,6 +258,7 @@ export class AsyncThrottler<TFn extends AnyAsyncFunction> {
                 : 'idle',
       }
     })
+    emitChange('AsyncThrottler', this)
   }
 
   /**
@@ -286,7 +305,10 @@ export class AsyncThrottler<TFn extends AnyAsyncFunction> {
     const timeSinceLastExecution = now - this.store.state.lastExecutionTime
     const wait = this.#getWait()
     // Store the most recent arguments for potential trailing execution
-    this.#setState({ lastArgs: args })
+    this.#setState({
+      lastArgs: args,
+      maybeExecuteCount: this.store.state.maybeExecuteCount + 1,
+    })
 
     this.#resolvePreviousPromiseInternal()
 

package/src/batcher.ts

@@ -1,5 +1,6 @@
 import { Store } from '@tanstack/store'
-import { parseFunctionOrValue } from './utils'
+import { createKey, parseFunctionOrValue } from './utils'
+import { emitChange, pacerEventClient } from './event-client'
 import type { OptionalKeys } from './types'
 
 export interface BatcherState<TValue> {
@@ -58,6 +59,11 @@ export interface BatcherOptions<TValue> {
    * Initial state for the batcher
    */
   initialState?: Partial<BatcherState<TValue>>
+  /**
+   * Optional key to identify this batcher instance.
+   * If provided, the batcher will be identified by this key in the devtools and PacerProvider if applicable.
+   */
+  key?: string
   /**
    * Maximum number of items in a batch
    * @default Infinity
@@ -87,7 +93,7 @@ export interface BatcherOptions<TValue> {
 
 type BatcherOptionsWithOptionalCallbacks<TValue> = OptionalKeys<
   Required<BatcherOptions<TValue>>,
-  'initialState' | 'onExecute' | 'onItemsChange'
+  'initialState' | 'onExecute' | 'onItemsChange' | 'key'
 >
 
 const defaultOptions: BatcherOptionsWithOptionalCallbacks<any> = {
@@ -139,6 +145,7 @@ export class Batcher<TValue> {
   readonly store: Store<Readonly<BatcherState<TValue>>> = new Store(
     getDefaultBatcherState<TValue>(),
   )
+  key: string
   options: BatcherOptionsWithOptionalCallbacks<TValue>
   #timeoutId: NodeJS.Timeout | null = null
 
@@ -146,11 +153,18 @@ export class Batcher<TValue> {
     public fn: (items: Array<TValue>) => void,
     initialOptions: BatcherOptions<TValue>,
   ) {
+    this.key = createKey(initialOptions.key)
     this.options = {
       ...defaultOptions,
       ...initialOptions,
     }
     this.#setState(this.options.initialState ?? {})
+
+    pacerEventClient.on('d-Batcher', (event) => {
+      if (event.payload.key !== this.key) return
+      this.#setState(event.payload.store.state)
+      this.setOptions(event.payload.options)
+    })
   }
 
   /**
@@ -176,6 +190,7 @@ export class Batcher<TValue> {
         status: isPending ? 'pending' : 'idle',
       }
     })
+    emitChange('Batcher', this)
   }
 
   #getWait = (): number => {

package/src/debouncer.ts

@@ -1,5 +1,6 @@
 import { Store } from '@tanstack/store'
-import { parseFunctionOrValue } from './utils'
+import { createKey, parseFunctionOrValue } from './utils'
+import { emitChange, pacerEventClient } from './event-client'
 import type { AnyFunction } from './types'
 
 export interface DebouncerState<TFn extends AnyFunction> {
@@ -19,6 +20,10 @@ export interface DebouncerState<TFn extends AnyFunction> {
    * The arguments from the most recent call to maybeExecute
    */
   lastArgs: Parameters<TFn> | undefined
+  /**
+   * Number of times maybeExecute has been called (for reduction calculations)
+   */
+  maybeExecuteCount: number
   /**
    * Current execution status - 'idle' when not active, 'pending' when waiting for timeout
    */
@@ -34,6 +39,7 @@ function getDefaultDebouncerState<
     isPending: false,
     lastArgs: undefined,
     status: 'idle',
+    maybeExecuteCount: 0,
   }
 }
 
@@ -51,6 +57,11 @@ export interface DebouncerOptions<TFn extends AnyFunction> {
    * Initial state for the debouncer
    */
   initialState?: Partial<DebouncerState<TFn>>
+  /**
+   * A key to identify the debouncer.
+   * If provided, the debouncer will be identified by this key in the devtools and PacerProvider if applicable.
+   */
+  key?: string
   /**
    * Whether to execute on the leading edge of the timeout.
    * The first call will execute immediately and the rest will wait the delay.
@@ -76,7 +87,7 @@ export interface DebouncerOptions<TFn extends AnyFunction> {
 
 const defaultOptions: Omit<
   Required<DebouncerOptions<any>>,
-  'initialState' | 'onExecute'
+  'initialState' | 'onExecute' | 'key'
 > = {
   enabled: true,
   leading: false,
@@ -119,6 +130,7 @@ export class Debouncer<TFn extends AnyFunction> {
   readonly store: Store<Readonly<DebouncerState<TFn>>> = new Store(
     getDefaultDebouncerState<TFn>(),
   )
+  key: string
   options: DebouncerOptions<TFn>
   #timeoutId: NodeJS.Timeout | undefined
 
@@ -126,11 +138,18 @@ export class Debouncer<TFn extends AnyFunction> {
     public fn: TFn,
     initialOptions: DebouncerOptions<TFn>,
   ) {
+    this.key = createKey(initialOptions.key)
     this.options = {
       ...defaultOptions,
       ...initialOptions,
     }
     this.#setState(this.options.initialState ?? {})
+
+    pacerEventClient.on('d-Debouncer', (event) => {
+      if (event.payload.key !== this.key) return
+      this.#setState(event.payload.store.state as DebouncerState<TFn>)
+      this.setOptions(event.payload.options)
+    })
   }
 
   /**
@@ -161,6 +180,7 @@ export class Debouncer<TFn extends AnyFunction> {
             : 'idle',
       }
     })
+    emitChange('Debouncer', this)
   }
 
   /**
@@ -183,6 +203,11 @@ export class Debouncer<TFn extends AnyFunction> {
    */
   maybeExecute = (...args: Parameters<TFn>): void => {
     if (!this.#getEnabled()) return undefined
+
+    this.#setState({
+      maybeExecuteCount: this.store.state.maybeExecuteCount + 1,
+    })
+
     let _didLeadingExecute = false
 
     // Handle leading execution

package/src/event-client.ts

@@ -0,0 +1,63 @@
+import { EventClient } from '@tanstack/devtools-event-client'
+import type { AsyncBatcher } from './async-batcher'
+import type { AsyncDebouncer } from './async-debouncer'
+import type { AsyncQueuer } from './async-queuer'
+import type { AsyncRateLimiter } from './async-rate-limiter'
+import type { AsyncThrottler } from './async-throttler'
+import type { Debouncer } from './debouncer'
+import type { Batcher } from './batcher'
+import type { Queuer } from './queuer'
+import type { RateLimiter } from './rate-limiter'
+import type { Throttler } from './throttler'
+
+export interface PacerEventMap {
+  'pacer:d-AsyncBatcher': AsyncBatcher<any>
+  'pacer:d-AsyncDebouncer': AsyncDebouncer<any>
+  'pacer:d-AsyncQueuer': AsyncQueuer<any>
+  'pacer:d-AsyncRateLimiter': AsyncRateLimiter<any>
+  'pacer:d-AsyncThrottler': AsyncThrottler<any>
+  'pacer:d-Batcher': Batcher<any>
+  'pacer:d-Debouncer': Debouncer<any>
+  'pacer:d-Queuer': Queuer<any>
+  'pacer:d-RateLimiter': RateLimiter<any>
+  'pacer:d-Throttler': Throttler<any>
+  'pacer:AsyncBatcher': AsyncBatcher<any>
+  'pacer:AsyncDebouncer': AsyncDebouncer<any>
+  'pacer:AsyncQueuer': AsyncQueuer<any>
+  'pacer:AsyncRateLimiter': AsyncRateLimiter<any>
+  'pacer:AsyncThrottler': AsyncThrottler<any>
+  'pacer:Batcher': Batcher<any>
+  'pacer:Debouncer': Debouncer<any>
+  'pacer:Queuer': Queuer<any>
+  'pacer:RateLimiter': RateLimiter<any>
+  'pacer:Throttler': Throttler<any>
+}
+
+export type PacerEventName = keyof PacerEventMap extends `pacer:${infer T}`
+  ? T
+  : never
+
+class PacerEventClient extends EventClient<PacerEventMap> {
+  constructor(props?: { debug: boolean }) {
+    super({
+      pluginId: 'pacer',
+      debug: props?.debug,
+    })
+  }
+}
+
+export const emitChange = <
+  TSuffix extends Extract<
+    keyof PacerEventMap,
+    `${string}:${string}`
+  > extends `${string}:${infer S}`
+    ? S
+    : never,
+>(
+  event: TSuffix,
+  payload: PacerEventMap[`pacer:${TSuffix}`],
+) => {
+  pacerEventClient.emit(event, payload)
+}
+
+export const pacerEventClient = new PacerEventClient()

package/src/index.ts

@@ -10,3 +10,5 @@ export * from './rate-limiter'
 export * from './throttler'
 export * from './types'
 export * from './utils'
+export { pacerEventClient } from './event-client'
+export type { PacerEventMap, PacerEventName } from './event-client'

package/src/queuer.ts

@@ -1,7 +1,12 @@
 import { Store } from '@tanstack/store'
-import { parseFunctionOrValue } from './utils'
+import { createKey, parseFunctionOrValue } from './utils'
+import { emitChange, pacerEventClient } from './event-client'
 
 export interface QueuerState<TValue> {
+  /**
+   * Number of times addItem has been called (for reduction calculations)
+   */
+  addItemCount: number
   /**
    * Number of items that have been processed by the queuer
    */
@@ -66,6 +71,7 @@ function getDefaultQueuerState<TValue>(): QueuerState<TValue> {
     rejectionCount: 0,
     size: 0,
     status: 'idle',
+    addItemCount: 0,
   }
 }
 
@@ -108,6 +114,11 @@ export interface QueuerOptions<TValue> {
    * Initial state for the queuer
    */
   initialState?: Partial<QueuerState<TValue>>
+  /**
+   * Optional key to identify this queuer instance.
+   * If provided, the queuer will be identified by this key in the devtools and PacerProvider if applicable.
+   */
+  key?: string
   /**
    * Maximum number of items allowed in the queuer
    */
@@ -148,6 +159,7 @@ const defaultOptions: Omit<
   | 'onItemsChange'
   | 'onReject'
   | 'onExpire'
+  | 'key'
 > = {
   addItemsTo: 'back',
   getItemsFrom: 'front',
@@ -244,6 +256,7 @@ export class Queuer<TValue> {
   readonly store: Store<Readonly<QueuerState<TValue>>> = new Store(
     getDefaultQueuerState<TValue>(),
   )
+  key: string
   options: QueuerOptions<TValue>
   #timeoutId: NodeJS.Timeout | null = null
 
@@ -251,6 +264,7 @@ export class Queuer<TValue> {
     public fn: (item: TValue) => void,
     initialOptions: QueuerOptions<TValue> = {},
   ) {
+    this.key = createKey(initialOptions.key)
     this.options = {
       ...defaultOptions,
       ...initialOptions,
@@ -273,6 +287,11 @@ export class Queuer<TValue> {
         this.addItem(item, this.options.addItemsTo ?? 'back', isLast)
       }
     }
+    pacerEventClient.on('d-Queuer', (event) => {
+      if (event.payload.key !== this.key) return
+      this.#setState(event.payload.store.state)
+      this.setOptions(event.payload.options)
+    })
   }
 
   /**
@@ -307,6 +326,7 @@ export class Queuer<TValue> {
         status,
       }
     })
+    emitChange('Queuer', this)
   }
 
   /**
@@ -366,6 +386,10 @@ export class Queuer<TValue> {
     position: QueuePosition = this.options.addItemsTo ?? 'back',
     runOnItemsChange: boolean = true,
   ): boolean => {
+    this.#setState({
+      addItemCount: this.store.state.addItemCount + 1,
+    })
+
     if (this.store.state.items.length >= (this.options.maxSize ?? Infinity)) {
       this.#setState({
         rejectionCount: this.store.state.rejectionCount + 1,
@@ -447,7 +471,12 @@ export class Queuer<TValue> {
     const { items, itemTimestamps } = this.store.state
     let item: TValue | undefined
 
-    if (position === 'front') {
+    // When priority function is provided, always get from front (highest priority)
+    // Priority takes precedence over FIFO/LIFO behavior
+    if (
+      this.options.getPriority !== defaultOptions.getPriority ||
+      position === 'front'
+    ) {
       item = items[0]
       if (item !== undefined) {
         this.#setState({

package/src/rate-limiter.ts

@@ -1,5 +1,6 @@
 import { Store } from '@tanstack/store'
-import { parseFunctionOrValue } from './utils'
+import { createKey, parseFunctionOrValue } from './utils'
+import { emitChange, pacerEventClient } from './event-client'
 import type { AnyFunction } from './types'
 
 export interface RateLimiterState {
@@ -15,6 +16,10 @@ export interface RateLimiterState {
    * Whether the rate limiter has exceeded the limit
    */
   isExceeded: boolean
+  /**
+   * Number of times maybeExecute has been called (for reduction calculations)
+   */
+  maybeExecuteCount: number
   /**
    * Number of function executions that have been rejected due to rate limiting
    */
@@ -32,6 +37,7 @@ function getDefaultRateLimiterState(): RateLimiterState {
     isExceeded: false,
     rejectionCount: 0,
     status: 'idle',
+    maybeExecuteCount: 0,
   }
 }
 
@@ -48,6 +54,11 @@ export interface RateLimiterOptions<TFn extends AnyFunction> {
    * Initial state for the rate limiter
    */
   initialState?: Partial<RateLimiterState>
+  /**
+   * Optional key to identify this rate limiter instance.
+   * If provided, the rate limiter will be identified by this key in the devtools and PacerProvider if applicable.
+   */
+  key?: string
   /**
    * Maximum number of executions allowed within the time window.
    * Can be a number or a callback function that receives the rate limiter instance and returns a number.
@@ -77,7 +88,7 @@ export interface RateLimiterOptions<TFn extends AnyFunction> {
 
 const defaultOptions: Omit<
   Required<RateLimiterOptions<any>>,
-  'initialState' | 'onExecute' | 'onReject'
+  'initialState' | 'onExecute' | 'onReject' | 'key'
 > = {
   enabled: true,
   limit: 1,
@@ -132,6 +143,7 @@ const defaultOptions: Omit<
 export class RateLimiter<TFn extends AnyFunction> {
   readonly store: Store<Readonly<RateLimiterState>> =
     new Store<RateLimiterState>(getDefaultRateLimiterState())
+  key: string
   options: RateLimiterOptions<TFn>
   #timeoutIds: Set<NodeJS.Timeout> = new Set()
 
@@ -139,6 +151,7 @@ export class RateLimiter<TFn extends AnyFunction> {
     public fn: TFn,
     initialOptions: RateLimiterOptions<TFn>,
   ) {
+    this.key = createKey(initialOptions.key)
     this.options = {
       ...defaultOptions,
       ...initialOptions,
@@ -147,6 +160,12 @@ export class RateLimiter<TFn extends AnyFunction> {
     for (const executionTime of this.#getExecutionTimesInWindow()) {
       this.#setCleanupTimeout(executionTime)
     }
+
+    pacerEventClient.on('d-RateLimiter', (event) => {
+      if (event.payload.key !== this.key) return
+      this.#setState(event.payload.store.state)
+      this.setOptions(event.payload.options)
+    })
   }
 
   /**
@@ -174,6 +193,7 @@ export class RateLimiter<TFn extends AnyFunction> {
         status,
       }
     })
+    emitChange('RateLimiter', this)
   }
 
   /**
@@ -213,6 +233,10 @@ export class RateLimiter<TFn extends AnyFunction> {
    * ```
    */
   maybeExecute = (...args: Parameters<TFn>): boolean => {
+    this.#setState({
+      maybeExecuteCount: this.store.state.maybeExecuteCount + 1,
+    })
+
     this.#cleanupOldExecutions()
 
     const relevantExecutionTimes = this.#getExecutionTimesInWindow()

package/src/throttler.ts

@@ -1,5 +1,6 @@
 import { Store } from '@tanstack/store'
-import { parseFunctionOrValue } from './utils'
+import { createKey, parseFunctionOrValue } from './utils'
+import { emitChange, pacerEventClient } from './event-client'
 import type { AnyFunction } from './types'
 
 export interface ThrottlerState<TFn extends AnyFunction> {
@@ -19,6 +20,10 @@ export interface ThrottlerState<TFn extends AnyFunction> {
    * Timestamp of the last function execution in milliseconds
    */
   lastExecutionTime: number
+  /**
+   * Number of times maybeExecute has been called (for reduction calculations)
+   */
+  maybeExecuteCount: number
   /**
    * Timestamp when the next execution can occur in milliseconds
    */
@@ -39,6 +44,7 @@ function getDefaultThrottlerState<
     lastExecutionTime: 0,
     nextExecutionTime: 0,
     status: 'idle',
+    maybeExecuteCount: 0,
   }
 }
 
@@ -56,6 +62,11 @@ export interface ThrottlerOptions<TFn extends AnyFunction> {
    * Initial state for the throttler
    */
   initialState?: Partial<ThrottlerState<TFn>>
+  /**
+   * A key to identify the throttler.
+   * If provided, the throttler will be identified by this key in the devtools and PacerProvider if applicable.
+   */
+  key?: string
   /**
    * Whether to execute on the leading edge of the timeout.
    * Defaults to true.
@@ -80,7 +91,7 @@ export interface ThrottlerOptions<TFn extends AnyFunction> {
 
 const defaultOptions: Omit<
   Required<ThrottlerOptions<any>>,
-  'initialState' | 'onExecute'
+  'initialState' | 'onExecute' | 'key'
 > = {
   enabled: true,
   leading: true,
@@ -127,6 +138,7 @@ export class Throttler<TFn extends AnyFunction> {
   readonly store: Store<Readonly<ThrottlerState<TFn>>> = new Store(
     getDefaultThrottlerState(),
   )
+  key: string | undefined
   options: ThrottlerOptions<TFn>
   #timeoutId: NodeJS.Timeout | undefined
 
@@ -134,11 +146,18 @@ export class Throttler<TFn extends AnyFunction> {
     public fn: TFn,
     initialOptions: ThrottlerOptions<TFn>,
   ) {
+    this.key = createKey(initialOptions.key)
     this.options = {
       ...defaultOptions,
       ...initialOptions,
     }
     this.#setState(this.options.initialState ?? {})
+
+    pacerEventClient.on('d-Throttler', (event) => {
+      if (event.payload.key !== this.key) return
+      this.#setState(event.payload.store.state as ThrottlerState<TFn>)
+      this.setOptions(event.payload.options)
+    })
   }
 
   /**
@@ -169,6 +188,7 @@ export class Throttler<TFn extends AnyFunction> {
             : 'idle',
       }
     })
+    emitChange('Throttler', this)
   }
 
   #getEnabled = (): boolean => {
@@ -202,6 +222,10 @@ export class Throttler<TFn extends AnyFunction> {
    * ```
    */
   maybeExecute = (...args: Parameters<TFn>): void => {
+    this.#setState({
+      maybeExecuteCount: this.store.state.maybeExecuteCount + 1,
+    })
+
     const now = Date.now()
     const timeSinceLastExecution = now - this.store.state.lastExecutionTime
     const wait = this.#getWait()