@dxos/react-hooks 0.8.4-main.c4373fc → 0.8.4-main.d05673bc65
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -0
- package/dist/lib/browser/index.mjs +147 -127
- package/dist/lib/browser/index.mjs.map +4 -4
- package/dist/lib/browser/meta.json +1 -1
- package/dist/lib/node-esm/index.mjs +147 -127
- 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/useId.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/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 +16 -11
- package/src/index.ts +3 -2
- package/src/useControlledState.ts +22 -12
- package/src/useDebugDeps.ts +17 -8
- package/src/useDynamicRef.ts +5 -6
- package/src/useForwardedRef.ts +48 -13
- package/src/useId.ts +3 -2
- package/src/useIsFocused.ts +1 -1
- package/src/useMediaQuery.ts +7 -7
- package/src/useMulticastObservable.test.ts +1 -1
- package/src/{useResize.ts → useViewportResize.ts} +4 -4
- package/dist/types/src/useResize.d.ts +0 -3
- package/dist/types/src/useResize.d.ts.map +0 -1
- 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 +1 @@
|
|
|
1
|
-
{"inputs":{"src/useAsyncEffect.ts":{"bytes":
|
|
1
|
+
{"inputs":{"src/useAsyncEffect.ts":{"bytes":2994,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/useAsyncState.ts":{"bytes":2583,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/useDynamicRef.ts":{"bytes":3588,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/useControlledState.ts":{"bytes":3703,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"src/useDynamicRef.ts","kind":"import-statement","original":"./useDynamicRef"}],"format":"esm"},"src/useDebugDeps.ts":{"bytes":3943,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true}],"format":"esm"},"src/useDefaultValue.ts":{"bytes":4039,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/useDefaults.ts":{"bytes":1597,"imports":[{"path":"lodash.defaultsdeep","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/useFileDownload.ts":{"bytes":2677,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/useForwardedRef.ts":{"bytes":6112,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/useId.ts":{"bytes":2520,"imports":[{"path":"alea","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/useIsFocused.ts":{"bytes":3922,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/useMediaQuery.ts":{"bytes":9262,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/useMulticastObservable.ts":{"bytes":2978,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/useRefCallback.ts":{"bytes":1824,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/useViewportResize.ts":{"bytes":2841,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/useTimeout.ts":{"bytes":3962,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/useTransitions.ts":{"bytes":7869,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/index.ts":{"bytes":2366,"imports":[{"path":"src/useAsyncEffect.ts","kind":"import-statement","original":"./useAsyncEffect"},{"path":"src/useAsyncState.ts","kind":"import-statement","original":"./useAsyncState"},{"path":"src/useControlledState.ts","kind":"import-statement","original":"./useControlledState"},{"path":"src/useDebugDeps.ts","kind":"import-statement","original":"./useDebugDeps"},{"path":"src/useDefaultValue.ts","kind":"import-statement","original":"./useDefaultValue"},{"path":"src/useDefaults.ts","kind":"import-statement","original":"./useDefaults"},{"path":"src/useDynamicRef.ts","kind":"import-statement","original":"./useDynamicRef"},{"path":"src/useFileDownload.ts","kind":"import-statement","original":"./useFileDownload"},{"path":"src/useForwardedRef.ts","kind":"import-statement","original":"./useForwardedRef"},{"path":"src/useId.ts","kind":"import-statement","original":"./useId"},{"path":"src/useIsFocused.ts","kind":"import-statement","original":"./useIsFocused"},{"path":"src/useMediaQuery.ts","kind":"import-statement","original":"./useMediaQuery"},{"path":"src/useMulticastObservable.ts","kind":"import-statement","original":"./useMulticastObservable"},{"path":"src/useRefCallback.ts","kind":"import-statement","original":"./useRefCallback"},{"path":"src/useViewportResize.ts","kind":"import-statement","original":"./useViewportResize"},{"path":"src/useTimeout.ts","kind":"import-statement","original":"./useTimeout"},{"path":"src/useTransitions.ts","kind":"import-statement","original":"./useTransitions"},{"path":"mini-virtual-list","kind":"import-statement","external":true}],"format":"esm"}},"outputs":{"dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":33856},"dist/lib/browser/index.mjs":{"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"lodash.defaultsdeep","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"alea","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"mini-virtual-list","kind":"import-statement","external":true}],"exports":["makeId","mergeRefs","randomString","setRef","useAsyncEffect","useAsyncState","useControlledState","useDebugDeps","useDefaultValue","useDefaults","useDidTransition","useDynamicRef","useFileDownload","useForwardedRef","useId","useInterval","useIsFocused","useMediaQuery","useMergeRefs","useMulticastObservable","useOnTransition","useRefCallback","useScroller","useSize","useStateWithRef","useTimeout","useViewportResize"],"entryPoint":"src/index.ts","inputs":{"src/useAsyncEffect.ts":{"bytesInOutput":405},"src/index.ts":{"bytesInOutput":58},"src/useAsyncState.ts":{"bytesInOutput":447},"src/useControlledState.ts":{"bytesInOutput":756},"src/useDynamicRef.ts":{"bytesInOutput":724},"src/useDebugDeps.ts":{"bytesInOutput":966},"src/useDefaultValue.ts":{"bytesInOutput":422},"src/useDefaults.ts":{"bytesInOutput":228},"src/useFileDownload.ts":{"bytesInOutput":416},"src/useForwardedRef.ts":{"bytesInOutput":840},"src/useId.ts":{"bytesInOutput":421},"src/useIsFocused.ts":{"bytesInOutput":833},"src/useMediaQuery.ts":{"bytesInOutput":1941},"src/useMulticastObservable.ts":{"bytesInOutput":368},"src/useRefCallback.ts":{"bytesInOutput":197},"src/useViewportResize.ts":{"bytesInOutput":612},"src/useTimeout.ts":{"bytesInOutput":946},"src/useTransitions.ts":{"bytesInOutput":1409}},"bytes":12965}}}
|
|
@@ -43,58 +43,107 @@ var useAsyncState = (cb, deps = []) => {
|
|
|
43
43
|
};
|
|
44
44
|
|
|
45
45
|
// src/useControlledState.ts
|
|
46
|
-
import { useEffect as
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
46
|
+
import { useCallback as useCallback2, useEffect as useEffect4, useRef as useRef2, useState as useState3 } from "react";
|
|
47
|
+
|
|
48
|
+
// src/useDynamicRef.ts
|
|
49
|
+
import { useCallback, useEffect as useEffect3, useRef, useState as useState2 } from "react";
|
|
50
|
+
var useStateWithRef = (valueProp) => {
|
|
51
|
+
const [value, setValue] = useState2(valueProp);
|
|
52
|
+
const valueRef = useRef(valueProp);
|
|
53
|
+
const setter = useCallback((value2) => {
|
|
54
|
+
if (typeof value2 === "function") {
|
|
55
|
+
setValue((current) => {
|
|
56
|
+
valueRef.current = value2(current);
|
|
57
|
+
return valueRef.current;
|
|
58
|
+
});
|
|
59
|
+
} else {
|
|
60
|
+
valueRef.current = value2;
|
|
61
|
+
setValue(value2);
|
|
52
62
|
}
|
|
63
|
+
}, []);
|
|
64
|
+
return [
|
|
65
|
+
value,
|
|
66
|
+
setter,
|
|
67
|
+
valueRef
|
|
68
|
+
];
|
|
69
|
+
};
|
|
70
|
+
var useDynamicRef = (value) => {
|
|
71
|
+
const valueRef = useRef(value);
|
|
72
|
+
useEffect3(() => {
|
|
73
|
+
valueRef.current = value;
|
|
53
74
|
}, [
|
|
54
|
-
|
|
55
|
-
...deps
|
|
75
|
+
value
|
|
56
76
|
]);
|
|
57
|
-
|
|
58
|
-
|
|
77
|
+
return valueRef;
|
|
78
|
+
};
|
|
79
|
+
|
|
80
|
+
// src/useControlledState.ts
|
|
81
|
+
var useControlledState = (valueProp, onChange) => {
|
|
82
|
+
const [value, setControlledValue] = useState3(valueProp);
|
|
83
|
+
useEffect4(() => {
|
|
84
|
+
setControlledValue(valueProp);
|
|
59
85
|
}, [
|
|
60
|
-
|
|
61
|
-
|
|
86
|
+
valueProp
|
|
87
|
+
]);
|
|
88
|
+
const onChangeRef = useRef2(onChange);
|
|
89
|
+
const valueRef = useDynamicRef(valueProp);
|
|
90
|
+
const setValue = useCallback2((nextValue) => {
|
|
91
|
+
const value2 = isFunction(nextValue) ? nextValue(valueRef.current) : nextValue;
|
|
92
|
+
setControlledValue(value2);
|
|
93
|
+
onChangeRef.current?.(value2);
|
|
94
|
+
}, [
|
|
95
|
+
valueRef,
|
|
96
|
+
onChangeRef
|
|
62
97
|
]);
|
|
63
98
|
return [
|
|
64
99
|
value,
|
|
65
100
|
setValue
|
|
66
101
|
];
|
|
67
102
|
};
|
|
103
|
+
function isFunction(value) {
|
|
104
|
+
return typeof value === "function";
|
|
105
|
+
}
|
|
68
106
|
|
|
69
107
|
// src/useDebugDeps.ts
|
|
70
|
-
import { useEffect as
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
108
|
+
import { useEffect as useEffect5, useRef as useRef3 } from "react";
|
|
109
|
+
import { log } from "@dxos/log";
|
|
110
|
+
var __dxlog_file = "/__w/dxos/dxos/packages/ui/react-primitives/react-hooks/src/useDebugDeps.ts";
|
|
111
|
+
var useDebugDeps = (deps = [], label = "useDebugDeps", active = true) => {
|
|
112
|
+
const lastDeps = useRef3([]);
|
|
113
|
+
useEffect5(() => {
|
|
114
|
+
if (!active) {
|
|
115
|
+
return;
|
|
116
|
+
}
|
|
117
|
+
const diff = {};
|
|
78
118
|
for (let i = 0; i < Math.max(lastDeps.current.length ?? 0, deps.length ?? 0); i++) {
|
|
79
|
-
if (lastDeps.current[i] !== deps[i]
|
|
80
|
-
|
|
81
|
-
index: i,
|
|
119
|
+
if (lastDeps.current[i] !== deps[i] || i > lastDeps.current.length) {
|
|
120
|
+
diff[i] = {
|
|
82
121
|
previous: lastDeps.current[i],
|
|
83
122
|
current: deps[i]
|
|
84
|
-
}
|
|
123
|
+
};
|
|
85
124
|
}
|
|
86
125
|
}
|
|
87
|
-
|
|
126
|
+
if (Object.keys(diff).length > 0) {
|
|
127
|
+
log.warn(`Updated: ${label} [${lastDeps.current.length}/${deps.length}]`, diff, {
|
|
128
|
+
F: __dxlog_file,
|
|
129
|
+
L: 30,
|
|
130
|
+
S: void 0,
|
|
131
|
+
C: (f, a) => f(...a)
|
|
132
|
+
});
|
|
133
|
+
}
|
|
88
134
|
lastDeps.current = deps;
|
|
89
|
-
},
|
|
135
|
+
}, [
|
|
136
|
+
...deps,
|
|
137
|
+
active
|
|
138
|
+
]);
|
|
90
139
|
};
|
|
91
140
|
|
|
92
141
|
// src/useDefaultValue.ts
|
|
93
|
-
import { useEffect as
|
|
142
|
+
import { useEffect as useEffect6, useMemo, useState as useState4 } from "react";
|
|
94
143
|
var useDefaultValue = (reactiveValue, getDefaultValue) => {
|
|
95
144
|
const stableDefaultValue = useMemo(getDefaultValue, []);
|
|
96
|
-
const [value, setValue] =
|
|
97
|
-
|
|
145
|
+
const [value, setValue] = useState4(reactiveValue ?? stableDefaultValue);
|
|
146
|
+
useEffect6(() => {
|
|
98
147
|
setValue(reactiveValue ?? stableDefaultValue);
|
|
99
148
|
}, [
|
|
100
149
|
reactiveValue,
|
|
@@ -113,39 +162,6 @@ var useDefaults = (value, defaults) => {
|
|
|
113
162
|
]);
|
|
114
163
|
};
|
|
115
164
|
|
|
116
|
-
// src/useDynamicRef.ts
|
|
117
|
-
import { useCallback } from "@preact-signals/safe-react/react";
|
|
118
|
-
import { useEffect as useEffect6, useRef as useRef2, useState as useState4 } from "react";
|
|
119
|
-
var useStateWithRef = (valueParam) => {
|
|
120
|
-
const [value, setValue] = useState4(valueParam);
|
|
121
|
-
const valueRef = useRef2(valueParam);
|
|
122
|
-
const setter = useCallback((value2) => {
|
|
123
|
-
if (typeof value2 === "function") {
|
|
124
|
-
setValue((current) => {
|
|
125
|
-
valueRef.current = value2(current);
|
|
126
|
-
return valueRef.current;
|
|
127
|
-
});
|
|
128
|
-
} else {
|
|
129
|
-
valueRef.current = value2;
|
|
130
|
-
setValue(value2);
|
|
131
|
-
}
|
|
132
|
-
}, []);
|
|
133
|
-
return [
|
|
134
|
-
value,
|
|
135
|
-
setter,
|
|
136
|
-
valueRef
|
|
137
|
-
];
|
|
138
|
-
};
|
|
139
|
-
var useDynamicRef = (value) => {
|
|
140
|
-
const valueRef = useRef2(value);
|
|
141
|
-
useEffect6(() => {
|
|
142
|
-
valueRef.current = value;
|
|
143
|
-
}, [
|
|
144
|
-
value
|
|
145
|
-
]);
|
|
146
|
-
return valueRef;
|
|
147
|
-
};
|
|
148
|
-
|
|
149
165
|
// src/useFileDownload.ts
|
|
150
166
|
import { useMemo as useMemo3 } from "react";
|
|
151
167
|
var useFileDownload = () => {
|
|
@@ -160,38 +176,59 @@ var useFileDownload = () => {
|
|
|
160
176
|
};
|
|
161
177
|
|
|
162
178
|
// src/useForwardedRef.ts
|
|
163
|
-
import { useEffect as useEffect7, useRef as
|
|
164
|
-
var useForwardedRef = (
|
|
165
|
-
const
|
|
179
|
+
import { useEffect as useEffect7, useMemo as useMemo4, useRef as useRef4 } from "react";
|
|
180
|
+
var useForwardedRef = (forwardedRef) => {
|
|
181
|
+
const localRef = useRef4(null);
|
|
166
182
|
useEffect7(() => {
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
183
|
+
setRef(forwardedRef, localRef.current);
|
|
184
|
+
}, [
|
|
185
|
+
forwardedRef
|
|
186
|
+
]);
|
|
187
|
+
return localRef;
|
|
188
|
+
};
|
|
189
|
+
function setRef(ref, value) {
|
|
190
|
+
if (typeof ref === "function") {
|
|
191
|
+
return ref(value);
|
|
192
|
+
} else if (ref) {
|
|
193
|
+
ref.current = value;
|
|
194
|
+
}
|
|
195
|
+
}
|
|
196
|
+
var mergeRefs = (refs) => {
|
|
197
|
+
return (value) => {
|
|
198
|
+
const cleanups = [];
|
|
199
|
+
for (const ref of refs) {
|
|
200
|
+
const cleanup = setRef(ref, value);
|
|
201
|
+
cleanups.push(typeof cleanup === "function" ? cleanup : () => setRef(ref, null));
|
|
174
202
|
}
|
|
175
|
-
|
|
176
|
-
|
|
203
|
+
return () => {
|
|
204
|
+
for (const cleanup of cleanups) cleanup();
|
|
205
|
+
};
|
|
206
|
+
};
|
|
207
|
+
};
|
|
208
|
+
var useMergeRefs = (refs) => {
|
|
209
|
+
return useMemo4(() => mergeRefs(refs), [
|
|
210
|
+
...refs
|
|
211
|
+
]);
|
|
177
212
|
};
|
|
178
213
|
|
|
179
214
|
// src/useId.ts
|
|
180
215
|
import alea from "alea";
|
|
181
|
-
import { useMemo as
|
|
216
|
+
import { useMemo as useMemo5 } from "react";
|
|
182
217
|
var Alea = alea;
|
|
183
218
|
var prng = new Alea("@dxos/react-hooks");
|
|
184
219
|
var randomString = (n = 4) => prng().toString(16).slice(2, n + 2);
|
|
185
|
-
var useId = (namespace, propsId, opts) =>
|
|
186
|
-
propsId
|
|
187
|
-
|
|
220
|
+
var useId = (namespace, propsId, opts) => {
|
|
221
|
+
return useMemo5(() => makeId(namespace, propsId, opts), [
|
|
222
|
+
propsId
|
|
223
|
+
]);
|
|
224
|
+
};
|
|
188
225
|
var makeId = (namespace, propsId, opts) => propsId ?? `${namespace}-${randomString(opts?.n ?? 4)}`;
|
|
189
226
|
|
|
190
227
|
// src/useIsFocused.ts
|
|
191
|
-
import { useEffect as useEffect8, useRef as
|
|
228
|
+
import { useEffect as useEffect8, useRef as useRef5, useState as useState5 } from "react";
|
|
192
229
|
var useIsFocused = (inputRef) => {
|
|
193
230
|
const [isFocused, setIsFocused] = useState5(void 0);
|
|
194
|
-
const isFocusedRef =
|
|
231
|
+
const isFocusedRef = useRef5(isFocused);
|
|
195
232
|
isFocusedRef.current = isFocused;
|
|
196
233
|
useEffect8(() => {
|
|
197
234
|
const input = inputRef.current;
|
|
@@ -282,9 +319,9 @@ var useMediaQuery = (query, options = {}) => {
|
|
|
282
319
|
};
|
|
283
320
|
|
|
284
321
|
// src/useMulticastObservable.ts
|
|
285
|
-
import { useMemo as
|
|
322
|
+
import { useMemo as useMemo6, useSyncExternalStore } from "react";
|
|
286
323
|
var useMulticastObservable = (observable) => {
|
|
287
|
-
const subscribeFn =
|
|
324
|
+
const subscribeFn = useMemo6(() => (listener) => {
|
|
288
325
|
const subscription = observable.subscribe(listener);
|
|
289
326
|
return () => subscription.unsubscribe();
|
|
290
327
|
}, [
|
|
@@ -303,19 +340,19 @@ var useRefCallback = () => {
|
|
|
303
340
|
};
|
|
304
341
|
};
|
|
305
342
|
|
|
306
|
-
// src/
|
|
307
|
-
import { useLayoutEffect, useMemo as
|
|
308
|
-
var
|
|
309
|
-
const debouncedHandler =
|
|
343
|
+
// src/useViewportResize.ts
|
|
344
|
+
import { useLayoutEffect, useMemo as useMemo7 } from "react";
|
|
345
|
+
var useViewportResize = (cb, deps = [], delay = 800) => {
|
|
346
|
+
const debouncedHandler = useMemo7(() => {
|
|
310
347
|
let timeout;
|
|
311
348
|
return (event) => {
|
|
312
349
|
clearTimeout(timeout);
|
|
313
350
|
timeout = setTimeout(() => {
|
|
314
|
-
|
|
351
|
+
cb(event);
|
|
315
352
|
}, delay);
|
|
316
353
|
};
|
|
317
354
|
}, [
|
|
318
|
-
|
|
355
|
+
cb,
|
|
319
356
|
delay
|
|
320
357
|
]);
|
|
321
358
|
return useLayoutEffect(() => {
|
|
@@ -328,39 +365,16 @@ var useResize = (handler, deps = [], delay = 800) => {
|
|
|
328
365
|
]);
|
|
329
366
|
};
|
|
330
367
|
|
|
331
|
-
// src/useSignals.ts
|
|
332
|
-
import { useSignals as _useSignals } from "@preact-signals/safe-react/tracking";
|
|
333
|
-
import { computed, effect } from "@preact-signals/safe-react";
|
|
334
|
-
import { useRef as useRef5 } from "@preact-signals/safe-react/react";
|
|
335
|
-
import { useEffect as useEffect10, useMemo as useMemo7 } from "react";
|
|
336
|
-
var useSignalsEffect = (cb, deps) => {
|
|
337
|
-
const callback = useRef5(cb);
|
|
338
|
-
callback.current = cb;
|
|
339
|
-
useEffect10(() => {
|
|
340
|
-
return effect(() => {
|
|
341
|
-
return callback.current();
|
|
342
|
-
});
|
|
343
|
-
}, deps ?? []);
|
|
344
|
-
};
|
|
345
|
-
var useSignalsMemo = (cb, deps) => {
|
|
346
|
-
var _effect = _useSignals();
|
|
347
|
-
try {
|
|
348
|
-
return useMemo7(() => computed(cb), deps ?? []).value;
|
|
349
|
-
} finally {
|
|
350
|
-
_effect.f();
|
|
351
|
-
}
|
|
352
|
-
};
|
|
353
|
-
|
|
354
368
|
// src/useTimeout.ts
|
|
355
|
-
import { useEffect as
|
|
369
|
+
import { useEffect as useEffect10, useRef as useRef6 } from "react";
|
|
356
370
|
var useTimeout = (callback, delay = 0, deps = []) => {
|
|
357
371
|
const callbackRef = useRef6(callback);
|
|
358
|
-
|
|
372
|
+
useEffect10(() => {
|
|
359
373
|
callbackRef.current = callback;
|
|
360
374
|
}, [
|
|
361
375
|
callback
|
|
362
376
|
]);
|
|
363
|
-
|
|
377
|
+
useEffect10(() => {
|
|
364
378
|
if (delay == null) {
|
|
365
379
|
return;
|
|
366
380
|
}
|
|
@@ -373,12 +387,12 @@ var useTimeout = (callback, delay = 0, deps = []) => {
|
|
|
373
387
|
};
|
|
374
388
|
var useInterval = (callback, delay = 0, deps = []) => {
|
|
375
389
|
const callbackRef = useRef6(callback);
|
|
376
|
-
|
|
390
|
+
useEffect10(() => {
|
|
377
391
|
callbackRef.current = callback;
|
|
378
392
|
}, [
|
|
379
393
|
callback
|
|
380
394
|
]);
|
|
381
|
-
|
|
395
|
+
useEffect10(() => {
|
|
382
396
|
if (delay == null) {
|
|
383
397
|
return;
|
|
384
398
|
}
|
|
@@ -396,16 +410,16 @@ var useInterval = (callback, delay = 0, deps = []) => {
|
|
|
396
410
|
};
|
|
397
411
|
|
|
398
412
|
// src/useTransitions.ts
|
|
399
|
-
import { useEffect as
|
|
400
|
-
var
|
|
413
|
+
import { useEffect as useEffect11, useRef as useRef7, useState as useState8 } from "react";
|
|
414
|
+
var isFunction2 = (functionToCheck) => {
|
|
401
415
|
return functionToCheck instanceof Function;
|
|
402
416
|
};
|
|
403
417
|
var useDidTransition = (currentValue, fromValue, toValue) => {
|
|
404
418
|
const [hasTransitioned, setHasTransitioned] = useState8(false);
|
|
405
419
|
const previousValue = useRef7(currentValue);
|
|
406
|
-
|
|
407
|
-
const toValueValid =
|
|
408
|
-
const fromValueValid =
|
|
420
|
+
useEffect11(() => {
|
|
421
|
+
const toValueValid = isFunction2(toValue) ? toValue(currentValue) : toValue === currentValue;
|
|
422
|
+
const fromValueValid = isFunction2(fromValue) ? fromValue(previousValue.current) : fromValue === previousValue.current;
|
|
409
423
|
if (fromValueValid && toValueValid && !hasTransitioned) {
|
|
410
424
|
setHasTransitioned(true);
|
|
411
425
|
} else if ((!fromValueValid || !toValueValid) && hasTransitioned) {
|
|
@@ -423,13 +437,13 @@ var useDidTransition = (currentValue, fromValue, toValue) => {
|
|
|
423
437
|
var useOnTransition = (currentValue, fromValue, toValue, callback) => {
|
|
424
438
|
const dirty = useRef7(false);
|
|
425
439
|
const hasTransitioned = useDidTransition(currentValue, fromValue, toValue);
|
|
426
|
-
|
|
440
|
+
useEffect11(() => {
|
|
427
441
|
dirty.current = false;
|
|
428
442
|
}, [
|
|
429
443
|
currentValue,
|
|
430
444
|
dirty
|
|
431
445
|
]);
|
|
432
|
-
|
|
446
|
+
useEffect11(() => {
|
|
433
447
|
if (hasTransitioned && !dirty.current) {
|
|
434
448
|
callback();
|
|
435
449
|
dirty.current = true;
|
|
@@ -440,9 +454,14 @@ var useOnTransition = (currentValue, fromValue, toValue, callback) => {
|
|
|
440
454
|
callback
|
|
441
455
|
]);
|
|
442
456
|
};
|
|
457
|
+
|
|
458
|
+
// src/index.ts
|
|
459
|
+
import { useSize, useScroller } from "mini-virtual-list";
|
|
443
460
|
export {
|
|
444
461
|
makeId,
|
|
462
|
+
mergeRefs,
|
|
445
463
|
randomString,
|
|
464
|
+
setRef,
|
|
446
465
|
useAsyncEffect,
|
|
447
466
|
useAsyncState,
|
|
448
467
|
useControlledState,
|
|
@@ -457,13 +476,14 @@ export {
|
|
|
457
476
|
useInterval,
|
|
458
477
|
useIsFocused,
|
|
459
478
|
useMediaQuery,
|
|
479
|
+
useMergeRefs,
|
|
460
480
|
useMulticastObservable,
|
|
461
481
|
useOnTransition,
|
|
462
482
|
useRefCallback,
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
useSignalsMemo,
|
|
483
|
+
useScroller,
|
|
484
|
+
useSize,
|
|
466
485
|
useStateWithRef,
|
|
467
|
-
useTimeout
|
|
486
|
+
useTimeout,
|
|
487
|
+
useViewportResize
|
|
468
488
|
};
|
|
469
489
|
//# sourceMappingURL=index.mjs.map
|