@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.
- package/README.md +17 -2
- package/dist/async-batcher/useAsyncBatchedCallback.d.ts +2 -5
- package/dist/async-batcher/useAsyncBatchedCallback.js +1 -2
- package/dist/async-batcher/useAsyncBatcher.d.ts +4 -8
- package/dist/async-batcher/useAsyncBatcher.js +1 -3
- package/dist/async-debouncer/useAsyncDebouncedCallback.d.ts +6 -7
- package/dist/async-debouncer/useAsyncDebouncedCallback.js +5 -4
- package/dist/async-debouncer/useAsyncDebouncer.d.ts +4 -7
- package/dist/async-debouncer/useAsyncDebouncer.js +1 -2
- package/dist/async-queuer/useAsyncQueuedState.d.ts +4 -7
- package/dist/async-queuer/useAsyncQueuedState.js +3 -4
- package/dist/async-queuer/useAsyncQueuer.d.ts +6 -9
- package/dist/async-queuer/useAsyncQueuer.js +3 -4
- package/dist/async-rate-limiter/useAsyncRateLimitedCallback.d.ts +2 -5
- package/dist/async-rate-limiter/useAsyncRateLimitedCallback.js +1 -2
- package/dist/async-rate-limiter/useAsyncRateLimiter.d.ts +4 -7
- package/dist/async-rate-limiter/useAsyncRateLimiter.js +1 -2
- package/dist/async-throttler/useAsyncThrottledCallback.d.ts +7 -9
- package/dist/async-throttler/useAsyncThrottledCallback.js +6 -6
- package/dist/async-throttler/useAsyncThrottler.d.ts +4 -7
- package/dist/async-throttler/useAsyncThrottler.js +1 -2
- package/dist/batcher/useBatchedCallback.d.ts +2 -5
- package/dist/batcher/useBatchedCallback.js +1 -2
- package/dist/batcher/useBatcher.d.ts +6 -11
- package/dist/batcher/useBatcher.js +3 -6
- package/dist/debouncer/useDebouncedCallback.d.ts +2 -5
- package/dist/debouncer/useDebouncedCallback.js +1 -2
- package/dist/debouncer/useDebouncedState.d.ts +2 -5
- package/dist/debouncer/useDebouncedState.js +1 -2
- package/dist/debouncer/useDebouncedValue.d.ts +2 -5
- package/dist/debouncer/useDebouncedValue.js +1 -2
- package/dist/debouncer/useDebouncer.d.ts +4 -7
- package/dist/debouncer/useDebouncer.js +1 -2
- package/dist/provider/PacerProvider.d.ts +6 -13
- package/dist/provider/PacerProvider.js +1 -2
- package/dist/queuer/useQueuedState.d.ts +2 -5
- package/dist/queuer/useQueuedState.js +1 -2
- package/dist/queuer/useQueuedValue.d.ts +2 -5
- package/dist/queuer/useQueuedValue.js +1 -2
- package/dist/queuer/useQueuer.d.ts +4 -7
- package/dist/queuer/useQueuer.js +1 -2
- package/dist/rate-limiter/useRateLimitedCallback.d.ts +2 -5
- package/dist/rate-limiter/useRateLimitedCallback.js +1 -2
- package/dist/rate-limiter/useRateLimitedState.d.ts +2 -5
- package/dist/rate-limiter/useRateLimitedState.js +1 -2
- package/dist/rate-limiter/useRateLimitedValue.d.ts +2 -5
- package/dist/rate-limiter/useRateLimitedValue.js +1 -2
- package/dist/rate-limiter/useRateLimiter.d.ts +4 -7
- package/dist/rate-limiter/useRateLimiter.js +1 -2
- package/dist/throttler/useThrottledCallback.d.ts +2 -5
- package/dist/throttler/useThrottledCallback.js +1 -2
- package/dist/throttler/useThrottledState.d.ts +2 -5
- package/dist/throttler/useThrottledState.js +1 -2
- package/dist/throttler/useThrottledValue.d.ts +2 -5
- package/dist/throttler/useThrottledValue.js +1 -2
- package/dist/throttler/useThrottler.d.ts +4 -7
- package/dist/throttler/useThrottler.js +1 -2
- package/package.json +24 -72
- package/dist/async-batcher/index.cjs +0 -13
- package/dist/async-batcher/index.d.cts +0 -4
- package/dist/async-batcher/useAsyncBatchedCallback.cjs +0 -51
- package/dist/async-batcher/useAsyncBatchedCallback.cjs.map +0 -1
- package/dist/async-batcher/useAsyncBatchedCallback.d.cts +0 -44
- package/dist/async-batcher/useAsyncBatchedCallback.js.map +0 -1
- package/dist/async-batcher/useAsyncBatcher.cjs +0 -217
- package/dist/async-batcher/useAsyncBatcher.cjs.map +0 -1
- package/dist/async-batcher/useAsyncBatcher.d.cts +0 -224
- package/dist/async-batcher/useAsyncBatcher.js.map +0 -1
- package/dist/async-debouncer/index.cjs +0 -13
- package/dist/async-debouncer/index.d.cts +0 -4
- package/dist/async-debouncer/useAsyncDebouncedCallback.cjs +0 -50
- package/dist/async-debouncer/useAsyncDebouncedCallback.cjs.map +0 -1
- package/dist/async-debouncer/useAsyncDebouncedCallback.d.cts +0 -46
- package/dist/async-debouncer/useAsyncDebouncedCallback.js.map +0 -1
- package/dist/async-debouncer/useAsyncDebouncer.cjs +0 -195
- package/dist/async-debouncer/useAsyncDebouncer.cjs.map +0 -1
- package/dist/async-debouncer/useAsyncDebouncer.d.cts +0 -203
- package/dist/async-debouncer/useAsyncDebouncer.js.map +0 -1
- package/dist/async-queuer/index.cjs +0 -13
- package/dist/async-queuer/index.d.cts +0 -4
- package/dist/async-queuer/useAsyncQueuedState.cjs +0 -154
- package/dist/async-queuer/useAsyncQueuedState.cjs.map +0 -1
- package/dist/async-queuer/useAsyncQueuedState.d.cts +0 -151
- package/dist/async-queuer/useAsyncQueuedState.js.map +0 -1
- package/dist/async-queuer/useAsyncQueuer.cjs +0 -217
- package/dist/async-queuer/useAsyncQueuer.cjs.map +0 -1
- package/dist/async-queuer/useAsyncQueuer.d.cts +0 -224
- package/dist/async-queuer/useAsyncQueuer.js.map +0 -1
- package/dist/async-rate-limiter/index.cjs +0 -13
- package/dist/async-rate-limiter/index.d.cts +0 -4
- package/dist/async-rate-limiter/useAsyncRateLimitedCallback.cjs +0 -65
- package/dist/async-rate-limiter/useAsyncRateLimitedCallback.cjs.map +0 -1
- package/dist/async-rate-limiter/useAsyncRateLimitedCallback.d.cts +0 -61
- package/dist/async-rate-limiter/useAsyncRateLimitedCallback.js.map +0 -1
- package/dist/async-rate-limiter/useAsyncRateLimiter.cjs +0 -209
- package/dist/async-rate-limiter/useAsyncRateLimiter.cjs.map +0 -1
- package/dist/async-rate-limiter/useAsyncRateLimiter.d.cts +0 -220
- package/dist/async-rate-limiter/useAsyncRateLimiter.js.map +0 -1
- package/dist/async-retryer/index.cjs +0 -9
- package/dist/async-retryer/index.d.cts +0 -1
- package/dist/async-throttler/index.cjs +0 -13
- package/dist/async-throttler/index.d.cts +0 -4
- package/dist/async-throttler/useAsyncThrottledCallback.cjs +0 -48
- package/dist/async-throttler/useAsyncThrottledCallback.cjs.map +0 -1
- package/dist/async-throttler/useAsyncThrottledCallback.d.cts +0 -44
- package/dist/async-throttler/useAsyncThrottledCallback.js.map +0 -1
- package/dist/async-throttler/useAsyncThrottler.cjs +0 -206
- package/dist/async-throttler/useAsyncThrottler.cjs.map +0 -1
- package/dist/async-throttler/useAsyncThrottler.d.cts +0 -214
- package/dist/async-throttler/useAsyncThrottler.js.map +0 -1
- package/dist/batcher/index.cjs +0 -13
- package/dist/batcher/index.d.cts +0 -4
- package/dist/batcher/useBatchedCallback.cjs +0 -47
- package/dist/batcher/useBatchedCallback.cjs.map +0 -1
- package/dist/batcher/useBatchedCallback.d.cts +0 -42
- package/dist/batcher/useBatchedCallback.js.map +0 -1
- package/dist/batcher/useBatcher.cjs +0 -165
- package/dist/batcher/useBatcher.cjs.map +0 -1
- package/dist/batcher/useBatcher.d.cts +0 -175
- package/dist/batcher/useBatcher.js.map +0 -1
- package/dist/debouncer/index.cjs +0 -17
- package/dist/debouncer/index.d.cts +0 -6
- package/dist/debouncer/useDebouncedCallback.cjs +0 -48
- package/dist/debouncer/useDebouncedCallback.cjs.map +0 -1
- package/dist/debouncer/useDebouncedCallback.d.cts +0 -44
- package/dist/debouncer/useDebouncedCallback.js.map +0 -1
- package/dist/debouncer/useDebouncedState.cjs +0 -89
- package/dist/debouncer/useDebouncedState.cjs.map +0 -1
- package/dist/debouncer/useDebouncedState.d.cts +0 -81
- package/dist/debouncer/useDebouncedState.js.map +0 -1
- package/dist/debouncer/useDebouncedValue.cjs +0 -96
- package/dist/debouncer/useDebouncedValue.cjs.map +0 -1
- package/dist/debouncer/useDebouncedValue.d.cts +0 -90
- package/dist/debouncer/useDebouncedValue.js.map +0 -1
- package/dist/debouncer/useDebouncer.cjs +0 -141
- package/dist/debouncer/useDebouncer.cjs.map +0 -1
- package/dist/debouncer/useDebouncer.d.cts +0 -152
- package/dist/debouncer/useDebouncer.js.map +0 -1
- package/dist/index.cjs +0 -67
- package/dist/index.d.cts +0 -30
- package/dist/provider/PacerProvider.cjs +0 -26
- package/dist/provider/PacerProvider.cjs.map +0 -1
- package/dist/provider/PacerProvider.d.cts +0 -33
- package/dist/provider/PacerProvider.js.map +0 -1
- package/dist/provider/index.cjs +0 -6
- package/dist/provider/index.d.cts +0 -2
- package/dist/queuer/index.cjs +0 -15
- package/dist/queuer/index.d.cts +0 -5
- package/dist/queuer/useQueuedState.cjs +0 -129
- package/dist/queuer/useQueuedState.cjs.map +0 -1
- package/dist/queuer/useQueuedState.d.cts +0 -122
- package/dist/queuer/useQueuedState.js.map +0 -1
- package/dist/queuer/useQueuedValue.cjs +0 -115
- package/dist/queuer/useQueuedValue.cjs.map +0 -1
- package/dist/queuer/useQueuedValue.d.cts +0 -105
- package/dist/queuer/useQueuedValue.js.map +0 -1
- package/dist/queuer/useQueuer.cjs +0 -176
- package/dist/queuer/useQueuer.cjs.map +0 -1
- package/dist/queuer/useQueuer.d.cts +0 -186
- package/dist/queuer/useQueuer.js.map +0 -1
- package/dist/rate-limiter/index.cjs +0 -17
- package/dist/rate-limiter/index.d.cts +0 -6
- package/dist/rate-limiter/useRateLimitedCallback.cjs +0 -65
- package/dist/rate-limiter/useRateLimitedCallback.cjs.map +0 -1
- package/dist/rate-limiter/useRateLimitedCallback.d.cts +0 -61
- package/dist/rate-limiter/useRateLimitedCallback.js.map +0 -1
- package/dist/rate-limiter/useRateLimitedState.cjs +0 -115
- package/dist/rate-limiter/useRateLimitedState.cjs.map +0 -1
- package/dist/rate-limiter/useRateLimitedState.d.cts +0 -107
- package/dist/rate-limiter/useRateLimitedState.js.map +0 -1
- package/dist/rate-limiter/useRateLimitedValue.cjs +0 -102
- package/dist/rate-limiter/useRateLimitedValue.cjs.map +0 -1
- package/dist/rate-limiter/useRateLimitedValue.d.cts +0 -96
- package/dist/rate-limiter/useRateLimitedValue.js.map +0 -1
- package/dist/rate-limiter/useRateLimiter.cjs +0 -167
- package/dist/rate-limiter/useRateLimiter.cjs.map +0 -1
- package/dist/rate-limiter/useRateLimiter.d.cts +0 -179
- package/dist/rate-limiter/useRateLimiter.js.map +0 -1
- package/dist/throttler/index.cjs +0 -17
- package/dist/throttler/index.d.cts +0 -6
- package/dist/throttler/useThrottledCallback.cjs +0 -49
- package/dist/throttler/useThrottledCallback.cjs.map +0 -1
- package/dist/throttler/useThrottledCallback.d.cts +0 -45
- package/dist/throttler/useThrottledCallback.js.map +0 -1
- package/dist/throttler/useThrottledState.cjs +0 -100
- package/dist/throttler/useThrottledState.cjs.map +0 -1
- package/dist/throttler/useThrottledState.d.cts +0 -92
- package/dist/throttler/useThrottledState.js.map +0 -1
- package/dist/throttler/useThrottledValue.cjs +0 -91
- package/dist/throttler/useThrottledValue.cjs.map +0 -1
- package/dist/throttler/useThrottledValue.d.cts +0 -85
- package/dist/throttler/useThrottledValue.js.map +0 -1
- package/dist/throttler/useThrottler.cjs +0 -146
- package/dist/throttler/useThrottler.cjs.map +0 -1
- package/dist/throttler/useThrottler.d.cts +0 -157
- package/dist/throttler/useThrottler.js.map +0 -1
- package/dist/types/index.cjs +0 -9
- package/dist/types/index.d.cts +0 -1
- package/dist/utils/index.cjs +0 -9
- package/dist/utils/index.d.cts +0 -1
- package/src/async-batcher/index.ts +0 -4
- package/src/async-batcher/useAsyncBatchedCallback.ts +0 -53
- package/src/async-batcher/useAsyncBatcher.ts +0 -293
- package/src/async-debouncer/index.ts +0 -5
- package/src/async-debouncer/useAsyncDebouncedCallback.ts +0 -54
- package/src/async-debouncer/useAsyncDebouncer.ts +0 -274
- package/src/async-queuer/index.ts +0 -4
- package/src/async-queuer/useAsyncQueuedState.ts +0 -165
- package/src/async-queuer/useAsyncQueuer.ts +0 -293
- package/src/async-rate-limiter/index.ts +0 -5
- package/src/async-rate-limiter/useAsyncRateLimitedCallback.ts +0 -69
- package/src/async-rate-limiter/useAsyncRateLimiter.ts +0 -294
- package/src/async-retryer/index.ts +0 -2
- package/src/async-throttler/index.ts +0 -5
- package/src/async-throttler/useAsyncThrottledCallback.ts +0 -52
- package/src/async-throttler/useAsyncThrottler.ts +0 -285
- package/src/batcher/index.ts +0 -4
- package/src/batcher/useBatchedCallback.ts +0 -46
- package/src/batcher/useBatcher.ts +0 -241
- package/src/debouncer/index.ts +0 -7
- package/src/debouncer/useDebouncedCallback.ts +0 -51
- package/src/debouncer/useDebouncedState.ts +0 -106
- package/src/debouncer/useDebouncedValue.ts +0 -109
- package/src/debouncer/useDebouncer.ts +0 -219
- package/src/index.ts +0 -56
- package/src/provider/PacerProvider.tsx +0 -70
- package/src/provider/index.ts +0 -1
- package/src/queuer/index.ts +0 -5
- package/src/queuer/useQueuedState.ts +0 -133
- package/src/queuer/useQueuedValue.ts +0 -129
- package/src/queuer/useQueuer.ts +0 -251
- package/src/rate-limiter/index.ts +0 -6
- package/src/rate-limiter/useRateLimitedCallback.ts +0 -68
- package/src/rate-limiter/useRateLimitedState.ts +0 -124
- package/src/rate-limiter/useRateLimitedValue.ts +0 -110
- package/src/rate-limiter/useRateLimiter.ts +0 -244
- package/src/throttler/index.ts +0 -7
- package/src/throttler/useThrottledCallback.ts +0 -52
- package/src/throttler/useThrottledState.ts +0 -118
- package/src/throttler/useThrottledValue.ts +0 -104
- package/src/throttler/useThrottler.ts +0 -224
- package/src/types/index.ts +0 -1
- package/src/utils/index.ts +0 -1
|
@@ -1,154 +0,0 @@
|
|
|
1
|
-
const require_useAsyncQueuer = require('./useAsyncQueuer.cjs');
|
|
2
|
-
|
|
3
|
-
//#region src/async-queuer/useAsyncQueuedState.ts
|
|
4
|
-
/**
|
|
5
|
-
* A higher-level Preact hook that creates an `AsyncQueuer` instance with built-in state management.
|
|
6
|
-
*
|
|
7
|
-
* This hook combines an AsyncQueuer with Preact state to automatically track the queue items.
|
|
8
|
-
* It returns a tuple containing:
|
|
9
|
-
* - The current array of queued items as Preact state
|
|
10
|
-
* - The queuer instance with methods to control the queue
|
|
11
|
-
*
|
|
12
|
-
* The queue can be configured with:
|
|
13
|
-
* - Maximum concurrent operations
|
|
14
|
-
* - Maximum queue size
|
|
15
|
-
* - Processing function for queue items
|
|
16
|
-
* - Various lifecycle callbacks
|
|
17
|
-
*
|
|
18
|
-
* The state will automatically update whenever items are:
|
|
19
|
-
* - Added to the queue
|
|
20
|
-
* - Removed from the queue
|
|
21
|
-
* - Started processing
|
|
22
|
-
* - Completed processing
|
|
23
|
-
*
|
|
24
|
-
* ## State Management and Selector
|
|
25
|
-
*
|
|
26
|
-
* The hook uses TanStack Store for reactive state management via the underlying async queuer instance.
|
|
27
|
-
* The `selector` parameter allows you to specify which async queuer state changes will trigger a re-render,
|
|
28
|
-
* optimizing performance by preventing unnecessary re-renders when irrelevant state changes occur.
|
|
29
|
-
*
|
|
30
|
-
* **By default, there will be no reactive state subscriptions** and you must opt-in to state
|
|
31
|
-
* tracking by providing a selector function. This prevents unnecessary re-renders and gives you
|
|
32
|
-
* full control over when your component updates. Only when you provide a selector will the
|
|
33
|
-
* component re-render when the selected state values change.
|
|
34
|
-
*
|
|
35
|
-
* Available async queuer state properties:
|
|
36
|
-
* - `activeItems`: Items currently being processed by the queuer
|
|
37
|
-
* - `errorCount`: Number of task executions that have resulted in errors
|
|
38
|
-
* - `expirationCount`: Number of items that have been removed due to expiration
|
|
39
|
-
* - `isEmpty`: Whether the queuer has no items to process
|
|
40
|
-
* - `isFull`: Whether the queuer has reached its maximum capacity
|
|
41
|
-
* - `isIdle`: Whether the queuer is not currently processing any items
|
|
42
|
-
* - `isRunning`: Whether the queuer is active and will process items automatically
|
|
43
|
-
* - `items`: Array of items currently waiting to be processed
|
|
44
|
-
* - `itemTimestamps`: Timestamps when items were added for expiration tracking
|
|
45
|
-
* - `lastResult`: The result from the most recent task execution
|
|
46
|
-
* - `pendingTick`: Whether the queuer has a pending timeout for processing the next item
|
|
47
|
-
* - `rejectionCount`: Number of items that have been rejected from being added
|
|
48
|
-
* - `settledCount`: Number of task executions that have completed (success or error)
|
|
49
|
-
* - `size`: Number of items currently in the queue
|
|
50
|
-
* - `status`: Current processing status ('idle' | 'running' | 'stopped')
|
|
51
|
-
* - `successCount`: Number of task executions that have completed successfully
|
|
52
|
-
*
|
|
53
|
-
* @example
|
|
54
|
-
* ```tsx
|
|
55
|
-
* // Default behavior - no reactive state subscriptions
|
|
56
|
-
* const [queueItems, asyncQueuer] = useAsyncQueuedState(
|
|
57
|
-
* async (item) => {
|
|
58
|
-
* const result = await processItem(item);
|
|
59
|
-
* return result;
|
|
60
|
-
* },
|
|
61
|
-
* {
|
|
62
|
-
* concurrency: 2,
|
|
63
|
-
* maxSize: 100,
|
|
64
|
-
* started: true
|
|
65
|
-
* }
|
|
66
|
-
* );
|
|
67
|
-
*
|
|
68
|
-
* // Opt-in to re-render when queue contents change (optimized for displaying queue items)
|
|
69
|
-
* const [queueItems, asyncQueuer] = useAsyncQueuedState(
|
|
70
|
-
* async (item) => {
|
|
71
|
-
* const result = await processItem(item);
|
|
72
|
-
* return result;
|
|
73
|
-
* },
|
|
74
|
-
* { concurrency: 2, maxSize: 100, started: true },
|
|
75
|
-
* (state) => ({
|
|
76
|
-
* items: state.items,
|
|
77
|
-
* size: state.size,
|
|
78
|
-
* isEmpty: state.isEmpty,
|
|
79
|
-
* isFull: state.isFull
|
|
80
|
-
* })
|
|
81
|
-
* );
|
|
82
|
-
*
|
|
83
|
-
* // Opt-in to re-render when processing state changes (optimized for loading indicators)
|
|
84
|
-
* const [queueItems, asyncQueuer] = useAsyncQueuedState(
|
|
85
|
-
* async (item) => {
|
|
86
|
-
* const result = await processItem(item);
|
|
87
|
-
* return result;
|
|
88
|
-
* },
|
|
89
|
-
* { concurrency: 2, maxSize: 100, started: true },
|
|
90
|
-
* (state) => ({
|
|
91
|
-
* isRunning: state.isRunning,
|
|
92
|
-
* isIdle: state.isIdle,
|
|
93
|
-
* status: state.status,
|
|
94
|
-
* activeItems: state.activeItems,
|
|
95
|
-
* pendingTick: state.pendingTick
|
|
96
|
-
* })
|
|
97
|
-
* );
|
|
98
|
-
*
|
|
99
|
-
* // Opt-in to re-render when execution metrics change (optimized for stats display)
|
|
100
|
-
* const [queueItems, asyncQueuer] = useAsyncQueuedState(
|
|
101
|
-
* async (item) => {
|
|
102
|
-
* const result = await processItem(item);
|
|
103
|
-
* return result;
|
|
104
|
-
* },
|
|
105
|
-
* { concurrency: 2, maxSize: 100, started: true },
|
|
106
|
-
* (state) => ({
|
|
107
|
-
* successCount: state.successCount,
|
|
108
|
-
* errorCount: state.errorCount,
|
|
109
|
-
* settledCount: state.settledCount,
|
|
110
|
-
* expirationCount: state.expirationCount,
|
|
111
|
-
* rejectionCount: state.rejectionCount
|
|
112
|
-
* })
|
|
113
|
-
* );
|
|
114
|
-
*
|
|
115
|
-
* // Opt-in to re-render when results are available (optimized for data display)
|
|
116
|
-
* const [queueItems, asyncQueuer] = useAsyncQueuedState(
|
|
117
|
-
* async (item) => {
|
|
118
|
-
* const result = await processItem(item);
|
|
119
|
-
* return result;
|
|
120
|
-
* },
|
|
121
|
-
* { concurrency: 2, maxSize: 100, started: true },
|
|
122
|
-
* (state) => ({
|
|
123
|
-
* lastResult: state.lastResult,
|
|
124
|
-
* successCount: state.successCount
|
|
125
|
-
* })
|
|
126
|
-
* );
|
|
127
|
-
*
|
|
128
|
-
* // Add items to queue - state updates automatically
|
|
129
|
-
* asyncQueuer.addItem(async () => {
|
|
130
|
-
* const result = await fetchData();
|
|
131
|
-
* return result;
|
|
132
|
-
* });
|
|
133
|
-
*
|
|
134
|
-
* // Start processing
|
|
135
|
-
* asyncQueuer.start();
|
|
136
|
-
*
|
|
137
|
-
* // Stop processing
|
|
138
|
-
* asyncQueuer.stop();
|
|
139
|
-
*
|
|
140
|
-
* // queueItems reflects current queue state
|
|
141
|
-
* const pendingCount = asyncQueuer.peekPendingItems().length;
|
|
142
|
-
*
|
|
143
|
-
* // Access the selected async queuer state (will be empty object {} unless selector provided)
|
|
144
|
-
* const { size, isRunning, activeItems } = asyncQueuer.state;
|
|
145
|
-
* ```
|
|
146
|
-
*/
|
|
147
|
-
function useAsyncQueuedState(fn, options = {}, selector) {
|
|
148
|
-
const asyncQueuer = require_useAsyncQueuer.useAsyncQueuer(fn, options, selector);
|
|
149
|
-
return [asyncQueuer.state.items, asyncQueuer];
|
|
150
|
-
}
|
|
151
|
-
|
|
152
|
-
//#endregion
|
|
153
|
-
exports.useAsyncQueuedState = useAsyncQueuedState;
|
|
154
|
-
//# sourceMappingURL=useAsyncQueuedState.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useAsyncQueuedState.cjs","names":["useAsyncQueuer"],"sources":["../../src/async-queuer/useAsyncQueuedState.ts"],"sourcesContent":["import { useAsyncQueuer } from './useAsyncQueuer'\nimport type {\n PreactAsyncQueuer,\n PreactAsyncQueuerOptions,\n} from './useAsyncQueuer'\nimport type { AsyncQueuerState } from '@tanstack/pacer/async-queuer'\n\n/**\n * A higher-level Preact hook that creates an `AsyncQueuer` instance with built-in state management.\n *\n * This hook combines an AsyncQueuer with Preact state to automatically track the queue items.\n * It returns a tuple containing:\n * - The current array of queued items as Preact state\n * - The queuer instance with methods to control the queue\n *\n * The queue can be configured with:\n * - Maximum concurrent operations\n * - Maximum queue size\n * - Processing function for queue items\n * - Various lifecycle callbacks\n *\n * The state will automatically update whenever items are:\n * - Added to the queue\n * - Removed from the queue\n * - Started processing\n * - Completed processing\n *\n * ## State Management and Selector\n *\n * The hook uses TanStack Store for reactive state management via the underlying async queuer instance.\n * The `selector` parameter allows you to specify which async queuer state changes will trigger a re-render,\n * optimizing performance by preventing unnecessary re-renders when irrelevant 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. This prevents unnecessary re-renders and gives you\n * full control over when your component updates. Only when you provide a selector will the\n * component re-render when the selected state values change.\n *\n * Available async queuer state properties:\n * - `activeItems`: Items currently being processed by the queuer\n * - `errorCount`: Number of task executions that have resulted in errors\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 * - `lastResult`: The result from the most recent task execution\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 * - `settledCount`: Number of task executions that have completed (success or error)\n * - `size`: Number of items currently in the queue\n * - `status`: Current processing status ('idle' | 'running' | 'stopped')\n * - `successCount`: Number of task executions that have completed successfully\n *\n * @example\n * ```tsx\n * // Default behavior - no reactive state subscriptions\n * const [queueItems, asyncQueuer] = useAsyncQueuedState(\n * async (item) => {\n * const result = await processItem(item);\n * return result;\n * },\n * {\n * concurrency: 2,\n * maxSize: 100,\n * started: true\n * }\n * );\n *\n * // Opt-in to re-render when queue contents change (optimized for displaying queue items)\n * const [queueItems, asyncQueuer] = useAsyncQueuedState(\n * async (item) => {\n * const result = await processItem(item);\n * return result;\n * },\n * { concurrency: 2, maxSize: 100, started: true },\n * (state) => ({\n * items: state.items,\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 [queueItems, asyncQueuer] = useAsyncQueuedState(\n * async (item) => {\n * const result = await processItem(item);\n * return result;\n * },\n * { concurrency: 2, maxSize: 100, started: true },\n * (state) => ({\n * isRunning: state.isRunning,\n * isIdle: state.isIdle,\n * status: state.status,\n * activeItems: state.activeItems,\n * pendingTick: state.pendingTick\n * })\n * );\n *\n * // Opt-in to re-render when execution metrics change (optimized for stats display)\n * const [queueItems, asyncQueuer] = useAsyncQueuedState(\n * async (item) => {\n * const result = await processItem(item);\n * return result;\n * },\n * { concurrency: 2, maxSize: 100, started: true },\n * (state) => ({\n * successCount: state.successCount,\n * errorCount: state.errorCount,\n * settledCount: state.settledCount,\n * expirationCount: state.expirationCount,\n * rejectionCount: state.rejectionCount\n * })\n * );\n *\n * // Opt-in to re-render when results are available (optimized for data display)\n * const [queueItems, asyncQueuer] = useAsyncQueuedState(\n * async (item) => {\n * const result = await processItem(item);\n * return result;\n * },\n * { concurrency: 2, maxSize: 100, started: true },\n * (state) => ({\n * lastResult: state.lastResult,\n * successCount: state.successCount\n * })\n * );\n *\n * // Add items to queue - state updates automatically\n * asyncQueuer.addItem(async () => {\n * const result = await fetchData();\n * return result;\n * });\n *\n * // Start processing\n * asyncQueuer.start();\n *\n * // Stop processing\n * asyncQueuer.stop();\n *\n * // queueItems reflects current queue state\n * const pendingCount = asyncQueuer.peekPendingItems().length;\n *\n * // Access the selected async queuer state (will be empty object {} unless selector provided)\n * const { size, isRunning, activeItems } = asyncQueuer.state;\n * ```\n */\nexport function useAsyncQueuedState<\n TValue,\n TSelected extends Pick<AsyncQueuerState<TValue>, 'items'> = Pick<\n AsyncQueuerState<TValue>,\n 'items'\n >,\n>(\n fn: (value: TValue) => Promise<any>,\n options: PreactAsyncQueuerOptions<TValue, TSelected> = {},\n selector?: (state: AsyncQueuerState<TValue>) => TSelected,\n): [Array<TValue>, PreactAsyncQueuer<TValue, TSelected>] {\n const asyncQueuer = useAsyncQueuer(fn, options, selector)\n\n return [asyncQueuer.state.items, asyncQueuer]\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsJA,SAAgB,oBAOd,IACA,UAAuD,EAAE,EACzD,UACuD;CACvD,MAAM,cAAcA,sCAAe,IAAI,SAAS,SAAS;CAEzD,OAAO,CAAC,YAAY,MAAM,OAAO,YAAY"}
|
|
@@ -1,151 +0,0 @@
|
|
|
1
|
-
import { PreactAsyncQueuer, PreactAsyncQueuerOptions } from "./useAsyncQueuer.cjs";
|
|
2
|
-
import { AsyncQueuerState } from "@tanstack/pacer/async-queuer";
|
|
3
|
-
|
|
4
|
-
//#region src/async-queuer/useAsyncQueuedState.d.ts
|
|
5
|
-
/**
|
|
6
|
-
* A higher-level Preact hook that creates an `AsyncQueuer` instance with built-in state management.
|
|
7
|
-
*
|
|
8
|
-
* This hook combines an AsyncQueuer with Preact state to automatically track the queue items.
|
|
9
|
-
* It returns a tuple containing:
|
|
10
|
-
* - The current array of queued items as Preact state
|
|
11
|
-
* - The queuer instance with methods to control the queue
|
|
12
|
-
*
|
|
13
|
-
* The queue can be configured with:
|
|
14
|
-
* - Maximum concurrent operations
|
|
15
|
-
* - Maximum queue size
|
|
16
|
-
* - Processing function for queue items
|
|
17
|
-
* - Various lifecycle callbacks
|
|
18
|
-
*
|
|
19
|
-
* The state will automatically update whenever items are:
|
|
20
|
-
* - Added to the queue
|
|
21
|
-
* - Removed from the queue
|
|
22
|
-
* - Started processing
|
|
23
|
-
* - Completed processing
|
|
24
|
-
*
|
|
25
|
-
* ## State Management and Selector
|
|
26
|
-
*
|
|
27
|
-
* The hook uses TanStack Store for reactive state management via the underlying async queuer instance.
|
|
28
|
-
* The `selector` parameter allows you to specify which async queuer state changes will trigger a re-render,
|
|
29
|
-
* optimizing performance by preventing unnecessary re-renders when irrelevant state changes occur.
|
|
30
|
-
*
|
|
31
|
-
* **By default, there will be no reactive state subscriptions** and you must opt-in to state
|
|
32
|
-
* tracking by providing a selector function. This prevents unnecessary re-renders and gives you
|
|
33
|
-
* full control over when your component updates. Only when you provide a selector will the
|
|
34
|
-
* component re-render when the selected state values change.
|
|
35
|
-
*
|
|
36
|
-
* Available async queuer state properties:
|
|
37
|
-
* - `activeItems`: Items currently being processed by the queuer
|
|
38
|
-
* - `errorCount`: Number of task executions that have resulted in errors
|
|
39
|
-
* - `expirationCount`: Number of items that have been removed due to expiration
|
|
40
|
-
* - `isEmpty`: Whether the queuer has no items to process
|
|
41
|
-
* - `isFull`: Whether the queuer has reached its maximum capacity
|
|
42
|
-
* - `isIdle`: Whether the queuer is not currently processing any items
|
|
43
|
-
* - `isRunning`: Whether the queuer is active and will process items automatically
|
|
44
|
-
* - `items`: Array of items currently waiting to be processed
|
|
45
|
-
* - `itemTimestamps`: Timestamps when items were added for expiration tracking
|
|
46
|
-
* - `lastResult`: The result from the most recent task execution
|
|
47
|
-
* - `pendingTick`: Whether the queuer has a pending timeout for processing the next item
|
|
48
|
-
* - `rejectionCount`: Number of items that have been rejected from being added
|
|
49
|
-
* - `settledCount`: Number of task executions that have completed (success or error)
|
|
50
|
-
* - `size`: Number of items currently in the queue
|
|
51
|
-
* - `status`: Current processing status ('idle' | 'running' | 'stopped')
|
|
52
|
-
* - `successCount`: Number of task executions that have completed successfully
|
|
53
|
-
*
|
|
54
|
-
* @example
|
|
55
|
-
* ```tsx
|
|
56
|
-
* // Default behavior - no reactive state subscriptions
|
|
57
|
-
* const [queueItems, asyncQueuer] = useAsyncQueuedState(
|
|
58
|
-
* async (item) => {
|
|
59
|
-
* const result = await processItem(item);
|
|
60
|
-
* return result;
|
|
61
|
-
* },
|
|
62
|
-
* {
|
|
63
|
-
* concurrency: 2,
|
|
64
|
-
* maxSize: 100,
|
|
65
|
-
* started: true
|
|
66
|
-
* }
|
|
67
|
-
* );
|
|
68
|
-
*
|
|
69
|
-
* // Opt-in to re-render when queue contents change (optimized for displaying queue items)
|
|
70
|
-
* const [queueItems, asyncQueuer] = useAsyncQueuedState(
|
|
71
|
-
* async (item) => {
|
|
72
|
-
* const result = await processItem(item);
|
|
73
|
-
* return result;
|
|
74
|
-
* },
|
|
75
|
-
* { concurrency: 2, maxSize: 100, started: true },
|
|
76
|
-
* (state) => ({
|
|
77
|
-
* items: state.items,
|
|
78
|
-
* size: state.size,
|
|
79
|
-
* isEmpty: state.isEmpty,
|
|
80
|
-
* isFull: state.isFull
|
|
81
|
-
* })
|
|
82
|
-
* );
|
|
83
|
-
*
|
|
84
|
-
* // Opt-in to re-render when processing state changes (optimized for loading indicators)
|
|
85
|
-
* const [queueItems, asyncQueuer] = useAsyncQueuedState(
|
|
86
|
-
* async (item) => {
|
|
87
|
-
* const result = await processItem(item);
|
|
88
|
-
* return result;
|
|
89
|
-
* },
|
|
90
|
-
* { concurrency: 2, maxSize: 100, started: true },
|
|
91
|
-
* (state) => ({
|
|
92
|
-
* isRunning: state.isRunning,
|
|
93
|
-
* isIdle: state.isIdle,
|
|
94
|
-
* status: state.status,
|
|
95
|
-
* activeItems: state.activeItems,
|
|
96
|
-
* pendingTick: state.pendingTick
|
|
97
|
-
* })
|
|
98
|
-
* );
|
|
99
|
-
*
|
|
100
|
-
* // Opt-in to re-render when execution metrics change (optimized for stats display)
|
|
101
|
-
* const [queueItems, asyncQueuer] = useAsyncQueuedState(
|
|
102
|
-
* async (item) => {
|
|
103
|
-
* const result = await processItem(item);
|
|
104
|
-
* return result;
|
|
105
|
-
* },
|
|
106
|
-
* { concurrency: 2, maxSize: 100, started: true },
|
|
107
|
-
* (state) => ({
|
|
108
|
-
* successCount: state.successCount,
|
|
109
|
-
* errorCount: state.errorCount,
|
|
110
|
-
* settledCount: state.settledCount,
|
|
111
|
-
* expirationCount: state.expirationCount,
|
|
112
|
-
* rejectionCount: state.rejectionCount
|
|
113
|
-
* })
|
|
114
|
-
* );
|
|
115
|
-
*
|
|
116
|
-
* // Opt-in to re-render when results are available (optimized for data display)
|
|
117
|
-
* const [queueItems, asyncQueuer] = useAsyncQueuedState(
|
|
118
|
-
* async (item) => {
|
|
119
|
-
* const result = await processItem(item);
|
|
120
|
-
* return result;
|
|
121
|
-
* },
|
|
122
|
-
* { concurrency: 2, maxSize: 100, started: true },
|
|
123
|
-
* (state) => ({
|
|
124
|
-
* lastResult: state.lastResult,
|
|
125
|
-
* successCount: state.successCount
|
|
126
|
-
* })
|
|
127
|
-
* );
|
|
128
|
-
*
|
|
129
|
-
* // Add items to queue - state updates automatically
|
|
130
|
-
* asyncQueuer.addItem(async () => {
|
|
131
|
-
* const result = await fetchData();
|
|
132
|
-
* return result;
|
|
133
|
-
* });
|
|
134
|
-
*
|
|
135
|
-
* // Start processing
|
|
136
|
-
* asyncQueuer.start();
|
|
137
|
-
*
|
|
138
|
-
* // Stop processing
|
|
139
|
-
* asyncQueuer.stop();
|
|
140
|
-
*
|
|
141
|
-
* // queueItems reflects current queue state
|
|
142
|
-
* const pendingCount = asyncQueuer.peekPendingItems().length;
|
|
143
|
-
*
|
|
144
|
-
* // Access the selected async queuer state (will be empty object {} unless selector provided)
|
|
145
|
-
* const { size, isRunning, activeItems } = asyncQueuer.state;
|
|
146
|
-
* ```
|
|
147
|
-
*/
|
|
148
|
-
declare function useAsyncQueuedState<TValue, TSelected extends Pick<AsyncQueuerState<TValue>, 'items'> = Pick<AsyncQueuerState<TValue>, 'items'>>(fn: (value: TValue) => Promise<any>, options?: PreactAsyncQueuerOptions<TValue, TSelected>, selector?: (state: AsyncQueuerState<TValue>) => TSelected): [Array<TValue>, PreactAsyncQueuer<TValue, TSelected>];
|
|
149
|
-
//#endregion
|
|
150
|
-
export { useAsyncQueuedState };
|
|
151
|
-
//# sourceMappingURL=useAsyncQueuedState.d.cts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useAsyncQueuedState.js","names":[],"sources":["../../src/async-queuer/useAsyncQueuedState.ts"],"sourcesContent":["import { useAsyncQueuer } from './useAsyncQueuer'\nimport type {\n PreactAsyncQueuer,\n PreactAsyncQueuerOptions,\n} from './useAsyncQueuer'\nimport type { AsyncQueuerState } from '@tanstack/pacer/async-queuer'\n\n/**\n * A higher-level Preact hook that creates an `AsyncQueuer` instance with built-in state management.\n *\n * This hook combines an AsyncQueuer with Preact state to automatically track the queue items.\n * It returns a tuple containing:\n * - The current array of queued items as Preact state\n * - The queuer instance with methods to control the queue\n *\n * The queue can be configured with:\n * - Maximum concurrent operations\n * - Maximum queue size\n * - Processing function for queue items\n * - Various lifecycle callbacks\n *\n * The state will automatically update whenever items are:\n * - Added to the queue\n * - Removed from the queue\n * - Started processing\n * - Completed processing\n *\n * ## State Management and Selector\n *\n * The hook uses TanStack Store for reactive state management via the underlying async queuer instance.\n * The `selector` parameter allows you to specify which async queuer state changes will trigger a re-render,\n * optimizing performance by preventing unnecessary re-renders when irrelevant 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. This prevents unnecessary re-renders and gives you\n * full control over when your component updates. Only when you provide a selector will the\n * component re-render when the selected state values change.\n *\n * Available async queuer state properties:\n * - `activeItems`: Items currently being processed by the queuer\n * - `errorCount`: Number of task executions that have resulted in errors\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 * - `lastResult`: The result from the most recent task execution\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 * - `settledCount`: Number of task executions that have completed (success or error)\n * - `size`: Number of items currently in the queue\n * - `status`: Current processing status ('idle' | 'running' | 'stopped')\n * - `successCount`: Number of task executions that have completed successfully\n *\n * @example\n * ```tsx\n * // Default behavior - no reactive state subscriptions\n * const [queueItems, asyncQueuer] = useAsyncQueuedState(\n * async (item) => {\n * const result = await processItem(item);\n * return result;\n * },\n * {\n * concurrency: 2,\n * maxSize: 100,\n * started: true\n * }\n * );\n *\n * // Opt-in to re-render when queue contents change (optimized for displaying queue items)\n * const [queueItems, asyncQueuer] = useAsyncQueuedState(\n * async (item) => {\n * const result = await processItem(item);\n * return result;\n * },\n * { concurrency: 2, maxSize: 100, started: true },\n * (state) => ({\n * items: state.items,\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 [queueItems, asyncQueuer] = useAsyncQueuedState(\n * async (item) => {\n * const result = await processItem(item);\n * return result;\n * },\n * { concurrency: 2, maxSize: 100, started: true },\n * (state) => ({\n * isRunning: state.isRunning,\n * isIdle: state.isIdle,\n * status: state.status,\n * activeItems: state.activeItems,\n * pendingTick: state.pendingTick\n * })\n * );\n *\n * // Opt-in to re-render when execution metrics change (optimized for stats display)\n * const [queueItems, asyncQueuer] = useAsyncQueuedState(\n * async (item) => {\n * const result = await processItem(item);\n * return result;\n * },\n * { concurrency: 2, maxSize: 100, started: true },\n * (state) => ({\n * successCount: state.successCount,\n * errorCount: state.errorCount,\n * settledCount: state.settledCount,\n * expirationCount: state.expirationCount,\n * rejectionCount: state.rejectionCount\n * })\n * );\n *\n * // Opt-in to re-render when results are available (optimized for data display)\n * const [queueItems, asyncQueuer] = useAsyncQueuedState(\n * async (item) => {\n * const result = await processItem(item);\n * return result;\n * },\n * { concurrency: 2, maxSize: 100, started: true },\n * (state) => ({\n * lastResult: state.lastResult,\n * successCount: state.successCount\n * })\n * );\n *\n * // Add items to queue - state updates automatically\n * asyncQueuer.addItem(async () => {\n * const result = await fetchData();\n * return result;\n * });\n *\n * // Start processing\n * asyncQueuer.start();\n *\n * // Stop processing\n * asyncQueuer.stop();\n *\n * // queueItems reflects current queue state\n * const pendingCount = asyncQueuer.peekPendingItems().length;\n *\n * // Access the selected async queuer state (will be empty object {} unless selector provided)\n * const { size, isRunning, activeItems } = asyncQueuer.state;\n * ```\n */\nexport function useAsyncQueuedState<\n TValue,\n TSelected extends Pick<AsyncQueuerState<TValue>, 'items'> = Pick<\n AsyncQueuerState<TValue>,\n 'items'\n >,\n>(\n fn: (value: TValue) => Promise<any>,\n options: PreactAsyncQueuerOptions<TValue, TSelected> = {},\n selector?: (state: AsyncQueuerState<TValue>) => TSelected,\n): [Array<TValue>, PreactAsyncQueuer<TValue, TSelected>] {\n const asyncQueuer = useAsyncQueuer(fn, options, selector)\n\n return [asyncQueuer.state.items, asyncQueuer]\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsJA,SAAgB,oBAOd,IACA,UAAuD,EAAE,EACzD,UACuD;CACvD,MAAM,cAAc,eAAe,IAAI,SAAS,SAAS;CAEzD,OAAO,CAAC,YAAY,MAAM,OAAO,YAAY"}
|
|
@@ -1,217 +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_async_queuer = require("@tanstack/pacer/async-queuer");
|
|
5
|
-
|
|
6
|
-
//#region src/async-queuer/useAsyncQueuer.ts
|
|
7
|
-
/**
|
|
8
|
-
* A lower-level Preact hook that creates an `AsyncQueuer` instance for managing an async queue of items.
|
|
9
|
-
*
|
|
10
|
-
* Features:
|
|
11
|
-
* - Priority queue support via getPriority option
|
|
12
|
-
* - Configurable concurrency limit
|
|
13
|
-
* - Task success/error/completion callbacks
|
|
14
|
-
* - FIFO (First In First Out) or LIFO (Last In First Out) queue behavior
|
|
15
|
-
* - Pause/resume task processing
|
|
16
|
-
* - Task cancellation
|
|
17
|
-
* - Item expiration to clear stale items from the queue
|
|
18
|
-
*
|
|
19
|
-
* Tasks are processed concurrently up to the configured concurrency limit. When a task completes,
|
|
20
|
-
* the next pending task is processed if below the concurrency limit.
|
|
21
|
-
*
|
|
22
|
-
* Error Handling:
|
|
23
|
-
* - If an `onError` handler is provided, it will be called with the error and queuer instance
|
|
24
|
-
* - If `throwOnError` is true (default when no onError handler is provided), the error will be thrown
|
|
25
|
-
* - If `throwOnError` is false (default when onError handler is provided), the error will be swallowed
|
|
26
|
-
* - Both onError and throwOnError can be used together - the handler will be called before any error is thrown
|
|
27
|
-
* - The error state can be checked using the underlying AsyncQueuer instance
|
|
28
|
-
*
|
|
29
|
-
* ## State Management and Selector
|
|
30
|
-
*
|
|
31
|
-
* The hook uses TanStack Store for reactive state management. You can subscribe to state changes
|
|
32
|
-
* in two ways:
|
|
33
|
-
*
|
|
34
|
-
* **1. Using `queuer.Subscribe` HOC (Recommended for component tree subscriptions)**
|
|
35
|
-
*
|
|
36
|
-
* Use the `Subscribe` HOC to subscribe to state changes deep in your component tree without
|
|
37
|
-
* needing to pass a selector to the hook. This is ideal when you want to subscribe to state
|
|
38
|
-
* in child components.
|
|
39
|
-
*
|
|
40
|
-
* **2. Using the `selector` parameter (For hook-level subscriptions)**
|
|
41
|
-
*
|
|
42
|
-
* The `selector` parameter allows you to specify which state changes will trigger a re-render
|
|
43
|
-
* at the hook level, optimizing performance by preventing unnecessary re-renders when irrelevant
|
|
44
|
-
* state changes occur.
|
|
45
|
-
*
|
|
46
|
-
* **By default, there will be no reactive state subscriptions** and you must opt-in to state
|
|
47
|
-
* tracking by providing a selector function or using the `Subscribe` HOC. This prevents unnecessary
|
|
48
|
-
* re-renders and gives you full control over when your component updates.
|
|
49
|
-
*
|
|
50
|
-
* Available state properties:
|
|
51
|
-
* - `activeItems`: Items currently being processed by the queuer
|
|
52
|
-
* - `errorCount`: Number of task executions that have resulted in errors
|
|
53
|
-
* - `expirationCount`: Number of items that have been removed due to expiration
|
|
54
|
-
* - `isEmpty`: Whether the queuer has no items to process
|
|
55
|
-
* - `isFull`: Whether the queuer has reached its maximum capacity
|
|
56
|
-
* - `isIdle`: Whether the queuer is not currently processing any items
|
|
57
|
-
* - `isRunning`: Whether the queuer is active and will process items automatically
|
|
58
|
-
* - `items`: Array of items currently waiting to be processed
|
|
59
|
-
* - `itemTimestamps`: Timestamps when items were added for expiration tracking
|
|
60
|
-
* - `lastResult`: The result from the most recent task execution
|
|
61
|
-
* - `pendingTick`: Whether the queuer has a pending timeout for processing the next item
|
|
62
|
-
* - `rejectionCount`: Number of items that have been rejected from being added
|
|
63
|
-
* - `settledCount`: Number of task executions that have completed (success or error)
|
|
64
|
-
* - `size`: Number of items currently in the queue
|
|
65
|
-
* - `status`: Current processing status ('idle' | 'running' | 'stopped')
|
|
66
|
-
* - `successCount`: Number of task executions that have completed successfully
|
|
67
|
-
*
|
|
68
|
-
* ## Unmount behavior
|
|
69
|
-
*
|
|
70
|
-
* By default, the hook stops the queuer and aborts any in-flight task executions when the component unmounts.
|
|
71
|
-
* Abort only cancels underlying operations (e.g. fetch) when the abort signal from `getAbortSignal()` is passed to them.
|
|
72
|
-
* Use the `onUnmount` option to customize this. For example, to flush pending items instead:
|
|
73
|
-
*
|
|
74
|
-
* ```tsx
|
|
75
|
-
* const queuer = useAsyncQueuer(fn, {
|
|
76
|
-
* concurrency: 2,
|
|
77
|
-
* started: false,
|
|
78
|
-
* onUnmount: (q) => q.flush()
|
|
79
|
-
* });
|
|
80
|
-
* ```
|
|
81
|
-
*
|
|
82
|
-
* Note: For async utils, `flush()` returns a Promise and runs fire-and-forget in the cleanup.
|
|
83
|
-
* If your task function updates Preact state, those updates may run after the component has
|
|
84
|
-
* unmounted, which can cause "setState on unmounted component" warnings. Guard your callbacks
|
|
85
|
-
* accordingly when using onUnmount with flush.
|
|
86
|
-
*
|
|
87
|
-
* @example
|
|
88
|
-
* ```tsx
|
|
89
|
-
* // Default behavior - no reactive state subscriptions
|
|
90
|
-
* const asyncQueuer = useAsyncQueuer(
|
|
91
|
-
* async (item) => {
|
|
92
|
-
* const result = await processItem(item);
|
|
93
|
-
* return result;
|
|
94
|
-
* },
|
|
95
|
-
* { concurrency: 2, maxSize: 100, started: false }
|
|
96
|
-
* );
|
|
97
|
-
*
|
|
98
|
-
* // Subscribe to state changes deep in component tree using Subscribe HOC
|
|
99
|
-
* <asyncQueuer.Subscribe selector={(state) => ({ size: state.size })}>
|
|
100
|
-
* {({ size }) => (
|
|
101
|
-
* <div>Queue Size: {size}</div>
|
|
102
|
-
* )}
|
|
103
|
-
* </asyncQueuer.Subscribe>
|
|
104
|
-
*
|
|
105
|
-
* // Opt-in to re-render when queue size changes at hook level (optimized for displaying queue length)
|
|
106
|
-
* const asyncQueuer = useAsyncQueuer(
|
|
107
|
-
* async (item) => {
|
|
108
|
-
* const result = await processItem(item);
|
|
109
|
-
* return result;
|
|
110
|
-
* },
|
|
111
|
-
* { concurrency: 2, maxSize: 100, started: false },
|
|
112
|
-
* (state) => ({
|
|
113
|
-
* size: state.size,
|
|
114
|
-
* isEmpty: state.isEmpty,
|
|
115
|
-
* isFull: state.isFull
|
|
116
|
-
* })
|
|
117
|
-
* );
|
|
118
|
-
*
|
|
119
|
-
* // Opt-in to re-render when processing state changes (optimized for loading indicators)
|
|
120
|
-
* const asyncQueuer = useAsyncQueuer(
|
|
121
|
-
* async (item) => {
|
|
122
|
-
* const result = await processItem(item);
|
|
123
|
-
* return result;
|
|
124
|
-
* },
|
|
125
|
-
* { concurrency: 2, maxSize: 100, started: false },
|
|
126
|
-
* (state) => ({
|
|
127
|
-
* isRunning: state.isRunning,
|
|
128
|
-
* isIdle: state.isIdle,
|
|
129
|
-
* status: state.status,
|
|
130
|
-
* activeItems: state.activeItems,
|
|
131
|
-
* pendingTick: state.pendingTick
|
|
132
|
-
* })
|
|
133
|
-
* );
|
|
134
|
-
*
|
|
135
|
-
* // Opt-in to re-render when execution metrics change (optimized for stats display)
|
|
136
|
-
* const asyncQueuer = useAsyncQueuer(
|
|
137
|
-
* async (item) => {
|
|
138
|
-
* const result = await processItem(item);
|
|
139
|
-
* return result;
|
|
140
|
-
* },
|
|
141
|
-
* { concurrency: 2, maxSize: 100, started: false },
|
|
142
|
-
* (state) => ({
|
|
143
|
-
* successCount: state.successCount,
|
|
144
|
-
* errorCount: state.errorCount,
|
|
145
|
-
* settledCount: state.settledCount,
|
|
146
|
-
* expirationCount: state.expirationCount,
|
|
147
|
-
* rejectionCount: state.rejectionCount
|
|
148
|
-
* })
|
|
149
|
-
* );
|
|
150
|
-
*
|
|
151
|
-
* // Opt-in to re-render when results are available (optimized for data display)
|
|
152
|
-
* const asyncQueuer = useAsyncQueuer(
|
|
153
|
-
* async (item) => {
|
|
154
|
-
* const result = await processItem(item);
|
|
155
|
-
* return result;
|
|
156
|
-
* },
|
|
157
|
-
* {
|
|
158
|
-
* concurrency: 2,
|
|
159
|
-
* maxSize: 100,
|
|
160
|
-
* started: false,
|
|
161
|
-
* onSuccess: (result) => {
|
|
162
|
-
* console.log('Item processed:', result);
|
|
163
|
-
* },
|
|
164
|
-
* onError: (error) => {
|
|
165
|
-
* console.error('Processing failed:', error);
|
|
166
|
-
* }
|
|
167
|
-
* },
|
|
168
|
-
* (state) => ({
|
|
169
|
-
* lastResult: state.lastResult,
|
|
170
|
-
* successCount: state.successCount
|
|
171
|
-
* })
|
|
172
|
-
* );
|
|
173
|
-
*
|
|
174
|
-
* // Add items to queue
|
|
175
|
-
* asyncQueuer.addItem(newItem);
|
|
176
|
-
*
|
|
177
|
-
* // Start processing
|
|
178
|
-
* asyncQueuer.start();
|
|
179
|
-
*
|
|
180
|
-
* // Access the selected state (will be empty object {} unless selector provided)
|
|
181
|
-
* const { size, isRunning, activeItems } = asyncQueuer.state;
|
|
182
|
-
* ```
|
|
183
|
-
*/
|
|
184
|
-
function useAsyncQueuer(fn, options = {}, selector = () => ({})) {
|
|
185
|
-
const mergedOptions = {
|
|
186
|
-
...require_PacerProvider.useDefaultPacerOptions().asyncQueuer,
|
|
187
|
-
...options
|
|
188
|
-
};
|
|
189
|
-
const [asyncQueuer] = (0, preact_hooks.useState)(() => {
|
|
190
|
-
const queuerInstance = new _tanstack_pacer_async_queuer.AsyncQueuer(fn, mergedOptions);
|
|
191
|
-
queuerInstance.Subscribe = function Subscribe(props) {
|
|
192
|
-
const selected = (0, _tanstack_preact_store.useSelector)(queuerInstance.store, props.selector, { compare: _tanstack_preact_store.shallow });
|
|
193
|
-
return typeof props.children === "function" ? props.children(selected) : props.children;
|
|
194
|
-
};
|
|
195
|
-
return queuerInstance;
|
|
196
|
-
});
|
|
197
|
-
asyncQueuer.fn = fn;
|
|
198
|
-
asyncQueuer.setOptions(mergedOptions);
|
|
199
|
-
(0, preact_hooks.useEffect)(() => {
|
|
200
|
-
return () => {
|
|
201
|
-
if (mergedOptions.onUnmount) mergedOptions.onUnmount(asyncQueuer);
|
|
202
|
-
else {
|
|
203
|
-
asyncQueuer.stop();
|
|
204
|
-
asyncQueuer.abort();
|
|
205
|
-
}
|
|
206
|
-
};
|
|
207
|
-
}, []);
|
|
208
|
-
const state = (0, _tanstack_preact_store.useSelector)(asyncQueuer.store, selector, { compare: _tanstack_preact_store.shallow });
|
|
209
|
-
return (0, preact_hooks.useMemo)(() => ({
|
|
210
|
-
...asyncQueuer,
|
|
211
|
-
state
|
|
212
|
-
}), [asyncQueuer, state]);
|
|
213
|
-
}
|
|
214
|
-
|
|
215
|
-
//#endregion
|
|
216
|
-
exports.useAsyncQueuer = useAsyncQueuer;
|
|
217
|
-
//# sourceMappingURL=useAsyncQueuer.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useAsyncQueuer.cjs","names":["useDefaultPacerOptions","AsyncQueuer","shallow"],"sources":["../../src/async-queuer/useAsyncQueuer.ts"],"sourcesContent":["import { useEffect, useMemo, useState } from 'preact/hooks'\nimport { AsyncQueuer } from '@tanstack/pacer/async-queuer'\nimport { shallow, useSelector } from '@tanstack/preact-store'\nimport { useDefaultPacerOptions } from '../provider/PacerProvider'\nimport type { Store } from '@tanstack/preact-store'\nimport type {\n AsyncQueuerOptions,\n AsyncQueuerState,\n} from '@tanstack/pacer/async-queuer'\nimport type { ComponentChildren } from 'preact'\n\nexport interface PreactAsyncQueuerOptions<\n TValue,\n TSelected = {},\n> extends AsyncQueuerOptions<TValue> {\n /**\n * Optional callback invoked when the component unmounts. Receives the queuer instance.\n * When provided, replaces the default cleanup (stop + abort); use it to call flush(), flushAsBatch(), stop(), add logging, etc.\n */\n onUnmount?: (queuer: PreactAsyncQueuer<TValue, TSelected>) => void\n}\n\nexport interface PreactAsyncQueuer<TValue, TSelected = {}> extends Omit<\n AsyncQueuer<TValue>,\n 'store'\n> {\n /**\n * A Preact HOC (Higher Order Component) that allows you to subscribe to the async 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: AsyncQueuerState<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<AsyncQueuerState<TValue>>>\n}\n\n/**\n * A lower-level Preact hook that creates an `AsyncQueuer` instance for managing an async queue of items.\n *\n * Features:\n * - Priority queue support via getPriority option\n * - Configurable concurrency limit\n * - Task success/error/completion callbacks\n * - FIFO (First In First Out) or LIFO (Last In First Out) queue behavior\n * - Pause/resume task processing\n * - Task cancellation\n * - Item expiration to clear stale items from the queue\n *\n * Tasks are processed concurrently up to the configured concurrency limit. When a task completes,\n * the next pending task is processed if below the concurrency limit.\n *\n * Error Handling:\n * - If an `onError` handler is provided, it will be called with the error and queuer instance\n * - If `throwOnError` is true (default when no onError handler is provided), the error will be thrown\n * - If `throwOnError` is false (default when onError handler is provided), the error will be swallowed\n * - Both onError and throwOnError can be used together - the handler will be called before any error is thrown\n * - The error state can be checked using the underlying AsyncQueuer instance\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 * - `activeItems`: Items currently being processed by the queuer\n * - `errorCount`: Number of task executions that have resulted in errors\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 * - `lastResult`: The result from the most recent task execution\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 * - `settledCount`: Number of task executions that have completed (success or error)\n * - `size`: Number of items currently in the queue\n * - `status`: Current processing status ('idle' | 'running' | 'stopped')\n * - `successCount`: Number of task executions that have completed successfully\n *\n * ## Unmount behavior\n *\n * By default, the hook stops the queuer and aborts any in-flight task executions when the component unmounts.\n * Abort only cancels underlying operations (e.g. fetch) when the abort signal from `getAbortSignal()` is passed to them.\n * Use the `onUnmount` option to customize this. For example, to flush pending items instead:\n *\n * ```tsx\n * const queuer = useAsyncQueuer(fn, {\n * concurrency: 2,\n * started: false,\n * onUnmount: (q) => q.flush()\n * });\n * ```\n *\n * Note: For async utils, `flush()` returns a Promise and runs fire-and-forget in the cleanup.\n * If your task function updates Preact state, those updates may run after the component has\n * unmounted, which can cause \"setState on unmounted component\" warnings. Guard your callbacks\n * accordingly when using onUnmount with flush.\n *\n * @example\n * ```tsx\n * // Default behavior - no reactive state subscriptions\n * const asyncQueuer = useAsyncQueuer(\n * async (item) => {\n * const result = await processItem(item);\n * return result;\n * },\n * { concurrency: 2, maxSize: 100, started: false }\n * );\n *\n * // Subscribe to state changes deep in component tree using Subscribe HOC\n * <asyncQueuer.Subscribe selector={(state) => ({ size: state.size })}>\n * {({ size }) => (\n * <div>Queue Size: {size}</div>\n * )}\n * </asyncQueuer.Subscribe>\n *\n * // Opt-in to re-render when queue size changes at hook level (optimized for displaying queue length)\n * const asyncQueuer = useAsyncQueuer(\n * async (item) => {\n * const result = await processItem(item);\n * return result;\n * },\n * { concurrency: 2, maxSize: 100, started: false },\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 asyncQueuer = useAsyncQueuer(\n * async (item) => {\n * const result = await processItem(item);\n * return result;\n * },\n * { concurrency: 2, maxSize: 100, started: false },\n * (state) => ({\n * isRunning: state.isRunning,\n * isIdle: state.isIdle,\n * status: state.status,\n * activeItems: state.activeItems,\n * pendingTick: state.pendingTick\n * })\n * );\n *\n * // Opt-in to re-render when execution metrics change (optimized for stats display)\n * const asyncQueuer = useAsyncQueuer(\n * async (item) => {\n * const result = await processItem(item);\n * return result;\n * },\n * { concurrency: 2, maxSize: 100, started: false },\n * (state) => ({\n * successCount: state.successCount,\n * errorCount: state.errorCount,\n * settledCount: state.settledCount,\n * expirationCount: state.expirationCount,\n * rejectionCount: state.rejectionCount\n * })\n * );\n *\n * // Opt-in to re-render when results are available (optimized for data display)\n * const asyncQueuer = useAsyncQueuer(\n * async (item) => {\n * const result = await processItem(item);\n * return result;\n * },\n * {\n * concurrency: 2,\n * maxSize: 100,\n * started: false,\n * onSuccess: (result) => {\n * console.log('Item processed:', result);\n * },\n * onError: (error) => {\n * console.error('Processing failed:', error);\n * }\n * },\n * (state) => ({\n * lastResult: state.lastResult,\n * successCount: state.successCount\n * })\n * );\n *\n * // Add items to queue\n * asyncQueuer.addItem(newItem);\n *\n * // Start processing\n * asyncQueuer.start();\n *\n * // Access the selected state (will be empty object {} unless selector provided)\n * const { size, isRunning, activeItems } = asyncQueuer.state;\n * ```\n */\nexport function useAsyncQueuer<TValue, TSelected = {}>(\n fn: (value: TValue) => Promise<any>,\n options: PreactAsyncQueuerOptions<TValue, TSelected> = {},\n selector: (state: AsyncQueuerState<TValue>) => TSelected = () =>\n ({}) as TSelected,\n): PreactAsyncQueuer<TValue, TSelected> {\n const mergedOptions = {\n ...useDefaultPacerOptions().asyncQueuer,\n ...options,\n } as PreactAsyncQueuerOptions<TValue, TSelected>\n const [asyncQueuer] = useState(() => {\n const queuerInstance = new AsyncQueuer<TValue>(\n fn,\n mergedOptions,\n ) as unknown as PreactAsyncQueuer<TValue, TSelected>\n\n queuerInstance.Subscribe = function Subscribe<TSelected>(props: {\n selector: (state: AsyncQueuerState<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 asyncQueuer.fn = fn\n asyncQueuer.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(asyncQueuer)\n } else {\n asyncQueuer.stop()\n asyncQueuer.abort()\n }\n }\n }, [])\n /* eslint-enable react-hooks/exhaustive-deps */\n\n const state = useSelector(asyncQueuer.store, selector, { compare: shallow })\n\n return useMemo(\n () =>\n ({\n ...asyncQueuer,\n state,\n }) as PreactAsyncQueuer<TValue, TSelected>, // omit `store` in favor of `state`\n [asyncQueuer, state],\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0OA,SAAgB,eACd,IACA,UAAuD,EAAE,EACzD,kBACG,EAAE,GACiC;CACtC,MAAM,gBAAgB;EACpB,GAAGA,8CAAwB,CAAC;EAC5B,GAAG;EACJ;CACD,MAAM,CAAC,gDAA8B;EACnC,MAAM,iBAAiB,IAAIC,yCACzB,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,YAAY,KAAK;CACjB,YAAY,WAAW,cAAc;CAGrC,kCAAgB;EACd,aAAa;GACX,IAAI,cAAc,WAChB,cAAc,UAAU,YAAY;QAC/B;IACL,YAAY,MAAM;IAClB,YAAY,OAAO;;;IAGtB,EAAE,CAAC;CAGN,MAAM,gDAAoB,YAAY,OAAO,UAAU,EAAE,SAASA,gCAAS,CAAC;CAE5E,wCAEK;EACC,GAAG;EACH;EACD,GACH,CAAC,aAAa,MAAM,CACrB"}
|