@audius/harmony 0.5.0 → 0.5.2

package/dist/hooks/index.d.ts

@@ -0,0 +1,7 @@
+export * from './useClickOutside';
+export * from './useControlled';
+export * from './useHotKeys';
+export * from './useMediaQueryListener';
+export * from './useScrollLock';
+export * from './useMedia';
+//# sourceMappingURL=index.d.ts.map

package/dist/hooks/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAA;AACjC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,cAAc,CAAA;AAC5B,cAAc,yBAAyB,CAAA;AACvC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,YAAY,CAAA"}

package/dist/hooks/useClickOutside.d.ts

@@ -0,0 +1,15 @@
+import { MutableRefObject } from 'react';
+/**
+ * Custom hook that fires an onClick callback when the user clicks
+ * outside of the element referenced by the returned ref.
+ *
+ * @param onClick the callback fired when a click is performed "outside"
+ * @param ignoreClick optional check to be run on the element that receives
+ * the "click." If ignoreClick returns true, the click is not considered outside
+ * even if it was outside the element referenced.
+ * @param defaultRef optional ref to use, if not provided a new ref will be created & returned
+  
+ * @returns a ref that should be used to mark the "inside" element
+ */
+export declare const useClickOutside: (onClick: () => void, isVisible: boolean, ignoreClick?: ((target: EventTarget) => boolean) | undefined, defaultRef?: MutableRefObject<any> | null, anchorRef?: MutableRefObject<any> | null) => import("react").RefObject<any>;
+//# sourceMappingURL=useClickOutside.d.ts.map

package/dist/hooks/useClickOutside.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useClickOutside.d.ts","sourceRoot":"","sources":["../../src/hooks/useClickOutside.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAqB,MAAM,OAAO,CAAA;AAE3D;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,eAAe,YACjB,MAAM,IAAI,aACR,OAAO,0BACK,WAAW,KAAK,OAAO,4BACjC,iBAAiB,GAAG,CAAC,GAAG,IAAI,cAC7B,iBAAiB,GAAG,CAAC,GAAG,IAAI,mCAyCzC,CAAA"}

package/dist/hooks/useClickOutside.js

@@ -0,0 +1,53 @@
+import { useRef, useEffect } from 'react';
+
+/**
+ * Custom hook that fires an onClick callback when the user clicks
+ * outside of the element referenced by the returned ref.
+ *
+ * @param onClick the callback fired when a click is performed "outside"
+ * @param ignoreClick optional check to be run on the element that receives
+ * the "click." If ignoreClick returns true, the click is not considered outside
+ * even if it was outside the element referenced.
+ * @param defaultRef optional ref to use, if not provided a new ref will be created & returned
+  
+ * @returns a ref that should be used to mark the "inside" element
+ */
+var useClickOutside = function (onClick, isVisible, ignoreClick, defaultRef, anchorRef) {
+    var _a;
+    var ref = useRef((_a = defaultRef === null || defaultRef === void 0 ? void 0 : defaultRef.current) !== null && _a !== void 0 ? _a : null);
+    useEffect(function () {
+        var handleClick = function (e) {
+            var _a;
+            if (e.target) {
+                if (ignoreClick
+                    ? ignoreClick(e.target)
+                    : !ref.current ||
+                        (ref.current && ref.current.contains(e.target)) ||
+                        ((_a = anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current) === null || _a === void 0 ? void 0 : _a.contains(e.target))) {
+                    return;
+                }
+            }
+            var handleMouseup = function () {
+                onClick();
+                document.removeEventListener('mouseup', handleMouseup);
+            };
+            document.addEventListener('mouseup', handleMouseup);
+        };
+        if (isVisible) {
+            // Don't attach the listener until all the current events are finished bubbling
+            setTimeout(function () {
+                document.addEventListener('mousedown', handleClick);
+            }, 0);
+        }
+        return function () {
+            // Don't remove the listener until after the listener has been attached
+            setTimeout(function () {
+                document.removeEventListener('mousedown', handleClick);
+            }, 0);
+        };
+    }, [onClick, ignoreClick, isVisible, anchorRef]);
+    return ref;
+};
+
+export { useClickOutside };
+//# sourceMappingURL=useClickOutside.js.map

package/dist/hooks/useClickOutside.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useClickOutside.js","sources":["../../src/hooks/useClickOutside.ts"],"sourcesContent":["import { MutableRefObject, useEffect, useRef } from 'react'\n\n/**\n * Custom hook that fires an onClick callback when the user clicks\n * outside of the element referenced by the returned ref.\n *\n * @param onClick the callback fired when a click is performed \"outside\"\n * @param ignoreClick optional check to be run on the element that receives\n * the \"click.\" If ignoreClick returns true, the click is not considered outside\n * even if it was outside the element referenced.\n * @param defaultRef optional ref to use, if not provided a new ref will be created & returned\n  \n * @returns a ref that should be used to mark the \"inside\" element\n */\nexport const useClickOutside = (\n  onClick: () => void,\n  isVisible: boolean,\n  ignoreClick?: (target: EventTarget) => boolean,\n  defaultRef?: MutableRefObject<any> | null,\n  anchorRef?: MutableRefObject<any> | null\n) => {\n  const ref = useRef(defaultRef?.current ?? null)\n\n  useEffect(() => {\n    const handleClick = (e: MouseEvent) => {\n      if (e.target) {\n        if (\n          ignoreClick\n            ? ignoreClick(e.target)\n            : !ref.current ||\n              (ref.current && ref.current.contains(e.target)) ||\n              anchorRef?.current?.contains(e.target)\n        ) {\n          return\n        }\n      }\n\n      const handleMouseup = () => {\n        onClick()\n        document.removeEventListener('mouseup', handleMouseup)\n      }\n\n      document.addEventListener('mouseup', handleMouseup)\n    }\n\n    if (isVisible) {\n      // Don't attach the listener until all the current events are finished bubbling\n      setTimeout(() => {\n        document.addEventListener('mousedown', handleClick)\n      }, 0)\n    }\n    return () => {\n      // Don't remove the listener until after the listener has been attached\n      setTimeout(() => {\n        document.removeEventListener('mousedown', handleClick)\n      }, 0)\n    }\n  }, [onClick, ignoreClick, isVisible, anchorRef])\n\n  return ref\n}\n"],"names":[],"mappings":";;AAEA;;;;;;;;;;;AAWG;AACI,IAAM,eAAe,GAAG,UAC7B,OAAmB,EACnB,SAAkB,EAClB,WAA8C,EAC9C,UAAyC,EACzC,SAAwC,EAAA;;AAExC,IAAA,IAAM,GAAG,GAAG,MAAM,CAAC,MAAA,UAAU,KAAA,IAAA,IAAV,UAAU,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAV,UAAU,CAAE,OAAO,MAAI,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAA,IAAI,CAAC,CAAA;AAE/C,IAAA,SAAS,CAAC,YAAA;QACR,IAAM,WAAW,GAAG,UAAC,CAAa,EAAA;;YAChC,IAAI,CAAC,CAAC,MAAM,EAAE;AACZ,gBAAA,IACE,WAAW;AACT,sBAAE,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC;AACvB,sBAAE,CAAC,GAAG,CAAC,OAAO;AACZ,yBAAC,GAAG,CAAC,OAAO,IAAI,GAAG,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;AAC/C,yBAAA,CAAA,EAAA,GAAA,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAT,SAAS,CAAE,OAAO,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAA,EAC1C;oBACA,OAAM;AACP,iBAAA;AACF,aAAA;AAED,YAAA,IAAM,aAAa,GAAG,YAAA;AACpB,gBAAA,OAAO,EAAE,CAAA;AACT,gBAAA,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAA;AACxD,aAAC,CAAA;AAED,YAAA,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAA;AACrD,SAAC,CAAA;AAED,QAAA,IAAI,SAAS,EAAE;;AAEb,YAAA,UAAU,CAAC,YAAA;AACT,gBAAA,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,WAAW,CAAC,CAAA;aACpD,EAAE,CAAC,CAAC,CAAA;AACN,SAAA;QACD,OAAO,YAAA;;AAEL,YAAA,UAAU,CAAC,YAAA;AACT,gBAAA,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,WAAW,CAAC,CAAA;aACvD,EAAE,CAAC,CAAC,CAAA;AACP,SAAC,CAAA;KACF,EAAE,CAAC,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,CAAC,CAAC,CAAA;AAEhD,IAAA,OAAO,GAAG,CAAA;AACZ;;;;"}

package/dist/hooks/useControlled.d.ts

@@ -0,0 +1,30 @@
+/**
+The MIT License (MIT)
+
+Copyright (c) 2014 Call-Em-All
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+ */
+export declare const useControlled: <T extends string | number | boolean | readonly string[] | null | undefined>({ controlledProp, defaultValue, stateName, componentName }: {
+    controlledProp: T;
+    defaultValue: T;
+    stateName?: string | undefined;
+    componentName: string;
+}) => [T, (newValue: T) => void];
+//# sourceMappingURL=useControlled.d.ts.map

package/dist/hooks/useControlled.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useControlled.d.ts","sourceRoot":"","sources":["../../src/hooks/useControlled.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAyCH,eAAO,MAAM,aAAa;;;;mBAWT,MAAM;2BACE,IAAI,CAkD5B,CAAA"}

package/dist/hooks/useControlled.js

@@ -0,0 +1,85 @@
+import { useRef, useState, useCallback, useEffect } from 'react';
+
+/**
+The MIT License (MIT)
+
+Copyright (c) 2014 Call-Em-All
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+ */
+// Adapted from Material UI: https://github.com/mui/material-ui/blob/a31d9166a46b41b63b1932252e8eb32a3f4dfb2b/packages/mui-utils/src/useControlled.js
+var switchControlledError = function (_a) {
+    var isControlled = _a.isControlled, stateName = _a.stateName, componentName = _a.componentName;
+    return [
+        "Audius Harmony: A component is changing an ".concat(isControlled ? '' : 'un', "controlled ").concat(stateName, " state of ").concat(componentName, " to be ").concat(isControlled ? 'un' : '', "controlled."),
+        'This is likely caused by the value changing from undefined to a defined value, which should not happen.',
+        'Decide between using a controlled or uncontrolled input element for the lifetime of the component.',
+        "The nature of the state is determined during the first render. It's considered controlled if the value is not `undefined`.",
+        'More info: https://fb.me/react-controlled-components'
+    ].join('\n');
+};
+var defaultChangedError = function (_a) {
+    var stateName = _a.stateName, componentName = _a.componentName;
+    return ("Audius Harmony: A component is changing the default ".concat(stateName, " state of an uncontrolled ").concat(componentName, " after being initialized. ") +
+        "To suppress this warning opt to use a controlled ".concat(componentName, "."));
+};
+var useControlled = function (_a) {
+    var controlledProp = _a.controlledProp, defaultValue = _a.defaultValue, _b = _a.stateName, stateName = _b === void 0 ? 'value' : _b, componentName = _a.componentName;
+    // Save a ref of the initial isControlled state
+    var isControlled = useRef(controlledProp !== undefined).current;
+    // Local state for use with uncontrolled components
+    var _c = useState(defaultValue), valueState = _c[0], setValueState = _c[1];
+    // If the component is controlled, use the controlled prop rather than the local state
+    var value = isControlled ? controlledProp : valueState;
+    // If the component is uncontrolled, this callback can be used to set the value
+    var setValueIfUncontrolled = useCallback(function (newValue) {
+        if (!isControlled) {
+            setValueState(newValue);
+        }
+    }, [isControlled]);
+    // Note each hook in this block has disabled react-hooks/rules-of-hooks
+    // The code won't fork here at runtime, you'll either be in production or you won't.
+    /* eslint-disable react-hooks/rules-of-hooks */
+    if (process.env.NODE_ENV !== 'production') {
+        // Check if the component is switching from controlled to uncontrolled or vice-versa
+        useEffect(function () {
+            if (isControlled !== (controlledProp !== undefined)) {
+                console.error(switchControlledError({ isControlled: isControlled, stateName: stateName, componentName: componentName }));
+            }
+        }, [componentName, controlledProp, isControlled, stateName]);
+        // Check if the default value of an uncontrolled prop is being changed after initialization
+        var initialDefaultValue_1 = useRef(defaultValue).current;
+        useEffect(function () {
+            if (!isControlled && defaultValue !== initialDefaultValue_1) {
+                console.error(defaultChangedError({ stateName: stateName, componentName: componentName }));
+            }
+        }, [
+            componentName,
+            defaultValue,
+            initialDefaultValue_1,
+            isControlled,
+            stateName
+        ]);
+    }
+    /* eslint-enable react-hooks/rules-of-hooks */
+    return [value, setValueIfUncontrolled];
+};
+
+export { useControlled };
+//# sourceMappingURL=useControlled.js.map

package/dist/hooks/useControlled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useControlled.js","sources":["../../src/hooks/useControlled.ts"],"sourcesContent":["/**\nThe MIT License (MIT)\n\nCopyright (c) 2014 Call-Em-All\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n */\n\n// Adapted from Material UI: https://github.com/mui/material-ui/blob/a31d9166a46b41b63b1932252e8eb32a3f4dfb2b/packages/mui-utils/src/useControlled.js\n\nimport { useRef, useState, useCallback, useEffect } from 'react'\n\nconst switchControlledError = ({\n  isControlled,\n  stateName,\n  componentName\n}: {\n  isControlled: boolean\n  stateName: string\n  componentName: string\n}) => {\n  return [\n    `Audius Harmony: A component is changing an ${\n      isControlled ? '' : 'un'\n    }controlled ${stateName} state of ${componentName} to be ${\n      isControlled ? 'un' : ''\n    }controlled.`,\n    'This is likely caused by the value changing from undefined to a defined value, which should not happen.',\n    'Decide between using a controlled or uncontrolled input element for the lifetime of the component.',\n    \"The nature of the state is determined during the first render. It's considered controlled if the value is not `undefined`.\",\n    'More info: https://fb.me/react-controlled-components'\n  ].join('\\n')\n}\n\nconst defaultChangedError = ({\n  stateName,\n  componentName\n}: {\n  stateName: string\n  componentName: string\n}) => {\n  return (\n    `Audius Harmony: A component is changing the default ${stateName} state of an uncontrolled ${componentName} after being initialized. ` +\n    `To suppress this warning opt to use a controlled ${componentName}.`\n  )\n}\n\nexport const useControlled = <\n  T extends string | number | boolean | undefined | null | readonly string[]\n>({\n  controlledProp,\n  defaultValue,\n  stateName = 'value',\n  componentName\n}: {\n  controlledProp: T\n  defaultValue: T\n  stateName?: string\n  componentName: string\n}): [T, (newValue: T) => void] => {\n  // Save a ref of the initial isControlled state\n  const { current: isControlled } = useRef(controlledProp !== undefined)\n\n  // Local state for use with uncontrolled components\n  const [valueState, setValueState] = useState(defaultValue)\n\n  // If the component is controlled, use the controlled prop rather than the local state\n  const value = isControlled ? controlledProp : valueState\n\n  // If the component is uncontrolled, this callback can be used to set the value\n  const setValueIfUncontrolled = useCallback(\n    (newValue: T) => {\n      if (!isControlled) {\n        setValueState(newValue)\n      }\n    },\n    [isControlled]\n  )\n\n  // Note each hook in this block has disabled react-hooks/rules-of-hooks\n  // The code won't fork here at runtime, you'll either be in production or you won't.\n  /* eslint-disable react-hooks/rules-of-hooks */\n  if (process.env.NODE_ENV !== 'production') {\n    // Check if the component is switching from controlled to uncontrolled or vice-versa\n    useEffect(() => {\n      if (isControlled !== (controlledProp !== undefined)) {\n        console.error(\n          switchControlledError({ isControlled, stateName, componentName })\n        )\n      }\n    }, [componentName, controlledProp, isControlled, stateName])\n\n    // Check if the default value of an uncontrolled prop is being changed after initialization\n    const { current: initialDefaultValue } = useRef(defaultValue)\n    useEffect(() => {\n      if (!isControlled && defaultValue !== initialDefaultValue) {\n        console.error(defaultChangedError({ stateName, componentName }))\n      }\n    }, [\n      componentName,\n      defaultValue,\n      initialDefaultValue,\n      isControlled,\n      stateName\n    ])\n  }\n  /* eslint-enable react-hooks/rules-of-hooks */\n\n  return [value, setValueIfUncontrolled]\n}\n"],"names":[],"mappings":";;AAAA;;;;;;;;;;;;;;;;;;;;;;AAsBG;AAEH;AAIA,IAAM,qBAAqB,GAAG,UAAC,EAQ9B,EAAA;AAPC,IAAA,IAAA,YAAY,kBAAA,EACZ,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,aAAa,GAAA,EAAA,CAAA,aAAA,CAAA;IAMb,OAAO;QACL,6CACE,CAAA,MAAA,CAAA,YAAY,GAAG,EAAE,GAAG,IAAI,EACZ,aAAA,CAAA,CAAA,MAAA,CAAA,SAAS,uBAAa,aAAa,EAAA,SAAA,CAAA,CAAA,MAAA,CAC/C,YAAY,GAAG,IAAI,GAAG,EAAE,EACb,aAAA,CAAA;QACb,yGAAyG;QACzG,oGAAoG;QACpG,4HAA4H;QAC5H,sDAAsD;AACvD,KAAA,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;AACd,CAAC,CAAA;AAED,IAAM,mBAAmB,GAAG,UAAC,EAM5B,EAAA;QALC,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,aAAa,GAAA,EAAA,CAAA,aAAA,CAAA;AAKb,IAAA,QACE,sDAAA,CAAA,MAAA,CAAuD,SAAS,EAAA,4BAAA,CAAA,CAAA,MAAA,CAA6B,aAAa,EAA4B,4BAAA,CAAA;QACtI,mDAAoD,CAAA,MAAA,CAAA,aAAa,EAAG,GAAA,CAAA,EACrE;AACH,CAAC,CAAA;AAEM,IAAM,aAAa,GAAG,UAE3B,EAUD,EAAA;AATC,IAAA,IAAA,cAAc,GAAA,EAAA,CAAA,cAAA,EACd,YAAY,GAAA,EAAA,CAAA,YAAA,EACZ,EAAA,GAAA,EAAA,CAAA,SAAmB,EAAnB,SAAS,GAAG,EAAA,KAAA,KAAA,CAAA,GAAA,OAAO,GAAA,EAAA,EACnB,aAAa,GAAA,EAAA,CAAA,aAAA,CAAA;;IAQL,IAAS,YAAY,GAAK,MAAM,CAAC,cAAc,KAAK,SAAS,CAAC,CAAA,OAAzC,CAAyC;;IAGhE,IAAA,EAAA,GAA8B,QAAQ,CAAC,YAAY,CAAC,EAAnD,UAAU,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,aAAa,GAAA,EAAA,CAAA,CAAA,CAA0B,CAAA;;IAG1D,IAAM,KAAK,GAAG,YAAY,GAAG,cAAc,GAAG,UAAU,CAAA;;AAGxD,IAAA,IAAM,sBAAsB,GAAG,WAAW,CACxC,UAAC,QAAW,EAAA;QACV,IAAI,CAAC,YAAY,EAAE;YACjB,aAAa,CAAC,QAAQ,CAAC,CAAA;AACxB,SAAA;AACH,KAAC,EACD,CAAC,YAAY,CAAC,CACf,CAAA;;;;AAKD,IAAA,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,YAAY,EAAE;;AAEzC,QAAA,SAAS,CAAC,YAAA;AACR,YAAA,IAAI,YAAY,MAAM,cAAc,KAAK,SAAS,CAAC,EAAE;AACnD,gBAAA,OAAO,CAAC,KAAK,CACX,qBAAqB,CAAC,EAAE,YAAY,EAAA,YAAA,EAAE,SAAS,WAAA,EAAE,aAAa,eAAA,EAAE,CAAC,CAClE,CAAA;AACF,aAAA;SACF,EAAE,CAAC,aAAa,EAAE,cAAc,EAAE,YAAY,EAAE,SAAS,CAAC,CAAC,CAAA;;AAGpD,QAAA,IAAS,qBAAmB,GAAK,MAAM,CAAC,YAAY,CAAC,QAAzB,CAAyB;AAC7D,QAAA,SAAS,CAAC,YAAA;AACR,YAAA,IAAI,CAAC,YAAY,IAAI,YAAY,KAAK,qBAAmB,EAAE;AACzD,gBAAA,OAAO,CAAC,KAAK,CAAC,mBAAmB,CAAC,EAAE,SAAS,EAAA,SAAA,EAAE,aAAa,EAAA,aAAA,EAAE,CAAC,CAAC,CAAA;AACjE,aAAA;AACH,SAAC,EAAE;YACD,aAAa;YACb,YAAY;YACZ,qBAAmB;YACnB,YAAY;YACZ,SAAS;AACV,SAAA,CAAC,CAAA;AACH,KAAA;;AAGD,IAAA,OAAO,CAAC,KAAK,EAAE,sBAAsB,CAAC,CAAA;AACxC;;;;"}

package/dist/hooks/useHotKeys.d.ts

@@ -0,0 +1,45 @@
+export declare enum ModifierKeys {
+    CMD = 0,
+    CTRL = 1,
+    SHIFT = 2,
+    ALT = 3
+}
+type ModifierHandler = {
+    cb: (e?: KeyboardEvent) => void;
+    or?: ModifierKeys[];
+    and?: ModifierKeys[];
+};
+type Handler = (e?: KeyboardEvent) => void;
+export type Mapping = {
+    [key: number]: Handler | ModifierHandler;
+};
+/**
+ * Sets up hotkeys for a component. Should generally be called in componentDidMount.
+ * @param mapping the hotkey mapping keycodes to callback.
+ * @param throttleMs the number of milliseconds to throttle keydown events with.
+ * For example:
+ *  setupHotkeys({32: this.playMusic})  // fires playMusic() on 'space'
+ *
+ * The mapping values may be an object with three fields:
+ *  cb: the callback to fire
+ *  or: modifier keys that must be OR'd with the hotkey
+ *  and: modifier keys that must be AND'd with the hotkey
+ *
+ * For example:
+ *  setupHotkeys({32: {cb: this.playMusic, or: [CMD, CTRL]})
+ *    // fires on 'cmd+space' or 'ctrl+space'
+ *  setupHotkeys({32: {cb: this.playMusic, and: [CMD, CTRL]})
+ *    // fires on 'cmd+ctrl+space'
+ *  setupHotkeys({32: {cb: this.playMusic, or: [ALT, CTRL], and: [CMD, SHIFT]})
+ *    // fires on 'cmd+shift+alt+space' or 'cmd+shift+ctrl+space'\
+ * @returns the event listener function
+ */
+export declare function setupHotkeys(mapping: Mapping, throttleMs?: number, preventDefault?: boolean): (e: KeyboardEvent) => void;
+/**
+ * Removes a hotkey event listener.
+ * @param {function} hook the function hook returned by setupHotkeys.
+ */
+export declare function removeHotkeys(hook: (e: KeyboardEvent) => void): void;
+export declare const useHotkeys: (mapping: Mapping) => void;
+export {};
+//# sourceMappingURL=useHotKeys.d.ts.map

package/dist/hooks/useHotKeys.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useHotKeys.d.ts","sourceRoot":"","sources":["../../src/hooks/useHotKeys.ts"],"names":[],"mappings":"AAIA,oBAAY,YAAY;IACtB,GAAG,IAAI;IACP,IAAI,IAAI;IACR,KAAK,IAAI;IACT,GAAG,IAAI;CACR;AAED,KAAK,eAAe,GAAG;IACrB,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,aAAa,KAAK,IAAI,CAAA;IAC/B,EAAE,CAAC,EAAE,YAAY,EAAE,CAAA;IACnB,GAAG,CAAC,EAAE,YAAY,EAAE,CAAA;CACrB,CAAA;AAED,KAAK,OAAO,GAAG,CAAC,CAAC,CAAC,EAAE,aAAa,KAAK,IAAI,CAAA;AAC1C,MAAM,MAAM,OAAO,GAAG;IACpB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,GAAG,eAAe,CAAA;CACzC,CAAA;AAuED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,YAAY,CAC1B,OAAO,EAAE,OAAO,EAChB,UAAU,SAAM,EAChB,cAAc,UAAO,OAKK,aAAa,UAIxC;AAED;;;GAGG;AACH,wBAAgB,aAAa,CAAC,IAAI,EAAE,CAAC,CAAC,EAAE,aAAa,KAAK,IAAI,QAE7D;AAED,eAAO,MAAM,UAAU,YAAa,OAAO,SAO1C,CAAA"}

package/dist/hooks/useHotKeys.js

@@ -0,0 +1,127 @@
+import { useEffect } from 'react';
+import { throttle, size } from 'lodash';
+
+var ModifierKeys;
+(function (ModifierKeys) {
+    ModifierKeys[ModifierKeys["CMD"] = 0] = "CMD";
+    ModifierKeys[ModifierKeys["CTRL"] = 1] = "CTRL";
+    ModifierKeys[ModifierKeys["SHIFT"] = 2] = "SHIFT";
+    ModifierKeys[ModifierKeys["ALT"] = 3] = "ALT";
+})(ModifierKeys || (ModifierKeys = {}));
+/**
+ * Checks whether the DOM is in a state where a global hotkey press is allowed.
+ * For example, even if an anchor tag has focus, it should not prevent global hotkeys
+ * from working.
+ * @returns whether or not a global hotkey press is allowed.
+ */
+function allowGlobalHotkeyPress() {
+    return (document.activeElement &&
+        (document.activeElement === document.body ||
+            document.activeElement.nodeName === 'A' /* <a> */ ||
+            document.activeElement.nodeName === 'BUTTON' /* <button> */ ||
+            document.activeElement.getAttribute('role') === 'button' ||
+            document.activeElement.getAttribute('role') === 'main')); /* Lottie button */
+}
+function isModifierPressed(modifier, e) {
+    if (modifier === ModifierKeys.CMD)
+        return e.metaKey;
+    if (modifier === ModifierKeys.CTRL)
+        return e.ctrlKey;
+    if (modifier === ModifierKeys.SHIFT)
+        return e.shiftKey;
+    if (modifier === ModifierKeys.ALT)
+        return e.altKey;
+    return false;
+}
+function isAnyModifierPressed(e) {
+    return e.metaKey || e.ctrlKey || e.shiftKey || e.altKey;
+}
+function fireHotkey(e, mapping, preventDefault) {
+    if (allowGlobalHotkeyPress() && e.keyCode in mapping) {
+        if (size(mapping[e.keyCode]) > 1) {
+            var cb = mapping[e.keyCode].cb;
+            var or = mapping[e.keyCode].or;
+            var and = mapping[e.keyCode].and;
+            var satisfiedOr_1 = true;
+            if (or) {
+                satisfiedOr_1 = false;
+                or.forEach(function (modifier) {
+                    if (isModifierPressed(modifier, e))
+                        satisfiedOr_1 = true;
+                });
+            }
+            var satisfiedAnd_1 = true;
+            if (and) {
+                and.forEach(function (modifier) {
+                    if (!isModifierPressed(modifier, e))
+                        satisfiedAnd_1 = false;
+                });
+            }
+            if (satisfiedOr_1 && satisfiedAnd_1) {
+                if (preventDefault)
+                    e.preventDefault();
+                cb(e);
+            }
+        }
+        else {
+            // If no modifier keys are required, abort if any are pressed.
+            if (isAnyModifierPressed(e))
+                return;
+            // Otherwise, fire the hotkey.
+            if (preventDefault)
+                e.preventDefault();
+            mapping[e.keyCode](e);
+        }
+    }
+}
+/**
+ * Sets up hotkeys for a component. Should generally be called in componentDidMount.
+ * @param mapping the hotkey mapping keycodes to callback.
+ * @param throttleMs the number of milliseconds to throttle keydown events with.
+ * For example:
+ *  setupHotkeys({32: this.playMusic})  // fires playMusic() on 'space'
+ *
+ * The mapping values may be an object with three fields:
+ *  cb: the callback to fire
+ *  or: modifier keys that must be OR'd with the hotkey
+ *  and: modifier keys that must be AND'd with the hotkey
+ *
+ * For example:
+ *  setupHotkeys({32: {cb: this.playMusic, or: [CMD, CTRL]})
+ *    // fires on 'cmd+space' or 'ctrl+space'
+ *  setupHotkeys({32: {cb: this.playMusic, and: [CMD, CTRL]})
+ *    // fires on 'cmd+ctrl+space'
+ *  setupHotkeys({32: {cb: this.playMusic, or: [ALT, CTRL], and: [CMD, SHIFT]})
+ *    // fires on 'cmd+shift+alt+space' or 'cmd+shift+ctrl+space'\
+ * @returns the event listener function
+ */
+function setupHotkeys(mapping, throttleMs, preventDefault) {
+    if (throttleMs === void 0) { throttleMs = 100; }
+    if (preventDefault === void 0) { preventDefault = true; }
+    var hotkeyHook = function (e) {
+        fireHotkey(e, mapping, preventDefault);
+    };
+    var throttledHook = function (e) {
+        return throttle(hotkeyHook, throttleMs, { leading: true })(e);
+    };
+    document.addEventListener('keydown', throttledHook, false);
+    return throttledHook;
+}
+/**
+ * Removes a hotkey event listener.
+ * @param {function} hook the function hook returned by setupHotkeys.
+ */
+function removeHotkeys(hook) {
+    document.removeEventListener('keydown', hook, false);
+}
+var useHotkeys = function (mapping) {
+    useEffect(function () {
+        var hook = setupHotkeys(mapping);
+        return function () {
+            removeHotkeys(hook);
+        };
+    }, [mapping]);
+};
+
+export { ModifierKeys, removeHotkeys, setupHotkeys, useHotkeys };
+//# sourceMappingURL=useHotKeys.js.map

package/dist/hooks/useHotKeys.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useHotKeys.js","sources":["../../src/hooks/useHotKeys.ts"],"sourcesContent":["import { useEffect } from 'react'\n\nimport { size, throttle } from 'lodash'\n\nexport enum ModifierKeys {\n  CMD = 0,\n  CTRL = 1,\n  SHIFT = 2,\n  ALT = 3\n}\n\ntype ModifierHandler = {\n  cb: (e?: KeyboardEvent) => void\n  or?: ModifierKeys[]\n  and?: ModifierKeys[]\n}\n\ntype Handler = (e?: KeyboardEvent) => void\nexport type Mapping = {\n  [key: number]: Handler | ModifierHandler\n}\n\n/**\n * Checks whether the DOM is in a state where a global hotkey press is allowed.\n * For example, even if an anchor tag has focus, it should not prevent global hotkeys\n * from working.\n * @returns whether or not a global hotkey press is allowed.\n */\nfunction allowGlobalHotkeyPress() {\n  return (\n    document.activeElement &&\n    (document.activeElement === document.body ||\n      document.activeElement.nodeName === 'A' /* <a> */ ||\n      document.activeElement.nodeName === 'BUTTON' /* <button> */ ||\n      document.activeElement.getAttribute('role') === 'button' ||\n      document.activeElement.getAttribute('role') === 'main')\n  ) /* Lottie button */\n}\n\nfunction isModifierPressed(modifier: ModifierKeys, e: KeyboardEvent) {\n  if (modifier === ModifierKeys.CMD) return e.metaKey\n  if (modifier === ModifierKeys.CTRL) return e.ctrlKey\n  if (modifier === ModifierKeys.SHIFT) return e.shiftKey\n  if (modifier === ModifierKeys.ALT) return e.altKey\n  return false\n}\n\nfunction isAnyModifierPressed(e: KeyboardEvent) {\n  return e.metaKey || e.ctrlKey || e.shiftKey || e.altKey\n}\n\nfunction fireHotkey(\n  e: KeyboardEvent,\n  mapping: Mapping,\n  preventDefault: boolean\n) {\n  if (allowGlobalHotkeyPress() && e.keyCode in mapping) {\n    if (size(mapping[e.keyCode]) > 1) {\n      const cb = (mapping[e.keyCode] as ModifierHandler).cb\n      const or = (mapping[e.keyCode] as ModifierHandler).or\n      const and = (mapping[e.keyCode] as ModifierHandler).and\n\n      let satisfiedOr = true\n      if (or) {\n        satisfiedOr = false\n        or.forEach((modifier) => {\n          if (isModifierPressed(modifier as ModifierKeys, e)) satisfiedOr = true\n        })\n      }\n\n      let satisfiedAnd = true\n      if (and) {\n        and.forEach((modifier) => {\n          if (!isModifierPressed(modifier, e)) satisfiedAnd = false\n        })\n      }\n\n      if (satisfiedOr && satisfiedAnd) {\n        if (preventDefault) e.preventDefault()\n        cb(e)\n      }\n    } else {\n      // If no modifier keys are required, abort if any are pressed.\n      if (isAnyModifierPressed(e)) return\n      // Otherwise, fire the hotkey.\n      if (preventDefault) e.preventDefault()\n      ;(mapping[e.keyCode] as Handler)(e)\n    }\n  }\n}\n\n/**\n * Sets up hotkeys for a component. Should generally be called in componentDidMount.\n * @param mapping the hotkey mapping keycodes to callback.\n * @param throttleMs the number of milliseconds to throttle keydown events with.\n * For example:\n *  setupHotkeys({32: this.playMusic})  // fires playMusic() on 'space'\n *\n * The mapping values may be an object with three fields:\n *  cb: the callback to fire\n *  or: modifier keys that must be OR'd with the hotkey\n *  and: modifier keys that must be AND'd with the hotkey\n *\n * For example:\n *  setupHotkeys({32: {cb: this.playMusic, or: [CMD, CTRL]})\n *    // fires on 'cmd+space' or 'ctrl+space'\n *  setupHotkeys({32: {cb: this.playMusic, and: [CMD, CTRL]})\n *    // fires on 'cmd+ctrl+space'\n *  setupHotkeys({32: {cb: this.playMusic, or: [ALT, CTRL], and: [CMD, SHIFT]})\n *    // fires on 'cmd+shift+alt+space' or 'cmd+shift+ctrl+space'\\\n * @returns the event listener function\n */\nexport function setupHotkeys(\n  mapping: Mapping,\n  throttleMs = 100,\n  preventDefault = true\n) {\n  const hotkeyHook = (e: KeyboardEvent) => {\n    fireHotkey(e, mapping, preventDefault)\n  }\n  const throttledHook = (e: KeyboardEvent) =>\n    throttle(hotkeyHook, throttleMs, { leading: true })(e)\n  document.addEventListener('keydown', throttledHook, false)\n  return throttledHook\n}\n\n/**\n * Removes a hotkey event listener.\n * @param {function} hook the function hook returned by setupHotkeys.\n */\nexport function removeHotkeys(hook: (e: KeyboardEvent) => void) {\n  document.removeEventListener('keydown', hook, false)\n}\n\nexport const useHotkeys = (mapping: Mapping) => {\n  useEffect(() => {\n    const hook = setupHotkeys(mapping)\n    return () => {\n      removeHotkeys(hook)\n    }\n  }, [mapping])\n}\n"],"names":[],"mappings":"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"}

package/dist/hooks/useHoverDelay.d.ts

@@ -0,0 +1,21 @@
+/// <reference types="react" />
+export type TriggerType = 'hover' | 'click' | 'both';
+/**
+ * Hook that manages delayed hover state and optional click state
+ *
+ * @param delay Delay in seconds before setting hovered state to true
+ * @param triggeredBy Whether to trigger on hover, click, or both
+ * @returns Object containing hover state and handlers
+ */
+export declare const useHoverDelay: (delay?: number, triggeredBy?: TriggerType) => {
+    isHovered: boolean;
+    isClicked: boolean;
+    isVisible: boolean;
+    handleMouseEnter: () => void;
+    handleMouseLeave: () => void;
+    handleClick: () => void;
+    clearTimer: () => void;
+    setIsHovered: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+    setIsClicked: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+};
+//# sourceMappingURL=useHoverDelay.d.ts.map

package/dist/hooks/useHoverDelay.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useHoverDelay.d.ts","sourceRoot":"","sources":["../../src/hooks/useHoverDelay.ts"],"names":[],"mappings":";AAEA,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAA;AAEpD;;;;;;GAMG;AACH,eAAO,MAAM,aAAa,iCAEX,WAAW;;;;;;;;;;CAsEzB,CAAA"}

package/dist/hooks/useHoverDelay.js

@@ -0,0 +1,74 @@
+import { useState, useRef, useEffect, useCallback } from 'react';
+
+/**
+ * Hook that manages delayed hover state and optional click state
+ *
+ * @param delay Delay in seconds before setting hovered state to true
+ * @param triggeredBy Whether to trigger on hover, click, or both
+ * @returns Object containing hover state and handlers
+ */
+var useHoverDelay = function (delay, triggeredBy) {
+    if (delay === void 0) { delay = 0.5; }
+    if (triggeredBy === void 0) { triggeredBy = 'hover'; }
+    var _a = useState(false), isHovered = _a[0], setIsHovered = _a[1];
+    var _b = useState(false), isClicked = _b[0], setIsClicked = _b[1];
+    var timerRef = useRef(null);
+    // Clean up the timer when component unmounts
+    useEffect(function () {
+        return function () {
+            if (timerRef.current !== null) {
+                clearTimeout(timerRef.current);
+            }
+        };
+    }, []);
+    var clearTimer = useCallback(function () {
+        if (timerRef.current !== null) {
+            clearTimeout(timerRef.current);
+            timerRef.current = null;
+        }
+    }, []);
+    var handleMouseEnter = useCallback(function () {
+        if (triggeredBy === 'click')
+            return;
+        clearTimer();
+        // Convert seconds to milliseconds
+        var delayMs = delay * 1000;
+        timerRef.current = setTimeout(function () {
+            setIsHovered(true);
+        }, delayMs);
+    }, [delay, clearTimer, triggeredBy]);
+    var handleMouseLeave = useCallback(function () {
+        if (triggeredBy === 'click')
+            return;
+        clearTimer();
+        setIsHovered(false);
+    }, [clearTimer, triggeredBy]);
+    var handleClick = useCallback(function () {
+        if (triggeredBy === 'hover')
+            return;
+        clearTimer();
+        setIsClicked(function (prev) { return !prev; });
+        // Also clear hover state when clicking
+        setIsHovered(false);
+    }, [clearTimer, triggeredBy]);
+    // Determine the final visible state based on trigger type
+    var isVisible = triggeredBy === 'click'
+        ? isClicked
+        : triggeredBy === 'both'
+            ? isHovered || isClicked
+            : isHovered;
+    return {
+        isHovered: isHovered,
+        isClicked: isClicked,
+        isVisible: isVisible,
+        handleMouseEnter: handleMouseEnter,
+        handleMouseLeave: handleMouseLeave,
+        handleClick: handleClick,
+        clearTimer: clearTimer,
+        setIsHovered: setIsHovered,
+        setIsClicked: setIsClicked
+    };
+};
+
+export { useHoverDelay };
+//# sourceMappingURL=useHoverDelay.js.map

package/dist/hooks/useHoverDelay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useHoverDelay.js","sources":["../../src/hooks/useHoverDelay.ts"],"sourcesContent":["import { useRef, useState, useEffect, useCallback } from 'react'\n\nexport type TriggerType = 'hover' | 'click' | 'both'\n\n/**\n * Hook that manages delayed hover state and optional click state\n *\n * @param delay Delay in seconds before setting hovered state to true\n * @param triggeredBy Whether to trigger on hover, click, or both\n * @returns Object containing hover state and handlers\n */\nexport const useHoverDelay = (\n  delay = 0.5,\n  triggeredBy: TriggerType = 'hover'\n) => {\n  const [isHovered, setIsHovered] = useState(false)\n  const [isClicked, setIsClicked] = useState(false)\n  const timerRef = useRef<NodeJS.Timeout | null>(null)\n\n  // Clean up the timer when component unmounts\n  useEffect(() => {\n    return () => {\n      if (timerRef.current !== null) {\n        clearTimeout(timerRef.current)\n      }\n    }\n  }, [])\n\n  const clearTimer = useCallback(() => {\n    if (timerRef.current !== null) {\n      clearTimeout(timerRef.current)\n      timerRef.current = null\n    }\n  }, [])\n\n  const handleMouseEnter = useCallback(() => {\n    if (triggeredBy === 'click') return\n\n    clearTimer()\n\n    // Convert seconds to milliseconds\n    const delayMs = delay * 1000\n\n    timerRef.current = setTimeout(() => {\n      setIsHovered(true)\n    }, delayMs)\n  }, [delay, clearTimer, triggeredBy])\n\n  const handleMouseLeave = useCallback(() => {\n    if (triggeredBy === 'click') return\n\n    clearTimer()\n    setIsHovered(false)\n  }, [clearTimer, triggeredBy])\n\n  const handleClick = useCallback(() => {\n    if (triggeredBy === 'hover') return\n\n    clearTimer()\n    setIsClicked((prev) => !prev)\n    // Also clear hover state when clicking\n    setIsHovered(false)\n  }, [clearTimer, triggeredBy])\n\n  // Determine the final visible state based on trigger type\n  const isVisible =\n    triggeredBy === 'click'\n      ? isClicked\n      : triggeredBy === 'both'\n        ? isHovered || isClicked\n        : isHovered\n\n  return {\n    isHovered,\n    isClicked,\n    isVisible,\n    handleMouseEnter,\n    handleMouseLeave,\n    handleClick,\n    clearTimer,\n    setIsHovered,\n    setIsClicked\n  }\n}\n"],"names":[],"mappings":";;AAIA;;;;;;AAMG;AACU,IAAA,aAAa,GAAG,UAC3B,KAAW,EACX,WAAkC,EAAA;AADlC,IAAA,IAAA,KAAA,KAAA,KAAA,CAAA,EAAA,EAAA,KAAW,GAAA,GAAA,CAAA,EAAA;AACX,IAAA,IAAA,WAAA,KAAA,KAAA,CAAA,EAAA,EAAA,WAAkC,GAAA,OAAA,CAAA,EAAA;IAE5B,IAAA,EAAA,GAA4B,QAAQ,CAAC,KAAK,CAAC,EAA1C,SAAS,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,YAAY,GAAA,EAAA,CAAA,CAAA,CAAmB,CAAA;IAC3C,IAAA,EAAA,GAA4B,QAAQ,CAAC,KAAK,CAAC,EAA1C,SAAS,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,YAAY,GAAA,EAAA,CAAA,CAAA,CAAmB,CAAA;AACjD,IAAA,IAAM,QAAQ,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAA;;AAGpD,IAAA,SAAS,CAAC,YAAA;QACR,OAAO,YAAA;AACL,YAAA,IAAI,QAAQ,CAAC,OAAO,KAAK,IAAI,EAAE;AAC7B,gBAAA,YAAY,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAA;AAC/B,aAAA;AACH,SAAC,CAAA;KACF,EAAE,EAAE,CAAC,CAAA;IAEN,IAAM,UAAU,GAAG,WAAW,CAAC,YAAA;AAC7B,QAAA,IAAI,QAAQ,CAAC,OAAO,KAAK,IAAI,EAAE;AAC7B,YAAA,YAAY,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAA;AAC9B,YAAA,QAAQ,CAAC,OAAO,GAAG,IAAI,CAAA;AACxB,SAAA;KACF,EAAE,EAAE,CAAC,CAAA;IAEN,IAAM,gBAAgB,GAAG,WAAW,CAAC,YAAA;QACnC,IAAI,WAAW,KAAK,OAAO;YAAE,OAAM;AAEnC,QAAA,UAAU,EAAE,CAAA;;AAGZ,QAAA,IAAM,OAAO,GAAG,KAAK,GAAG,IAAI,CAAA;AAE5B,QAAA,QAAQ,CAAC,OAAO,GAAG,UAAU,CAAC,YAAA;YAC5B,YAAY,CAAC,IAAI,CAAC,CAAA;SACnB,EAAE,OAAO,CAAC,CAAA;KACZ,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,WAAW,CAAC,CAAC,CAAA;IAEpC,IAAM,gBAAgB,GAAG,WAAW,CAAC,YAAA;QACnC,IAAI,WAAW,KAAK,OAAO;YAAE,OAAM;AAEnC,QAAA,UAAU,EAAE,CAAA;QACZ,YAAY,CAAC,KAAK,CAAC,CAAA;AACrB,KAAC,EAAE,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC,CAAA;IAE7B,IAAM,WAAW,GAAG,WAAW,CAAC,YAAA;QAC9B,IAAI,WAAW,KAAK,OAAO;YAAE,OAAM;AAEnC,QAAA,UAAU,EAAE,CAAA;QACZ,YAAY,CAAC,UAAC,IAAI,EAAK,EAAA,OAAA,CAAC,IAAI,CAAA,EAAA,CAAC,CAAA;;QAE7B,YAAY,CAAC,KAAK,CAAC,CAAA;AACrB,KAAC,EAAE,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC,CAAA;;AAG7B,IAAA,IAAM,SAAS,GACb,WAAW,KAAK,OAAO;AACrB,UAAE,SAAS;UACT,WAAW,KAAK,MAAM;cACpB,SAAS,IAAI,SAAS;cACtB,SAAS,CAAA;IAEjB,OAAO;AACL,QAAA,SAAS,EAAA,SAAA;AACT,QAAA,SAAS,EAAA,SAAA;AACT,QAAA,SAAS,EAAA,SAAA;AACT,QAAA,gBAAgB,EAAA,gBAAA;AAChB,QAAA,gBAAgB,EAAA,gBAAA;AAChB,QAAA,WAAW,EAAA,WAAA;AACX,QAAA,UAAU,EAAA,UAAA;AACV,QAAA,YAAY,EAAA,YAAA;AACZ,QAAA,YAAY,EAAA,YAAA;KACb,CAAA;AACH;;;;"}

package/dist/hooks/useMedia.d.ts

@@ -0,0 +1,19 @@
+/**
+ * A hook that provides responsive design state based on predefined breakpoints.
+ *
+ * This is now a re-export from MediaContext, which centralizes all media query listeners
+ * in a single provider to improve performance.
+ *
+ * @example
+ * ```tsx
+ * const { isMobile, isTablet, isDesktop, matchesQuery } = useMedia()
+ *
+ * // Conditionally render based on screen size
+ * if (isMobile) return <MobileView />
+ * if (isTablet) return <TabletView />
+ * if (matchesQuery(breakpoints.between.lg_xl)) return <LargeDesktopView />
+ * return <DefaultView />
+ * ```
+ */
+export { useMedia } from '../contexts/MediaContext';
+//# sourceMappingURL=useMedia.d.ts.map

package/dist/hooks/useMedia.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMedia.d.ts","sourceRoot":"","sources":["../../src/hooks/useMedia.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAA"}

package/dist/hooks/useMediaQueryListener.d.ts

@@ -0,0 +1,4 @@
+export declare const useMediaQueryListener: (mediaQuery: string) => {
+    isMatch: boolean;
+};
+//# sourceMappingURL=useMediaQueryListener.d.ts.map

package/dist/hooks/useMediaQueryListener.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMediaQueryListener.d.ts","sourceRoot":"","sources":["../../src/hooks/useMediaQueryListener.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,qBAAqB,eAAgB,MAAM;;CAyBvD,CAAA"}

package/dist/hooks/useMediaQueryListener.js

@@ -0,0 +1,26 @@
+import { useState, useCallback, useEffect } from 'react';
+
+var useMediaQueryListener = function (mediaQuery) {
+    // Stores whether there is a match
+    var _a = useState(false), isMatch = _a[0], setIsMatch = _a[1];
+    // Updates whether there is a match or not
+    // when the media query status changes
+    var listener = useCallback(function (event) { return setIsMatch(event.matches); }, [setIsMatch]);
+    // If mediaQuery is set, set up a media query listener
+    useEffect(function () {
+        var _a;
+        if (mediaQuery) {
+            var matcher_1 = window.matchMedia(mediaQuery);
+            // Set initial value
+            setIsMatch(matcher_1.matches);
+            // Use modern event listener API
+            (_a = matcher_1.addEventListener) === null || _a === void 0 ? void 0 : _a.call(matcher_1, 'change', listener);
+            return function () { var _a; return (_a = matcher_1.removeEventListener) === null || _a === void 0 ? void 0 : _a.call(matcher_1, 'change', listener); };
+        }
+        return function () { };
+    }, [mediaQuery, listener]);
+    return { isMatch: isMatch };
+};
+
+export { useMediaQueryListener };
+//# sourceMappingURL=useMediaQueryListener.js.map

package/dist/hooks/useMediaQueryListener.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMediaQueryListener.js","sources":["../../src/hooks/useMediaQueryListener.ts"],"sourcesContent":["import { useEffect, useState, useCallback } from 'react'\n\nexport const useMediaQueryListener = (mediaQuery: string) => {\n  // Stores whether there is a match\n  const [isMatch, setIsMatch] = useState(false)\n\n  // Updates whether there is a match or not\n  // when the media query status changes\n  const listener = useCallback(\n    (event: MediaQueryListEvent) => setIsMatch(event.matches),\n    [setIsMatch]\n  )\n\n  // If mediaQuery is set, set up a media query listener\n  useEffect(() => {\n    if (mediaQuery) {\n      const matcher = window.matchMedia(mediaQuery)\n      // Set initial value\n      setIsMatch(matcher.matches)\n      // Use modern event listener API\n      matcher.addEventListener?.('change', listener)\n      return () => matcher.removeEventListener?.('change', listener)\n    }\n    return () => {}\n  }, [mediaQuery, listener])\n\n  return { isMatch }\n}\n"],"names":[],"mappings":";;AAEO,IAAM,qBAAqB,GAAG,UAAC,UAAkB,EAAA;;IAEhD,IAAA,EAAA,GAAwB,QAAQ,CAAC,KAAK,CAAC,EAAtC,OAAO,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,UAAU,GAAA,EAAA,CAAA,CAAA,CAAmB,CAAA;;;IAI7C,IAAM,QAAQ,GAAG,WAAW,CAC1B,UAAC,KAA0B,EAAA,EAAK,OAAA,UAAU,CAAC,KAAK,CAAC,OAAO,CAAC,CAAzB,EAAyB,EACzD,CAAC,UAAU,CAAC,CACb,CAAA;;AAGD,IAAA,SAAS,CAAC,YAAA;;AACR,QAAA,IAAI,UAAU,EAAE;YACd,IAAM,SAAO,GAAG,MAAM,CAAC,UAAU,CAAC,UAAU,CAAC,CAAA;;AAE7C,YAAA,UAAU,CAAC,SAAO,CAAC,OAAO,CAAC,CAAA;;YAE3B,CAAA,EAAA,GAAA,SAAO,CAAC,gBAAgB,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,IAAA,CAAA,SAAA,EAAG,QAAQ,EAAE,QAAQ,CAAC,CAAA;AAC9C,YAAA,OAAO,YAAM,EAAA,IAAA,EAAA,CAAA,CAAA,OAAA,CAAA,EAAA,GAAA,SAAO,CAAC,mBAAmB,MAAG,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,IAAA,CAAA,SAAA,EAAA,QAAQ,EAAE,QAAQ,CAAC,CAAA,EAAA,CAAA;AAC/D,SAAA;QACD,OAAO,YAAA,GAAQ,CAAA;AACjB,KAAC,EAAE,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC,CAAA;AAE1B,IAAA,OAAO,EAAE,OAAO,EAAA,OAAA,EAAE,CAAA;AACpB;;;;"}

package/dist/hooks/useScrollLock.d.ts

@@ -0,0 +1,6 @@
+/**
+ * `useScrollLock` will prevent the root app div from scrolling. This is useful for modals, or for presenting
+ * full screen pages on top of the existing app.
+ */
+export declare const useScrollLock: (lock: boolean, increment: () => void, decrement: () => void) => void;
+//# sourceMappingURL=useScrollLock.d.ts.map

package/dist/hooks/useScrollLock.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useScrollLock.d.ts","sourceRoot":"","sources":["../../src/hooks/useScrollLock.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,eAAO,MAAM,aAAa,SAClB,OAAO,aACF,MAAM,IAAI,aACV,MAAM,IAAI,SA8BtB,CAAA"}