@codeleap/hooks 7.0.2 → 7.1.1
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/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +32 -57
- package/dist/index.js.map +1 -1
- package/dist/onMount.js +3 -7
- package/dist/onMount.js.map +1 -1
- package/dist/onUpdate.js +3 -7
- package/dist/onUpdate.js.map +1 -1
- package/dist/useBooleanToggle.js +3 -6
- package/dist/useBooleanToggle.js.map +1 -1
- package/dist/useComponentTestId.js +6 -10
- package/dist/useComponentTestId.js.map +1 -1
- package/dist/useConditionalState.js +6 -10
- package/dist/useConditionalState.js.map +1 -1
- package/dist/useDebounce.js +5 -8
- package/dist/useDebounce.js.map +1 -1
- package/dist/useDebounceCallback.js +6 -9
- package/dist/useDebounceCallback.js.map +1 -1
- package/dist/useDerivedRef.js +4 -8
- package/dist/useDerivedRef.js.map +1 -1
- package/dist/useDerivedState.js +6 -10
- package/dist/useDerivedState.js.map +1 -1
- package/dist/useEffectOnce.js +3 -7
- package/dist/useEffectOnce.js.map +1 -1
- package/dist/useFilteredList.js +3 -6
- package/dist/useFilteredList.js.map +1 -1
- package/dist/useForceRender.js +3 -6
- package/dist/useForceRender.js.map +1 -1
- package/dist/useGuardedAsyncCallback.d.ts +31 -0
- package/dist/useGuardedAsyncCallback.d.ts.map +1 -0
- package/dist/useGuardedAsyncCallback.js +38 -0
- package/dist/useGuardedAsyncCallback.js.map +1 -0
- package/dist/useId.js +5 -9
- package/dist/useId.js.map +1 -1
- package/dist/useInterval.js +8 -11
- package/dist/useInterval.js.map +1 -1
- package/dist/useIsMounted.js +5 -9
- package/dist/useIsMounted.js.map +1 -1
- package/dist/useLazyStore.js +5 -8
- package/dist/useLazyStore.js.map +1 -1
- package/dist/useModal.js +5 -8
- package/dist/useModal.js.map +1 -1
- package/dist/useOptions.js +4 -7
- package/dist/useOptions.js.map +1 -1
- package/dist/usePartialState.js +6 -9
- package/dist/usePartialState.js.map +1 -1
- package/dist/usePlaces.js +23 -43
- package/dist/usePlaces.js.map +1 -1
- package/dist/usePlacesAutocompleteUtils.js +12 -19
- package/dist/usePlacesAutocompleteUtils.js.map +1 -1
- package/dist/usePrevious.js +4 -8
- package/dist/usePrevious.js.map +1 -1
- package/dist/usePromise.js +17 -32
- package/dist/usePromise.js.map +1 -1
- package/dist/useRenderCall.js +3 -6
- package/dist/useRenderCall.js.map +1 -1
- package/dist/useSearch/index.js +24 -38
- package/dist/useSearch/index.js.map +1 -1
- package/dist/useSearch/types.js +1 -2
- package/dist/useStableReference.js +5 -8
- package/dist/useStableReference.js.map +1 -1
- package/dist/useToggle.js +3 -6
- package/dist/useToggle.js.map +1 -1
- package/dist/useUncontrolled.js +6 -10
- package/dist/useUncontrolled.js.map +1 -1
- package/dist/useUnmount.js +5 -9
- package/dist/useUnmount.js.map +1 -1
- package/package.json +8 -8
- package/src/index.ts +1 -0
- package/src/useGuardedAsyncCallback.ts +43 -0
package/dist/index.d.ts
CHANGED
|
@@ -24,6 +24,7 @@ export * from './useDebounceCallback';
|
|
|
24
24
|
export * from './useDerivedRef';
|
|
25
25
|
export * from './useDerivedState';
|
|
26
26
|
export * from './useFilteredList';
|
|
27
|
+
export * from './useGuardedAsyncCallback';
|
|
27
28
|
export * from './useLazyStore';
|
|
28
29
|
export * from './useStableReference';
|
|
29
30
|
export * from './useOptions';
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,MAAM,EACN,QAAQ,EACR,mBAAmB,EACnB,OAAO,EACP,WAAW,EACX,UAAU,EACV,eAAe,EACf,aAAa,EACb,UAAU,EACX,MAAM,OAAO,CAAA;AAEd,cAAc,uBAAuB,CAAA;AACrC,cAAc,cAAc,CAAA;AAC5B,cAAc,mBAAmB,CAAA;AACjC,cAAc,kBAAkB,CAAA;AAChC,cAAc,eAAe,CAAA;AAC7B,cAAc,eAAe,CAAA;AAC7B,cAAc,WAAW,CAAA;AACzB,cAAc,YAAY,CAAA;AAC1B,cAAc,eAAe,CAAA;AAC7B,cAAc,aAAa,CAAA;AAC3B,cAAc,oBAAoB,CAAA;AAClC,cAAc,YAAY,CAAA;AAC1B,cAAc,aAAa,CAAA;AAC3B,cAAc,8BAA8B,CAAA;AAC5C,cAAc,iBAAiB,CAAA;AAC/B,cAAc,cAAc,CAAA;AAC5B,cAAc,aAAa,CAAA;AAC3B,cAAc,mBAAmB,CAAA;AACjC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,sBAAsB,CAAA;AACpC,cAAc,SAAS,CAAA;AACvB,cAAc,uBAAuB,CAAA;AACrC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,mBAAmB,CAAA;AACjC,cAAc,mBAAmB,CAAA;AACjC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,sBAAsB,CAAA;AACpC,cAAc,cAAc,CAAA;AAC5B,cAAc,iBAAiB,CAAA;AAE/B,OAAO,EACL,SAAS,EACT,MAAM,EACN,QAAQ,EACR,mBAAmB,EACnB,OAAO,EACP,WAAW,EACX,UAAU,EACV,eAAe,EACf,aAAa,EACb,UAAU,GACX,CAAA"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,MAAM,EACN,QAAQ,EACR,mBAAmB,EACnB,OAAO,EACP,WAAW,EACX,UAAU,EACV,eAAe,EACf,aAAa,EACb,UAAU,EACX,MAAM,OAAO,CAAA;AAEd,cAAc,uBAAuB,CAAA;AACrC,cAAc,cAAc,CAAA;AAC5B,cAAc,mBAAmB,CAAA;AACjC,cAAc,kBAAkB,CAAA;AAChC,cAAc,eAAe,CAAA;AAC7B,cAAc,eAAe,CAAA;AAC7B,cAAc,WAAW,CAAA;AACzB,cAAc,YAAY,CAAA;AAC1B,cAAc,eAAe,CAAA;AAC7B,cAAc,aAAa,CAAA;AAC3B,cAAc,oBAAoB,CAAA;AAClC,cAAc,YAAY,CAAA;AAC1B,cAAc,aAAa,CAAA;AAC3B,cAAc,8BAA8B,CAAA;AAC5C,cAAc,iBAAiB,CAAA;AAC/B,cAAc,cAAc,CAAA;AAC5B,cAAc,aAAa,CAAA;AAC3B,cAAc,mBAAmB,CAAA;AACjC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,sBAAsB,CAAA;AACpC,cAAc,SAAS,CAAA;AACvB,cAAc,uBAAuB,CAAA;AACrC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,mBAAmB,CAAA;AACjC,cAAc,mBAAmB,CAAA;AACjC,cAAc,2BAA2B,CAAA;AACzC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,sBAAsB,CAAA;AACpC,cAAc,cAAc,CAAA;AAC5B,cAAc,iBAAiB,CAAA;AAE/B,OAAO,EACL,SAAS,EACT,MAAM,EACN,QAAQ,EACR,mBAAmB,EACnB,OAAO,EACP,WAAW,EACX,UAAU,EACV,eAAe,EACf,aAAa,EACb,UAAU,GACX,CAAA"}
|
package/dist/index.js
CHANGED
|
@@ -1,58 +1,33 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
__exportStar(require("./useDebounce"), exports);
|
|
34
|
-
__exportStar(require("./useInterval"), exports);
|
|
35
|
-
__exportStar(require("./onMount"), exports);
|
|
36
|
-
__exportStar(require("./onUpdate"), exports);
|
|
37
|
-
__exportStar(require("./usePrevious"), exports);
|
|
38
|
-
__exportStar(require("./useToggle"), exports);
|
|
39
|
-
__exportStar(require("./useBooleanToggle"), exports);
|
|
40
|
-
__exportStar(require("./useModal"), exports);
|
|
41
|
-
__exportStar(require("./usePlaces"), exports);
|
|
42
|
-
__exportStar(require("./usePlacesAutocompleteUtils"), exports);
|
|
43
|
-
__exportStar(require("./useEffectOnce"), exports);
|
|
44
|
-
__exportStar(require("./useUnmount"), exports);
|
|
45
|
-
__exportStar(require("./useSearch"), exports);
|
|
46
|
-
__exportStar(require("./usePartialState"), exports);
|
|
47
|
-
__exportStar(require("./useIsMounted"), exports);
|
|
48
|
-
__exportStar(require("./useComponentTestId"), exports);
|
|
49
|
-
__exportStar(require("./useId"), exports);
|
|
50
|
-
__exportStar(require("./useDebounceCallback"), exports);
|
|
51
|
-
__exportStar(require("./useDerivedRef"), exports);
|
|
52
|
-
__exportStar(require("./useDerivedState"), exports);
|
|
53
|
-
__exportStar(require("./useFilteredList"), exports);
|
|
54
|
-
__exportStar(require("./useLazyStore"), exports);
|
|
55
|
-
__exportStar(require("./useStableReference"), exports);
|
|
56
|
-
__exportStar(require("./useOptions"), exports);
|
|
57
|
-
__exportStar(require("./useRenderCall"), exports);
|
|
1
|
+
import { useEffect, useRef, useState, useImperativeHandle, useMemo, useCallback, useContext, useLayoutEffect, useDebugValue, useReducer, } from 'react';
|
|
2
|
+
export * from './useConditionalState';
|
|
3
|
+
export * from './usePromise';
|
|
4
|
+
export * from './useUncontrolled';
|
|
5
|
+
export * from './useForceRender';
|
|
6
|
+
export * from './useDebounce';
|
|
7
|
+
export * from './useInterval';
|
|
8
|
+
export * from './onMount';
|
|
9
|
+
export * from './onUpdate';
|
|
10
|
+
export * from './usePrevious';
|
|
11
|
+
export * from './useToggle';
|
|
12
|
+
export * from './useBooleanToggle';
|
|
13
|
+
export * from './useModal';
|
|
14
|
+
export * from './usePlaces';
|
|
15
|
+
export * from './usePlacesAutocompleteUtils';
|
|
16
|
+
export * from './useEffectOnce';
|
|
17
|
+
export * from './useUnmount';
|
|
18
|
+
export * from './useSearch';
|
|
19
|
+
export * from './usePartialState';
|
|
20
|
+
export * from './useIsMounted';
|
|
21
|
+
export * from './useComponentTestId';
|
|
22
|
+
export * from './useId';
|
|
23
|
+
export * from './useDebounceCallback';
|
|
24
|
+
export * from './useDerivedRef';
|
|
25
|
+
export * from './useDerivedState';
|
|
26
|
+
export * from './useFilteredList';
|
|
27
|
+
export * from './useGuardedAsyncCallback';
|
|
28
|
+
export * from './useLazyStore';
|
|
29
|
+
export * from './useStableReference';
|
|
30
|
+
export * from './useOptions';
|
|
31
|
+
export * from './useRenderCall';
|
|
32
|
+
export { useEffect, useRef, useState, useImperativeHandle, useMemo, useCallback, useContext, useLayoutEffect, useDebugValue, useReducer, };
|
|
58
33
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,MAAM,EACN,QAAQ,EACR,mBAAmB,EACnB,OAAO,EACP,WAAW,EACX,UAAU,EACV,eAAe,EACf,aAAa,EACb,UAAU,GACX,MAAM,OAAO,CAAA;AAEd,cAAc,uBAAuB,CAAA;AACrC,cAAc,cAAc,CAAA;AAC5B,cAAc,mBAAmB,CAAA;AACjC,cAAc,kBAAkB,CAAA;AAChC,cAAc,eAAe,CAAA;AAC7B,cAAc,eAAe,CAAA;AAC7B,cAAc,WAAW,CAAA;AACzB,cAAc,YAAY,CAAA;AAC1B,cAAc,eAAe,CAAA;AAC7B,cAAc,aAAa,CAAA;AAC3B,cAAc,oBAAoB,CAAA;AAClC,cAAc,YAAY,CAAA;AAC1B,cAAc,aAAa,CAAA;AAC3B,cAAc,8BAA8B,CAAA;AAC5C,cAAc,iBAAiB,CAAA;AAC/B,cAAc,cAAc,CAAA;AAC5B,cAAc,aAAa,CAAA;AAC3B,cAAc,mBAAmB,CAAA;AACjC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,sBAAsB,CAAA;AACpC,cAAc,SAAS,CAAA;AACvB,cAAc,uBAAuB,CAAA;AACrC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,mBAAmB,CAAA;AACjC,cAAc,mBAAmB,CAAA;AACjC,cAAc,2BAA2B,CAAA;AACzC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,sBAAsB,CAAA;AACpC,cAAc,cAAc,CAAA;AAC5B,cAAc,iBAAiB,CAAA;AAE/B,OAAO,EACL,SAAS,EACT,MAAM,EACN,QAAQ,EACR,mBAAmB,EACnB,OAAO,EACP,WAAW,EACX,UAAU,EACV,eAAe,EACf,aAAa,EACb,UAAU,GACX,CAAA"}
|
package/dist/onMount.js
CHANGED
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.onMount = void 0;
|
|
4
|
-
const react_1 = require("react");
|
|
1
|
+
import { useEffect } from 'react';
|
|
5
2
|
/**
|
|
6
3
|
* Hook that runs a function once when the component mounts.
|
|
7
4
|
*
|
|
@@ -11,10 +8,9 @@ const react_1 = require("react");
|
|
|
11
8
|
* return () => console.log('Component unmounted')
|
|
12
9
|
* })
|
|
13
10
|
*/
|
|
14
|
-
const onMount = (func) => {
|
|
15
|
-
|
|
11
|
+
export const onMount = (func) => {
|
|
12
|
+
useEffect(() => {
|
|
16
13
|
return func();
|
|
17
14
|
}, []);
|
|
18
15
|
};
|
|
19
|
-
exports.onMount = onMount;
|
|
20
16
|
//# sourceMappingURL=onMount.js.map
|
package/dist/onMount.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"onMount.js","sourceRoot":"","sources":["../src/onMount.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"onMount.js","sourceRoot":"","sources":["../src/onMount.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGjC;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,IAAiB,EAAE,EAAE;IAC3C,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,IAAI,EAAE,CAAA;IACf,CAAC,EAAE,EAAE,CAAC,CAAA;AACR,CAAC,CAAA"}
|
package/dist/onUpdate.js
CHANGED
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.onUpdate = void 0;
|
|
4
|
-
const react_1 = require("react");
|
|
1
|
+
import { useEffect } from 'react';
|
|
5
2
|
/**
|
|
6
3
|
* Hook that runs a function when specified dependencies change.
|
|
7
4
|
*
|
|
@@ -10,10 +7,9 @@ const react_1 = require("react");
|
|
|
10
7
|
* console.log('Count changed:', count)
|
|
11
8
|
* }, [count])
|
|
12
9
|
*/
|
|
13
|
-
const onUpdate = (func, listeners = []) => {
|
|
14
|
-
|
|
10
|
+
export const onUpdate = (func, listeners = []) => {
|
|
11
|
+
useEffect(() => {
|
|
15
12
|
return func();
|
|
16
13
|
}, listeners);
|
|
17
14
|
};
|
|
18
|
-
exports.onUpdate = onUpdate;
|
|
19
15
|
//# sourceMappingURL=onUpdate.js.map
|
package/dist/onUpdate.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"onUpdate.js","sourceRoot":"","sources":["../src/onUpdate.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"onUpdate.js","sourceRoot":"","sources":["../src/onUpdate.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGjC;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,IAAiB,EAAE,SAAS,GAAG,EAAE,EAAE,EAAE;IAC5D,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,IAAI,EAAE,CAAA;IACf,CAAC,EAAE,SAAS,CAAC,CAAA;AACf,CAAC,CAAA"}
|
package/dist/useBooleanToggle.js
CHANGED
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.useBooleanToggle = useBooleanToggle;
|
|
4
|
-
const react_1 = require("react");
|
|
1
|
+
import { useState } from 'react';
|
|
5
2
|
/**
|
|
6
3
|
* Hook that manages a boolean state with toggle functionality.
|
|
7
4
|
*
|
|
@@ -10,8 +7,8 @@ const react_1 = require("react");
|
|
|
10
7
|
* toggleOpen() // Toggles the value
|
|
11
8
|
* toggleOpen(true) // Sets to true
|
|
12
9
|
*/
|
|
13
|
-
function useBooleanToggle(initial) {
|
|
14
|
-
const [v, setV] =
|
|
10
|
+
export function useBooleanToggle(initial) {
|
|
11
|
+
const [v, setV] = useState(initial);
|
|
15
12
|
function toggleOrSet(value) {
|
|
16
13
|
if (typeof value === 'boolean') {
|
|
17
14
|
setV(value);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useBooleanToggle.js","sourceRoot":"","sources":["../src/useBooleanToggle.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useBooleanToggle.js","sourceRoot":"","sources":["../src/useBooleanToggle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEhC;;;;;;;GAOG;AACH,MAAM,UAAU,gBAAgB,CAAC,OAAgB;IAC/C,MAAM,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAA;IAEnC,SAAS,WAAW,CAAC,KAAe;QAClC,IAAI,OAAO,KAAK,KAAK,SAAS,EAAE,CAAC;YAC/B,IAAI,CAAC,KAAK,CAAC,CAAA;QACb,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAA;QAC/B,CAAC;IACH,CAAC;IAED,OAAO,CAAC,CAAC,EAAE,WAAW,CAAU,CAAA;AAClC,CAAC"}
|
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.useComponentTestId = void 0;
|
|
4
|
-
const react_1 = require("react");
|
|
1
|
+
import { useRef, Children } from 'react';
|
|
5
2
|
const simpleHash = (str) => {
|
|
6
3
|
let hash = 0;
|
|
7
4
|
for (let i = 0; i < str.length; i++) {
|
|
@@ -13,7 +10,7 @@ const simpleHash = (str) => {
|
|
|
13
10
|
const normalizeProps = (props, keys) => {
|
|
14
11
|
return keys.reduce((acc, key) => {
|
|
15
12
|
if (key === 'children') {
|
|
16
|
-
acc[key] =
|
|
13
|
+
acc[key] = Children.map(props[key], (child) => typeof child === 'object' ? '[Component]' : child);
|
|
17
14
|
}
|
|
18
15
|
else {
|
|
19
16
|
acc[key] = props[key];
|
|
@@ -25,9 +22,9 @@ const normalizeDebugName = (debugName) => {
|
|
|
25
22
|
return debugName.trim().replace(/\s+/g, '-').toLowerCase();
|
|
26
23
|
};
|
|
27
24
|
const generateComponentTestId = (componentName, props, keys) => {
|
|
28
|
-
const hasDebugName = typeof
|
|
25
|
+
const hasDebugName = typeof props?.debugName === 'string';
|
|
29
26
|
if (hasDebugName)
|
|
30
|
-
return `${componentName}:${normalizeDebugName(props
|
|
27
|
+
return `${componentName}:${normalizeDebugName(props?.debugName)}`;
|
|
31
28
|
const extractedProps = normalizeProps(props, keys);
|
|
32
29
|
return `${componentName}:${simpleHash(JSON.stringify(extractedProps))}`;
|
|
33
30
|
};
|
|
@@ -39,9 +36,8 @@ const generateComponentTestId = (componentName, props, keys) => {
|
|
|
39
36
|
* const testId = useComponentTestId(Button, props, ['label', 'variant'])
|
|
40
37
|
* // Returns: "Button:debug-name" or "Button:123456"
|
|
41
38
|
*/
|
|
42
|
-
const useComponentTestId = (Component, props, keys) => {
|
|
43
|
-
const testIdRef =
|
|
39
|
+
export const useComponentTestId = (Component, props, keys) => {
|
|
40
|
+
const testIdRef = useRef(generateComponentTestId(Component.styleRegistryName, props, keys));
|
|
44
41
|
return testIdRef.current;
|
|
45
42
|
};
|
|
46
|
-
exports.useComponentTestId = useComponentTestId;
|
|
47
43
|
//# sourceMappingURL=useComponentTestId.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useComponentTestId.js","sourceRoot":"","sources":["../src/useComponentTestId.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useComponentTestId.js","sourceRoot":"","sources":["../src/useComponentTestId.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAExC,MAAM,UAAU,GAAG,CAAC,GAAW,EAAU,EAAE;IACzC,IAAI,IAAI,GAAG,CAAC,CAAA;IACZ,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,GAAG,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;QACpC,IAAI,GAAG,CAAC,IAAI,IAAI,CAAC,CAAC,GAAG,IAAI,GAAG,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,CAAA;QAC7C,IAAI,IAAI,CAAC,CAAA;IACX,CAAC;IACD,OAAO,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,CAAA;AAClC,CAAC,CAAA;AAED,MAAM,cAAc,GAAG,CAAsB,KAAQ,EAAE,IAAoB,EAAc,EAAE;IACzF,OAAO,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE;QAC9B,IAAI,GAAG,KAAK,UAAU,EAAE,CAAC;YACvB,GAAG,CAAC,GAAG,CAAC,GAAG,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,CAC/F,CAAA;QACH,CAAC;aAAM,CAAC;YACN,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,CAAA;QACvB,CAAC;QACD,OAAO,GAAG,CAAA;IACZ,CAAC,EAAE,EAAgB,CAAC,CAAA;AACtB,CAAC,CAAA;AAED,MAAM,kBAAkB,GAAG,CAAC,SAAiB,EAAE,EAAE;IAC/C,OAAO,SAAS,CAAC,IAAI,EAAE,CAAC,OAAO,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,WAAW,EAAE,CAAA;AAC5D,CAAC,CAAA;AAED,MAAM,uBAAuB,GAAG,CAAsB,aAAqB,EAAE,KAAQ,EAAE,IAAoB,EAAE,EAAE;IAC7G,MAAM,YAAY,GAAG,OAAO,KAAK,EAAE,SAAS,KAAK,QAAQ,CAAA;IACzD,IAAI,YAAY;QAAE,OAAO,GAAG,aAAa,IAAI,kBAAkB,CAAC,KAAK,EAAE,SAAS,CAAC,EAAE,CAAA;IACnF,MAAM,cAAc,GAAG,cAAc,CAAC,KAAK,EAAE,IAAI,CAAC,CAAA;IAClD,OAAO,GAAG,aAAa,IAAI,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC,EAAE,CAAA;AACzE,CAAC,CAAA;AAED;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAChC,SAAc,EACd,KAAQ,EACR,IAAoB,EACpB,EAAE;IACF,MAAM,SAAS,GAAG,MAAM,CAAC,uBAAuB,CAAC,SAAS,CAAC,iBAAiB,EAAE,KAAK,EAAE,IAAI,CAAC,CAAC,CAAA;IAC3F,OAAO,SAAS,CAAC,OAAO,CAAA;AAC1B,CAAC,CAAA"}
|
|
@@ -1,8 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
exports.useConditionalState = void 0;
|
|
4
|
-
const react_1 = require("react");
|
|
5
|
-
const useBooleanToggle_1 = require("./useBooleanToggle");
|
|
1
|
+
import { useState } from 'react';
|
|
2
|
+
import { useBooleanToggle } from './useBooleanToggle';
|
|
6
3
|
/**
|
|
7
4
|
* Hook that uses external state if provided, otherwise creates internal state.
|
|
8
5
|
* Useful for creating controlled/uncontrolled component patterns.
|
|
@@ -14,14 +11,13 @@ const useBooleanToggle_1 = require("./useBooleanToggle");
|
|
|
14
11
|
* // Uncontrolled mode
|
|
15
12
|
* const [value, setValue] = useConditionalState(undefined, undefined, { initialValue: 'default' })
|
|
16
13
|
*/
|
|
17
|
-
const useConditionalState = (value, setter, options = {}) => {
|
|
18
|
-
const state =
|
|
19
|
-
?
|
|
20
|
-
:
|
|
14
|
+
export const useConditionalState = (value, setter, options = {}) => {
|
|
15
|
+
const state = options?.isBooleanToggle
|
|
16
|
+
? useBooleanToggle(options?.initialValue)
|
|
17
|
+
: useState(options?.initialValue);
|
|
21
18
|
if (typeof value !== 'undefined' && typeof setter === 'function') {
|
|
22
19
|
return [value, setter];
|
|
23
20
|
}
|
|
24
21
|
return state;
|
|
25
22
|
};
|
|
26
|
-
exports.useConditionalState = useConditionalState;
|
|
27
23
|
//# sourceMappingURL=useConditionalState.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useConditionalState.js","sourceRoot":"","sources":["../src/useConditionalState.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useConditionalState.js","sourceRoot":"","sources":["../src/useConditionalState.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAA4B,MAAM,OAAO,CAAA;AAE1D,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AASrD;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,CACjC,KAAoB,EACpB,MAAmB,EACnB,UAAyC,EAAE,EACzB,EAAE;IACpB,MAAM,KAAK,GAAG,OAAO,EAAE,eAAe;QACpC,CAAC,CAAC,gBAAgB,CAAC,OAAO,EAAE,YAAuB,CAAC;QACpD,CAAC,CAAC,QAAQ,CAAC,OAAO,EAAE,YAAY,CAAC,CAAA;IAEnC,IAAI,OAAO,KAAK,KAAK,WAAW,IAAI,OAAO,MAAM,KAAK,UAAU,EAAE,CAAC;QACjE,OAAO,CAAC,KAAK,EAAE,MAAM,CAAC,CAAA;IACxB,CAAC;IAED,OAAO,KAAoC,CAAA;AAC7C,CAAC,CAAA"}
|
package/dist/useDebounce.js
CHANGED
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.useDebounce = useDebounce;
|
|
4
|
-
const react_1 = require("react");
|
|
1
|
+
import { useEffect, useRef, useState } from 'react';
|
|
5
2
|
/**
|
|
6
3
|
* Hook that debounces a value, updating it after a specified delay.
|
|
7
4
|
*
|
|
@@ -9,15 +6,15 @@ const react_1 = require("react");
|
|
|
9
6
|
* const [debouncedSearch, resetDebounce] = useDebounce(searchTerm, 500)
|
|
10
7
|
* // debouncedSearch updates 500ms after searchTerm stops changing
|
|
11
8
|
*/
|
|
12
|
-
function useDebounce(value, debounce) {
|
|
13
|
-
const [debouncedValue, setDebouncedValue] =
|
|
14
|
-
const timeoutRef =
|
|
9
|
+
export function useDebounce(value, debounce) {
|
|
10
|
+
const [debouncedValue, setDebouncedValue] = useState(value);
|
|
11
|
+
const timeoutRef = useRef(null);
|
|
15
12
|
const reset = () => {
|
|
16
13
|
if (timeoutRef.current) {
|
|
17
14
|
clearTimeout(timeoutRef.current);
|
|
18
15
|
}
|
|
19
16
|
};
|
|
20
|
-
|
|
17
|
+
useEffect(() => {
|
|
21
18
|
timeoutRef.current = setTimeout(() => {
|
|
22
19
|
setDebouncedValue(value);
|
|
23
20
|
}, debounce);
|
package/dist/useDebounce.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDebounce.js","sourceRoot":"","sources":["../src/useDebounce.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useDebounce.js","sourceRoot":"","sources":["../src/useDebounce.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEnD;;;;;;GAMG;AACH,MAAM,UAAU,WAAW,CACzB,KAAQ,EACR,QAAgB;IAEhB,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAE3D,MAAM,UAAU,GAAG,MAAM,CAAuC,IAAI,CAAC,CAAA;IAErE,MAAM,KAAK,GAAG,GAAG,EAAE;QACjB,IAAI,UAAU,CAAC,OAAO,EAAE,CAAC;YACvB,YAAY,CAAC,UAAU,CAAC,OAAO,CAAC,CAAA;QAClC,CAAC;IACH,CAAC,CAAA;IACD,SAAS,CAAC,GAAG,EAAE;QACb,UAAU,CAAC,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;YACnC,iBAAiB,CAAC,KAAK,CAAC,CAAA;QAC1B,CAAC,EAAE,QAAQ,CAAC,CAAA;QAEZ,OAAO,KAAK,CAAA;IACd,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,OAAO,CAAC,cAAc,EAAE,KAAK,CAAC,CAAA;AAChC,CAAC"}
|
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.useDebounceCallback = useDebounceCallback;
|
|
4
|
-
const react_1 = require("react");
|
|
1
|
+
import { useRef, useCallback } from 'react';
|
|
5
2
|
/**
|
|
6
3
|
* Hook that creates debounced, flush, and cancel functions for a callback.
|
|
7
4
|
*
|
|
@@ -14,20 +11,20 @@ const react_1 = require("react");
|
|
|
14
11
|
* flush('immediate') // Calls callback immediately
|
|
15
12
|
* cancel() // Cancels pending debounced call
|
|
16
13
|
*/
|
|
17
|
-
function useDebounceCallback(callback, delay = 1000) {
|
|
18
|
-
const timeoutRef =
|
|
19
|
-
const debounce =
|
|
14
|
+
export function useDebounceCallback(callback, delay = 1000) {
|
|
15
|
+
const timeoutRef = useRef(null);
|
|
16
|
+
const debounce = useCallback((...args) => {
|
|
20
17
|
cancel();
|
|
21
18
|
timeoutRef.current = setTimeout(() => {
|
|
22
19
|
callback(...args);
|
|
23
20
|
timeoutRef.current = null;
|
|
24
21
|
}, delay);
|
|
25
22
|
}, [callback]);
|
|
26
|
-
const flush =
|
|
23
|
+
const flush = useCallback((...args) => {
|
|
27
24
|
cancel();
|
|
28
25
|
callback(...args);
|
|
29
26
|
}, [callback]);
|
|
30
|
-
const cancel =
|
|
27
|
+
const cancel = useCallback(() => {
|
|
31
28
|
if (timeoutRef.current) {
|
|
32
29
|
clearTimeout(timeoutRef.current);
|
|
33
30
|
timeoutRef.current = null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDebounceCallback.js","sourceRoot":"","sources":["../src/useDebounceCallback.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useDebounceCallback.js","sourceRoot":"","sources":["../src/useDebounceCallback.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAE3C;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,mBAAmB,CACjC,QAA8B,EAC9B,KAAK,GAAG,IAAI;IAEZ,MAAM,UAAU,GAAG,MAAM,CAAuC,IAAI,CAAC,CAAA;IAErE,MAAM,QAAQ,GAAG,WAAW,CAAC,CAAC,GAAG,IAAO,EAAE,EAAE;QAC1C,MAAM,EAAE,CAAA;QAER,UAAU,CAAC,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;YACnC,QAAQ,CAAC,GAAG,IAAI,CAAC,CAAA;YACjB,UAAU,CAAC,OAAO,GAAG,IAAI,CAAA;QAC3B,CAAC,EAAE,KAAK,CAAC,CAAA;IACX,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAA;IAEd,MAAM,KAAK,GAAG,WAAW,CAAC,CAAC,GAAG,IAAO,EAAE,EAAE;QACvC,MAAM,EAAE,CAAA;QACR,QAAQ,CAAC,GAAG,IAAI,CAAC,CAAA;IACnB,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAA;IAEd,MAAM,MAAM,GAAG,WAAW,CAAC,GAAG,EAAE;QAC9B,IAAI,UAAU,CAAC,OAAO,EAAE,CAAC;YACvB,YAAY,CAAC,UAAU,CAAC,OAAO,CAAC,CAAA;YAChC,UAAU,CAAC,OAAO,GAAG,IAAI,CAAA;QAC3B,CAAC;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,OAAO;QACL,QAAQ;QACR,KAAK;QACL,MAAM;KACP,CAAA;AACH,CAAC"}
|
package/dist/useDerivedRef.js
CHANGED
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.useDerivedRef = void 0;
|
|
4
|
-
const react_1 = require("react");
|
|
1
|
+
import { useEffect, useRef } from 'react';
|
|
5
2
|
/**
|
|
6
3
|
* Hook that creates a ref that automatically updates when a derived value changes.
|
|
7
4
|
*
|
|
@@ -9,12 +6,11 @@ const react_1 = require("react");
|
|
|
9
6
|
* const userNameRef = useDerivedRef(user, (u) => u.name)
|
|
10
7
|
* // userNameRef.current will always contain the latest user name
|
|
11
8
|
*/
|
|
12
|
-
const useDerivedRef = (derivedValue, getValue) => {
|
|
13
|
-
const ref =
|
|
14
|
-
|
|
9
|
+
export const useDerivedRef = (derivedValue, getValue) => {
|
|
10
|
+
const ref = useRef(getValue(derivedValue));
|
|
11
|
+
useEffect(() => {
|
|
15
12
|
ref.current = getValue(derivedValue);
|
|
16
13
|
}, [derivedValue]);
|
|
17
14
|
return ref;
|
|
18
15
|
};
|
|
19
|
-
exports.useDerivedRef = useDerivedRef;
|
|
20
16
|
//# sourceMappingURL=useDerivedRef.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDerivedRef.js","sourceRoot":"","sources":["../src/useDerivedRef.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useDerivedRef.js","sourceRoot":"","sources":["../src/useDerivedRef.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAEzC;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAC3B,YAAe,EACf,QAAgC,EACL,EAAE;IAC7B,MAAM,GAAG,GAAG,MAAM,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC,CAAA;IAE1C,SAAS,CAAC,GAAG,EAAE;QACb,GAAG,CAAC,OAAO,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAA;IACtC,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAA;IAElB,OAAO,GAAG,CAAA;AACZ,CAAC,CAAA"}
|
package/dist/useDerivedState.js
CHANGED
|
@@ -1,8 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
exports.useDerivedState = void 0;
|
|
4
|
-
const utils_1 = require("@codeleap/utils");
|
|
5
|
-
const react_1 = require("react");
|
|
1
|
+
import { deepEqual } from '@codeleap/utils';
|
|
2
|
+
import { useState, useEffect } from 'react';
|
|
6
3
|
/**
|
|
7
4
|
* Hook that creates a state that synchronizes with a derived value, with customizable equality check.
|
|
8
5
|
*
|
|
@@ -12,10 +9,10 @@ const react_1 = require("react");
|
|
|
12
9
|
* areEqual: (a, b) => a === b.id
|
|
13
10
|
* })
|
|
14
11
|
*/
|
|
15
|
-
const useDerivedState = (derivedValue, options = {}) => {
|
|
16
|
-
const { getValue = (value) => value, transform = (value) => value, areEqual = (currentState, derivedValue) =>
|
|
17
|
-
const [state, setState] =
|
|
18
|
-
|
|
12
|
+
export const useDerivedState = (derivedValue, options = {}) => {
|
|
13
|
+
const { getValue = (value) => value, transform = (value) => value, areEqual = (currentState, derivedValue) => deepEqual(currentState, derivedValue), } = options;
|
|
14
|
+
const [state, setState] = useState(() => getValue(derivedValue));
|
|
15
|
+
useEffect(() => {
|
|
19
16
|
const newValue = getValue(derivedValue);
|
|
20
17
|
const stateAreEqual = areEqual(transform(state), transform(derivedValue));
|
|
21
18
|
if (!stateAreEqual) {
|
|
@@ -24,5 +21,4 @@ const useDerivedState = (derivedValue, options = {}) => {
|
|
|
24
21
|
}, [derivedValue]);
|
|
25
22
|
return [state, setState];
|
|
26
23
|
};
|
|
27
|
-
exports.useDerivedState = useDerivedState;
|
|
28
24
|
//# sourceMappingURL=useDerivedState.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDerivedState.js","sourceRoot":"","sources":["../src/useDerivedState.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useDerivedState.js","sourceRoot":"","sources":["../src/useDerivedState.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAC3C,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAQ3C;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAC7B,YAAe,EACf,UAAyB,EAAE,EACmB,EAAE;IAChD,MAAM,EACJ,QAAQ,GAAG,CAAC,KAAU,EAAE,EAAE,CAAC,KAAU,EACrC,SAAS,GAAG,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,EAC5B,QAAQ,GAAG,CAAC,YAAY,EAAE,YAAY,EAAE,EAAE,CAAC,SAAS,CAAC,YAAY,EAAE,YAAY,CAAC,GACjF,GAAG,OAAO,CAAA;IAEX,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAI,GAAG,EAAE,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC,CAAA;IAEnE,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,QAAQ,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAA;QAEvC,MAAM,aAAa,GAAG,QAAQ,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC,CAAA;QAEzE,IAAI,CAAC,aAAa,EAAE,CAAC;YACnB,QAAQ,CAAC,QAAQ,CAAC,CAAA;QACpB,CAAC;IACH,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAA;IAElB,OAAO,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAA;AAC1B,CAAC,CAAA"}
|
package/dist/useEffectOnce.js
CHANGED
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.useEffectOnce = void 0;
|
|
4
|
-
const react_1 = require("react");
|
|
1
|
+
import { useEffect } from 'react';
|
|
5
2
|
/**
|
|
6
3
|
* Hook that runs an effect only once when the component mounts.
|
|
7
4
|
*
|
|
@@ -11,8 +8,7 @@ const react_1 = require("react");
|
|
|
11
8
|
* return () => console.log('Cleanup on unmount')
|
|
12
9
|
* })
|
|
13
10
|
*/
|
|
14
|
-
const useEffectOnce = (effect) => {
|
|
15
|
-
|
|
11
|
+
export const useEffectOnce = (effect) => {
|
|
12
|
+
useEffect(effect, []);
|
|
16
13
|
};
|
|
17
|
-
exports.useEffectOnce = useEffectOnce;
|
|
18
14
|
//# sourceMappingURL=useEffectOnce.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useEffectOnce.js","sourceRoot":"","sources":["../src/useEffectOnce.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useEffectOnce.js","sourceRoot":"","sources":["../src/useEffectOnce.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjD;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,MAAsB,EAAE,EAAE;IACtD,SAAS,CAAC,MAAM,EAAE,EAAE,CAAC,CAAA;AACvB,CAAC,CAAA"}
|
package/dist/useFilteredList.js
CHANGED
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.useFilteredList = useFilteredList;
|
|
4
|
-
const react_1 = require("react");
|
|
1
|
+
import { useMemo } from 'react';
|
|
5
2
|
/**
|
|
6
3
|
* Hook that filters out the first item from a list that matches a predicate.
|
|
7
4
|
*
|
|
@@ -9,8 +6,8 @@ const react_1 = require("react");
|
|
|
9
6
|
* const filteredUsers = useFilteredList(users, (user) => user.id === deletedId)
|
|
10
7
|
* // Returns users array without the first user matching the predicate
|
|
11
8
|
*/
|
|
12
|
-
function useFilteredList(list, predicate) {
|
|
13
|
-
return
|
|
9
|
+
export function useFilteredList(list, predicate) {
|
|
10
|
+
return useMemo(() => {
|
|
14
11
|
if (!list)
|
|
15
12
|
return [];
|
|
16
13
|
const index = list.findIndex(predicate);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useFilteredList.js","sourceRoot":"","sources":["../src/useFilteredList.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useFilteredList.js","sourceRoot":"","sources":["../src/useFilteredList.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAE/B;;;;;;GAMG;AACH,MAAM,UAAU,eAAe,CAAI,IAAS,EAAE,SAA+B;IAC3E,OAAO,OAAO,CAAC,GAAG,EAAE;QAClB,IAAI,CAAC,IAAI;YAAE,OAAO,EAAE,CAAA;QAEpB,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAA;QACvC,IAAI,KAAK,KAAK,CAAC,CAAC;YAAE,OAAO,IAAI,CAAA;QAE7B,MAAM,OAAO,GAAG,CAAC,GAAG,IAAI,CAAC,CAAA;QACzB,OAAO,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAA;QACxB,OAAO,OAAO,CAAA;IAChB,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,CAAA;AACvB,CAAC"}
|
package/dist/useForceRender.js
CHANGED
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.useForceRender = useForceRender;
|
|
4
|
-
const react_1 = require("react");
|
|
1
|
+
import { useReducer } from 'react';
|
|
5
2
|
/**
|
|
6
3
|
* Hook that returns a function to force a component re-render.
|
|
7
4
|
*
|
|
@@ -9,8 +6,8 @@ const react_1 = require("react");
|
|
|
9
6
|
* const forceRender = useForceRender()
|
|
10
7
|
* forceRender() // Forces component to re-render
|
|
11
8
|
*/
|
|
12
|
-
function useForceRender() {
|
|
13
|
-
const [_, forceRender] =
|
|
9
|
+
export function useForceRender() {
|
|
10
|
+
const [_, forceRender] = useReducer((x) => x + 1, 0);
|
|
14
11
|
return forceRender;
|
|
15
12
|
}
|
|
16
13
|
//# sourceMappingURL=useForceRender.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useForceRender.js","sourceRoot":"","sources":["../src/useForceRender.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useForceRender.js","sourceRoot":"","sources":["../src/useForceRender.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAElC;;;;;;GAMG;AACH,MAAM,UAAU,cAAc;IAC5B,MAAM,CAAC,CAAC,EAAE,WAAW,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAA;IACpD,OAAO,WAAW,CAAA;AACpB,CAAC"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { type DependencyList } from "react";
|
|
2
|
+
export type GuardedResult<T> = {
|
|
3
|
+
dropped: true;
|
|
4
|
+
} | {
|
|
5
|
+
dropped: false;
|
|
6
|
+
result: T;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Returns a stable callback that silently drops invocations while a previous
|
|
10
|
+
* call is still in flight, preventing overlapping async executions.
|
|
11
|
+
*
|
|
12
|
+
* @typeParam T - The resolved return type of the async callback.
|
|
13
|
+
* @param cb - The async function to guard. Only one instance runs at a time.
|
|
14
|
+
* @param deps - Dependency list, same semantics as `useCallback`.
|
|
15
|
+
* @returns A callback that resolves to `{ dropped: true }` if a call was
|
|
16
|
+
* already in progress, or `{ dropped: false, result: T }` on completion.
|
|
17
|
+
*
|
|
18
|
+
* @example
|
|
19
|
+
* ```tsx
|
|
20
|
+
* const save = useGuardedAsyncCallback(async () => {
|
|
21
|
+
* return await api.saveForm(formData);
|
|
22
|
+
* }, [formData]);
|
|
23
|
+
*
|
|
24
|
+
* const handleClick = async () => {
|
|
25
|
+
* const res = await save();
|
|
26
|
+
* if (!res.dropped) showToast("Saved!");
|
|
27
|
+
* };
|
|
28
|
+
* ```
|
|
29
|
+
*/
|
|
30
|
+
export declare function useGuardedAsyncCallback<T>(cb: () => Promise<T>, deps: DependencyList): () => Promise<GuardedResult<T>>;
|
|
31
|
+
//# sourceMappingURL=useGuardedAsyncCallback.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useGuardedAsyncCallback.d.ts","sourceRoot":"","sources":["../src/useGuardedAsyncCallback.ts"],"names":[],"mappings":"AAAA,OAAO,EAAuB,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAEjE,MAAM,MAAM,aAAa,CAAC,CAAC,IAAI;IAAE,OAAO,EAAE,IAAI,CAAA;CAAE,GAAG;IAAE,OAAO,EAAE,KAAK,CAAC;IAAC,MAAM,EAAE,CAAC,CAAA;CAAE,CAAC;AAEjF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,uBAAuB,CAAC,CAAC,EACvC,EAAE,EAAE,MAAM,OAAO,CAAC,CAAC,CAAC,EACpB,IAAI,EAAE,cAAc,GACnB,MAAM,OAAO,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAajC"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { useCallback, useRef } from "react";
|
|
2
|
+
/**
|
|
3
|
+
* Returns a stable callback that silently drops invocations while a previous
|
|
4
|
+
* call is still in flight, preventing overlapping async executions.
|
|
5
|
+
*
|
|
6
|
+
* @typeParam T - The resolved return type of the async callback.
|
|
7
|
+
* @param cb - The async function to guard. Only one instance runs at a time.
|
|
8
|
+
* @param deps - Dependency list, same semantics as `useCallback`.
|
|
9
|
+
* @returns A callback that resolves to `{ dropped: true }` if a call was
|
|
10
|
+
* already in progress, or `{ dropped: false, result: T }` on completion.
|
|
11
|
+
*
|
|
12
|
+
* @example
|
|
13
|
+
* ```tsx
|
|
14
|
+
* const save = useGuardedAsyncCallback(async () => {
|
|
15
|
+
* return await api.saveForm(formData);
|
|
16
|
+
* }, [formData]);
|
|
17
|
+
*
|
|
18
|
+
* const handleClick = async () => {
|
|
19
|
+
* const res = await save();
|
|
20
|
+
* if (!res.dropped) showToast("Saved!");
|
|
21
|
+
* };
|
|
22
|
+
* ```
|
|
23
|
+
*/
|
|
24
|
+
export function useGuardedAsyncCallback(cb, deps) {
|
|
25
|
+
const running = useRef(false);
|
|
26
|
+
return useCallback(async () => {
|
|
27
|
+
if (running.current)
|
|
28
|
+
return { dropped: true };
|
|
29
|
+
running.current = true;
|
|
30
|
+
try {
|
|
31
|
+
return { dropped: false, result: await cb() };
|
|
32
|
+
}
|
|
33
|
+
finally {
|
|
34
|
+
running.current = false;
|
|
35
|
+
}
|
|
36
|
+
}, deps);
|
|
37
|
+
}
|
|
38
|
+
//# sourceMappingURL=useGuardedAsyncCallback.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useGuardedAsyncCallback.js","sourceRoot":"","sources":["../src/useGuardedAsyncCallback.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,EAAuB,MAAM,OAAO,CAAC;AAIjE;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,UAAU,uBAAuB,CACrC,EAAoB,EACpB,IAAoB;IAEpB,MAAM,OAAO,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAE9B,OAAO,WAAW,CAAC,KAAK,IAAI,EAAE;QAC5B,IAAI,OAAO,CAAC,OAAO;YAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;QAE9C,OAAO,CAAC,OAAO,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC;YACH,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC;QAChD,CAAC;gBAAS,CAAC;YACT,OAAO,CAAC,OAAO,GAAG,KAAK,CAAC;QAC1B,CAAC;IACH,CAAC,EAAE,IAAI,CAAC,CAAC;AACX,CAAC"}
|