@dxos/react-hooks 0.8.4-main.72ec0f3 → 0.8.4-main.765dc60934
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/LICENSE +102 -5
- package/README.md +1 -0
- package/dist/lib/browser/index.mjs +100 -93
- package/dist/lib/browser/index.mjs.map +4 -4
- package/dist/lib/browser/meta.json +1 -1
- package/dist/lib/node-esm/index.mjs +100 -93
- package/dist/lib/node-esm/index.mjs.map +4 -4
- package/dist/lib/node-esm/meta.json +1 -1
- package/dist/types/src/index.d.ts +3 -2
- package/dist/types/src/index.d.ts.map +1 -1
- package/dist/types/src/useAsyncEffect.d.ts.map +1 -1
- package/dist/types/src/useAsyncState.d.ts.map +1 -1
- package/dist/types/src/useAtomState.d.ts +12 -0
- package/dist/types/src/useAtomState.d.ts.map +1 -0
- package/dist/types/src/useControlledState.d.ts +2 -2
- package/dist/types/src/useControlledState.d.ts.map +1 -1
- package/dist/types/src/useDebugDeps.d.ts +1 -1
- package/dist/types/src/useDebugDeps.d.ts.map +1 -1
- package/dist/types/src/useDefaultValue.d.ts.map +1 -1
- package/dist/types/src/useDefaults.d.ts.map +1 -1
- package/dist/types/src/useDynamicRef.d.ts +1 -1
- package/dist/types/src/useDynamicRef.d.ts.map +1 -1
- package/dist/types/src/useForwardedRef.d.ts.map +1 -1
- package/dist/types/src/useId.d.ts.map +1 -1
- package/dist/types/src/useIsFocused.d.ts.map +1 -1
- package/dist/types/src/useMediaQuery.d.ts.map +1 -1
- package/dist/types/src/useMulticastObservable.d.ts.map +1 -1
- package/dist/types/src/useTimeout.d.ts.map +1 -1
- package/dist/types/src/useTransitions.d.ts.map +1 -1
- package/dist/types/src/useViewportResize.d.ts +1 -1
- package/dist/types/src/useViewportResize.d.ts.map +1 -1
- package/dist/types/tsconfig.tsbuildinfo +1 -1
- package/package.json +18 -16
- package/src/index.ts +4 -3
- package/src/useAtomState.ts +23 -0
- package/src/useControlledState.ts +6 -6
- package/src/useDebugDeps.ts +17 -8
- package/src/useDynamicRef.ts +4 -5
- package/src/useForwardedRef.ts +4 -2
- package/src/useId.ts +3 -2
- package/src/useIsFocused.ts +1 -1
- package/src/useMulticastObservable.test.ts +1 -1
- package/src/useViewportResize.ts +3 -3
- package/dist/types/src/useSignals.d.ts +0 -10
- package/dist/types/src/useSignals.d.ts.map +0 -1
- package/src/useSignals.ts +0 -27
|
@@ -1,5 +1,9 @@
|
|
|
1
1
|
import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
|
|
2
2
|
|
|
3
|
+
// src/index.ts
|
|
4
|
+
import { useComposedRefs } from "@radix-ui/react-compose-refs";
|
|
5
|
+
import { useSize, useScroller } from "mini-virtual-list";
|
|
6
|
+
|
|
3
7
|
// src/useAsyncEffect.ts
|
|
4
8
|
import { useEffect } from "react";
|
|
5
9
|
var useAsyncEffect = (cb, deps) => {
|
|
@@ -19,10 +23,28 @@ var useAsyncEffect = (cb, deps) => {
|
|
|
19
23
|
}, deps ?? []);
|
|
20
24
|
};
|
|
21
25
|
|
|
26
|
+
// src/useAtomState.ts
|
|
27
|
+
import { Atom, useAtomSet, useAtomValue } from "@effect-atom/atom-react";
|
|
28
|
+
import { useMemo, useState } from "react";
|
|
29
|
+
var useAtomState = (initialValue) => {
|
|
30
|
+
const [atom] = useState(() => Atom.make(initialValue));
|
|
31
|
+
const value = useAtomValue(atom);
|
|
32
|
+
const set = useAtomSet(atom);
|
|
33
|
+
return useMemo(() => ({
|
|
34
|
+
atom,
|
|
35
|
+
value,
|
|
36
|
+
set
|
|
37
|
+
}), [
|
|
38
|
+
atom,
|
|
39
|
+
value,
|
|
40
|
+
set
|
|
41
|
+
]);
|
|
42
|
+
};
|
|
43
|
+
|
|
22
44
|
// src/useAsyncState.ts
|
|
23
|
-
import { useEffect as useEffect2, useState } from "react";
|
|
45
|
+
import { useEffect as useEffect2, useState as useState2 } from "react";
|
|
24
46
|
var useAsyncState = (cb, deps = []) => {
|
|
25
|
-
const [value, setValue] =
|
|
47
|
+
const [value, setValue] = useState2();
|
|
26
48
|
useEffect2(() => {
|
|
27
49
|
let disposed = false;
|
|
28
50
|
const t = setTimeout(async () => {
|
|
@@ -43,14 +65,13 @@ var useAsyncState = (cb, deps = []) => {
|
|
|
43
65
|
};
|
|
44
66
|
|
|
45
67
|
// src/useControlledState.ts
|
|
46
|
-
import { useCallback as useCallback2, useEffect as useEffect4, useRef as useRef2, useState as
|
|
68
|
+
import { useCallback as useCallback2, useEffect as useEffect4, useRef as useRef2, useState as useState4 } from "react";
|
|
47
69
|
|
|
48
70
|
// src/useDynamicRef.ts
|
|
49
|
-
import { useCallback } from "
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
const
|
|
53
|
-
const valueRef = useRef(valueParam);
|
|
71
|
+
import { useCallback, useEffect as useEffect3, useRef, useState as useState3 } from "react";
|
|
72
|
+
var useStateWithRef = (valueProp) => {
|
|
73
|
+
const [value, setValue] = useState3(valueProp);
|
|
74
|
+
const valueRef = useRef(valueProp);
|
|
54
75
|
const setter = useCallback((value2) => {
|
|
55
76
|
if (typeof value2 === "function") {
|
|
56
77
|
setValue((current) => {
|
|
@@ -79,15 +100,15 @@ var useDynamicRef = (value) => {
|
|
|
79
100
|
};
|
|
80
101
|
|
|
81
102
|
// src/useControlledState.ts
|
|
82
|
-
var useControlledState = (
|
|
83
|
-
const [value, setControlledValue] =
|
|
103
|
+
var useControlledState = (valueProp, onChange) => {
|
|
104
|
+
const [value, setControlledValue] = useState4(valueProp);
|
|
84
105
|
useEffect4(() => {
|
|
85
|
-
setControlledValue(
|
|
106
|
+
setControlledValue(valueProp);
|
|
86
107
|
}, [
|
|
87
|
-
|
|
108
|
+
valueProp
|
|
88
109
|
]);
|
|
89
110
|
const onChangeRef = useRef2(onChange);
|
|
90
|
-
const valueRef = useDynamicRef(
|
|
111
|
+
const valueRef = useDynamicRef(valueProp);
|
|
91
112
|
const setValue = useCallback2((nextValue) => {
|
|
92
113
|
const value2 = isFunction(nextValue) ? nextValue(valueRef.current) : nextValue;
|
|
93
114
|
setControlledValue(value2);
|
|
@@ -107,32 +128,38 @@ function isFunction(value) {
|
|
|
107
128
|
|
|
108
129
|
// src/useDebugDeps.ts
|
|
109
130
|
import { useEffect as useEffect5, useRef as useRef3 } from "react";
|
|
110
|
-
|
|
131
|
+
import { log } from "@dxos/log";
|
|
132
|
+
var __dxlog_file = "/__w/dxos/dxos/packages/ui/react-primitives/react-hooks/src/useDebugDeps.ts";
|
|
133
|
+
var useDebugDeps = (deps = [], label = "useDebugDeps", active = true) => {
|
|
111
134
|
const lastDeps = useRef3([]);
|
|
112
135
|
useEffect5(() => {
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
}
|
|
136
|
+
if (!active) {
|
|
137
|
+
return;
|
|
138
|
+
}
|
|
139
|
+
const diff = {};
|
|
117
140
|
for (let i = 0; i < Math.max(lastDeps.current.length ?? 0, deps.length ?? 0); i++) {
|
|
118
|
-
if (lastDeps.current[i] !== deps[i]
|
|
119
|
-
|
|
120
|
-
index: i,
|
|
141
|
+
if (lastDeps.current[i] !== deps[i] || i > lastDeps.current.length) {
|
|
142
|
+
diff[i] = {
|
|
121
143
|
previous: lastDeps.current[i],
|
|
122
144
|
current: deps[i]
|
|
123
|
-
}
|
|
145
|
+
};
|
|
124
146
|
}
|
|
125
147
|
}
|
|
126
|
-
|
|
148
|
+
if (Object.keys(diff).length > 0) {
|
|
149
|
+
log.warn(`Updated: ${label} [${lastDeps.current.length}/${deps.length}]`, diff, { "~LogMeta": "~LogMeta", F: __dxlog_file, L: 24, S: void 0 });
|
|
150
|
+
}
|
|
127
151
|
lastDeps.current = deps;
|
|
128
|
-
},
|
|
152
|
+
}, [
|
|
153
|
+
...deps,
|
|
154
|
+
active
|
|
155
|
+
]);
|
|
129
156
|
};
|
|
130
157
|
|
|
131
158
|
// src/useDefaultValue.ts
|
|
132
|
-
import { useEffect as useEffect6, useMemo, useState as
|
|
159
|
+
import { useEffect as useEffect6, useMemo as useMemo2, useState as useState5 } from "react";
|
|
133
160
|
var useDefaultValue = (reactiveValue, getDefaultValue) => {
|
|
134
|
-
const stableDefaultValue =
|
|
135
|
-
const [value, setValue] =
|
|
161
|
+
const stableDefaultValue = useMemo2(getDefaultValue, []);
|
|
162
|
+
const [value, setValue] = useState5(reactiveValue ?? stableDefaultValue);
|
|
136
163
|
useEffect6(() => {
|
|
137
164
|
setValue(reactiveValue ?? stableDefaultValue);
|
|
138
165
|
}, [
|
|
@@ -144,18 +171,18 @@ var useDefaultValue = (reactiveValue, getDefaultValue) => {
|
|
|
144
171
|
|
|
145
172
|
// src/useDefaults.ts
|
|
146
173
|
import defaultsDeep from "lodash.defaultsdeep";
|
|
147
|
-
import { useMemo as
|
|
174
|
+
import { useMemo as useMemo3 } from "react";
|
|
148
175
|
var useDefaults = (value, defaults) => {
|
|
149
|
-
return
|
|
176
|
+
return useMemo3(() => defaultsDeep({}, defaults, value), [
|
|
150
177
|
value,
|
|
151
178
|
defaults
|
|
152
179
|
]);
|
|
153
180
|
};
|
|
154
181
|
|
|
155
182
|
// src/useFileDownload.ts
|
|
156
|
-
import { useMemo as
|
|
183
|
+
import { useMemo as useMemo4 } from "react";
|
|
157
184
|
var useFileDownload = () => {
|
|
158
|
-
return
|
|
185
|
+
return useMemo4(() => (data, filename) => {
|
|
159
186
|
const url = typeof data === "string" ? data : URL.createObjectURL(data);
|
|
160
187
|
const element = document.createElement("a");
|
|
161
188
|
element.setAttribute("href", url);
|
|
@@ -166,7 +193,7 @@ var useFileDownload = () => {
|
|
|
166
193
|
};
|
|
167
194
|
|
|
168
195
|
// src/useForwardedRef.ts
|
|
169
|
-
import { useEffect as useEffect7, useMemo as
|
|
196
|
+
import { useEffect as useEffect7, useMemo as useMemo5, useRef as useRef4 } from "react";
|
|
170
197
|
var useForwardedRef = (forwardedRef) => {
|
|
171
198
|
const localRef = useRef4(null);
|
|
172
199
|
useEffect7(() => {
|
|
@@ -191,29 +218,35 @@ var mergeRefs = (refs) => {
|
|
|
191
218
|
cleanups.push(typeof cleanup === "function" ? cleanup : () => setRef(ref, null));
|
|
192
219
|
}
|
|
193
220
|
return () => {
|
|
194
|
-
for (const cleanup of cleanups)
|
|
221
|
+
for (const cleanup of cleanups) {
|
|
222
|
+
cleanup();
|
|
223
|
+
}
|
|
195
224
|
};
|
|
196
225
|
};
|
|
197
226
|
};
|
|
198
227
|
var useMergeRefs = (refs) => {
|
|
199
|
-
return
|
|
228
|
+
return useMemo5(() => mergeRefs(refs), [
|
|
229
|
+
...refs
|
|
230
|
+
]);
|
|
200
231
|
};
|
|
201
232
|
|
|
202
233
|
// src/useId.ts
|
|
203
234
|
import alea from "alea";
|
|
204
|
-
import { useMemo as
|
|
235
|
+
import { useMemo as useMemo6 } from "react";
|
|
205
236
|
var Alea = alea;
|
|
206
237
|
var prng = new Alea("@dxos/react-hooks");
|
|
207
238
|
var randomString = (n = 4) => prng().toString(16).slice(2, n + 2);
|
|
208
|
-
var useId = (namespace, propsId, opts) =>
|
|
209
|
-
propsId
|
|
210
|
-
|
|
239
|
+
var useId = (namespace, propsId, opts) => {
|
|
240
|
+
return useMemo6(() => makeId(namespace, propsId, opts), [
|
|
241
|
+
propsId
|
|
242
|
+
]);
|
|
243
|
+
};
|
|
211
244
|
var makeId = (namespace, propsId, opts) => propsId ?? `${namespace}-${randomString(opts?.n ?? 4)}`;
|
|
212
245
|
|
|
213
246
|
// src/useIsFocused.ts
|
|
214
|
-
import { useEffect as useEffect8, useRef as useRef5, useState as
|
|
247
|
+
import { useEffect as useEffect8, useRef as useRef5, useState as useState6 } from "react";
|
|
215
248
|
var useIsFocused = (inputRef) => {
|
|
216
|
-
const [isFocused, setIsFocused] =
|
|
249
|
+
const [isFocused, setIsFocused] = useState6(void 0);
|
|
217
250
|
const isFocusedRef = useRef5(isFocused);
|
|
218
251
|
isFocusedRef.current = isFocused;
|
|
219
252
|
useEffect8(() => {
|
|
@@ -240,7 +273,7 @@ var useIsFocused = (inputRef) => {
|
|
|
240
273
|
};
|
|
241
274
|
|
|
242
275
|
// src/useMediaQuery.ts
|
|
243
|
-
import { useEffect as useEffect9, useState as
|
|
276
|
+
import { useEffect as useEffect9, useState as useState7 } from "react";
|
|
244
277
|
var breakpointMediaQueries = {
|
|
245
278
|
sm: "(min-width: 640px)",
|
|
246
279
|
md: "(min-width: 768px)",
|
|
@@ -257,7 +290,7 @@ var useMediaQuery = (query, options = {}) => {
|
|
|
257
290
|
fallback
|
|
258
291
|
];
|
|
259
292
|
fallbackValues = fallbackValues.filter((v) => v != null);
|
|
260
|
-
const [value, setValue] =
|
|
293
|
+
const [value, setValue] = useState7(() => {
|
|
261
294
|
return queries.map((query2, index) => ({
|
|
262
295
|
media: query2,
|
|
263
296
|
matches: ssr ? !!fallbackValues[index] : document.defaultView?.matchMedia(query2).matches
|
|
@@ -305,9 +338,9 @@ var useMediaQuery = (query, options = {}) => {
|
|
|
305
338
|
};
|
|
306
339
|
|
|
307
340
|
// src/useMulticastObservable.ts
|
|
308
|
-
import { useMemo as
|
|
341
|
+
import { useMemo as useMemo7, useSyncExternalStore } from "react";
|
|
309
342
|
var useMulticastObservable = (observable) => {
|
|
310
|
-
const subscribeFn =
|
|
343
|
+
const subscribeFn = useMemo7(() => (listener) => {
|
|
311
344
|
const subscription = observable.subscribe(listener);
|
|
312
345
|
return () => subscription.unsubscribe();
|
|
313
346
|
}, [
|
|
@@ -317,9 +350,9 @@ var useMulticastObservable = (observable) => {
|
|
|
317
350
|
};
|
|
318
351
|
|
|
319
352
|
// src/useRefCallback.ts
|
|
320
|
-
import { useState as
|
|
353
|
+
import { useState as useState8 } from "react";
|
|
321
354
|
var useRefCallback = () => {
|
|
322
|
-
const [value, setValue] =
|
|
355
|
+
const [value, setValue] = useState8(null);
|
|
323
356
|
return {
|
|
324
357
|
refCallback: (value2) => setValue(value2),
|
|
325
358
|
value
|
|
@@ -327,18 +360,18 @@ var useRefCallback = () => {
|
|
|
327
360
|
};
|
|
328
361
|
|
|
329
362
|
// src/useViewportResize.ts
|
|
330
|
-
import { useLayoutEffect, useMemo as
|
|
331
|
-
var useViewportResize = (
|
|
332
|
-
const debouncedHandler =
|
|
363
|
+
import { useLayoutEffect, useMemo as useMemo8 } from "react";
|
|
364
|
+
var useViewportResize = (cb, deps = [], delay = 800) => {
|
|
365
|
+
const debouncedHandler = useMemo8(() => {
|
|
333
366
|
let timeout;
|
|
334
367
|
return (event) => {
|
|
335
368
|
clearTimeout(timeout);
|
|
336
369
|
timeout = setTimeout(() => {
|
|
337
|
-
|
|
370
|
+
cb(event);
|
|
338
371
|
}, delay);
|
|
339
372
|
};
|
|
340
373
|
}, [
|
|
341
|
-
|
|
374
|
+
cb,
|
|
342
375
|
delay
|
|
343
376
|
]);
|
|
344
377
|
return useLayoutEffect(() => {
|
|
@@ -351,39 +384,16 @@ var useViewportResize = (handler, deps = [], delay = 800) => {
|
|
|
351
384
|
]);
|
|
352
385
|
};
|
|
353
386
|
|
|
354
|
-
// src/useSignals.ts
|
|
355
|
-
import { useSignals as _useSignals } from "@preact-signals/safe-react/tracking";
|
|
356
|
-
import { computed, effect } from "@preact-signals/safe-react";
|
|
357
|
-
import { useRef as useRef6 } from "@preact-signals/safe-react/react";
|
|
358
|
-
import { useEffect as useEffect10, useMemo as useMemo8 } from "react";
|
|
359
|
-
var useSignalsEffect = (cb, deps) => {
|
|
360
|
-
const callback = useRef6(cb);
|
|
361
|
-
callback.current = cb;
|
|
362
|
-
useEffect10(() => {
|
|
363
|
-
return effect(() => {
|
|
364
|
-
return callback.current();
|
|
365
|
-
});
|
|
366
|
-
}, deps ?? []);
|
|
367
|
-
};
|
|
368
|
-
var useSignalsMemo = (cb, deps) => {
|
|
369
|
-
var _effect = _useSignals();
|
|
370
|
-
try {
|
|
371
|
-
return useMemo8(() => computed(cb), deps ?? []).value;
|
|
372
|
-
} finally {
|
|
373
|
-
_effect.f();
|
|
374
|
-
}
|
|
375
|
-
};
|
|
376
|
-
|
|
377
387
|
// src/useTimeout.ts
|
|
378
|
-
import { useEffect as
|
|
388
|
+
import { useEffect as useEffect10, useRef as useRef6 } from "react";
|
|
379
389
|
var useTimeout = (callback, delay = 0, deps = []) => {
|
|
380
|
-
const callbackRef =
|
|
381
|
-
|
|
390
|
+
const callbackRef = useRef6(callback);
|
|
391
|
+
useEffect10(() => {
|
|
382
392
|
callbackRef.current = callback;
|
|
383
393
|
}, [
|
|
384
394
|
callback
|
|
385
395
|
]);
|
|
386
|
-
|
|
396
|
+
useEffect10(() => {
|
|
387
397
|
if (delay == null) {
|
|
388
398
|
return;
|
|
389
399
|
}
|
|
@@ -395,13 +405,13 @@ var useTimeout = (callback, delay = 0, deps = []) => {
|
|
|
395
405
|
]);
|
|
396
406
|
};
|
|
397
407
|
var useInterval = (callback, delay = 0, deps = []) => {
|
|
398
|
-
const callbackRef =
|
|
399
|
-
|
|
408
|
+
const callbackRef = useRef6(callback);
|
|
409
|
+
useEffect10(() => {
|
|
400
410
|
callbackRef.current = callback;
|
|
401
411
|
}, [
|
|
402
412
|
callback
|
|
403
413
|
]);
|
|
404
|
-
|
|
414
|
+
useEffect10(() => {
|
|
405
415
|
if (delay == null) {
|
|
406
416
|
return;
|
|
407
417
|
}
|
|
@@ -419,14 +429,14 @@ var useInterval = (callback, delay = 0, deps = []) => {
|
|
|
419
429
|
};
|
|
420
430
|
|
|
421
431
|
// src/useTransitions.ts
|
|
422
|
-
import { useEffect as
|
|
432
|
+
import { useEffect as useEffect11, useRef as useRef7, useState as useState9 } from "react";
|
|
423
433
|
var isFunction2 = (functionToCheck) => {
|
|
424
434
|
return functionToCheck instanceof Function;
|
|
425
435
|
};
|
|
426
436
|
var useDidTransition = (currentValue, fromValue, toValue) => {
|
|
427
|
-
const [hasTransitioned, setHasTransitioned] =
|
|
428
|
-
const previousValue =
|
|
429
|
-
|
|
437
|
+
const [hasTransitioned, setHasTransitioned] = useState9(false);
|
|
438
|
+
const previousValue = useRef7(currentValue);
|
|
439
|
+
useEffect11(() => {
|
|
430
440
|
const toValueValid = isFunction2(toValue) ? toValue(currentValue) : toValue === currentValue;
|
|
431
441
|
const fromValueValid = isFunction2(fromValue) ? fromValue(previousValue.current) : fromValue === previousValue.current;
|
|
432
442
|
if (fromValueValid && toValueValid && !hasTransitioned) {
|
|
@@ -444,15 +454,15 @@ var useDidTransition = (currentValue, fromValue, toValue) => {
|
|
|
444
454
|
return hasTransitioned;
|
|
445
455
|
};
|
|
446
456
|
var useOnTransition = (currentValue, fromValue, toValue, callback) => {
|
|
447
|
-
const dirty =
|
|
457
|
+
const dirty = useRef7(false);
|
|
448
458
|
const hasTransitioned = useDidTransition(currentValue, fromValue, toValue);
|
|
449
|
-
|
|
459
|
+
useEffect11(() => {
|
|
450
460
|
dirty.current = false;
|
|
451
461
|
}, [
|
|
452
462
|
currentValue,
|
|
453
463
|
dirty
|
|
454
464
|
]);
|
|
455
|
-
|
|
465
|
+
useEffect11(() => {
|
|
456
466
|
if (hasTransitioned && !dirty.current) {
|
|
457
467
|
callback();
|
|
458
468
|
dirty.current = true;
|
|
@@ -463,9 +473,6 @@ var useOnTransition = (currentValue, fromValue, toValue, callback) => {
|
|
|
463
473
|
callback
|
|
464
474
|
]);
|
|
465
475
|
};
|
|
466
|
-
|
|
467
|
-
// src/index.ts
|
|
468
|
-
import { useSize, useScroller } from "mini-virtual-list";
|
|
469
476
|
export {
|
|
470
477
|
makeId,
|
|
471
478
|
mergeRefs,
|
|
@@ -473,6 +480,8 @@ export {
|
|
|
473
480
|
setRef,
|
|
474
481
|
useAsyncEffect,
|
|
475
482
|
useAsyncState,
|
|
483
|
+
useAtomState,
|
|
484
|
+
useComposedRefs,
|
|
476
485
|
useControlledState,
|
|
477
486
|
useDebugDeps,
|
|
478
487
|
useDefaultValue,
|
|
@@ -490,8 +499,6 @@ export {
|
|
|
490
499
|
useOnTransition,
|
|
491
500
|
useRefCallback,
|
|
492
501
|
useScroller,
|
|
493
|
-
useSignalsEffect,
|
|
494
|
-
useSignalsMemo,
|
|
495
502
|
useSize,
|
|
496
503
|
useStateWithRef,
|
|
497
504
|
useTimeout,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../../../src/
|
|
4
|
-
"sourcesContent": ["//\n// Copyright 2022 DXOS.org\n//\n\nimport { type DependencyList, type EffectCallback, useEffect } from 'react';\n\n/**\n * Async version of useEffect.\n * The `AbortController` can be used to detect if the component has been unmounted and\n * can be used to propagate abort signals to downstream async operations (e.g., `fetch`).\n */\nexport const useAsyncEffect = (\n cb: (controller: AbortController) => Promise<EffectCallback | void>,\n deps?: DependencyList,\n) => {\n useEffect(() => {\n const controller = new AbortController();\n let cleanup: EffectCallback | void;\n // NOTE: Timeout enables us to immediately cancel. if the component is unmounted.\n const t = setTimeout(async () => {\n if (!controller.signal.aborted) {\n cleanup = await cb(controller);\n }\n });\n\n return () => {\n clearTimeout(t);\n controller.abort();\n cleanup?.();\n };\n }, deps ?? []);\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { type Dispatch, type SetStateAction, useEffect, useState } from 'react';\n\n/**\n * NOTE: Use with care and when necessary to be able to cancel an async operation when unmounting.\n */\nexport const useAsyncState = <T>(\n cb: () => Promise<T | undefined>,\n deps: any[] = [],\n): [T | undefined, Dispatch<SetStateAction<T | undefined>>] => {\n const [value, setValue] = useState<T | undefined>();\n useEffect(() => {\n let disposed = false;\n const t = setTimeout(async () => {\n const data = await cb();\n if (!disposed) {\n setValue(data);\n }\n });\n\n return () => {\n disposed = true;\n clearTimeout(t);\n };\n }, deps);\n\n return [value, setValue];\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Dispatch, type SetStateAction, useCallback, useEffect, useRef, useState } from 'react';\n\nimport { useDynamicRef } from './useDynamicRef';\n\n/**\n * A stateful hook with a controlled value.\n * @deprecated Use Radix `useControllableState` (NOTE: `useControlledState` is not compatible with `useControllableState`)\n */\nexport const useControlledState = <T>(\n valueParam: T,\n onChange?: (value: T) => void,\n): [T, Dispatch<SetStateAction<T>>] => {\n const [value, setControlledValue] = useState(valueParam);\n useEffect(() => {\n setControlledValue(valueParam);\n }, [valueParam]);\n\n const onChangeRef = useRef(onChange);\n const valueRef = useDynamicRef(valueParam);\n const setValue = useCallback<Dispatch<SetStateAction<T>>>(\n (nextValue) => {\n const value = isFunction(nextValue) ? nextValue(valueRef.current) : nextValue;\n setControlledValue(value);\n onChangeRef.current?.(value);\n },\n [valueRef, onChangeRef],\n );\n\n return [value, setValue];\n};\n\nfunction isFunction(value: unknown): value is (...args: any[]) => any {\n return typeof value === 'function';\n}\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { useCallback } from '@preact-signals/safe-react/react';\nimport { type Dispatch, type RefObject, type SetStateAction, useEffect, useRef, useState } from 'react';\n\n/**\n * Like `useState` but with an additional dynamic value.\n */\nexport const useStateWithRef = <T>(valueParam: T): [T, Dispatch<SetStateAction<T>>, RefObject<T>] => {\n const [value, setValue] = useState<T>(valueParam);\n const valueRef = useRef<T>(valueParam);\n const setter = useCallback<Dispatch<SetStateAction<T>>>((value) => {\n if (typeof value === 'function') {\n setValue((current) => {\n valueRef.current = (value as Function)(current);\n return valueRef.current;\n });\n } else {\n valueRef.current = value;\n setValue(value);\n }\n }, []);\n\n return [value, setter, valueRef];\n};\n\n/**\n * Ref that is updated by a dependency.\n */\nexport const useDynamicRef = <T>(value: T): RefObject<T> => {\n const valueRef = useRef<T>(value);\n useEffect(() => {\n valueRef.current = value;\n }, [value]);\n\n return valueRef;\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { type DependencyList, useEffect, useRef } from 'react';\n\n/**\n * Util to log deps that have changed.\n */\nexport const useDebugDeps = (deps: DependencyList = [], active = true) => {\n const lastDeps = useRef<DependencyList>([]);\n useEffect(() => {\n console.group('deps changed', { previous: lastDeps.current.length, current: deps.length });\n for (let i = 0; i < Math.max(lastDeps.current.length ?? 0, deps.length ?? 0); i++) {\n if (lastDeps.current[i] !== deps[i] && active) {\n console.log('changed', {\n index: i,\n previous: lastDeps.current[i],\n current: deps[i],\n });\n }\n }\n console.groupEnd();\n lastDeps.current = deps;\n }, deps);\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { useEffect, useMemo, useState } from 'react';\n\n/**\n * A custom React hook that provides a stable default value for a potentially undefined reactive value.\n * The defaultValue is memoized upon component mount and remains unchanged until the component unmounts,\n * ensuring stability across all re-renders, even if the defaultValue prop changes.\n *\n * Note: The defaultValue is not reactive. It retains the same value from the component's mount to unmount.\n *\n * @param reactiveValue - The value that may change over time.\n * @param defaultValue - The initial value used when the reactiveValue is undefined. This value is not reactive.\n * @returns - The reactiveValue if it's defined, otherwise the defaultValue.\n */\nexport const useDefaultValue = <T>(reactiveValue: T | undefined | null, getDefaultValue: () => T): T => {\n // Memoize defaultValue with an empty dependency array.\n // This ensures that the defaultValue instance remains stable across all re-renders,\n // regardless of whether the defaultValue changes.\n const stableDefaultValue = useMemo(getDefaultValue, []);\n const [value, setValue] = useState(reactiveValue ?? stableDefaultValue);\n useEffect(() => {\n setValue(reactiveValue ?? stableDefaultValue);\n }, [reactiveValue, stableDefaultValue]);\n\n return value;\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport defaultsDeep from 'lodash.defaultsdeep';\nimport { useMemo } from 'react';\n\n/**\n * Returns a memo-ized deep-merged object of the default and value.\n * If value is undefined or null, then returns the default.\n */\nexport const useDefaults = <T>(value: T | undefined | null, defaults: T): T => {\n return useMemo(() => defaultsDeep({}, defaults, value), [value, defaults]);\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { useMemo } from 'react';\n\n/**\n * File download anchor.\n *\n * ```\n * const download = useDownload();\n * const handleDownload = (data: string) => {\n * download(new Blob([data], { type: 'text/plain' }), 'test.txt');\n * };\n * ```\n */\nexport const useFileDownload = (): ((data: Blob | string, filename: string) => void) => {\n return useMemo(\n () => (data: Blob | string, filename: string) => {\n const url = typeof data === 'string' ? data : URL.createObjectURL(data);\n const element = document.createElement('a');\n element.setAttribute('href', url);\n element.setAttribute('download', filename);\n element.setAttribute('target', 'download');\n element.click();\n },\n [],\n );\n};\n", "//\n// Copyright 2022 DXOS.org\n//\n\nimport { type ForwardedRef, type Ref, type RefCallback, useEffect, useMemo, useRef } from 'react';\n\n/**\n * Combines a possibly undefined forwarded ref with a locally defined ref.\n * Returns a stable ref object that synchronizes with the forwarded ref.\n *\n * Best practice: This hook creates a stable local ref and synchronizes it with the forwarded ref.\n * The returned ref object is stable across renders, preventing infinite loops caused by ref identity changes.\n *\n * NOTE: This pattern doesn't update refs once they are set. If this is required, use `useMergeRefs`.\n */\nexport const useForwardedRef = <T>(forwardedRef: ForwardedRef<T>) => {\n const localRef = useRef<T>(null as T);\n useEffect(() => {\n setRef(forwardedRef, localRef.current);\n }, [forwardedRef]);\n\n return localRef;\n};\n\n/**\n * Sets a value on a React ref, handling both callback refs and ref objects.\n * Returns a cleanup function if the ref is a callback ref.\n */\nexport function setRef<T>(ref: Ref<T> | undefined | null, value: T | null): ReturnType<RefCallback<T>> {\n if (typeof ref === 'function') {\n return ref(value);\n } else if (ref) {\n ref.current = value;\n }\n}\n\n/**\n * Merges multiple refs into a single ref callback.\n * Returns a ref callback that synchronizes all provided refs and handles cleanup.\n */\nexport const mergeRefs = <T>(refs: (Ref<T> | undefined)[]): Ref<T> => {\n return (value: T | null) => {\n const cleanups: (() => void)[] = [];\n for (const ref of refs) {\n const cleanup = setRef(ref, value);\n cleanups.push(typeof cleanup === 'function' ? cleanup : () => setRef(ref, null));\n }\n\n return () => {\n for (const cleanup of cleanups) cleanup();\n };\n };\n};\n\n/**\n * Hook that merges multiple refs into a single stable ref callback.\n * The returned ref is memoized and only changes when the refs array changes.\n */\nexport const useMergeRefs = <T>(refs: (Ref<T> | undefined)[]): Ref<T> => {\n return useMemo(() => mergeRefs(refs), refs);\n};\n", "//\n// Copyright 2022 DXOS.org\n//\n\nimport alea from 'alea';\nimport { useMemo } from 'react';\n\ninterface PrngFactory {\n new (seed?: string): () => number;\n}\n\nconst Alea: PrngFactory = alea as unknown as PrngFactory;\n\nconst prng = new Alea('@dxos/react-hooks');\n\n// TODO(burdon): Replace with PublicKey.random().\nexport const randomString = (n = 4) =>\n prng()\n .toString(16)\n .slice(2, n + 2);\n\nexport const useId = (namespace: string, propsId?: string, opts?: Partial<{ n: number }>) =>\n useMemo(() => makeId(namespace, propsId, opts), [propsId]);\n\nexport const makeId = (namespace: string, propsId?: string, opts?: Partial<{ n: number }>) =>\n propsId ?? `${namespace}-${randomString(opts?.n ?? 4)}`;\n", "//\n// Copyright 2022 DXOS.org\n//\n\n// Based upon the useIsFocused hook which is part of the `rci` project:\n/// https://github.com/leonardodino/rci/blob/main/packages/use-is-focused\n\nimport { type RefObject, useEffect, useRef, useState } from 'react';\n\nexport const useIsFocused = (inputRef: RefObject<HTMLInputElement | null>) => {\n const [isFocused, setIsFocused] = useState<boolean | undefined>(undefined);\n const isFocusedRef = useRef<boolean | undefined>(isFocused);\n\n isFocusedRef.current = isFocused;\n\n useEffect(() => {\n const input = inputRef.current;\n if (!input) {\n return;\n }\n\n const onFocus = () => setIsFocused(true);\n const onBlur = () => setIsFocused(false);\n input.addEventListener('focus', onFocus);\n input.addEventListener('blur', onBlur);\n\n if (isFocusedRef.current === undefined) {\n setIsFocused(document.activeElement === input);\n }\n\n return () => {\n input.removeEventListener('focus', onFocus);\n input.removeEventListener('blur', onBlur);\n };\n }, [inputRef, setIsFocused]);\n\n return isFocused;\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\n// This hook is based on Chakra UI’s `useMediaQuery`: https://github.com/chakra-ui/chakra-ui/blob/main/packages/components/media-query/src/use-media-query.ts\n\nimport { useEffect, useState } from 'react';\n\n// TODO(thure): This should be derived from the same source of truth as the Tailwind theme config.\nconst breakpointMediaQueries: Record<string, string> = {\n sm: '(min-width: 640px)',\n md: '(min-width: 768px)',\n lg: '(min-width: 1024px)',\n xl: '(min-width: 1280px)',\n '2xl': '(min-width: 1536px)',\n};\n\nexport type UseMediaQueryOptions = {\n fallback?: boolean | boolean[];\n ssr?: boolean;\n};\n\n/**\n * React hook that tracks state of a CSS media query.\n *\n * @param query the media query to match, or a recognized breakpoint token\n * @param options the media query options { fallback, ssr }\n *\n * @see Docs https://chakra-ui.com/docs/hooks/use-media-query\n */\nexport const useMediaQuery = (query: string | string[], options: UseMediaQueryOptions = {}): boolean[] => {\n const { ssr = false, fallback } = options;\n\n const queries = (Array.isArray(query) ? query : [query]).map((query) =>\n query in breakpointMediaQueries ? breakpointMediaQueries[query] : query,\n );\n\n let fallbackValues = Array.isArray(fallback) ? fallback : [fallback];\n fallbackValues = fallbackValues.filter((v) => v != null) as boolean[];\n\n const [value, setValue] = useState(() => {\n return queries.map((query, index) => ({\n media: query,\n matches: ssr ? !!fallbackValues[index] : document.defaultView?.matchMedia(query).matches,\n }));\n });\n\n useEffect(() => {\n setValue(\n queries.map((query) => ({\n media: query,\n matches: document.defaultView?.matchMedia(query).matches,\n })),\n );\n\n const mql = queries.map((query) => document.defaultView?.matchMedia(query));\n\n const handler = (evt: MediaQueryListEvent) => {\n setValue((prev) => {\n return prev.slice().map((item) => {\n if (item.media === evt.media) {\n return { ...item, matches: evt.matches };\n }\n return item;\n });\n });\n };\n\n mql.forEach((mql) => {\n if (typeof mql?.addListener === 'function') {\n mql?.addListener(handler);\n } else {\n mql?.addEventListener('change', handler);\n }\n });\n\n return () => {\n mql.forEach((mql) => {\n if (typeof mql?.removeListener === 'function') {\n mql?.removeListener(handler);\n } else {\n mql?.removeEventListener('change', handler);\n }\n });\n };\n }, [document.defaultView]);\n\n return value.map((item) => !!item.matches);\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { useMemo, useSyncExternalStore } from 'react';\n\nimport { type MulticastObservable } from '@dxos/async';\n\n/**\n * Subscribe to a MulticastObservable and return the latest value.\n * @param observable the observable to subscribe to. Will resubscribe if the observable changes.\n */\n// TODO(burdon): Move to react-hooks.\nexport const useMulticastObservable = <T>(observable: MulticastObservable<T>): T => {\n // Make sure useSyncExternalStore is stable in respect to the observable.\n const subscribeFn = useMemo(\n () => (listener: () => void) => {\n const subscription = observable.subscribe(listener);\n return () => subscription.unsubscribe();\n },\n [observable],\n );\n\n // useSyncExternalStore will resubscribe to the observable and update the value if the subscribeFn changes.\n return useSyncExternalStore(subscribeFn, () => observable.get());\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { type RefCallback, useState } from 'react';\n\n/**\n * Custom React Hook that creates a ref callback and a state variable.\n * The ref callback sets the state variable when the ref changes.\n *\n * @returns An object containing the ref callback and the current value of the ref.\n */\nexport const useRefCallback = <T = any>(): { refCallback: RefCallback<T>; value: T | null } => {\n const [value, setValue] = useState<T | null>(null);\n return { refCallback: (value: T) => setValue(value), value };\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { useLayoutEffect, useMemo } from 'react';\n\nexport const useViewportResize = (\n handler: (event?: Event) => void,\n deps: Parameters<typeof useLayoutEffect>[1] = [],\n delay: number = 800,\n) => {\n const debouncedHandler = useMemo(() => {\n let timeout: ReturnType<typeof setTimeout>;\n return (event?: Event) => {\n clearTimeout(timeout);\n timeout = setTimeout(() => {\n handler(event);\n }, delay);\n };\n }, [handler, delay]);\n\n return useLayoutEffect(() => {\n window.visualViewport?.addEventListener('resize', debouncedHandler);\n debouncedHandler();\n return () => window.visualViewport?.removeEventListener('resize', debouncedHandler);\n }, [debouncedHandler, ...deps]);\n};\n", "//\n// Copyright 2022 DXOS.org\n//\n\nimport { computed, effect } from '@preact-signals/safe-react';\nimport { useRef } from '@preact-signals/safe-react/react';\nimport { type DependencyList, useEffect, useMemo } from 'react';\n\n/**\n * Like `useEffect` but also tracks signals inside of the callback.\n */\nexport const useSignalsEffect = (cb: () => void | (() => void), deps?: DependencyList) => {\n const callback = useRef(cb);\n callback.current = cb;\n useEffect(() => {\n return effect(() => {\n return callback.current();\n });\n }, deps ?? []);\n};\n\n/**\n * Like `useMemo` but also tracks signals inside of the callback.\n */\nexport const useSignalsMemo = <T>(cb: () => T, deps?: DependencyList) => {\n return useMemo(() => computed(cb), deps ?? []).value;\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { useEffect, useRef } from 'react';\n\nexport const useTimeout = (callback?: () => Promise<void>, delay = 0, deps: any[] = []) => {\n const callbackRef = useRef(callback);\n useEffect(() => {\n callbackRef.current = callback;\n }, [callback]);\n\n useEffect(() => {\n if (delay == null) {\n return;\n }\n\n const t = setTimeout(() => callbackRef.current?.(), delay);\n return () => clearTimeout(t);\n }, [delay, ...deps]);\n};\n\nexport const useInterval = (\n callback?: (() => Promise<void | boolean>) | (() => void | boolean),\n delay = 0,\n deps: any[] = [],\n) => {\n const callbackRef = useRef(callback);\n useEffect(() => {\n callbackRef.current = callback;\n }, [callback]);\n\n useEffect(() => {\n if (delay == null) {\n return;\n }\n\n const i = setInterval(async () => {\n const result = await callbackRef.current?.();\n if (result === false) {\n clearInterval(i);\n }\n }, delay);\n return () => clearInterval(i);\n }, [delay, ...deps]);\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { useEffect, useRef, useState } from 'react';\n\nconst isFunction = <T>(functionToCheck: any): functionToCheck is (value: T) => boolean => {\n return functionToCheck instanceof Function;\n};\n\n/**\n * This is an internal custom hook that checks if a value has transitioned from a specified 'from' value to a 'to' value.\n *\n * @param currentValue - The value that is being monitored for transitions.\n * @param fromValue - The *from* value or a predicate function that determines the start of the transition.\n * @param toValue - The *to* value or a predicate function that determines the end of the transition.\n * @returns A boolean indicating whether the transition from *fromValue* to *toValue* has occurred.\n *\n * @internal Consider using `useOnTransition` for handling transitions instead of this hook.\n */\nexport const useDidTransition = <T>(\n currentValue: T,\n fromValue: T | ((value: T) => boolean),\n toValue: T | ((value: T) => boolean),\n) => {\n const [hasTransitioned, setHasTransitioned] = useState(false);\n const previousValue = useRef<T>(currentValue);\n\n useEffect(() => {\n const toValueValid = isFunction<T>(toValue) ? toValue(currentValue) : toValue === currentValue;\n const fromValueValid = isFunction<T>(fromValue)\n ? fromValue(previousValue.current)\n : fromValue === previousValue.current;\n\n if (fromValueValid && toValueValid && !hasTransitioned) {\n setHasTransitioned(true);\n } else if ((!fromValueValid || !toValueValid) && hasTransitioned) {\n setHasTransitioned(false);\n }\n\n previousValue.current = currentValue;\n }, [currentValue, fromValue, toValue, hasTransitioned]);\n\n return hasTransitioned;\n};\n\n/**\n * Executes a callback function when a specified transition occurs in a value.\n *\n * This function utilizes the `useDidTransition` hook to monitor changes in `currentValue`.\n * When `currentValue` transitions from `fromValue` to `toValue`, the provided `callback` function is executed.\n */\n// TODO(wittjosiah): Seems overwrought.\nexport const useOnTransition = <T>(\n currentValue: T,\n fromValue: T | ((value: T) => boolean),\n toValue: T | ((value: T) => boolean),\n callback: () => void,\n) => {\n const dirty = useRef(false);\n const hasTransitioned = useDidTransition(currentValue, fromValue, toValue);\n\n useEffect(() => {\n dirty.current = false;\n }, [currentValue, dirty]);\n\n useEffect(() => {\n if (hasTransitioned && !dirty.current) {\n callback();\n dirty.current = true;\n }\n }, [hasTransitioned, dirty, callback]);\n};\n", "//\n// Copyright 2022 DXOS.org\n//\n\nexport * from './useAsyncEffect';\nexport * from './useAsyncState';\nexport * from './useControlledState';\nexport * from './useDebugDeps';\nexport * from './useDefaultValue';\nexport * from './useDefaults';\nexport * from './useDynamicRef';\nexport * from './useFileDownload';\nexport * from './useForwardedRef';\nexport * from './useId';\nexport * from './useIsFocused';\nexport * from './useMediaQuery';\nexport * from './useMulticastObservable';\nexport * from './useRefCallback';\nexport * from './useViewportResize';\nexport * from './useSignals';\nexport * from './useTimeout';\nexport * from './useTransitions';\n\nexport { useSize, useScroller } from 'mini-virtual-list';\n"],
|
|
5
|
-
"mappings": ";;;AAIA,
|
|
6
|
-
"names": ["useEffect", "useAsyncEffect", "cb", "deps", "
|
|
3
|
+
"sources": ["../../../src/index.ts", "../../../src/useAsyncEffect.ts", "../../../src/useAtomState.ts", "../../../src/useAsyncState.ts", "../../../src/useControlledState.ts", "../../../src/useDynamicRef.ts", "../../../src/useDebugDeps.ts", "../../../src/useDefaultValue.ts", "../../../src/useDefaults.ts", "../../../src/useFileDownload.ts", "../../../src/useForwardedRef.ts", "../../../src/useId.ts", "../../../src/useIsFocused.ts", "../../../src/useMediaQuery.ts", "../../../src/useMulticastObservable.ts", "../../../src/useRefCallback.ts", "../../../src/useViewportResize.ts", "../../../src/useTimeout.ts", "../../../src/useTransitions.ts"],
|
|
4
|
+
"sourcesContent": ["//\n// Copyright 2022 DXOS.org\n//\n\nexport { useComposedRefs } from '@radix-ui/react-compose-refs';\nexport { useSize, useScroller } from 'mini-virtual-list';\n\nexport * from './useAsyncEffect';\nexport * from './useAtomState';\nexport * from './useAsyncState';\nexport * from './useControlledState';\nexport * from './useDebugDeps';\nexport * from './useDefaultValue';\nexport * from './useDefaults';\nexport * from './useDynamicRef';\nexport * from './useFileDownload';\nexport * from './useForwardedRef';\nexport * from './useId';\nexport * from './useIsFocused';\nexport * from './useMediaQuery';\nexport * from './useMulticastObservable';\nexport * from './useRefCallback';\nexport * from './useViewportResize';\nexport * from './useTimeout';\nexport * from './useTransitions';\n", "//\n// Copyright 2022 DXOS.org\n//\n\nimport { type DependencyList, type EffectCallback, useEffect } from 'react';\n\n/**\n * Async version of useEffect.\n * The `AbortController` can be used to detect if the component has been unmounted and\n * can be used to propagate abort signals to downstream async operations (e.g., `fetch`).\n */\nexport const useAsyncEffect = (\n cb: (controller: AbortController) => Promise<EffectCallback | void>,\n deps?: DependencyList,\n) => {\n useEffect(() => {\n const controller = new AbortController();\n let cleanup: EffectCallback | void;\n // NOTE: Timeout enables us to immediately cancel. if the component is unmounted.\n const t = setTimeout(async () => {\n if (!controller.signal.aborted) {\n cleanup = await cb(controller);\n }\n });\n\n return () => {\n clearTimeout(t);\n controller.abort();\n cleanup?.();\n };\n }, deps ?? []);\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { Atom, useAtomSet, useAtomValue } from '@effect-atom/atom-react';\nimport { useMemo, useState } from 'react';\n\nexport type AtomState<T> = {\n atom: Atom.Writable<T>;\n value: T;\n set: (value: T | ((value: T) => T)) => void;\n};\n\n/**\n * Wraps a writable atom together with its current value and setter.\n * The atom is created once on first render; `initialValue` is only used to seed it.\n */\nexport const useAtomState = <T>(initialValue: T): AtomState<T> => {\n const [atom] = useState(() => Atom.make(initialValue));\n const value = useAtomValue(atom);\n const set = useAtomSet(atom);\n return useMemo(() => ({ atom, value, set }), [atom, value, set]);\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { type Dispatch, type SetStateAction, useEffect, useState } from 'react';\n\n/**\n * NOTE: Use with care and when necessary to be able to cancel an async operation when unmounting.\n */\nexport const useAsyncState = <T>(\n cb: () => Promise<T | undefined>,\n deps: any[] = [],\n): [T | undefined, Dispatch<SetStateAction<T | undefined>>] => {\n const [value, setValue] = useState<T | undefined>();\n useEffect(() => {\n let disposed = false;\n const t = setTimeout(async () => {\n const data = await cb();\n if (!disposed) {\n setValue(data);\n }\n });\n\n return () => {\n disposed = true;\n clearTimeout(t);\n };\n }, deps);\n\n return [value, setValue];\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Dispatch, type SetStateAction, useCallback, useEffect, useRef, useState } from 'react';\n\nimport { useDynamicRef } from './useDynamicRef';\n\n/**\n * A stateful hook with a controlled value.\n * NOTE: Consider using Radix's `useControllableState`.\n */\nexport const useControlledState = <T>(\n valueProp: T,\n onChange?: (value: T) => void,\n): [T, Dispatch<SetStateAction<T>>] => {\n const [value, setControlledValue] = useState(valueProp);\n useEffect(() => {\n setControlledValue(valueProp);\n }, [valueProp]);\n\n const onChangeRef = useRef(onChange);\n const valueRef = useDynamicRef(valueProp);\n const setValue = useCallback<Dispatch<SetStateAction<T>>>(\n (nextValue) => {\n const value = isFunction(nextValue) ? nextValue(valueRef.current) : nextValue;\n setControlledValue(value);\n onChangeRef.current?.(value);\n },\n [valueRef, onChangeRef],\n );\n\n return [value, setValue];\n};\n\nfunction isFunction(value: unknown): value is (...args: any[]) => any {\n return typeof value === 'function';\n}\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { type Dispatch, type RefObject, type SetStateAction, useCallback, useEffect, useRef, useState } from 'react';\n\n/**\n * Like `useState` but with an additional dynamic value.\n */\nexport const useStateWithRef = <T>(valueProp: T): [T, Dispatch<SetStateAction<T>>, RefObject<T>] => {\n const [value, setValue] = useState<T>(valueProp);\n const valueRef = useRef<T>(valueProp);\n const setter = useCallback<Dispatch<SetStateAction<T>>>((value) => {\n if (typeof value === 'function') {\n setValue((current) => {\n valueRef.current = (value as Function)(current);\n return valueRef.current;\n });\n } else {\n valueRef.current = value;\n setValue(value);\n }\n }, []);\n\n return [value, setter, valueRef];\n};\n\n/**\n * Ref that is updated by a dependency.\n */\nexport const useDynamicRef = <T>(value: T): RefObject<T> => {\n const valueRef = useRef<T>(value);\n useEffect(() => {\n valueRef.current = value;\n }, [value]);\n\n return valueRef;\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { type DependencyList, useEffect, useRef } from 'react';\n\nimport { log } from '@dxos/log';\n\n/**\n * Util to log deps that have changed.\n */\nexport const useDebugDeps = (deps: DependencyList = [], label = 'useDebugDeps', active = true) => {\n const lastDeps = useRef<DependencyList>([]);\n useEffect(() => {\n if (!active) {\n return;\n }\n\n const diff: Record<number, { previous: any; current: any }> = {};\n for (let i = 0; i < Math.max(lastDeps.current.length ?? 0, deps.length ?? 0); i++) {\n if (lastDeps.current[i] !== deps[i] || i > lastDeps.current.length) {\n diff[i] = {\n previous: lastDeps.current[i],\n current: deps[i],\n };\n }\n }\n\n if (Object.keys(diff).length > 0) {\n log.warn(`Updated: ${label} [${lastDeps.current.length}/${deps.length}]`, diff);\n }\n\n lastDeps.current = deps;\n }, [...deps, active]);\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { useEffect, useMemo, useState } from 'react';\n\n/**\n * A custom React hook that provides a stable default value for a potentially undefined reactive value.\n * The defaultValue is memoized upon component mount and remains unchanged until the component unmounts,\n * ensuring stability across all re-renders, even if the defaultValue prop changes.\n *\n * Note: The defaultValue is not reactive. It retains the same value from the component's mount to unmount.\n *\n * @param reactiveValue - The value that may change over time.\n * @param defaultValue - The initial value used when the reactiveValue is undefined. This value is not reactive.\n * @returns - The reactiveValue if it's defined, otherwise the defaultValue.\n */\nexport const useDefaultValue = <T>(reactiveValue: T | undefined | null, getDefaultValue: () => T): T => {\n // Memoize defaultValue with an empty dependency array.\n // This ensures that the defaultValue instance remains stable across all re-renders,\n // regardless of whether the defaultValue changes.\n const stableDefaultValue = useMemo(getDefaultValue, []);\n const [value, setValue] = useState(reactiveValue ?? stableDefaultValue);\n useEffect(() => {\n setValue(reactiveValue ?? stableDefaultValue);\n }, [reactiveValue, stableDefaultValue]);\n\n return value;\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport defaultsDeep from 'lodash.defaultsdeep';\nimport { useMemo } from 'react';\n\n/**\n * Returns a memo-ized deep-merged object of the default and value.\n * If value is undefined or null, then returns the default.\n */\nexport const useDefaults = <T>(value: T | undefined | null, defaults: T): T => {\n return useMemo(() => defaultsDeep({}, defaults, value), [value, defaults]);\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { useMemo } from 'react';\n\n/**\n * File download anchor.\n *\n * ```\n * const download = useDownload();\n * const handleDownload = (data: string) => {\n * download(new Blob([data], { type: 'text/plain' }), 'test.txt');\n * };\n * ```\n */\nexport const useFileDownload = (): ((data: Blob | string, filename: string) => void) => {\n return useMemo(\n () => (data: Blob | string, filename: string) => {\n const url = typeof data === 'string' ? data : URL.createObjectURL(data);\n const element = document.createElement('a');\n element.setAttribute('href', url);\n element.setAttribute('download', filename);\n element.setAttribute('target', 'download');\n element.click();\n },\n [],\n );\n};\n", "//\n// Copyright 2022 DXOS.org\n//\n\nimport { type ForwardedRef, type Ref, type RefCallback, useEffect, useMemo, useRef } from 'react';\n\n/**\n * Combines a possibly undefined forwarded ref with a locally defined ref.\n * Returns a stable ref object that synchronizes with the forwarded ref.\n *\n * Best practice: This hook creates a stable local ref and synchronizes it with the forwarded ref.\n * The returned ref object is stable across renders, preventing infinite loops caused by ref identity changes.\n *\n * NOTE: This pattern doesn't update refs once they are set. If this is required, use `useMergeRefs`.\n */\nexport const useForwardedRef = <T>(forwardedRef: ForwardedRef<T>) => {\n const localRef = useRef<T>(null as T);\n useEffect(() => {\n setRef(forwardedRef, localRef.current);\n }, [forwardedRef]);\n\n return localRef;\n};\n\n/**\n * Sets a value on a React ref, handling both callback refs and ref objects.\n * Returns a cleanup function if the ref is a callback ref.\n */\nexport function setRef<T>(ref: Ref<T> | undefined | null, value: T | null): ReturnType<RefCallback<T>> {\n if (typeof ref === 'function') {\n return ref(value);\n } else if (ref) {\n ref.current = value;\n }\n}\n\n/**\n * Merges multiple refs into a single ref callback.\n * Returns a ref callback that synchronizes all provided refs and handles cleanup.\n */\nexport const mergeRefs = <T>(refs: (Ref<T> | undefined)[]): Ref<T> => {\n return (value: T | null) => {\n const cleanups: (() => void)[] = [];\n for (const ref of refs) {\n const cleanup = setRef(ref, value);\n cleanups.push(typeof cleanup === 'function' ? cleanup : () => setRef(ref, null));\n }\n\n return () => {\n for (const cleanup of cleanups) {\n cleanup();\n }\n };\n };\n};\n\n/**\n * Hook that merges multiple refs into a single stable ref callback.\n * The returned ref is memoized and only changes when the refs array changes.\n */\nexport const useMergeRefs = <T>(refs: (Ref<T> | undefined)[]): Ref<T> => {\n return useMemo(() => mergeRefs(refs), [...refs]);\n};\n", "//\n// Copyright 2022 DXOS.org\n//\n\nimport alea from 'alea';\nimport { useMemo } from 'react';\n\ninterface PrngFactory {\n new (seed?: string): () => number;\n}\n\nconst Alea: PrngFactory = alea as unknown as PrngFactory;\n\nconst prng = new Alea('@dxos/react-hooks');\n\n// TODO(burdon): Replace with PublicKey.random().\nexport const randomString = (n = 4) =>\n prng()\n .toString(16)\n .slice(2, n + 2);\n\nexport const useId = (namespace: string, propsId?: string, opts?: Partial<{ n: number }>) => {\n return useMemo(() => makeId(namespace, propsId, opts), [propsId]);\n};\n\nexport const makeId = (namespace: string, propsId?: string, opts?: Partial<{ n: number }>) =>\n propsId ?? `${namespace}-${randomString(opts?.n ?? 4)}`;\n", "//\n// Copyright 2022 DXOS.org\n//\n\n// Based upon the useIsFocused hook which is part of the `rci` project:\n/// https://github.com/leonardodino/rci/blob/main/packages/use-w-focused\n\nimport { type RefObject, useEffect, useRef, useState } from 'react';\n\nexport const useIsFocused = (inputRef: RefObject<HTMLInputElement | null>) => {\n const [isFocused, setIsFocused] = useState<boolean | undefined>(undefined);\n const isFocusedRef = useRef<boolean | undefined>(isFocused);\n\n isFocusedRef.current = isFocused;\n\n useEffect(() => {\n const input = inputRef.current;\n if (!input) {\n return;\n }\n\n const onFocus = () => setIsFocused(true);\n const onBlur = () => setIsFocused(false);\n input.addEventListener('focus', onFocus);\n input.addEventListener('blur', onBlur);\n\n if (isFocusedRef.current === undefined) {\n setIsFocused(document.activeElement === input);\n }\n\n return () => {\n input.removeEventListener('focus', onFocus);\n input.removeEventListener('blur', onBlur);\n };\n }, [inputRef, setIsFocused]);\n\n return isFocused;\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\n// This hook is based on Chakra UI’s `useMediaQuery`: https://github.com/chakra-ui/chakra-ui/blob/main/packages/components/media-query/src/use-media-query.ts\n\nimport { useEffect, useState } from 'react';\n\n// TODO(thure): This should be derived from the same source of truth as the Tailwind theme config.\nconst breakpointMediaQueries: Record<string, string> = {\n sm: '(min-width: 640px)',\n md: '(min-width: 768px)',\n lg: '(min-width: 1024px)',\n xl: '(min-width: 1280px)',\n '2xl': '(min-width: 1536px)',\n};\n\nexport type UseMediaQueryOptions = {\n fallback?: boolean | boolean[];\n ssr?: boolean;\n};\n\n/**\n * React hook that tracks state of a CSS media query.\n *\n * @param query the media query to match, or a recognized breakpoint token\n * @param options the media query options { fallback, ssr }\n *\n * @see Docs https://chakra-ui.com/docs/hooks/use-media-query\n */\nexport const useMediaQuery = (query: string | string[], options: UseMediaQueryOptions = {}): boolean[] => {\n const { ssr = false, fallback } = options;\n\n const queries = (Array.isArray(query) ? query : [query]).map((query) =>\n query in breakpointMediaQueries ? breakpointMediaQueries[query] : query,\n );\n\n let fallbackValues = Array.isArray(fallback) ? fallback : [fallback];\n fallbackValues = fallbackValues.filter((v) => v != null) as boolean[];\n\n const [value, setValue] = useState(() => {\n return queries.map((query, index) => ({\n media: query,\n matches: ssr ? !!fallbackValues[index] : document.defaultView?.matchMedia(query).matches,\n }));\n });\n\n useEffect(() => {\n setValue(\n queries.map((query) => ({\n media: query,\n matches: document.defaultView?.matchMedia(query).matches,\n })),\n );\n\n const mql = queries.map((query) => document.defaultView?.matchMedia(query));\n\n const handler = (evt: MediaQueryListEvent) => {\n setValue((prev) => {\n return prev.slice().map((item) => {\n if (item.media === evt.media) {\n return { ...item, matches: evt.matches };\n }\n return item;\n });\n });\n };\n\n mql.forEach((mql) => {\n if (typeof mql?.addListener === 'function') {\n mql?.addListener(handler);\n } else {\n mql?.addEventListener('change', handler);\n }\n });\n\n return () => {\n mql.forEach((mql) => {\n if (typeof mql?.removeListener === 'function') {\n mql?.removeListener(handler);\n } else {\n mql?.removeEventListener('change', handler);\n }\n });\n };\n }, [document.defaultView]);\n\n return value.map((item) => !!item.matches);\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { useMemo, useSyncExternalStore } from 'react';\n\nimport { type MulticastObservable } from '@dxos/async';\n\n/**\n * Subscribe to a MulticastObservable and return the latest value.\n * @param observable the observable to subscribe to. Will resubscribe if the observable changes.\n */\n// TODO(burdon): Move to react-hooks.\nexport const useMulticastObservable = <T>(observable: MulticastObservable<T>): T => {\n // Make sure useSyncExternalStore is stable in respect to the observable.\n const subscribeFn = useMemo(\n () => (listener: () => void) => {\n const subscription = observable.subscribe(listener);\n return () => subscription.unsubscribe();\n },\n [observable],\n );\n\n // useSyncExternalStore will resubscribe to the observable and update the value if the subscribeFn changes.\n return useSyncExternalStore(subscribeFn, () => observable.get());\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { type RefCallback, useState } from 'react';\n\n/**\n * Custom React Hook that creates a ref callback and a state variable.\n * The ref callback sets the state variable when the ref changes.\n *\n * @returns An object containing the ref callback and the current value of the ref.\n */\nexport const useRefCallback = <T = any>(): { refCallback: RefCallback<T>; value: T | null } => {\n const [value, setValue] = useState<T | null>(null);\n return { refCallback: (value: T) => setValue(value), value };\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { useLayoutEffect, useMemo } from 'react';\n\nexport const useViewportResize = (\n cb: (event?: Event) => void,\n deps: Parameters<typeof useLayoutEffect>[1] = [],\n delay: number = 800,\n) => {\n const debouncedHandler = useMemo(() => {\n let timeout: ReturnType<typeof setTimeout>;\n return (event?: Event) => {\n clearTimeout(timeout);\n timeout = setTimeout(() => {\n cb(event);\n }, delay);\n };\n }, [cb, delay]);\n\n return useLayoutEffect(() => {\n window.visualViewport?.addEventListener('resize', debouncedHandler);\n debouncedHandler();\n return () => window.visualViewport?.removeEventListener('resize', debouncedHandler);\n }, [debouncedHandler, ...deps]);\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { useEffect, useRef } from 'react';\n\nexport const useTimeout = (callback?: () => Promise<void>, delay = 0, deps: any[] = []) => {\n const callbackRef = useRef(callback);\n useEffect(() => {\n callbackRef.current = callback;\n }, [callback]);\n\n useEffect(() => {\n if (delay == null) {\n return;\n }\n\n const t = setTimeout(() => callbackRef.current?.(), delay);\n return () => clearTimeout(t);\n }, [delay, ...deps]);\n};\n\nexport const useInterval = (\n callback?: (() => Promise<void | boolean>) | (() => void | boolean),\n delay = 0,\n deps: any[] = [],\n) => {\n const callbackRef = useRef(callback);\n useEffect(() => {\n callbackRef.current = callback;\n }, [callback]);\n\n useEffect(() => {\n if (delay == null) {\n return;\n }\n\n const i = setInterval(async () => {\n const result = await callbackRef.current?.();\n if (result === false) {\n clearInterval(i);\n }\n }, delay);\n return () => clearInterval(i);\n }, [delay, ...deps]);\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { useEffect, useRef, useState } from 'react';\n\nconst isFunction = <T>(functionToCheck: any): functionToCheck is (value: T) => boolean => {\n return functionToCheck instanceof Function;\n};\n\n/**\n * This is an internal custom hook that checks if a value has transitioned from a specified 'from' value to a 'to' value.\n *\n * @param currentValue - The value that is being monitored for transitions.\n * @param fromValue - The *from* value or a predicate function that determines the start of the transition.\n * @param toValue - The *to* value or a predicate function that determines the end of the transition.\n * @returns A boolean indicating whether the transition from *fromValue* to *toValue* has occurred.\n *\n * @internal Consider using `useOnTransition` for handling transitions instead of this hook.\n */\nexport const useDidTransition = <T>(\n currentValue: T,\n fromValue: T | ((value: T) => boolean),\n toValue: T | ((value: T) => boolean),\n) => {\n const [hasTransitioned, setHasTransitioned] = useState(false);\n const previousValue = useRef<T>(currentValue);\n\n useEffect(() => {\n const toValueValid = isFunction<T>(toValue) ? toValue(currentValue) : toValue === currentValue;\n const fromValueValid = isFunction<T>(fromValue)\n ? fromValue(previousValue.current)\n : fromValue === previousValue.current;\n\n if (fromValueValid && toValueValid && !hasTransitioned) {\n setHasTransitioned(true);\n } else if ((!fromValueValid || !toValueValid) && hasTransitioned) {\n setHasTransitioned(false);\n }\n\n previousValue.current = currentValue;\n }, [currentValue, fromValue, toValue, hasTransitioned]);\n\n return hasTransitioned;\n};\n\n/**\n * Executes a callback function when a specified transition occurs in a value.\n *\n * This function utilizes the `useDidTransition` hook to monitor changes in `currentValue`.\n * When `currentValue` transitions from `fromValue` to `toValue`, the provided `callback` function is executed.\n */\n// TODO(wittjosiah): Seems overwrought.\nexport const useOnTransition = <T>(\n currentValue: T,\n fromValue: T | ((value: T) => boolean),\n toValue: T | ((value: T) => boolean),\n callback: () => void,\n) => {\n const dirty = useRef(false);\n const hasTransitioned = useDidTransition(currentValue, fromValue, toValue);\n\n useEffect(() => {\n dirty.current = false;\n }, [currentValue, dirty]);\n\n useEffect(() => {\n if (hasTransitioned && !dirty.current) {\n callback();\n dirty.current = true;\n }\n }, [hasTransitioned, dirty, callback]);\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["useComposedRefs", "useSize", "useScroller", "useEffect", "useAsyncEffect", "cb", "deps", "controller", "AbortController", "cleanup", "t", "setTimeout", "signal", "aborted", "clearTimeout", "abort", "Atom", "useAtomSet", "useAtomValue", "useMemo", "useState", "useAtomState", "initialValue", "atom", "make", "value", "set", "useEffect", "useState", "useAsyncState", "cb", "deps", "value", "setValue", "disposed", "t", "setTimeout", "data", "clearTimeout", "useCallback", "useEffect", "useRef", "useState", "useCallback", "useEffect", "useRef", "useState", "useStateWithRef", "valueProp", "value", "setValue", "valueRef", "setter", "current", "useDynamicRef", "useControlledState", "valueProp", "onChange", "value", "setControlledValue", "useState", "useEffect", "onChangeRef", "useRef", "valueRef", "useDynamicRef", "setValue", "useCallback", "nextValue", "isFunction", "current", "useEffect", "useRef", "log", "lastDeps", "diff", "previous", "current", "Object", "deps", "useEffect", "useMemo", "useState", "useDefaultValue", "reactiveValue", "getDefaultValue", "stableDefaultValue", "value", "setValue", "defaultsDeep", "useMemo", "useDefaults", "value", "defaults", "useMemo", "useFileDownload", "data", "filename", "url", "URL", "createObjectURL", "element", "document", "createElement", "setAttribute", "click", "useEffect", "useMemo", "useRef", "useForwardedRef", "forwardedRef", "localRef", "setRef", "current", "ref", "value", "mergeRefs", "refs", "cleanups", "cleanup", "push", "useMergeRefs", "alea", "useMemo", "Alea", "prng", "randomString", "n", "toString", "slice", "useId", "namespace", "propsId", "opts", "makeId", "useEffect", "useRef", "useState", "useIsFocused", "inputRef", "isFocused", "setIsFocused", "undefined", "isFocusedRef", "current", "input", "onFocus", "onBlur", "addEventListener", "document", "activeElement", "removeEventListener", "useEffect", "useState", "breakpointMediaQueries", "sm", "md", "lg", "xl", "useMediaQuery", "query", "options", "ssr", "fallback", "queries", "Array", "isArray", "map", "fallbackValues", "filter", "v", "value", "setValue", "index", "media", "matches", "document", "defaultView", "matchMedia", "mql", "handler", "evt", "prev", "slice", "item", "forEach", "addListener", "addEventListener", "removeListener", "removeEventListener", "useMemo", "useSyncExternalStore", "useMulticastObservable", "observable", "subscribeFn", "listener", "subscription", "subscribe", "unsubscribe", "get", "useState", "useRefCallback", "value", "setValue", "refCallback", "useLayoutEffect", "useMemo", "useViewportResize", "cb", "deps", "delay", "debouncedHandler", "timeout", "event", "clearTimeout", "setTimeout", "window", "visualViewport", "addEventListener", "removeEventListener", "useEffect", "useRef", "useTimeout", "callback", "delay", "deps", "callbackRef", "current", "t", "setTimeout", "clearTimeout", "useInterval", "i", "setInterval", "result", "clearInterval", "useEffect", "useRef", "useState", "isFunction", "functionToCheck", "Function", "useDidTransition", "currentValue", "fromValue", "toValue", "hasTransitioned", "setHasTransitioned", "previousValue", "toValueValid", "fromValueValid", "current", "useOnTransition", "callback", "dirty"]
|
|
7
7
|
}
|