@contember/react-utils 1.2.3 → 1.3.0-alpha.10
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/development/context/createNonNullableContextFactory.cjs +17 -0
- package/dist/development/context/createNonNullableContextFactory.cjs.map +1 -0
- package/dist/development/context/createNonNullableContextFactory.js.map +1 -1
- package/dist/development/context/createOptionalContextFactory.cjs +13 -0
- package/dist/development/context/createOptionalContextFactory.cjs.map +1 -0
- package/dist/development/debug-context/Constants.cjs +25 -0
- package/dist/development/debug-context/Constants.cjs.map +1 -0
- package/dist/development/debug-context/Context.cjs +72 -0
- package/dist/development/debug-context/Context.cjs.map +1 -0
- package/dist/development/debug-context/Context.js +4 -3
- package/dist/development/debug-context/Context.js.map +1 -1
- package/dist/development/hooks/unwrapRefValue.cjs +11 -0
- package/dist/development/hooks/unwrapRefValue.cjs.map +1 -0
- package/dist/development/hooks/useAbortController.cjs +17 -0
- package/dist/development/hooks/useAbortController.cjs.map +1 -0
- package/dist/development/hooks/useAddClassNameDuringResize.cjs +32 -0
- package/dist/development/hooks/useAddClassNameDuringResize.cjs.map +1 -0
- package/dist/development/hooks/useArrayMapMemo.cjs +11 -0
- package/dist/development/hooks/useArrayMapMemo.cjs.map +1 -0
- package/dist/development/hooks/useAutoHeightTextArea.cjs +41 -0
- package/dist/development/hooks/useAutoHeightTextArea.cjs.map +1 -0
- package/dist/development/hooks/useChildrenAsLabel.cjs +53 -0
- package/dist/development/hooks/useChildrenAsLabel.cjs.map +1 -0
- package/dist/development/hooks/useCloseOnClickOutside.cjs +25 -0
- package/dist/development/hooks/useCloseOnClickOutside.cjs.map +1 -0
- package/dist/development/hooks/useCloseOnClickOutside.js +25 -0
- package/dist/development/hooks/useCloseOnClickOutside.js.map +1 -0
- package/dist/development/hooks/useCloseOnEscape.cjs +20 -0
- package/dist/development/hooks/useCloseOnEscape.cjs.map +1 -0
- package/dist/development/hooks/useCloseOnEscape.js +20 -0
- package/dist/development/hooks/useCloseOnEscape.js.map +1 -0
- package/dist/development/hooks/useComposeRef.cjs +31 -0
- package/dist/development/hooks/useComposeRef.cjs.map +1 -0
- package/dist/development/hooks/useConstantLengthInvariant.cjs +15 -0
- package/dist/development/hooks/useConstantLengthInvariant.cjs.map +1 -0
- package/dist/development/hooks/useConstantLengthInvariant.js.map +1 -1
- package/dist/development/hooks/useConstantValueInvariant.cjs +15 -0
- package/dist/development/hooks/useConstantValueInvariant.cjs.map +1 -0
- package/dist/development/hooks/useConstantValueInvariant.js.map +1 -1
- package/dist/development/hooks/useContainerWidth.cjs +14 -0
- package/dist/development/hooks/useContainerWidth.cjs.map +1 -0
- package/dist/development/hooks/useDebounce.cjs +15 -0
- package/dist/development/hooks/useDebounce.cjs.map +1 -0
- package/dist/development/hooks/useDebounceCallback.cjs +19 -0
- package/dist/development/hooks/useDebounceCallback.cjs.map +1 -0
- package/dist/development/hooks/useDocumentTitle.cjs +22 -0
- package/dist/development/hooks/useDocumentTitle.cjs.map +1 -0
- package/dist/development/hooks/useElementSize.cjs +37 -0
- package/dist/development/hooks/useElementSize.cjs.map +1 -0
- package/dist/development/hooks/useElementTopOffset.cjs +29 -0
- package/dist/development/hooks/useElementTopOffset.cjs.map +1 -0
- package/dist/development/hooks/useEventHandler.cjs +19 -0
- package/dist/development/hooks/useEventHandler.cjs.map +1 -0
- package/dist/development/hooks/useExpectSameValueReference.cjs +24 -0
- package/dist/development/hooks/useExpectSameValueReference.cjs.map +1 -0
- package/dist/development/hooks/useForceRender.cjs +9 -0
- package/dist/development/hooks/useForceRender.cjs.map +1 -0
- package/dist/development/hooks/useId.cjs +13 -0
- package/dist/development/hooks/useId.cjs.map +1 -0
- package/dist/development/hooks/useId.js.map +1 -1
- package/dist/development/hooks/useIsMounted.cjs +18 -0
- package/dist/development/hooks/useIsMounted.cjs.map +1 -0
- package/dist/development/hooks/useObjectMemo.cjs +27 -0
- package/dist/development/hooks/useObjectMemo.cjs.map +1 -0
- package/dist/development/hooks/useOnElementClickOutsideCallback.cjs +20 -0
- package/dist/development/hooks/useOnElementClickOutsideCallback.cjs.map +1 -0
- package/dist/development/hooks/useOnElementMouseEnterDelayedCallback.cjs +33 -0
- package/dist/development/hooks/useOnElementMouseEnterDelayedCallback.cjs.map +1 -0
- package/dist/development/hooks/useOnElementMutation.cjs +35 -0
- package/dist/development/hooks/useOnElementMutation.cjs.map +1 -0
- package/dist/development/hooks/useOnElementResize.cjs +42 -0
- package/dist/development/hooks/useOnElementResize.cjs.map +1 -0
- package/dist/development/hooks/useOnScrollWithin.cjs +52 -0
- package/dist/development/hooks/useOnScrollWithin.cjs.map +1 -0
- package/dist/development/hooks/useOnWindowResize.cjs +36 -0
- package/dist/development/hooks/useOnWindowResize.cjs.map +1 -0
- package/dist/development/hooks/usePreviousValue.cjs +12 -0
- package/dist/development/hooks/usePreviousValue.cjs.map +1 -0
- package/dist/development/hooks/useScrollOffsets.cjs +67 -0
- package/dist/development/hooks/useScrollOffsets.cjs.map +1 -0
- package/dist/development/hooks/useStoredState.cjs +23 -0
- package/dist/development/hooks/useStoredState.cjs.map +1 -0
- package/dist/development/hooks/useUpdatedRef.cjs +10 -0
- package/dist/development/hooks/useUpdatedRef.cjs.map +1 -0
- package/dist/development/hooks/useWindowSize.cjs +20 -0
- package/dist/development/hooks/useWindowSize.cjs.map +1 -0
- package/dist/development/index.cjs +116 -0
- package/dist/development/index.cjs.map +1 -0
- package/dist/development/index.js +4 -0
- package/dist/development/index.js.map +1 -1
- package/dist/development/referentiallyStable/emptyArray.cjs +5 -0
- package/dist/development/referentiallyStable/emptyArray.cjs.map +1 -0
- package/dist/development/referentiallyStable/emptyObject.cjs +5 -0
- package/dist/development/referentiallyStable/emptyObject.cjs.map +1 -0
- package/dist/development/referentiallyStable/identityFunction.cjs +5 -0
- package/dist/development/referentiallyStable/identityFunction.cjs.map +1 -0
- package/dist/development/referentiallyStable/noop.cjs +5 -0
- package/dist/development/referentiallyStable/noop.cjs.map +1 -0
- package/dist/development/referentiallyStable/returnFalse.cjs +5 -0
- package/dist/development/referentiallyStable/returnFalse.cjs.map +1 -0
- package/dist/development/referentiallyStable/returnTrue.cjs +5 -0
- package/dist/development/referentiallyStable/returnTrue.cjs.map +1 -0
- package/dist/development/referentiallyStable/useReferentiallyStableCallback.cjs +12 -0
- package/dist/development/referentiallyStable/useReferentiallyStableCallback.cjs.map +1 -0
- package/dist/development/theming/ColorSchemeProvider.cjs +16 -0
- package/dist/development/theming/ColorSchemeProvider.cjs.map +1 -0
- package/dist/development/theming/ColorSchemeProvider.js +8 -10
- package/dist/development/theming/ColorSchemeProvider.js.map +1 -1
- package/dist/development/theming/GlobalClassNamePrefixContext.cjs +6 -0
- package/dist/development/theming/GlobalClassNamePrefixContext.cjs.map +1 -0
- package/dist/development/theming/contexts.cjs +12 -0
- package/dist/development/theming/contexts.cjs.map +1 -0
- package/dist/development/theming/useClassName.cjs +17 -0
- package/dist/development/theming/useClassName.cjs.map +1 -0
- package/dist/development/theming/useClassName.js.map +1 -1
- package/dist/development/theming/useClassNameFactory.cjs +22 -0
- package/dist/development/theming/useClassNameFactory.cjs.map +1 -0
- package/dist/development/theming/useClassNameFactory.js.map +1 -1
- package/dist/development/theming/useThemedClassName.cjs +17 -0
- package/dist/development/theming/useThemedClassName.cjs.map +1 -0
- package/dist/development/theming/useThemedClassNameFactory.cjs +29 -0
- package/dist/development/theming/useThemedClassNameFactory.cjs.map +1 -0
- package/dist/development/theming/useThemedClassNameFactory.js.map +1 -1
- package/dist/production/context/createNonNullableContextFactory.cjs +17 -0
- package/dist/production/context/createNonNullableContextFactory.cjs.map +1 -0
- package/dist/production/context/createNonNullableContextFactory.js.map +1 -1
- package/dist/production/context/createOptionalContextFactory.cjs +13 -0
- package/dist/production/context/createOptionalContextFactory.cjs.map +1 -0
- package/dist/production/debug-context/Constants.cjs +25 -0
- package/dist/production/debug-context/Constants.cjs.map +1 -0
- package/dist/production/debug-context/Context.cjs +68 -0
- package/dist/production/debug-context/Context.cjs.map +1 -0
- package/dist/production/debug-context/Context.js +3 -2
- package/dist/production/debug-context/Context.js.map +1 -1
- package/dist/production/hooks/unwrapRefValue.cjs +11 -0
- package/dist/production/hooks/unwrapRefValue.cjs.map +1 -0
- package/dist/production/hooks/useAbortController.cjs +17 -0
- package/dist/production/hooks/useAbortController.cjs.map +1 -0
- package/dist/production/hooks/useAddClassNameDuringResize.cjs +32 -0
- package/dist/production/hooks/useAddClassNameDuringResize.cjs.map +1 -0
- package/dist/production/hooks/useArrayMapMemo.cjs +9 -0
- package/dist/production/hooks/useArrayMapMemo.cjs.map +1 -0
- package/dist/production/hooks/useAutoHeightTextArea.cjs +41 -0
- package/dist/production/hooks/useAutoHeightTextArea.cjs.map +1 -0
- package/dist/production/hooks/useChildrenAsLabel.cjs +52 -0
- package/dist/production/hooks/useChildrenAsLabel.cjs.map +1 -0
- package/dist/production/hooks/useChildrenAsLabel.js.map +1 -1
- package/dist/production/hooks/useCloseOnClickOutside.cjs +25 -0
- package/dist/production/hooks/useCloseOnClickOutside.cjs.map +1 -0
- package/dist/production/hooks/useCloseOnClickOutside.js +25 -0
- package/dist/production/hooks/useCloseOnClickOutside.js.map +1 -0
- package/dist/production/hooks/useCloseOnEscape.cjs +20 -0
- package/dist/production/hooks/useCloseOnEscape.cjs.map +1 -0
- package/dist/production/hooks/useCloseOnEscape.js +20 -0
- package/dist/production/hooks/useCloseOnEscape.js.map +1 -0
- package/dist/production/hooks/useComposeRef.cjs +31 -0
- package/dist/production/hooks/useComposeRef.cjs.map +1 -0
- package/dist/production/hooks/useConstantLengthInvariant.cjs +6 -0
- package/dist/production/hooks/useConstantLengthInvariant.cjs.map +1 -0
- package/dist/production/hooks/useConstantValueInvariant.cjs +6 -0
- package/dist/production/hooks/useConstantValueInvariant.cjs.map +1 -0
- package/dist/production/hooks/useContainerWidth.cjs +14 -0
- package/dist/production/hooks/useContainerWidth.cjs.map +1 -0
- package/dist/production/hooks/useDebounce.cjs +15 -0
- package/dist/production/hooks/useDebounce.cjs.map +1 -0
- package/dist/production/hooks/useDebounceCallback.cjs +19 -0
- package/dist/production/hooks/useDebounceCallback.cjs.map +1 -0
- package/dist/production/hooks/useDocumentTitle.cjs +22 -0
- package/dist/production/hooks/useDocumentTitle.cjs.map +1 -0
- package/dist/production/hooks/useElementSize.cjs +37 -0
- package/dist/production/hooks/useElementSize.cjs.map +1 -0
- package/dist/production/hooks/useElementTopOffset.cjs +29 -0
- package/dist/production/hooks/useElementTopOffset.cjs.map +1 -0
- package/dist/production/hooks/useEventHandler.cjs +19 -0
- package/dist/production/hooks/useEventHandler.cjs.map +1 -0
- package/dist/production/hooks/useExpectSameValueReference.cjs +15 -0
- package/dist/production/hooks/useExpectSameValueReference.cjs.map +1 -0
- package/dist/production/hooks/useForceRender.cjs +9 -0
- package/dist/production/hooks/useForceRender.cjs.map +1 -0
- package/dist/production/hooks/useId.cjs +13 -0
- package/dist/production/hooks/useId.cjs.map +1 -0
- package/dist/production/hooks/useId.js.map +1 -1
- package/dist/production/hooks/useIsMounted.cjs +18 -0
- package/dist/production/hooks/useIsMounted.cjs.map +1 -0
- package/dist/production/hooks/useObjectMemo.cjs +27 -0
- package/dist/production/hooks/useObjectMemo.cjs.map +1 -0
- package/dist/production/hooks/useOnElementClickOutsideCallback.cjs +20 -0
- package/dist/production/hooks/useOnElementClickOutsideCallback.cjs.map +1 -0
- package/dist/production/hooks/useOnElementMouseEnterDelayedCallback.cjs +33 -0
- package/dist/production/hooks/useOnElementMouseEnterDelayedCallback.cjs.map +1 -0
- package/dist/production/hooks/useOnElementMutation.cjs +35 -0
- package/dist/production/hooks/useOnElementMutation.cjs.map +1 -0
- package/dist/production/hooks/useOnElementResize.cjs +42 -0
- package/dist/production/hooks/useOnElementResize.cjs.map +1 -0
- package/dist/production/hooks/useOnScrollWithin.cjs +52 -0
- package/dist/production/hooks/useOnScrollWithin.cjs.map +1 -0
- package/dist/production/hooks/useOnWindowResize.cjs +36 -0
- package/dist/production/hooks/useOnWindowResize.cjs.map +1 -0
- package/dist/production/hooks/usePreviousValue.cjs +12 -0
- package/dist/production/hooks/usePreviousValue.cjs.map +1 -0
- package/dist/production/hooks/useScrollOffsets.cjs +67 -0
- package/dist/production/hooks/useScrollOffsets.cjs.map +1 -0
- package/dist/production/hooks/useStoredState.cjs +23 -0
- package/dist/production/hooks/useStoredState.cjs.map +1 -0
- package/dist/production/hooks/useUpdatedRef.cjs +10 -0
- package/dist/production/hooks/useUpdatedRef.cjs.map +1 -0
- package/dist/production/hooks/useWindowSize.cjs +20 -0
- package/dist/production/hooks/useWindowSize.cjs.map +1 -0
- package/dist/production/index.cjs +116 -0
- package/dist/production/index.cjs.map +1 -0
- package/dist/production/index.js +4 -0
- package/dist/production/index.js.map +1 -1
- package/dist/production/referentiallyStable/emptyArray.cjs +5 -0
- package/dist/production/referentiallyStable/emptyArray.cjs.map +1 -0
- package/dist/production/referentiallyStable/emptyObject.cjs +5 -0
- package/dist/production/referentiallyStable/emptyObject.cjs.map +1 -0
- package/dist/production/referentiallyStable/identityFunction.cjs +5 -0
- package/dist/production/referentiallyStable/identityFunction.cjs.map +1 -0
- package/dist/production/referentiallyStable/noop.cjs +5 -0
- package/dist/production/referentiallyStable/noop.cjs.map +1 -0
- package/dist/production/referentiallyStable/returnFalse.cjs +5 -0
- package/dist/production/referentiallyStable/returnFalse.cjs.map +1 -0
- package/dist/production/referentiallyStable/returnTrue.cjs +5 -0
- package/dist/production/referentiallyStable/returnTrue.cjs.map +1 -0
- package/dist/production/referentiallyStable/useReferentiallyStableCallback.cjs +12 -0
- package/dist/production/referentiallyStable/useReferentiallyStableCallback.cjs.map +1 -0
- package/dist/production/theming/ColorSchemeProvider.cjs +12 -0
- package/dist/production/theming/ColorSchemeProvider.cjs.map +1 -0
- package/dist/production/theming/ColorSchemeProvider.js +4 -6
- package/dist/production/theming/ColorSchemeProvider.js.map +1 -1
- package/dist/production/theming/GlobalClassNamePrefixContext.cjs +6 -0
- package/dist/production/theming/GlobalClassNamePrefixContext.cjs.map +1 -0
- package/dist/production/theming/contexts.cjs +12 -0
- package/dist/production/theming/contexts.cjs.map +1 -0
- package/dist/production/theming/useClassName.cjs +17 -0
- package/dist/production/theming/useClassName.cjs.map +1 -0
- package/dist/production/theming/useClassName.js.map +1 -1
- package/dist/production/theming/useClassNameFactory.cjs +22 -0
- package/dist/production/theming/useClassNameFactory.cjs.map +1 -0
- package/dist/production/theming/useClassNameFactory.js.map +1 -1
- package/dist/production/theming/useThemedClassName.cjs +17 -0
- package/dist/production/theming/useThemedClassName.cjs.map +1 -0
- package/dist/production/theming/useThemedClassNameFactory.cjs +29 -0
- package/dist/production/theming/useThemedClassNameFactory.cjs.map +1 -0
- package/dist/production/theming/useThemedClassNameFactory.js.map +1 -1
- package/dist/types/debug-context/Context.d.ts.map +1 -1
- package/dist/types/hooks/index.d.ts +2 -0
- package/dist/types/hooks/index.d.ts.map +1 -1
- package/dist/types/hooks/useCloseOnClickOutside.d.ts +7 -0
- package/dist/types/hooks/useCloseOnClickOutside.d.ts.map +1 -0
- package/dist/types/hooks/useCloseOnEscape.d.ts +5 -0
- package/dist/types/hooks/useCloseOnEscape.d.ts.map +1 -0
- package/dist/types/theming/ColorSchemeProvider.d.ts +3 -4
- package/dist/types/theming/ColorSchemeProvider.d.ts.map +1 -1
- package/dist/types/tsconfig.tsbuildinfo +1 -1
- package/package.json +10 -3
- package/src/debug-context/Context.tsx +3 -3
- package/src/hooks/index.ts +2 -0
- package/src/hooks/useCloseOnClickOutside.ts +27 -0
- package/src/hooks/useCloseOnEscape.ts +18 -0
- package/src/theming/ColorSchemeProvider.tsx +8 -11
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useConstantLengthInvariant.js","sources":["../../../src/hooks/useConstantLengthInvariant.ts"],"sourcesContent":["import { usePreviousValue } from './usePreviousValue'\n\n// This entire hook should get optimized away for prod\nexport const useConstantLengthInvariant = <Item>(items: Item[], message?: string) => {\n\tif (import.meta.env.DEV) {\n\t\t// eslint-disable-next-line react-hooks/rules-of-hooks\n\t\tconst previous = usePreviousValue(items)\n\t\tif (previous.length !== items.length) {\n\t\t\tthrow new Error(\n\t\t\t\t`Invariant violation: ${message || 'Changing the length of an array whose length must remain constant between renders.'\n\t\t\t\t}`,\n\t\t\t)\n\t\t}\n\t}\n}\n"],"names":[],"mappings":";AAGa,MAAA,6BAA6B,CAAO,OAAe,YAAqB;AAC3D;AAElB,UAAA,WAAW,iBAAiB,KAAK;AACnC,QAAA,SAAS,WAAW,MAAM,QAAQ;AACrC,YAAM,IAAI;AAAA,QACT,wBAAwB,WAAW;AAAA,MAAA;AAAA,
|
|
1
|
+
{"version":3,"file":"useConstantLengthInvariant.js","sources":["../../../src/hooks/useConstantLengthInvariant.ts"],"sourcesContent":["import { usePreviousValue } from './usePreviousValue'\n\n// This entire hook should get optimized away for prod\nexport const useConstantLengthInvariant = <Item>(items: Item[], message?: string) => {\n\tif (import.meta.env.DEV) {\n\t\t// eslint-disable-next-line react-hooks/rules-of-hooks\n\t\tconst previous = usePreviousValue(items)\n\t\tif (previous.length !== items.length) {\n\t\t\tthrow new Error(\n\t\t\t\t`Invariant violation: ${message || 'Changing the length of an array whose length must remain constant between renders.'\n\t\t\t\t}`,\n\t\t\t)\n\t\t}\n\t}\n}\n"],"names":[],"mappings":";AAGa,MAAA,6BAA6B,CAAO,OAAe,YAAqB;AAC3D;AAElB,UAAA,WAAW,iBAAiB,KAAK;AACnC,QAAA,SAAS,WAAW,MAAM,QAAQ;AACrC,YAAM,IAAI;AAAA,QACT,wBAAwB,WAAW,oFACnC;AAAA,MAAA;AAAA,IAEF;AAAA,EACD;AACD;"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const usePreviousValue = require("./usePreviousValue.cjs");
|
|
4
|
+
const useConstantValueInvariant = (value, message) => {
|
|
5
|
+
{
|
|
6
|
+
const previous = usePreviousValue.usePreviousValue(value);
|
|
7
|
+
if (previous !== value) {
|
|
8
|
+
throw new Error(
|
|
9
|
+
`Invariant violation: ${message || "Changing a value which must remain constant between renders."}`
|
|
10
|
+
);
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
};
|
|
14
|
+
exports.useConstantValueInvariant = useConstantValueInvariant;
|
|
15
|
+
//# sourceMappingURL=useConstantValueInvariant.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useConstantValueInvariant.cjs","sources":["../../../src/hooks/useConstantValueInvariant.ts"],"sourcesContent":["import { usePreviousValue } from './usePreviousValue'\n\n// This entire hook should get optimized away for prod\nexport const useConstantValueInvariant = <Value>(value: Value, message?: string) => {\n\tif (import.meta.env.DEV) {\n\t\t// eslint-disable-next-line react-hooks/rules-of-hooks\n\t\tconst previous = usePreviousValue(value)\n\t\tif (previous !== value) {\n\t\t\tthrow new Error(\n\t\t\t\t`Invariant violation: ${message || 'Changing a value which must remain constant between renders.'}`,\n\t\t\t)\n\t\t}\n\t}\n}\n"],"names":["usePreviousValue"],"mappings":";;;AAGa,MAAA,4BAA4B,CAAQ,OAAc,YAAqB;AAC1D;AAElB,UAAA,WAAWA,kCAAiB,KAAK;AACvC,QAAI,aAAa,OAAO;AACvB,YAAM,IAAI;AAAA,QACT,wBAAwB,WAAW,8DAA8D;AAAA,MAAA;AAAA,IAEnG;AAAA,EACD;AACD;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useConstantValueInvariant.js","sources":["../../../src/hooks/useConstantValueInvariant.ts"],"sourcesContent":["import { usePreviousValue } from './usePreviousValue'\n\n// This entire hook should get optimized away for prod\nexport const useConstantValueInvariant = <Value>(value: Value, message?: string) => {\n\tif (import.meta.env.DEV) {\n\t\t// eslint-disable-next-line react-hooks/rules-of-hooks\n\t\tconst previous = usePreviousValue(value)\n\t\tif (previous !== value) {\n\t\t\tthrow new Error(\n\t\t\t\t`Invariant violation: ${message || 'Changing a value which must remain constant between renders.'}`,\n\t\t\t)\n\t\t}\n\t}\n}\n"],"names":[],"mappings":";AAGa,MAAA,4BAA4B,CAAQ,OAAc,YAAqB;AAC1D;AAElB,UAAA,WAAW,iBAAiB,KAAK;AACvC,QAAI,aAAa,OAAO;AACvB,YAAM,IAAI;AAAA,QACT,wBAAwB,WAAW;AAAA,MAAA;AAAA,
|
|
1
|
+
{"version":3,"file":"useConstantValueInvariant.js","sources":["../../../src/hooks/useConstantValueInvariant.ts"],"sourcesContent":["import { usePreviousValue } from './usePreviousValue'\n\n// This entire hook should get optimized away for prod\nexport const useConstantValueInvariant = <Value>(value: Value, message?: string) => {\n\tif (import.meta.env.DEV) {\n\t\t// eslint-disable-next-line react-hooks/rules-of-hooks\n\t\tconst previous = usePreviousValue(value)\n\t\tif (previous !== value) {\n\t\t\tthrow new Error(\n\t\t\t\t`Invariant violation: ${message || 'Changing a value which must remain constant between renders.'}`,\n\t\t\t)\n\t\t}\n\t}\n}\n"],"names":[],"mappings":";AAGa,MAAA,4BAA4B,CAAQ,OAAc,YAAqB;AAC1D;AAElB,UAAA,WAAW,iBAAiB,KAAK;AACvC,QAAI,aAAa,OAAO;AACvB,YAAM,IAAI;AAAA,QACT,wBAAwB,WAAW,8DAA8D;AAAA,MAAA;AAAA,IAEnG;AAAA,EACD;AACD;"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const react = require("react");
|
|
4
|
+
const useWindowSize = require("./useWindowSize.cjs");
|
|
5
|
+
const ContainerWidthContext = react.createContext(void 0);
|
|
6
|
+
ContainerWidthContext.displayName = "ContainerWidthContext";
|
|
7
|
+
function useContainerWidth() {
|
|
8
|
+
const maybeContainerWidth = react.useContext(ContainerWidthContext);
|
|
9
|
+
const { width: windowWidth } = useWindowSize.useWindowSize();
|
|
10
|
+
return maybeContainerWidth ?? windowWidth;
|
|
11
|
+
}
|
|
12
|
+
exports.ContainerWidthContext = ContainerWidthContext;
|
|
13
|
+
exports.useContainerWidth = useContainerWidth;
|
|
14
|
+
//# sourceMappingURL=useContainerWidth.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useContainerWidth.cjs","sources":["../../../src/hooks/useContainerWidth.ts"],"sourcesContent":["import { createContext, useContext } from 'react'\nimport { useWindowSize } from './useWindowSize'\n\nexport type ContainerWidthContextType = number\nexport const ContainerWidthContext = createContext<ContainerWidthContextType | null | undefined>(undefined)\nContainerWidthContext.displayName = 'ContainerWidthContext'\n\nexport function useContainerWidth(): number {\n\tconst maybeContainerWidth = useContext(ContainerWidthContext)\n\tconst { width: windowWidth } = useWindowSize()\n\n\treturn maybeContainerWidth ?? windowWidth\n}\n"],"names":["createContext","useContext","useWindowSize"],"mappings":";;;;AAIa,MAAA,wBAAwBA,MAAAA,cAA4D,MAAS;AAC1G,sBAAsB,cAAc;AAE7B,SAAS,oBAA4B;AACrC,QAAA,sBAAsBC,iBAAW,qBAAqB;AAC5D,QAAM,EAAE,OAAO,YAAY,IAAIC,cAAc,cAAA;AAE7C,SAAO,uBAAuB;AAC/B;;;"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const react = require("react");
|
|
4
|
+
const useDebounce = (value, debounceMs) => {
|
|
5
|
+
const [debounced, setDebounced] = react.useState(value);
|
|
6
|
+
react.useEffect(() => {
|
|
7
|
+
const handle = window.setTimeout(() => setDebounced(value), debounceMs);
|
|
8
|
+
return () => {
|
|
9
|
+
window.clearTimeout(handle);
|
|
10
|
+
};
|
|
11
|
+
}, [value, debounceMs]);
|
|
12
|
+
return debounced;
|
|
13
|
+
};
|
|
14
|
+
exports.useDebounce = useDebounce;
|
|
15
|
+
//# sourceMappingURL=useDebounce.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useDebounce.cjs","sources":["../../../src/hooks/useDebounce.ts"],"sourcesContent":["import { useEffect, useState } from 'react'\n\nexport const useDebounce = <T>(value: T, debounceMs: number): T => {\n\tconst [debounced, setDebounced] = useState(value)\n\tuseEffect(() => {\n\t\tconst handle = window.setTimeout(() => setDebounced(value), debounceMs)\n\t\treturn () => {\n\t\t\twindow.clearTimeout(handle)\n\t\t}\n\t}, [value, debounceMs])\n\treturn debounced\n}\n"],"names":["useState","useEffect"],"mappings":";;;AAEa,MAAA,cAAc,CAAI,OAAU,eAA0B;AAClE,QAAM,CAAC,WAAW,YAAY,IAAIA,eAAS,KAAK;AAChDC,QAAAA,UAAU,MAAM;AACf,UAAM,SAAS,OAAO,WAAW,MAAM,aAAa,KAAK,GAAG,UAAU;AACtE,WAAO,MAAM;AACZ,aAAO,aAAa,MAAM;AAAA,IAAA;AAAA,EAC3B,GACE,CAAC,OAAO,UAAU,CAAC;AACf,SAAA;AACR;;"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const react = require("react");
|
|
4
|
+
const useDebounceCallback = (cb, debounceMs) => {
|
|
5
|
+
const timerRef = react.useRef();
|
|
6
|
+
const cbRef = react.useRef(cb);
|
|
7
|
+
cbRef.current = cb;
|
|
8
|
+
react.useEffect(() => {
|
|
9
|
+
return () => clearTimeout(timerRef.current);
|
|
10
|
+
}, []);
|
|
11
|
+
return react.useCallback(() => {
|
|
12
|
+
timerRef.current && clearTimeout(timerRef.current);
|
|
13
|
+
timerRef.current = setTimeout(() => {
|
|
14
|
+
cbRef.current();
|
|
15
|
+
}, debounceMs);
|
|
16
|
+
}, [debounceMs]);
|
|
17
|
+
};
|
|
18
|
+
exports.useDebounceCallback = useDebounceCallback;
|
|
19
|
+
//# sourceMappingURL=useDebounceCallback.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useDebounceCallback.cjs","sources":["../../../src/hooks/useDebounceCallback.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react'\n\nexport const useDebounceCallback = (cb: () => any, debounceMs: number) => {\n\tconst timerRef = useRef<ReturnType<typeof setTimeout>>()\n\tconst cbRef = useRef(cb)\n\tcbRef.current = cb\n\n\tuseEffect(() => {\n\t\treturn () => clearTimeout(timerRef.current)\n\t}, [])\n\n\treturn useCallback(() => {\n\t\ttimerRef.current && clearTimeout(timerRef.current)\n\n\t\ttimerRef.current = setTimeout(() => {\n\t\t\tcbRef.current()\n\t\t}, debounceMs)\n\t}, [debounceMs])\n}\n"],"names":["useRef","useEffect","useCallback"],"mappings":";;;AAEa,MAAA,sBAAsB,CAAC,IAAe,eAAuB;AACzE,QAAM,WAAWA,MAAAA;AACX,QAAA,QAAQA,aAAO,EAAE;AACvB,QAAM,UAAU;AAEhBC,QAAAA,UAAU,MAAM;AACR,WAAA,MAAM,aAAa,SAAS,OAAO;AAAA,EAC3C,GAAG,CAAE,CAAA;AAEL,SAAOC,kBAAY,MAAM;AACf,aAAA,WAAW,aAAa,SAAS,OAAO;AAExC,aAAA,UAAU,WAAW,MAAM;AACnC,YAAM,QAAQ;AAAA,OACZ,UAAU;AAAA,EAAA,GACX,CAAC,UAAU,CAAC;AAChB;;"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const react = require("react");
|
|
4
|
+
function useDocumentTitle(title, formatter) {
|
|
5
|
+
const initialTitle = react.useRef(document.title).current;
|
|
6
|
+
react.useEffect(() => {
|
|
7
|
+
if (title) {
|
|
8
|
+
if (formatter) {
|
|
9
|
+
document.title = formatter(title, initialTitle);
|
|
10
|
+
} else {
|
|
11
|
+
document.title = title;
|
|
12
|
+
}
|
|
13
|
+
} else {
|
|
14
|
+
document.title = initialTitle;
|
|
15
|
+
}
|
|
16
|
+
return () => {
|
|
17
|
+
document.title = initialTitle;
|
|
18
|
+
};
|
|
19
|
+
}, [formatter, initialTitle, title]);
|
|
20
|
+
}
|
|
21
|
+
exports.useDocumentTitle = useDocumentTitle;
|
|
22
|
+
//# sourceMappingURL=useDocumentTitle.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useDocumentTitle.cjs","sources":["../../../src/hooks/useDocumentTitle.ts"],"sourcesContent":["import { useEffect, useRef } from 'react'\n\nexport function useDocumentTitle(title: string | null | undefined, formatter?: (title: string, initialTitle: string) => string) {\n\tconst initialTitle = useRef(document.title).current\n\n\tuseEffect(() => {\n\t\tif (title) {\n\t\t\tif (formatter) {\n\t\t\t\tdocument.title = formatter(title, initialTitle)\n\t\t\t} else {\n\t\t\t\tdocument.title = title\n\t\t\t}\n\t\t} else {\n\t\t\tdocument.title = initialTitle\n\t\t}\n\n\t\treturn () => {\n\t\t\tdocument.title = initialTitle\n\t\t}\n\t}, [formatter, initialTitle, title])\n}\n"],"names":["useRef","useEffect"],"mappings":";;;AAEgB,SAAA,iBAAiB,OAAkC,WAA6D;AAC/H,QAAM,eAAeA,MAAA,OAAO,SAAS,KAAK,EAAE;AAE5CC,QAAAA,UAAU,MAAM;AACf,QAAI,OAAO;AACV,UAAI,WAAW;AACL,iBAAA,QAAQ,UAAU,OAAO,YAAY;AAAA,MAAA,OACxC;AACN,iBAAS,QAAQ;AAAA,MAClB;AAAA,IAAA,OACM;AACN,eAAS,QAAQ;AAAA,IAClB;AAEA,WAAO,MAAM;AACZ,eAAS,QAAQ;AAAA,IAAA;AAAA,EAEhB,GAAA,CAAC,WAAW,cAAc,KAAK,CAAC;AACpC;;"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const utilities = require("@contember/utilities");
|
|
4
|
+
const react = require("react");
|
|
5
|
+
const unwrapRefValue = require("./unwrapRefValue.cjs");
|
|
6
|
+
const useOnElementResize = require("./useOnElementResize.cjs");
|
|
7
|
+
const Context = require("../debug-context/Context.cjs");
|
|
8
|
+
const useReferentiallyStableCallback = require("../referentiallyStable/useReferentiallyStableCallback.cjs");
|
|
9
|
+
function useElementSize(refOrElement, options = {}, timeout = 300) {
|
|
10
|
+
const { logged } = Context.useScopedConsoleRef("useElementSize").current;
|
|
11
|
+
const { box = "border-box" } = options;
|
|
12
|
+
const getSizeFromResizeObserverEntry = react.useMemo(() => utilities.getSizeFromResizeObserverEntryFactory(box), [box]);
|
|
13
|
+
const [width, setWidth] = react.useState();
|
|
14
|
+
const [height, setHeight] = react.useState();
|
|
15
|
+
logged("dimensions", { width, height });
|
|
16
|
+
const maybeSetNewDimensions = useReferentiallyStableCallback.useReferentiallyStableCallback((dimensions) => {
|
|
17
|
+
if (width !== dimensions.width) {
|
|
18
|
+
setWidth(dimensions.width);
|
|
19
|
+
}
|
|
20
|
+
if (height !== dimensions.height) {
|
|
21
|
+
setHeight(dimensions.height);
|
|
22
|
+
}
|
|
23
|
+
});
|
|
24
|
+
useOnElementResize.useOnElementResize(refOrElement, (entry) => {
|
|
25
|
+
const dimensions = logged("useOnElementResize => entry:dimensions", getSizeFromResizeObserverEntry(entry));
|
|
26
|
+
maybeSetNewDimensions(dimensions);
|
|
27
|
+
}, { box }, timeout);
|
|
28
|
+
react.useLayoutEffect(() => {
|
|
29
|
+
const element = unwrapRefValue.unwrapRefValue(refOrElement);
|
|
30
|
+
if (element) {
|
|
31
|
+
utilities.getElementDimensionsCallback(element, (dimensions) => maybeSetNewDimensions(dimensions));
|
|
32
|
+
}
|
|
33
|
+
});
|
|
34
|
+
return { height, width };
|
|
35
|
+
}
|
|
36
|
+
exports.useElementSize = useElementSize;
|
|
37
|
+
//# sourceMappingURL=useElementSize.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useElementSize.cjs","sources":["../../../src/hooks/useElementSize.ts"],"sourcesContent":["import { getElementDimensionsCallback, getSizeFromResizeObserverEntryFactory } from '@contember/utilities'\nimport { useLayoutEffect, useMemo, useState } from 'react'\nimport { useScopedConsoleRef } from '../debug-context'\nimport { useReferentiallyStableCallback } from '../referentiallyStable'\nimport { RefObjectOrElement, unwrapRefValue } from './unwrapRefValue'\nimport { useOnElementResize } from './useOnElementResize'\n\nexport type ElementSize = {\n\theight: number\n\twidth: number\n}\n\n/**\n * Measure HTMLElement\n *\n * @param refOrElement - HTMLElement passed directly or indirectly as RefObject\n * @returns Size vector consisting of width and height properties\n */\nexport function useElementSize(\n\trefOrElement: RefObjectOrElement<HTMLElement>,\n\toptions: ResizeObserverOptions = {},\n\ttimeout: number = 300,\n): { height: number | undefined, width: number | undefined } {\n\tconst { logged } = useScopedConsoleRef('useElementSize').current\n\n\tconst { box = 'border-box' } = options\n\tconst getSizeFromResizeObserverEntry = useMemo(() => getSizeFromResizeObserverEntryFactory(box), [box])\n\n\tconst [width, setWidth] = useState<number | undefined>()\n\tconst [height, setHeight] = useState<number | undefined>()\n\n\tlogged('dimensions', { width, height })\n\n\tconst maybeSetNewDimensions = useReferentiallyStableCallback((dimensions: ElementSize) => {\n\t\tif (width !== dimensions.width) {\n\t\t\tsetWidth(dimensions.width)\n\t\t}\n\t\tif (height !== dimensions.height) {\n\t\t\tsetHeight(dimensions.height)\n\t\t}\n\t})\n\n\tuseOnElementResize(refOrElement, entry => {\n\t\tconst dimensions = logged('useOnElementResize => entry:dimensions', getSizeFromResizeObserverEntry(entry))\n\t\tmaybeSetNewDimensions(dimensions)\n\t}, { box }, timeout)\n\n\tuseLayoutEffect(() => {\n\t\tconst element = unwrapRefValue(refOrElement)\n\t\tif (element) {\n\t\t\tgetElementDimensionsCallback(element, dimensions => maybeSetNewDimensions(dimensions))\n\t\t}\n\t})\n\n\treturn { height, width }\n}\n"],"names":["useScopedConsoleRef","useMemo","getSizeFromResizeObserverEntryFactory","useState","useReferentiallyStableCallback","useOnElementResize","useLayoutEffect","unwrapRefValue","getElementDimensionsCallback"],"mappings":";;;;;;;;AAkBO,SAAS,eACf,cACA,UAAiC,CAAA,GACjC,UAAkB,KAC0C;AAC5D,QAAM,EAAE,OAAW,IAAAA,QAAA,oBAAoB,gBAAgB,EAAE;AAEnD,QAAA,EAAE,MAAM,aAAiB,IAAA;AACzB,QAAA,iCAAiCC,MAAAA,QAAQ,MAAMC,UAAAA,sCAAsC,GAAG,GAAG,CAAC,GAAG,CAAC;AAEtG,QAAM,CAAC,OAAO,QAAQ,IAAIC,MAA6B,SAAA;AACvD,QAAM,CAAC,QAAQ,SAAS,IAAIA,MAA6B,SAAA;AAEzD,SAAO,cAAc,EAAE,OAAO,OAAQ,CAAA;AAEhC,QAAA,wBAAwBC,8DAA+B,CAAC,eAA4B;AACrF,QAAA,UAAU,WAAW,OAAO;AAC/B,eAAS,WAAW,KAAK;AAAA,IAC1B;AACI,QAAA,WAAW,WAAW,QAAQ;AACjC,gBAAU,WAAW,MAAM;AAAA,IAC5B;AAAA,EAAA,CACA;AAEDC,wCAAmB,cAAc,CAAS,UAAA;AACzC,UAAM,aAAa,OAAO,0CAA0C,+BAA+B,KAAK,CAAC;AACzG,0BAAsB,UAAU;AAAA,EAAA,GAC9B,EAAE,OAAO,OAAO;AAEnBC,QAAAA,gBAAgB,MAAM;AACf,UAAA,UAAUC,8BAAe,YAAY;AAC3C,QAAI,SAAS;AACZC,gBAAA,6BAA6B,SAAS,CAAA,eAAc,sBAAsB,UAAU,CAAC;AAAA,IACtF;AAAA,EAAA,CACA;AAEM,SAAA,EAAE,QAAQ;AAClB;;"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const react = require("react");
|
|
4
|
+
function useElementTopOffset(ref) {
|
|
5
|
+
const [offsetTop, setOffsetTop] = react.useState(void 0);
|
|
6
|
+
react.useLayoutEffect(() => {
|
|
7
|
+
if (!ref?.current) {
|
|
8
|
+
return;
|
|
9
|
+
}
|
|
10
|
+
const element = ref.current;
|
|
11
|
+
function updateTopOffsetCallback() {
|
|
12
|
+
setOffsetTop(element.offsetTop);
|
|
13
|
+
}
|
|
14
|
+
function updateTopOffsetHandler() {
|
|
15
|
+
requestAnimationFrame(updateTopOffsetCallback);
|
|
16
|
+
}
|
|
17
|
+
updateTopOffsetHandler();
|
|
18
|
+
const observer = new ResizeObserver(() => {
|
|
19
|
+
requestAnimationFrame(updateTopOffsetCallback);
|
|
20
|
+
});
|
|
21
|
+
observer.observe(element);
|
|
22
|
+
return () => {
|
|
23
|
+
observer.unobserve(element);
|
|
24
|
+
};
|
|
25
|
+
}, [ref]);
|
|
26
|
+
return offsetTop;
|
|
27
|
+
}
|
|
28
|
+
exports.useElementTopOffset = useElementTopOffset;
|
|
29
|
+
//# sourceMappingURL=useElementTopOffset.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useElementTopOffset.cjs","sources":["../../../src/hooks/useElementTopOffset.ts"],"sourcesContent":["import { RefObject, useLayoutEffect, useState } from 'react'\n\nexport function useElementTopOffset(ref?: RefObject<HTMLElement>): number | undefined {\n\tconst [offsetTop, setOffsetTop] = useState<number | undefined>(undefined)\n\n\tuseLayoutEffect(() => {\n\t\tif (!ref?.current) {\n\t\t\treturn\n\t\t}\n\n\t\tconst element = ref.current\n\n\t\tfunction updateTopOffsetCallback() {\n\t\t\tsetOffsetTop(element.offsetTop)\n\t\t}\n\n\t\tfunction updateTopOffsetHandler() {\n\t\t\trequestAnimationFrame(updateTopOffsetCallback)\n\t\t}\n\n\t\tupdateTopOffsetHandler()\n\n\t\tconst observer = new ResizeObserver(() => {\n\t\t\trequestAnimationFrame(updateTopOffsetCallback)\n\t\t})\n\n\t\tobserver.observe(element)\n\n\t\treturn () => {\n\t\t\tobserver.unobserve(element)\n\t\t}\n\t}, [ref])\n\n\treturn offsetTop\n}\n"],"names":["useState","useLayoutEffect"],"mappings":";;;AAEO,SAAS,oBAAoB,KAAkD;AACrF,QAAM,CAAC,WAAW,YAAY,IAAIA,MAAAA,SAA6B,MAAS;AAExEC,QAAAA,gBAAgB,MAAM;AACjB,QAAA,CAAC,KAAK,SAAS;AAClB;AAAA,IACD;AAEA,UAAM,UAAU,IAAI;AAEpB,aAAS,0BAA0B;AAClC,mBAAa,QAAQ,SAAS;AAAA,IAC/B;AAEA,aAAS,yBAAyB;AACjC,4BAAsB,uBAAuB;AAAA,IAC9C;AAEuB;AAEjB,UAAA,WAAW,IAAI,eAAe,MAAM;AACzC,4BAAsB,uBAAuB;AAAA,IAAA,CAC7C;AAED,aAAS,QAAQ,OAAO;AAExB,WAAO,MAAM;AACZ,eAAS,UAAU,OAAO;AAAA,IAAA;AAAA,EAC3B,GACE,CAAC,GAAG,CAAC;AAED,SAAA;AACR;;"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const react = require("react");
|
|
4
|
+
function useEventHandler(type, callback) {
|
|
5
|
+
const callbackRef = react.useRef(callback);
|
|
6
|
+
callbackRef.current = callback;
|
|
7
|
+
const stableHandler = react.useRef(function(event) {
|
|
8
|
+
return callbackRef.current(event);
|
|
9
|
+
}).current;
|
|
10
|
+
react.useEffect(() => {
|
|
11
|
+
return () => {
|
|
12
|
+
callbackRef.current = () => {
|
|
13
|
+
};
|
|
14
|
+
};
|
|
15
|
+
}, []);
|
|
16
|
+
return stableHandler;
|
|
17
|
+
}
|
|
18
|
+
exports.useEventHandler = useEventHandler;
|
|
19
|
+
//# sourceMappingURL=useEventHandler.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useEventHandler.cjs","sources":["../../../src/hooks/useEventHandler.ts"],"sourcesContent":["import { EventHandler, SyntheticEvent, useEffect, useRef } from 'react'\n\n/**\n * Similar to useEvent with inferred type for the event parameter according to event type\n *\n * @param type - String, keyof DocumentEventMap, e.g. 'click', 'keydown',...\n * @param callback - EventHandler\n * @returns Stable reference callback\n */\nexport function useEventHandler<E extends SyntheticEvent<any>>(type: E['type'], callback: EventHandler<E>): EventHandler<E> {\n\tconst callbackRef = useRef(callback); callbackRef.current = callback\n\n\tconst stableHandler = useRef(function (event: any) {\n\t\treturn callbackRef.current(event)\n\t}).current\n\n\tuseEffect(() => {\n\t\treturn () => {\n\t\t\tcallbackRef.current = () => { }\n\t\t}\n\t}, [])\n\n\treturn stableHandler\n}\n"],"names":["useRef","useEffect"],"mappings":";;;AASgB,SAAA,gBAA+C,MAAiB,UAA4C;AACrH,QAAA,cAAcA,aAAO,QAAQ;AAAG,cAAY,UAAU;AAEtD,QAAA,gBAAgBA,aAAO,SAAU,OAAY;AAC3C,WAAA,YAAY,QAAQ,KAAK;AAAA,EAChC,CAAA,EAAE;AAEHC,QAAAA,UAAU,MAAM;AACf,WAAO,MAAM;AACZ,kBAAY,UAAU,MAAM;AAAA,MAAA;AAAA,IAAE;AAAA,EAEhC,GAAG,CAAE,CAAA;AAEE,SAAA;AACR;;"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const deepEqual = require("fast-deep-equal/es6/index.js");
|
|
4
|
+
const react = require("react");
|
|
5
|
+
function useExpectSameValueReference(next, shouldThrow = false) {
|
|
6
|
+
const previous = react.useRef(next);
|
|
7
|
+
if (next !== previous.current && typeof next === "object" && typeof previous.current === "object" && deepEqual(next, previous.current)) {
|
|
8
|
+
{
|
|
9
|
+
console.error(
|
|
10
|
+
"Previous and next values do not match in reference although match in value. Try declaring constants outside of the component scope. Otherwise try to memoize callbacks with useCallback, useReferentiallyStableCallback useEvent, useRef or useMemo.",
|
|
11
|
+
{
|
|
12
|
+
previous: previous.current,
|
|
13
|
+
next
|
|
14
|
+
}
|
|
15
|
+
);
|
|
16
|
+
}
|
|
17
|
+
if (shouldThrow) {
|
|
18
|
+
throw new Error("Expecting same reference for same values");
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
previous.current = next;
|
|
22
|
+
}
|
|
23
|
+
exports.useExpectSameValueReference = useExpectSameValueReference;
|
|
24
|
+
//# sourceMappingURL=useExpectSameValueReference.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useExpectSameValueReference.cjs","sources":["../../../src/hooks/useExpectSameValueReference.ts"],"sourcesContent":["import deepEqual from 'fast-deep-equal/es6/index.js'\nimport { useRef } from 'react'\n\n/**\n * Checks whether the next value is the same reference as the previous one\n *\n * If not, it checks whether the values are deeply equal. If not, it logs an error.\n *\n * @param next - Value to be checked.\n * @param shouldThrow - If true, it throws an error instead of logging it. Defaults to false.\n * @returns void\n * -\n * @example\n * ```ts\n * useExpectSameValueReference(style)\n * ```\n * @example\n * ```ts\n * useExpectSameValueReference(style, true)\n * ```\n * @example\n * ```ts\n * useExpectSameValueReference(style, import.meta.env.DEV)\n * ```\n */\nexport function useExpectSameValueReference<T>(next: T, shouldThrow: boolean = false) {\n\tconst previous = useRef(next)\n\n\tif (next !== previous.current\n\t\t&& typeof next === 'object'\n\t\t&& typeof previous.current === 'object'\n\t\t&& deepEqual(next, previous.current)\n\t) {\n\t\tif (import.meta.env.DEV) {\n\t\t\tconsole.error(\n\t\t\t\t'Previous and next values do not match in reference although match in value. ' +\n\t\t\t\t'Try declaring constants outside of the component scope. ' +\n\t\t\t\t'Otherwise try to memoize callbacks with useCallback, ' +\n\t\t\t\t'useReferentiallyStableCallback useEvent, useRef or useMemo.', {\n\t\t\t\tprevious: previous.current,\n\t\t\t\tnext,\n\t\t\t})\n\t\t}\n\n\t\tif (shouldThrow) {\n\t\t\tthrow new Error('Expecting same reference for same values')\n\t\t}\n\t}\n\n\tprevious.current = next\n}\n"],"names":["useRef"],"mappings":";;;;AAyBgB,SAAA,4BAA+B,MAAS,cAAuB,OAAO;AAC/E,QAAA,WAAWA,aAAO,IAAI;AAE5B,MAAI,SAAS,SAAS,WAClB,OAAO,SAAS,YAChB,OAAO,SAAS,YAAY,YAC5B,UAAU,MAAM,SAAS,OAAO,GAClC;AACwB;AAChB,cAAA;AAAA,QACP;AAAA,QAG+D;AAAA,UAC/D,UAAU,SAAS;AAAA,UACnB;AAAA,QACD;AAAA,MAAA;AAAA,IACD;AAEA,QAAI,aAAa;AACV,YAAA,IAAI,MAAM,0CAA0C;AAAA,IAC3D;AAAA,EACD;AAEA,WAAS,UAAU;AACpB;;"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const react = require("react");
|
|
4
|
+
const useForceRender = () => {
|
|
5
|
+
const [, forceRender] = react.useReducer((s) => s + 1, 0);
|
|
6
|
+
return forceRender;
|
|
7
|
+
};
|
|
8
|
+
exports.useForceRender = useForceRender;
|
|
9
|
+
//# sourceMappingURL=useForceRender.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useForceRender.cjs","sources":["../../../src/hooks/useForceRender.ts"],"sourcesContent":["import { useReducer } from 'react'\n\nexport const useForceRender = () => {\n\tconst [, forceRender] = useReducer((s: number) => s + 1, 0)\n\treturn forceRender\n}\n"],"names":["useReducer"],"mappings":";;;AAEO,MAAM,iBAAiB,MAAM;AAC7B,QAAA,CAAG,EAAA,WAAW,IAAIA,iBAAW,CAAC,MAAc,IAAI,GAAG,CAAC;AACnD,SAAA;AACR;;"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const react = require("react");
|
|
4
|
+
const count = { current: 360 };
|
|
5
|
+
function nextId() {
|
|
6
|
+
count.current += 1;
|
|
7
|
+
return `:${count.current.toString(36)}:`;
|
|
8
|
+
}
|
|
9
|
+
function useId() {
|
|
10
|
+
return react.useMemo(() => nextId(), []);
|
|
11
|
+
}
|
|
12
|
+
exports.useId = useId;
|
|
13
|
+
//# sourceMappingURL=useId.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useId.cjs","sources":["../../../src/hooks/useId.ts"],"sourcesContent":["import { useMemo, useRef } from 'react'\n\nconst count = { current: 360 }\n\nfunction nextId() {\n\tcount.current += 1\n\n\treturn `:${count.current.toString(36)}:`\n}\n\n/**\n * Returns a unique ID string\n * @internal\n *\n * NOTE: This hook is a temporary solution until we stop supporting React < 18\n *\n * @returns a unique id\n */\nexport function useId() {\n\treturn useMemo(() => nextId(), [])\n}\n"],"names":["useMemo"],"mappings":";;;AAEA,MAAM,QAAQ,EAAE,SAAS;AAEzB,SAAS,SAAS;AACjB,QAAM,WAAW;AAEjB,SAAO,IAAI,MAAM,QAAQ,SAAS,EAAE,CAAC;AACtC;AAUO,SAAS,QAAQ;AACvB,SAAOA,cAAQ,MAAM,OAAO,GAAG,CAAE,CAAA;AAClC;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useId.js","sources":["../../../src/hooks/useId.ts"],"sourcesContent":["import { useMemo, useRef } from 'react'\n\nconst count = { current: 360 }\n\nfunction nextId() {\n\tcount.current += 1\n\n\treturn `:${count.current.toString(36)}:`\n}\n\n/**\n * Returns a unique ID string\n * @internal\n *\n * NOTE: This hook is a temporary solution until we stop supporting React < 18\n *\n * @returns a unique id\n */\nexport function useId() {\n\treturn useMemo(() => nextId(), [])\n}\n"],"names":[],"mappings":";AAEA,MAAM,QAAQ,EAAE,SAAS;AAEzB,SAAS,SAAS;AACjB,QAAM,WAAW;AAEjB,SAAO,IAAI,MAAM,QAAQ,SAAS,EAAE;
|
|
1
|
+
{"version":3,"file":"useId.js","sources":["../../../src/hooks/useId.ts"],"sourcesContent":["import { useMemo, useRef } from 'react'\n\nconst count = { current: 360 }\n\nfunction nextId() {\n\tcount.current += 1\n\n\treturn `:${count.current.toString(36)}:`\n}\n\n/**\n * Returns a unique ID string\n * @internal\n *\n * NOTE: This hook is a temporary solution until we stop supporting React < 18\n *\n * @returns a unique id\n */\nexport function useId() {\n\treturn useMemo(() => nextId(), [])\n}\n"],"names":[],"mappings":";AAEA,MAAM,QAAQ,EAAE,SAAS;AAEzB,SAAS,SAAS;AACjB,QAAM,WAAW;AAEjB,SAAO,IAAI,MAAM,QAAQ,SAAS,EAAE,CAAC;AACtC;AAUO,SAAS,QAAQ;AACvB,SAAO,QAAQ,MAAM,OAAO,GAAG,CAAE,CAAA;AAClC;"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const react = require("react");
|
|
4
|
+
const useIsMounted = () => {
|
|
5
|
+
const isMountedRef = react.useRef(true);
|
|
6
|
+
react.useEffect(
|
|
7
|
+
() => {
|
|
8
|
+
isMountedRef.current = true;
|
|
9
|
+
return () => {
|
|
10
|
+
isMountedRef.current = false;
|
|
11
|
+
};
|
|
12
|
+
},
|
|
13
|
+
[]
|
|
14
|
+
);
|
|
15
|
+
return isMountedRef;
|
|
16
|
+
};
|
|
17
|
+
exports.useIsMounted = useIsMounted;
|
|
18
|
+
//# sourceMappingURL=useIsMounted.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useIsMounted.cjs","sources":["../../../src/hooks/useIsMounted.ts"],"sourcesContent":["import { useEffect, useRef } from 'react'\n\nexport const useIsMounted = () => {\n\tconst isMountedRef = useRef(true)\n\tuseEffect(\n\t\t() => {\n\t\t\tisMountedRef.current = true\n\t\t\treturn () => {\n\t\t\t\tisMountedRef.current = false\n\t\t\t}\n\t\t},\n\t\t[],\n\t)\n\treturn isMountedRef\n}\n"],"names":["useRef","useEffect"],"mappings":";;;AAEO,MAAM,eAAe,MAAM;AAC3B,QAAA,eAAeA,aAAO,IAAI;AAChCC,QAAA;AAAA,IACC,MAAM;AACL,mBAAa,UAAU;AACvB,aAAO,MAAM;AACZ,qBAAa,UAAU;AAAA,MAAA;AAAA,IAEzB;AAAA,IACA,CAAC;AAAA,EAAA;AAEK,SAAA;AACR;;"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const react = require("react");
|
|
4
|
+
const compareObjects = (a, b) => {
|
|
5
|
+
if (a === b) {
|
|
6
|
+
return true;
|
|
7
|
+
}
|
|
8
|
+
const aEntries = Object.entries(a);
|
|
9
|
+
if (aEntries.length !== Object.keys(b).length) {
|
|
10
|
+
return false;
|
|
11
|
+
}
|
|
12
|
+
for (const [key, val] of aEntries) {
|
|
13
|
+
if (!(key in b) || b[key] !== val) {
|
|
14
|
+
return false;
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
return true;
|
|
18
|
+
};
|
|
19
|
+
const useObjectMemo = (value) => {
|
|
20
|
+
const valueRef = react.useRef(value);
|
|
21
|
+
if (!compareObjects(valueRef.current, value)) {
|
|
22
|
+
valueRef.current = value;
|
|
23
|
+
}
|
|
24
|
+
return valueRef.current;
|
|
25
|
+
};
|
|
26
|
+
exports.useObjectMemo = useObjectMemo;
|
|
27
|
+
//# sourceMappingURL=useObjectMemo.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useObjectMemo.cjs","sources":["../../../src/hooks/useObjectMemo.ts"],"sourcesContent":["import { useRef } from 'react'\n\nconst compareObjects = (a: object, b: object): boolean => {\n\tif (a === b) {\n\t\treturn true\n\t}\n\tconst aEntries = Object.entries(a)\n\tif (aEntries.length !== Object.keys(b).length) {\n\t\treturn false\n\t}\n\tfor (const [key, val] of aEntries) {\n\t\tif (!(key in b) || (b as any)[key] !== val) {\n\t\t\treturn false\n\t\t}\n\t}\n\treturn true\n}\n\nexport const useObjectMemo = <A extends object>(value: A): A => {\n\tconst valueRef = useRef(value)\n\tif (!compareObjects(valueRef.current, value)) {\n\t\tvalueRef.current = value\n\t}\n\treturn valueRef.current\n}\n"],"names":["useRef"],"mappings":";;;AAEA,MAAM,iBAAiB,CAAC,GAAW,MAAuB;AACzD,MAAI,MAAM,GAAG;AACL,WAAA;AAAA,EACR;AACM,QAAA,WAAW,OAAO,QAAQ,CAAC;AACjC,MAAI,SAAS,WAAW,OAAO,KAAK,CAAC,EAAE,QAAQ;AACvC,WAAA;AAAA,EACR;AACA,aAAW,CAAC,KAAK,GAAG,KAAK,UAAU;AAClC,QAAI,EAAE,OAAO,MAAO,EAAU,GAAG,MAAM,KAAK;AACpC,aAAA;AAAA,IACR;AAAA,EACD;AACO,SAAA;AACR;AAEa,MAAA,gBAAgB,CAAmB,UAAgB;AACzD,QAAA,WAAWA,aAAO,KAAK;AAC7B,MAAI,CAAC,eAAe,SAAS,SAAS,KAAK,GAAG;AAC7C,aAAS,UAAU;AAAA,EACpB;AACA,SAAO,SAAS;AACjB;;"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const react = require("react");
|
|
4
|
+
const unwrapRefValue = require("./unwrapRefValue.cjs");
|
|
5
|
+
function useOnElementClickOutsideCallback(refOrElement, callback) {
|
|
6
|
+
react.useEffect(() => {
|
|
7
|
+
const refValue = unwrapRefValue.unwrapRefValue(refOrElement);
|
|
8
|
+
const handleClickOutside = (event) => {
|
|
9
|
+
if (refValue && !refValue.contains(event.target)) {
|
|
10
|
+
callback(event);
|
|
11
|
+
}
|
|
12
|
+
};
|
|
13
|
+
document.addEventListener("mousedown", handleClickOutside);
|
|
14
|
+
return () => {
|
|
15
|
+
document.removeEventListener("mousedown", handleClickOutside);
|
|
16
|
+
};
|
|
17
|
+
}, [callback, refOrElement]);
|
|
18
|
+
}
|
|
19
|
+
exports.useOnElementClickOutsideCallback = useOnElementClickOutsideCallback;
|
|
20
|
+
//# sourceMappingURL=useOnElementClickOutsideCallback.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useOnElementClickOutsideCallback.cjs","sources":["../../../src/hooks/useOnElementClickOutsideCallback.ts"],"sourcesContent":["import { useEffect } from 'react'\nimport { RefObjectOrElement, unwrapRefValue } from './unwrapRefValue'\n\nexport function useOnElementClickOutsideCallback(\n\trefOrElement: RefObjectOrElement<HTMLElement>,\n\tcallback: (event: MouseEvent) => void,\n): void {\n\tuseEffect(() => {\n\t\tconst refValue = unwrapRefValue(refOrElement)\n\n\t\tconst handleClickOutside = (event: MouseEvent) => {\n\t\t\tif (refValue && !refValue.contains(event.target as Node)) {\n\t\t\t\tcallback(event)\n\t\t\t}\n\t\t}\n\n\t\tdocument.addEventListener('mousedown', handleClickOutside)\n\n\t\treturn () => {\n\t\t\tdocument.removeEventListener('mousedown', handleClickOutside)\n\t\t}\n\t}, [callback, refOrElement])\n}\n"],"names":["useEffect","unwrapRefValue"],"mappings":";;;;AAGgB,SAAA,iCACf,cACA,UACO;AACPA,QAAAA,UAAU,MAAM;AACT,UAAA,WAAWC,8BAAe,YAAY;AAEtC,UAAA,qBAAqB,CAAC,UAAsB;AACjD,UAAI,YAAY,CAAC,SAAS,SAAS,MAAM,MAAc,GAAG;AACzD,iBAAS,KAAK;AAAA,MACf;AAAA,IAAA;AAGQ,aAAA,iBAAiB,aAAa,kBAAkB;AAEzD,WAAO,MAAM;AACH,eAAA,oBAAoB,aAAa,kBAAkB;AAAA,IAAA;AAAA,EAC7D,GACE,CAAC,UAAU,YAAY,CAAC;AAC5B;;"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const react = require("react");
|
|
4
|
+
const unwrapRefValue = require("./unwrapRefValue.cjs");
|
|
5
|
+
function useOnElementMouseEnterDelayedCallback(refOrElement, callback, timeoutMs = 300) {
|
|
6
|
+
react.useEffect(() => {
|
|
7
|
+
const refValue = unwrapRefValue.unwrapRefValue(refOrElement);
|
|
8
|
+
if (refValue) {
|
|
9
|
+
let handleMouseEnter = function(event) {
|
|
10
|
+
clearTimeout(timeoutID);
|
|
11
|
+
timeoutID = setTimeout(() => {
|
|
12
|
+
callback(event);
|
|
13
|
+
}, timeoutMs);
|
|
14
|
+
}, handleMouseLeave = function() {
|
|
15
|
+
clearTimeout(timeoutID);
|
|
16
|
+
}, handleMouseDown = function(event) {
|
|
17
|
+
clearTimeout(timeoutID);
|
|
18
|
+
callback(event);
|
|
19
|
+
};
|
|
20
|
+
let timeoutID = void 0;
|
|
21
|
+
refValue.addEventListener("mouseenter", handleMouseEnter);
|
|
22
|
+
refValue.addEventListener("mouseleave", handleMouseLeave);
|
|
23
|
+
refValue.addEventListener("mousedown", handleMouseDown);
|
|
24
|
+
return () => {
|
|
25
|
+
refValue.removeEventListener("mouseover", handleMouseEnter);
|
|
26
|
+
refValue.removeEventListener("mouseleave", handleMouseLeave);
|
|
27
|
+
refValue.removeEventListener("mousedown", handleMouseDown);
|
|
28
|
+
};
|
|
29
|
+
}
|
|
30
|
+
}, [callback, refOrElement, timeoutMs]);
|
|
31
|
+
}
|
|
32
|
+
exports.useOnElementMouseEnterDelayedCallback = useOnElementMouseEnterDelayedCallback;
|
|
33
|
+
//# sourceMappingURL=useOnElementMouseEnterDelayedCallback.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useOnElementMouseEnterDelayedCallback.cjs","sources":["../../../src/hooks/useOnElementMouseEnterDelayedCallback.ts"],"sourcesContent":["import { useEffect } from 'react'\nimport { RefObjectOrElement, unwrapRefValue } from './unwrapRefValue'\n\n/**\n * Calls the callback when the mouse enters the element, but only after a timeout, e.g. for tooltips or dropdown menus.\n *\n * Calls the callback immediately if the mouse is pressed down with `event.type` of `mousedown`. This is useful for\n * dropdown menus, where the user may click on the menu item before the callback is called resulting in the menu\n * opening and closing immediately.\n *\n * @param refOrElement - The element or ref to the element to attach the event listener to.\n * @param callback - The callback to call when the mouse enters the element.\n * @param timeoutMs - The timeout in milliseconds to wait before calling the callback.\n */\nexport function useOnElementMouseEnterDelayedCallback(\n\trefOrElement: RefObjectOrElement<HTMLElement>,\n\tcallback: (event: MouseEvent) => void,\n\ttimeoutMs: number = 300,\n): void {\n\tuseEffect(() => {\n\t\tconst refValue = unwrapRefValue(refOrElement)\n\n\t\tif (refValue) {\n\t\t\tlet timeoutID: ReturnType<typeof setTimeout> | undefined = undefined\n\n\t\t\tfunction handleMouseEnter(event: MouseEvent) {\n\t\t\t\tclearTimeout(timeoutID)\n\n\t\t\t\ttimeoutID = setTimeout(() => {\n\t\t\t\t\tcallback(event)\n\t\t\t\t}, timeoutMs)\n\t\t\t}\n\n\t\t\tfunction handleMouseLeave() {\n\t\t\t\tclearTimeout(timeoutID)\n\t\t\t}\n\n\t\t\tfunction handleMouseDown(event: MouseEvent) {\n\t\t\t\tclearTimeout(timeoutID)\n\t\t\t\tcallback(event)\n\t\t\t}\n\n\t\t\trefValue.addEventListener('mouseenter', handleMouseEnter)\n\t\t\trefValue.addEventListener('mouseleave', handleMouseLeave)\n\t\t\trefValue.addEventListener('mousedown', handleMouseDown)\n\n\t\t\treturn () => {\n\t\t\t\trefValue.removeEventListener('mouseover', handleMouseEnter)\n\t\t\t\trefValue.removeEventListener('mouseleave', handleMouseLeave)\n\t\t\t\trefValue.removeEventListener('mousedown', handleMouseDown)\n\t\t\t}\n\t\t}\n\t}, [callback, refOrElement, timeoutMs])\n}\n"],"names":["useEffect","unwrapRefValue"],"mappings":";;;;AAcO,SAAS,sCACf,cACA,UACA,YAAoB,KACb;AACPA,QAAAA,UAAU,MAAM;AACT,UAAA,WAAWC,8BAAe,YAAY;AAE5C,QAAI,UAAU;AAGJ,UAAA,mBAAT,SAA0B,OAAmB;AAC5C,qBAAa,SAAS;AAEtB,oBAAY,WAAW,MAAM;AAC5B,mBAAS,KAAK;AAAA,WACZ,SAAS;AAAA,MACb,GAES,mBAAT,WAA4B;AAC3B,qBAAa,SAAS;AAAA,MAAA,GAGd,kBAAT,SAAyB,OAAmB;AAC3C,qBAAa,SAAS;AACtB,iBAAS,KAAK;AAAA,MAAA;AAhBf,UAAI,YAAuD;AAmBlD,eAAA,iBAAiB,cAAc,gBAAgB;AAC/C,eAAA,iBAAiB,cAAc,gBAAgB;AAC/C,eAAA,iBAAiB,aAAa,eAAe;AAEtD,aAAO,MAAM;AACH,iBAAA,oBAAoB,aAAa,gBAAgB;AACjD,iBAAA,oBAAoB,cAAc,gBAAgB;AAClD,iBAAA,oBAAoB,aAAa,eAAe;AAAA,MAAA;AAAA,IAE3D;AAAA,EACE,GAAA,CAAC,UAAU,cAAc,SAAS,CAAC;AACvC;;"}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const deepEqual = require("fast-deep-equal/es6/index.js");
|
|
4
|
+
const react = require("react");
|
|
5
|
+
const unwrapRefValue = require("./unwrapRefValue.cjs");
|
|
6
|
+
const Context = require("../debug-context/Context.cjs");
|
|
7
|
+
function useOnElementMutation(refOrElement, callback, options = { attributes: true, childList: true, subtree: true }) {
|
|
8
|
+
const scopedConsoleRef = Context.useScopedConsoleRef("useOnElementMutation");
|
|
9
|
+
const callbackRef = react.useRef(callback);
|
|
10
|
+
callbackRef.current = callback;
|
|
11
|
+
const optionsRef = react.useRef(options);
|
|
12
|
+
optionsRef.current = options;
|
|
13
|
+
const [optionsState, setOptionsState] = react.useState(options);
|
|
14
|
+
react.useEffect(() => {
|
|
15
|
+
if (!deepEqual(optionsRef.current, options)) {
|
|
16
|
+
setOptionsState(options);
|
|
17
|
+
}
|
|
18
|
+
}, [options]);
|
|
19
|
+
react.useLayoutEffect(() => {
|
|
20
|
+
const element = unwrapRefValue.unwrapRefValue(refOrElement);
|
|
21
|
+
if (element) {
|
|
22
|
+
let handler = function(mutations, observer2) {
|
|
23
|
+
scopedConsoleRef.current.logged("element.mutations", mutations);
|
|
24
|
+
callbackRef.current(mutations, observer2);
|
|
25
|
+
};
|
|
26
|
+
const observer = new MutationObserver(handler);
|
|
27
|
+
observer.observe(element, optionsState);
|
|
28
|
+
return () => {
|
|
29
|
+
observer.disconnect();
|
|
30
|
+
};
|
|
31
|
+
}
|
|
32
|
+
}, [optionsState, refOrElement, scopedConsoleRef]);
|
|
33
|
+
}
|
|
34
|
+
exports.useOnElementMutation = useOnElementMutation;
|
|
35
|
+
//# sourceMappingURL=useOnElementMutation.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useOnElementMutation.cjs","sources":["../../../src/hooks/useOnElementMutation.ts"],"sourcesContent":["import deepEqual from 'fast-deep-equal/es6/index.js'\nimport { useEffect, useLayoutEffect, useRef, useState } from 'react'\nimport { useScopedConsoleRef } from '../debug-context'\nimport { RefObjectOrElement, unwrapRefValue } from './unwrapRefValue'\n\nexport function useOnElementMutation(\n\trefOrElement: RefObjectOrElement<HTMLElement | undefined>,\n\tcallback: MutationCallback,\n\toptions: MutationObserverInit = { attributes: true, childList: true, subtree: true },\n) {\n\tconst scopedConsoleRef = useScopedConsoleRef('useOnElementMutation')\n\n\tconst callbackRef = useRef(callback); callbackRef.current = callback\n\tconst optionsRef = useRef<MutationObserverInit>(options); optionsRef.current = options\n\n\tconst [optionsState, setOptionsState] = useState<MutationObserverInit>(options)\n\n\tuseEffect(() => {\n\t\tif (!deepEqual(optionsRef.current, options)) {\n\t\t\tsetOptionsState(options)\n\t\t}\n\t}, [options])\n\n\tuseLayoutEffect(() => {\n\t\tconst element = unwrapRefValue(refOrElement)\n\n\t\tif (element) {\n\t\t\tfunction handler(mutations: MutationRecord[], observer: MutationObserver) {\n\t\t\t\tscopedConsoleRef.current.logged('element.mutations', mutations)\n\t\t\t\tcallbackRef.current(mutations, observer)\n\t\t\t}\n\n\t\t\tconst observer = new MutationObserver(handler)\n\n\t\t\tobserver.observe(element, optionsState)\n\n\t\t\treturn () => {\n\t\t\t\tobserver.disconnect()\n\t\t\t}\n\t\t}\n\t}, [optionsState, refOrElement, scopedConsoleRef])\n}\n"],"names":["useScopedConsoleRef","useRef","useState","useEffect","useLayoutEffect","unwrapRefValue","observer"],"mappings":";;;;;;AAKgB,SAAA,qBACf,cACA,UACA,UAAgC,EAAE,YAAY,MAAM,WAAW,MAAM,SAAS,KAAA,GAC7E;AACK,QAAA,mBAAmBA,4BAAoB,sBAAsB;AAE7D,QAAA,cAAcC,aAAO,QAAQ;AAAG,cAAY,UAAU;AACtD,QAAA,aAAaA,aAA6B,OAAO;AAAG,aAAW,UAAU;AAE/E,QAAM,CAAC,cAAc,eAAe,IAAIC,eAA+B,OAAO;AAE9EC,QAAAA,UAAU,MAAM;AACf,QAAI,CAAC,UAAU,WAAW,SAAS,OAAO,GAAG;AAC5C,sBAAgB,OAAO;AAAA,IACxB;AAAA,EAAA,GACE,CAAC,OAAO,CAAC;AAEZC,QAAAA,gBAAgB,MAAM;AACf,UAAA,UAAUC,8BAAe,YAAY;AAE3C,QAAI,SAAS;AACH,UAAA,UAAT,SAAiB,WAA6BC,WAA4B;AACxD,yBAAA,QAAQ,OAAO,qBAAqB,SAAS;AAClD,oBAAA,QAAQ,WAAWA,SAAQ;AAAA,MAAA;AAGlC,YAAA,WAAW,IAAI,iBAAiB,OAAO;AAEpC,eAAA,QAAQ,SAAS,YAAY;AAEtC,aAAO,MAAM;AACZ,iBAAS,WAAW;AAAA,MAAA;AAAA,IAEtB;AAAA,EACE,GAAA,CAAC,cAAc,cAAc,gBAAgB,CAAC;AAClD;;"}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const react = require("react");
|
|
4
|
+
const unwrapRefValue = require("./unwrapRefValue.cjs");
|
|
5
|
+
const Context = require("../debug-context/Context.cjs");
|
|
6
|
+
function useOnElementResize(refOrElement, callback, options = {}, timeout = 300) {
|
|
7
|
+
const scopedConsoleRef = Context.useScopedConsoleRef("useOnElementResize");
|
|
8
|
+
const { box = "border-box" } = options;
|
|
9
|
+
const callbackRef = react.useRef(callback);
|
|
10
|
+
callbackRef.current = callback;
|
|
11
|
+
const lastTimeStamp = react.useRef(0);
|
|
12
|
+
react.useLayoutEffect(() => {
|
|
13
|
+
const element = unwrapRefValue.unwrapRefValue(refOrElement);
|
|
14
|
+
if (!element) {
|
|
15
|
+
return;
|
|
16
|
+
}
|
|
17
|
+
if (!(element instanceof HTMLElement)) {
|
|
18
|
+
throw new Error("Exhaustive error: Expecting element to be instance of HTMLElement");
|
|
19
|
+
}
|
|
20
|
+
let timeoutID = void 0;
|
|
21
|
+
function debouncedOnChange([entry]) {
|
|
22
|
+
const timeStamp = Date.now();
|
|
23
|
+
const delta = timeStamp - lastTimeStamp.current;
|
|
24
|
+
clearTimeout(timeoutID);
|
|
25
|
+
const timeoutFinal = delta > timeout ? 0 : timeout;
|
|
26
|
+
timeoutID = setTimeout(() => {
|
|
27
|
+
const message = timeoutFinal > 0 ? "element.resize:debounced" : "element.resize:immediate";
|
|
28
|
+
scopedConsoleRef.current.warned(message, null);
|
|
29
|
+
callbackRef.current(entry);
|
|
30
|
+
lastTimeStamp.current = timeStamp;
|
|
31
|
+
}, timeoutFinal);
|
|
32
|
+
}
|
|
33
|
+
const resizeObserver = new ResizeObserver(debouncedOnChange);
|
|
34
|
+
resizeObserver.observe(element, { box });
|
|
35
|
+
return () => {
|
|
36
|
+
clearTimeout(timeoutID);
|
|
37
|
+
resizeObserver.unobserve(element);
|
|
38
|
+
};
|
|
39
|
+
}, [box, refOrElement, scopedConsoleRef, timeout]);
|
|
40
|
+
}
|
|
41
|
+
exports.useOnElementResize = useOnElementResize;
|
|
42
|
+
//# sourceMappingURL=useOnElementResize.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useOnElementResize.cjs","sources":["../../../src/hooks/useOnElementResize.ts"],"sourcesContent":["import { useLayoutEffect, useRef } from 'react'\nimport { useScopedConsoleRef } from '../debug-context'\nimport { RefObjectOrElement, unwrapRefValue } from './unwrapRefValue'\n\nexport function useOnElementResize(\n\trefOrElement: RefObjectOrElement<HTMLElement | null> | null,\n\tcallback: (entries: ResizeObserverEntry) => void,\n\toptions: ResizeObserverOptions = {},\n\ttimeout: number = 300,\n): void {\n\tconst scopedConsoleRef = useScopedConsoleRef('useOnElementResize')\n\n\tconst { box = 'border-box' } = options\n\tconst callbackRef = useRef(callback); callbackRef.current = callback\n\tconst lastTimeStamp = useRef<number>(0)\n\n\tuseLayoutEffect(() => {\n\t\tconst element = unwrapRefValue(refOrElement)\n\t\tif (!element) {\n\t\t\treturn\n\t\t}\n\t\tif (!(element instanceof HTMLElement)) {\n\t\t\tthrow new Error('Exhaustive error: Expecting element to be instance of HTMLElement')\n\t\t}\n\n\t\tlet timeoutID: number | undefined = undefined\n\n\t\tfunction debouncedOnChange([entry]: ResizeObserverEntry[]) {\n\t\t\tconst timeStamp = Date.now()\n\t\t\tconst delta = timeStamp - lastTimeStamp.current\n\n\t\t\tclearTimeout(timeoutID)\n\t\t\tconst timeoutFinal = delta > timeout ? 0 : timeout\n\n\t\t\ttimeoutID = setTimeout(() => {\n\t\t\t\tconst message = timeoutFinal > 0 ? 'element.resize:debounced' : 'element.resize:immediate'\n\t\t\t\tscopedConsoleRef.current.warned(message, null)\n\t\t\t\tcallbackRef.current(entry)\n\t\t\t\tlastTimeStamp.current = timeStamp\n\t\t\t}, timeoutFinal)\n\t\t}\n\n\t\tconst resizeObserver = new ResizeObserver(debouncedOnChange)\n\n\t\tresizeObserver.observe(element, { box })\n\n\t\treturn () => {\n\t\t\tclearTimeout(timeoutID)\n\t\t\tresizeObserver.unobserve(element)\n\t\t}\n\t}, [box, refOrElement, scopedConsoleRef, timeout])\n}\n"],"names":["useScopedConsoleRef","useRef","useLayoutEffect","unwrapRefValue"],"mappings":";;;;;AAIO,SAAS,mBACf,cACA,UACA,UAAiC,CAAC,GAClC,UAAkB,KACX;AACD,QAAA,mBAAmBA,4BAAoB,oBAAoB;AAE3D,QAAA,EAAE,MAAM,aAAiB,IAAA;AACzB,QAAA,cAAcC,aAAO,QAAQ;AAAG,cAAY,UAAU;AACtD,QAAA,gBAAgBA,aAAe,CAAC;AAEtCC,QAAAA,gBAAgB,MAAM;AACf,UAAA,UAAUC,8BAAe,YAAY;AAC3C,QAAI,CAAC,SAAS;AACb;AAAA,IACD;AACI,QAAA,EAAE,mBAAmB,cAAc;AAChC,YAAA,IAAI,MAAM,mEAAmE;AAAA,IACpF;AAEA,QAAI,YAAgC;AAE3B,aAAA,kBAAkB,CAAC,KAAK,GAA0B;AACpD,YAAA,YAAY,KAAK;AACjB,YAAA,QAAQ,YAAY,cAAc;AAExC,mBAAa,SAAS;AAChB,YAAA,eAAe,QAAQ,UAAU,IAAI;AAE3C,kBAAY,WAAW,MAAM;AACtB,cAAA,UAAU,eAAe,IAAI,6BAA6B;AAC/C,yBAAA,QAAQ,OAAO,SAAS,IAAI;AAC7C,oBAAY,QAAQ,KAAK;AACzB,sBAAc,UAAU;AAAA,SACtB,YAAY;AAAA,IAChB;AAEM,UAAA,iBAAiB,IAAI,eAAe,iBAAiB;AAE3D,mBAAe,QAAQ,SAAS,EAAE,IAAK,CAAA;AAEvC,WAAO,MAAM;AACZ,mBAAa,SAAS;AACtB,qBAAe,UAAU,OAAO;AAAA,IAAA;AAAA,KAE/B,CAAC,KAAK,cAAc,kBAAkB,OAAO,CAAC;AAClD;;"}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const react = require("react");
|
|
4
|
+
const unwrapRefValue = require("./unwrapRefValue.cjs");
|
|
5
|
+
const Context = require("../debug-context/Context.cjs");
|
|
6
|
+
function useOnScrollWithin(refOrElement, callback, interval = 1e3 / 60) {
|
|
7
|
+
const scopedConsoleRef = Context.useScopedConsoleRef("useOnScrollWithin");
|
|
8
|
+
const callbackRef = react.useRef(callback);
|
|
9
|
+
callbackRef.current = callback;
|
|
10
|
+
const lastTimeStamp = react.useRef(0);
|
|
11
|
+
react.useLayoutEffect(() => {
|
|
12
|
+
const element = unwrapRefValue.unwrapRefValue(refOrElement);
|
|
13
|
+
let timeoutID = void 0;
|
|
14
|
+
if (element) {
|
|
15
|
+
let debouncedHandler = function(event) {
|
|
16
|
+
clearTimeout(timeoutID);
|
|
17
|
+
const delta = event.timeStamp - lastTimeStamp.current;
|
|
18
|
+
scopedConsoleRef.current.logged("event:element.scroll:delta", delta);
|
|
19
|
+
if (delta > interval) {
|
|
20
|
+
scopedConsoleRef.current.warned("event:element.scroll:immediately", event);
|
|
21
|
+
callbackRef.current(event);
|
|
22
|
+
lastTimeStamp.current = event.timeStamp;
|
|
23
|
+
} else {
|
|
24
|
+
timeoutID = setTimeout(() => {
|
|
25
|
+
scopedConsoleRef.current.warned("event:element.scroll:debounced", event);
|
|
26
|
+
lastTimeStamp.current = event.timeStamp;
|
|
27
|
+
callbackRef.current(event);
|
|
28
|
+
}, interval);
|
|
29
|
+
}
|
|
30
|
+
};
|
|
31
|
+
if (element instanceof HTMLElement) {
|
|
32
|
+
if (element instanceof HTMLBodyElement || element instanceof HTMLHtmlElement) {
|
|
33
|
+
window.addEventListener("scroll", debouncedHandler, { capture: true, passive: true });
|
|
34
|
+
window.addEventListener("resize", debouncedHandler);
|
|
35
|
+
return () => {
|
|
36
|
+
window.removeEventListener("scroll", debouncedHandler);
|
|
37
|
+
window.removeEventListener("resize", debouncedHandler);
|
|
38
|
+
};
|
|
39
|
+
} else {
|
|
40
|
+
element.addEventListener("scroll", debouncedHandler, { passive: true, capture: true });
|
|
41
|
+
return () => {
|
|
42
|
+
element.removeEventListener("scroll", debouncedHandler);
|
|
43
|
+
};
|
|
44
|
+
}
|
|
45
|
+
} else {
|
|
46
|
+
throw new Error("Exhaustive error: Expecting element to be instance of HTMLElement");
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
}, [interval, refOrElement, scopedConsoleRef]);
|
|
50
|
+
}
|
|
51
|
+
exports.useOnScrollWithin = useOnScrollWithin;
|
|
52
|
+
//# sourceMappingURL=useOnScrollWithin.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useOnScrollWithin.cjs","sources":["../../../src/hooks/useOnScrollWithin.ts"],"sourcesContent":["import { useLayoutEffect, useRef } from 'react'\nimport { useScopedConsoleRef } from '../debug-context'\nimport { RefObjectOrElement, unwrapRefValue } from './unwrapRefValue'\n\n/**\n * Invokes callback on scroll event within the scroll container\n *\n * @param refOrElement - Scroll container\n * @param callback - Callback that is invoked on scroll event\n * @param interval - Specifies how often should scroll event invoke callback\n */\nexport function useOnScrollWithin(\n\trefOrElement: RefObjectOrElement<HTMLElement | null> | null,\n\tcallback: (event: Event) => void,\n\tinterval: number = 1000 / 60,\n) {\n\tconst scopedConsoleRef = useScopedConsoleRef('useOnScrollWithin')\n\n\tconst callbackRef = useRef(callback); callbackRef.current = callback\n\tconst lastTimeStamp = useRef<number>(0)\n\n\tuseLayoutEffect(() => {\n\t\tconst element = unwrapRefValue(refOrElement)\n\n\t\tlet timeoutID: number | undefined = undefined\n\n\t\tif (element) {\n\t\t\tfunction debouncedHandler(event: Event) {\n\t\t\t\tclearTimeout(timeoutID)\n\n\t\t\t\tconst delta = event.timeStamp - lastTimeStamp.current\n\t\t\t\tscopedConsoleRef.current.logged('event:element.scroll:delta', delta)\n\n\t\t\t\tif (delta > interval) {\n\t\t\t\t\tscopedConsoleRef.current.warned('event:element.scroll:immediately', event)\n\t\t\t\t\tcallbackRef.current(event)\n\t\t\t\t\tlastTimeStamp.current = event.timeStamp\n\t\t\t\t} else {\n\t\t\t\t\ttimeoutID = setTimeout(() => {\n\t\t\t\t\t\tscopedConsoleRef.current.warned('event:element.scroll:debounced', event)\n\t\t\t\t\t\tlastTimeStamp.current = event.timeStamp\n\t\t\t\t\t\tcallbackRef.current(event)\n\t\t\t\t\t}, interval)\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif (element instanceof HTMLElement) {\n\t\t\t\tif (element instanceof HTMLBodyElement || element instanceof HTMLHtmlElement) {\n\t\t\t\t\twindow.addEventListener('scroll', debouncedHandler, { capture: true, passive: true })\n\t\t\t\t\twindow.addEventListener('resize', debouncedHandler)\n\n\t\t\t\t\treturn () => {\n\t\t\t\t\t\twindow.removeEventListener('scroll', debouncedHandler)\n\t\t\t\t\t\twindow.removeEventListener('resize', debouncedHandler)\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\telement.addEventListener('scroll', debouncedHandler, { passive: true, capture: true })\n\n\t\t\t\t\treturn () => {\n\t\t\t\t\t\telement.removeEventListener('scroll', debouncedHandler)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tthrow new Error('Exhaustive error: Expecting element to be instance of HTMLElement')\n\t\t\t}\n\t\t}\n\t}, [interval, refOrElement, scopedConsoleRef])\n}\n"],"names":["useScopedConsoleRef","useRef","useLayoutEffect","unwrapRefValue"],"mappings":";;;;;AAWO,SAAS,kBACf,cACA,UACA,WAAmB,MAAO,IACzB;AACK,QAAA,mBAAmBA,4BAAoB,mBAAmB;AAE1D,QAAA,cAAcC,aAAO,QAAQ;AAAG,cAAY,UAAU;AACtD,QAAA,gBAAgBA,aAAe,CAAC;AAEtCC,QAAAA,gBAAgB,MAAM;AACf,UAAA,UAAUC,8BAAe,YAAY;AAE3C,QAAI,YAAgC;AAEpC,QAAI,SAAS;AACH,UAAA,mBAAT,SAA0B,OAAc;AACvC,qBAAa,SAAS;AAEhB,cAAA,QAAQ,MAAM,YAAY,cAAc;AAC7B,yBAAA,QAAQ,OAAO,8BAA8B,KAAK;AAEnE,YAAI,QAAQ,UAAU;AACJ,2BAAA,QAAQ,OAAO,oCAAoC,KAAK;AACzE,sBAAY,QAAQ,KAAK;AACzB,wBAAc,UAAU,MAAM;AAAA,QAAA,OACxB;AACN,sBAAY,WAAW,MAAM;AACX,6BAAA,QAAQ,OAAO,kCAAkC,KAAK;AACvE,0BAAc,UAAU,MAAM;AAC9B,wBAAY,QAAQ,KAAK;AAAA,aACvB,QAAQ;AAAA,QACZ;AAAA,MAAA;AAGD,UAAI,mBAAmB,aAAa;AAC/B,YAAA,mBAAmB,mBAAmB,mBAAmB,iBAAiB;AACtE,iBAAA,iBAAiB,UAAU,kBAAkB,EAAE,SAAS,MAAM,SAAS,MAAM;AAC7E,iBAAA,iBAAiB,UAAU,gBAAgB;AAElD,iBAAO,MAAM;AACL,mBAAA,oBAAoB,UAAU,gBAAgB;AAC9C,mBAAA,oBAAoB,UAAU,gBAAgB;AAAA,UAAA;AAAA,QACtD,OACM;AACE,kBAAA,iBAAiB,UAAU,kBAAkB,EAAE,SAAS,MAAM,SAAS,MAAM;AAErF,iBAAO,MAAM;AACJ,oBAAA,oBAAoB,UAAU,gBAAgB;AAAA,UAAA;AAAA,QAExD;AAAA,MAAA,OACM;AACA,cAAA,IAAI,MAAM,mEAAmE;AAAA,MACpF;AAAA,IACD;AAAA,EACE,GAAA,CAAC,UAAU,cAAc,gBAAgB,CAAC;AAC9C;;"}
|