@tanstack/pacer 0.8.0 → 0.9.0

package/src/batcher.ts

@@ -1,5 +1,55 @@
+import { Store } from '@tanstack/store'
+import { parseFunctionOrValue } from './utils'
 import type { OptionalKeys } from './types'
 
+export interface BatcherState<TValue> {
+  /**
+   * Number of batch executions that have been completed
+   */
+  executionCount: number
+  /**
+   * Whether the batcher has no items to process (items array is empty)
+   */
+  isEmpty: boolean
+  /**
+   * Whether the batcher is waiting for the timeout to trigger batch processing
+   */
+  isPending: boolean
+  /**
+   * Whether the batcher is active and will process items automatically
+   */
+  isRunning: boolean
+  /**
+   * Total number of items that have been processed across all batches
+   */
+  totalItemsProcessed: number
+  /**
+   * Array of items currently queued for batch processing
+   */
+  items: Array<TValue>
+  /**
+   * Number of items currently in the batch queue
+   */
+  size: number
+  /**
+   * Current processing status - 'idle' when not processing, 'pending' when waiting for timeout
+   */
+  status: 'idle' | 'pending'
+}
+
+function getDefaultBatcherState<TValue>(): BatcherState<TValue> {
+  return {
+    executionCount: 0,
+    isEmpty: true,
+    isPending: false,
+    isRunning: true,
+    totalItemsProcessed: 0,
+    items: [],
+    size: 0,
+    status: 'idle',
+  }
+}
+
 /**
  * Options for configuring a Batcher instance
  */
@@ -9,6 +59,10 @@ export interface BatcherOptions<TValue> {
    * Return true to process the batch immediately
    */
   getShouldExecute?: (items: Array<TValue>, batcher: Batcher<TValue>) => boolean
+  /**
+   * Initial state for the batcher
+   */
+  initialState?: Partial<BatcherState<TValue>>
   /**
    * Maximum number of items in a batch
    * @default Infinity
@@ -18,10 +72,6 @@ export interface BatcherOptions<TValue> {
    * Callback fired after a batch is processed
    */
   onExecute?: (batcher: Batcher<TValue>) => void
-  /**
-   * Callback fired when the batcher's running state changes
-   */
-  onIsRunningChange?: (batcher: Batcher<TValue>) => void
   /**
    * Callback fired after items are added to the batcher
    */
@@ -37,12 +87,12 @@ export interface BatcherOptions<TValue> {
    * If not provided, the batch will not be triggered by a timeout.
    * @default Infinity
    */
-  wait?: number
+  wait?: number | ((batcher: Batcher<TValue>) => number)
 }
 
 type BatcherOptionsWithOptionalCallbacks<TValue> = OptionalKeys<
   Required<BatcherOptions<TValue>>,
-  'onExecute' | 'onItemsChange' | 'onIsRunningChange'
+  'initialState' | 'onExecute' | 'onItemsChange'
 >
 
 const defaultOptions: BatcherOptionsWithOptionalCallbacks<any> = {
@@ -63,6 +113,15 @@ const defaultOptions: BatcherOptionsWithOptionalCallbacks<any> = {
  * - Custom batch processing logic via getShouldExecute
  * - Event callbacks for monitoring batch operations
  *
+ * State Management:
+ * - Uses TanStack Store for reactive state management
+ * - Use `initialState` to provide initial state values when creating the batcher
+ * - Use `onExecute` callback to react to batch execution and implement custom logic
+ * - Use `onItemsChange` callback to react to items being added or removed from the batcher
+ * - The state includes batch execution count, total items processed, items, and running status
+ * - State can be accessed via `batcher.store.state` when using the class directly
+ * - When using framework adapters (React/Solid), state is accessed from `batcher.state`
+ *
  * @example
  * ```ts
  * const batcher = new Batcher<number>(
@@ -70,7 +129,7 @@ const defaultOptions: BatcherOptionsWithOptionalCallbacks<any> = {
  *   {
  *     maxSize: 5,
  *     wait: 2000,
- *     onExecuteBatch: (items) => console.log('Batch executed:', items)
+ *     onExecute: (batcher) => console.log('Batch executed:', batcher.peekAllItems())
  *   }
  * );
  *
@@ -78,59 +137,76 @@ const defaultOptions: BatcherOptionsWithOptionalCallbacks<any> = {
  * batcher.addItem(2);
  * // After 2 seconds or when 5 items are added, whichever comes first,
  * // the batch will be processed
- * // batcher.execute() // manually trigger a batch
+ * // batcher.flush() // manually trigger a batch
  * ```
  */
 export class Batcher<TValue> {
-  private _options: BatcherOptionsWithOptionalCallbacks<TValue>
-  private _batchExecutionCount = 0
-  private _itemExecutionCount = 0
-  private _items: Array<TValue> = []
-  private _running: boolean
-  private _timeoutId: NodeJS.Timeout | null = null
+  readonly store: Store<Readonly<BatcherState<TValue>>> = new Store(
+    getDefaultBatcherState<TValue>(),
+  )
+  options: BatcherOptionsWithOptionalCallbacks<TValue>
+  #timeoutId: NodeJS.Timeout | null = null
 
   constructor(
     private fn: (items: Array<TValue>) => void,
     initialOptions: BatcherOptions<TValue>,
   ) {
-    this._options = { ...defaultOptions, ...initialOptions }
-    this._running = this._options.started
+    this.options = {
+      ...defaultOptions,
+      ...initialOptions,
+    }
+    this.#setState(this.options.initialState ?? {})
   }
 
   /**
    * Updates the batcher options
    */
-  setOptions(newOptions: Partial<BatcherOptions<TValue>>): void {
-    this._options = { ...this._options, ...newOptions }
+  setOptions = (newOptions: Partial<BatcherOptions<TValue>>): void => {
+    this.options = { ...this.options, ...newOptions }
   }
 
-  /**
-   * Returns the current batcher options
-   */
-  getOptions(): BatcherOptions<TValue> {
-    return this._options
+  #setState = (newState: Partial<BatcherState<TValue>>): void => {
+    this.store.setState((state) => {
+      const combinedState = {
+        ...state,
+        ...newState,
+      }
+      const { isPending, items } = combinedState
+      const size = items.length
+      const isEmpty = size === 0
+      return {
+        ...combinedState,
+        isEmpty,
+        size,
+        status: isPending ? 'pending' : 'idle',
+      }
+    })
+  }
+
+  #getWait = (): number => {
+    return parseFunctionOrValue(this.options.wait, this)
   }
 
   /**
    * Adds an item to the batcher
    * If the batch size is reached, timeout occurs, or shouldProcess returns true, the batch will be processed
    */
-  addItem(item: TValue): void {
-    this._items.push(item)
-    this._options.onItemsChange?.(this)
+  addItem = (item: TValue): void => {
+    this.#setState({
+      items: [...this.store.state.items, item],
+      isPending: this.options.wait !== Infinity,
+    })
+    this.options.onItemsChange?.(this)
 
     const shouldProcess =
-      this._items.length >= this._options.maxSize ||
-      this._options.getShouldExecute(this._items, this)
+      this.store.state.items.length >= this.options.maxSize ||
+      this.options.getShouldExecute(this.store.state.items, this)
 
     if (shouldProcess) {
-      this.execute()
-    } else if (
-      this._running &&
-      !this._timeoutId &&
-      this._options.wait !== Infinity
-    ) {
-      this._timeoutId = setTimeout(() => this.execute(), this._options.wait)
+      this.#execute()
+    } else if (this.store.state.isRunning && this.options.wait !== Infinity) {
+      this.#clearTimeout() // clear any pending timeout to replace it with a new one
+      this.#timeoutId = setTimeout(() => this.#execute(), this.#getWait())
     }
   }
 
@@ -143,89 +219,76 @@ export class Batcher<TValue> {
    *
    * You can also call this method manually to process the current batch at any time.
    */
-  execute(): void {
-    if (this._timeoutId) {
-      clearTimeout(this._timeoutId)
-      this._timeoutId = null
-    }
-
-    if (this._items.length === 0) {
+  #execute = (): void => {
+    if (this.store.state.items.length === 0) {
       return
     }
 
     const batch = this.peekAllItems() // copy of the items to be processed (to prevent race conditions)
-    this._items = [] // Clear items before processing to prevent race conditions
-    this._options.onItemsChange?.(this) // Call onItemsChange to notify listeners that the items have changed
+    this.clear() // Clear items before processing to prevent race conditions
+    this.options.onItemsChange?.(this) // Call onItemsChange to notify listeners that the items have changed
 
-    this.fn(batch)
-    this._batchExecutionCount++
-    this._itemExecutionCount += batch.length
-    this._options.onExecute?.(this)
+    this.fn(batch) // EXECUTE
+    this.#setState({
+      executionCount: this.store.state.executionCount + 1,
+      totalItemsProcessed: this.store.state.totalItemsProcessed + batch.length,
+    })
+    this.options.onExecute?.(this)
   }
 
   /**
-   * Stops the batcher from processing batches
+   * Processes the current batch of items immediately
    */
-  stop(): void {
-    this._running = false
-    this._options.onIsRunningChange?.(this)
-    if (this._timeoutId) {
-      clearTimeout(this._timeoutId)
-      this._timeoutId = null
-    }
+  flush = (): void => {
+    this.#clearTimeout() // clear any pending timeout
+    this.#execute() // execute immediately
   }
 
   /**
-   * Starts the batcher and processes any pending items
-   */
-  start(): void {
-    this._running = true
-    this._options.onIsRunningChange?.(this)
-    if (this._items.length > 0 && !this._timeoutId) {
-      this._timeoutId = setTimeout(() => this.execute(), this._options.wait)
-    }
-  }
-
-  /**
-   * Returns the current number of items in the batcher
+   * Stops the batcher from processing batches
    */
-  getSize(): number {
-    return this._items.length
+  stop = (): void => {
+    this.#setState({ isRunning: false })
+    this.#clearTimeout()
   }
 
   /**
-   * Returns true if the batcher is empty
+   * Starts the batcher and processes any pending items
    */
-  getIsEmpty(): boolean {
-    return this._items.length === 0
+  start = (): void => {
+    this.#setState({ isRunning: true })
+    if (this.store.state.items.length > 0) {
+      this.#execute()
+    }
   }
 
   /**
-   * Returns true if the batcher is running
+   * Returns a copy of all items in the batcher
    */
-  getIsRunning(): boolean {
-    return this._running
+  peekAllItems = (): Array<TValue> => {
+    return [...this.store.state.items]
   }
 
-  /**
-   * Returns a copy of all items currently in the batcher
-   */
-  peekAllItems(): Array<TValue> {
-    return [...this._items]
+  #clearTimeout = (): void => {
+    if (this.#timeoutId) {
+      clearTimeout(this.#timeoutId)
+      this.#timeoutId = null
+    }
   }
 
   /**
-   * Returns the number of times batches have been processed
+   * Removes all items from the batcher
    */
-  getBatchExecutionCount(): number {
-    return this._batchExecutionCount
+  clear = (): void => {
+    this.#setState({ items: [], isPending: false })
   }
 
   /**
-   * Returns the total number of individual items that have been processed
+   * Resets the batcher state to its default values
    */
-  getItemExecutionCount(): number {
-    return this._itemExecutionCount
+  reset = (): void => {
+    this.#setState(getDefaultBatcherState<TValue>())
+    this.options.onItemsChange?.(this)
   }
 }
 
@@ -234,10 +297,13 @@ export class Batcher<TValue> {
  *
  * @example
  * ```ts
- * const batchItems = batch<number>({
- *   batchSize: 3,
- *   processBatch: (items) => console.log('Processing:', items)
- * });
+ * const batchItems = batch<number>(
+ *   (items) => console.log('Processing:', items),
+ *   {
+ *     maxSize: 3,
+ *     onExecute: (batcher) => console.log('Batch executed')
+ *   }
+ * );
  *
  * batchItems(1);
  * batchItems(2);
@@ -249,5 +315,5 @@ export function batch<TValue>(
   options: BatcherOptions<TValue>,
 ) {
   const batcher = new Batcher<TValue>(fn, options)
-  return batcher.addItem.bind(batcher)
+  return batcher.addItem
 }

package/src/debouncer.ts

@@ -1,6 +1,42 @@
+import { Store } from '@tanstack/store'
 import { parseFunctionOrValue } from './utils'
 import type { AnyFunction } from './types'
 
+export interface DebouncerState<TFn extends AnyFunction> {
+  /**
+   * Whether the debouncer can execute on the leading edge of the timeout
+   */
+  canLeadingExecute: boolean
+  /**
+   * Number of function executions that have been completed
+   */
+  executionCount: number
+  /**
+   * Whether the debouncer is waiting for the timeout to trigger execution
+   */
+  isPending: boolean
+  /**
+   * The arguments from the most recent call to maybeExecute
+   */
+  lastArgs: Parameters<TFn> | undefined
+  /**
+   * Current execution status - 'idle' when not active, 'pending' when waiting for timeout
+   */
+  status: 'disabled' | 'idle' | 'pending'
+}
+
+function getDefaultDebouncerState<
+  TFn extends AnyFunction,
+>(): DebouncerState<TFn> {
+  return structuredClone({
+    canLeadingExecute: true,
+    executionCount: 0,
+    isPending: false,
+    lastArgs: undefined,
+    status: 'idle',
+  })
+}
+
 /**
  * Options for configuring a debounced function
  */
@@ -11,6 +47,10 @@ export interface DebouncerOptions<TFn extends AnyFunction> {
    * Defaults to true.
    */
   enabled?: boolean | ((debouncer: Debouncer<TFn>) => boolean)
+  /**
+   * Initial state for the debouncer
+   */
+  initialState?: Partial<DebouncerState<TFn>>
   /**
    * Whether to execute on the leading edge of the timeout.
    * The first call will execute immediately and the rest will wait the delay.
@@ -34,10 +74,12 @@ export interface DebouncerOptions<TFn extends AnyFunction> {
   wait: number | ((debouncer: Debouncer<TFn>) => number)
 }
 
-const defaultOptions: Required<DebouncerOptions<any>> = {
+const defaultOptions: Omit<
+  Required<DebouncerOptions<any>>,
+  'initialState' | 'onExecute'
+> = {
   enabled: true,
   leading: false,
-  onExecute: () => {},
   trailing: true,
   wait: 0,
 }
@@ -53,6 +95,14 @@ const defaultOptions: Required<DebouncerOptions<any>> = {
  * (leading edge) or at the end (trailing edge, default). Each new call during the wait period
  * will reset the timer.
  *
+ * State Management:
+ * - Uses TanStack Store for reactive state management
+ * - Use `initialState` to provide initial state values when creating the debouncer
+ * - Use `onExecute` callback to react to function execution and implement custom logic
+ * - The state includes canLeadingExecute, execution count, and isPending status
+ * - State can be accessed via `debouncer.store.state` when using the class directly
+ * - When using framework adapters (React/Solid), state is accessed from `debouncer.state`
+ *
  * @example
  * ```ts
  * const debouncer = new Debouncer((value: string) => {
@@ -66,117 +116,142 @@ const defaultOptions: Required<DebouncerOptions<any>> = {
  * ```
  */
 export class Debouncer<TFn extends AnyFunction> {
-  private _canLeadingExecute = true
-  private _executionCount = 0
-  private _isPending = false
-  private _options: Required<DebouncerOptions<TFn>>
-  private _timeoutId: NodeJS.Timeout | undefined
+  readonly store: Store<Readonly<DebouncerState<TFn>>> = new Store(
+    getDefaultDebouncerState<TFn>(),
+  )
+  options: DebouncerOptions<TFn>
+  #timeoutId: NodeJS.Timeout | undefined
 
   constructor(
     private fn: TFn,
     initialOptions: DebouncerOptions<TFn>,
   ) {
-    this._options = {
+    this.options = {
       ...defaultOptions,
       ...initialOptions,
     }
+    this.#setState(this.options.initialState ?? {})
   }
 
   /**
    * Updates the debouncer options
    */
-  setOptions(newOptions: Partial<DebouncerOptions<TFn>>): void {
-    this._options = { ...this._options, ...newOptions }
+  setOptions = (newOptions: Partial<DebouncerOptions<TFn>>): void => {
+    this.options = { ...this.options, ...newOptions }
 
-    // End the pending state if the debouncer is disabled
-    if (!this._options.enabled) {
-      this._isPending = false
+    // Cancel pending execution if the debouncer is disabled
+    if (!this.#getEnabled()) {
+      this.cancel()
     }
   }
 
-  /**
-   * Returns the current debouncer options
-   */
-  getOptions(): Required<DebouncerOptions<TFn>> {
-    return this._options
+  #setState = (newState: Partial<DebouncerState<TFn>>): void => {
+    this.store.setState((state) => {
+      const combinedState = {
+        ...state,
+        ...newState,
+      }
+      const { isPending } = combinedState
+      return {
+        ...combinedState,
+        status: !this.#getEnabled()
+          ? 'disabled'
+          : isPending
+            ? 'pending'
+            : 'idle',
+      }
+    })
   }
 
   /**
    * Returns the current enabled state of the debouncer
    */
-  getEnabled(): boolean {
-    return parseFunctionOrValue(this._options.enabled, this)
+  #getEnabled = (): boolean => {
+    return !!parseFunctionOrValue(this.options.enabled, this)
   }
 
   /**
    * Returns the current wait time in milliseconds
    */
-  getWait(): number {
-    return parseFunctionOrValue(this._options.wait, this)
+  #getWait = (): number => {
+    return parseFunctionOrValue(this.options.wait, this)
   }
 
   /**
    * Attempts to execute the debounced function
    * If a call is already in progress, it will be queued
    */
-  maybeExecute(...args: Parameters<TFn>): void {
+  maybeExecute = (...args: Parameters<TFn>): void => {
+    if (!this.#getEnabled()) return undefined
     let _didLeadingExecute = false
 
     // Handle leading execution
-    if (this._options.leading && this._canLeadingExecute) {
-      this._canLeadingExecute = false
+    if (this.options.leading && this.store.state.canLeadingExecute) {
+      this.#setState({ canLeadingExecute: false })
       _didLeadingExecute = true
-      this.execute(...args)
+      this.#execute(...args)
     }
 
     // Start pending state to indicate that the debouncer is waiting for the trailing edge
-    if (this._options.trailing) {
-      this._isPending = true
+    if (this.options.trailing) {
+      this.#setState({ isPending: true, lastArgs: args })
     }
 
     // Clear any existing timeout
-    if (this._timeoutId) clearTimeout(this._timeoutId)
+    if (this.#timeoutId) clearTimeout(this.#timeoutId)
 
     // Set new timeout that will reset canLeadingExecute and execute trailing only if enabled and did not execute leading
-    this._timeoutId = setTimeout(() => {
-      this._canLeadingExecute = true
-      if (this._options.trailing && !_didLeadingExecute) {
-        this.execute(...args)
+    this.#timeoutId = setTimeout(() => {
+      this.#setState({ canLeadingExecute: true })
+      if (this.options.trailing && !_didLeadingExecute) {
+        this.#execute(...args)
       }
-    }, this.getWait())
+    }, this.#getWait())
   }
 
-  private execute(...args: Parameters<TFn>): void {
-    if (!this.getEnabled()) return undefined
+  #execute = (...args: Parameters<TFn>): void => {
+    if (!this.#getEnabled()) return undefined
     this.fn(...args) // EXECUTE!
-    this._isPending = false
-    this._executionCount++
-    this._options.onExecute(this)
+    this.#setState({
+      isPending: false,
+      executionCount: this.store.state.executionCount + 1,
+    })
+    this.options.onExecute?.(this)
   }
 
   /**
-   * Cancels any pending execution
+   * Processes the current pending execution immediately
    */
-  cancel(): void {
-    if (this._timeoutId) {
-      clearTimeout(this._timeoutId)
-      this._canLeadingExecute = true
-      this._isPending = false
+  flush = (): void => {
+    if (this.store.state.isPending && this.store.state.lastArgs) {
+      this.#clearTimeout() // clear any pending timeout
+      this.#execute(...this.store.state.lastArgs) // execute immediately
+    }
+  }
+
+  #clearTimeout = (): void => {
+    if (this.#timeoutId) {
+      clearTimeout(this.#timeoutId)
+      this.#timeoutId = undefined
     }
   }
 
   /**
-   * Returns the number of times the function has been executed
+   * Cancels any pending execution
    */
-  getExecutionCount(): number {
-    return this._executionCount
+  cancel = (): void => {
+    this.#clearTimeout()
+    this.#setState({
+      canLeadingExecute: true,
+      isPending: false,
+    })
   }
 
   /**
-   * Returns `true` if debouncing
+   * Resets the debouncer state to its default values
    */
-  getIsPending(): boolean {
-    return this.getEnabled() && this._isPending
+  reset = (): void => {
+    this.#setState(getDefaultDebouncerState<TFn>())
   }
 }
 
@@ -190,6 +265,14 @@ export class Debouncer<TFn extends AnyFunction> {
  * If leading option is true, the function will execute immediately on the first call, then wait the delay
  * before allowing another execution.
  *
+ * State Management:
+ * - Uses TanStack Store for reactive state management
+ * - Use `initialState` to provide initial state values when creating the debouncer
+ * - Use `onExecute` callback to react to function execution and implement custom logic
+ * - The state includes canLeadingExecute, execution count, and isPending status
+ * - State can be accessed via the underlying Debouncer instance's `store.state` property
+ * - When using framework adapters (React/Solid), state is accessed from the hook's state property
+ *
  * @example
  * ```ts
  * const debounced = debounce(() => {
@@ -205,5 +288,5 @@ export function debounce<TFn extends AnyFunction>(
   initialOptions: DebouncerOptions<TFn>,
 ): (...args: Parameters<TFn>) => void {
   const debouncer = new Debouncer(fn, initialOptions)
-  return debouncer.maybeExecute.bind(debouncer)
+  return debouncer.maybeExecute
 }

package/src/index.ts

@@ -1,9 +1,9 @@
+export * from './async-batcher'
 export * from './async-debouncer'
 export * from './async-queuer'
 export * from './async-rate-limiter'
 export * from './async-throttler'
 export * from './batcher'
-export * from './compare'
 export * from './debouncer'
 export * from './queuer'
 export * from './rate-limiter'