@dxos/react-hooks 0.8.4-main.5ea62a8 → 0.8.4-main.72ec0f3
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/dist/lib/browser/index.mjs +122 -124
- package/dist/lib/browser/index.mjs.map +4 -4
- package/dist/lib/browser/meta.json +1 -1
- package/dist/lib/node-esm/index.mjs +122 -124
- 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 +2 -2
- package/dist/types/src/index.d.ts.map +1 -1
- 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/useDynamicRef.d.ts +3 -3
- package/dist/types/src/useDynamicRef.d.ts.map +1 -1
- package/dist/types/src/useForwardedRef.d.ts +23 -3
- package/dist/types/src/useForwardedRef.d.ts.map +1 -1
- package/dist/types/src/useIsFocused.d.ts +1 -1
- package/dist/types/src/useIsFocused.d.ts.map +1 -1
- package/dist/types/src/useMediaQuery.d.ts +1 -1
- package/dist/types/src/useMediaQuery.d.ts.map +1 -1
- package/dist/types/src/useMulticastObservable.test.d.ts.map +1 -1
- package/dist/types/src/useTransitions.d.ts +2 -1
- package/dist/types/src/useTransitions.d.ts.map +1 -1
- package/dist/types/src/useViewportResize.d.ts +3 -0
- package/dist/types/src/useViewportResize.d.ts.map +1 -0
- package/dist/types/tsconfig.tsbuildinfo +1 -1
- package/package.json +11 -9
- package/src/index.ts +3 -2
- package/src/useControlledState.ts +22 -12
- package/src/useDebugDeps.ts +2 -2
- package/src/useDynamicRef.ts +5 -5
- package/src/useForwardedRef.ts +48 -13
- package/src/useIsFocused.ts +1 -1
- package/src/useMediaQuery.ts +8 -9
- package/src/{useMulticastObservable.test.tsx → useMulticastObservable.test.ts} +1 -3
- package/src/useTransitions.ts +3 -1
- package/src/{useResize.ts → useViewportResize.ts} +1 -1
- package/dist/types/src/useAsyncEffect.stories.d.ts +0 -9
- package/dist/types/src/useAsyncEffect.stories.d.ts.map +0 -1
- package/dist/types/src/useResize.d.ts +0 -3
- package/dist/types/src/useResize.d.ts.map +0 -1
- package/dist/types/src/useTrackProps.d.ts +0 -5
- package/dist/types/src/useTrackProps.d.ts.map +0 -1
- package/src/useAsyncEffect.stories.tsx +0 -34
- package/src/useTrackProps.ts +0 -40
|
@@ -41,40 +41,79 @@ var useAsyncState = (cb, deps = []) => {
|
|
|
41
41
|
};
|
|
42
42
|
|
|
43
43
|
// src/useControlledState.ts
|
|
44
|
-
import { useEffect as
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
44
|
+
import { useCallback as useCallback2, useEffect as useEffect4, useRef as useRef2, useState as useState3 } from "react";
|
|
45
|
+
|
|
46
|
+
// src/useDynamicRef.ts
|
|
47
|
+
import { useCallback } from "@preact-signals/safe-react/react";
|
|
48
|
+
import { useEffect as useEffect3, useRef, useState as useState2 } from "react";
|
|
49
|
+
var useStateWithRef = (valueParam) => {
|
|
50
|
+
const [value, setValue] = useState2(valueParam);
|
|
51
|
+
const valueRef = useRef(valueParam);
|
|
52
|
+
const setter = useCallback((value2) => {
|
|
53
|
+
if (typeof value2 === "function") {
|
|
54
|
+
setValue((current) => {
|
|
55
|
+
valueRef.current = value2(current);
|
|
56
|
+
return valueRef.current;
|
|
57
|
+
});
|
|
58
|
+
} else {
|
|
59
|
+
valueRef.current = value2;
|
|
60
|
+
setValue(value2);
|
|
50
61
|
}
|
|
62
|
+
}, []);
|
|
63
|
+
return [
|
|
64
|
+
value,
|
|
65
|
+
setter,
|
|
66
|
+
valueRef
|
|
67
|
+
];
|
|
68
|
+
};
|
|
69
|
+
var useDynamicRef = (value) => {
|
|
70
|
+
const valueRef = useRef(value);
|
|
71
|
+
useEffect3(() => {
|
|
72
|
+
valueRef.current = value;
|
|
51
73
|
}, [
|
|
52
|
-
|
|
53
|
-
...deps
|
|
74
|
+
value
|
|
54
75
|
]);
|
|
55
|
-
|
|
56
|
-
|
|
76
|
+
return valueRef;
|
|
77
|
+
};
|
|
78
|
+
|
|
79
|
+
// src/useControlledState.ts
|
|
80
|
+
var useControlledState = (valueParam, onChange) => {
|
|
81
|
+
const [value, setControlledValue] = useState3(valueParam);
|
|
82
|
+
useEffect4(() => {
|
|
83
|
+
setControlledValue(valueParam);
|
|
57
84
|
}, [
|
|
58
|
-
|
|
59
|
-
|
|
85
|
+
valueParam
|
|
86
|
+
]);
|
|
87
|
+
const onChangeRef = useRef2(onChange);
|
|
88
|
+
const valueRef = useDynamicRef(valueParam);
|
|
89
|
+
const setValue = useCallback2((nextValue) => {
|
|
90
|
+
const value2 = isFunction(nextValue) ? nextValue(valueRef.current) : nextValue;
|
|
91
|
+
setControlledValue(value2);
|
|
92
|
+
onChangeRef.current?.(value2);
|
|
93
|
+
}, [
|
|
94
|
+
valueRef,
|
|
95
|
+
onChangeRef
|
|
60
96
|
]);
|
|
61
97
|
return [
|
|
62
98
|
value,
|
|
63
99
|
setValue
|
|
64
100
|
];
|
|
65
101
|
};
|
|
102
|
+
function isFunction(value) {
|
|
103
|
+
return typeof value === "function";
|
|
104
|
+
}
|
|
66
105
|
|
|
67
106
|
// src/useDebugDeps.ts
|
|
68
|
-
import { useEffect as
|
|
69
|
-
var useDebugDeps = (deps = []) => {
|
|
70
|
-
const lastDeps =
|
|
71
|
-
|
|
107
|
+
import { useEffect as useEffect5, useRef as useRef3 } from "react";
|
|
108
|
+
var useDebugDeps = (deps = [], active = true) => {
|
|
109
|
+
const lastDeps = useRef3([]);
|
|
110
|
+
useEffect5(() => {
|
|
72
111
|
console.group("deps changed", {
|
|
73
112
|
previous: lastDeps.current.length,
|
|
74
113
|
current: deps.length
|
|
75
114
|
});
|
|
76
115
|
for (let i = 0; i < Math.max(lastDeps.current.length ?? 0, deps.length ?? 0); i++) {
|
|
77
|
-
if (lastDeps.current[i] !== deps[i]) {
|
|
116
|
+
if (lastDeps.current[i] !== deps[i] && active) {
|
|
78
117
|
console.log("changed", {
|
|
79
118
|
index: i,
|
|
80
119
|
previous: lastDeps.current[i],
|
|
@@ -88,11 +127,11 @@ var useDebugDeps = (deps = []) => {
|
|
|
88
127
|
};
|
|
89
128
|
|
|
90
129
|
// src/useDefaultValue.ts
|
|
91
|
-
import { useEffect as
|
|
130
|
+
import { useEffect as useEffect6, useMemo, useState as useState4 } from "react";
|
|
92
131
|
var useDefaultValue = (reactiveValue, getDefaultValue) => {
|
|
93
132
|
const stableDefaultValue = useMemo(getDefaultValue, []);
|
|
94
|
-
const [value, setValue] =
|
|
95
|
-
|
|
133
|
+
const [value, setValue] = useState4(reactiveValue ?? stableDefaultValue);
|
|
134
|
+
useEffect6(() => {
|
|
96
135
|
setValue(reactiveValue ?? stableDefaultValue);
|
|
97
136
|
}, [
|
|
98
137
|
reactiveValue,
|
|
@@ -111,39 +150,6 @@ var useDefaults = (value, defaults) => {
|
|
|
111
150
|
]);
|
|
112
151
|
};
|
|
113
152
|
|
|
114
|
-
// src/useDynamicRef.ts
|
|
115
|
-
import { useCallback } from "@preact-signals/safe-react/react";
|
|
116
|
-
import { useEffect as useEffect6, useRef as useRef2, useState as useState4 } from "react";
|
|
117
|
-
var useStateWithRef = (value$) => {
|
|
118
|
-
const [value, setValue] = useState4(value$);
|
|
119
|
-
const valueRef = useRef2(value$);
|
|
120
|
-
const setter = useCallback((value2) => {
|
|
121
|
-
if (typeof value2 === "function") {
|
|
122
|
-
setValue((current) => {
|
|
123
|
-
valueRef.current = value2(current);
|
|
124
|
-
return valueRef.current;
|
|
125
|
-
});
|
|
126
|
-
} else {
|
|
127
|
-
valueRef.current = value2;
|
|
128
|
-
setValue(value2);
|
|
129
|
-
}
|
|
130
|
-
}, []);
|
|
131
|
-
return [
|
|
132
|
-
value,
|
|
133
|
-
setter,
|
|
134
|
-
valueRef
|
|
135
|
-
];
|
|
136
|
-
};
|
|
137
|
-
var useDynamicRef = (value) => {
|
|
138
|
-
const valueRef = useRef2(value);
|
|
139
|
-
useEffect6(() => {
|
|
140
|
-
valueRef.current = value;
|
|
141
|
-
}, [
|
|
142
|
-
value
|
|
143
|
-
]);
|
|
144
|
-
return valueRef;
|
|
145
|
-
};
|
|
146
|
-
|
|
147
153
|
// src/useFileDownload.ts
|
|
148
154
|
import { useMemo as useMemo3 } from "react";
|
|
149
155
|
var useFileDownload = () => {
|
|
@@ -158,38 +164,55 @@ var useFileDownload = () => {
|
|
|
158
164
|
};
|
|
159
165
|
|
|
160
166
|
// src/useForwardedRef.ts
|
|
161
|
-
import { useEffect as useEffect7, useRef as
|
|
162
|
-
var useForwardedRef = (
|
|
163
|
-
const
|
|
167
|
+
import { useEffect as useEffect7, useMemo as useMemo4, useRef as useRef4 } from "react";
|
|
168
|
+
var useForwardedRef = (forwardedRef) => {
|
|
169
|
+
const localRef = useRef4(null);
|
|
164
170
|
useEffect7(() => {
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
171
|
+
setRef(forwardedRef, localRef.current);
|
|
172
|
+
}, [
|
|
173
|
+
forwardedRef
|
|
174
|
+
]);
|
|
175
|
+
return localRef;
|
|
176
|
+
};
|
|
177
|
+
function setRef(ref, value) {
|
|
178
|
+
if (typeof ref === "function") {
|
|
179
|
+
return ref(value);
|
|
180
|
+
} else if (ref) {
|
|
181
|
+
ref.current = value;
|
|
182
|
+
}
|
|
183
|
+
}
|
|
184
|
+
var mergeRefs = (refs) => {
|
|
185
|
+
return (value) => {
|
|
186
|
+
const cleanups = [];
|
|
187
|
+
for (const ref of refs) {
|
|
188
|
+
const cleanup = setRef(ref, value);
|
|
189
|
+
cleanups.push(typeof cleanup === "function" ? cleanup : () => setRef(ref, null));
|
|
172
190
|
}
|
|
173
|
-
|
|
174
|
-
|
|
191
|
+
return () => {
|
|
192
|
+
for (const cleanup of cleanups) cleanup();
|
|
193
|
+
};
|
|
194
|
+
};
|
|
195
|
+
};
|
|
196
|
+
var useMergeRefs = (refs) => {
|
|
197
|
+
return useMemo4(() => mergeRefs(refs), refs);
|
|
175
198
|
};
|
|
176
199
|
|
|
177
200
|
// src/useId.ts
|
|
178
201
|
import alea from "alea";
|
|
179
|
-
import { useMemo as
|
|
202
|
+
import { useMemo as useMemo5 } from "react";
|
|
180
203
|
var Alea = alea;
|
|
181
204
|
var prng = new Alea("@dxos/react-hooks");
|
|
182
205
|
var randomString = (n = 4) => prng().toString(16).slice(2, n + 2);
|
|
183
|
-
var useId = (namespace, propsId, opts) =>
|
|
206
|
+
var useId = (namespace, propsId, opts) => useMemo5(() => makeId(namespace, propsId, opts), [
|
|
184
207
|
propsId
|
|
185
208
|
]);
|
|
186
209
|
var makeId = (namespace, propsId, opts) => propsId ?? `${namespace}-${randomString(opts?.n ?? 4)}`;
|
|
187
210
|
|
|
188
211
|
// src/useIsFocused.ts
|
|
189
|
-
import { useEffect as useEffect8, useRef as
|
|
212
|
+
import { useEffect as useEffect8, useRef as useRef5, useState as useState5 } from "react";
|
|
190
213
|
var useIsFocused = (inputRef) => {
|
|
191
214
|
const [isFocused, setIsFocused] = useState5(void 0);
|
|
192
|
-
const isFocusedRef =
|
|
215
|
+
const isFocusedRef = useRef5(isFocused);
|
|
193
216
|
isFocusedRef.current = isFocused;
|
|
194
217
|
useEffect8(() => {
|
|
195
218
|
const input = inputRef.current;
|
|
@@ -224,7 +247,7 @@ var breakpointMediaQueries = {
|
|
|
224
247
|
"2xl": "(min-width: 1536px)"
|
|
225
248
|
};
|
|
226
249
|
var useMediaQuery = (query, options = {}) => {
|
|
227
|
-
const { ssr =
|
|
250
|
+
const { ssr = false, fallback } = options;
|
|
228
251
|
const queries = (Array.isArray(query) ? query : [
|
|
229
252
|
query
|
|
230
253
|
]).map((query2) => query2 in breakpointMediaQueries ? breakpointMediaQueries[query2] : query2);
|
|
@@ -280,9 +303,9 @@ var useMediaQuery = (query, options = {}) => {
|
|
|
280
303
|
};
|
|
281
304
|
|
|
282
305
|
// src/useMulticastObservable.ts
|
|
283
|
-
import { useMemo as
|
|
306
|
+
import { useMemo as useMemo6, useSyncExternalStore } from "react";
|
|
284
307
|
var useMulticastObservable = (observable) => {
|
|
285
|
-
const subscribeFn =
|
|
308
|
+
const subscribeFn = useMemo6(() => (listener) => {
|
|
286
309
|
const subscription = observable.subscribe(listener);
|
|
287
310
|
return () => subscription.unsubscribe();
|
|
288
311
|
}, [
|
|
@@ -301,10 +324,10 @@ var useRefCallback = () => {
|
|
|
301
324
|
};
|
|
302
325
|
};
|
|
303
326
|
|
|
304
|
-
// src/
|
|
305
|
-
import { useLayoutEffect, useMemo as
|
|
306
|
-
var
|
|
307
|
-
const debouncedHandler =
|
|
327
|
+
// src/useViewportResize.ts
|
|
328
|
+
import { useLayoutEffect, useMemo as useMemo7 } from "react";
|
|
329
|
+
var useViewportResize = (handler, deps = [], delay = 800) => {
|
|
330
|
+
const debouncedHandler = useMemo7(() => {
|
|
308
331
|
let timeout;
|
|
309
332
|
return (event) => {
|
|
310
333
|
clearTimeout(timeout);
|
|
@@ -329,10 +352,10 @@ var useResize = (handler, deps = [], delay = 800) => {
|
|
|
329
352
|
// src/useSignals.ts
|
|
330
353
|
import { useSignals as _useSignals } from "@preact-signals/safe-react/tracking";
|
|
331
354
|
import { computed, effect } from "@preact-signals/safe-react";
|
|
332
|
-
import { useRef as
|
|
333
|
-
import { useEffect as useEffect10, useMemo as
|
|
355
|
+
import { useRef as useRef6 } from "@preact-signals/safe-react/react";
|
|
356
|
+
import { useEffect as useEffect10, useMemo as useMemo8 } from "react";
|
|
334
357
|
var useSignalsEffect = (cb, deps) => {
|
|
335
|
-
const callback =
|
|
358
|
+
const callback = useRef6(cb);
|
|
336
359
|
callback.current = cb;
|
|
337
360
|
useEffect10(() => {
|
|
338
361
|
return effect(() => {
|
|
@@ -343,16 +366,16 @@ var useSignalsEffect = (cb, deps) => {
|
|
|
343
366
|
var useSignalsMemo = (cb, deps) => {
|
|
344
367
|
var _effect = _useSignals();
|
|
345
368
|
try {
|
|
346
|
-
return
|
|
369
|
+
return useMemo8(() => computed(cb), deps ?? []).value;
|
|
347
370
|
} finally {
|
|
348
371
|
_effect.f();
|
|
349
372
|
}
|
|
350
373
|
};
|
|
351
374
|
|
|
352
375
|
// src/useTimeout.ts
|
|
353
|
-
import { useEffect as useEffect11, useRef as
|
|
376
|
+
import { useEffect as useEffect11, useRef as useRef7 } from "react";
|
|
354
377
|
var useTimeout = (callback, delay = 0, deps = []) => {
|
|
355
|
-
const callbackRef =
|
|
378
|
+
const callbackRef = useRef7(callback);
|
|
356
379
|
useEffect11(() => {
|
|
357
380
|
callbackRef.current = callback;
|
|
358
381
|
}, [
|
|
@@ -370,7 +393,7 @@ var useTimeout = (callback, delay = 0, deps = []) => {
|
|
|
370
393
|
]);
|
|
371
394
|
};
|
|
372
395
|
var useInterval = (callback, delay = 0, deps = []) => {
|
|
373
|
-
const callbackRef =
|
|
396
|
+
const callbackRef = useRef7(callback);
|
|
374
397
|
useEffect11(() => {
|
|
375
398
|
callbackRef.current = callback;
|
|
376
399
|
}, [
|
|
@@ -393,49 +416,17 @@ var useInterval = (callback, delay = 0, deps = []) => {
|
|
|
393
416
|
]);
|
|
394
417
|
};
|
|
395
418
|
|
|
396
|
-
// src/useTrackProps.ts
|
|
397
|
-
import { useEffect as useEffect12, useRef as useRef7 } from "react";
|
|
398
|
-
import { log } from "@dxos/log";
|
|
399
|
-
var __dxlog_file = "/__w/dxos/dxos/packages/ui/primitives/react-hooks/src/useTrackProps.ts";
|
|
400
|
-
var useTrackProps = (props, componentName = "Component", active = true) => {
|
|
401
|
-
const prevProps = useRef7(props);
|
|
402
|
-
useEffect12(() => {
|
|
403
|
-
const changes = Object.entries(props).filter(([key]) => props[key] !== prevProps.current[key]);
|
|
404
|
-
if (changes.length > 0) {
|
|
405
|
-
if (active) {
|
|
406
|
-
log.info("props changed", {
|
|
407
|
-
componentName,
|
|
408
|
-
keys: changes.map(([key]) => key).join(","),
|
|
409
|
-
props: Object.fromEntries(changes.map(([key]) => [
|
|
410
|
-
key,
|
|
411
|
-
{
|
|
412
|
-
from: prevProps.current[key],
|
|
413
|
-
to: props[key]
|
|
414
|
-
}
|
|
415
|
-
]))
|
|
416
|
-
}, {
|
|
417
|
-
F: __dxlog_file,
|
|
418
|
-
L: 22,
|
|
419
|
-
S: void 0,
|
|
420
|
-
C: (f, a) => f(...a)
|
|
421
|
-
});
|
|
422
|
-
}
|
|
423
|
-
}
|
|
424
|
-
prevProps.current = props;
|
|
425
|
-
});
|
|
426
|
-
};
|
|
427
|
-
|
|
428
419
|
// src/useTransitions.ts
|
|
429
|
-
import { useEffect as
|
|
430
|
-
var
|
|
420
|
+
import { useEffect as useEffect12, useRef as useRef8, useState as useState8 } from "react";
|
|
421
|
+
var isFunction2 = (functionToCheck) => {
|
|
431
422
|
return functionToCheck instanceof Function;
|
|
432
423
|
};
|
|
433
424
|
var useDidTransition = (currentValue, fromValue, toValue) => {
|
|
434
425
|
const [hasTransitioned, setHasTransitioned] = useState8(false);
|
|
435
426
|
const previousValue = useRef8(currentValue);
|
|
436
|
-
|
|
437
|
-
const toValueValid =
|
|
438
|
-
const fromValueValid =
|
|
427
|
+
useEffect12(() => {
|
|
428
|
+
const toValueValid = isFunction2(toValue) ? toValue(currentValue) : toValue === currentValue;
|
|
429
|
+
const fromValueValid = isFunction2(fromValue) ? fromValue(previousValue.current) : fromValue === previousValue.current;
|
|
439
430
|
if (fromValueValid && toValueValid && !hasTransitioned) {
|
|
440
431
|
setHasTransitioned(true);
|
|
441
432
|
} else if ((!fromValueValid || !toValueValid) && hasTransitioned) {
|
|
@@ -453,13 +444,13 @@ var useDidTransition = (currentValue, fromValue, toValue) => {
|
|
|
453
444
|
var useOnTransition = (currentValue, fromValue, toValue, callback) => {
|
|
454
445
|
const dirty = useRef8(false);
|
|
455
446
|
const hasTransitioned = useDidTransition(currentValue, fromValue, toValue);
|
|
456
|
-
|
|
447
|
+
useEffect12(() => {
|
|
457
448
|
dirty.current = false;
|
|
458
449
|
}, [
|
|
459
450
|
currentValue,
|
|
460
451
|
dirty
|
|
461
452
|
]);
|
|
462
|
-
|
|
453
|
+
useEffect12(() => {
|
|
463
454
|
if (hasTransitioned && !dirty.current) {
|
|
464
455
|
callback();
|
|
465
456
|
dirty.current = true;
|
|
@@ -470,9 +461,14 @@ var useOnTransition = (currentValue, fromValue, toValue, callback) => {
|
|
|
470
461
|
callback
|
|
471
462
|
]);
|
|
472
463
|
};
|
|
464
|
+
|
|
465
|
+
// src/index.ts
|
|
466
|
+
import { useSize, useScroller } from "mini-virtual-list";
|
|
473
467
|
export {
|
|
474
468
|
makeId,
|
|
469
|
+
mergeRefs,
|
|
475
470
|
randomString,
|
|
471
|
+
setRef,
|
|
476
472
|
useAsyncEffect,
|
|
477
473
|
useAsyncState,
|
|
478
474
|
useControlledState,
|
|
@@ -487,14 +483,16 @@ export {
|
|
|
487
483
|
useInterval,
|
|
488
484
|
useIsFocused,
|
|
489
485
|
useMediaQuery,
|
|
486
|
+
useMergeRefs,
|
|
490
487
|
useMulticastObservable,
|
|
491
488
|
useOnTransition,
|
|
492
489
|
useRefCallback,
|
|
493
|
-
|
|
490
|
+
useScroller,
|
|
494
491
|
useSignalsEffect,
|
|
495
492
|
useSignalsMemo,
|
|
493
|
+
useSize,
|
|
496
494
|
useStateWithRef,
|
|
497
495
|
useTimeout,
|
|
498
|
-
|
|
496
|
+
useViewportResize
|
|
499
497
|
};
|
|
500
498
|
//# sourceMappingURL=index.mjs.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../../../src/useAsyncEffect.ts", "../../../src/useAsyncState.ts", "../../../src/useControlledState.ts", "../../../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, useEffect, useState } from 'react';\n\n/**\n * A stateful hook with a controlled value.\n * NOTE: Be careful not to provide an inlinde default array.\n */\nexport const useControlledState = <T>(\n controlledValue: T,\n onChange?: (value: T) => void,\n ...deps: any[]\n): [T, Dispatch<SetStateAction<T>>] => {\n const [value, setValue] = useState<T>(controlledValue);\n useEffect(() => {\n if (controlledValue !== undefined) {\n setValue(controlledValue);\n }\n }, [controlledValue, ...deps]);\n\n useEffect(() => {\n onChange?.(value);\n }, [value, onChange]);\n\n return [value, setValue];\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 = []) => {\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]) {\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 2024 DXOS.org\n//\n\nimport { useCallback } from '@preact-signals/safe-react/react';\nimport { type Dispatch, type MutableRefObject, type SetStateAction, useEffect, useRef, useState } from 'react';\n\n/**\n * Like `useState` but with an additional dynamic value.\n */\nexport const useStateWithRef = <T>(value$: T): [T, Dispatch<SetStateAction<T>>, MutableRefObject<T>] => {\n const [value, setValue] = useState<T>(value$);\n const valueRef = useRef<T>(value$);\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): MutableRefObject<T> => {\n const valueRef = useRef<T>(value);\n useEffect(() => {\n valueRef.current = value;\n }, [value]);\n\n return valueRef;\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, useEffect, useRef } from 'react';\n\n/**\n * Combines a possibly undefined forwarded ref with a locally defined ref.\n * @deprecated Use @radix-ui/react-compose-refs\n */\nexport const useForwardedRef = <T>(ref: ForwardedRef<T>) => {\n const innerRef = useRef<T>(null);\n useEffect(() => {\n if (!ref) {\n return;\n }\n\n if (typeof ref === 'function') {\n ref(innerRef.current);\n } else {\n ref.current = innerRef.current;\n }\n });\n\n return innerRef;\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>) => {\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\nexport type UseMediaQueryOptions = {\n fallback?: boolean | boolean[];\n ssr?: boolean;\n};\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\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 // TODO(wittjosiah): Why is the default here true?\n const { ssr = true, 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 useResize = (\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 2025 DXOS.org\n//\n\nimport { useEffect, useRef } from 'react';\n\nimport { log } from '@dxos/log';\n\n/**\n * Use to debug which props have changed to trigger re-renders in a React component.\n */\nexport const useTrackProps = <T extends Record<string, unknown>>(\n props: T,\n componentName = 'Component',\n active = true,\n) => {\n const prevProps = useRef<T>(props);\n useEffect(() => {\n const changes = Object.entries(props).filter(([key]) => props[key] !== prevProps.current[key]);\n if (changes.length > 0) {\n if (active) {\n log.info('props changed', {\n componentName,\n keys: changes.map(([key]) => key).join(','),\n props: Object.fromEntries(\n changes.map(([key]) => [\n key,\n {\n from: prevProps.current[key],\n to: props[key],\n },\n ]),\n ),\n });\n }\n }\n\n prevProps.current = props;\n });\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. */\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": ";AAIA,SAAmDA,iBAAiB;AAO7D,IAAMC,iBAAiB,CAC5BC,IACAC,SAAAA;AAEAC,YAAU,MAAA;AACR,UAAMC,aAAa,IAAIC,gBAAAA;AACvB,QAAIC;AAEJ,UAAMC,IAAIC,WAAW,YAAA;AACnB,UAAI,CAACJ,WAAWK,OAAOC,SAAS;AAC9BJ,kBAAU,MAAML,GAAGG,UAAAA;MACrB;IACF,CAAA;AAEA,WAAO,MAAA;AACLO,mBAAaJ,CAAAA;AACbH,iBAAWQ,MAAK;AAChBN,gBAAAA;IACF;EACF,GAAGJ,QAAQ,CAAA,CAAE;AACf;;;AC3BA,SAA6CW,aAAAA,YAAWC,gBAAgB;AAKjE,IAAMC,gBAAgB,CAC3BC,IACAC,OAAc,CAAA,MAAE;AAEhB,QAAM,CAACC,OAAOC,QAAAA,IAAYC,SAAAA;AAC1BC,EAAAA,WAAU,MAAA;AACR,QAAIC,WAAW;AACf,UAAMC,IAAIC,WAAW,YAAA;AACnB,YAAMC,OAAO,MAAMT,GAAAA;AACnB,UAAI,CAACM,UAAU;AACbH,iBAASM,IAAAA;MACX;IACF,CAAA;AAEA,WAAO,MAAA;AACLH,iBAAW;AACXI,mBAAaH,CAAAA;IACf;EACF,GAAGN,IAAAA;AAEH,SAAO;IAACC;IAAOC;;AACjB;;;AC1BA,SAA6CQ,aAAAA,YAAWC,YAAAA,iBAAgB;
|
|
6
|
-
"names": ["useEffect", "useAsyncEffect", "cb", "deps", "useEffect", "controller", "AbortController", "cleanup", "t", "setTimeout", "signal", "aborted", "clearTimeout", "abort", "useEffect", "useState", "useAsyncState", "cb", "deps", "value", "setValue", "useState", "useEffect", "disposed", "t", "setTimeout", "data", "clearTimeout", "useEffect", "useState", "
|
|
3
|
+
"sources": ["../../../src/useAsyncEffect.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/useSignals.ts", "../../../src/useTimeout.ts", "../../../src/useTransitions.ts", "../../../src/index.ts"],
|
|
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": "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",
|
|
6
|
+
"names": ["useEffect", "useAsyncEffect", "cb", "deps", "useEffect", "controller", "AbortController", "cleanup", "t", "setTimeout", "signal", "aborted", "clearTimeout", "abort", "useEffect", "useState", "useAsyncState", "cb", "deps", "value", "setValue", "useState", "useEffect", "disposed", "t", "setTimeout", "data", "clearTimeout", "useCallback", "useEffect", "useRef", "useState", "useCallback", "useEffect", "useRef", "useState", "useStateWithRef", "valueParam", "value", "setValue", "useState", "valueRef", "useRef", "setter", "useCallback", "current", "useDynamicRef", "useEffect", "useControlledState", "valueParam", "onChange", "value", "setControlledValue", "useState", "useEffect", "onChangeRef", "useRef", "valueRef", "useDynamicRef", "setValue", "useCallback", "nextValue", "isFunction", "current", "useEffect", "useRef", "useDebugDeps", "deps", "active", "lastDeps", "useRef", "useEffect", "console", "group", "previous", "current", "length", "i", "Math", "max", "log", "index", "groupEnd", "useEffect", "useMemo", "useState", "useDefaultValue", "reactiveValue", "getDefaultValue", "stableDefaultValue", "useMemo", "value", "setValue", "useState", "useEffect", "defaultsDeep", "useMemo", "useDefaults", "value", "defaults", "useMemo", "defaultsDeep", "useMemo", "useFileDownload", "useMemo", "data", "filename", "url", "URL", "createObjectURL", "element", "document", "createElement", "setAttribute", "click", "useEffect", "useMemo", "useRef", "useForwardedRef", "forwardedRef", "localRef", "useRef", "useEffect", "setRef", "current", "ref", "value", "mergeRefs", "refs", "cleanups", "cleanup", "push", "useMergeRefs", "useMemo", "alea", "useMemo", "Alea", "alea", "prng", "randomString", "n", "toString", "slice", "useId", "namespace", "propsId", "opts", "useMemo", "makeId", "useEffect", "useRef", "useState", "useIsFocused", "inputRef", "isFocused", "setIsFocused", "useState", "undefined", "isFocusedRef", "useRef", "current", "useEffect", "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", "useState", "index", "media", "matches", "document", "defaultView", "matchMedia", "useEffect", "mql", "handler", "evt", "prev", "slice", "item", "forEach", "addListener", "addEventListener", "removeListener", "removeEventListener", "useMemo", "useSyncExternalStore", "useMulticastObservable", "observable", "subscribeFn", "useMemo", "listener", "subscription", "subscribe", "unsubscribe", "useSyncExternalStore", "get", "useState", "useRefCallback", "value", "setValue", "useState", "refCallback", "useLayoutEffect", "useMemo", "useViewportResize", "handler", "deps", "delay", "debouncedHandler", "useMemo", "timeout", "event", "clearTimeout", "setTimeout", "useLayoutEffect", "window", "visualViewport", "addEventListener", "removeEventListener", "computed", "effect", "useRef", "useEffect", "useMemo", "useSignalsEffect", "cb", "deps", "callback", "useRef", "current", "useEffect", "effect", "useSignalsMemo", "useMemo", "computed", "value", "useEffect", "useRef", "useTimeout", "callback", "delay", "deps", "callbackRef", "useRef", "useEffect", "current", "t", "setTimeout", "clearTimeout", "useInterval", "i", "setInterval", "result", "clearInterval", "useEffect", "useRef", "useState", "isFunction", "functionToCheck", "Function", "useDidTransition", "currentValue", "fromValue", "toValue", "hasTransitioned", "setHasTransitioned", "useState", "previousValue", "useRef", "useEffect", "toValueValid", "fromValueValid", "current", "useOnTransition", "callback", "dirty", "useSize", "useScroller"]
|
|
7
7
|
}
|