@elliemae/ds-utilities 3.36.0-rc.0 → 3.37.0-next.0
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/cjs/addComponentIfNotExists.js +1 -2
- package/dist/cjs/addComponentIfNotExists.js.map +1 -1
- package/dist/cjs/algorithms/crossTypeSort.js +16 -32
- package/dist/cjs/algorithms/crossTypeSort.js.map +1 -1
- package/dist/cjs/deprecated/reactTypesUtility.js.map +1 -1
- package/dist/cjs/deprecated/scrollingTimer.js +1 -2
- package/dist/cjs/deprecated/scrollingTimer.js.map +1 -1
- package/dist/cjs/deprecated/useParentElement.js +1 -2
- package/dist/cjs/deprecated/useParentElement.js.map +1 -1
- package/dist/cjs/deprecated/useSetRef.js.map +1 -1
- package/dist/cjs/deprecated/useUncontrolled.js.map +1 -1
- package/dist/cjs/deprecated/useWindowSize.js +2 -4
- package/dist/cjs/deprecated/useWindowSize.js.map +1 -1
- package/dist/cjs/findInCircularList.js +1 -2
- package/dist/cjs/findInCircularList.js.map +1 -1
- package/dist/cjs/getComponentFromProps.js +1 -2
- package/dist/cjs/getComponentFromProps.js.map +1 -1
- package/dist/cjs/getHighlightedRerendersStyle.js.map +1 -1
- package/dist/cjs/hooks/index.js.map +3 -3
- package/dist/cjs/hooks/useControlledUncontrolledState.js +2 -4
- package/dist/cjs/hooks/useControlledUncontrolledState.js.map +1 -1
- package/dist/cjs/hooks/useExecutionTimer.js +2 -4
- package/dist/cjs/hooks/useExecutionTimer.js.map +1 -1
- package/dist/cjs/hooks/useExpandState.js +1 -2
- package/dist/cjs/hooks/useExpandState.js.map +1 -1
- package/dist/cjs/hooks/useHeadlessTooltip.js +4 -8
- package/dist/cjs/hooks/useHeadlessTooltip.js.map +1 -1
- package/dist/cjs/hooks/useHoverHandlersDelay.js +2 -4
- package/dist/cjs/hooks/useHoverHandlersDelay.js.map +1 -1
- package/dist/cjs/hooks/useNativeIntersectionObserver.js +1 -2
- package/dist/cjs/hooks/useNativeIntersectionObserver.js.map +1 -1
- package/dist/cjs/hooks/useNativeResizeObserver.js +1 -2
- package/dist/cjs/hooks/useNativeResizeObserver.js.map +1 -1
- package/dist/cjs/hooks/useOnElementResize.js +2 -4
- package/dist/cjs/hooks/useOnElementResize.js.map +1 -1
- package/dist/cjs/hooks/useOnSpecificFocus.js +1 -2
- package/dist/cjs/hooks/useOnSpecificFocus.js.map +1 -1
- package/dist/cjs/hooks/useResizeObserver.js +4 -8
- package/dist/cjs/hooks/useResizeObserver.js.map +1 -1
- package/dist/cjs/hooks/useWindowScrollerList.js +2 -4
- package/dist/cjs/hooks/useWindowScrollerList.js.map +1 -1
- package/dist/cjs/index.js +4 -4
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/objectUtilities.js +2 -4
- package/dist/cjs/objectUtilities.js.map +1 -1
- package/dist/cjs/onClickHandlerForNonInteractiveElements.js +2 -4
- package/dist/cjs/onClickHandlerForNonInteractiveElements.js.map +1 -1
- package/dist/cjs/operators.js +1 -2
- package/dist/cjs/operators.js.map +1 -1
- package/dist/cjs/system.js +1 -2
- package/dist/cjs/system.js.map +1 -1
- package/dist/cjs/utils.js +2 -4
- package/dist/cjs/utils.js.map +1 -1
- package/dist/cjs/validations.js.map +1 -1
- package/dist/esm/addComponentIfNotExists.js +1 -2
- package/dist/esm/addComponentIfNotExists.js.map +1 -1
- package/dist/esm/algorithms/crossTypeSort.js +16 -32
- package/dist/esm/algorithms/crossTypeSort.js.map +1 -1
- package/dist/esm/deprecated/reactTypesUtility.js.map +1 -1
- package/dist/esm/deprecated/scrollingTimer.js +1 -2
- package/dist/esm/deprecated/scrollingTimer.js.map +1 -1
- package/dist/esm/deprecated/useParentElement.js +1 -2
- package/dist/esm/deprecated/useParentElement.js.map +1 -1
- package/dist/esm/deprecated/useSetRef.js.map +1 -1
- package/dist/esm/deprecated/useUncontrolled.js.map +1 -1
- package/dist/esm/deprecated/useWindowSize.js +2 -4
- package/dist/esm/deprecated/useWindowSize.js.map +1 -1
- package/dist/esm/findInCircularList.js +1 -2
- package/dist/esm/findInCircularList.js.map +1 -1
- package/dist/esm/getComponentFromProps.js +1 -2
- package/dist/esm/getComponentFromProps.js.map +1 -1
- package/dist/esm/getHighlightedRerendersStyle.js.map +1 -1
- package/dist/esm/hooks/index.js +6 -6
- package/dist/esm/hooks/index.js.map +3 -3
- package/dist/esm/hooks/useControlledUncontrolledState.js +2 -4
- package/dist/esm/hooks/useControlledUncontrolledState.js.map +1 -1
- package/dist/esm/hooks/useExecutionTimer.js +2 -4
- package/dist/esm/hooks/useExecutionTimer.js.map +1 -1
- package/dist/esm/hooks/useExpandState.js +1 -2
- package/dist/esm/hooks/useExpandState.js.map +1 -1
- package/dist/esm/hooks/useHeadlessTooltip.js +4 -8
- package/dist/esm/hooks/useHeadlessTooltip.js.map +1 -1
- package/dist/esm/hooks/useHoverHandlersDelay.js +2 -4
- package/dist/esm/hooks/useHoverHandlersDelay.js.map +1 -1
- package/dist/esm/hooks/useNativeIntersectionObserver.js +1 -2
- package/dist/esm/hooks/useNativeIntersectionObserver.js.map +1 -1
- package/dist/esm/hooks/useNativeResizeObserver.js +1 -2
- package/dist/esm/hooks/useNativeResizeObserver.js.map +1 -1
- package/dist/esm/hooks/useOnElementResize.js +2 -4
- package/dist/esm/hooks/useOnElementResize.js.map +1 -1
- package/dist/esm/hooks/useOnSpecificFocus.js +1 -2
- package/dist/esm/hooks/useOnSpecificFocus.js.map +1 -1
- package/dist/esm/hooks/useResizeObserver.js +4 -8
- package/dist/esm/hooks/useResizeObserver.js.map +1 -1
- package/dist/esm/hooks/useWindowScrollerList.js +2 -4
- package/dist/esm/hooks/useWindowScrollerList.js.map +1 -1
- package/dist/esm/index.js +4 -4
- package/dist/esm/index.js.map +3 -3
- package/dist/esm/objectUtilities.js +2 -4
- package/dist/esm/objectUtilities.js.map +1 -1
- package/dist/esm/onClickHandlerForNonInteractiveElements.js +2 -4
- package/dist/esm/onClickHandlerForNonInteractiveElements.js.map +1 -1
- package/dist/esm/operators.js +1 -2
- package/dist/esm/operators.js.map +1 -1
- package/dist/esm/system.js +1 -2
- package/dist/esm/system.js.map +1 -1
- package/dist/esm/utils.js +2 -4
- package/dist/esm/utils.js.map +1 -1
- package/dist/esm/validations.js.map +1 -1
- package/dist/types/hooks/index.d.ts +4 -3
- package/dist/types/hooks/useNativeIntersectionObserver.d.ts +1 -1
- package/dist/types/hooks/useOwnerProps.d.ts +1 -1
- package/dist/types/index.d.ts +2 -2
- package/package.json +7 -7
|
@@ -37,8 +37,7 @@ var import_react_dom = require("react-dom");
|
|
|
37
37
|
const appendComponentIfNotExist = async (props) => {
|
|
38
38
|
const { Component, parentVisibility = "hidden", uidSelector, tagName = "span" } = props;
|
|
39
39
|
const elementAttached = document.getElementById(uidSelector);
|
|
40
|
-
if (elementAttached)
|
|
41
|
-
return elementAttached;
|
|
40
|
+
if (elementAttached) return elementAttached;
|
|
42
41
|
const rootElement = document.createElement(tagName);
|
|
43
42
|
rootElement.style.visibility = parentVisibility;
|
|
44
43
|
rootElement.style.position = "absolute";
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/addComponentIfNotExists.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import { render } from 'react-dom';\n\ninterface AppendComponentIfNotExistConfigT {\n Component: React.FC;\n parentVisibility?: string;\n uidSelector: string;\n tagName: string;\n}\n\n// appendComponentIfNotExist is a function that appends a component to the DOM if it does not exist\n// it returns the element appended\n//\nexport const appendComponentIfNotExist = async (props: AppendComponentIfNotExistConfigT) => {\n const { Component, parentVisibility = 'hidden', uidSelector, tagName = 'span' } = props;\n\n // if elementAttached exists we return it\n const elementAttached = document.getElementById(uidSelector);\n if (elementAttached) return elementAttached;\n const rootElement = document.createElement(tagName);\n rootElement.style.visibility = parentVisibility;\n // we set the rootElement to be absolute and on top to avoid adding scrollbars\n rootElement.style.position = 'absolute';\n rootElement.style.top = '0';\n // we wait for the component to be rendered and then we return the element appended\n const element = await new Promise<HTMLElement>((resolve) => {\n render(<Component />, document.body.appendChild(rootElement));\n requestAnimationFrame(() => {\n resolve(document.getElementById(uidSelector) as HTMLElement);\n });\n });\n return element;\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADyBZ;AAzBX,uBAAuB;AAYhB,MAAM,4BAA4B,OAAO,UAA4C;AAC1F,QAAM,EAAE,WAAW,mBAAmB,UAAU,aAAa,UAAU,OAAO,IAAI;AAGlF,QAAM,kBAAkB,SAAS,eAAe,WAAW;AAC3D,MAAI
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADyBZ;AAzBX,uBAAuB;AAYhB,MAAM,4BAA4B,OAAO,UAA4C;AAC1F,QAAM,EAAE,WAAW,mBAAmB,UAAU,aAAa,UAAU,OAAO,IAAI;AAGlF,QAAM,kBAAkB,SAAS,eAAe,WAAW;AAC3D,MAAI,gBAAiB,QAAO;AAC5B,QAAM,cAAc,SAAS,cAAc,OAAO;AAClD,cAAY,MAAM,aAAa;AAE/B,cAAY,MAAM,WAAW;AAC7B,cAAY,MAAM,MAAM;AAExB,QAAM,UAAU,MAAM,IAAI,QAAqB,CAAC,YAAY;AAC1D,iCAAO,4CAAC,aAAU,GAAI,SAAS,KAAK,YAAY,WAAW,CAAC;AAC5D,0BAAsB,MAAM;AAC1B,cAAQ,SAAS,eAAe,WAAW,CAAgB;AAAA,IAC7D,CAAC;AAAA,EACH,CAAC;AACD,SAAO;AACT;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -37,34 +37,22 @@ const numberSort = (a, b, direction = "ASC") => {
|
|
|
37
37
|
if (canBeParsedAsNumber(a) && canBeParsedAsNumber(b)) {
|
|
38
38
|
const aAsNum = parseFloat(a);
|
|
39
39
|
const bAsNum = parseFloat(b);
|
|
40
|
-
if (direction === "ASC")
|
|
41
|
-
|
|
42
|
-
else
|
|
43
|
-
return bAsNum - aAsNum;
|
|
40
|
+
if (direction === "ASC") return aAsNum - bAsNum;
|
|
41
|
+
else return bAsNum - aAsNum;
|
|
44
42
|
}
|
|
45
|
-
if (canBeParsedAsNumber(a))
|
|
46
|
-
|
|
47
|
-
if (canBeParsedAsNumber(b))
|
|
48
|
-
return direction === "ASC" ? 1 : -1;
|
|
43
|
+
if (canBeParsedAsNumber(a)) return direction === "ASC" ? -1 : 1;
|
|
44
|
+
if (canBeParsedAsNumber(b)) return direction === "ASC" ? 1 : -1;
|
|
49
45
|
return false;
|
|
50
46
|
};
|
|
51
47
|
const voidishSort = (a, b) => {
|
|
52
|
-
if (a === void 0)
|
|
53
|
-
|
|
54
|
-
if (
|
|
55
|
-
|
|
56
|
-
if (a ===
|
|
57
|
-
|
|
58
|
-
if (
|
|
59
|
-
|
|
60
|
-
if (a === "")
|
|
61
|
-
return 1;
|
|
62
|
-
if (b === "")
|
|
63
|
-
return -1;
|
|
64
|
-
if (a === "-")
|
|
65
|
-
return 1;
|
|
66
|
-
if (b === "-")
|
|
67
|
-
return -1;
|
|
48
|
+
if (a === void 0) return 1;
|
|
49
|
+
if (b === void 0) return -1;
|
|
50
|
+
if (a === null) return 1;
|
|
51
|
+
if (b === null) return -1;
|
|
52
|
+
if (a === "") return 1;
|
|
53
|
+
if (b === "") return -1;
|
|
54
|
+
if (a === "-") return 1;
|
|
55
|
+
if (b === "-") return -1;
|
|
68
56
|
return false;
|
|
69
57
|
};
|
|
70
58
|
const stringSort = (a, b, direction = "ASC") => {
|
|
@@ -73,17 +61,13 @@ const stringSort = (a, b, direction = "ASC") => {
|
|
|
73
61
|
return false;
|
|
74
62
|
};
|
|
75
63
|
const crossTypeSort = (a, b, direction = "ASC") => {
|
|
76
|
-
if (a === b)
|
|
77
|
-
return 0;
|
|
64
|
+
if (a === b) return 0;
|
|
78
65
|
const voidishSorted = voidishSort(a, b, direction);
|
|
79
|
-
if (voidishSorted !== false)
|
|
80
|
-
return voidishSorted;
|
|
66
|
+
if (voidishSorted !== false) return voidishSorted;
|
|
81
67
|
const numberSorted = numberSort(a, b, direction);
|
|
82
|
-
if (numberSorted !== false)
|
|
83
|
-
return numberSorted;
|
|
68
|
+
if (numberSorted !== false) return numberSorted;
|
|
84
69
|
const stringSorted = stringSort(a, b, direction);
|
|
85
|
-
if (stringSorted !== false)
|
|
86
|
-
return stringSorted;
|
|
70
|
+
if (stringSorted !== false) return stringSorted;
|
|
87
71
|
return -1;
|
|
88
72
|
};
|
|
89
73
|
//# sourceMappingURL=crossTypeSort.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/algorithms/crossTypeSort.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["type ComparisonTerm = string | number | null | undefined;\ntype Direction = 'ASC' | 'DESC';\ntype SortCB = Required<Parameters<(typeof Array.prototype)['sort']>>[0];\ntype SortingHelper = (a: ComparisonTerm, b: ComparisonTerm, direction?: Direction) => ReturnType<SortCB> | false;\n\nconst canBeParsedAsNumber = (val: ComparisonTerm): val is string => !Number.isNaN(parseFloat(val as string));\n\nconst numberSort: SortingHelper = (a, b, direction = 'ASC') => {\n if (canBeParsedAsNumber(a) && canBeParsedAsNumber(b)) {\n const aAsNum = parseFloat(a);\n const bAsNum = parseFloat(b);\n if (direction === 'ASC') return aAsNum - bAsNum;\n else return bAsNum - aAsNum;\n }\n if (canBeParsedAsNumber(a)) return direction === 'ASC' ? -1 : 1;\n if (canBeParsedAsNumber(b)) return direction === 'ASC' ? 1 : -1;\n return false;\n};\nconst voidishSort: SortingHelper = (a, b) => {\n // voids are always sorted the same way no matter the direction since it's more ux intuitive\n // order of execution matters, this ensure the order '-' , '', null, undefined\n if (a === undefined) return 1;\n if (b === undefined) return -1;\n if (a === null) return 1;\n if (b === null) return -1;\n if (a === '') return 1;\n if (b === '') return -1;\n if (a === '-') return 1;\n if (b === '-') return -1;\n return false;\n};\nconst stringSort: SortingHelper = (a, b, direction = 'ASC') => {\n if (typeof a === 'string' && typeof b === 'string')\n return direction === 'ASC'\n ? a.localeCompare(b, undefined, { numeric: true })\n : b.localeCompare(a, undefined, { numeric: true });\n return false;\n};\n\nexport const crossTypeSort = (\n a: ComparisonTerm,\n b: ComparisonTerm,\n direction: Direction = 'ASC',\n): ReturnType<SortCB> => {\n if (a === b) return 0;\n const voidishSorted = voidishSort(a, b, direction);\n if (voidishSorted !== false) return voidishSorted;\n\n const numberSorted = numberSort(a, b, direction);\n if (numberSorted !== false) return numberSorted;\n\n const stringSorted = stringSort(a, b, direction);\n if (stringSorted !== false) return stringSorted;\n return -1;\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADKvB,MAAM,sBAAsB,CAAC,QAAuC,CAAC,OAAO,MAAM,WAAW,GAAa,CAAC;AAE3G,MAAM,aAA4B,CAAC,GAAG,GAAG,YAAY,UAAU;AAC7D,MAAI,oBAAoB,CAAC,KAAK,oBAAoB,CAAC,GAAG;AACpD,UAAM,SAAS,WAAW,CAAC;AAC3B,UAAM,SAAS,WAAW,CAAC;AAC3B,QAAI,cAAc
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADKvB,MAAM,sBAAsB,CAAC,QAAuC,CAAC,OAAO,MAAM,WAAW,GAAa,CAAC;AAE3G,MAAM,aAA4B,CAAC,GAAG,GAAG,YAAY,UAAU;AAC7D,MAAI,oBAAoB,CAAC,KAAK,oBAAoB,CAAC,GAAG;AACpD,UAAM,SAAS,WAAW,CAAC;AAC3B,UAAM,SAAS,WAAW,CAAC;AAC3B,QAAI,cAAc,MAAO,QAAO,SAAS;AAAA,QACpC,QAAO,SAAS;AAAA,EACvB;AACA,MAAI,oBAAoB,CAAC,EAAG,QAAO,cAAc,QAAQ,KAAK;AAC9D,MAAI,oBAAoB,CAAC,EAAG,QAAO,cAAc,QAAQ,IAAI;AAC7D,SAAO;AACT;AACA,MAAM,cAA6B,CAAC,GAAG,MAAM;AAG3C,MAAI,MAAM,OAAW,QAAO;AAC5B,MAAI,MAAM,OAAW,QAAO;AAC5B,MAAI,MAAM,KAAM,QAAO;AACvB,MAAI,MAAM,KAAM,QAAO;AACvB,MAAI,MAAM,GAAI,QAAO;AACrB,MAAI,MAAM,GAAI,QAAO;AACrB,MAAI,MAAM,IAAK,QAAO;AACtB,MAAI,MAAM,IAAK,QAAO;AACtB,SAAO;AACT;AACA,MAAM,aAA4B,CAAC,GAAG,GAAG,YAAY,UAAU;AAC7D,MAAI,OAAO,MAAM,YAAY,OAAO,MAAM;AACxC,WAAO,cAAc,QACjB,EAAE,cAAc,GAAG,QAAW,EAAE,SAAS,KAAK,CAAC,IAC/C,EAAE,cAAc,GAAG,QAAW,EAAE,SAAS,KAAK,CAAC;AACrD,SAAO;AACT;AAEO,MAAM,gBAAgB,CAC3B,GACA,GACA,YAAuB,UACA;AACvB,MAAI,MAAM,EAAG,QAAO;AACpB,QAAM,gBAAgB,YAAY,GAAG,GAAG,SAAS;AACjD,MAAI,kBAAkB,MAAO,QAAO;AAEpC,QAAM,eAAe,WAAW,GAAG,GAAG,SAAS;AAC/C,MAAI,iBAAiB,MAAO,QAAO;AAEnC,QAAM,eAAe,WAAW,GAAG,GAAG,SAAS;AAC/C,MAAI,iBAAiB,MAAO,QAAO;AACnC,SAAO;AACT;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/deprecated/reactTypesUtility.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable no-console */\n/* eslint-disable @typescript-eslint/no-explicit-any */\n/* eslint-disable @typescript-eslint/no-unsafe-member-access */\nimport React from 'react';\nimport { deprecatedMsg } from './deprecatedMsg.js';\n\nexport function isClassComponent(component: any) {\n console.warn(`isClassComponent ${deprecatedMsg}`);\n return !!(typeof component === 'function' && !!component.prototype.isReactComponent);\n}\n\nexport function isFunctionComponent(component: any) {\n console.warn(`isFunctionComponent ${deprecatedMsg}`);\n return typeof component === 'function' && String(component).includes('return React.createElement');\n}\n\nexport function isReactComponent(component: any) {\n console.warn(`isReactComponent ${deprecatedMsg}`);\n return !!(isClassComponent(component) || isFunctionComponent(component));\n}\n\nexport function isElement(element: Record<string, unknown> | null | undefined) {\n console.warn(`isElement ${deprecatedMsg}`);\n return React.isValidElement(element);\n}\n\nexport function isCompositeTypeElement(element: Record<string, unknown> | null | undefined) {\n console.warn(`isCompositeTypeElement ${deprecatedMsg}`);\n return isElement(element) && typeof element?.type === 'function';\n}\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,mBAAkB;AAClB,2BAA8B;AAEvB,SAAS,iBAAiB,WAAgB;AAC/C,UAAQ,KAAK,oBAAoB,
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,mBAAkB;AAClB,2BAA8B;AAEvB,SAAS,iBAAiB,WAAgB;AAC/C,UAAQ,KAAK,oBAAoB,kCAAa,EAAE;AAChD,SAAO,CAAC,EAAE,OAAO,cAAc,cAAc,CAAC,CAAC,UAAU,UAAU;AACrE;AAEO,SAAS,oBAAoB,WAAgB;AAClD,UAAQ,KAAK,uBAAuB,kCAAa,EAAE;AACnD,SAAO,OAAO,cAAc,cAAc,OAAO,SAAS,EAAE,SAAS,4BAA4B;AACnG;AAEO,SAAS,iBAAiB,WAAgB;AAC/C,UAAQ,KAAK,oBAAoB,kCAAa,EAAE;AAChD,SAAO,CAAC,EAAE,iBAAiB,SAAS,KAAK,oBAAoB,SAAS;AACxE;AAEO,SAAS,UAAU,SAAqD;AAC7E,UAAQ,KAAK,aAAa,kCAAa,EAAE;AACzC,SAAO,aAAAA,QAAM,eAAe,OAAO;AACrC;AAEO,SAAS,uBAAuB,SAAqD;AAC1F,UAAQ,KAAK,0BAA0B,kCAAa,EAAE;AACtD,SAAO,UAAU,OAAO,KAAK,OAAO,SAAS,SAAS;AACxD;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/deprecated/scrollingTimer.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable no-console */\n/* eslint-disable @typescript-eslint/no-explicit-any */\n/* eslint-disable func-names */\nimport { deprecatedMsg } from './deprecatedMsg.js';\n\nexport const resetTimer = (func: (...args: unknown[]) => unknown) => {\n console.warn(`resetTimer ${deprecatedMsg}`);\n let timeout: NodeJS.Timeout | null;\n return function (this: any, ...args: unknown[]) {\n const lastCall = () => {\n timeout = null;\n func.apply(this, args);\n };\n\n if (timeout) clearTimeout(timeout);\n timeout = setTimeout(lastCall, 300);\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,2BAA8B;AAEvB,MAAM,aAAa,CAAC,SAA0C;AACnE,UAAQ,KAAK,cAAc,
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,2BAA8B;AAEvB,MAAM,aAAa,CAAC,SAA0C;AACnE,UAAQ,KAAK,cAAc,kCAAa,EAAE;AAC1C,MAAI;AACJ,SAAO,YAAwB,MAAiB;AAC9C,UAAM,WAAW,MAAM;AACrB,gBAAU;AACV,WAAK,MAAM,MAAM,IAAI;AAAA,IACvB;AAEA,QAAI,QAAS,cAAa,OAAO;AACjC,cAAU,WAAW,UAAU,GAAG;AAAA,EACpC;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -36,8 +36,7 @@ var import_react = require("react");
|
|
|
36
36
|
const useParentElement = (ref) => {
|
|
37
37
|
const [parent, setParent] = (0, import_react.useState)(ref.current);
|
|
38
38
|
(0, import_react.useEffect)(() => {
|
|
39
|
-
if (ref.current)
|
|
40
|
-
setParent(ref.current.parentNode);
|
|
39
|
+
if (ref.current) setParent(ref.current.parentNode);
|
|
41
40
|
});
|
|
42
41
|
return parent;
|
|
43
42
|
};
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/deprecated/useParentElement.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import type React from 'react';\nimport { useEffect, useState } from 'react';\n\nexport const useParentElement = (ref: React.RefObject<HTMLElement>) => {\n const [parent, setParent] = useState<ParentNode | null>(ref.current);\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useEffect(() => {\n if (ref.current) setParent(ref.current.parentNode);\n });\n return parent;\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAoC;AAE7B,MAAM,mBAAmB,CAAC,QAAsC;AACrE,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAA4B,IAAI,OAAO;AAGnE,8BAAU,MAAM;AACd,QAAI,IAAI
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAoC;AAE7B,MAAM,mBAAmB,CAAC,QAAsC;AACrE,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAA4B,IAAI,OAAO;AAGnE,8BAAU,MAAM;AACd,QAAI,IAAI,QAAS,WAAU,IAAI,QAAQ,UAAU;AAAA,EACnD,CAAC;AACD,SAAO;AACT;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/deprecated/useSetRef.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable no-console, @typescript-eslint/ban-ts-comment */\n// @ts-nocheck\nimport { useCallback, useRef } from 'react';\nimport { deprecatedMsg } from './deprecatedMsg.js';\n\nexport const useSetRef = (initial: unknown) => {\n console.warn(`useSetRef ${deprecatedMsg}`);\n const ref = useRef(initial);\n const setRef = useCallback((node) => {\n ref.current = node;\n }, []);\n return [ref, setRef];\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,mBAAoC;AACpC,2BAA8B;AAEvB,MAAM,YAAY,CAAC,YAAqB;AAC7C,UAAQ,KAAK,aAAa,
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,mBAAoC;AACpC,2BAA8B;AAEvB,MAAM,YAAY,CAAC,YAAqB;AAC7C,UAAQ,KAAK,aAAa,kCAAa,EAAE;AACzC,QAAM,UAAM,qBAAO,OAAO;AAC1B,QAAM,aAAS,0BAAY,CAAC,SAAS;AACnC,QAAI,UAAU;AAAA,EAChB,GAAG,CAAC,CAAC;AACL,SAAO,CAAC,KAAK,MAAM;AACrB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/deprecated/useUncontrolled.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable no-console */\n/* eslint-disable @typescript-eslint/no-unsafe-argument */\n/* eslint-disable @typescript-eslint/no-unsafe-call */\n/* eslint-disable @typescript-eslint/no-unsafe-return */\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { useUncontrolled as useUncontrolledImplementation } from 'uncontrollable';\nimport { deprecatedMsg } from './deprecatedMsg.js';\n\nexport const useUncontrolled = (...args: any[]) => {\n console.warn(`useUncontrolled ${deprecatedMsg}`);\n return useUncontrolledImplementation(...args);\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADKvB,4BAAiE;AACjE,2BAA8B;AAEvB,MAAM,kBAAkB,IAAI,SAAgB;AACjD,UAAQ,KAAK,mBAAmB,
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADKvB,4BAAiE;AACjE,2BAA8B;AAEvB,MAAM,kBAAkB,IAAI,SAAgB;AACjD,UAAQ,KAAK,mBAAmB,kCAAa,EAAE;AAC/C,aAAO,sBAAAA,iBAA8B,GAAG,IAAI;AAC9C;",
|
|
6
6
|
"names": ["useUncontrolledImplementation"]
|
|
7
7
|
}
|
|
@@ -41,8 +41,7 @@ const useWindowSize = () => {
|
|
|
41
41
|
console.warn(`useWindowSize ${import_deprecatedMsg.deprecatedMsg}`);
|
|
42
42
|
const [size, setSize] = (0, import_react.useState)([0, 0]);
|
|
43
43
|
(0, import_react.useLayoutEffect)(() => {
|
|
44
|
-
if (!window)
|
|
45
|
-
return noop;
|
|
44
|
+
if (!window) return noop;
|
|
46
45
|
function updateSize() {
|
|
47
46
|
setSize([window.innerWidth, window.innerHeight]);
|
|
48
47
|
}
|
|
@@ -54,8 +53,7 @@ const useWindowSize = () => {
|
|
|
54
53
|
window.removeEventListener("orientationchange", updateSize);
|
|
55
54
|
};
|
|
56
55
|
}, []);
|
|
57
|
-
if (!window)
|
|
58
|
-
return noop;
|
|
56
|
+
if (!window) return noop;
|
|
59
57
|
return size;
|
|
60
58
|
};
|
|
61
59
|
var useWindowSize_default = useWindowSize;
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/deprecated/useWindowSize.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable no-console */\nimport { useLayoutEffect, useState } from 'react';\nimport { deprecatedMsg } from './deprecatedMsg.js';\n\nconst noop = () => {};\n\nexport const useWindowSize = () => {\n console.warn(`useWindowSize ${deprecatedMsg}`);\n const [size, setSize] = useState([0, 0]);\n useLayoutEffect(() => {\n if (!window) return noop;\n function updateSize() {\n setSize([window.innerWidth, window.innerHeight]);\n }\n window.addEventListener('resize', updateSize);\n window.addEventListener('orientationchange', updateSize);\n updateSize();\n return () => {\n window.removeEventListener('resize', updateSize);\n window.removeEventListener('orientationchange', updateSize);\n };\n }, []);\n if (!window) return noop;\n return size;\n};\n\nexport default useWindowSize;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAA0C;AAC1C,2BAA8B;AAE9B,MAAM,OAAO,MAAM;AAAC;AAEb,MAAM,gBAAgB,MAAM;AACjC,UAAQ,KAAK,iBAAiB,
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAA0C;AAC1C,2BAA8B;AAE9B,MAAM,OAAO,MAAM;AAAC;AAEb,MAAM,gBAAgB,MAAM;AACjC,UAAQ,KAAK,iBAAiB,kCAAa,EAAE;AAC7C,QAAM,CAAC,MAAM,OAAO,QAAI,uBAAS,CAAC,GAAG,CAAC,CAAC;AACvC,oCAAgB,MAAM;AACpB,QAAI,CAAC,OAAQ,QAAO;AACpB,aAAS,aAAa;AACpB,cAAQ,CAAC,OAAO,YAAY,OAAO,WAAW,CAAC;AAAA,IACjD;AACA,WAAO,iBAAiB,UAAU,UAAU;AAC5C,WAAO,iBAAiB,qBAAqB,UAAU;AACvD,eAAW;AACX,WAAO,MAAM;AACX,aAAO,oBAAoB,UAAU,UAAU;AAC/C,aAAO,oBAAoB,qBAAqB,UAAU;AAAA,IAC5D;AAAA,EACF,GAAG,CAAC,CAAC;AACL,MAAI,CAAC,OAAQ,QAAO;AACpB,SAAO;AACT;AAEA,IAAO,wBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -34,8 +34,7 @@ module.exports = __toCommonJS(findInCircularList_exports);
|
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
35
|
const findInCircularList = (list, from, criteria = () => true, step = 1) => {
|
|
36
36
|
for (let i = (from + step + list.length) % list.length; i !== from && from > -1; i = (i + step + list.length) % list.length) {
|
|
37
|
-
if (criteria(list[i]))
|
|
38
|
-
return i;
|
|
37
|
+
if (criteria(list[i])) return i;
|
|
39
38
|
}
|
|
40
39
|
return from;
|
|
41
40
|
};
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/findInCircularList.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["export const findInCircularList = <T,>(\n list: T[],\n from: number,\n criteria: (item: T) => boolean = () => true,\n step = 1,\n // eslint-disable-next-line max-params\n): number => {\n for (\n let i = (from + step + list.length) % list.length;\n i !== from && from > -1;\n i = (i + step + list.length) % list.length\n ) {\n if (criteria(list[i])) return i;\n }\n\n return from; // return same item\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,qBAAqB,CAChC,MACA,MACA,WAAiC,MAAM,MACvC,OAAO,MAEI;AACX,WACM,KAAK,OAAO,OAAO,KAAK,UAAU,KAAK,QAC3C,MAAM,QAAQ,OAAO,IACrB,KAAK,IAAI,OAAO,KAAK,UAAU,KAAK,QACpC;AACA,QAAI,SAAS,KAAK,CAAC,CAAC
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,qBAAqB,CAChC,MACA,MACA,WAAiC,MAAM,MACvC,OAAO,MAEI;AACX,WACM,KAAK,OAAO,OAAO,KAAK,UAAU,KAAK,QAC3C,MAAM,QAAQ,OAAO,IACrB,KAAK,IAAI,OAAO,KAAK,UAAU,KAAK,QACpC;AACA,QAAI,SAAS,KAAK,CAAC,CAAC,EAAG,QAAO;AAAA,EAChC;AAEA,SAAO;AACT;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -36,8 +36,7 @@ var React = __toESM(require("react"));
|
|
|
36
36
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
37
37
|
var import_react = __toESM(require("react"));
|
|
38
38
|
const getComponentFromProps = (Component, props, children = []) => {
|
|
39
|
-
if (!Component)
|
|
40
|
-
return null;
|
|
39
|
+
if (!Component) return null;
|
|
41
40
|
const componentChildren = typeof Component !== "function" && Component.props ? Array.isArray(Component.props.children) ? Component.props.children : [Component.props.children] : null;
|
|
42
41
|
return typeof Component === "function" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, { ...props, children }) : import_react.default.cloneElement(
|
|
43
42
|
Component,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/getComponentFromProps.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable no-nested-ternary, @typescript-eslint/ban-ts-comment */\n// @ts-nocheck\nimport type { PropsWithChildren } from 'react';\nimport React from 'react';\n\nexport const getComponentFromProps = (\n Component: React.ReactElement<PropsWithChildren<unknown>> | React.ComponentType<unknown>,\n props: Record<string, unknown>,\n children = [],\n) => {\n if (!Component) return null;\n const componentChildren =\n typeof Component !== 'function' && Component.props\n ? Array.isArray(Component.props.children)\n ? Component.props.children\n : [Component.props.children]\n : null;\n return typeof Component === 'function' ? (\n <Component {...props}>{children}</Component>\n ) : (\n React.cloneElement(\n Component,\n {\n ...Component.props,\n ...props,\n },\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n componentChildren ? [...componentChildren, ...children] : [...children],\n )\n );\n};\n\nexport default getComponentFromProps;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkBnB;AAfJ,mBAAkB;AAEX,MAAM,wBAAwB,CACnC,WACA,OACA,WAAW,CAAC,MACT;AACH,MAAI,CAAC
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkBnB;AAfJ,mBAAkB;AAEX,MAAM,wBAAwB,CACnC,WACA,OACA,WAAW,CAAC,MACT;AACH,MAAI,CAAC,UAAW,QAAO;AACvB,QAAM,oBACJ,OAAO,cAAc,cAAc,UAAU,QACzC,MAAM,QAAQ,UAAU,MAAM,QAAQ,IACpC,UAAU,MAAM,WAChB,CAAC,UAAU,MAAM,QAAQ,IAC3B;AACN,SAAO,OAAO,cAAc,aAC1B,4CAAC,aAAW,GAAG,OAAQ,UAAS,IAEhC,aAAAA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,MACE,GAAG,UAAU;AAAA,MACb,GAAG;AAAA,IACL;AAAA;AAAA,IAEA,oBAAoB,CAAC,GAAG,mBAAmB,GAAG,QAAQ,IAAI,CAAC,GAAG,QAAQ;AAAA,EACxE;AAEJ;AAEA,IAAO,gCAAQ;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/getHighlightedRerendersStyle.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import type React from 'react';\n\n// a strict type definition for rgb color strings\ntype RGBColorString = `rgb(${number}, ${number}, ${number})`;\n\n/**\n * This function returns a random color string in the format \"rgb(r, g, b)\"\n * This is meant to be used in conjunction with the getHighlightedRerendersStyle function.\n * This is not meant to be used in production, just a development tool.\n * @returns {string} the random color string\n * @example\n * const color = getRandomColor(); // returns 'rgb(255, 255, 255)'\n * const color = getRandomColor(); // returns 'rgb(0, 0, 0)'\n * const color = getRandomColor(); // returns 'rgb(255, 0, 0)'\n * const color = getRandomColor(); // returns 'rgb(0, 255, 0)'\n * // etc...\n */\n\nconst getRandomColor = (): RGBColorString => {\n // generate random values for r, g, and b between 0 and 255\n const r = Math.floor(Math.random() * 256);\n const g = Math.floor(Math.random() * 256);\n const b = Math.floor(Math.random() * 256);\n\n // return the color string in the format \"rgb(r, g, b)\"\n return `rgb(${r}, ${g}, ${b})`;\n};\n\n// type definition for getReadableColor\n\ntype GetReadableColor = (rgbColorString: RGBColorString) => RGBColorString;\n/**\n * This function returns a readable color for the input color string.\n * This is meant to be used in conjunction with the getHighlightedRerendersStyle function.\n * This is not meant to be used in production, just a development tool.\n * @param {RGBColorString} rgbColorString the rgb color string to get a readable color for\n * @returns {RGBColorString} the readable color string\n * @example\n * const textColor = getReadableColor('rgb(255, 255, 255)'); // returns 'rgb(0, 0, 0)'\n * const textColor = getReadableColor('rgb(0, 0, 0)'); // returns 'rgb(255, 255, 255)'\n * const textColor = getReadableColor('rgb(255, 0, 0)'); // returns 'rgb(255, 255, 255)'\n * const textColor = getReadableColor('rgb(0, 255, 0)'); // returns 'rgb(0, 0, 0)'\n * // etc...\n */\nconst getReadableColor: GetReadableColor = (rgbColorString) => {\n // if the input color string is not in the correct format, throw an error\n if (!rgbColorString.match(/^rgb\\(\\d+, \\d+, \\d+\\)$/)) {\n throw new Error(\n `The input color string \"${rgbColorString}\" is not in the correct format. The correct format is \"rgb(r, g, b)\" where r, g, and b are integers between 0 and 255.`,\n );\n }\n // extract the r, g, and b values from the string\n const [r, g, b] = rgbColorString.match(/\\d+/g)?.map((numStr) => parseInt(numStr)) ?? [0, 0, 0];\n\n // calculate the relative luminance of the input color using the sRGB color space\n const luminance = (0.2126 * r + 0.7152 * g + 0.0722 * b) / 255;\n\n // calculate the luminance of black and white colors\n const blackLuminance = 0;\n const whiteLuminance = 1;\n\n // calculate the luminance differences between the input color and black and white\n const luminanceDiffBlack = Math.abs(luminance - blackLuminance);\n const luminanceDiffWhite = Math.abs(luminance - whiteLuminance);\n\n // determine whether the input color is closer to black or white\n const textColor =\n luminanceDiffBlack > luminanceDiffWhite\n ? 'rgb(0, 0, 0)' // use white text for lighter colors\n : 'rgb(255, 255, 255)'; // use black text for darker colors\n\n // return the text color string\n return textColor;\n};\n// type definition for getHighlightedRerendersStyle\n// this function returns an object with the style properties for the highlighted rerenders\n\ntype GetHighlightedRerendersStyle = () => Partial<React.CSSProperties>;\n/**\n * This function returns an object with the style properties for highlighting rerenders.\n * this is meant to be invoked each time a component rerenders to get a new color combination\n * this is not meant to be used in production, just a development tool.\n * @returns {Partial<React.CSSProperties>} an object with the style properties for the highlighted rerenders\n */\nexport const getHighlightedRerendersStyle: GetHighlightedRerendersStyle = () => {\n const randColor = getRandomColor();\n return {\n backgroundColor: randColor,\n color: getReadableColor(randColor),\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkBvB,MAAM,iBAAiB,MAAsB;AAE3C,QAAM,IAAI,KAAK,MAAM,KAAK,OAAO,IAAI,GAAG;AACxC,QAAM,IAAI,KAAK,MAAM,KAAK,OAAO,IAAI,GAAG;AACxC,QAAM,IAAI,KAAK,MAAM,KAAK,OAAO,IAAI,GAAG;AAGxC,SAAO,OAAO,
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkBvB,MAAM,iBAAiB,MAAsB;AAE3C,QAAM,IAAI,KAAK,MAAM,KAAK,OAAO,IAAI,GAAG;AACxC,QAAM,IAAI,KAAK,MAAM,KAAK,OAAO,IAAI,GAAG;AACxC,QAAM,IAAI,KAAK,MAAM,KAAK,OAAO,IAAI,GAAG;AAGxC,SAAO,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC;AAC7B;AAkBA,MAAM,mBAAqC,CAAC,mBAAmB;AAE7D,MAAI,CAAC,eAAe,MAAM,wBAAwB,GAAG;AACnD,UAAM,IAAI;AAAA,MACR,2BAA2B,cAAc;AAAA,IAC3C;AAAA,EACF;AAEA,QAAM,CAAC,GAAG,GAAG,CAAC,IAAI,eAAe,MAAM,MAAM,GAAG,IAAI,CAAC,WAAW,SAAS,MAAM,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC;AAG7F,QAAM,aAAa,SAAS,IAAI,SAAS,IAAI,SAAS,KAAK;AAG3D,QAAM,iBAAiB;AACvB,QAAM,iBAAiB;AAGvB,QAAM,qBAAqB,KAAK,IAAI,YAAY,cAAc;AAC9D,QAAM,qBAAqB,KAAK,IAAI,YAAY,cAAc;AAG9D,QAAM,YACJ,qBAAqB,qBACjB,iBACA;AAGN,SAAO;AACT;AAWO,MAAM,+BAA6D,MAAM;AAC9E,QAAM,YAAY,eAAe;AACjC,SAAO;AAAA,IACL,iBAAiB;AAAA,IACjB,OAAO,iBAAiB,SAAS;AAAA,EACnC;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hooks/index.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,
|
|
6
|
-
"names": []
|
|
4
|
+
"sourcesContent": ["import useMeasure from 'use-measure';\nimport useForceUpdate from 'use-force-update';\nimport useOnClickOutside from 'use-onclickoutside';\n\nexport { useMeasure, useForceUpdate, useOnClickOutside };\n\nexport { useCallbackAfterRender } from './useCallbackAfterRender.js';\nexport { useCancellableDelayedCallback } from './useCancellableDelayedCallback.js';\nexport { useControlledUncontrolledState } from './useControlledUncontrolledState.js';\nexport { useDerivedStateFromProps } from './useDerivedStateFromProps.js';\nexport { useExecutionTimer } from './useExecutionTimer.js';\nexport { useExpandState } from './useExpandState.js';\nexport { useHeadlessTooltip } from './useHeadlessTooltip.js';\nexport { useHotkeys } from './useHotkeys.js';\nexport { useHoverHandlersDelay } from './useHoverHandlersDelay.js';\nexport { useIsShowingEllipsis } from './useIsShowingEllipsis.js';\nexport { useMakeMutable, useLatestValueReferenciallyStable } from './useMakeMutable.js';\nexport { useNativeIntersectionObserver } from './useNativeIntersectionObserver.js';\nexport { useNativeResizeObserver } from './useNativeResizeObserver.js';\nexport { useOnElementResize } from './useOnElementResize.js';\nexport { useOnSpecificFocus, UseOnSpecificFocusWithSchema } from './useOnSpecificFocus.js';\nexport { useOwnerProps } from './useOwnerProps.js';\nexport { usePrevious } from './usePrevious.js';\nexport { useResizeObserver } from './useResizeObserver.js';\nexport { useShouldRecalculate } from './useShouldRecalculate.js';\nexport { useSideEffectSyntheticEvent } from './useSideEffectSyntheticEvent.js';\nexport { useTrackElement } from './useTrackElement.js';\nexport { useWindowScrollerList } from './useWindowScrollerList.js';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gDAAAA;AAAA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uCAAAC;AAAA,EAAA;AAAA;AAAA,qDAAAC;AAAA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,yBAAuB;AACvB,8BAA2B;AAC3B,gCAA8B;AAI9B,oCAAuC;AACvC,2CAA8C;AAC9C,4CAA+C;AAC/C,sCAAyC;AACzC,+BAAkC;AAClC,4BAA+B;AAC/B,gCAAmC;AACnC,wBAA2B;AAC3B,mCAAsC;AACtC,kCAAqC;AACrC,4BAAkE;AAClE,2CAA8C;AAC9C,qCAAwC;AACxC,gCAAmC;AACnC,gCAAiE;AACjE,2BAA8B;AAC9B,yBAA4B;AAC5B,+BAAkC;AAClC,kCAAqC;AACrC,yCAA4C;AAC5C,6BAAgC;AAChC,mCAAsC;",
|
|
6
|
+
"names": ["useForceUpdate", "useMeasure", "useOnClickOutside"]
|
|
7
7
|
}
|
|
@@ -38,15 +38,13 @@ function useControlledUncontrolledState(config) {
|
|
|
38
38
|
const [state, setState] = import_react.default.useState(defaultState);
|
|
39
39
|
const shouldUseControlledState = Object.hasOwnProperty.call(config, "controlledState");
|
|
40
40
|
const finalState = import_react.default.useMemo(() => {
|
|
41
|
-
if (shouldUseControlledState)
|
|
42
|
-
return controlledState;
|
|
41
|
+
if (shouldUseControlledState) return controlledState;
|
|
43
42
|
return state;
|
|
44
43
|
}, [shouldUseControlledState, controlledState, state]);
|
|
45
44
|
const finalSetState = import_react.default.useCallback(
|
|
46
45
|
(newVal) => {
|
|
47
46
|
setState(newVal);
|
|
48
|
-
if (onChange)
|
|
49
|
-
onChange(newVal);
|
|
47
|
+
if (onChange) onChange(newVal);
|
|
50
48
|
},
|
|
51
49
|
[onChange]
|
|
52
50
|
);
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hooks/useControlledUncontrolledState.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\n\nexport function useControlledUncontrolledState<T = unknown>(config: {\n defaultState: T;\n controlledState?: T;\n onChange?: (newState: T) => void;\n}): [T, (newVal: T) => void] {\n const { defaultState, controlledState, onChange } = config;\n const [state, setState] = React.useState<T>(defaultState);\n // due to javascript \"falsy\" crazy bonanza,\n // we are gonna use Object.hasOwnProperty to check if controlledState should be used\n // this covers scenarios such as `controlledState=undefined`/`controlledState=null`/`controlledState=false`/`controlledState=0`/`controlledState=''`\n // where we want to use the controlledState but we want the value to be the falsy value itself...\n const shouldUseControlledState = Object.hasOwnProperty.call(config, 'controlledState');\n const finalState = React.useMemo(() => {\n if (shouldUseControlledState) return controlledState as T;\n return state;\n }, [shouldUseControlledState, controlledState, state]);\n const finalSetState = React.useCallback(\n (newVal: T) => {\n setState(newVal);\n if (onChange) onChange(newVal);\n },\n [onChange],\n );\n return [finalState, finalSetState];\n}\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAEX,SAAS,+BAA4C,QAI/B;AAC3B,QAAM,EAAE,cAAc,iBAAiB,SAAS,IAAI;AACpD,QAAM,CAAC,OAAO,QAAQ,IAAI,aAAAA,QAAM,SAAY,YAAY;AAKxD,QAAM,2BAA2B,OAAO,eAAe,KAAK,QAAQ,iBAAiB;AACrF,QAAM,aAAa,aAAAA,QAAM,QAAQ,MAAM;AACrC,QAAI
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAEX,SAAS,+BAA4C,QAI/B;AAC3B,QAAM,EAAE,cAAc,iBAAiB,SAAS,IAAI;AACpD,QAAM,CAAC,OAAO,QAAQ,IAAI,aAAAA,QAAM,SAAY,YAAY;AAKxD,QAAM,2BAA2B,OAAO,eAAe,KAAK,QAAQ,iBAAiB;AACrF,QAAM,aAAa,aAAAA,QAAM,QAAQ,MAAM;AACrC,QAAI,yBAA0B,QAAO;AACrC,WAAO;AAAA,EACT,GAAG,CAAC,0BAA0B,iBAAiB,KAAK,CAAC;AACrD,QAAM,gBAAgB,aAAAA,QAAM;AAAA,IAC1B,CAAC,WAAc;AACb,eAAS,MAAM;AACf,UAAI,SAAU,UAAS,MAAM;AAAA,IAC/B;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AACA,SAAO,CAAC,YAAY,aAAa;AACnC;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -38,13 +38,11 @@ const useExecutionTimer = (startFn, cleanFn, delayTime) => {
|
|
|
38
38
|
const startTimer = (0, import_react.useRef)();
|
|
39
39
|
const closeTimer = (0, import_react.useRef)();
|
|
40
40
|
const startFunction = (...args) => {
|
|
41
|
-
if (closeTimer.current)
|
|
42
|
-
clearTimeout(closeTimer.current);
|
|
41
|
+
if (closeTimer.current) clearTimeout(closeTimer.current);
|
|
43
42
|
startTimer.current = setTimeout(() => startFn(...args), delayTime);
|
|
44
43
|
};
|
|
45
44
|
const cleanFunction = (...args) => {
|
|
46
|
-
if (startTimer.current)
|
|
47
|
-
clearTimeout(startTimer.current);
|
|
45
|
+
if (startTimer.current) clearTimeout(startTimer.current);
|
|
48
46
|
closeTimer.current = setTimeout(() => cleanFn(...args), 30);
|
|
49
47
|
};
|
|
50
48
|
return [startFunction, cleanFunction];
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hooks/useExecutionTimer.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import { useRef } from 'react';\n\ntype Callback = (...args: unknown[]) => unknown;\n\nexport const useExecutionTimer = (startFn: Callback, cleanFn: Callback, delayTime: number) => {\n const startTimer = useRef<NodeJS.Timeout>();\n const closeTimer = useRef<NodeJS.Timeout>();\n\n const startFunction: Callback = (...args) => {\n if (closeTimer.current) clearTimeout(closeTimer.current);\n startTimer.current = setTimeout(() => startFn(...args), delayTime);\n };\n\n const cleanFunction: Callback = (...args) => {\n if (startTimer.current) clearTimeout(startTimer.current);\n closeTimer.current = setTimeout(() => cleanFn(...args), 30);\n };\n return [startFunction, cleanFunction];\n};\n\nexport default useExecutionTimer;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAuB;AAIhB,MAAM,oBAAoB,CAAC,SAAmB,SAAmB,cAAsB;AAC5F,QAAM,iBAAa,qBAAuB;AAC1C,QAAM,iBAAa,qBAAuB;AAE1C,QAAM,gBAA0B,IAAI,SAAS;AAC3C,QAAI,WAAW
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAuB;AAIhB,MAAM,oBAAoB,CAAC,SAAmB,SAAmB,cAAsB;AAC5F,QAAM,iBAAa,qBAAuB;AAC1C,QAAM,iBAAa,qBAAuB;AAE1C,QAAM,gBAA0B,IAAI,SAAS;AAC3C,QAAI,WAAW,QAAS,cAAa,WAAW,OAAO;AACvD,eAAW,UAAU,WAAW,MAAM,QAAQ,GAAG,IAAI,GAAG,SAAS;AAAA,EACnE;AAEA,QAAM,gBAA0B,IAAI,SAAS;AAC3C,QAAI,WAAW,QAAS,cAAa,WAAW,OAAO;AACvD,eAAW,UAAU,WAAW,MAAM,QAAQ,GAAG,IAAI,GAAG,EAAE;AAAA,EAC5D;AACA,SAAO,CAAC,eAAe,aAAa;AACtC;AAEA,IAAO,4BAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hooks/useExpandState.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import { useMemo } from 'react';\nimport { isFunction } from '../utils.js';\nimport { useDerivedStateFromProps } from './useDerivedStateFromProps.js';\n\ntype ItemT = Record<string, string>;\ninterface UseExpandStateArg {\n items?: ItemT[];\n itemKey?: keyof ItemT;\n expanded?: Record<string, boolean>;\n onExpand: (item: ItemT) => void;\n onExpandChange: (nextState: Record<string, boolean>, item?: ItemT) => void;\n onExpandAll: (nextState: Record<string, boolean>) => void;\n onToggleExpand: (item: ItemT) => void;\n onCollapse: (item: ItemT) => void;\n}\n\nconst toggleStateInObject = <T,>(obj: Record<string, T>, key: string, value: T) => {\n const nextObj = { ...obj };\n if (nextObj[key]) {\n delete nextObj[key];\n } else {\n nextObj[key] = value;\n }\n return nextObj;\n};\n\nconst noop = () => null;\n\nexport const useExpandState = ({\n items = [],\n itemKey = 'id',\n expanded: expandedProp = {},\n onExpand,\n onExpandChange = noop,\n onExpandAll = noop,\n onToggleExpand,\n onCollapse,\n}: UseExpandStateArg) => {\n const [expanded, setExpanded] = useDerivedStateFromProps(expandedProp);\n\n const isExpandedAll = useMemo(() => Object.keys(expanded).length === items.length, [expanded, items]);\n\n const toggleExpandAll = (stateData = true) => {\n setExpanded(() => {\n const nextState: Record<string, boolean> = {};\n if (!isExpandedAll) {\n items.forEach((item) => {\n nextState[item[itemKey]] = stateData;\n });\n }\n onExpandChange(nextState);\n onExpandAll(nextState);\n return nextState;\n });\n };\n\n const expand = (item: ItemT, stateData = true) => {\n if (!item) return;\n if (isFunction(onExpand)) {\n onExpand(item);\n }\n setExpanded((prevState) => {\n const key = item[itemKey];\n const nextState = { ...prevState, [key]: stateData };\n onExpandChange(nextState, item);\n return nextState;\n });\n };\n\n const toggleExpand = (item: ItemT, stateData = true) => {\n if (isFunction(onToggleExpand)) {\n onToggleExpand(item);\n }\n setExpanded((prevState) => {\n const key = item[itemKey];\n const nextState = toggleStateInObject(prevState, key, stateData);\n onExpandChange(nextState, item);\n return nextState;\n });\n };\n\n const collapse = (item: ItemT) => {\n if (isFunction(onCollapse)) {\n onCollapse(item);\n }\n setExpanded((prevState) => {\n const nextState = { ...prevState };\n delete nextState[item[itemKey]];\n onExpandChange(nextState, item);\n return nextState;\n });\n };\n\n return {\n state: { expanded, isExpandedAll },\n actions: {\n expand,\n toggleExpandAll,\n toggleExpand,\n collapse,\n },\n setExpanded,\n };\n};\n\nexport default useExpandState;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwB;AACxB,mBAA2B;AAC3B,sCAAyC;AAczC,MAAM,sBAAsB,CAAK,KAAwB,KAAa,UAAa;AACjF,QAAM,UAAU,EAAE,GAAG,IAAI;AACzB,MAAI,QAAQ,GAAG,GAAG;AAChB,WAAO,QAAQ,GAAG;AAAA,EACpB,OAAO;AACL,YAAQ,GAAG,IAAI;AAAA,EACjB;AACA,SAAO;AACT;AAEA,MAAM,OAAO,MAAM;AAEZ,MAAM,iBAAiB,CAAC;AAAA,EAC7B,QAAQ,CAAC;AAAA,EACT,UAAU;AAAA,EACV,UAAU,eAAe,CAAC;AAAA,EAC1B;AAAA,EACA,iBAAiB;AAAA,EACjB,cAAc;AAAA,EACd;AAAA,EACA;AACF,MAAyB;AACvB,QAAM,CAAC,UAAU,WAAW,QAAI,0DAAyB,YAAY;AAErE,QAAM,oBAAgB,sBAAQ,MAAM,OAAO,KAAK,QAAQ,EAAE,WAAW,MAAM,QAAQ,CAAC,UAAU,KAAK,CAAC;AAEpG,QAAM,kBAAkB,CAAC,YAAY,SAAS;AAC5C,gBAAY,MAAM;AAChB,YAAM,YAAqC,CAAC;AAC5C,UAAI,CAAC,eAAe;AAClB,cAAM,QAAQ,CAAC,SAAS;AACtB,oBAAU,KAAK,OAAO,CAAC,IAAI;AAAA,QAC7B,CAAC;AAAA,MACH;AACA,qBAAe,SAAS;AACxB,kBAAY,SAAS;AACrB,aAAO;AAAA,IACT,CAAC;AAAA,EACH;AAEA,QAAM,SAAS,CAAC,MAAa,YAAY,SAAS;AAChD,QAAI,CAAC;
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwB;AACxB,mBAA2B;AAC3B,sCAAyC;AAczC,MAAM,sBAAsB,CAAK,KAAwB,KAAa,UAAa;AACjF,QAAM,UAAU,EAAE,GAAG,IAAI;AACzB,MAAI,QAAQ,GAAG,GAAG;AAChB,WAAO,QAAQ,GAAG;AAAA,EACpB,OAAO;AACL,YAAQ,GAAG,IAAI;AAAA,EACjB;AACA,SAAO;AACT;AAEA,MAAM,OAAO,MAAM;AAEZ,MAAM,iBAAiB,CAAC;AAAA,EAC7B,QAAQ,CAAC;AAAA,EACT,UAAU;AAAA,EACV,UAAU,eAAe,CAAC;AAAA,EAC1B;AAAA,EACA,iBAAiB;AAAA,EACjB,cAAc;AAAA,EACd;AAAA,EACA;AACF,MAAyB;AACvB,QAAM,CAAC,UAAU,WAAW,QAAI,0DAAyB,YAAY;AAErE,QAAM,oBAAgB,sBAAQ,MAAM,OAAO,KAAK,QAAQ,EAAE,WAAW,MAAM,QAAQ,CAAC,UAAU,KAAK,CAAC;AAEpG,QAAM,kBAAkB,CAAC,YAAY,SAAS;AAC5C,gBAAY,MAAM;AAChB,YAAM,YAAqC,CAAC;AAC5C,UAAI,CAAC,eAAe;AAClB,cAAM,QAAQ,CAAC,SAAS;AACtB,oBAAU,KAAK,OAAO,CAAC,IAAI;AAAA,QAC7B,CAAC;AAAA,MACH;AACA,qBAAe,SAAS;AACxB,kBAAY,SAAS;AACrB,aAAO;AAAA,IACT,CAAC;AAAA,EACH;AAEA,QAAM,SAAS,CAAC,MAAa,YAAY,SAAS;AAChD,QAAI,CAAC,KAAM;AACX,YAAI,yBAAW,QAAQ,GAAG;AACxB,eAAS,IAAI;AAAA,IACf;AACA,gBAAY,CAAC,cAAc;AACzB,YAAM,MAAM,KAAK,OAAO;AACxB,YAAM,YAAY,EAAE,GAAG,WAAW,CAAC,GAAG,GAAG,UAAU;AACnD,qBAAe,WAAW,IAAI;AAC9B,aAAO;AAAA,IACT,CAAC;AAAA,EACH;AAEA,QAAM,eAAe,CAAC,MAAa,YAAY,SAAS;AACtD,YAAI,yBAAW,cAAc,GAAG;AAC9B,qBAAe,IAAI;AAAA,IACrB;AACA,gBAAY,CAAC,cAAc;AACzB,YAAM,MAAM,KAAK,OAAO;AACxB,YAAM,YAAY,oBAAoB,WAAW,KAAK,SAAS;AAC/D,qBAAe,WAAW,IAAI;AAC9B,aAAO;AAAA,IACT,CAAC;AAAA,EACH;AAEA,QAAM,WAAW,CAAC,SAAgB;AAChC,YAAI,yBAAW,UAAU,GAAG;AAC1B,iBAAW,IAAI;AAAA,IACjB;AACA,gBAAY,CAAC,cAAc;AACzB,YAAM,YAAY,EAAE,GAAG,UAAU;AACjC,aAAO,UAAU,KAAK,OAAO,CAAC;AAC9B,qBAAe,WAAW,IAAI;AAC9B,aAAO;AAAA,IACT,CAAC;AAAA,EACH;AAEA,SAAO;AAAA,IACL,OAAO,EAAE,UAAU,cAAc;AAAA,IACjC,SAAS;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,EACF;AACF;AAEA,IAAO,yBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -42,8 +42,7 @@ const useGlobalKeyboardListener = (func) => {
|
|
|
42
42
|
const useControlledState = (controlledValue, defaultVal) => {
|
|
43
43
|
const [internalValue, setInternalValue] = import_react.default.useState(defaultVal ?? null);
|
|
44
44
|
const val = import_react.default.useMemo(() => {
|
|
45
|
-
if (controlledValue !== void 0)
|
|
46
|
-
return controlledValue;
|
|
45
|
+
if (controlledValue !== void 0) return controlledValue;
|
|
47
46
|
return internalValue;
|
|
48
47
|
}, [controlledValue, internalValue]);
|
|
49
48
|
return [val, setInternalValue];
|
|
@@ -84,8 +83,7 @@ const useHeadlessTooltip = (config) => {
|
|
|
84
83
|
}, [setInternalHasFocus, shouldShowPopover, showTooltip, trackLatestKeyboardInteraction]);
|
|
85
84
|
const onBlur = import_react.default.useCallback(() => {
|
|
86
85
|
setInternalHasFocus(false);
|
|
87
|
-
if (!finalIsHovering || finalLatestOpenInteraction === "onFocus")
|
|
88
|
-
hideTooltip();
|
|
86
|
+
if (!finalIsHovering || finalLatestOpenInteraction === "onFocus") hideTooltip();
|
|
89
87
|
}, [setInternalHasFocus, finalIsHovering, finalLatestOpenInteraction, hideTooltip]);
|
|
90
88
|
const onMouseEnter = import_react.default.useCallback(() => {
|
|
91
89
|
setInternalIsHovering(true);
|
|
@@ -96,13 +94,11 @@ const useHeadlessTooltip = (config) => {
|
|
|
96
94
|
}, [setInternalIsHovering, shouldShowPopover, showTooltip, trackLatestMouseInteraction]);
|
|
97
95
|
const onMouseLeave = import_react.default.useCallback(() => {
|
|
98
96
|
setInternalIsHovering(false);
|
|
99
|
-
if (!finalHasFocus || finalLatestOpenInteraction === "onMouseEnter")
|
|
100
|
-
hideTooltip();
|
|
97
|
+
if (!finalHasFocus || finalLatestOpenInteraction === "onMouseEnter") hideTooltip();
|
|
101
98
|
}, [setInternalIsHovering, finalHasFocus, finalLatestOpenInteraction, hideTooltip]);
|
|
102
99
|
const handleEscKey = import_react.default.useCallback(
|
|
103
100
|
({ key }) => {
|
|
104
|
-
if (key === "Escape")
|
|
105
|
-
hideTooltip();
|
|
101
|
+
if (key === "Escape") hideTooltip();
|
|
106
102
|
},
|
|
107
103
|
[hideTooltip]
|
|
108
104
|
);
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hooks/useHeadlessTooltip.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\n\n// This function is a custom hook that adds a keyboard event listener to the document\n// calls the specified function when a key is pressed.\nconst useGlobalKeyboardListener = (func: ({ key }: { key: string }) => void) => {\n React.useEffect(() => {\n document.addEventListener('keydown', func);\n return () => document.removeEventListener('keydown', func);\n }, [func]);\n};\n\nexport type LatestOpenInteraction = '' | 'onFocus' | 'onMouseEnter';\nexport type UseHeadlessTooltipConfig = {\n hasFocus?: boolean;\n isHovering?: boolean;\n latestOpenInteraction?: LatestOpenInteraction;\n onOpen?: () => void;\n onClose?: () => void;\n};\n\nconst useControlledState = <T>(controlledValue?: T, defaultVal?: T) => {\n const [internalValue, setInternalValue] = React.useState<T | null>(defaultVal ?? null);\n const val = React.useMemo(() => {\n if (controlledValue !== undefined) return controlledValue;\n return internalValue;\n }, [controlledValue, internalValue]);\n return [val, setInternalValue] as const;\n};\n\n/**\n * A custom hook that provides logic for a headless tooltip. This hook can be used in a controlled or uncontrolled way.\n * @param {UseHeadlessTooltipConfig} config - The configuration object for the hook.\n * @param {boolean} config.hasFocus - Whether or not the trigger element has focus. If this is not provided, the hook will track focus internally.\n * @param {boolean} config.isHovering - Whether or not the mouse is hovering over the trigger element. If this is not provided, the hook will track hover internally.\n * @param {LatestOpenInteraction} config.latestOpenInteraction - Whether or not the mouse is hovering over the trigger element. If this is not provided, the hook will track hover internally.\n * @param {Function} config.onOpen - A callback that will be invoked when the tooltip is opened.\n * @param {Function} config.onClose - A callback that will be invoked when the tooltip is closed.\n * @returns {object} - An object containing the following properties:\n *\n * {boolean} hasFocus - Whether or not the trigger element has focus.\n *\n * {boolean} isHovering - Whether or not the mouse is hovering over the trigger element.\n *\n * {'' | 'onFocus' | 'onMouseEnter'} latestOpenInteraction - which was the last operation that is used to control if the tooltip should show or not.\n *\n * {string} finalLatestOpenInteraction - The most recent interaction that caused the tooltip to open.\n *\n * {HTMLDivElement} referenceElement - The trigger element.\n *\n * {function} setReferenceElement - A function that sets the trigger element.\n *\n * {boolean} shouldShowPopover - Whether or not the tooltip is visible.\n *\n * {function} showTooltip - A function that opens the tooltip.\n *\n * {function} hideTooltip - A function that closes the tooltip.\n *\n * {function} onFocus - A function that should be invoked when the trigger element receives focus.\n *\n * {function} onBlur - A function that should be invoked when the trigger element loses focus.\n *\n * {function} onMouseEnter - A function that should be invoked when the mouse enters the trigger element.\n *\n * {function} onMouseLeave - A function that should be invoked when the mouse leaves the trigger element.\n * @example\n * const tooltipHelpers = useHeadlessTooltip({\n * hasFocus: true,\n * isHovering: false,\n * onOpen: () => console.log('tooltip opened'),\n * onClose: () => console.log('tooltip closed'),\n * });\n * ...\n * <div>\n * <button\n * ref={tooltipHelpers.setReferenceElement}\n * onMouseEnter={tooltipHelpers.onMouseEnter}\n * onMouseLeave={tooltipHelpers.onMouseLeave}\n * onPointerEnter={tooltipHelpers.onMouseEnter}\n * onPointerLeave={tooltipHelpers.onMouseLeave}\n * onFocus={tooltipHelpers.onFocus}\n * onBlur={tooltipHelpers.onBlur}\n * >hello</button>\n * <DSPopperJS\n * referenceElement={tooltipHelpers.referenceElement}\n * shouldShowPopover={tooltipHelpers.shouldShowPopover}\n * >\n * <div>Tooltip content</div>\n * </DSPopperJS>\n * </div>\n */\nexport const useHeadlessTooltip = (config?: UseHeadlessTooltipConfig) => {\n // Extract the configuration values or set default values if they are not provided.\n const { hasFocus, isHovering, latestOpenInteraction, onOpen = () => {}, onClose = () => {} } = config ?? {};\n\n // this pattern is basically a way to allow usage of the hook in a controlled or uncontrolled way.\n const [finalHasFocus, setInternalHasFocus] = useControlledState<boolean>(hasFocus, false);\n const [finalIsHovering, setInternalIsHovering] = useControlledState<boolean>(isHovering, false);\n const [finalLatestOpenInteraction, setLatestOpenInteraction] = useControlledState<string>(latestOpenInteraction, '');\n\n // end of controlled/uncontrolled pattern\n\n // Set up state variables for the tooltip's visibility and the most recent interaction that caused it to open.\n // The most recent interaction is used to determine whether or not to close the tooltip when the user\n // moves the mouse away from the trigger element.\n const [referenceElement, setReferenceElement] = React.useState<HTMLDivElement | null>(null);\n const [shouldShowPopover, setShouldShowPopover] = React.useState<boolean>(false);\n\n // memoized versions of the show and hide functions\n // those include the callbacks to allow \"controlled\" usage of the hook\n const showTooltip = React.useCallback(() => {\n setShouldShowPopover(true);\n onOpen();\n }, [onOpen]);\n\n const hideTooltip = React.useCallback(() => {\n setShouldShowPopover(false);\n onClose();\n }, [onClose]);\n\n const trackLatestKeyboardInteraction = React.useCallback(() => {\n if (!shouldShowPopover) {\n setLatestOpenInteraction('onFocus');\n }\n }, [setLatestOpenInteraction, shouldShowPopover]);\n\n const trackLatestMouseInteraction = React.useCallback(() => {\n if (!shouldShowPopover) {\n setLatestOpenInteraction('onMouseEnter');\n }\n }, [setLatestOpenInteraction, shouldShowPopover]);\n\n // following here are the event handlers that are used to control the tooltip's visibility logic\n const onFocus = React.useCallback(() => {\n setInternalHasFocus(true); // uncontrolled usage tracking\n trackLatestKeyboardInteraction();\n if (!shouldShowPopover) {\n showTooltip();\n }\n }, [setInternalHasFocus, shouldShowPopover, showTooltip, trackLatestKeyboardInteraction]);\n\n const onBlur = React.useCallback(() => {\n setInternalHasFocus(false); // uncontrolled usage tracking\n // blur may triggered via keyboard navigation or mouse interaction\n // every time the mouse is hovering, we want to keep the tooltip open\n // but if the mouse is not hovering, we want to close the tooltip only if the last interaction was via keyboard\n // e.g if the user keyboard navigates to the trigger element and then moves the mouse away, we want to keep the tooltip open\n if (!finalIsHovering || finalLatestOpenInteraction === 'onFocus') hideTooltip();\n }, [setInternalHasFocus, finalIsHovering, finalLatestOpenInteraction, hideTooltip]);\n\n const onMouseEnter = React.useCallback(() => {\n setInternalIsHovering(true); // uncontrolled usage tracking\n // kind of debouncing the mouse enter event to reduce the avarge O() notation of the function\n // even if this is continually invoked, it will be O(1) and controlled callbacks will be invoked only once\n trackLatestMouseInteraction();\n if (!shouldShowPopover) {\n showTooltip();\n }\n }, [setInternalIsHovering, shouldShowPopover, showTooltip, trackLatestMouseInteraction]);\n\n const onMouseLeave = React.useCallback(() => {\n setInternalIsHovering(false); // uncontrolled usage tracking\n // mouse leave may be triggered via keyboard navigation or mouse interaction\n // every time the trigger element has focus, we want to keep the tooltip open\n // but if the trigger element does not have focus, we want to close the tooltip only if the last interaction was via mouse\n // e.g if the user keyboard navigates to the trigger element and then moves the mouse away, we want to keep the tooltip open\n if (!finalHasFocus || finalLatestOpenInteraction === 'onMouseEnter') hideTooltip();\n }, [setInternalIsHovering, finalHasFocus, finalLatestOpenInteraction, hideTooltip]);\n\n const handleEscKey = React.useCallback(\n ({ key }: { key: string }) => {\n // accessibility standard: pressing escape should close the tooltip\n if (key === 'Escape') hideTooltip();\n },\n [hideTooltip],\n );\n\n // accessibilty standard: pressing escape should close the tooltip no matter where the focus is\n useGlobalKeyboardListener(handleEscKey);\n\n return React.useMemo(\n () => ({\n hasFocus: finalHasFocus,\n isHovering: finalIsHovering,\n latestOpenInteraction: finalLatestOpenInteraction,\n referenceElement,\n setReferenceElement,\n shouldShowPopover,\n showTooltip,\n hideTooltip,\n onFocus,\n onBlur,\n onMouseEnter,\n onMouseLeave,\n }),\n [\n finalHasFocus,\n finalIsHovering,\n finalLatestOpenInteraction,\n referenceElement,\n shouldShowPopover,\n showTooltip,\n hideTooltip,\n onFocus,\n onBlur,\n onMouseEnter,\n onMouseLeave,\n ],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAIlB,MAAM,4BAA4B,CAAC,SAA6C;AAC9E,eAAAA,QAAM,UAAU,MAAM;AACpB,aAAS,iBAAiB,WAAW,IAAI;AACzC,WAAO,MAAM,SAAS,oBAAoB,WAAW,IAAI;AAAA,EAC3D,GAAG,CAAC,IAAI,CAAC;AACX;AAWA,MAAM,qBAAqB,CAAI,iBAAqB,eAAmB;AACrE,QAAM,CAAC,eAAe,gBAAgB,IAAI,aAAAA,QAAM,SAAmB,cAAc,IAAI;AACrF,QAAM,MAAM,aAAAA,QAAM,QAAQ,MAAM;AAC9B,QAAI,oBAAoB
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAIlB,MAAM,4BAA4B,CAAC,SAA6C;AAC9E,eAAAA,QAAM,UAAU,MAAM;AACpB,aAAS,iBAAiB,WAAW,IAAI;AACzC,WAAO,MAAM,SAAS,oBAAoB,WAAW,IAAI;AAAA,EAC3D,GAAG,CAAC,IAAI,CAAC;AACX;AAWA,MAAM,qBAAqB,CAAI,iBAAqB,eAAmB;AACrE,QAAM,CAAC,eAAe,gBAAgB,IAAI,aAAAA,QAAM,SAAmB,cAAc,IAAI;AACrF,QAAM,MAAM,aAAAA,QAAM,QAAQ,MAAM;AAC9B,QAAI,oBAAoB,OAAW,QAAO;AAC1C,WAAO;AAAA,EACT,GAAG,CAAC,iBAAiB,aAAa,CAAC;AACnC,SAAO,CAAC,KAAK,gBAAgB;AAC/B;AA+DO,MAAM,qBAAqB,CAAC,WAAsC;AAEvE,QAAM,EAAE,UAAU,YAAY,uBAAuB,SAAS,MAAM;AAAA,EAAC,GAAG,UAAU,MAAM;AAAA,EAAC,EAAE,IAAI,UAAU,CAAC;AAG1G,QAAM,CAAC,eAAe,mBAAmB,IAAI,mBAA4B,UAAU,KAAK;AACxF,QAAM,CAAC,iBAAiB,qBAAqB,IAAI,mBAA4B,YAAY,KAAK;AAC9F,QAAM,CAAC,4BAA4B,wBAAwB,IAAI,mBAA2B,uBAAuB,EAAE;AAOnH,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,aAAAA,QAAM,SAAgC,IAAI;AAC1F,QAAM,CAAC,mBAAmB,oBAAoB,IAAI,aAAAA,QAAM,SAAkB,KAAK;AAI/E,QAAM,cAAc,aAAAA,QAAM,YAAY,MAAM;AAC1C,yBAAqB,IAAI;AACzB,WAAO;AAAA,EACT,GAAG,CAAC,MAAM,CAAC;AAEX,QAAM,cAAc,aAAAA,QAAM,YAAY,MAAM;AAC1C,yBAAqB,KAAK;AAC1B,YAAQ;AAAA,EACV,GAAG,CAAC,OAAO,CAAC;AAEZ,QAAM,iCAAiC,aAAAA,QAAM,YAAY,MAAM;AAC7D,QAAI,CAAC,mBAAmB;AACtB,+BAAyB,SAAS;AAAA,IACpC;AAAA,EACF,GAAG,CAAC,0BAA0B,iBAAiB,CAAC;AAEhD,QAAM,8BAA8B,aAAAA,QAAM,YAAY,MAAM;AAC1D,QAAI,CAAC,mBAAmB;AACtB,+BAAyB,cAAc;AAAA,IACzC;AAAA,EACF,GAAG,CAAC,0BAA0B,iBAAiB,CAAC;AAGhD,QAAM,UAAU,aAAAA,QAAM,YAAY,MAAM;AACtC,wBAAoB,IAAI;AACxB,mCAA+B;AAC/B,QAAI,CAAC,mBAAmB;AACtB,kBAAY;AAAA,IACd;AAAA,EACF,GAAG,CAAC,qBAAqB,mBAAmB,aAAa,8BAA8B,CAAC;AAExF,QAAM,SAAS,aAAAA,QAAM,YAAY,MAAM;AACrC,wBAAoB,KAAK;AAKzB,QAAI,CAAC,mBAAmB,+BAA+B,UAAW,aAAY;AAAA,EAChF,GAAG,CAAC,qBAAqB,iBAAiB,4BAA4B,WAAW,CAAC;AAElF,QAAM,eAAe,aAAAA,QAAM,YAAY,MAAM;AAC3C,0BAAsB,IAAI;AAG1B,gCAA4B;AAC5B,QAAI,CAAC,mBAAmB;AACtB,kBAAY;AAAA,IACd;AAAA,EACF,GAAG,CAAC,uBAAuB,mBAAmB,aAAa,2BAA2B,CAAC;AAEvF,QAAM,eAAe,aAAAA,QAAM,YAAY,MAAM;AAC3C,0BAAsB,KAAK;AAK3B,QAAI,CAAC,iBAAiB,+BAA+B,eAAgB,aAAY;AAAA,EACnF,GAAG,CAAC,uBAAuB,eAAe,4BAA4B,WAAW,CAAC;AAElF,QAAM,eAAe,aAAAA,QAAM;AAAA,IACzB,CAAC,EAAE,IAAI,MAAuB;AAE5B,UAAI,QAAQ,SAAU,aAAY;AAAA,IACpC;AAAA,IACA,CAAC,WAAW;AAAA,EACd;AAGA,4BAA0B,YAAY;AAEtC,SAAO,aAAAA,QAAM;AAAA,IACX,OAAO;AAAA,MACL,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,uBAAuB;AAAA,MACvB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -43,13 +43,11 @@ const useHoverHandlersDelay = ({
|
|
|
43
43
|
const hideTimer = (0, import_react.useRef)();
|
|
44
44
|
const showTimer = (0, import_react.useRef)();
|
|
45
45
|
const delayedHide = (0, import_react.useCallback)(() => {
|
|
46
|
-
if (showTimer.current)
|
|
47
|
-
clearTimeout(showTimer.current);
|
|
46
|
+
if (showTimer.current) clearTimeout(showTimer.current);
|
|
48
47
|
hideTimer.current = setTimeout(onMouseLeave, hideDelay);
|
|
49
48
|
}, [hideDelay, onMouseLeave]);
|
|
50
49
|
const delayedShow = (0, import_react.useCallback)(() => {
|
|
51
|
-
if (hideTimer.current)
|
|
52
|
-
clearTimeout(hideTimer.current);
|
|
50
|
+
if (hideTimer.current) clearTimeout(hideTimer.current);
|
|
53
51
|
showTimer.current = setTimeout(onMouseOver, showDelay);
|
|
54
52
|
}, [onMouseOver, showDelay]);
|
|
55
53
|
return {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hooks/useHoverHandlersDelay.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import { useCallback, useRef } from 'react';\n\ninterface UseHoverHandlersDelayArg {\n onMouseOver: () => void;\n onMouseLeave: () => void;\n hideDelay?: number;\n showDelay?: number;\n}\n\nexport const useHoverHandlersDelay = ({\n onMouseOver,\n onMouseLeave,\n hideDelay = 300,\n showDelay = 300,\n}: UseHoverHandlersDelayArg) => {\n const hideTimer = useRef<NodeJS.Timeout>();\n const showTimer = useRef<NodeJS.Timeout>();\n\n const delayedHide = useCallback(() => {\n if (showTimer.current) clearTimeout(showTimer.current);\n hideTimer.current = setTimeout(onMouseLeave, hideDelay);\n }, [hideDelay, onMouseLeave]);\n\n const delayedShow = useCallback(() => {\n if (hideTimer.current) clearTimeout(hideTimer.current);\n showTimer.current = setTimeout(onMouseOver, showDelay);\n }, [onMouseOver, showDelay]);\n\n return {\n onMouseOver: delayedShow,\n onMouseLeave: delayedHide,\n };\n};\n\nexport default useHoverHandlersDelay;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAoC;AAS7B,MAAM,wBAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,YAAY;AACd,MAAgC;AAC9B,QAAM,gBAAY,qBAAuB;AACzC,QAAM,gBAAY,qBAAuB;AAEzC,QAAM,kBAAc,0BAAY,MAAM;AACpC,QAAI,UAAU
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAoC;AAS7B,MAAM,wBAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,YAAY;AACd,MAAgC;AAC9B,QAAM,gBAAY,qBAAuB;AACzC,QAAM,gBAAY,qBAAuB;AAEzC,QAAM,kBAAc,0BAAY,MAAM;AACpC,QAAI,UAAU,QAAS,cAAa,UAAU,OAAO;AACrD,cAAU,UAAU,WAAW,cAAc,SAAS;AAAA,EACxD,GAAG,CAAC,WAAW,YAAY,CAAC;AAE5B,QAAM,kBAAc,0BAAY,MAAM;AACpC,QAAI,UAAU,QAAS,cAAa,UAAU,OAAO;AACrD,cAAU,UAAU,WAAW,aAAa,SAAS;AAAA,EACvD,GAAG,CAAC,aAAa,SAAS,CAAC;AAE3B,SAAO;AAAA,IACL,aAAa;AAAA,IACb,cAAc;AAAA,EAChB;AACF;AAEA,IAAO,gCAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -51,8 +51,7 @@ const useNativeIntersectionObserver = (el, callback) => {
|
|
|
51
51
|
[callback]
|
|
52
52
|
);
|
|
53
53
|
(0, import_react.useEffect)(() => {
|
|
54
|
-
if (el)
|
|
55
|
-
intersectionObserver.observe(el);
|
|
54
|
+
if (el) intersectionObserver.observe(el);
|
|
56
55
|
return () => intersectionObserver.disconnect();
|
|
57
56
|
}, [el, intersectionObserver]);
|
|
58
57
|
};
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hooks/useNativeIntersectionObserver.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import { useEffect, useMemo } from 'react';\n\n// Custom hook to use the intersection observer api,\n// to observe changes in the position of an **UNIQUE** element\n// Will trigger the callback with the boundingClientRect of the element\n// the intersection ratio, the intersection rect, if it is intersecting\n// and the html element itself, so you can query for extra information\nexport const useNativeIntersectionObserver = <T extends HTMLElement>(\n el: T | null,\n callback: (entry: Omit<IntersectionObserverEntry, 'target'> & { target: T }) => void,\n) => {\n const intersectionObserver = useMemo(\n () =>\n new IntersectionObserver((entries) => {\n const entry = entries[0]; // We will only observe one element\n\n const target = entry.target as T;\n\n callback({\n boundingClientRect: entry.boundingClientRect,\n intersectionRatio: entry.intersectionRatio,\n intersectionRect: entry.intersectionRect,\n isIntersecting: entry.isIntersecting,\n rootBounds: entry.rootBounds,\n target,\n time: entry.time,\n });\n }),\n [callback],\n );\n\n useEffect(() => {\n if (el) intersectionObserver.observe(el);\n return () => intersectionObserver.disconnect();\n }, [el, intersectionObserver]);\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAmC;AAO5B,MAAM,gCAAgC,CAC3C,IACA,aACG;AACH,QAAM,2BAAuB;AAAA,IAC3B,MACE,IAAI,qBAAqB,CAAC,YAAY;AACpC,YAAM,QAAQ,QAAQ,CAAC;AAEvB,YAAM,SAAS,MAAM;AAErB,eAAS;AAAA,QACP,oBAAoB,MAAM;AAAA,QAC1B,mBAAmB,MAAM;AAAA,QACzB,kBAAkB,MAAM;AAAA,QACxB,gBAAgB,MAAM;AAAA,QACtB,YAAY,MAAM;AAAA,QAClB;AAAA,QACA,MAAM,MAAM;AAAA,MACd,CAAC;AAAA,IACH,CAAC;AAAA,IACH,CAAC,QAAQ;AAAA,EACX;AAEA,8BAAU,MAAM;AACd,QAAI
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAmC;AAO5B,MAAM,gCAAgC,CAC3C,IACA,aACG;AACH,QAAM,2BAAuB;AAAA,IAC3B,MACE,IAAI,qBAAqB,CAAC,YAAY;AACpC,YAAM,QAAQ,QAAQ,CAAC;AAEvB,YAAM,SAAS,MAAM;AAErB,eAAS;AAAA,QACP,oBAAoB,MAAM;AAAA,QAC1B,mBAAmB,MAAM;AAAA,QACzB,kBAAkB,MAAM;AAAA,QACxB,gBAAgB,MAAM;AAAA,QACtB,YAAY,MAAM;AAAA,QAClB;AAAA,QACA,MAAM,MAAM;AAAA,MACd,CAAC;AAAA,IACH,CAAC;AAAA,IACH,CAAC,QAAQ;AAAA,EACX;AAEA,8BAAU,MAAM;AACd,QAAI,GAAI,sBAAqB,QAAQ,EAAE;AACvC,WAAO,MAAM,qBAAqB,WAAW;AAAA,EAC/C,GAAG,CAAC,IAAI,oBAAoB,CAAC;AAC/B;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -44,8 +44,7 @@ const useNativeResizeObserver = (el, callback) => {
|
|
|
44
44
|
[callback]
|
|
45
45
|
);
|
|
46
46
|
(0, import_react.useEffect)(() => {
|
|
47
|
-
if (el)
|
|
48
|
-
resizeObserver.observe(el);
|
|
47
|
+
if (el) resizeObserver.observe(el);
|
|
49
48
|
return () => resizeObserver.disconnect();
|
|
50
49
|
}, [el, resizeObserver]);
|
|
51
50
|
};
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hooks/useNativeResizeObserver.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import { useEffect, useMemo } from 'react';\n\n// Custom hook to use the resize observer api,\n// to observe changes in the size of an **UNIQUE** element\n// Will trigger the callback with the contentRect,\n// which contains width, height, top, bottom, etc of the element,\n// and the html element itself, so you can query for offsetWidth, etc\nexport const useNativeResizeObserver = <T extends HTMLElement>(\n el: T | null,\n callback: (entry: { contentRect: DOMRectReadOnly; target: T }) => void,\n) => {\n const resizeObserver = useMemo(\n () =>\n new ResizeObserver((entries) => {\n const entry = entries[0]; // We will only observe one element\n\n const contentRect = entry.contentRect;\n\n const target = entry.target as T;\n\n callback({ contentRect, target });\n }),\n [callback],\n );\n\n useEffect(() => {\n if (el) resizeObserver.observe(el);\n return () => resizeObserver.disconnect();\n }, [el, resizeObserver]);\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAmC;AAO5B,MAAM,0BAA0B,CACrC,IACA,aACG;AACH,QAAM,qBAAiB;AAAA,IACrB,MACE,IAAI,eAAe,CAAC,YAAY;AAC9B,YAAM,QAAQ,QAAQ,CAAC;AAEvB,YAAM,cAAc,MAAM;AAE1B,YAAM,SAAS,MAAM;AAErB,eAAS,EAAE,aAAa,OAAO,CAAC;AAAA,IAClC,CAAC;AAAA,IACH,CAAC,QAAQ;AAAA,EACX;AAEA,8BAAU,MAAM;AACd,QAAI
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAmC;AAO5B,MAAM,0BAA0B,CACrC,IACA,aACG;AACH,QAAM,qBAAiB;AAAA,IACrB,MACE,IAAI,eAAe,CAAC,YAAY;AAC9B,YAAM,QAAQ,QAAQ,CAAC;AAEvB,YAAM,cAAc,MAAM;AAE1B,YAAM,SAAS,MAAM;AAErB,eAAS,EAAE,aAAa,OAAO,CAAC;AAAA,IAClC,CAAC;AAAA,IACH,CAAC,QAAQ;AAAA,EACX;AAEA,8BAAU,MAAM;AACd,QAAI,GAAI,gBAAe,QAAQ,EAAE;AACjC,WAAO,MAAM,eAAe,WAAW;AAAA,EACzC,GAAG,CAAC,IAAI,cAAc,CAAC;AACzB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -44,11 +44,9 @@ const useOnElementResize = (targetRef) => {
|
|
|
44
44
|
}
|
|
45
45
|
observer.current = new ResizeObserver(outputsize);
|
|
46
46
|
const el = targetRef.current;
|
|
47
|
-
if (el)
|
|
48
|
-
observer.current.observe(el);
|
|
47
|
+
if (el) observer.current.observe(el);
|
|
49
48
|
return () => {
|
|
50
|
-
if (el)
|
|
51
|
-
observer.current?.disconnect();
|
|
49
|
+
if (el) observer.current?.disconnect();
|
|
52
50
|
};
|
|
53
51
|
}, [targetRef]);
|
|
54
52
|
return (0, import_react.useMemo)(
|