@tanstack/preact-pacer 0.23.0 → 0.24.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (242) hide show
  1. package/dist/async-batcher/useAsyncBatchedCallback.d.ts +2 -4
  2. package/dist/async-batcher/useAsyncBatchedCallback.js +1 -2
  3. package/dist/async-batcher/useAsyncBatcher.d.ts +4 -7
  4. package/dist/async-batcher/useAsyncBatcher.js +1 -3
  5. package/dist/async-debouncer/useAsyncDebouncedCallback.d.ts +2 -4
  6. package/dist/async-debouncer/useAsyncDebouncedCallback.js +1 -2
  7. package/dist/async-debouncer/useAsyncDebouncer.d.ts +4 -6
  8. package/dist/async-debouncer/useAsyncDebouncer.js +1 -2
  9. package/dist/async-queuer/useAsyncQueuedState.d.ts +4 -6
  10. package/dist/async-queuer/useAsyncQueuedState.js +3 -4
  11. package/dist/async-queuer/useAsyncQueuer.d.ts +6 -8
  12. package/dist/async-queuer/useAsyncQueuer.js +3 -4
  13. package/dist/async-rate-limiter/useAsyncRateLimitedCallback.d.ts +2 -4
  14. package/dist/async-rate-limiter/useAsyncRateLimitedCallback.js +1 -2
  15. package/dist/async-rate-limiter/useAsyncRateLimiter.d.ts +4 -6
  16. package/dist/async-rate-limiter/useAsyncRateLimiter.js +1 -2
  17. package/dist/async-throttler/useAsyncThrottledCallback.d.ts +2 -4
  18. package/dist/async-throttler/useAsyncThrottledCallback.js +1 -2
  19. package/dist/async-throttler/useAsyncThrottler.d.ts +4 -6
  20. package/dist/async-throttler/useAsyncThrottler.js +1 -2
  21. package/dist/batcher/useBatchedCallback.d.ts +2 -4
  22. package/dist/batcher/useBatchedCallback.js +1 -2
  23. package/dist/batcher/useBatcher.d.ts +6 -10
  24. package/dist/batcher/useBatcher.js +3 -6
  25. package/dist/debouncer/useDebouncedCallback.d.ts +2 -4
  26. package/dist/debouncer/useDebouncedCallback.js +1 -2
  27. package/dist/debouncer/useDebouncedState.d.ts +2 -4
  28. package/dist/debouncer/useDebouncedState.js +1 -2
  29. package/dist/debouncer/useDebouncedValue.d.ts +2 -4
  30. package/dist/debouncer/useDebouncedValue.js +1 -2
  31. package/dist/debouncer/useDebouncer.d.ts +4 -6
  32. package/dist/debouncer/useDebouncer.js +1 -2
  33. package/dist/provider/PacerProvider.d.ts +6 -8
  34. package/dist/provider/PacerProvider.js +1 -2
  35. package/dist/queuer/useQueuedState.d.ts +2 -4
  36. package/dist/queuer/useQueuedState.js +1 -2
  37. package/dist/queuer/useQueuedValue.d.ts +2 -4
  38. package/dist/queuer/useQueuedValue.js +1 -2
  39. package/dist/queuer/useQueuer.d.ts +4 -6
  40. package/dist/queuer/useQueuer.js +1 -2
  41. package/dist/rate-limiter/useRateLimitedCallback.d.ts +2 -4
  42. package/dist/rate-limiter/useRateLimitedCallback.js +1 -2
  43. package/dist/rate-limiter/useRateLimitedState.d.ts +2 -4
  44. package/dist/rate-limiter/useRateLimitedState.js +1 -2
  45. package/dist/rate-limiter/useRateLimitedValue.d.ts +2 -4
  46. package/dist/rate-limiter/useRateLimitedValue.js +1 -2
  47. package/dist/rate-limiter/useRateLimiter.d.ts +4 -6
  48. package/dist/rate-limiter/useRateLimiter.js +1 -2
  49. package/dist/throttler/useThrottledCallback.d.ts +2 -4
  50. package/dist/throttler/useThrottledCallback.js +1 -2
  51. package/dist/throttler/useThrottledState.d.ts +2 -4
  52. package/dist/throttler/useThrottledState.js +1 -2
  53. package/dist/throttler/useThrottledValue.d.ts +2 -4
  54. package/dist/throttler/useThrottledValue.js +1 -2
  55. package/dist/throttler/useThrottler.d.ts +4 -6
  56. package/dist/throttler/useThrottler.js +1 -2
  57. package/package.json +22 -70
  58. package/dist/async-batcher/index.cjs +0 -13
  59. package/dist/async-batcher/index.d.cts +0 -4
  60. package/dist/async-batcher/useAsyncBatchedCallback.cjs +0 -51
  61. package/dist/async-batcher/useAsyncBatchedCallback.cjs.map +0 -1
  62. package/dist/async-batcher/useAsyncBatchedCallback.d.cts +0 -43
  63. package/dist/async-batcher/useAsyncBatchedCallback.js.map +0 -1
  64. package/dist/async-batcher/useAsyncBatcher.cjs +0 -217
  65. package/dist/async-batcher/useAsyncBatcher.cjs.map +0 -1
  66. package/dist/async-batcher/useAsyncBatcher.d.cts +0 -223
  67. package/dist/async-batcher/useAsyncBatcher.js.map +0 -1
  68. package/dist/async-debouncer/index.cjs +0 -13
  69. package/dist/async-debouncer/index.d.cts +0 -4
  70. package/dist/async-debouncer/useAsyncDebouncedCallback.cjs +0 -52
  71. package/dist/async-debouncer/useAsyncDebouncedCallback.cjs.map +0 -1
  72. package/dist/async-debouncer/useAsyncDebouncedCallback.d.cts +0 -47
  73. package/dist/async-debouncer/useAsyncDebouncedCallback.js.map +0 -1
  74. package/dist/async-debouncer/useAsyncDebouncer.cjs +0 -195
  75. package/dist/async-debouncer/useAsyncDebouncer.cjs.map +0 -1
  76. package/dist/async-debouncer/useAsyncDebouncer.d.cts +0 -202
  77. package/dist/async-debouncer/useAsyncDebouncer.js.map +0 -1
  78. package/dist/async-queuer/index.cjs +0 -13
  79. package/dist/async-queuer/index.d.cts +0 -4
  80. package/dist/async-queuer/useAsyncQueuedState.cjs +0 -154
  81. package/dist/async-queuer/useAsyncQueuedState.cjs.map +0 -1
  82. package/dist/async-queuer/useAsyncQueuedState.d.cts +0 -150
  83. package/dist/async-queuer/useAsyncQueuedState.js.map +0 -1
  84. package/dist/async-queuer/useAsyncQueuer.cjs +0 -217
  85. package/dist/async-queuer/useAsyncQueuer.cjs.map +0 -1
  86. package/dist/async-queuer/useAsyncQueuer.d.cts +0 -223
  87. package/dist/async-queuer/useAsyncQueuer.js.map +0 -1
  88. package/dist/async-rate-limiter/index.cjs +0 -13
  89. package/dist/async-rate-limiter/index.d.cts +0 -4
  90. package/dist/async-rate-limiter/useAsyncRateLimitedCallback.cjs +0 -65
  91. package/dist/async-rate-limiter/useAsyncRateLimitedCallback.cjs.map +0 -1
  92. package/dist/async-rate-limiter/useAsyncRateLimitedCallback.d.cts +0 -60
  93. package/dist/async-rate-limiter/useAsyncRateLimitedCallback.js.map +0 -1
  94. package/dist/async-rate-limiter/useAsyncRateLimiter.cjs +0 -209
  95. package/dist/async-rate-limiter/useAsyncRateLimiter.cjs.map +0 -1
  96. package/dist/async-rate-limiter/useAsyncRateLimiter.d.cts +0 -219
  97. package/dist/async-rate-limiter/useAsyncRateLimiter.js.map +0 -1
  98. package/dist/async-retryer/index.cjs +0 -8
  99. package/dist/async-retryer/index.d.cts +0 -1
  100. package/dist/async-throttler/index.cjs +0 -13
  101. package/dist/async-throttler/index.d.cts +0 -4
  102. package/dist/async-throttler/useAsyncThrottledCallback.cjs +0 -49
  103. package/dist/async-throttler/useAsyncThrottledCallback.cjs.map +0 -1
  104. package/dist/async-throttler/useAsyncThrottledCallback.d.cts +0 -44
  105. package/dist/async-throttler/useAsyncThrottledCallback.js.map +0 -1
  106. package/dist/async-throttler/useAsyncThrottler.cjs +0 -206
  107. package/dist/async-throttler/useAsyncThrottler.cjs.map +0 -1
  108. package/dist/async-throttler/useAsyncThrottler.d.cts +0 -213
  109. package/dist/async-throttler/useAsyncThrottler.js.map +0 -1
  110. package/dist/batcher/index.cjs +0 -13
  111. package/dist/batcher/index.d.cts +0 -4
  112. package/dist/batcher/useBatchedCallback.cjs +0 -47
  113. package/dist/batcher/useBatchedCallback.cjs.map +0 -1
  114. package/dist/batcher/useBatchedCallback.d.cts +0 -41
  115. package/dist/batcher/useBatchedCallback.js.map +0 -1
  116. package/dist/batcher/useBatcher.cjs +0 -165
  117. package/dist/batcher/useBatcher.cjs.map +0 -1
  118. package/dist/batcher/useBatcher.d.cts +0 -174
  119. package/dist/batcher/useBatcher.js.map +0 -1
  120. package/dist/debouncer/index.cjs +0 -17
  121. package/dist/debouncer/index.d.cts +0 -6
  122. package/dist/debouncer/useDebouncedCallback.cjs +0 -48
  123. package/dist/debouncer/useDebouncedCallback.cjs.map +0 -1
  124. package/dist/debouncer/useDebouncedCallback.d.cts +0 -43
  125. package/dist/debouncer/useDebouncedCallback.js.map +0 -1
  126. package/dist/debouncer/useDebouncedState.cjs +0 -89
  127. package/dist/debouncer/useDebouncedState.cjs.map +0 -1
  128. package/dist/debouncer/useDebouncedState.d.cts +0 -80
  129. package/dist/debouncer/useDebouncedState.js.map +0 -1
  130. package/dist/debouncer/useDebouncedValue.cjs +0 -96
  131. package/dist/debouncer/useDebouncedValue.cjs.map +0 -1
  132. package/dist/debouncer/useDebouncedValue.d.cts +0 -89
  133. package/dist/debouncer/useDebouncedValue.js.map +0 -1
  134. package/dist/debouncer/useDebouncer.cjs +0 -141
  135. package/dist/debouncer/useDebouncer.cjs.map +0 -1
  136. package/dist/debouncer/useDebouncer.d.cts +0 -151
  137. package/dist/debouncer/useDebouncer.js.map +0 -1
  138. package/dist/index.cjs +0 -67
  139. package/dist/index.d.cts +0 -30
  140. package/dist/provider/PacerProvider.cjs +0 -26
  141. package/dist/provider/PacerProvider.cjs.map +0 -1
  142. package/dist/provider/PacerProvider.d.cts +0 -28
  143. package/dist/provider/PacerProvider.js.map +0 -1
  144. package/dist/provider/index.cjs +0 -6
  145. package/dist/provider/index.d.cts +0 -2
  146. package/dist/queuer/index.cjs +0 -15
  147. package/dist/queuer/index.d.cts +0 -5
  148. package/dist/queuer/useQueuedState.cjs +0 -129
  149. package/dist/queuer/useQueuedState.cjs.map +0 -1
  150. package/dist/queuer/useQueuedState.d.cts +0 -121
  151. package/dist/queuer/useQueuedState.js.map +0 -1
  152. package/dist/queuer/useQueuedValue.cjs +0 -115
  153. package/dist/queuer/useQueuedValue.cjs.map +0 -1
  154. package/dist/queuer/useQueuedValue.d.cts +0 -104
  155. package/dist/queuer/useQueuedValue.js.map +0 -1
  156. package/dist/queuer/useQueuer.cjs +0 -176
  157. package/dist/queuer/useQueuer.cjs.map +0 -1
  158. package/dist/queuer/useQueuer.d.cts +0 -185
  159. package/dist/queuer/useQueuer.js.map +0 -1
  160. package/dist/rate-limiter/index.cjs +0 -17
  161. package/dist/rate-limiter/index.d.cts +0 -6
  162. package/dist/rate-limiter/useRateLimitedCallback.cjs +0 -65
  163. package/dist/rate-limiter/useRateLimitedCallback.cjs.map +0 -1
  164. package/dist/rate-limiter/useRateLimitedCallback.d.cts +0 -60
  165. package/dist/rate-limiter/useRateLimitedCallback.js.map +0 -1
  166. package/dist/rate-limiter/useRateLimitedState.cjs +0 -115
  167. package/dist/rate-limiter/useRateLimitedState.cjs.map +0 -1
  168. package/dist/rate-limiter/useRateLimitedState.d.cts +0 -106
  169. package/dist/rate-limiter/useRateLimitedState.js.map +0 -1
  170. package/dist/rate-limiter/useRateLimitedValue.cjs +0 -102
  171. package/dist/rate-limiter/useRateLimitedValue.cjs.map +0 -1
  172. package/dist/rate-limiter/useRateLimitedValue.d.cts +0 -95
  173. package/dist/rate-limiter/useRateLimitedValue.js.map +0 -1
  174. package/dist/rate-limiter/useRateLimiter.cjs +0 -167
  175. package/dist/rate-limiter/useRateLimiter.cjs.map +0 -1
  176. package/dist/rate-limiter/useRateLimiter.d.cts +0 -178
  177. package/dist/rate-limiter/useRateLimiter.js.map +0 -1
  178. package/dist/throttler/index.cjs +0 -17
  179. package/dist/throttler/index.d.cts +0 -6
  180. package/dist/throttler/useThrottledCallback.cjs +0 -49
  181. package/dist/throttler/useThrottledCallback.cjs.map +0 -1
  182. package/dist/throttler/useThrottledCallback.d.cts +0 -44
  183. package/dist/throttler/useThrottledCallback.js.map +0 -1
  184. package/dist/throttler/useThrottledState.cjs +0 -100
  185. package/dist/throttler/useThrottledState.cjs.map +0 -1
  186. package/dist/throttler/useThrottledState.d.cts +0 -91
  187. package/dist/throttler/useThrottledState.js.map +0 -1
  188. package/dist/throttler/useThrottledValue.cjs +0 -91
  189. package/dist/throttler/useThrottledValue.cjs.map +0 -1
  190. package/dist/throttler/useThrottledValue.d.cts +0 -84
  191. package/dist/throttler/useThrottledValue.js.map +0 -1
  192. package/dist/throttler/useThrottler.cjs +0 -146
  193. package/dist/throttler/useThrottler.cjs.map +0 -1
  194. package/dist/throttler/useThrottler.d.cts +0 -156
  195. package/dist/throttler/useThrottler.js.map +0 -1
  196. package/dist/types/index.cjs +0 -8
  197. package/dist/types/index.d.cts +0 -1
  198. package/dist/utils/index.cjs +0 -8
  199. package/dist/utils/index.d.cts +0 -1
  200. package/src/async-batcher/index.ts +0 -4
  201. package/src/async-batcher/useAsyncBatchedCallback.ts +0 -53
  202. package/src/async-batcher/useAsyncBatcher.ts +0 -293
  203. package/src/async-debouncer/index.ts +0 -5
  204. package/src/async-debouncer/useAsyncDebouncedCallback.ts +0 -55
  205. package/src/async-debouncer/useAsyncDebouncer.ts +0 -274
  206. package/src/async-queuer/index.ts +0 -4
  207. package/src/async-queuer/useAsyncQueuedState.ts +0 -165
  208. package/src/async-queuer/useAsyncQueuer.ts +0 -293
  209. package/src/async-rate-limiter/index.ts +0 -5
  210. package/src/async-rate-limiter/useAsyncRateLimitedCallback.ts +0 -68
  211. package/src/async-rate-limiter/useAsyncRateLimiter.ts +0 -294
  212. package/src/async-retryer/index.ts +0 -2
  213. package/src/async-throttler/index.ts +0 -5
  214. package/src/async-throttler/useAsyncThrottledCallback.ts +0 -52
  215. package/src/async-throttler/useAsyncThrottler.ts +0 -285
  216. package/src/batcher/index.ts +0 -4
  217. package/src/batcher/useBatchedCallback.ts +0 -46
  218. package/src/batcher/useBatcher.ts +0 -241
  219. package/src/debouncer/index.ts +0 -7
  220. package/src/debouncer/useDebouncedCallback.ts +0 -51
  221. package/src/debouncer/useDebouncedState.ts +0 -106
  222. package/src/debouncer/useDebouncedValue.ts +0 -109
  223. package/src/debouncer/useDebouncer.ts +0 -219
  224. package/src/index.ts +0 -56
  225. package/src/provider/PacerProvider.tsx +0 -70
  226. package/src/provider/index.ts +0 -1
  227. package/src/queuer/index.ts +0 -5
  228. package/src/queuer/useQueuedState.ts +0 -133
  229. package/src/queuer/useQueuedValue.ts +0 -129
  230. package/src/queuer/useQueuer.ts +0 -251
  231. package/src/rate-limiter/index.ts +0 -6
  232. package/src/rate-limiter/useRateLimitedCallback.ts +0 -68
  233. package/src/rate-limiter/useRateLimitedState.ts +0 -124
  234. package/src/rate-limiter/useRateLimitedValue.ts +0 -110
  235. package/src/rate-limiter/useRateLimiter.ts +0 -244
  236. package/src/throttler/index.ts +0 -7
  237. package/src/throttler/useThrottledCallback.ts +0 -52
  238. package/src/throttler/useThrottledState.ts +0 -118
  239. package/src/throttler/useThrottledValue.ts +0 -104
  240. package/src/throttler/useThrottler.ts +0 -224
  241. package/src/types/index.ts +0 -1
  242. package/src/utils/index.ts +0 -1
@@ -1,293 +0,0 @@
1
- import { useEffect, useMemo, useState } from 'preact/hooks'
2
- import { AsyncQueuer } from '@tanstack/pacer/async-queuer'
3
- import { shallow, useSelector } from '@tanstack/preact-store'
4
- import { useDefaultPacerOptions } from '../provider/PacerProvider'
5
- import type { Store } from '@tanstack/preact-store'
6
- import type {
7
- AsyncQueuerOptions,
8
- AsyncQueuerState,
9
- } from '@tanstack/pacer/async-queuer'
10
- import type { ComponentChildren } from 'preact'
11
-
12
- export interface PreactAsyncQueuerOptions<
13
- TValue,
14
- TSelected = {},
15
- > extends AsyncQueuerOptions<TValue> {
16
- /**
17
- * Optional callback invoked when the component unmounts. Receives the queuer instance.
18
- * When provided, replaces the default cleanup (stop + abort); use it to call flush(), flushAsBatch(), stop(), add logging, etc.
19
- */
20
- onUnmount?: (queuer: PreactAsyncQueuer<TValue, TSelected>) => void
21
- }
22
-
23
- export interface PreactAsyncQueuer<TValue, TSelected = {}> extends Omit<
24
- AsyncQueuer<TValue>,
25
- 'store'
26
- > {
27
- /**
28
- * A Preact HOC (Higher Order Component) that allows you to subscribe to the async queuer state.
29
- *
30
- * This is useful for opting into state re-renders for specific parts of the queuer state
31
- * deep in your component tree without needing to pass a selector to the hook.
32
- *
33
- * @example
34
- * <queuer.Subscribe selector={(state) => ({ size: state.size })}>
35
- * {({ size }) => (
36
- * <div>Queue Size: {size}</div>
37
- * )}
38
- * </queuer.Subscribe>
39
- */
40
- Subscribe: <TSelected>(props: {
41
- selector: (state: AsyncQueuerState<TValue>) => TSelected
42
- children: ((state: TSelected) => ComponentChildren) | ComponentChildren
43
- }) => ComponentChildren
44
- /**
45
- * Reactive state that will be updated and re-rendered when the queuer state changes
46
- *
47
- * Use this instead of `queuer.store.state`
48
- */
49
- readonly state: Readonly<TSelected>
50
- /**
51
- * @deprecated Use `queuer.state` instead of `queuer.store.state` if you want to read reactive state.
52
- * The state on the store object is not reactive, as it has not been wrapped in a `useSelector` hook internally.
53
- * Although, you can make the state reactive by using the `useSelector` in your own usage.
54
- */
55
- readonly store: Store<Readonly<AsyncQueuerState<TValue>>>
56
- }
57
-
58
- /**
59
- * A lower-level Preact hook that creates an `AsyncQueuer` instance for managing an async queue of items.
60
- *
61
- * Features:
62
- * - Priority queue support via getPriority option
63
- * - Configurable concurrency limit
64
- * - Task success/error/completion callbacks
65
- * - FIFO (First In First Out) or LIFO (Last In First Out) queue behavior
66
- * - Pause/resume task processing
67
- * - Task cancellation
68
- * - Item expiration to clear stale items from the queue
69
- *
70
- * Tasks are processed concurrently up to the configured concurrency limit. When a task completes,
71
- * the next pending task is processed if below the concurrency limit.
72
- *
73
- * Error Handling:
74
- * - If an `onError` handler is provided, it will be called with the error and queuer instance
75
- * - If `throwOnError` is true (default when no onError handler is provided), the error will be thrown
76
- * - If `throwOnError` is false (default when onError handler is provided), the error will be swallowed
77
- * - Both onError and throwOnError can be used together - the handler will be called before any error is thrown
78
- * - The error state can be checked using the underlying AsyncQueuer instance
79
- *
80
- * ## State Management and Selector
81
- *
82
- * The hook uses TanStack Store for reactive state management. You can subscribe to state changes
83
- * in two ways:
84
- *
85
- * **1. Using `queuer.Subscribe` HOC (Recommended for component tree subscriptions)**
86
- *
87
- * Use the `Subscribe` HOC to subscribe to state changes deep in your component tree without
88
- * needing to pass a selector to the hook. This is ideal when you want to subscribe to state
89
- * in child components.
90
- *
91
- * **2. Using the `selector` parameter (For hook-level subscriptions)**
92
- *
93
- * The `selector` parameter allows you to specify which state changes will trigger a re-render
94
- * at the hook level, optimizing performance by preventing unnecessary re-renders when irrelevant
95
- * state changes occur.
96
- *
97
- * **By default, there will be no reactive state subscriptions** and you must opt-in to state
98
- * tracking by providing a selector function or using the `Subscribe` HOC. This prevents unnecessary
99
- * re-renders and gives you full control over when your component updates.
100
- *
101
- * Available state properties:
102
- * - `activeItems`: Items currently being processed by the queuer
103
- * - `errorCount`: Number of task executions that have resulted in errors
104
- * - `expirationCount`: Number of items that have been removed due to expiration
105
- * - `isEmpty`: Whether the queuer has no items to process
106
- * - `isFull`: Whether the queuer has reached its maximum capacity
107
- * - `isIdle`: Whether the queuer is not currently processing any items
108
- * - `isRunning`: Whether the queuer is active and will process items automatically
109
- * - `items`: Array of items currently waiting to be processed
110
- * - `itemTimestamps`: Timestamps when items were added for expiration tracking
111
- * - `lastResult`: The result from the most recent task execution
112
- * - `pendingTick`: Whether the queuer has a pending timeout for processing the next item
113
- * - `rejectionCount`: Number of items that have been rejected from being added
114
- * - `settledCount`: Number of task executions that have completed (success or error)
115
- * - `size`: Number of items currently in the queue
116
- * - `status`: Current processing status ('idle' | 'running' | 'stopped')
117
- * - `successCount`: Number of task executions that have completed successfully
118
- *
119
- * ## Unmount behavior
120
- *
121
- * By default, the hook stops the queuer and aborts any in-flight task executions when the component unmounts.
122
- * Abort only cancels underlying operations (e.g. fetch) when the abort signal from `getAbortSignal()` is passed to them.
123
- * Use the `onUnmount` option to customize this. For example, to flush pending items instead:
124
- *
125
- * ```tsx
126
- * const queuer = useAsyncQueuer(fn, {
127
- * concurrency: 2,
128
- * started: false,
129
- * onUnmount: (q) => q.flush()
130
- * });
131
- * ```
132
- *
133
- * Note: For async utils, `flush()` returns a Promise and runs fire-and-forget in the cleanup.
134
- * If your task function updates Preact state, those updates may run after the component has
135
- * unmounted, which can cause "setState on unmounted component" warnings. Guard your callbacks
136
- * accordingly when using onUnmount with flush.
137
- *
138
- * @example
139
- * ```tsx
140
- * // Default behavior - no reactive state subscriptions
141
- * const asyncQueuer = useAsyncQueuer(
142
- * async (item) => {
143
- * const result = await processItem(item);
144
- * return result;
145
- * },
146
- * { concurrency: 2, maxSize: 100, started: false }
147
- * );
148
- *
149
- * // Subscribe to state changes deep in component tree using Subscribe HOC
150
- * <asyncQueuer.Subscribe selector={(state) => ({ size: state.size })}>
151
- * {({ size }) => (
152
- * <div>Queue Size: {size}</div>
153
- * )}
154
- * </asyncQueuer.Subscribe>
155
- *
156
- * // Opt-in to re-render when queue size changes at hook level (optimized for displaying queue length)
157
- * const asyncQueuer = useAsyncQueuer(
158
- * async (item) => {
159
- * const result = await processItem(item);
160
- * return result;
161
- * },
162
- * { concurrency: 2, maxSize: 100, started: false },
163
- * (state) => ({
164
- * size: state.size,
165
- * isEmpty: state.isEmpty,
166
- * isFull: state.isFull
167
- * })
168
- * );
169
- *
170
- * // Opt-in to re-render when processing state changes (optimized for loading indicators)
171
- * const asyncQueuer = useAsyncQueuer(
172
- * async (item) => {
173
- * const result = await processItem(item);
174
- * return result;
175
- * },
176
- * { concurrency: 2, maxSize: 100, started: false },
177
- * (state) => ({
178
- * isRunning: state.isRunning,
179
- * isIdle: state.isIdle,
180
- * status: state.status,
181
- * activeItems: state.activeItems,
182
- * pendingTick: state.pendingTick
183
- * })
184
- * );
185
- *
186
- * // Opt-in to re-render when execution metrics change (optimized for stats display)
187
- * const asyncQueuer = useAsyncQueuer(
188
- * async (item) => {
189
- * const result = await processItem(item);
190
- * return result;
191
- * },
192
- * { concurrency: 2, maxSize: 100, started: false },
193
- * (state) => ({
194
- * successCount: state.successCount,
195
- * errorCount: state.errorCount,
196
- * settledCount: state.settledCount,
197
- * expirationCount: state.expirationCount,
198
- * rejectionCount: state.rejectionCount
199
- * })
200
- * );
201
- *
202
- * // Opt-in to re-render when results are available (optimized for data display)
203
- * const asyncQueuer = useAsyncQueuer(
204
- * async (item) => {
205
- * const result = await processItem(item);
206
- * return result;
207
- * },
208
- * {
209
- * concurrency: 2,
210
- * maxSize: 100,
211
- * started: false,
212
- * onSuccess: (result) => {
213
- * console.log('Item processed:', result);
214
- * },
215
- * onError: (error) => {
216
- * console.error('Processing failed:', error);
217
- * }
218
- * },
219
- * (state) => ({
220
- * lastResult: state.lastResult,
221
- * successCount: state.successCount
222
- * })
223
- * );
224
- *
225
- * // Add items to queue
226
- * asyncQueuer.addItem(newItem);
227
- *
228
- * // Start processing
229
- * asyncQueuer.start();
230
- *
231
- * // Access the selected state (will be empty object {} unless selector provided)
232
- * const { size, isRunning, activeItems } = asyncQueuer.state;
233
- * ```
234
- */
235
- export function useAsyncQueuer<TValue, TSelected = {}>(
236
- fn: (value: TValue) => Promise<any>,
237
- options: PreactAsyncQueuerOptions<TValue, TSelected> = {},
238
- selector: (state: AsyncQueuerState<TValue>) => TSelected = () =>
239
- ({}) as TSelected,
240
- ): PreactAsyncQueuer<TValue, TSelected> {
241
- const mergedOptions = {
242
- ...useDefaultPacerOptions().asyncQueuer,
243
- ...options,
244
- } as PreactAsyncQueuerOptions<TValue, TSelected>
245
- const [asyncQueuer] = useState(() => {
246
- const queuerInstance = new AsyncQueuer<TValue>(
247
- fn,
248
- mergedOptions,
249
- ) as unknown as PreactAsyncQueuer<TValue, TSelected>
250
-
251
- queuerInstance.Subscribe = function Subscribe<TSelected>(props: {
252
- selector: (state: AsyncQueuerState<TValue>) => TSelected
253
- children: ((state: TSelected) => ComponentChildren) | ComponentChildren
254
- }) {
255
- const selected = useSelector(queuerInstance.store, props.selector, {
256
- compare: shallow,
257
- })
258
-
259
- return typeof props.children === 'function'
260
- ? props.children(selected)
261
- : props.children
262
- }
263
-
264
- return queuerInstance
265
- })
266
-
267
- asyncQueuer.fn = fn
268
- asyncQueuer.setOptions(mergedOptions)
269
-
270
- /* eslint-disable react-hooks/exhaustive-deps -- cleanup only; runs on unmount */
271
- useEffect(() => {
272
- return () => {
273
- if (mergedOptions.onUnmount) {
274
- mergedOptions.onUnmount(asyncQueuer)
275
- } else {
276
- asyncQueuer.stop()
277
- asyncQueuer.abort()
278
- }
279
- }
280
- }, [])
281
- /* eslint-enable react-hooks/exhaustive-deps */
282
-
283
- const state = useSelector(asyncQueuer.store, selector, { compare: shallow })
284
-
285
- return useMemo(
286
- () =>
287
- ({
288
- ...asyncQueuer,
289
- state,
290
- }) as PreactAsyncQueuer<TValue, TSelected>, // omit `store` in favor of `state`
291
- [asyncQueuer, state],
292
- )
293
- }
@@ -1,5 +0,0 @@
1
- // re-export everything from the core pacer package, BUT ONLY from the async-rate-limiter module
2
- export * from '@tanstack/pacer/async-rate-limiter'
3
-
4
- export * from './useAsyncRateLimiter'
5
- export * from './useAsyncRateLimitedCallback'
@@ -1,68 +0,0 @@
1
- import { useCallback } from 'preact/hooks'
2
- import { useAsyncRateLimiter } from './useAsyncRateLimiter'
3
- import type { AnyAsyncFunction } from '@tanstack/pacer/types'
4
- import type { PreactAsyncRateLimiterOptions } from './useAsyncRateLimiter'
5
-
6
- /**
7
- * A Preact hook that creates a rate-limited version of an async callback function.
8
- * This hook is a convenient wrapper around the `useAsyncRateLimiter` hook,
9
- * providing a stable, async rate-limited function reference for use in Preact components.
10
- *
11
- * Async rate limiting is a "hard limit" approach for async functions: it allows all calls
12
- * until the limit is reached, then blocks (rejects) subsequent calls until the window resets.
13
- * Unlike throttling or debouncing, it does not attempt to space out or collapse calls.
14
- * This can lead to bursts of rapid executions followed by periods where all calls are blocked.
15
- *
16
- * The async rate limiter supports two types of windows:
17
- * - 'fixed': A strict window that resets after the window period. All executions within the window count
18
- * towards the limit, and the window resets completely after the period.
19
- * - 'sliding': A rolling window that allows executions as old ones expire. This provides a more
20
- * consistent rate of execution over time.
21
- *
22
- * For smoother execution patterns, consider:
23
- * - useAsyncThrottledCallback: When you want consistent spacing between executions (e.g. UI updates)
24
- * - useAsyncDebouncedCallback: When you want to collapse rapid calls into a single execution (e.g. search input)
25
- *
26
- * Async rate limiting should primarily be used when you need to enforce strict limits
27
- * on async operations, like API rate limits or other scenarios requiring hard caps
28
- * on execution frequency.
29
- *
30
- * This hook provides a simpler API compared to `useAsyncRateLimiter`, making it ideal for basic
31
- * async rate limiting needs. However, it does not expose the underlying AsyncRateLimiter instance.
32
- *
33
- * For advanced usage requiring features like:
34
- * - Manual cancellation
35
- * - Access to execution counts
36
- * - Custom useCallback dependencies
37
- *
38
- * Consider using the `useAsyncRateLimiter` hook instead.
39
- *
40
- *
41
- * @example
42
- * ```tsx
43
- * // Rate limit async API calls to maximum 5 calls per minute with a sliding window
44
- * const makeApiCall = useAsyncRateLimitedCallback(
45
- * async (data: ApiData) => {
46
- * return fetch('/api/endpoint', { method: 'POST', body: JSON.stringify(data) });
47
- * },
48
- * {
49
- * limit: 5,
50
- * window: 60000, // 1 minute
51
- * windowType: 'sliding',
52
- * onReject: () => {
53
- * console.warn('API rate limit reached. Please wait before trying again.');
54
- * }
55
- * }
56
- * );
57
- * ```
58
- */
59
- export function useAsyncRateLimitedCallback<TFn extends AnyAsyncFunction>(
60
- fn: TFn,
61
- options: PreactAsyncRateLimiterOptions<TFn, {}>,
62
- ): (...args: Parameters<TFn>) => Promise<Awaited<ReturnType<TFn>> | undefined> {
63
- const asyncRateLimitedFn = useAsyncRateLimiter(fn, options).maybeExecute
64
- return useCallback(
65
- (...args: Parameters<TFn>) => asyncRateLimitedFn(...args),
66
- [asyncRateLimitedFn],
67
- )
68
- }
@@ -1,294 +0,0 @@
1
- import { useEffect, useMemo, useState } from 'preact/hooks'
2
- import { AsyncRateLimiter } from '@tanstack/pacer/async-rate-limiter'
3
- import { shallow, useSelector } from '@tanstack/preact-store'
4
- import { useDefaultPacerOptions } from '../provider/PacerProvider'
5
- import type { Store } from '@tanstack/preact-store'
6
- import type { AnyAsyncFunction } from '@tanstack/pacer/types'
7
- import type {
8
- AsyncRateLimiterOptions,
9
- AsyncRateLimiterState,
10
- } from '@tanstack/pacer/async-rate-limiter'
11
- import type { ComponentChildren } from 'preact'
12
-
13
- export interface PreactAsyncRateLimiterOptions<
14
- TFn extends AnyAsyncFunction,
15
- TSelected = {},
16
- > extends AsyncRateLimiterOptions<TFn> {
17
- /**
18
- * Optional callback invoked when the component unmounts. Receives the rate limiter instance.
19
- * When provided, replaces the default cleanup (abort); use it to call reset(), add logging, etc.
20
- */
21
- onUnmount?: (rateLimiter: PreactAsyncRateLimiter<TFn, TSelected>) => void
22
- }
23
-
24
- export interface PreactAsyncRateLimiter<
25
- TFn extends AnyAsyncFunction,
26
- TSelected = {},
27
- > extends Omit<AsyncRateLimiter<TFn>, 'store'> {
28
- /**
29
- * A Preact HOC (Higher Order Component) that allows you to subscribe to the async rate limiter state.
30
- *
31
- * This is useful for opting into state re-renders for specific parts of the rate limiter state
32
- * deep in your component tree without needing to pass a selector to the hook.
33
- *
34
- * @example
35
- * <rateLimiter.Subscribe selector={(state) => ({ rejectionCount: state.rejectionCount })}>
36
- * {({ rejectionCount }) => (
37
- * <div>Rejections: {rejectionCount}</div>
38
- * )}
39
- * </rateLimiter.Subscribe>
40
- */
41
- Subscribe: <TSelected>(props: {
42
- selector: (state: AsyncRateLimiterState<TFn>) => TSelected
43
- children: ((state: TSelected) => ComponentChildren) | ComponentChildren
44
- }) => ComponentChildren
45
- /**
46
- * Reactive state that will be updated and re-rendered when the rate limiter state changes
47
- *
48
- * Use this instead of `rateLimiter.store.state`
49
- */
50
- readonly state: Readonly<TSelected>
51
- /**
52
- * @deprecated Use `rateLimiter.state` instead of `rateLimiter.store.state` if you want to read reactive state.
53
- * The state on the store object is not reactive, as it has not been wrapped in a `useSelector` hook internally.
54
- * Although, you can make the state reactive by using the `useSelector` in your own usage.
55
- */
56
- readonly store: Store<Readonly<AsyncRateLimiterState<TFn>>>
57
- }
58
-
59
- /**
60
- * A low-level Preact hook that creates an `AsyncRateLimiter` instance to limit how many times an async function can execute within a time window.
61
- *
62
- * This hook is designed to be flexible and state-management agnostic - it simply returns a rate limiter instance that
63
- * you can integrate with any state management solution (useState, Redux, Zustand, Jotai, etc).
64
- *
65
- * Rate limiting allows an async function to execute up to a specified limit within a time window,
66
- * then blocks subsequent calls until the window passes. This is useful for respecting API rate limits,
67
- * managing resource constraints, or controlling bursts of async operations.
68
- *
69
- * Unlike the non-async RateLimiter, this async version supports returning values from the rate-limited function,
70
- * making it ideal for API calls and other async operations where you want the result of the `maybeExecute` call
71
- * instead of setting the result on a state variable from within the rate-limited function.
72
- *
73
- * The rate limiter supports two types of windows:
74
- * - 'fixed': A strict window that resets after the window period. All executions within the window count
75
- * towards the limit, and the window resets completely after the period.
76
- * - 'sliding': A rolling window that allows executions as old ones expire. This provides a more
77
- * consistent rate of execution over time.
78
- *
79
- * Error Handling:
80
- * - If an `onError` handler is provided, it will be called with the error and rate limiter instance
81
- * - If `throwOnError` is true (default when no onError handler is provided), the error will be thrown
82
- * - If `throwOnError` is false (default when onError handler is provided), the error will be swallowed
83
- * - Both onError and throwOnError can be used together - the handler will be called before any error is thrown
84
- * - The error state can be checked using the underlying AsyncRateLimiter instance
85
- * - Rate limit rejections (when limit is exceeded) are handled separately from execution errors via the `onReject` handler
86
- *
87
- * ## State Management and Selector
88
- *
89
- * The hook uses TanStack Store for reactive state management. You can subscribe to state changes
90
- * in two ways:
91
- *
92
- * **1. Using `rateLimiter.Subscribe` HOC (Recommended for component tree subscriptions)**
93
- *
94
- * Use the `Subscribe` HOC to subscribe to state changes deep in your component tree without
95
- * needing to pass a selector to the hook. This is ideal when you want to subscribe to state
96
- * in child components.
97
- *
98
- * **2. Using the `selector` parameter (For hook-level subscriptions)**
99
- *
100
- * The `selector` parameter allows you to specify which state changes will trigger a re-render
101
- * at the hook level, optimizing performance by preventing unnecessary re-renders when irrelevant
102
- * state changes occur.
103
- *
104
- * **By default, there will be no reactive state subscriptions** and you must opt-in to state
105
- * tracking by providing a selector function or using the `Subscribe` HOC. This prevents unnecessary
106
- * re-renders and gives you full control over when your component updates.
107
- *
108
- * Available state properties:
109
- * - `errorCount`: Number of function executions that have resulted in errors
110
- * - `executionTimes`: Array of timestamps when executions occurred for rate limiting calculations
111
- * - `isExecuting`: Whether the rate-limited function is currently executing asynchronously
112
- * - `lastResult`: The result from the most recent successful function execution
113
- * - `rejectionCount`: Number of function executions that have been rejected due to rate limiting
114
- * - `settleCount`: Number of function executions that have completed (success or error)
115
- * - `successCount`: Number of function executions that have completed successfully
116
- *
117
- * ## Unmount behavior
118
- *
119
- * By default, the hook aborts any in-flight execution when the component unmounts.
120
- * Abort only cancels underlying operations (e.g. fetch) when the abort signal from `getAbortSignal()` is passed to them.
121
- * Use the `onUnmount` option to customize this.
122
- *
123
- * @example
124
- * ```tsx
125
- * // Default behavior - no reactive state subscriptions
126
- * const asyncRateLimiter = useAsyncRateLimiter(
127
- * async (id: string) => {
128
- * const data = await api.fetchData(id);
129
- * return data; // Return value is preserved
130
- * },
131
- * { limit: 5, window: 1000 } // 5 calls per second
132
- * );
133
- *
134
- * // Subscribe to state changes deep in component tree using Subscribe HOC
135
- * <asyncRateLimiter.Subscribe selector={(state) => ({ rejectionCount: state.rejectionCount })}>
136
- * {({ rejectionCount }) => (
137
- * <div>Rejections: {rejectionCount}</div>
138
- * )}
139
- * </asyncRateLimiter.Subscribe>
140
- *
141
- * // Opt-in to re-render when execution state changes at hook level (optimized for loading indicators)
142
- * const asyncRateLimiter = useAsyncRateLimiter(
143
- * async (id: string) => {
144
- * const data = await api.fetchData(id);
145
- * return data;
146
- * },
147
- * { limit: 5, window: 1000 },
148
- * (state) => ({ isExecuting: state.isExecuting })
149
- * );
150
- *
151
- * // Opt-in to re-render when results are available (optimized for data display)
152
- * const asyncRateLimiter = useAsyncRateLimiter(
153
- * async (id: string) => {
154
- * const data = await api.fetchData(id);
155
- * return data;
156
- * },
157
- * { limit: 5, window: 1000 },
158
- * (state) => ({
159
- * lastResult: state.lastResult,
160
- * successCount: state.successCount
161
- * })
162
- * );
163
- *
164
- * // Opt-in to re-render when error/rejection state changes (optimized for error handling)
165
- * const asyncRateLimiter = useAsyncRateLimiter(
166
- * async (id: string) => {
167
- * const data = await api.fetchData(id);
168
- * return data;
169
- * },
170
- * {
171
- * limit: 5,
172
- * window: 1000,
173
- * onError: (error) => console.error('API call failed:', error),
174
- * onReject: (rateLimiter) => console.log('Rate limit exceeded')
175
- * },
176
- * (state) => ({
177
- * errorCount: state.errorCount,
178
- * rejectionCount: state.rejectionCount
179
- * })
180
- * );
181
- *
182
- * // Opt-in to re-render when execution metrics change (optimized for stats display)
183
- * const asyncRateLimiter = useAsyncRateLimiter(
184
- * async (id: string) => {
185
- * const data = await api.fetchData(id);
186
- * return data;
187
- * },
188
- * { limit: 5, window: 1000 },
189
- * (state) => ({
190
- * successCount: state.successCount,
191
- * errorCount: state.errorCount,
192
- * settleCount: state.settleCount,
193
- * rejectionCount: state.rejectionCount
194
- * })
195
- * );
196
- *
197
- * // Opt-in to re-render when execution times change (optimized for window calculations)
198
- * const asyncRateLimiter = useAsyncRateLimiter(
199
- * async (id: string) => {
200
- * const data = await api.fetchData(id);
201
- * return data;
202
- * },
203
- * { limit: 5, window: 1000 },
204
- * (state) => ({ executionTimes: state.executionTimes })
205
- * );
206
- *
207
- * // With state management and return value
208
- * const [data, setData] = useState(null);
209
- * const { maybeExecute, state } = useAsyncRateLimiter(
210
- * async (query) => {
211
- * const result = await searchAPI(query);
212
- * setData(result);
213
- * return result; // Return value can be used by the caller
214
- * },
215
- * {
216
- * limit: 10,
217
- * window: 60000, // 10 calls per minute
218
- * onReject: (rateLimiter) => {
219
- * console.log(`Rate limit exceeded. Try again in ${rateLimiter.getMsUntilNextWindow()}ms`);
220
- * },
221
- * onError: (error) => {
222
- * console.error('API call failed:', error);
223
- * }
224
- * }
225
- * );
226
- *
227
- * // Access the selected state (will be empty object {} unless selector provided)
228
- * const { isExecuting, lastResult, rejectionCount } = state;
229
- * ```
230
- */
231
- export function useAsyncRateLimiter<
232
- TFn extends AnyAsyncFunction,
233
- TSelected = {},
234
- >(
235
- fn: TFn,
236
- options: PreactAsyncRateLimiterOptions<TFn, TSelected>,
237
- selector: (state: AsyncRateLimiterState<TFn>) => TSelected = () =>
238
- ({}) as TSelected,
239
- ): PreactAsyncRateLimiter<TFn, TSelected> {
240
- const mergedOptions = {
241
- ...useDefaultPacerOptions().asyncRateLimiter,
242
- ...options,
243
- } as PreactAsyncRateLimiterOptions<TFn, TSelected>
244
-
245
- const [asyncRateLimiter] = useState(() => {
246
- const rateLimiterInstance = new AsyncRateLimiter<TFn>(
247
- fn,
248
- mergedOptions,
249
- ) as unknown as PreactAsyncRateLimiter<TFn, TSelected>
250
-
251
- rateLimiterInstance.Subscribe = function Subscribe<TSelected>(props: {
252
- selector: (state: AsyncRateLimiterState<TFn>) => TSelected
253
- children: ((state: TSelected) => ComponentChildren) | ComponentChildren
254
- }) {
255
- const selected = useSelector(rateLimiterInstance.store, props.selector, {
256
- compare: shallow,
257
- })
258
-
259
- return typeof props.children === 'function'
260
- ? props.children(selected)
261
- : props.children
262
- }
263
-
264
- return rateLimiterInstance
265
- })
266
-
267
- asyncRateLimiter.fn = fn
268
- asyncRateLimiter.setOptions(mergedOptions)
269
-
270
- /* eslint-disable react-hooks/exhaustive-deps -- cleanup only; runs on unmount */
271
- useEffect(() => {
272
- return () => {
273
- if (mergedOptions.onUnmount) {
274
- mergedOptions.onUnmount(asyncRateLimiter)
275
- } else {
276
- asyncRateLimiter.abort()
277
- }
278
- }
279
- }, [])
280
- /* eslint-enable react-hooks/exhaustive-deps */
281
-
282
- const state = useSelector(asyncRateLimiter.store, selector, {
283
- compare: shallow,
284
- })
285
-
286
- return useMemo(
287
- () =>
288
- ({
289
- ...asyncRateLimiter,
290
- state,
291
- }) as PreactAsyncRateLimiter<TFn, TSelected>, // omit `store` in favor of `state`
292
- [asyncRateLimiter, state],
293
- )
294
- }
@@ -1,2 +0,0 @@
1
- // re-export everything from the core pacer package, BUT ONLY from the async-retryer module
2
- export * from '@tanstack/pacer/async-retryer'
@@ -1,5 +0,0 @@
1
- // re-export everything from the core pacer package, BUT ONLY from the async-throttler module
2
- export * from '@tanstack/pacer/async-throttler'
3
-
4
- export * from './useAsyncThrottler'
5
- export * from './useAsyncThrottledCallback'