@tanstack/preact-pacer 0.22.1 → 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 (243) hide show
  1. package/README.md +17 -2
  2. package/dist/async-batcher/useAsyncBatchedCallback.d.ts +2 -5
  3. package/dist/async-batcher/useAsyncBatchedCallback.js +1 -2
  4. package/dist/async-batcher/useAsyncBatcher.d.ts +4 -8
  5. package/dist/async-batcher/useAsyncBatcher.js +1 -3
  6. package/dist/async-debouncer/useAsyncDebouncedCallback.d.ts +6 -7
  7. package/dist/async-debouncer/useAsyncDebouncedCallback.js +5 -4
  8. package/dist/async-debouncer/useAsyncDebouncer.d.ts +4 -7
  9. package/dist/async-debouncer/useAsyncDebouncer.js +1 -2
  10. package/dist/async-queuer/useAsyncQueuedState.d.ts +4 -7
  11. package/dist/async-queuer/useAsyncQueuedState.js +3 -4
  12. package/dist/async-queuer/useAsyncQueuer.d.ts +6 -9
  13. package/dist/async-queuer/useAsyncQueuer.js +3 -4
  14. package/dist/async-rate-limiter/useAsyncRateLimitedCallback.d.ts +2 -5
  15. package/dist/async-rate-limiter/useAsyncRateLimitedCallback.js +1 -2
  16. package/dist/async-rate-limiter/useAsyncRateLimiter.d.ts +4 -7
  17. package/dist/async-rate-limiter/useAsyncRateLimiter.js +1 -2
  18. package/dist/async-throttler/useAsyncThrottledCallback.d.ts +7 -9
  19. package/dist/async-throttler/useAsyncThrottledCallback.js +6 -6
  20. package/dist/async-throttler/useAsyncThrottler.d.ts +4 -7
  21. package/dist/async-throttler/useAsyncThrottler.js +1 -2
  22. package/dist/batcher/useBatchedCallback.d.ts +2 -5
  23. package/dist/batcher/useBatchedCallback.js +1 -2
  24. package/dist/batcher/useBatcher.d.ts +6 -11
  25. package/dist/batcher/useBatcher.js +3 -6
  26. package/dist/debouncer/useDebouncedCallback.d.ts +2 -5
  27. package/dist/debouncer/useDebouncedCallback.js +1 -2
  28. package/dist/debouncer/useDebouncedState.d.ts +2 -5
  29. package/dist/debouncer/useDebouncedState.js +1 -2
  30. package/dist/debouncer/useDebouncedValue.d.ts +2 -5
  31. package/dist/debouncer/useDebouncedValue.js +1 -2
  32. package/dist/debouncer/useDebouncer.d.ts +4 -7
  33. package/dist/debouncer/useDebouncer.js +1 -2
  34. package/dist/provider/PacerProvider.d.ts +6 -13
  35. package/dist/provider/PacerProvider.js +1 -2
  36. package/dist/queuer/useQueuedState.d.ts +2 -5
  37. package/dist/queuer/useQueuedState.js +1 -2
  38. package/dist/queuer/useQueuedValue.d.ts +2 -5
  39. package/dist/queuer/useQueuedValue.js +1 -2
  40. package/dist/queuer/useQueuer.d.ts +4 -7
  41. package/dist/queuer/useQueuer.js +1 -2
  42. package/dist/rate-limiter/useRateLimitedCallback.d.ts +2 -5
  43. package/dist/rate-limiter/useRateLimitedCallback.js +1 -2
  44. package/dist/rate-limiter/useRateLimitedState.d.ts +2 -5
  45. package/dist/rate-limiter/useRateLimitedState.js +1 -2
  46. package/dist/rate-limiter/useRateLimitedValue.d.ts +2 -5
  47. package/dist/rate-limiter/useRateLimitedValue.js +1 -2
  48. package/dist/rate-limiter/useRateLimiter.d.ts +4 -7
  49. package/dist/rate-limiter/useRateLimiter.js +1 -2
  50. package/dist/throttler/useThrottledCallback.d.ts +2 -5
  51. package/dist/throttler/useThrottledCallback.js +1 -2
  52. package/dist/throttler/useThrottledState.d.ts +2 -5
  53. package/dist/throttler/useThrottledState.js +1 -2
  54. package/dist/throttler/useThrottledValue.d.ts +2 -5
  55. package/dist/throttler/useThrottledValue.js +1 -2
  56. package/dist/throttler/useThrottler.d.ts +4 -7
  57. package/dist/throttler/useThrottler.js +1 -2
  58. package/package.json +24 -72
  59. package/dist/async-batcher/index.cjs +0 -13
  60. package/dist/async-batcher/index.d.cts +0 -4
  61. package/dist/async-batcher/useAsyncBatchedCallback.cjs +0 -51
  62. package/dist/async-batcher/useAsyncBatchedCallback.cjs.map +0 -1
  63. package/dist/async-batcher/useAsyncBatchedCallback.d.cts +0 -44
  64. package/dist/async-batcher/useAsyncBatchedCallback.js.map +0 -1
  65. package/dist/async-batcher/useAsyncBatcher.cjs +0 -217
  66. package/dist/async-batcher/useAsyncBatcher.cjs.map +0 -1
  67. package/dist/async-batcher/useAsyncBatcher.d.cts +0 -224
  68. package/dist/async-batcher/useAsyncBatcher.js.map +0 -1
  69. package/dist/async-debouncer/index.cjs +0 -13
  70. package/dist/async-debouncer/index.d.cts +0 -4
  71. package/dist/async-debouncer/useAsyncDebouncedCallback.cjs +0 -50
  72. package/dist/async-debouncer/useAsyncDebouncedCallback.cjs.map +0 -1
  73. package/dist/async-debouncer/useAsyncDebouncedCallback.d.cts +0 -46
  74. package/dist/async-debouncer/useAsyncDebouncedCallback.js.map +0 -1
  75. package/dist/async-debouncer/useAsyncDebouncer.cjs +0 -195
  76. package/dist/async-debouncer/useAsyncDebouncer.cjs.map +0 -1
  77. package/dist/async-debouncer/useAsyncDebouncer.d.cts +0 -203
  78. package/dist/async-debouncer/useAsyncDebouncer.js.map +0 -1
  79. package/dist/async-queuer/index.cjs +0 -13
  80. package/dist/async-queuer/index.d.cts +0 -4
  81. package/dist/async-queuer/useAsyncQueuedState.cjs +0 -154
  82. package/dist/async-queuer/useAsyncQueuedState.cjs.map +0 -1
  83. package/dist/async-queuer/useAsyncQueuedState.d.cts +0 -151
  84. package/dist/async-queuer/useAsyncQueuedState.js.map +0 -1
  85. package/dist/async-queuer/useAsyncQueuer.cjs +0 -217
  86. package/dist/async-queuer/useAsyncQueuer.cjs.map +0 -1
  87. package/dist/async-queuer/useAsyncQueuer.d.cts +0 -224
  88. package/dist/async-queuer/useAsyncQueuer.js.map +0 -1
  89. package/dist/async-rate-limiter/index.cjs +0 -13
  90. package/dist/async-rate-limiter/index.d.cts +0 -4
  91. package/dist/async-rate-limiter/useAsyncRateLimitedCallback.cjs +0 -65
  92. package/dist/async-rate-limiter/useAsyncRateLimitedCallback.cjs.map +0 -1
  93. package/dist/async-rate-limiter/useAsyncRateLimitedCallback.d.cts +0 -61
  94. package/dist/async-rate-limiter/useAsyncRateLimitedCallback.js.map +0 -1
  95. package/dist/async-rate-limiter/useAsyncRateLimiter.cjs +0 -209
  96. package/dist/async-rate-limiter/useAsyncRateLimiter.cjs.map +0 -1
  97. package/dist/async-rate-limiter/useAsyncRateLimiter.d.cts +0 -220
  98. package/dist/async-rate-limiter/useAsyncRateLimiter.js.map +0 -1
  99. package/dist/async-retryer/index.cjs +0 -9
  100. package/dist/async-retryer/index.d.cts +0 -1
  101. package/dist/async-throttler/index.cjs +0 -13
  102. package/dist/async-throttler/index.d.cts +0 -4
  103. package/dist/async-throttler/useAsyncThrottledCallback.cjs +0 -48
  104. package/dist/async-throttler/useAsyncThrottledCallback.cjs.map +0 -1
  105. package/dist/async-throttler/useAsyncThrottledCallback.d.cts +0 -44
  106. package/dist/async-throttler/useAsyncThrottledCallback.js.map +0 -1
  107. package/dist/async-throttler/useAsyncThrottler.cjs +0 -206
  108. package/dist/async-throttler/useAsyncThrottler.cjs.map +0 -1
  109. package/dist/async-throttler/useAsyncThrottler.d.cts +0 -214
  110. package/dist/async-throttler/useAsyncThrottler.js.map +0 -1
  111. package/dist/batcher/index.cjs +0 -13
  112. package/dist/batcher/index.d.cts +0 -4
  113. package/dist/batcher/useBatchedCallback.cjs +0 -47
  114. package/dist/batcher/useBatchedCallback.cjs.map +0 -1
  115. package/dist/batcher/useBatchedCallback.d.cts +0 -42
  116. package/dist/batcher/useBatchedCallback.js.map +0 -1
  117. package/dist/batcher/useBatcher.cjs +0 -165
  118. package/dist/batcher/useBatcher.cjs.map +0 -1
  119. package/dist/batcher/useBatcher.d.cts +0 -175
  120. package/dist/batcher/useBatcher.js.map +0 -1
  121. package/dist/debouncer/index.cjs +0 -17
  122. package/dist/debouncer/index.d.cts +0 -6
  123. package/dist/debouncer/useDebouncedCallback.cjs +0 -48
  124. package/dist/debouncer/useDebouncedCallback.cjs.map +0 -1
  125. package/dist/debouncer/useDebouncedCallback.d.cts +0 -44
  126. package/dist/debouncer/useDebouncedCallback.js.map +0 -1
  127. package/dist/debouncer/useDebouncedState.cjs +0 -89
  128. package/dist/debouncer/useDebouncedState.cjs.map +0 -1
  129. package/dist/debouncer/useDebouncedState.d.cts +0 -81
  130. package/dist/debouncer/useDebouncedState.js.map +0 -1
  131. package/dist/debouncer/useDebouncedValue.cjs +0 -96
  132. package/dist/debouncer/useDebouncedValue.cjs.map +0 -1
  133. package/dist/debouncer/useDebouncedValue.d.cts +0 -90
  134. package/dist/debouncer/useDebouncedValue.js.map +0 -1
  135. package/dist/debouncer/useDebouncer.cjs +0 -141
  136. package/dist/debouncer/useDebouncer.cjs.map +0 -1
  137. package/dist/debouncer/useDebouncer.d.cts +0 -152
  138. package/dist/debouncer/useDebouncer.js.map +0 -1
  139. package/dist/index.cjs +0 -67
  140. package/dist/index.d.cts +0 -30
  141. package/dist/provider/PacerProvider.cjs +0 -26
  142. package/dist/provider/PacerProvider.cjs.map +0 -1
  143. package/dist/provider/PacerProvider.d.cts +0 -33
  144. package/dist/provider/PacerProvider.js.map +0 -1
  145. package/dist/provider/index.cjs +0 -6
  146. package/dist/provider/index.d.cts +0 -2
  147. package/dist/queuer/index.cjs +0 -15
  148. package/dist/queuer/index.d.cts +0 -5
  149. package/dist/queuer/useQueuedState.cjs +0 -129
  150. package/dist/queuer/useQueuedState.cjs.map +0 -1
  151. package/dist/queuer/useQueuedState.d.cts +0 -122
  152. package/dist/queuer/useQueuedState.js.map +0 -1
  153. package/dist/queuer/useQueuedValue.cjs +0 -115
  154. package/dist/queuer/useQueuedValue.cjs.map +0 -1
  155. package/dist/queuer/useQueuedValue.d.cts +0 -105
  156. package/dist/queuer/useQueuedValue.js.map +0 -1
  157. package/dist/queuer/useQueuer.cjs +0 -176
  158. package/dist/queuer/useQueuer.cjs.map +0 -1
  159. package/dist/queuer/useQueuer.d.cts +0 -186
  160. package/dist/queuer/useQueuer.js.map +0 -1
  161. package/dist/rate-limiter/index.cjs +0 -17
  162. package/dist/rate-limiter/index.d.cts +0 -6
  163. package/dist/rate-limiter/useRateLimitedCallback.cjs +0 -65
  164. package/dist/rate-limiter/useRateLimitedCallback.cjs.map +0 -1
  165. package/dist/rate-limiter/useRateLimitedCallback.d.cts +0 -61
  166. package/dist/rate-limiter/useRateLimitedCallback.js.map +0 -1
  167. package/dist/rate-limiter/useRateLimitedState.cjs +0 -115
  168. package/dist/rate-limiter/useRateLimitedState.cjs.map +0 -1
  169. package/dist/rate-limiter/useRateLimitedState.d.cts +0 -107
  170. package/dist/rate-limiter/useRateLimitedState.js.map +0 -1
  171. package/dist/rate-limiter/useRateLimitedValue.cjs +0 -102
  172. package/dist/rate-limiter/useRateLimitedValue.cjs.map +0 -1
  173. package/dist/rate-limiter/useRateLimitedValue.d.cts +0 -96
  174. package/dist/rate-limiter/useRateLimitedValue.js.map +0 -1
  175. package/dist/rate-limiter/useRateLimiter.cjs +0 -167
  176. package/dist/rate-limiter/useRateLimiter.cjs.map +0 -1
  177. package/dist/rate-limiter/useRateLimiter.d.cts +0 -179
  178. package/dist/rate-limiter/useRateLimiter.js.map +0 -1
  179. package/dist/throttler/index.cjs +0 -17
  180. package/dist/throttler/index.d.cts +0 -6
  181. package/dist/throttler/useThrottledCallback.cjs +0 -49
  182. package/dist/throttler/useThrottledCallback.cjs.map +0 -1
  183. package/dist/throttler/useThrottledCallback.d.cts +0 -45
  184. package/dist/throttler/useThrottledCallback.js.map +0 -1
  185. package/dist/throttler/useThrottledState.cjs +0 -100
  186. package/dist/throttler/useThrottledState.cjs.map +0 -1
  187. package/dist/throttler/useThrottledState.d.cts +0 -92
  188. package/dist/throttler/useThrottledState.js.map +0 -1
  189. package/dist/throttler/useThrottledValue.cjs +0 -91
  190. package/dist/throttler/useThrottledValue.cjs.map +0 -1
  191. package/dist/throttler/useThrottledValue.d.cts +0 -85
  192. package/dist/throttler/useThrottledValue.js.map +0 -1
  193. package/dist/throttler/useThrottler.cjs +0 -146
  194. package/dist/throttler/useThrottler.cjs.map +0 -1
  195. package/dist/throttler/useThrottler.d.cts +0 -157
  196. package/dist/throttler/useThrottler.js.map +0 -1
  197. package/dist/types/index.cjs +0 -9
  198. package/dist/types/index.d.cts +0 -1
  199. package/dist/utils/index.cjs +0 -9
  200. package/dist/utils/index.d.cts +0 -1
  201. package/src/async-batcher/index.ts +0 -4
  202. package/src/async-batcher/useAsyncBatchedCallback.ts +0 -53
  203. package/src/async-batcher/useAsyncBatcher.ts +0 -293
  204. package/src/async-debouncer/index.ts +0 -5
  205. package/src/async-debouncer/useAsyncDebouncedCallback.ts +0 -54
  206. package/src/async-debouncer/useAsyncDebouncer.ts +0 -274
  207. package/src/async-queuer/index.ts +0 -4
  208. package/src/async-queuer/useAsyncQueuedState.ts +0 -165
  209. package/src/async-queuer/useAsyncQueuer.ts +0 -293
  210. package/src/async-rate-limiter/index.ts +0 -5
  211. package/src/async-rate-limiter/useAsyncRateLimitedCallback.ts +0 -69
  212. package/src/async-rate-limiter/useAsyncRateLimiter.ts +0 -294
  213. package/src/async-retryer/index.ts +0 -2
  214. package/src/async-throttler/index.ts +0 -5
  215. package/src/async-throttler/useAsyncThrottledCallback.ts +0 -52
  216. package/src/async-throttler/useAsyncThrottler.ts +0 -285
  217. package/src/batcher/index.ts +0 -4
  218. package/src/batcher/useBatchedCallback.ts +0 -46
  219. package/src/batcher/useBatcher.ts +0 -241
  220. package/src/debouncer/index.ts +0 -7
  221. package/src/debouncer/useDebouncedCallback.ts +0 -51
  222. package/src/debouncer/useDebouncedState.ts +0 -106
  223. package/src/debouncer/useDebouncedValue.ts +0 -109
  224. package/src/debouncer/useDebouncer.ts +0 -219
  225. package/src/index.ts +0 -56
  226. package/src/provider/PacerProvider.tsx +0 -70
  227. package/src/provider/index.ts +0 -1
  228. package/src/queuer/index.ts +0 -5
  229. package/src/queuer/useQueuedState.ts +0 -133
  230. package/src/queuer/useQueuedValue.ts +0 -129
  231. package/src/queuer/useQueuer.ts +0 -251
  232. package/src/rate-limiter/index.ts +0 -6
  233. package/src/rate-limiter/useRateLimitedCallback.ts +0 -68
  234. package/src/rate-limiter/useRateLimitedState.ts +0 -124
  235. package/src/rate-limiter/useRateLimitedValue.ts +0 -110
  236. package/src/rate-limiter/useRateLimiter.ts +0 -244
  237. package/src/throttler/index.ts +0 -7
  238. package/src/throttler/useThrottledCallback.ts +0 -52
  239. package/src/throttler/useThrottledState.ts +0 -118
  240. package/src/throttler/useThrottledValue.ts +0 -104
  241. package/src/throttler/useThrottler.ts +0 -224
  242. package/src/types/index.ts +0 -1
  243. package/src/utils/index.ts +0 -1
@@ -1,176 +0,0 @@
1
- const require_PacerProvider = require('../provider/PacerProvider.cjs');
2
- let preact_hooks = require("preact/hooks");
3
- let _tanstack_preact_store = require("@tanstack/preact-store");
4
- let _tanstack_pacer_queuer = require("@tanstack/pacer/queuer");
5
-
6
- //#region src/queuer/useQueuer.ts
7
- /**
8
- * A Preact hook that creates and manages a Queuer instance.
9
- *
10
- * This is a lower-level hook that provides direct access to the Queuer's functionality without
11
- * any built-in state management. This allows you to integrate it with any state management solution
12
- * you prefer (useState, Redux, Zustand, etc.) by utilizing the onItemsChange callback.
13
- *
14
- * For a hook with built-in state management, see useQueuedState.
15
- *
16
- * The Queuer extends the base Queue to add processing capabilities. Items are processed
17
- * synchronously in order, with optional delays between processing each item. The queuer includes
18
- * an internal tick mechanism that can be started and stopped, making it useful as a scheduler.
19
- * When started, it will process one item per tick, with an optional wait time between ticks.
20
- *
21
- * By default uses FIFO (First In First Out) behavior, but can be configured for LIFO
22
- * (Last In First Out) by specifying 'front' position when adding items.
23
- *
24
- * ## State Management and Selector
25
- *
26
- * The hook uses TanStack Store for reactive state management. You can subscribe to state changes
27
- * in two ways:
28
- *
29
- * **1. Using `queuer.Subscribe` HOC (Recommended for component tree subscriptions)**
30
- *
31
- * Use the `Subscribe` HOC to subscribe to state changes deep in your component tree without
32
- * needing to pass a selector to the hook. This is ideal when you want to subscribe to state
33
- * in child components.
34
- *
35
- * **2. Using the `selector` parameter (For hook-level subscriptions)**
36
- *
37
- * The `selector` parameter allows you to specify which state changes will trigger a re-render
38
- * at the hook level, optimizing performance by preventing unnecessary re-renders when irrelevant
39
- * state changes occur.
40
- *
41
- * **By default, there will be no reactive state subscriptions** and you must opt-in to state
42
- * tracking by providing a selector function or using the `Subscribe` HOC. This prevents unnecessary
43
- * re-renders and gives you full control over when your component updates.
44
- *
45
- * Available state properties:
46
- * - `executionCount`: Number of items that have been processed by the queuer
47
- * - `expirationCount`: Number of items that have been removed due to expiration
48
- * - `isEmpty`: Whether the queuer has no items to process
49
- * - `isFull`: Whether the queuer has reached its maximum capacity
50
- * - `isIdle`: Whether the queuer is not currently processing any items
51
- * - `isRunning`: Whether the queuer is active and will process items automatically
52
- * - `items`: Array of items currently waiting to be processed
53
- * - `itemTimestamps`: Timestamps when items were added for expiration tracking
54
- * - `pendingTick`: Whether the queuer has a pending timeout for processing the next item
55
- * - `rejectionCount`: Number of items that have been rejected from being added
56
- * - `size`: Number of items currently in the queue
57
- * - `status`: Current processing status ('idle' | 'running' | 'stopped')
58
- *
59
- * ## Unmount behavior
60
- *
61
- * By default, the hook stops the queuer when the component unmounts.
62
- * Use the `onUnmount` option to customize this. For example, to flush pending items instead:
63
- *
64
- * ```tsx
65
- * const queue = useQueuer(fn, {
66
- * started: true,
67
- * wait: 1000,
68
- * onUnmount: (q) => q.flush()
69
- * });
70
- * ```
71
- *
72
- * @example
73
- * ```tsx
74
- * // Default behavior - no reactive state subscriptions
75
- * const queue = useQueuer(
76
- * (item) => console.log('Processing:', item),
77
- * { started: true, wait: 1000 }
78
- * );
79
- *
80
- * // Subscribe to state changes deep in component tree using Subscribe HOC
81
- * <queue.Subscribe selector={(state) => ({ size: state.size })}>
82
- * {({ size }) => (
83
- * <div>Queue Size: {size}</div>
84
- * )}
85
- * </queue.Subscribe>
86
- *
87
- * // Opt-in to re-render when queue size changes at hook level (optimized for displaying queue length)
88
- * const queue = useQueuer(
89
- * (item) => console.log('Processing:', item),
90
- * { started: true, wait: 1000 },
91
- * (state) => ({
92
- * size: state.size,
93
- * isEmpty: state.isEmpty,
94
- * isFull: state.isFull
95
- * })
96
- * );
97
- *
98
- * // Opt-in to re-render when processing state changes (optimized for loading indicators)
99
- * const queue = useQueuer(
100
- * (item) => console.log('Processing:', item),
101
- * { started: true, wait: 1000 },
102
- * (state) => ({
103
- * isRunning: state.isRunning,
104
- * isIdle: state.isIdle,
105
- * status: state.status,
106
- * pendingTick: state.pendingTick
107
- * })
108
- * );
109
- *
110
- * // Opt-in to re-render when execution metrics change (optimized for stats display)
111
- * const queue = useQueuer(
112
- * (item) => console.log('Processing:', item),
113
- * { started: true, wait: 1000 },
114
- * (state) => ({
115
- * executionCount: state.executionCount,
116
- * expirationCount: state.expirationCount,
117
- * rejectionCount: state.rejectionCount
118
- * })
119
- * );
120
- *
121
- * // Example with custom state management and scheduling
122
- * const [items, setItems] = useState([]);
123
- *
124
- * const queue = useQueuer(
125
- * (item) => console.log('Processing:', item),
126
- * {
127
- * started: true, // Start processing immediately
128
- * wait: 1000, // Process one item every second
129
- * onItemsChange: (queue) => setItems(queue.peekAllItems()),
130
- * getPriority: (item) => item.priority // Process higher priority items first
131
- * }
132
- * );
133
- *
134
- * // Add items to process - they'll be handled automatically
135
- * queue.addItem('task1');
136
- * queue.addItem('task2');
137
- *
138
- * // Control the scheduler
139
- * queue.stop(); // Pause processing
140
- * queue.start(); // Resume processing
141
- *
142
- * // Access the selected state (will be empty object {} unless selector provided)
143
- * const { size, isRunning, executionCount } = queue.state;
144
- * ```
145
- */
146
- function useQueuer(fn, options = {}, selector = () => ({})) {
147
- const mergedOptions = {
148
- ...require_PacerProvider.useDefaultPacerOptions().queuer,
149
- ...options
150
- };
151
- const [queuer] = (0, preact_hooks.useState)(() => {
152
- const queuerInstance = new _tanstack_pacer_queuer.Queuer(fn, mergedOptions);
153
- queuerInstance.Subscribe = function Subscribe(props) {
154
- const selected = (0, _tanstack_preact_store.useSelector)(queuerInstance.store, props.selector, { compare: _tanstack_preact_store.shallow });
155
- return typeof props.children === "function" ? props.children(selected) : props.children;
156
- };
157
- return queuerInstance;
158
- });
159
- queuer.fn = fn;
160
- queuer.setOptions(mergedOptions);
161
- (0, preact_hooks.useEffect)(() => {
162
- return () => {
163
- if (mergedOptions.onUnmount) mergedOptions.onUnmount(queuer);
164
- else queuer.stop();
165
- };
166
- }, []);
167
- const state = (0, _tanstack_preact_store.useSelector)(queuer.store, selector, { compare: _tanstack_preact_store.shallow });
168
- return (0, preact_hooks.useMemo)(() => ({
169
- ...queuer,
170
- state
171
- }), [queuer, state]);
172
- }
173
-
174
- //#endregion
175
- exports.useQueuer = useQueuer;
176
- //# sourceMappingURL=useQueuer.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useQueuer.cjs","names":["useDefaultPacerOptions","Queuer","shallow"],"sources":["../../src/queuer/useQueuer.ts"],"sourcesContent":["import { useEffect, useMemo, useState } from 'preact/hooks'\nimport { Queuer } from '@tanstack/pacer/queuer'\nimport { shallow, useSelector } from '@tanstack/preact-store'\nimport { useDefaultPacerOptions } from '../provider/PacerProvider'\nimport type { Store } from '@tanstack/preact-store'\nimport type { QueuerOptions, QueuerState } from '@tanstack/pacer/queuer'\nimport type { ComponentChildren } from 'preact'\n\nexport interface PreactQueuerOptions<\n TValue,\n TSelected = {},\n> extends QueuerOptions<TValue> {\n /**\n * Optional callback invoked when the component unmounts. Receives the queuer instance.\n * When provided, replaces the default cleanup (stop); use it to call flush(), flushAsBatch(), stop(), add logging, etc.\n */\n onUnmount?: (queuer: PreactQueuer<TValue, TSelected>) => void\n}\n\nexport interface PreactQueuer<TValue, TSelected = {}> extends Omit<\n Queuer<TValue>,\n 'store'\n> {\n /**\n * A Preact HOC (Higher Order Component) that allows you to subscribe to the queuer state.\n *\n * This is useful for opting into state re-renders for specific parts of the queuer state\n * deep in your component tree without needing to pass a selector to the hook.\n *\n * @example\n * <queuer.Subscribe selector={(state) => ({ size: state.size })}>\n * {({ size }) => (\n * <div>Queue Size: {size}</div>\n * )}\n * </queuer.Subscribe>\n */\n Subscribe: <TSelected>(props: {\n selector: (state: QueuerState<TValue>) => TSelected\n children: ((state: TSelected) => ComponentChildren) | ComponentChildren\n }) => ComponentChildren\n /**\n * Reactive state that will be updated and re-rendered when the queuer state changes\n *\n * Use this instead of `queuer.store.state`\n */\n readonly state: Readonly<TSelected>\n /**\n * @deprecated Use `queuer.state` instead of `queuer.store.state` if you want to read reactive state.\n * The state on the store object is not reactive, as it has not been wrapped in a `useSelector` hook internally.\n * Although, you can make the state reactive by using the `useSelector` in your own usage.\n */\n readonly store: Store<Readonly<QueuerState<TValue>>>\n}\n\n/**\n * A Preact hook that creates and manages a Queuer instance.\n *\n * This is a lower-level hook that provides direct access to the Queuer's functionality without\n * any built-in state management. This allows you to integrate it with any state management solution\n * you prefer (useState, Redux, Zustand, etc.) by utilizing the onItemsChange callback.\n *\n * For a hook with built-in state management, see useQueuedState.\n *\n * The Queuer extends the base Queue to add processing capabilities. Items are processed\n * synchronously in order, with optional delays between processing each item. The queuer includes\n * an internal tick mechanism that can be started and stopped, making it useful as a scheduler.\n * When started, it will process one item per tick, with an optional wait time between ticks.\n *\n * By default uses FIFO (First In First Out) behavior, but can be configured for LIFO\n * (Last In First Out) by specifying 'front' position when adding items.\n *\n * ## State Management and Selector\n *\n * The hook uses TanStack Store for reactive state management. You can subscribe to state changes\n * in two ways:\n *\n * **1. Using `queuer.Subscribe` HOC (Recommended for component tree subscriptions)**\n *\n * Use the `Subscribe` HOC to subscribe to state changes deep in your component tree without\n * needing to pass a selector to the hook. This is ideal when you want to subscribe to state\n * in child components.\n *\n * **2. Using the `selector` parameter (For hook-level subscriptions)**\n *\n * The `selector` parameter allows you to specify which state changes will trigger a re-render\n * at the hook level, optimizing performance by preventing unnecessary re-renders when irrelevant\n * state changes occur.\n *\n * **By default, there will be no reactive state subscriptions** and you must opt-in to state\n * tracking by providing a selector function or using the `Subscribe` HOC. This prevents unnecessary\n * re-renders and gives you full control over when your component updates.\n *\n * Available state properties:\n * - `executionCount`: Number of items that have been processed by the queuer\n * - `expirationCount`: Number of items that have been removed due to expiration\n * - `isEmpty`: Whether the queuer has no items to process\n * - `isFull`: Whether the queuer has reached its maximum capacity\n * - `isIdle`: Whether the queuer is not currently processing any items\n * - `isRunning`: Whether the queuer is active and will process items automatically\n * - `items`: Array of items currently waiting to be processed\n * - `itemTimestamps`: Timestamps when items were added for expiration tracking\n * - `pendingTick`: Whether the queuer has a pending timeout for processing the next item\n * - `rejectionCount`: Number of items that have been rejected from being added\n * - `size`: Number of items currently in the queue\n * - `status`: Current processing status ('idle' | 'running' | 'stopped')\n *\n * ## Unmount behavior\n *\n * By default, the hook stops the queuer when the component unmounts.\n * Use the `onUnmount` option to customize this. For example, to flush pending items instead:\n *\n * ```tsx\n * const queue = useQueuer(fn, {\n * started: true,\n * wait: 1000,\n * onUnmount: (q) => q.flush()\n * });\n * ```\n *\n * @example\n * ```tsx\n * // Default behavior - no reactive state subscriptions\n * const queue = useQueuer(\n * (item) => console.log('Processing:', item),\n * { started: true, wait: 1000 }\n * );\n *\n * // Subscribe to state changes deep in component tree using Subscribe HOC\n * <queue.Subscribe selector={(state) => ({ size: state.size })}>\n * {({ size }) => (\n * <div>Queue Size: {size}</div>\n * )}\n * </queue.Subscribe>\n *\n * // Opt-in to re-render when queue size changes at hook level (optimized for displaying queue length)\n * const queue = useQueuer(\n * (item) => console.log('Processing:', item),\n * { started: true, wait: 1000 },\n * (state) => ({\n * size: state.size,\n * isEmpty: state.isEmpty,\n * isFull: state.isFull\n * })\n * );\n *\n * // Opt-in to re-render when processing state changes (optimized for loading indicators)\n * const queue = useQueuer(\n * (item) => console.log('Processing:', item),\n * { started: true, wait: 1000 },\n * (state) => ({\n * isRunning: state.isRunning,\n * isIdle: state.isIdle,\n * status: state.status,\n * pendingTick: state.pendingTick\n * })\n * );\n *\n * // Opt-in to re-render when execution metrics change (optimized for stats display)\n * const queue = useQueuer(\n * (item) => console.log('Processing:', item),\n * { started: true, wait: 1000 },\n * (state) => ({\n * executionCount: state.executionCount,\n * expirationCount: state.expirationCount,\n * rejectionCount: state.rejectionCount\n * })\n * );\n *\n * // Example with custom state management and scheduling\n * const [items, setItems] = useState([]);\n *\n * const queue = useQueuer(\n * (item) => console.log('Processing:', item),\n * {\n * started: true, // Start processing immediately\n * wait: 1000, // Process one item every second\n * onItemsChange: (queue) => setItems(queue.peekAllItems()),\n * getPriority: (item) => item.priority // Process higher priority items first\n * }\n * );\n *\n * // Add items to process - they'll be handled automatically\n * queue.addItem('task1');\n * queue.addItem('task2');\n *\n * // Control the scheduler\n * queue.stop(); // Pause processing\n * queue.start(); // Resume processing\n *\n * // Access the selected state (will be empty object {} unless selector provided)\n * const { size, isRunning, executionCount } = queue.state;\n * ```\n */\nexport function useQueuer<TValue, TSelected = {}>(\n fn: (item: TValue) => void,\n options: PreactQueuerOptions<TValue, TSelected> = {},\n selector: (state: QueuerState<TValue>) => TSelected = () => ({}) as TSelected,\n): PreactQueuer<TValue, TSelected> {\n const mergedOptions = {\n ...useDefaultPacerOptions().queuer,\n ...options,\n } as PreactQueuerOptions<TValue, TSelected>\n\n const [queuer] = useState(() => {\n const queuerInstance = new Queuer<TValue>(\n fn,\n mergedOptions,\n ) as unknown as PreactQueuer<TValue, TSelected>\n\n queuerInstance.Subscribe = function Subscribe<TSelected>(props: {\n selector: (state: QueuerState<TValue>) => TSelected\n children: ((state: TSelected) => ComponentChildren) | ComponentChildren\n }) {\n const selected = useSelector(queuerInstance.store, props.selector, {\n compare: shallow,\n })\n\n return typeof props.children === 'function'\n ? props.children(selected)\n : props.children\n }\n\n return queuerInstance\n })\n\n queuer.fn = fn\n queuer.setOptions(mergedOptions)\n\n /* eslint-disable react-hooks/exhaustive-deps -- cleanup only; runs on unmount */\n useEffect(() => {\n return () => {\n if (mergedOptions.onUnmount) {\n mergedOptions.onUnmount(queuer)\n } else {\n queuer.stop()\n }\n }\n }, [])\n /* eslint-enable react-hooks/exhaustive-deps */\n\n const state = useSelector(queuer.store, selector, { compare: shallow })\n\n return useMemo(\n () =>\n ({\n ...queuer,\n state,\n }) as PreactQueuer<TValue, TSelected>, // omit `store` in favor of `state`\n [queuer, state],\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiMA,SAAgB,UACd,IACA,UAAkD,EAAE,EACpD,kBAA6D,EAAE,GAC9B;CACjC,MAAM,gBAAgB;EACpB,GAAGA,8CAAwB,CAAC;EAC5B,GAAG;EACJ;CAED,MAAM,CAAC,2CAAyB;EAC9B,MAAM,iBAAiB,IAAIC,8BACzB,IACA,cACD;EAED,eAAe,YAAY,SAAS,UAAqB,OAGtD;GACD,MAAM,mDAAuB,eAAe,OAAO,MAAM,UAAU,EACjE,SAASC,gCACV,CAAC;GAEF,OAAO,OAAO,MAAM,aAAa,aAC7B,MAAM,SAAS,SAAS,GACxB,MAAM;;EAGZ,OAAO;GACP;CAEF,OAAO,KAAK;CACZ,OAAO,WAAW,cAAc;CAGhC,kCAAgB;EACd,aAAa;GACX,IAAI,cAAc,WAChB,cAAc,UAAU,OAAO;QAE/B,OAAO,MAAM;;IAGhB,EAAE,CAAC;CAGN,MAAM,gDAAoB,OAAO,OAAO,UAAU,EAAE,SAASA,gCAAS,CAAC;CAEvE,wCAEK;EACC,GAAG;EACH;EACD,GACH,CAAC,QAAQ,MAAM,CAChB"}
@@ -1,186 +0,0 @@
1
- import { Store } from "@tanstack/preact-store";
2
- import { ComponentChildren } from "preact";
3
- import { Queuer, QueuerOptions, QueuerState } from "@tanstack/pacer/queuer";
4
-
5
- //#region src/queuer/useQueuer.d.ts
6
- interface PreactQueuerOptions<TValue, TSelected = {}> extends QueuerOptions<TValue> {
7
- /**
8
- * Optional callback invoked when the component unmounts. Receives the queuer instance.
9
- * When provided, replaces the default cleanup (stop); use it to call flush(), flushAsBatch(), stop(), add logging, etc.
10
- */
11
- onUnmount?: (queuer: PreactQueuer<TValue, TSelected>) => void;
12
- }
13
- interface PreactQueuer<TValue, TSelected = {}> extends Omit<Queuer<TValue>, 'store'> {
14
- /**
15
- * A Preact HOC (Higher Order Component) that allows you to subscribe to the queuer state.
16
- *
17
- * This is useful for opting into state re-renders for specific parts of the queuer state
18
- * deep in your component tree without needing to pass a selector to the hook.
19
- *
20
- * @example
21
- * <queuer.Subscribe selector={(state) => ({ size: state.size })}>
22
- * {({ size }) => (
23
- * <div>Queue Size: {size}</div>
24
- * )}
25
- * </queuer.Subscribe>
26
- */
27
- Subscribe: <TSelected>(props: {
28
- selector: (state: QueuerState<TValue>) => TSelected;
29
- children: ((state: TSelected) => ComponentChildren) | ComponentChildren;
30
- }) => ComponentChildren;
31
- /**
32
- * Reactive state that will be updated and re-rendered when the queuer state changes
33
- *
34
- * Use this instead of `queuer.store.state`
35
- */
36
- readonly state: Readonly<TSelected>;
37
- /**
38
- * @deprecated Use `queuer.state` instead of `queuer.store.state` if you want to read reactive state.
39
- * The state on the store object is not reactive, as it has not been wrapped in a `useSelector` hook internally.
40
- * Although, you can make the state reactive by using the `useSelector` in your own usage.
41
- */
42
- readonly store: Store<Readonly<QueuerState<TValue>>>;
43
- }
44
- /**
45
- * A Preact hook that creates and manages a Queuer instance.
46
- *
47
- * This is a lower-level hook that provides direct access to the Queuer's functionality without
48
- * any built-in state management. This allows you to integrate it with any state management solution
49
- * you prefer (useState, Redux, Zustand, etc.) by utilizing the onItemsChange callback.
50
- *
51
- * For a hook with built-in state management, see useQueuedState.
52
- *
53
- * The Queuer extends the base Queue to add processing capabilities. Items are processed
54
- * synchronously in order, with optional delays between processing each item. The queuer includes
55
- * an internal tick mechanism that can be started and stopped, making it useful as a scheduler.
56
- * When started, it will process one item per tick, with an optional wait time between ticks.
57
- *
58
- * By default uses FIFO (First In First Out) behavior, but can be configured for LIFO
59
- * (Last In First Out) by specifying 'front' position when adding items.
60
- *
61
- * ## State Management and Selector
62
- *
63
- * The hook uses TanStack Store for reactive state management. You can subscribe to state changes
64
- * in two ways:
65
- *
66
- * **1. Using `queuer.Subscribe` HOC (Recommended for component tree subscriptions)**
67
- *
68
- * Use the `Subscribe` HOC to subscribe to state changes deep in your component tree without
69
- * needing to pass a selector to the hook. This is ideal when you want to subscribe to state
70
- * in child components.
71
- *
72
- * **2. Using the `selector` parameter (For hook-level subscriptions)**
73
- *
74
- * The `selector` parameter allows you to specify which state changes will trigger a re-render
75
- * at the hook level, optimizing performance by preventing unnecessary re-renders when irrelevant
76
- * state changes occur.
77
- *
78
- * **By default, there will be no reactive state subscriptions** and you must opt-in to state
79
- * tracking by providing a selector function or using the `Subscribe` HOC. This prevents unnecessary
80
- * re-renders and gives you full control over when your component updates.
81
- *
82
- * Available state properties:
83
- * - `executionCount`: Number of items that have been processed by the queuer
84
- * - `expirationCount`: Number of items that have been removed due to expiration
85
- * - `isEmpty`: Whether the queuer has no items to process
86
- * - `isFull`: Whether the queuer has reached its maximum capacity
87
- * - `isIdle`: Whether the queuer is not currently processing any items
88
- * - `isRunning`: Whether the queuer is active and will process items automatically
89
- * - `items`: Array of items currently waiting to be processed
90
- * - `itemTimestamps`: Timestamps when items were added for expiration tracking
91
- * - `pendingTick`: Whether the queuer has a pending timeout for processing the next item
92
- * - `rejectionCount`: Number of items that have been rejected from being added
93
- * - `size`: Number of items currently in the queue
94
- * - `status`: Current processing status ('idle' | 'running' | 'stopped')
95
- *
96
- * ## Unmount behavior
97
- *
98
- * By default, the hook stops the queuer when the component unmounts.
99
- * Use the `onUnmount` option to customize this. For example, to flush pending items instead:
100
- *
101
- * ```tsx
102
- * const queue = useQueuer(fn, {
103
- * started: true,
104
- * wait: 1000,
105
- * onUnmount: (q) => q.flush()
106
- * });
107
- * ```
108
- *
109
- * @example
110
- * ```tsx
111
- * // Default behavior - no reactive state subscriptions
112
- * const queue = useQueuer(
113
- * (item) => console.log('Processing:', item),
114
- * { started: true, wait: 1000 }
115
- * );
116
- *
117
- * // Subscribe to state changes deep in component tree using Subscribe HOC
118
- * <queue.Subscribe selector={(state) => ({ size: state.size })}>
119
- * {({ size }) => (
120
- * <div>Queue Size: {size}</div>
121
- * )}
122
- * </queue.Subscribe>
123
- *
124
- * // Opt-in to re-render when queue size changes at hook level (optimized for displaying queue length)
125
- * const queue = useQueuer(
126
- * (item) => console.log('Processing:', item),
127
- * { started: true, wait: 1000 },
128
- * (state) => ({
129
- * size: state.size,
130
- * isEmpty: state.isEmpty,
131
- * isFull: state.isFull
132
- * })
133
- * );
134
- *
135
- * // Opt-in to re-render when processing state changes (optimized for loading indicators)
136
- * const queue = useQueuer(
137
- * (item) => console.log('Processing:', item),
138
- * { started: true, wait: 1000 },
139
- * (state) => ({
140
- * isRunning: state.isRunning,
141
- * isIdle: state.isIdle,
142
- * status: state.status,
143
- * pendingTick: state.pendingTick
144
- * })
145
- * );
146
- *
147
- * // Opt-in to re-render when execution metrics change (optimized for stats display)
148
- * const queue = useQueuer(
149
- * (item) => console.log('Processing:', item),
150
- * { started: true, wait: 1000 },
151
- * (state) => ({
152
- * executionCount: state.executionCount,
153
- * expirationCount: state.expirationCount,
154
- * rejectionCount: state.rejectionCount
155
- * })
156
- * );
157
- *
158
- * // Example with custom state management and scheduling
159
- * const [items, setItems] = useState([]);
160
- *
161
- * const queue = useQueuer(
162
- * (item) => console.log('Processing:', item),
163
- * {
164
- * started: true, // Start processing immediately
165
- * wait: 1000, // Process one item every second
166
- * onItemsChange: (queue) => setItems(queue.peekAllItems()),
167
- * getPriority: (item) => item.priority // Process higher priority items first
168
- * }
169
- * );
170
- *
171
- * // Add items to process - they'll be handled automatically
172
- * queue.addItem('task1');
173
- * queue.addItem('task2');
174
- *
175
- * // Control the scheduler
176
- * queue.stop(); // Pause processing
177
- * queue.start(); // Resume processing
178
- *
179
- * // Access the selected state (will be empty object {} unless selector provided)
180
- * const { size, isRunning, executionCount } = queue.state;
181
- * ```
182
- */
183
- declare function useQueuer<TValue, TSelected = {}>(fn: (item: TValue) => void, options?: PreactQueuerOptions<TValue, TSelected>, selector?: (state: QueuerState<TValue>) => TSelected): PreactQueuer<TValue, TSelected>;
184
- //#endregion
185
- export { PreactQueuer, PreactQueuerOptions, useQueuer };
186
- //# sourceMappingURL=useQueuer.d.cts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useQueuer.js","names":[],"sources":["../../src/queuer/useQueuer.ts"],"sourcesContent":["import { useEffect, useMemo, useState } from 'preact/hooks'\nimport { Queuer } from '@tanstack/pacer/queuer'\nimport { shallow, useSelector } from '@tanstack/preact-store'\nimport { useDefaultPacerOptions } from '../provider/PacerProvider'\nimport type { Store } from '@tanstack/preact-store'\nimport type { QueuerOptions, QueuerState } from '@tanstack/pacer/queuer'\nimport type { ComponentChildren } from 'preact'\n\nexport interface PreactQueuerOptions<\n TValue,\n TSelected = {},\n> extends QueuerOptions<TValue> {\n /**\n * Optional callback invoked when the component unmounts. Receives the queuer instance.\n * When provided, replaces the default cleanup (stop); use it to call flush(), flushAsBatch(), stop(), add logging, etc.\n */\n onUnmount?: (queuer: PreactQueuer<TValue, TSelected>) => void\n}\n\nexport interface PreactQueuer<TValue, TSelected = {}> extends Omit<\n Queuer<TValue>,\n 'store'\n> {\n /**\n * A Preact HOC (Higher Order Component) that allows you to subscribe to the queuer state.\n *\n * This is useful for opting into state re-renders for specific parts of the queuer state\n * deep in your component tree without needing to pass a selector to the hook.\n *\n * @example\n * <queuer.Subscribe selector={(state) => ({ size: state.size })}>\n * {({ size }) => (\n * <div>Queue Size: {size}</div>\n * )}\n * </queuer.Subscribe>\n */\n Subscribe: <TSelected>(props: {\n selector: (state: QueuerState<TValue>) => TSelected\n children: ((state: TSelected) => ComponentChildren) | ComponentChildren\n }) => ComponentChildren\n /**\n * Reactive state that will be updated and re-rendered when the queuer state changes\n *\n * Use this instead of `queuer.store.state`\n */\n readonly state: Readonly<TSelected>\n /**\n * @deprecated Use `queuer.state` instead of `queuer.store.state` if you want to read reactive state.\n * The state on the store object is not reactive, as it has not been wrapped in a `useSelector` hook internally.\n * Although, you can make the state reactive by using the `useSelector` in your own usage.\n */\n readonly store: Store<Readonly<QueuerState<TValue>>>\n}\n\n/**\n * A Preact hook that creates and manages a Queuer instance.\n *\n * This is a lower-level hook that provides direct access to the Queuer's functionality without\n * any built-in state management. This allows you to integrate it with any state management solution\n * you prefer (useState, Redux, Zustand, etc.) by utilizing the onItemsChange callback.\n *\n * For a hook with built-in state management, see useQueuedState.\n *\n * The Queuer extends the base Queue to add processing capabilities. Items are processed\n * synchronously in order, with optional delays between processing each item. The queuer includes\n * an internal tick mechanism that can be started and stopped, making it useful as a scheduler.\n * When started, it will process one item per tick, with an optional wait time between ticks.\n *\n * By default uses FIFO (First In First Out) behavior, but can be configured for LIFO\n * (Last In First Out) by specifying 'front' position when adding items.\n *\n * ## State Management and Selector\n *\n * The hook uses TanStack Store for reactive state management. You can subscribe to state changes\n * in two ways:\n *\n * **1. Using `queuer.Subscribe` HOC (Recommended for component tree subscriptions)**\n *\n * Use the `Subscribe` HOC to subscribe to state changes deep in your component tree without\n * needing to pass a selector to the hook. This is ideal when you want to subscribe to state\n * in child components.\n *\n * **2. Using the `selector` parameter (For hook-level subscriptions)**\n *\n * The `selector` parameter allows you to specify which state changes will trigger a re-render\n * at the hook level, optimizing performance by preventing unnecessary re-renders when irrelevant\n * state changes occur.\n *\n * **By default, there will be no reactive state subscriptions** and you must opt-in to state\n * tracking by providing a selector function or using the `Subscribe` HOC. This prevents unnecessary\n * re-renders and gives you full control over when your component updates.\n *\n * Available state properties:\n * - `executionCount`: Number of items that have been processed by the queuer\n * - `expirationCount`: Number of items that have been removed due to expiration\n * - `isEmpty`: Whether the queuer has no items to process\n * - `isFull`: Whether the queuer has reached its maximum capacity\n * - `isIdle`: Whether the queuer is not currently processing any items\n * - `isRunning`: Whether the queuer is active and will process items automatically\n * - `items`: Array of items currently waiting to be processed\n * - `itemTimestamps`: Timestamps when items were added for expiration tracking\n * - `pendingTick`: Whether the queuer has a pending timeout for processing the next item\n * - `rejectionCount`: Number of items that have been rejected from being added\n * - `size`: Number of items currently in the queue\n * - `status`: Current processing status ('idle' | 'running' | 'stopped')\n *\n * ## Unmount behavior\n *\n * By default, the hook stops the queuer when the component unmounts.\n * Use the `onUnmount` option to customize this. For example, to flush pending items instead:\n *\n * ```tsx\n * const queue = useQueuer(fn, {\n * started: true,\n * wait: 1000,\n * onUnmount: (q) => q.flush()\n * });\n * ```\n *\n * @example\n * ```tsx\n * // Default behavior - no reactive state subscriptions\n * const queue = useQueuer(\n * (item) => console.log('Processing:', item),\n * { started: true, wait: 1000 }\n * );\n *\n * // Subscribe to state changes deep in component tree using Subscribe HOC\n * <queue.Subscribe selector={(state) => ({ size: state.size })}>\n * {({ size }) => (\n * <div>Queue Size: {size}</div>\n * )}\n * </queue.Subscribe>\n *\n * // Opt-in to re-render when queue size changes at hook level (optimized for displaying queue length)\n * const queue = useQueuer(\n * (item) => console.log('Processing:', item),\n * { started: true, wait: 1000 },\n * (state) => ({\n * size: state.size,\n * isEmpty: state.isEmpty,\n * isFull: state.isFull\n * })\n * );\n *\n * // Opt-in to re-render when processing state changes (optimized for loading indicators)\n * const queue = useQueuer(\n * (item) => console.log('Processing:', item),\n * { started: true, wait: 1000 },\n * (state) => ({\n * isRunning: state.isRunning,\n * isIdle: state.isIdle,\n * status: state.status,\n * pendingTick: state.pendingTick\n * })\n * );\n *\n * // Opt-in to re-render when execution metrics change (optimized for stats display)\n * const queue = useQueuer(\n * (item) => console.log('Processing:', item),\n * { started: true, wait: 1000 },\n * (state) => ({\n * executionCount: state.executionCount,\n * expirationCount: state.expirationCount,\n * rejectionCount: state.rejectionCount\n * })\n * );\n *\n * // Example with custom state management and scheduling\n * const [items, setItems] = useState([]);\n *\n * const queue = useQueuer(\n * (item) => console.log('Processing:', item),\n * {\n * started: true, // Start processing immediately\n * wait: 1000, // Process one item every second\n * onItemsChange: (queue) => setItems(queue.peekAllItems()),\n * getPriority: (item) => item.priority // Process higher priority items first\n * }\n * );\n *\n * // Add items to process - they'll be handled automatically\n * queue.addItem('task1');\n * queue.addItem('task2');\n *\n * // Control the scheduler\n * queue.stop(); // Pause processing\n * queue.start(); // Resume processing\n *\n * // Access the selected state (will be empty object {} unless selector provided)\n * const { size, isRunning, executionCount } = queue.state;\n * ```\n */\nexport function useQueuer<TValue, TSelected = {}>(\n fn: (item: TValue) => void,\n options: PreactQueuerOptions<TValue, TSelected> = {},\n selector: (state: QueuerState<TValue>) => TSelected = () => ({}) as TSelected,\n): PreactQueuer<TValue, TSelected> {\n const mergedOptions = {\n ...useDefaultPacerOptions().queuer,\n ...options,\n } as PreactQueuerOptions<TValue, TSelected>\n\n const [queuer] = useState(() => {\n const queuerInstance = new Queuer<TValue>(\n fn,\n mergedOptions,\n ) as unknown as PreactQueuer<TValue, TSelected>\n\n queuerInstance.Subscribe = function Subscribe<TSelected>(props: {\n selector: (state: QueuerState<TValue>) => TSelected\n children: ((state: TSelected) => ComponentChildren) | ComponentChildren\n }) {\n const selected = useSelector(queuerInstance.store, props.selector, {\n compare: shallow,\n })\n\n return typeof props.children === 'function'\n ? props.children(selected)\n : props.children\n }\n\n return queuerInstance\n })\n\n queuer.fn = fn\n queuer.setOptions(mergedOptions)\n\n /* eslint-disable react-hooks/exhaustive-deps -- cleanup only; runs on unmount */\n useEffect(() => {\n return () => {\n if (mergedOptions.onUnmount) {\n mergedOptions.onUnmount(queuer)\n } else {\n queuer.stop()\n }\n }\n }, [])\n /* eslint-enable react-hooks/exhaustive-deps */\n\n const state = useSelector(queuer.store, selector, { compare: shallow })\n\n return useMemo(\n () =>\n ({\n ...queuer,\n state,\n }) as PreactQueuer<TValue, TSelected>, // omit `store` in favor of `state`\n [queuer, state],\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiMA,SAAgB,UACd,IACA,UAAkD,EAAE,EACpD,kBAA6D,EAAE,GAC9B;CACjC,MAAM,gBAAgB;EACpB,GAAG,wBAAwB,CAAC;EAC5B,GAAG;EACJ;CAED,MAAM,CAAC,UAAU,eAAe;EAC9B,MAAM,iBAAiB,IAAI,OACzB,IACA,cACD;EAED,eAAe,YAAY,SAAS,UAAqB,OAGtD;GACD,MAAM,WAAW,YAAY,eAAe,OAAO,MAAM,UAAU,EACjE,SAAS,SACV,CAAC;GAEF,OAAO,OAAO,MAAM,aAAa,aAC7B,MAAM,SAAS,SAAS,GACxB,MAAM;;EAGZ,OAAO;GACP;CAEF,OAAO,KAAK;CACZ,OAAO,WAAW,cAAc;CAGhC,gBAAgB;EACd,aAAa;GACX,IAAI,cAAc,WAChB,cAAc,UAAU,OAAO;QAE/B,OAAO,MAAM;;IAGhB,EAAE,CAAC;CAGN,MAAM,QAAQ,YAAY,OAAO,OAAO,UAAU,EAAE,SAAS,SAAS,CAAC;CAEvE,OAAO,eAEF;EACC,GAAG;EACH;EACD,GACH,CAAC,QAAQ,MAAM,CAChB"}
@@ -1,17 +0,0 @@
1
- Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
2
- const require_useRateLimiter = require('./useRateLimiter.cjs');
3
- const require_useRateLimitedCallback = require('./useRateLimitedCallback.cjs');
4
- const require_useRateLimitedState = require('./useRateLimitedState.cjs');
5
- const require_useRateLimitedValue = require('./useRateLimitedValue.cjs');
6
-
7
- exports.useRateLimitedCallback = require_useRateLimitedCallback.useRateLimitedCallback;
8
- exports.useRateLimitedState = require_useRateLimitedState.useRateLimitedState;
9
- exports.useRateLimitedValue = require_useRateLimitedValue.useRateLimitedValue;
10
- exports.useRateLimiter = require_useRateLimiter.useRateLimiter;
11
- var _tanstack_pacer_rate_limiter = require("@tanstack/pacer/rate-limiter");
12
- Object.keys(_tanstack_pacer_rate_limiter).forEach(function (k) {
13
- if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
14
- enumerable: true,
15
- get: function () { return _tanstack_pacer_rate_limiter[k]; }
16
- });
17
- });
@@ -1,6 +0,0 @@
1
- import { PreactRateLimiter, PreactRateLimiterOptions, useRateLimiter } from "./useRateLimiter.cjs";
2
- import { useRateLimitedCallback } from "./useRateLimitedCallback.cjs";
3
- import { useRateLimitedState } from "./useRateLimitedState.cjs";
4
- import { useRateLimitedValue } from "./useRateLimitedValue.cjs";
5
- export * from "@tanstack/pacer/rate-limiter";
6
- export { PreactRateLimiter, PreactRateLimiterOptions, useRateLimitedCallback, useRateLimitedState, useRateLimitedValue, useRateLimiter };
@@ -1,65 +0,0 @@
1
- const require_useRateLimiter = require('./useRateLimiter.cjs');
2
- let preact_hooks = require("preact/hooks");
3
-
4
- //#region src/rate-limiter/useRateLimitedCallback.ts
5
- /**
6
- * A Preact hook that creates a rate-limited version of a callback function.
7
- * This hook is essentially a wrapper around the basic `rateLimiter` function
8
- * that is exported from `@tanstack/pacer`,
9
- * but optimized for Preact with reactive options and a stable function reference.
10
- *
11
- * Rate limiting is a simple "hard limit" approach - it allows all calls until the limit
12
- * is reached, then blocks subsequent calls until the window resets. Unlike throttling
13
- * or debouncing, it does not attempt to space out or intelligently collapse calls.
14
- * This can lead to bursts of rapid executions followed by periods where all calls
15
- * are blocked.
16
- *
17
- * The rate limiter supports two types of windows:
18
- * - 'fixed': A strict window that resets after the window period. All executions within the window count
19
- * towards the limit, and the window resets completely after the period.
20
- * - 'sliding': A rolling window that allows executions as old ones expire. This provides a more
21
- * consistent rate of execution over time.
22
- *
23
- * For smoother execution patterns, consider:
24
- * - useThrottledCallback: When you want consistent spacing between executions (e.g. UI updates)
25
- * - useDebouncedCallback: When you want to collapse rapid calls into a single execution (e.g. search input)
26
- *
27
- * Rate limiting should primarily be used when you need to enforce strict limits,
28
- * like API rate limits or other scenarios requiring hard caps on execution frequency.
29
- *
30
- * This hook provides a simpler API compared to `useRateLimiter`, making it ideal for basic
31
- * rate limiting needs. However, it does not expose the underlying RateLimiter 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 `useRateLimiter` hook instead.
39
- *
40
- * @example
41
- * ```tsx
42
- * // Rate limit API calls to maximum 5 calls per minute with a sliding window
43
- * const makeApiCall = useRateLimitedCallback(
44
- * (data: ApiData) => {
45
- * return fetch('/api/endpoint', { method: 'POST', body: JSON.stringify(data) });
46
- * },
47
- * {
48
- * limit: 5,
49
- * window: 60000, // 1 minute
50
- * windowType: 'sliding',
51
- * onReject: () => {
52
- * console.warn('API rate limit reached. Please wait before trying again.');
53
- * }
54
- * }
55
- * );
56
- * ```
57
- */
58
- function useRateLimitedCallback(fn, options) {
59
- const rateLimitedFn = require_useRateLimiter.useRateLimiter(fn, options).maybeExecute;
60
- return (0, preact_hooks.useCallback)((...args) => rateLimitedFn(...args), [rateLimitedFn]);
61
- }
62
-
63
- //#endregion
64
- exports.useRateLimitedCallback = useRateLimitedCallback;
65
- //# sourceMappingURL=useRateLimitedCallback.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useRateLimitedCallback.cjs","names":["useRateLimiter"],"sources":["../../src/rate-limiter/useRateLimitedCallback.ts"],"sourcesContent":["import { useCallback } from 'preact/hooks'\nimport { useRateLimiter } from './useRateLimiter'\nimport type { AnyFunction } from '@tanstack/pacer/types'\nimport type { PreactRateLimiterOptions } from './useRateLimiter'\n\n/**\n * A Preact hook that creates a rate-limited version of a callback function.\n * This hook is essentially a wrapper around the basic `rateLimiter` function\n * that is exported from `@tanstack/pacer`,\n * but optimized for Preact with reactive options and a stable function reference.\n *\n * Rate limiting is a simple \"hard limit\" approach - it allows all calls until the limit\n * is reached, then blocks subsequent calls until the window resets. Unlike throttling\n * or debouncing, it does not attempt to space out or intelligently collapse calls.\n * This can lead to bursts of rapid executions followed by periods where all calls\n * are blocked.\n *\n * The rate limiter supports two types of windows:\n * - 'fixed': A strict window that resets after the window period. All executions within the window count\n * towards the limit, and the window resets completely after the period.\n * - 'sliding': A rolling window that allows executions as old ones expire. This provides a more\n * consistent rate of execution over time.\n *\n * For smoother execution patterns, consider:\n * - useThrottledCallback: When you want consistent spacing between executions (e.g. UI updates)\n * - useDebouncedCallback: When you want to collapse rapid calls into a single execution (e.g. search input)\n *\n * Rate limiting should primarily be used when you need to enforce strict limits,\n * like API rate limits or other scenarios requiring hard caps on execution frequency.\n *\n * This hook provides a simpler API compared to `useRateLimiter`, making it ideal for basic\n * rate limiting needs. However, it does not expose the underlying RateLimiter instance.\n *\n * For advanced usage requiring features like:\n * - Manual cancellation\n * - Access to execution counts\n * - Custom useCallback dependencies\n *\n * Consider using the `useRateLimiter` hook instead.\n *\n * @example\n * ```tsx\n * // Rate limit API calls to maximum 5 calls per minute with a sliding window\n * const makeApiCall = useRateLimitedCallback(\n * (data: ApiData) => {\n * return fetch('/api/endpoint', { method: 'POST', body: JSON.stringify(data) });\n * },\n * {\n * limit: 5,\n * window: 60000, // 1 minute\n * windowType: 'sliding',\n * onReject: () => {\n * console.warn('API rate limit reached. Please wait before trying again.');\n * }\n * }\n * );\n * ```\n */\nexport function useRateLimitedCallback<TFn extends AnyFunction>(\n fn: TFn,\n options: PreactRateLimiterOptions<TFn, {}>,\n): (...args: Parameters<TFn>) => boolean {\n const rateLimitedFn = useRateLimiter(fn, options).maybeExecute\n return useCallback(\n (...args: Parameters<TFn>) => rateLimitedFn(...args),\n [rateLimitedFn],\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0DA,SAAgB,uBACd,IACA,SACuC;CACvC,MAAM,gBAAgBA,sCAAe,IAAI,QAAQ,CAAC;CAClD,sCACG,GAAG,SAA0B,cAAc,GAAG,KAAK,EACpD,CAAC,cAAc,CAChB"}
@@ -1,61 +0,0 @@
1
- import { PreactRateLimiterOptions } from "./useRateLimiter.cjs";
2
- import { AnyFunction } from "@tanstack/pacer/types";
3
-
4
- //#region src/rate-limiter/useRateLimitedCallback.d.ts
5
- /**
6
- * A Preact hook that creates a rate-limited version of a callback function.
7
- * This hook is essentially a wrapper around the basic `rateLimiter` function
8
- * that is exported from `@tanstack/pacer`,
9
- * but optimized for Preact with reactive options and a stable function reference.
10
- *
11
- * Rate limiting is a simple "hard limit" approach - it allows all calls until the limit
12
- * is reached, then blocks subsequent calls until the window resets. Unlike throttling
13
- * or debouncing, it does not attempt to space out or intelligently collapse calls.
14
- * This can lead to bursts of rapid executions followed by periods where all calls
15
- * are blocked.
16
- *
17
- * The rate limiter supports two types of windows:
18
- * - 'fixed': A strict window that resets after the window period. All executions within the window count
19
- * towards the limit, and the window resets completely after the period.
20
- * - 'sliding': A rolling window that allows executions as old ones expire. This provides a more
21
- * consistent rate of execution over time.
22
- *
23
- * For smoother execution patterns, consider:
24
- * - useThrottledCallback: When you want consistent spacing between executions (e.g. UI updates)
25
- * - useDebouncedCallback: When you want to collapse rapid calls into a single execution (e.g. search input)
26
- *
27
- * Rate limiting should primarily be used when you need to enforce strict limits,
28
- * like API rate limits or other scenarios requiring hard caps on execution frequency.
29
- *
30
- * This hook provides a simpler API compared to `useRateLimiter`, making it ideal for basic
31
- * rate limiting needs. However, it does not expose the underlying RateLimiter 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 `useRateLimiter` hook instead.
39
- *
40
- * @example
41
- * ```tsx
42
- * // Rate limit API calls to maximum 5 calls per minute with a sliding window
43
- * const makeApiCall = useRateLimitedCallback(
44
- * (data: ApiData) => {
45
- * return fetch('/api/endpoint', { method: 'POST', body: JSON.stringify(data) });
46
- * },
47
- * {
48
- * limit: 5,
49
- * window: 60000, // 1 minute
50
- * windowType: 'sliding',
51
- * onReject: () => {
52
- * console.warn('API rate limit reached. Please wait before trying again.');
53
- * }
54
- * }
55
- * );
56
- * ```
57
- */
58
- declare function useRateLimitedCallback<TFn extends AnyFunction>(fn: TFn, options: PreactRateLimiterOptions<TFn, {}>): (...args: Parameters<TFn>) => boolean;
59
- //#endregion
60
- export { useRateLimitedCallback };
61
- //# sourceMappingURL=useRateLimitedCallback.d.cts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useRateLimitedCallback.js","names":[],"sources":["../../src/rate-limiter/useRateLimitedCallback.ts"],"sourcesContent":["import { useCallback } from 'preact/hooks'\nimport { useRateLimiter } from './useRateLimiter'\nimport type { AnyFunction } from '@tanstack/pacer/types'\nimport type { PreactRateLimiterOptions } from './useRateLimiter'\n\n/**\n * A Preact hook that creates a rate-limited version of a callback function.\n * This hook is essentially a wrapper around the basic `rateLimiter` function\n * that is exported from `@tanstack/pacer`,\n * but optimized for Preact with reactive options and a stable function reference.\n *\n * Rate limiting is a simple \"hard limit\" approach - it allows all calls until the limit\n * is reached, then blocks subsequent calls until the window resets. Unlike throttling\n * or debouncing, it does not attempt to space out or intelligently collapse calls.\n * This can lead to bursts of rapid executions followed by periods where all calls\n * are blocked.\n *\n * The rate limiter supports two types of windows:\n * - 'fixed': A strict window that resets after the window period. All executions within the window count\n * towards the limit, and the window resets completely after the period.\n * - 'sliding': A rolling window that allows executions as old ones expire. This provides a more\n * consistent rate of execution over time.\n *\n * For smoother execution patterns, consider:\n * - useThrottledCallback: When you want consistent spacing between executions (e.g. UI updates)\n * - useDebouncedCallback: When you want to collapse rapid calls into a single execution (e.g. search input)\n *\n * Rate limiting should primarily be used when you need to enforce strict limits,\n * like API rate limits or other scenarios requiring hard caps on execution frequency.\n *\n * This hook provides a simpler API compared to `useRateLimiter`, making it ideal for basic\n * rate limiting needs. However, it does not expose the underlying RateLimiter instance.\n *\n * For advanced usage requiring features like:\n * - Manual cancellation\n * - Access to execution counts\n * - Custom useCallback dependencies\n *\n * Consider using the `useRateLimiter` hook instead.\n *\n * @example\n * ```tsx\n * // Rate limit API calls to maximum 5 calls per minute with a sliding window\n * const makeApiCall = useRateLimitedCallback(\n * (data: ApiData) => {\n * return fetch('/api/endpoint', { method: 'POST', body: JSON.stringify(data) });\n * },\n * {\n * limit: 5,\n * window: 60000, // 1 minute\n * windowType: 'sliding',\n * onReject: () => {\n * console.warn('API rate limit reached. Please wait before trying again.');\n * }\n * }\n * );\n * ```\n */\nexport function useRateLimitedCallback<TFn extends AnyFunction>(\n fn: TFn,\n options: PreactRateLimiterOptions<TFn, {}>,\n): (...args: Parameters<TFn>) => boolean {\n const rateLimitedFn = useRateLimiter(fn, options).maybeExecute\n return useCallback(\n (...args: Parameters<TFn>) => rateLimitedFn(...args),\n [rateLimitedFn],\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0DA,SAAgB,uBACd,IACA,SACuC;CACvC,MAAM,gBAAgB,eAAe,IAAI,QAAQ,CAAC;CAClD,OAAO,aACJ,GAAG,SAA0B,cAAc,GAAG,KAAK,EACpD,CAAC,cAAc,CAChB"}