@tanstack/solid-pacer 0.2.0 → 0.4.0

package/src/async-throttler/createAsyncThrottler.ts

@@ -5,18 +5,24 @@ import type { Accessor } from 'solid-js'
 import type { AnyAsyncFunction } from '@tanstack/pacer/types'
 import type { AsyncThrottlerOptions } from '@tanstack/pacer/async-throttler'
 
-export interface SolidAsyncThrottler<
-  TFn extends AnyAsyncFunction,
-  TArgs extends Parameters<TFn>,
-> extends Omit<
-    AsyncThrottler<TFn, TArgs>,
-    | 'getExecutionCount'
+export interface SolidAsyncThrottler<TFn extends AnyAsyncFunction>
+  extends Omit<
+    AsyncThrottler<TFn>,
+    | 'getSuccessCount'
+    | 'getSettleCount'
+    | 'getErrorCount'
     | 'getIsPending'
+    | 'getIsExecuting'
+    | 'getLastResult'
     | 'getLastExecutionTime'
     | 'getNextExecutionTime'
   > {
-  executionCount: Accessor<number>
+  successCount: Accessor<number>
+  settleCount: Accessor<number>
+  errorCount: Accessor<number>
   isPending: Accessor<boolean>
+  isExecuting: Accessor<boolean>
+  lastResult: Accessor<ReturnType<TFn> | undefined>
   lastExecutionTime: Accessor<number>
   nextExecutionTime: Accessor<number>
 }
@@ -58,19 +64,30 @@ export interface SolidAsyncThrottler<
  * ```
  */
 
-export function createAsyncThrottler<
-  TFn extends AnyAsyncFunction,
-  TArgs extends Parameters<TFn>,
->(
+export function createAsyncThrottler<TFn extends AnyAsyncFunction>(
   fn: TFn,
-  initialOptions: AsyncThrottlerOptions<TFn, TArgs>,
-): SolidAsyncThrottler<TFn, TArgs> {
-  const asyncThrottler = new AsyncThrottler<TFn, TArgs>(fn, initialOptions)
+  initialOptions: AsyncThrottlerOptions<TFn>,
+): SolidAsyncThrottler<TFn> {
+  const asyncThrottler = bindInstanceMethods(
+    new AsyncThrottler<TFn>(fn, initialOptions),
+  )
 
-  const [executionCount, setExecutionCount] = createSignal(
-    asyncThrottler.getExecutionCount(),
+  const [successCount, setSuccessCount] = createSignal(
+    asyncThrottler.getSuccessCount(),
+  )
+  const [settleCount, setSettleCount] = createSignal(
+    asyncThrottler.getSettleCount(),
+  )
+  const [errorCount, setErrorCount] = createSignal(
+    asyncThrottler.getErrorCount(),
   )
   const [isPending, setIsPending] = createSignal(asyncThrottler.getIsPending())
+  const [isExecuting, setIsExecuting] = createSignal(
+    asyncThrottler.getIsExecuting(),
+  )
+  const [lastResult, setLastResult] = createSignal(
+    asyncThrottler.getLastResult(),
+  )
   const [lastExecutionTime, setLastExecutionTime] = createSignal(
     asyncThrottler.getLastExecutionTime(),
   )
@@ -78,17 +95,21 @@ export function createAsyncThrottler<
     asyncThrottler.getNextExecutionTime(),
   )
 
-  function setOptions(newOptions: Partial<AsyncThrottlerOptions<TFn, TArgs>>) {
+  function setOptions(newOptions: Partial<AsyncThrottlerOptions<TFn>>) {
     asyncThrottler.setOptions({
       ...newOptions,
-      onExecute: (throttler) => {
-        setExecutionCount(throttler.getExecutionCount())
+      onSettled: (throttler) => {
+        setSuccessCount(throttler.getSuccessCount())
+        setSettleCount(throttler.getSettleCount())
+        setErrorCount(throttler.getErrorCount())
         setIsPending(throttler.getIsPending())
+        setIsExecuting(throttler.getIsExecuting())
         setLastExecutionTime(throttler.getLastExecutionTime())
         setNextExecutionTime(throttler.getNextExecutionTime())
+        setLastResult(throttler.getLastResult())
 
-        const onExecute = newOptions.onExecute ?? initialOptions.onExecute
-        onExecute?.(throttler)
+        const onSettled = newOptions.onSettled ?? initialOptions.onSettled
+        onSettled?.(throttler)
       },
     })
   }
@@ -96,11 +117,15 @@ export function createAsyncThrottler<
   setOptions(initialOptions)
 
   return {
-    ...bindInstanceMethods(asyncThrottler),
-    executionCount,
+    ...asyncThrottler,
+    errorCount,
+    isExecuting,
     isPending,
     lastExecutionTime,
+    lastResult,
     nextExecutionTime,
     setOptions,
-  }
+    settleCount,
+    successCount,
+  } as SolidAsyncThrottler<TFn>
 }

package/src/debouncer/createDebouncedSignal.ts

@@ -45,12 +45,8 @@ import type { DebouncerOptions } from '@tanstack/pacer/debouncer'
  */
 export function createDebouncedSignal<TValue>(
   value: TValue,
-  initialOptions: DebouncerOptions<Setter<TValue>, [Accessor<TValue>]>,
-): [
-  Accessor<TValue>,
-  Setter<TValue>,
-  SolidDebouncer<Setter<TValue>, [Accessor<TValue>]>,
-] {
+  initialOptions: DebouncerOptions<Setter<TValue>>,
+): [Accessor<TValue>, Setter<TValue>, SolidDebouncer<Setter<TValue>>] {
   const [debouncedValue, setDebouncedValue] = createSignal<TValue>(value)
 
   const debouncer = createDebouncer(setDebouncedValue, initialOptions)

package/src/debouncer/createDebouncedValue.ts

@@ -1,4 +1,4 @@
-import { createEffect, onCleanup } from 'solid-js'
+import { createEffect } from 'solid-js'
 import { createDebouncedSignal } from './createDebouncedSignal'
 import type { SolidDebouncer } from './createDebouncer'
 import type { Accessor, Setter } from 'solid-js'
@@ -18,8 +18,8 @@ import type { DebouncerOptions } from '@tanstack/pacer/debouncer'
  * or calculations occur.
  *
  * The hook returns a tuple containing:
- * - The current debounced value (as an Accessor)
- * - The debouncer instance with control methods and state signals
+ * - An Accessor that provides the current debounced value
+ * - The debouncer instance with control methods
  *
  * @example
  * ```tsx
@@ -34,20 +34,14 @@ import type { DebouncerOptions } from '@tanstack/pacer/debouncer'
  *   fetchSearchResults(debouncedQuery());
  * });
  *
- * // Access debouncer state via signals
- * console.log('Executions:', debouncer.executionCount());
- * console.log('Is pending:', debouncer.isPending());
- *
- * // Handle input changes
- * const handleChange = (e) => {
- *   setSearchQuery(e.target.value);
- * };
+ * // Control the debouncer
+ * debouncer.cancel(); // Cancel any pending updates
  * ```
  */
 export function createDebouncedValue<TValue>(
   value: Accessor<TValue>,
-  initialOptions: DebouncerOptions<Setter<TValue>, [Accessor<TValue>]>,
-): [Accessor<TValue>, SolidDebouncer<Setter<TValue>, [Accessor<TValue>]>] {
+  initialOptions: DebouncerOptions<Setter<TValue>>,
+): [Accessor<TValue>, SolidDebouncer<Setter<TValue>>] {
   const [debouncedValue, setDebouncedValue, debouncer] = createDebouncedSignal(
     value(),
     initialOptions,
@@ -55,9 +49,6 @@ export function createDebouncedValue<TValue>(
 
   createEffect(() => {
     setDebouncedValue(value() as any)
-    onCleanup(() => {
-      debouncer.cancel()
-    })
   })
 
   return [debouncedValue, debouncer]

package/src/debouncer/createDebouncer.ts

@@ -1,5 +1,5 @@
 import { Debouncer } from '@tanstack/pacer/debouncer'
-import { createSignal } from 'solid-js'
+import { createEffect, createSignal, onCleanup } from 'solid-js'
 import { bindInstanceMethods } from '@tanstack/pacer/utils'
 import type { Accessor } from 'solid-js'
 import type { AnyFunction } from '@tanstack/pacer/types'
@@ -8,10 +8,8 @@ import type { DebouncerOptions } from '@tanstack/pacer/debouncer'
 /**
  * An extension of the Debouncer class that adds Solid signals to access the internal state of the debouncer
  */
-export interface SolidDebouncer<
-  TFn extends AnyFunction,
-  TArgs extends Parameters<TFn>,
-> extends Omit<Debouncer<TFn, TArgs>, 'getExecutionCount' | 'getIsPending'> {
+export interface SolidDebouncer<TFn extends AnyFunction>
+  extends Omit<Debouncer<TFn>, 'getExecutionCount' | 'getIsPending'> {
   executionCount: Accessor<number>
   isPending: Accessor<boolean>
 }
@@ -52,21 +50,18 @@ export interface SolidDebouncer<
  * debouncer.setOptions({ wait: 1000 });
  * ```
  */
-export function createDebouncer<
-  TFn extends AnyFunction,
-  TArgs extends Parameters<TFn>,
->(
+export function createDebouncer<TFn extends AnyFunction>(
   fn: TFn,
-  initialOptions: DebouncerOptions<TFn, TArgs>,
-): SolidDebouncer<TFn, TArgs> {
-  const debouncer = new Debouncer<TFn, TArgs>(fn, initialOptions)
+  initialOptions: DebouncerOptions<TFn>,
+): SolidDebouncer<TFn> {
+  const debouncer = bindInstanceMethods(new Debouncer<TFn>(fn, initialOptions))
 
   const [executionCount, setExecutionCount] = createSignal(
     debouncer.getExecutionCount(),
   )
   const [isPending, setIsPending] = createSignal(debouncer.getIsPending())
 
-  function setOptions(newOptions: Partial<DebouncerOptions<TFn, TArgs>>) {
+  function setOptions(newOptions: Partial<DebouncerOptions<TFn>>) {
     debouncer.setOptions({
       ...newOptions,
       onExecute: (debouncer) => {
@@ -81,10 +76,16 @@ export function createDebouncer<
 
   setOptions(initialOptions)
 
+  createEffect(() => {
+    onCleanup(() => {
+      debouncer.cancel()
+    })
+  })
+
   return {
-    ...bindInstanceMethods(debouncer),
+    ...debouncer,
     executionCount,
     isPending,
     setOptions,
-  }
+  } as SolidDebouncer<TFn>
 }

package/src/queuer/createQueuer.ts

@@ -44,6 +44,10 @@ export interface SolidQueuer<TValue>
    * Signal version of `getPeek`
    */
   peek: Accessor<TValue | undefined>
+  /**
+   * Signal version of `getRejectionCount`
+   */
+  rejectionCount: Accessor<number>
   /**
    * Signal version of `getSize`
    */
@@ -98,7 +102,7 @@ export interface SolidQueuer<TValue>
 export function createQueuer<TValue>(
   initialOptions: QueuerOptions<TValue> = {},
 ): SolidQueuer<TValue> {
-  const queuer = new Queuer<TValue>(initialOptions)
+  const queuer = bindInstanceMethods(new Queuer<TValue>(initialOptions))
 
   const [allItems, setAllItems] = createSignal<Array<TValue>>(
     queuer.getAllItems(),
@@ -152,7 +156,7 @@ export function createQueuer<TValue>(
   setOptions(initialOptions)
 
   return {
-    ...bindInstanceMethods(queuer),
+    ...queuer,
     allItems,
     executionCount,
     isEmpty,
@@ -163,5 +167,5 @@ export function createQueuer<TValue>(
     rejectionCount,
     size,
     setOptions,
-  }
+  } as SolidQueuer<TValue>
 }

package/src/rate-limiter/createRateLimitedSignal.ts

@@ -12,6 +12,12 @@ import type { RateLimiterOptions } from '@tanstack/pacer/rate-limiter'
  * subsequent updates until the window resets. Unlike throttling or debouncing, it does not attempt to space out
  * or intelligently collapse updates. This can lead to bursts of rapid updates followed by periods of no updates.
  *
+ * The rate limiter supports two types of windows:
+ * - 'fixed': A strict window that resets after the window period. All updates within the window count
+ *   towards the limit, and the window resets completely after the period.
+ * - 'sliding': A rolling window that allows updates as old ones expire. This provides a more
+ *   consistent rate of updates over time.
+ *
  * For smoother update patterns, consider:
  * - createThrottledSignal: When you want consistent spacing between updates (e.g. UI changes)
  * - createDebouncedSignal: When you want to collapse rapid updates into a single update (e.g. search input)
@@ -28,16 +34,18 @@ import type { RateLimiterOptions } from '@tanstack/pacer/rate-limiter'
  *
  * @example
  * ```tsx
- * // Basic rate limiting - update state at most 5 times per minute
+ * // Basic rate limiting - update state at most 5 times per minute with a sliding window
  * const [value, setValue, rateLimiter] = createRateLimitedSignal(0, {
  *   limit: 5,
- *   window: 60000
+ *   window: 60000,
+ *   windowType: 'sliding'
  * });
  *
- * // With rejection callback
+ * // With rejection callback and fixed window
  * const [value, setValue] = createRateLimitedSignal(0, {
  *   limit: 3,
  *   window: 5000,
+ *   windowType: 'fixed',
  *   onReject: (rateLimiter) => {
  *     alert(`Rate limit reached. Try again in ${rateLimiter.getMsUntilNextWindow()}ms`);
  *   }
@@ -56,12 +64,8 @@ import type { RateLimiterOptions } from '@tanstack/pacer/rate-limiter'
  */
 export function createRateLimitedSignal<TValue>(
   value: TValue,
-  initialOptions: RateLimiterOptions<Setter<TValue>, [Accessor<TValue>]>,
-): [
-  Accessor<TValue>,
-  Setter<TValue>,
-  SolidRateLimiter<Setter<TValue>, [Accessor<TValue>]>,
-] {
+  initialOptions: RateLimiterOptions<Setter<TValue>>,
+): [Accessor<TValue>, Setter<TValue>, SolidRateLimiter<Setter<TValue>>] {
   const [rateLimitedValue, setRateLimitedValue] = createSignal<TValue>(value)
 
   const rateLimiter = createRateLimiter(setRateLimitedValue, initialOptions)

package/src/rate-limiter/createRateLimitedValue.ts

@@ -12,49 +12,45 @@ import type { RateLimiterOptions } from '@tanstack/pacer/rate-limiter'
  * subsequent updates until the window resets. Unlike throttling or debouncing, it does not attempt to space out
  * or intelligently collapse updates. This can lead to bursts of rapid updates followed by periods of no updates.
  *
+ * The rate limiter supports two types of windows:
+ * - 'fixed': A strict window that resets after the window period. All updates within the window count
+ *   towards the limit, and the window resets completely after the period.
+ * - 'sliding': A rolling window that allows updates as old ones expire. This provides a more
+ *   consistent rate of updates over time.
+ *
  * For smoother update patterns, consider:
  * - createThrottledValue: When you want consistent spacing between updates (e.g. UI changes)
  * - createDebouncedValue: When you want to collapse rapid updates into a single update (e.g. search input)
  *
  * Rate limiting should primarily be used when you need to enforce strict limits, like API rate limits.
  *
- * The hook returns both the rate-limited value and the underlying rateLimiter instance for additional control.
+ * The hook returns a tuple containing:
+ * - An accessor function that provides the rate-limited value
+ * - The rate limiter instance with control methods
  *
  * For more direct control over rate limiting behavior without Solid state management,
  * consider using the lower-level createRateLimiter hook instead.
  *
  * @example
  * ```tsx
- * // Basic rate limiting - update at most 5 times per minute
- * const [rateLimitedValue] = createRateLimitedValue(rawValue, {
+ * // Basic rate limiting - update at most 5 times per minute with a sliding window
+ * const [rateLimitedValue, rateLimiter] = createRateLimitedValue(rawValue, {
  *   limit: 5,
- *   window: 60000
+ *   window: 60000,
+ *   windowType: 'sliding'
  * });
  *
- * // With rejection callback
- * const [rateLimitedValue, rateLimiter] = createRateLimitedValue(rawValue, {
- *   limit: 3,
- *   window: 5000,
- *   onReject: (rateLimiter) => {
- *     console.log(`Update rejected. Try again in ${rateLimiter.getMsUntilNextWindow()}ms`);
- *   }
- * });
+ * // Use the rate-limited value
+ * console.log(rateLimitedValue()); // Access the current rate-limited value
  *
- * // Optionally access rateLimiter state via signals
- * const handleSubmit = () => {
- *   const remaining = rateLimiter.remainingInWindow();
- *   if (remaining > 0) {
- *     console.log(`${remaining} updates remaining in this window`);
- *   } else {
- *     console.log('Rate limit reached for this window');
- *   }
- * };
+ * // Control the rate limiter
+ * rateLimiter.reset(); // Reset the rate limit window
  * ```
  */
 export function createRateLimitedValue<TValue>(
   value: Accessor<TValue>,
-  initialOptions: RateLimiterOptions<Setter<TValue>, [Accessor<TValue>]>,
-): [Accessor<TValue>, SolidRateLimiter<Setter<TValue>, [Accessor<TValue>]>] {
+  initialOptions: RateLimiterOptions<Setter<TValue>>,
+): [Accessor<TValue>, SolidRateLimiter<Setter<TValue>>] {
   const [rateLimitedValue, setRateLimitedValue, rateLimiter] =
     createRateLimitedSignal(value(), initialOptions)
 

package/src/rate-limiter/createRateLimiter.ts

@@ -5,11 +5,9 @@ import type { Accessor } from 'solid-js'
 import type { AnyFunction } from '@tanstack/pacer/types'
 import type { RateLimiterOptions } from '@tanstack/pacer/rate-limiter'
 
-export interface SolidRateLimiter<
-  TFn extends AnyFunction,
-  TArgs extends Parameters<TFn>,
-> extends Omit<
-    RateLimiter<TFn, TArgs>,
+export interface SolidRateLimiter<TFn extends AnyFunction>
+  extends Omit<
+    RateLimiter<TFn>,
     | 'getExecutionCount'
     | 'getMsUntilNextWindow'
     | 'getRejectionCount'
@@ -31,6 +29,12 @@ export interface SolidRateLimiter<
  * a time window, then blocks all subsequent calls until the window resets. Unlike throttling or debouncing,
  * it does not attempt to space out or collapse executions intelligently.
  *
+ * The rate limiter supports two types of windows:
+ * - 'fixed': A strict window that resets after the window period. All executions within the window count
+ *   towards the limit, and the window resets completely after the period.
+ * - 'sliding': A rolling window that allows executions as old ones expire. This provides a more
+ *   consistent rate of execution over time.
+ *
  * For smoother execution patterns:
  * - Use throttling when you want consistent spacing between executions (e.g. UI updates)
  * - Use debouncing when you want to collapse rapid-fire events (e.g. search input)
@@ -38,10 +42,11 @@ export interface SolidRateLimiter<
  *
  * @example
  * ```tsx
- * // Basic rate limiting - max 5 calls per minute
+ * // Basic rate limiting - max 5 calls per minute with a sliding window
  * const rateLimiter = createRateLimiter(apiCall, {
  *   limit: 5,
  *   window: 60000,
+ *   windowType: 'sliding'
  * });
  *
  * // Monitor rate limit status
@@ -60,14 +65,13 @@ export interface SolidRateLimiter<
  * console.log('Next window in:', rateLimiter.msUntilNextWindow());
  * ```
  */
-export function createRateLimiter<
-  TFn extends AnyFunction,
-  TArgs extends Parameters<TFn>,
->(
+export function createRateLimiter<TFn extends AnyFunction>(
   fn: TFn,
-  initialOptions: RateLimiterOptions<TFn, TArgs>,
-): SolidRateLimiter<TFn, TArgs> {
-  const rateLimiter = new RateLimiter<TFn, TArgs>(fn, initialOptions)
+  initialOptions: RateLimiterOptions<TFn>,
+): SolidRateLimiter<TFn> {
+  const rateLimiter = bindInstanceMethods(
+    new RateLimiter<TFn>(fn, initialOptions),
+  )
 
   const [executionCount, setExecutionCount] = createSignal(
     rateLimiter.getExecutionCount(),
@@ -82,13 +86,14 @@ export function createRateLimiter<
     rateLimiter.getMsUntilNextWindow(),
   )
 
-  function setOptions(newOptions: Partial<RateLimiterOptions<TFn, TArgs>>) {
+  function setOptions(newOptions: Partial<RateLimiterOptions<TFn>>) {
     rateLimiter.setOptions({
       ...newOptions,
       onExecute: (rateLimiter) => {
         setExecutionCount(rateLimiter.getExecutionCount())
         setRemainingInWindow(rateLimiter.getRemainingInWindow())
         setMsUntilNextWindow(rateLimiter.getMsUntilNextWindow())
+
         const onExecute = newOptions.onExecute ?? initialOptions.onExecute
         onExecute?.(rateLimiter)
       },
@@ -96,6 +101,7 @@ export function createRateLimiter<
         setRejectionCount(rateLimiter.getRejectionCount())
         setRemainingInWindow(rateLimiter.getRemainingInWindow())
         setMsUntilNextWindow(rateLimiter.getMsUntilNextWindow())
+
         const onReject = newOptions.onReject ?? initialOptions.onReject
         onReject?.(rateLimiter)
       },
@@ -105,11 +111,11 @@ export function createRateLimiter<
   setOptions(initialOptions)
 
   return {
-    ...bindInstanceMethods(rateLimiter),
+    ...rateLimiter,
     executionCount,
     rejectionCount,
     remainingInWindow,
     msUntilNextWindow,
     setOptions,
-  }
+  } as SolidRateLimiter<TFn>
 }

package/src/throttler/createThrottledSignal.ts

@@ -40,12 +40,8 @@ import type { ThrottlerOptions } from '@tanstack/pacer/throttler'
  */
 export function createThrottledSignal<TValue>(
   value: TValue,
-  initialOptions: ThrottlerOptions<Setter<TValue>, [Accessor<TValue>]>,
-): [
-  Accessor<TValue>,
-  Setter<TValue>,
-  SolidThrottler<Setter<TValue>, [Accessor<TValue>]>,
-] {
+  initialOptions: ThrottlerOptions<Setter<TValue>>,
+): [Accessor<TValue>, Setter<TValue>, SolidThrottler<Setter<TValue>>] {
   const [throttledValue, setThrottledValue] = createSignal<TValue>(value)
   const throttler = createThrottler(setThrottledValue, initialOptions)
   return [throttledValue, throttler.maybeExecute as Setter<TValue>, throttler]

package/src/throttler/createThrottledValue.ts

@@ -1,4 +1,4 @@
-import { createEffect, onCleanup } from 'solid-js'
+import { createEffect } from 'solid-js'
 import { createThrottledSignal } from './createThrottledSignal'
 import type { SolidThrottler } from './createThrottler'
 import type { Accessor, Setter } from 'solid-js'
@@ -11,7 +11,10 @@ import type { ThrottlerOptions } from '@tanstack/pacer/throttler'
  * Throttling ensures the value updates occur at a controlled rate regardless of how frequently the input value changes.
  * This is useful for rate-limiting expensive re-renders or API calls that depend on rapidly changing values.
  *
- * The hook returns both the throttled value and the underlying throttler instance for additional control.
+ * The hook returns a tuple containing:
+ * - An accessor function that provides the throttled value
+ * - The throttler instance with control methods
+ *
  * The throttled value will update according to the leading/trailing edge behavior specified in the options.
  *
  * For more direct control over throttling behavior without Solid state management,
@@ -20,26 +23,19 @@ import type { ThrottlerOptions } from '@tanstack/pacer/throttler'
  * @example
  * ```tsx
  * // Basic throttling - update at most once per second
- * const [throttledValue] = createThrottledValue(rawValue, { wait: 1000 });
+ * const [throttledValue, throttler] = createThrottledValue(rawValue, { wait: 1000 });
  *
- * // With custom leading/trailing behavior
- * const [throttledValue, throttler] = createThrottledValue(rawValue, {
- *   wait: 1000,
- *   leading: true,   // Update immediately on first change
- *   trailing: false  // Skip trailing edge updates
- * });
+ * // Use the throttled value
+ * console.log(throttledValue()); // Access the current throttled value
  *
- * // Access throttler state via signals
- * console.log('Executions:', throttler.executionCount());
- * console.log('Is pending:', throttler.isPending());
- * console.log('Last execution:', throttler.lastExecutionTime());
- * console.log('Next execution:', throttler.nextExecutionTime());
+ * // Control the throttler
+ * throttler.cancel(); // Cancel any pending updates
  * ```
  */
 export function createThrottledValue<TValue>(
   value: Accessor<TValue>,
-  initialOptions: ThrottlerOptions<Setter<TValue>, [Accessor<TValue>]>,
-): [Accessor<TValue>, SolidThrottler<Setter<TValue>, [Accessor<TValue>]>] {
+  initialOptions: ThrottlerOptions<Setter<TValue>>,
+): [Accessor<TValue>, SolidThrottler<Setter<TValue>>] {
   const [throttledValue, setThrottledValue, throttler] = createThrottledSignal(
     value(),
     initialOptions,
@@ -47,9 +43,6 @@ export function createThrottledValue<TValue>(
 
   createEffect(() => {
     setThrottledValue(value() as any)
-    onCleanup(() => {
-      throttler.cancel()
-    })
   })
 
   return [throttledValue, throttler]

package/src/throttler/createThrottler.ts

@@ -1,5 +1,5 @@
 import { Throttler } from '@tanstack/pacer/throttler'
-import { createSignal } from 'solid-js'
+import { createEffect, createSignal, onCleanup } from 'solid-js'
 import { bindInstanceMethods } from '@tanstack/pacer/utils'
 import type { Accessor } from 'solid-js'
 import type { AnyFunction } from '@tanstack/pacer/types'
@@ -8,11 +8,9 @@ import type { ThrottlerOptions } from '@tanstack/pacer/throttler'
 /**
  * An extension of the Throttler class that adds Solid signals to access the internal state of the throttler
  */
-export interface SolidThrottler<
-  TFn extends AnyFunction,
-  TArgs extends Parameters<TFn>,
-> extends Omit<
-    Throttler<TFn, TArgs>,
+export interface SolidThrottler<TFn extends AnyFunction>
+  extends Omit<
+    Throttler<TFn>,
     | 'getExecutionCount'
     | 'getIsPending'
     | 'getLastExecutionTime'
@@ -58,14 +56,11 @@ export interface SolidThrottler<
  * console.log(throttler.nextExecutionTime()); // timestamp of next allowed execution
  * ```
  */
-export function createThrottler<
-  TFn extends AnyFunction,
-  TArgs extends Parameters<TFn>,
->(
+export function createThrottler<TFn extends AnyFunction>(
   fn: TFn,
-  initialOptions: ThrottlerOptions<TFn, TArgs>,
-): SolidThrottler<TFn, TArgs> {
-  const throttler = new Throttler<TFn, TArgs>(fn, initialOptions)
+  initialOptions: ThrottlerOptions<TFn>,
+): SolidThrottler<TFn> {
+  const throttler = bindInstanceMethods(new Throttler<TFn>(fn, initialOptions))
 
   const [executionCount, setExecutionCount] = createSignal(
     throttler.getExecutionCount(),
@@ -78,7 +73,7 @@ export function createThrottler<
     throttler.getNextExecutionTime(),
   )
 
-  function setOptions(newOptions: Partial<ThrottlerOptions<TFn, TArgs>>) {
+  function setOptions(newOptions: Partial<ThrottlerOptions<TFn>>) {
     throttler.setOptions({
       ...newOptions,
       onExecute: (throttler) => {
@@ -95,12 +90,18 @@ export function createThrottler<
 
   setOptions(initialOptions)
 
+  createEffect(() => {
+    onCleanup(() => {
+      throttler.cancel()
+    })
+  })
+
   return {
-    ...bindInstanceMethods(throttler),
+    ...throttler,
     executionCount,
     isPending,
     lastExecutionTime,
     nextExecutionTime,
     setOptions,
-  }
+  } as SolidThrottler<TFn>
 }