@chayns-components/core 5.0.0-beta.997 → 5.0.0

package/lib/cjs/components/verification-badge/VerificationBadge.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VerificationBadge.styles.js","names":["_styledComponents","_interopRequireDefault","require","e","__esModule","default","StyledVerificationBadge","exports","styled","span"],"sources":["../../../../src/components/verification-badge/VerificationBadge.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const StyledVerificationBadge = styled.span``;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEhC,MAAMG,uBAAuB,GAAAC,OAAA,CAAAD,uBAAA,GAAGE,yBAAM,CAACC,IAAI,EAAE","ignoreList":[]}

package/lib/cjs/constants/list.js

@@ -0,0 +1,11 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LIST_ITEM_HTML_TAG = exports.LIST_ITEM_HEAD_TITLE_HTML_TAG = exports.LIST_ITEM_HEAD_INDICATOR_HTML_TAG = exports.LIST_ITEM_HEAD_HTML_TAG = void 0;
+const LIST_ITEM_HTML_TAG = exports.LIST_ITEM_HTML_TAG = 'div';
+const LIST_ITEM_HEAD_HTML_TAG = exports.LIST_ITEM_HEAD_HTML_TAG = 'div';
+const LIST_ITEM_HEAD_INDICATOR_HTML_TAG = exports.LIST_ITEM_HEAD_INDICATOR_HTML_TAG = 'div';
+const LIST_ITEM_HEAD_TITLE_HTML_TAG = exports.LIST_ITEM_HEAD_TITLE_HTML_TAG = 'div';
+//# sourceMappingURL=list.js.map

package/lib/cjs/constants/list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"list.js","names":["LIST_ITEM_HTML_TAG","exports","LIST_ITEM_HEAD_HTML_TAG","LIST_ITEM_HEAD_INDICATOR_HTML_TAG","LIST_ITEM_HEAD_TITLE_HTML_TAG"],"sources":["../../../src/constants/list.ts"],"sourcesContent":["export const LIST_ITEM_HTML_TAG = 'div';\n\nexport const LIST_ITEM_HEAD_HTML_TAG = 'div';\n\nexport const LIST_ITEM_HEAD_INDICATOR_HTML_TAG = 'div';\n\nexport const LIST_ITEM_HEAD_TITLE_HTML_TAG = 'div';\n"],"mappings":";;;;;;AAAO,MAAMA,kBAAkB,GAAAC,OAAA,CAAAD,kBAAA,GAAG,KAAK;AAEhC,MAAME,uBAAuB,GAAAD,OAAA,CAAAC,uBAAA,GAAG,KAAK;AAErC,MAAMC,iCAAiC,GAAAF,OAAA,CAAAE,iCAAA,GAAG,KAAK;AAE/C,MAAMC,6BAA6B,GAAAH,OAAA,CAAAG,6BAAA,GAAG,KAAK","ignoreList":[]}

package/lib/cjs/hooks/container.js

@@ -0,0 +1,54 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useContainer = exports.ContainerAnchor = void 0;
+var _react = require("react");
+let ContainerAnchor = exports.ContainerAnchor = /*#__PURE__*/function (ContainerAnchor) {
+  ContainerAnchor["BODY"] = "body";
+  ContainerAnchor["DIALOG"] = ".dialog-inner";
+  ContainerAnchor["PAGE"] = ".page-provider";
+  ContainerAnchor["RESERVATION_WRAPPER"] = ".reservation-wrapper";
+  ContainerAnchor["ROOT"] = "#root";
+  ContainerAnchor["TAPP"] = ".tapp";
+  ContainerAnchor["WALLET"] = ".wallet";
+  return ContainerAnchor;
+}({});
+const DEFAULT_CONTAINER_ANCHORS = [ContainerAnchor.BODY, ContainerAnchor.DIALOG, ContainerAnchor.PAGE, ContainerAnchor.ROOT, ContainerAnchor.TAPP];
+const useContainer = ({
+  ref,
+  anchorElement,
+  container,
+  anchors = DEFAULT_CONTAINER_ANCHORS
+}) => {
+  const [newContainer, setNewContainer] = (0, _react.useState)(container ?? undefined);
+
+  // Get the closest container if none is set
+  (0, _react.useEffect)(() => {
+    let el = anchorElement;
+    if (ref !== null && ref !== void 0 && ref.current) {
+      el = ref.current;
+    }
+    if (!container) {
+      const reservationWrapperContainer = document.querySelector(ContainerAnchor.RESERVATION_WRAPPER);
+      const rootContainer = document.querySelector(ContainerAnchor.ROOT);
+      const walletContainer = document.querySelector(ContainerAnchor.WALLET);
+      const isInWallet = reservationWrapperContainer && reservationWrapperContainer.contains(el) || walletContainer && walletContainer.contains(el);
+      if (isInWallet && rootContainer && rootContainer.contains(el)) {
+        setNewContainer(rootContainer);
+        return;
+      }
+      const element = el.closest(anchors === null || anchors === void 0 ? void 0 : anchors.join(', '));
+      setNewContainer(element ?? undefined);
+    }
+  }, [anchors, container, anchorElement, ref]);
+  (0, _react.useEffect)(() => {
+    if (container instanceof Element) {
+      setNewContainer(container);
+    }
+  }, [container]);
+  return newContainer;
+};
+exports.useContainer = useContainer;
+//# sourceMappingURL=container.js.map

package/lib/cjs/hooks/container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"container.js","names":["_react","require","ContainerAnchor","exports","DEFAULT_CONTAINER_ANCHORS","BODY","DIALOG","PAGE","ROOT","TAPP","useContainer","ref","anchorElement","container","anchors","newContainer","setNewContainer","useState","undefined","useEffect","el","current","reservationWrapperContainer","document","querySelector","RESERVATION_WRAPPER","rootContainer","walletContainer","WALLET","isInWallet","contains","element","closest","join","Element"],"sources":["../../../src/hooks/container.ts"],"sourcesContent":["import { MutableRefObject, useEffect, useState } from 'react';\n\nexport enum ContainerAnchor {\n    BODY = 'body',\n    DIALOG = '.dialog-inner',\n    PAGE = '.page-provider',\n    RESERVATION_WRAPPER = '.reservation-wrapper',\n    ROOT = '#root',\n    TAPP = '.tapp',\n    WALLET = '.wallet',\n}\n\nconst DEFAULT_CONTAINER_ANCHORS = [\n    ContainerAnchor.BODY,\n    ContainerAnchor.DIALOG,\n    ContainerAnchor.PAGE,\n    ContainerAnchor.ROOT,\n    ContainerAnchor.TAPP,\n];\n\ninterface UseContainerProps {\n    ref?: MutableRefObject<HTMLDivElement | HTMLLabelElement | HTMLSpanElement | null>;\n    anchorElement?: Element;\n    container?: Element | null;\n    anchors?: ContainerAnchor[];\n}\n\nexport const useContainer = ({\n    ref,\n    anchorElement,\n    container,\n    anchors = DEFAULT_CONTAINER_ANCHORS,\n}: UseContainerProps) => {\n    const [newContainer, setNewContainer] = useState<Element | undefined>(container ?? undefined);\n\n    // Get the closest container if none is set\n    useEffect(() => {\n        let el = anchorElement as HTMLElement;\n\n        if (ref?.current) {\n            el = ref.current as HTMLElement;\n        }\n\n        if (!container) {\n            const reservationWrapperContainer = document.querySelector(\n                ContainerAnchor.RESERVATION_WRAPPER,\n            );\n\n            const rootContainer = document.querySelector(ContainerAnchor.ROOT);\n            const walletContainer = document.querySelector(ContainerAnchor.WALLET);\n\n            const isInWallet =\n                (reservationWrapperContainer && reservationWrapperContainer.contains(el)) ||\n                (walletContainer && walletContainer.contains(el));\n\n            if (isInWallet && rootContainer && rootContainer.contains(el)) {\n                setNewContainer(rootContainer);\n\n                return;\n            }\n\n            const element = el.closest(anchors?.join(', '));\n\n            setNewContainer(element ?? undefined);\n        }\n    }, [anchors, container, anchorElement, ref]);\n\n    useEffect(() => {\n        if (container instanceof Element) {\n            setNewContainer(container);\n        }\n    }, [container]);\n\n    return newContainer;\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAA8D,IAElDC,eAAe,GAAAC,OAAA,CAAAD,eAAA,0BAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAA,OAAfA,eAAe;AAAA;AAU3B,MAAME,yBAAyB,GAAG,CAC9BF,eAAe,CAACG,IAAI,EACpBH,eAAe,CAACI,MAAM,EACtBJ,eAAe,CAACK,IAAI,EACpBL,eAAe,CAACM,IAAI,EACpBN,eAAe,CAACO,IAAI,CACvB;AASM,MAAMC,YAAY,GAAGA,CAAC;EACzBC,GAAG;EACHC,aAAa;EACbC,SAAS;EACTC,OAAO,GAAGV;AACK,CAAC,KAAK;EACrB,MAAM,CAACW,YAAY,EAAEC,eAAe,CAAC,GAAG,IAAAC,eAAQ,EAAsBJ,SAAS,IAAIK,SAAS,CAAC;;EAE7F;EACA,IAAAC,gBAAS,EAAC,MAAM;IACZ,IAAIC,EAAE,GAAGR,aAA4B;IAErC,IAAID,GAAG,aAAHA,GAAG,eAAHA,GAAG,CAAEU,OAAO,EAAE;MACdD,EAAE,GAAGT,GAAG,CAACU,OAAsB;IACnC;IAEA,IAAI,CAACR,SAAS,EAAE;MACZ,MAAMS,2BAA2B,GAAGC,QAAQ,CAACC,aAAa,CACtDtB,eAAe,CAACuB,mBACpB,CAAC;MAED,MAAMC,aAAa,GAAGH,QAAQ,CAACC,aAAa,CAACtB,eAAe,CAACM,IAAI,CAAC;MAClE,MAAMmB,eAAe,GAAGJ,QAAQ,CAACC,aAAa,CAACtB,eAAe,CAAC0B,MAAM,CAAC;MAEtE,MAAMC,UAAU,GACXP,2BAA2B,IAAIA,2BAA2B,CAACQ,QAAQ,CAACV,EAAE,CAAC,IACvEO,eAAe,IAAIA,eAAe,CAACG,QAAQ,CAACV,EAAE,CAAE;MAErD,IAAIS,UAAU,IAAIH,aAAa,IAAIA,aAAa,CAACI,QAAQ,CAACV,EAAE,CAAC,EAAE;QAC3DJ,eAAe,CAACU,aAAa,CAAC;QAE9B;MACJ;MAEA,MAAMK,OAAO,GAAGX,EAAE,CAACY,OAAO,CAAClB,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEmB,IAAI,CAAC,IAAI,CAAC,CAAC;MAE/CjB,eAAe,CAACe,OAAO,IAAIb,SAAS,CAAC;IACzC;EACJ,CAAC,EAAE,CAACJ,OAAO,EAAED,SAAS,EAAED,aAAa,EAAED,GAAG,CAAC,CAAC;EAE5C,IAAAQ,gBAAS,EAAC,MAAM;IACZ,IAAIN,SAAS,YAAYqB,OAAO,EAAE;MAC9BlB,eAAe,CAACH,SAAS,CAAC;IAC9B;EACJ,CAAC,EAAE,CAACA,SAAS,CAAC,CAAC;EAEf,OAAOE,YAAY;AACvB,CAAC;AAACZ,OAAA,CAAAO,YAAA,GAAAA,YAAA","ignoreList":[]}

package/lib/cjs/hooks/dropdown.js

@@ -0,0 +1,151 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useDropdownPosition = exports.useDropdownListener = exports.useDropdownAlignment = exports.useDropdown = void 0;
+var _react = require("react");
+var _dropdown = require("../types/dropdown");
+const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? _react.useLayoutEffect : _react.useEffect;
+const useDropdownListener = ({
+  onClick,
+  onClose,
+  onTouchEnd,
+  onTouchStart
+}) => {
+  (0, _react.useEffect)(() => {
+    document.addEventListener('click', onClick, true);
+    document.addEventListener('touchend', onTouchEnd, true);
+    document.addEventListener('touchstart', onTouchStart, true);
+    window.addEventListener('blur', onClose);
+    return () => {
+      document.removeEventListener('click', onClick, true);
+      document.removeEventListener('touchend', onTouchEnd, true);
+      document.removeEventListener('touchstart', onTouchStart, true);
+      window.removeEventListener('blur', onClose);
+    };
+  }, [onClick, onClose, onTouchEnd, onTouchStart]);
+};
+exports.useDropdownListener = useDropdownListener;
+const useDropdownAlignment = ({
+  anchorElement,
+  contentWidth,
+  direction,
+  shouldUseTopAlignment
+}) => {
+  const [translateX, setTranslateX] = (0, _react.useState)('0px');
+  const [translateY, setTranslateY] = (0, _react.useState)('0px');
+  (0, _react.useEffect)(() => {
+    if ([_dropdown.DropdownDirection.BOTTOM_LEFT, _dropdown.DropdownDirection.TOP_LEFT, _dropdown.DropdownDirection.LEFT].includes(direction)) {
+      const difference = anchorElement.clientWidth - contentWidth;
+      setTranslateX(`${difference}px`);
+    } else {
+      setTranslateX('0px');
+    }
+  }, [anchorElement.clientWidth, contentWidth, direction]);
+  (0, _react.useEffect)(() => {
+    const useTopAlignment = shouldUseTopAlignment || [_dropdown.DropdownDirection.TOP, _dropdown.DropdownDirection.TOP_LEFT, _dropdown.DropdownDirection.TOP_RIGHT].includes(direction);
+    if (useTopAlignment) {
+      setTranslateY('-100%');
+    } else {
+      setTranslateY('0px');
+    }
+  }, [direction, shouldUseTopAlignment]);
+  return (0, _react.useMemo)(() => ({
+    x: translateX,
+    y: translateY
+  }), [translateX, translateY]);
+};
+exports.useDropdownAlignment = useDropdownAlignment;
+const useDropdownPosition = ({
+  anchorElement,
+  container,
+  contentHeight = 0,
+  direction,
+  shouldShowDropdown
+}) => {
+  const [coordinates, setCoordinates] = (0, _react.useState)({
+    x: 0,
+    y: 0
+  });
+  const [shouldUseTopAlignment, setShouldUseTopAlignment] = (0, _react.useState)(false);
+  const calculateCoordinates = (0, _react.useCallback)(() => {
+    if (container) {
+      const {
+        left: anchorLeft,
+        top: anchorTop,
+        height: anchorHeight
+      } = anchorElement.getBoundingClientRect();
+      const {
+        left,
+        top,
+        height
+      } = container.getBoundingClientRect();
+      const x = anchorLeft - left + container.scrollLeft;
+      const y = anchorTop - top + container.scrollTop;
+      let useTopAlignment = [_dropdown.DropdownDirection.TOP, _dropdown.DropdownDirection.TOP_LEFT, _dropdown.DropdownDirection.TOP_RIGHT].includes(direction);
+      const hasBottomAlignment = [_dropdown.DropdownDirection.BOTTOM, _dropdown.DropdownDirection.BOTTOM_LEFT, _dropdown.DropdownDirection.BOTTOM_RIGHT].includes(direction);
+      if (!hasBottomAlignment && y + anchorHeight + contentHeight > height) {
+        useTopAlignment = true;
+        setShouldUseTopAlignment(true);
+      } else {
+        setShouldUseTopAlignment(false);
+      }
+      setCoordinates({
+        x,
+        y: useTopAlignment ? y : y + anchorHeight
+      });
+    }
+  }, [anchorElement, container, contentHeight, direction]);
+  useIsomorphicLayoutEffect(() => {
+    const handleResize = () => {
+      calculateCoordinates();
+      setTimeout(calculateCoordinates, 300);
+    };
+    handleResize();
+    if (shouldShowDropdown) {
+      window.addEventListener('resize', handleResize);
+    }
+    return () => {
+      window.removeEventListener('resize', handleResize);
+    };
+  }, [calculateCoordinates, shouldShowDropdown]);
+  return (0, _react.useMemo)(() => ({
+    shouldUseTopAlignment,
+    coordinates
+  }), [coordinates, shouldUseTopAlignment]);
+};
+exports.useDropdownPosition = useDropdownPosition;
+const useDropdown = ({
+  anchorElement,
+  container,
+  contentHeight,
+  contentWidth,
+  direction,
+  shouldShowDropdown
+}) => {
+  const {
+    shouldUseTopAlignment,
+    coordinates
+  } = useDropdownPosition({
+    anchorElement,
+    container,
+    contentHeight,
+    direction,
+    shouldShowDropdown
+  });
+  const transform = useDropdownAlignment({
+    anchorElement,
+    contentWidth,
+    direction,
+    shouldUseTopAlignment
+  });
+  const width = anchorElement.clientWidth;
+  return (0, _react.useMemo)(() => ({
+    coordinates,
+    transform,
+    width
+  }), [coordinates, transform, width]);
+};
+exports.useDropdown = useDropdown;
+//# sourceMappingURL=dropdown.js.map

package/lib/cjs/hooks/dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.js","names":["_react","require","_dropdown","useIsomorphicLayoutEffect","window","useLayoutEffect","useEffect","useDropdownListener","onClick","onClose","onTouchEnd","onTouchStart","document","addEventListener","removeEventListener","exports","useDropdownAlignment","anchorElement","contentWidth","direction","shouldUseTopAlignment","translateX","setTranslateX","useState","translateY","setTranslateY","DropdownDirection","BOTTOM_LEFT","TOP_LEFT","LEFT","includes","difference","clientWidth","useTopAlignment","TOP","TOP_RIGHT","useMemo","x","y","useDropdownPosition","container","contentHeight","shouldShowDropdown","coordinates","setCoordinates","setShouldUseTopAlignment","calculateCoordinates","useCallback","left","anchorLeft","top","anchorTop","height","anchorHeight","getBoundingClientRect","scrollLeft","scrollTop","hasBottomAlignment","BOTTOM","BOTTOM_RIGHT","handleResize","setTimeout","useDropdown","transform","width"],"sources":["../../../src/hooks/dropdown.ts"],"sourcesContent":["import { useCallback, useEffect, useLayoutEffect, useMemo, useState } from 'react';\nimport { DropdownCoordinates, DropdownDirection } from '../types/dropdown';\n\nconst useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;\n\ninterface UseDropdownListenerOptions {\n    onClick: (event: MouseEvent) => void;\n    onClose: () => void;\n    onTouchEnd: (event: TouchEvent) => void;\n    onTouchStart: (event: TouchEvent) => void;\n}\n\nexport const useDropdownListener = ({\n    onClick,\n    onClose,\n    onTouchEnd,\n    onTouchStart,\n}: UseDropdownListenerOptions) => {\n    useEffect(() => {\n        document.addEventListener('click', onClick, true);\n        document.addEventListener('touchend', onTouchEnd, true);\n        document.addEventListener('touchstart', onTouchStart, true);\n\n        window.addEventListener('blur', onClose);\n\n        return () => {\n            document.removeEventListener('click', onClick, true);\n            document.removeEventListener('touchend', onTouchEnd, true);\n            document.removeEventListener('touchstart', onTouchStart, true);\n\n            window.removeEventListener('blur', onClose);\n        };\n    }, [onClick, onClose, onTouchEnd, onTouchStart]);\n};\n\ninterface UseDropdownAlignmentOptions {\n    direction: DropdownDirection;\n    shouldUseTopAlignment: boolean;\n    contentWidth: number;\n    anchorElement: Element;\n}\n\nexport const useDropdownAlignment = ({\n    anchorElement,\n    contentWidth,\n    direction,\n    shouldUseTopAlignment,\n}: UseDropdownAlignmentOptions) => {\n    const [translateX, setTranslateX] = useState<string>('0px');\n    const [translateY, setTranslateY] = useState<string>('0px');\n\n    useEffect(() => {\n        if (\n            [\n                DropdownDirection.BOTTOM_LEFT,\n                DropdownDirection.TOP_LEFT,\n                DropdownDirection.LEFT,\n            ].includes(direction)\n        ) {\n            const difference = anchorElement.clientWidth - contentWidth;\n\n            setTranslateX(`${difference}px`);\n        } else {\n            setTranslateX('0px');\n        }\n    }, [anchorElement.clientWidth, contentWidth, direction]);\n\n    useEffect(() => {\n        const useTopAlignment =\n            shouldUseTopAlignment ||\n            [\n                DropdownDirection.TOP,\n                DropdownDirection.TOP_LEFT,\n                DropdownDirection.TOP_RIGHT,\n            ].includes(direction);\n\n        if (useTopAlignment) {\n            setTranslateY('-100%');\n        } else {\n            setTranslateY('0px');\n        }\n    }, [direction, shouldUseTopAlignment]);\n\n    return useMemo(() => ({ x: translateX, y: translateY }), [translateX, translateY]);\n};\n\ninterface UseDropdownPositionOptions {\n    anchorElement: Element;\n    container?: Element;\n    contentHeight?: number;\n    direction: DropdownDirection;\n    shouldShowDropdown: boolean;\n}\n\nexport const useDropdownPosition = ({\n    anchorElement,\n    container,\n    contentHeight = 0,\n    direction,\n    shouldShowDropdown,\n}: UseDropdownPositionOptions) => {\n    const [coordinates, setCoordinates] = useState<DropdownCoordinates>({ x: 0, y: 0 });\n    const [shouldUseTopAlignment, setShouldUseTopAlignment] = useState(false);\n\n    const calculateCoordinates = useCallback(() => {\n        if (container) {\n            const {\n                left: anchorLeft,\n                top: anchorTop,\n                height: anchorHeight,\n            } = anchorElement.getBoundingClientRect();\n\n            const { left, top, height } = container.getBoundingClientRect();\n\n            const x = anchorLeft - left + container.scrollLeft;\n            const y = anchorTop - top + container.scrollTop;\n\n            let useTopAlignment = [\n                DropdownDirection.TOP,\n                DropdownDirection.TOP_LEFT,\n                DropdownDirection.TOP_RIGHT,\n            ].includes(direction);\n\n            const hasBottomAlignment = [\n                DropdownDirection.BOTTOM,\n                DropdownDirection.BOTTOM_LEFT,\n                DropdownDirection.BOTTOM_RIGHT,\n            ].includes(direction);\n\n            if (!hasBottomAlignment && y + anchorHeight + contentHeight > height) {\n                useTopAlignment = true;\n\n                setShouldUseTopAlignment(true);\n            } else {\n                setShouldUseTopAlignment(false);\n            }\n\n            setCoordinates({ x, y: useTopAlignment ? y : y + anchorHeight });\n        }\n    }, [anchorElement, container, contentHeight, direction]);\n\n    useIsomorphicLayoutEffect(() => {\n        const handleResize = () => {\n            calculateCoordinates();\n\n            setTimeout(calculateCoordinates, 300);\n        };\n\n        handleResize();\n\n        if (shouldShowDropdown) {\n            window.addEventListener('resize', handleResize);\n        }\n\n        return () => {\n            window.removeEventListener('resize', handleResize);\n        };\n    }, [calculateCoordinates, shouldShowDropdown]);\n\n    return useMemo(\n        () => ({ shouldUseTopAlignment, coordinates }),\n        [coordinates, shouldUseTopAlignment],\n    );\n};\n\ninterface UseDropdownOptions {\n    anchorElement: Element;\n    container?: Element;\n    contentHeight?: number;\n    contentWidth: number;\n    direction: DropdownDirection;\n    shouldShowDropdown: boolean;\n}\n\nexport const useDropdown = ({\n    anchorElement,\n    container,\n    contentHeight,\n    contentWidth,\n    direction,\n    shouldShowDropdown,\n}: UseDropdownOptions) => {\n    const { shouldUseTopAlignment, coordinates } = useDropdownPosition({\n        anchorElement,\n        container,\n        contentHeight,\n        direction,\n        shouldShowDropdown,\n    });\n\n    const transform = useDropdownAlignment({\n        anchorElement,\n        contentWidth,\n        direction,\n        shouldUseTopAlignment,\n    });\n\n    const width = anchorElement.clientWidth;\n\n    return useMemo(() => ({ coordinates, transform, width }), [coordinates, transform, width]);\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/hooks/element.js

@@ -0,0 +1,152 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useMeasuredClone = exports.useIsMeasuredClone = exports.useElementSize = void 0;
+var _react = _interopRequireWildcard(require("react"));
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const useElementSize = (ref, {
+  shouldUseChildElement = false,
+  shouldUseParentElement = false
+} = {}) => {
+  const [size, setSize] = (0, _react.useState)();
+  (0, _react.useEffect)(() => {
+    let target = ref.current;
+    if (shouldUseParentElement) {
+      var _ref$current;
+      target = (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.parentElement;
+    }
+    if (shouldUseChildElement) {
+      var _ref$current2;
+      target = (_ref$current2 = ref.current) === null || _ref$current2 === void 0 ? void 0 : _ref$current2.firstElementChild;
+    }
+    if (!target) return () => {};
+    const updateSize = () => setSize(target.getBoundingClientRect());
+    updateSize();
+    const observer = new ResizeObserver(entries => {
+      entries.forEach(entry => {
+        if (entry.target === target) {
+          setSize(entry.contentRect);
+        }
+      });
+    });
+    observer.observe(target);
+    return () => observer.disconnect();
+  }, [ref, shouldUseChildElement, shouldUseParentElement]);
+  return size;
+};
+exports.useElementSize = useElementSize;
+const cloneWithTabIndex = node => {
+  if (! /*#__PURE__*/(0, _react.isValidElement)(node)) return node;
+  const element = node;
+  const tmpChildren = element.props.children;
+  const children = tmpChildren ? _react.Children.map(tmpChildren, cloneWithTabIndex) : tmpChildren;
+  if (element.type.displayName === 'Button') {
+    return (
+      /*#__PURE__*/
+      // eslint-disable-next-line react/button-has-type
+      _react.default.createElement("button", {
+        tabIndex: -1
+      }, children)
+    );
+  }
+  return /*#__PURE__*/(0, _react.cloneElement)(element, {
+    ...element.props,
+    tabIndex: -1,
+    children
+  });
+};
+const getClonedElement = content => {
+  const preventEvents = {
+    onClick: e => e.stopPropagation(),
+    onMouseDown: e => e.stopPropagation(),
+    onMouseUp: e => e.stopPropagation(),
+    onKeyDown: e => e.stopPropagation(),
+    onKeyUp: e => e.stopPropagation(),
+    onFocus: e => e.stopPropagation(),
+    onBlur: e => e.stopPropagation()
+  };
+  if (typeof content === 'string') {
+    return /*#__PURE__*/_react.default.createElement("span", {
+      tabIndex: -1,
+      "data-measured-clone": true
+    }, content);
+  }
+  if (/*#__PURE__*/(0, _react.isValidElement)(content)) {
+    return cloneWithTabIndex(/*#__PURE__*/(0, _react.cloneElement)(content, {
+      ...preventEvents,
+      'data-measured-clone': true
+    }));
+  }
+  return content;
+};
+const useMeasuredClone = ({
+  content,
+  shouldPreventTextWrapping = true
+}) => {
+  const ref = (0, _react.useRef)(null);
+  const [size, setSize] = (0, _react.useState)({
+    width: 0,
+    height: 0
+  });
+  const clonedElement = getClonedElement(content);
+  (0, _react.useEffect)(() => {
+    const measure = () => {
+      if (!ref.current) return;
+      const {
+        offsetWidth: width,
+        offsetHeight: height
+      } = ref.current;
+      setSize({
+        width: width + (shouldPreventTextWrapping ? 10 : 0),
+        height
+      });
+    };
+    measure();
+    const observer = new ResizeObserver(measure);
+    if (ref.current) observer.observe(ref.current);
+    return () => observer.disconnect();
+  }, [shouldPreventTextWrapping]);
+  const measuredElement = /*#__PURE__*/_react.default.createElement("div", {
+    "data-measured-clone": "true",
+    ref: ref,
+    style: {
+      position: 'fixed',
+      opacity: 0,
+      pointerEvents: 'none',
+      userSelect: 'none',
+      zIndex: -1,
+      height: 'auto',
+      width: 'auto',
+      visibility: 'hidden'
+    },
+    inert: "true",
+    tabIndex: -1
+  }, clonedElement);
+  return {
+    measuredElement,
+    width: size.width,
+    height: size.height
+  };
+};
+exports.useMeasuredClone = useMeasuredClone;
+const useIsMeasuredClone = () => {
+  const ref = (0, _react.useRef)(null);
+  const [isClone, setIsClone] = (0, _react.useState)(false);
+  (0, _react.useEffect)(() => {
+    if (!ref.current) return;
+    let el = ref.current;
+    while (el) {
+      if (el.hasAttribute('data-measured-clone')) {
+        setIsClone(true);
+        return;
+      }
+      el = el.parentElement;
+    }
+    setIsClone(false);
+  }, []);
+  return [isClone, ref];
+};
+exports.useIsMeasuredClone = useIsMeasuredClone;
+//# sourceMappingURL=element.js.map

package/lib/cjs/hooks/element.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"element.js","names":["_react","_interopRequireWildcard","require","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","useElementSize","ref","shouldUseChildElement","shouldUseParentElement","size","setSize","useState","useEffect","target","current","_ref$current","parentElement","_ref$current2","firstElementChild","updateSize","getBoundingClientRect","observer","ResizeObserver","entries","forEach","entry","contentRect","observe","disconnect","exports","cloneWithTabIndex","node","isValidElement","element","tmpChildren","props","children","Children","map","type","displayName","createElement","tabIndex","cloneElement","getClonedElement","content","preventEvents","onClick","stopPropagation","onMouseDown","onMouseUp","onKeyDown","onKeyUp","onFocus","onBlur","useMeasuredClone","shouldPreventTextWrapping","useRef","width","height","clonedElement","measure","offsetWidth","offsetHeight","measuredElement","style","position","opacity","pointerEvents","userSelect","zIndex","visibility","inert","useIsMeasuredClone","isClone","setIsClone","el","hasAttribute"],"sources":["../../../src/hooks/element.tsx"],"sourcesContent":["import React, {\n    Children,\n    cloneElement,\n    HTMLAttributes,\n    isValidElement,\n    MutableRefObject,\n    ReactElement,\n    ReactNode,\n    useEffect,\n    useRef,\n    useState,\n} from 'react';\n\ninterface UseElementSizeOptions {\n    shouldUseChildElement?: boolean;\n    shouldUseParentElement?: boolean;\n}\n\nexport const useElementSize = (\n    ref: MutableRefObject<HTMLDivElement | HTMLLabelElement | null>,\n    { shouldUseChildElement = false, shouldUseParentElement = false }: UseElementSizeOptions = {},\n): DOMRectReadOnly | undefined => {\n    const [size, setSize] = useState<DOMRectReadOnly>();\n\n    useEffect(() => {\n        let target = ref.current as HTMLElement | null;\n\n        if (shouldUseParentElement) {\n            target = ref.current?.parentElement as HTMLElement | null;\n        }\n\n        if (shouldUseChildElement) {\n            target = ref.current?.firstElementChild as HTMLElement | null;\n        }\n\n        if (!target) return () => {};\n\n        const updateSize = () => setSize(target.getBoundingClientRect());\n\n        updateSize();\n\n        const observer = new ResizeObserver((entries) => {\n            entries.forEach((entry) => {\n                if (entry.target === target) {\n                    setSize(entry.contentRect);\n                }\n            });\n        });\n\n        observer.observe(target);\n\n        return () => observer.disconnect();\n    }, [ref, shouldUseChildElement, shouldUseParentElement]);\n\n    return size;\n};\n\nconst cloneWithTabIndex = (node: ReactNode): ReactNode => {\n    if (!isValidElement(node)) return node;\n\n    const element = node as ReactElement;\n\n    const tmpChildren = (element.props as { children: ReactNode[] }).children;\n\n    const children = tmpChildren ? Children.map(tmpChildren, cloneWithTabIndex) : tmpChildren;\n\n    if ((element.type as unknown as { displayName: string }).displayName === 'Button') {\n        return (\n            // eslint-disable-next-line react/button-has-type\n            <button tabIndex={-1}>{children}</button>\n        );\n    }\n\n    return cloneElement(element, {\n        ...element.props,\n        tabIndex: -1,\n        children,\n    });\n};\n\nconst getClonedElement = (content: ReactNode) => {\n    const preventEvents: Partial<HTMLAttributes<never>> = {\n        onClick: (e) => e.stopPropagation(),\n        onMouseDown: (e) => e.stopPropagation(),\n        onMouseUp: (e) => e.stopPropagation(),\n        onKeyDown: (e) => e.stopPropagation(),\n        onKeyUp: (e) => e.stopPropagation(),\n        onFocus: (e) => e.stopPropagation(),\n        onBlur: (e) => e.stopPropagation(),\n    };\n\n    if (typeof content === 'string') {\n        return (\n            <span tabIndex={-1} data-measured-clone>\n                {content}\n            </span>\n        );\n    }\n\n    if (isValidElement(content)) {\n        return cloneWithTabIndex(\n            cloneElement(content, {\n                ...preventEvents,\n                'data-measured-clone': true,\n            }),\n        );\n    }\n\n    return content;\n};\n\ninterface UseMeasuredCloneOptions {\n    content: ReactNode;\n    shouldPreventTextWrapping?: boolean;\n}\n\nexport const useMeasuredClone = ({\n    content,\n    shouldPreventTextWrapping = true,\n}: UseMeasuredCloneOptions) => {\n    const ref = useRef<HTMLDivElement>(null);\n\n    const [size, setSize] = useState({ width: 0, height: 0 });\n\n    const clonedElement = getClonedElement(content);\n\n    useEffect(() => {\n        const measure = () => {\n            if (!ref.current) return;\n\n            const { offsetWidth: width, offsetHeight: height } = ref.current;\n\n            setSize({ width: width + (shouldPreventTextWrapping ? 10 : 0), height });\n        };\n\n        measure();\n\n        const observer = new ResizeObserver(measure);\n\n        if (ref.current) observer.observe(ref.current);\n\n        return () => observer.disconnect();\n    }, [shouldPreventTextWrapping]);\n\n    const measuredElement = (\n        <div\n            data-measured-clone=\"true\"\n            ref={ref}\n            style={{\n                position: 'fixed',\n                opacity: 0,\n                pointerEvents: 'none',\n                userSelect: 'none',\n                zIndex: -1,\n                height: 'auto',\n                width: 'auto',\n                visibility: 'hidden',\n            }}\n            inert=\"true\"\n            tabIndex={-1}\n        >\n            {clonedElement}\n        </div>\n    );\n\n    return {\n        measuredElement,\n        width: size.width,\n        height: size.height,\n    };\n};\n\nexport const useIsMeasuredClone = <T extends HTMLElement>() => {\n    const ref = useRef<T | null>(null);\n\n    const [isClone, setIsClone] = useState(false);\n\n    useEffect(() => {\n        if (!ref.current) return;\n\n        let el: HTMLElement | null = ref.current;\n\n        while (el) {\n            if (el.hasAttribute('data-measured-clone')) {\n                setIsClone(true);\n\n                return;\n            }\n\n            el = el.parentElement;\n        }\n\n        setIsClone(false);\n    }, []);\n\n    return [isClone, ref] as const;\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AAWe,SAAAD,wBAAAE,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAJ,uBAAA,YAAAA,CAAAE,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAOR,MAAMkB,cAAc,GAAGA,CAC1BC,GAA+D,EAC/D;EAAEC,qBAAqB,GAAG,KAAK;EAAEC,sBAAsB,GAAG;AAA6B,CAAC,GAAG,CAAC,CAAC,KAC/D;EAC9B,MAAM,CAACC,IAAI,EAAEC,OAAO,CAAC,GAAG,IAAAC,eAAQ,EAAkB,CAAC;EAEnD,IAAAC,gBAAS,EAAC,MAAM;IACZ,IAAIC,MAAM,GAAGP,GAAG,CAACQ,OAA6B;IAE9C,IAAIN,sBAAsB,EAAE;MAAA,IAAAO,YAAA;MACxBF,MAAM,IAAAE,YAAA,GAAGT,GAAG,CAACQ,OAAO,cAAAC,YAAA,uBAAXA,YAAA,CAAaC,aAAmC;IAC7D;IAEA,IAAIT,qBAAqB,EAAE;MAAA,IAAAU,aAAA;MACvBJ,MAAM,IAAAI,aAAA,GAAGX,GAAG,CAACQ,OAAO,cAAAG,aAAA,uBAAXA,aAAA,CAAaC,iBAAuC;IACjE;IAEA,IAAI,CAACL,MAAM,EAAE,OAAO,MAAM,CAAC,CAAC;IAE5B,MAAMM,UAAU,GAAGA,CAAA,KAAMT,OAAO,CAACG,MAAM,CAACO,qBAAqB,CAAC,CAAC,CAAC;IAEhED,UAAU,CAAC,CAAC;IAEZ,MAAME,QAAQ,GAAG,IAAIC,cAAc,CAAEC,OAAO,IAAK;MAC7CA,OAAO,CAACC,OAAO,CAAEC,KAAK,IAAK;QACvB,IAAIA,KAAK,CAACZ,MAAM,KAAKA,MAAM,EAAE;UACzBH,OAAO,CAACe,KAAK,CAACC,WAAW,CAAC;QAC9B;MACJ,CAAC,CAAC;IACN,CAAC,CAAC;IAEFL,QAAQ,CAACM,OAAO,CAACd,MAAM,CAAC;IAExB,OAAO,MAAMQ,QAAQ,CAACO,UAAU,CAAC,CAAC;EACtC,CAAC,EAAE,CAACtB,GAAG,EAAEC,qBAAqB,EAAEC,sBAAsB,CAAC,CAAC;EAExD,OAAOC,IAAI;AACf,CAAC;AAACoB,OAAA,CAAAxB,cAAA,GAAAA,cAAA;AAEF,MAAMyB,iBAAiB,GAAIC,IAAe,IAAgB;EACtD,IAAI,eAAC,IAAAC,qBAAc,EAACD,IAAI,CAAC,EAAE,OAAOA,IAAI;EAEtC,MAAME,OAAO,GAAGF,IAAoB;EAEpC,MAAMG,WAAW,GAAID,OAAO,CAACE,KAAK,CAA+BC,QAAQ;EAEzE,MAAMA,QAAQ,GAAGF,WAAW,GAAGG,eAAQ,CAACC,GAAG,CAACJ,WAAW,EAAEJ,iBAAiB,CAAC,GAAGI,WAAW;EAEzF,IAAKD,OAAO,CAACM,IAAI,CAAwCC,WAAW,KAAK,QAAQ,EAAE;IAC/E;MAAA;MACI;MACAzD,MAAA,CAAAa,OAAA,CAAA6C,aAAA;QAAQC,QAAQ,EAAE,CAAC;MAAE,GAAEN,QAAiB;IAAC;EAEjD;EAEA,oBAAO,IAAAO,mBAAY,EAACV,OAAO,EAAE;IACzB,GAAGA,OAAO,CAACE,KAAK;IAChBO,QAAQ,EAAE,CAAC,CAAC;IACZN;EACJ,CAAC,CAAC;AACN,CAAC;AAED,MAAMQ,gBAAgB,GAAIC,OAAkB,IAAK;EAC7C,MAAMC,aAA6C,GAAG;IAClDC,OAAO,EAAG7D,CAAC,IAAKA,CAAC,CAAC8D,eAAe,CAAC,CAAC;IACnCC,WAAW,EAAG/D,CAAC,IAAKA,CAAC,CAAC8D,eAAe,CAAC,CAAC;IACvCE,SAAS,EAAGhE,CAAC,IAAKA,CAAC,CAAC8D,eAAe,CAAC,CAAC;IACrCG,SAAS,EAAGjE,CAAC,IAAKA,CAAC,CAAC8D,eAAe,CAAC,CAAC;IACrCI,OAAO,EAAGlE,CAAC,IAAKA,CAAC,CAAC8D,eAAe,CAAC,CAAC;IACnCK,OAAO,EAAGnE,CAAC,IAAKA,CAAC,CAAC8D,eAAe,CAAC,CAAC;IACnCM,MAAM,EAAGpE,CAAC,IAAKA,CAAC,CAAC8D,eAAe,CAAC;EACrC,CAAC;EAED,IAAI,OAAOH,OAAO,KAAK,QAAQ,EAAE;IAC7B,oBACI9D,MAAA,CAAAa,OAAA,CAAA6C,aAAA;MAAMC,QAAQ,EAAE,CAAC,CAAE;MAAC;IAAmB,GAClCG,OACC,CAAC;EAEf;EAEA,iBAAI,IAAAb,qBAAc,EAACa,OAAO,CAAC,EAAE;IACzB,OAAOf,iBAAiB,cACpB,IAAAa,mBAAY,EAACE,OAAO,EAAE;MAClB,GAAGC,aAAa;MAChB,qBAAqB,EAAE;IAC3B,CAAC,CACL,CAAC;EACL;EAEA,OAAOD,OAAO;AAClB,CAAC;AAOM,MAAMU,gBAAgB,GAAGA,CAAC;EAC7BV,OAAO;EACPW,yBAAyB,GAAG;AACP,CAAC,KAAK;EAC3B,MAAMlD,GAAG,GAAG,IAAAmD,aAAM,EAAiB,IAAI,CAAC;EAExC,MAAM,CAAChD,IAAI,EAAEC,OAAO,CAAC,GAAG,IAAAC,eAAQ,EAAC;IAAE+C,KAAK,EAAE,CAAC;IAAEC,MAAM,EAAE;EAAE,CAAC,CAAC;EAEzD,MAAMC,aAAa,GAAGhB,gBAAgB,CAACC,OAAO,CAAC;EAE/C,IAAAjC,gBAAS,EAAC,MAAM;IACZ,MAAMiD,OAAO,GAAGA,CAAA,KAAM;MAClB,IAAI,CAACvD,GAAG,CAACQ,OAAO,EAAE;MAElB,MAAM;QAAEgD,WAAW,EAAEJ,KAAK;QAAEK,YAAY,EAAEJ;MAAO,CAAC,GAAGrD,GAAG,CAACQ,OAAO;MAEhEJ,OAAO,CAAC;QAAEgD,KAAK,EAAEA,KAAK,IAAIF,yBAAyB,GAAG,EAAE,GAAG,CAAC,CAAC;QAAEG;MAAO,CAAC,CAAC;IAC5E,CAAC;IAEDE,OAAO,CAAC,CAAC;IAET,MAAMxC,QAAQ,GAAG,IAAIC,cAAc,CAACuC,OAAO,CAAC;IAE5C,IAAIvD,GAAG,CAACQ,OAAO,EAAEO,QAAQ,CAACM,OAAO,CAACrB,GAAG,CAACQ,OAAO,CAAC;IAE9C,OAAO,MAAMO,QAAQ,CAACO,UAAU,CAAC,CAAC;EACtC,CAAC,EAAE,CAAC4B,yBAAyB,CAAC,CAAC;EAE/B,MAAMQ,eAAe,gBACjBjF,MAAA,CAAAa,OAAA,CAAA6C,aAAA;IACI,uBAAoB,MAAM;IAC1BnC,GAAG,EAAEA,GAAI;IACT2D,KAAK,EAAE;MACHC,QAAQ,EAAE,OAAO;MACjBC,OAAO,EAAE,CAAC;MACVC,aAAa,EAAE,MAAM;MACrBC,UAAU,EAAE,MAAM;MAClBC,MAAM,EAAE,CAAC,CAAC;MACVX,MAAM,EAAE,MAAM;MACdD,KAAK,EAAE,MAAM;MACba,UAAU,EAAE;IAChB,CAAE;IACFC,KAAK,EAAC,MAAM;IACZ9B,QAAQ,EAAE,CAAC;EAAE,GAEZkB,aACA,CACR;EAED,OAAO;IACHI,eAAe;IACfN,KAAK,EAAEjD,IAAI,CAACiD,KAAK;IACjBC,MAAM,EAAElD,IAAI,CAACkD;EACjB,CAAC;AACL,CAAC;AAAC9B,OAAA,CAAA0B,gBAAA,GAAAA,gBAAA;AAEK,MAAMkB,kBAAkB,GAAGA,CAAA,KAA6B;EAC3D,MAAMnE,GAAG,GAAG,IAAAmD,aAAM,EAAW,IAAI,CAAC;EAElC,MAAM,CAACiB,OAAO,EAAEC,UAAU,CAAC,GAAG,IAAAhE,eAAQ,EAAC,KAAK,CAAC;EAE7C,IAAAC,gBAAS,EAAC,MAAM;IACZ,IAAI,CAACN,GAAG,CAACQ,OAAO,EAAE;IAElB,IAAI8D,EAAsB,GAAGtE,GAAG,CAACQ,OAAO;IAExC,OAAO8D,EAAE,EAAE;MACP,IAAIA,EAAE,CAACC,YAAY,CAAC,qBAAqB,CAAC,EAAE;QACxCF,UAAU,CAAC,IAAI,CAAC;QAEhB;MACJ;MAEAC,EAAE,GAAGA,EAAE,CAAC5D,aAAa;IACzB;IAEA2D,UAAU,CAAC,KAAK,CAAC;EACrB,CAAC,EAAE,EAAE,CAAC;EAEN,OAAO,CAACD,OAAO,EAAEpE,GAAG,CAAC;AACzB,CAAC;AAACuB,OAAA,CAAA4C,kBAAA,GAAAA,kBAAA","ignoreList":[]}

package/lib/cjs/hooks/ref.js

@@ -0,0 +1,28 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useInitialRenderRef = exports.useCombinedRefs = void 0;
+var _react = require("react");
+const useCombinedRefs = (...refs) => (0, _react.useCallback)(element => {
+  refs.forEach(ref => {
+    if (!ref) return;
+    if (typeof ref === 'function') {
+      ref(element);
+    } else if (typeof ref === 'object' && ref !== null) {
+      ref.current = element;
+    }
+  });
+}, [refs]);
+exports.useCombinedRefs = useCombinedRefs;
+const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? _react.useLayoutEffect : _react.useEffect;
+const useInitialRenderRef = initialValue => {
+  const ref = (0, _react.useRef)(initialValue);
+  useIsomorphicLayoutEffect(() => {
+    ref.current = false;
+  }, []);
+  return ref;
+};
+exports.useInitialRenderRef = useInitialRenderRef;
+//# sourceMappingURL=ref.js.map

package/lib/cjs/hooks/ref.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ref.js","names":["_react","require","useCombinedRefs","refs","useCallback","element","forEach","ref","current","exports","useIsomorphicLayoutEffect","window","useLayoutEffect","useEffect","useInitialRenderRef","initialValue","useRef"],"sources":["../../../src/hooks/ref.ts"],"sourcesContent":["import {\n    MutableRefObject,\n    Ref,\n    RefCallback,\n    useCallback,\n    useEffect,\n    useLayoutEffect,\n    useRef,\n} from 'react';\n\nexport const useCombinedRefs = <T>(...refs: (Ref<T> | undefined)[]): RefCallback<T> =>\n    useCallback(\n        (element: T) => {\n            refs.forEach((ref) => {\n                if (!ref) return;\n\n                if (typeof ref === 'function') {\n                    ref(element);\n                } else if (typeof ref === 'object' && ref !== null) {\n                    (ref as MutableRefObject<T | null>).current = element;\n                }\n            });\n        },\n        [refs],\n    );\n\nconst useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;\n\nexport const useInitialRenderRef = (initialValue: boolean) => {\n    const ref = useRef<boolean>(initialValue);\n\n    useIsomorphicLayoutEffect(() => {\n        ref.current = false;\n    }, []);\n\n    return ref;\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAUO,MAAMC,eAAe,GAAGA,CAAI,GAAGC,IAA4B,KAC9D,IAAAC,kBAAW,EACNC,OAAU,IAAK;EACZF,IAAI,CAACG,OAAO,CAAEC,GAAG,IAAK;IAClB,IAAI,CAACA,GAAG,EAAE;IAEV,IAAI,OAAOA,GAAG,KAAK,UAAU,EAAE;MAC3BA,GAAG,CAACF,OAAO,CAAC;IAChB,CAAC,MAAM,IAAI,OAAOE,GAAG,KAAK,QAAQ,IAAIA,GAAG,KAAK,IAAI,EAAE;MAC/CA,GAAG,CAAgCC,OAAO,GAAGH,OAAO;IACzD;EACJ,CAAC,CAAC;AACN,CAAC,EACD,CAACF,IAAI,CACT,CAAC;AAACM,OAAA,CAAAP,eAAA,GAAAA,eAAA;AAEN,MAAMQ,yBAAyB,GAAG,OAAOC,MAAM,KAAK,WAAW,GAAGC,sBAAe,GAAGC,gBAAS;AAEtF,MAAMC,mBAAmB,GAAIC,YAAqB,IAAK;EAC1D,MAAMR,GAAG,GAAG,IAAAS,aAAM,EAAUD,YAAY,CAAC;EAEzCL,yBAAyB,CAAC,MAAM;IAC5BH,GAAG,CAACC,OAAO,GAAG,KAAK;EACvB,CAAC,EAAE,EAAE,CAAC;EAEN,OAAOD,GAAG;AACd,CAAC;AAACE,OAAA,CAAAK,mBAAA,GAAAA,mBAAA","ignoreList":[]}

package/lib/cjs/hooks/resize.js

@@ -0,0 +1,45 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useCursorRepaint = useCursorRepaint;
+var _react = require("react");
+var _chaynsApi = require("chayns-api");
+/**
+ * Forces multiple repaints on the referenced element whenever it gains focus.
+ * Useful for Safari/iOS WebView cursor misalignment issues.
+ */
+function useCursorRepaint(ref) {
+  const {
+    app,
+    os
+  } = (0, _chaynsApi.useDevice)();
+  (0, _react.useEffect)(() => {
+    // only run on iOS in chayns app
+    if ((app === null || app === void 0 ? void 0 : app.flavor) !== _chaynsApi.AppFlavor.Chayns || os !== 'iOS') {
+      return () => {};
+    }
+    const triggerRepaint = (el, delay) => {
+      window.setTimeout(() => {
+        // eslint-disable-next-line no-param-reassign
+        el.style.transform = 'translateZ(0px)';
+        requestAnimationFrame(() => {
+          // eslint-disable-next-line no-param-reassign
+          el.style.transform = '';
+        });
+      }, delay);
+    };
+    const handleFocus = () => {
+      const el = ref.current;
+      if (!el) return;
+      [50, 100, 150, 200, 250, 300, 350, 400, 450, 500].forEach(delay => triggerRepaint(el, delay));
+    };
+    const el = ref.current;
+    if (el) el.addEventListener('focus', handleFocus);
+    return () => {
+      if (el) el.removeEventListener('focus', handleFocus);
+    };
+  }, [app, os, ref]);
+}
+//# sourceMappingURL=resize.js.map

package/lib/cjs/hooks/resize.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resize.js","names":["_react","require","_chaynsApi","useCursorRepaint","ref","app","os","useDevice","useEffect","flavor","AppFlavor","Chayns","triggerRepaint","el","delay","window","setTimeout","style","transform","requestAnimationFrame","handleFocus","current","forEach","addEventListener","removeEventListener"],"sources":["../../../src/hooks/resize.ts"],"sourcesContent":["import { RefObject, useEffect } from 'react';\nimport { AppFlavor, useDevice } from 'chayns-api';\n\n/**\n * Forces multiple repaints on the referenced element whenever it gains focus.\n * Useful for Safari/iOS WebView cursor misalignment issues.\n */\nexport function useCursorRepaint<T extends HTMLElement>(ref: RefObject<T>) {\n    const { app, os } = useDevice();\n\n    useEffect(() => {\n        // only run on iOS in chayns app\n        if (app?.flavor !== AppFlavor.Chayns || os !== 'iOS') {\n            return () => {};\n        }\n\n        const triggerRepaint = (el: HTMLElement, delay: number) => {\n            window.setTimeout(() => {\n                // eslint-disable-next-line no-param-reassign\n                el.style.transform = 'translateZ(0px)';\n\n                requestAnimationFrame(() => {\n                    // eslint-disable-next-line no-param-reassign\n                    el.style.transform = '';\n                });\n            }, delay);\n        };\n\n        const handleFocus = () => {\n            const el = ref.current;\n            if (!el) return;\n\n            [50, 100, 150, 200, 250, 300, 350, 400, 450, 500].forEach((delay) =>\n                triggerRepaint(el, delay),\n            );\n        };\n\n        const el = ref.current;\n        if (el) el.addEventListener('focus', handleFocus);\n\n        return () => {\n            if (el) el.removeEventListener('focus', handleFocus);\n        };\n    }, [app, os, ref]);\n}\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,UAAA,GAAAD,OAAA;AAEA;AACA;AACA;AACA;AACO,SAASE,gBAAgBA,CAAwBC,GAAiB,EAAE;EACvE,MAAM;IAAEC,GAAG;IAAEC;EAAG,CAAC,GAAG,IAAAC,oBAAS,EAAC,CAAC;EAE/B,IAAAC,gBAAS,EAAC,MAAM;IACZ;IACA,IAAI,CAAAH,GAAG,aAAHA,GAAG,uBAAHA,GAAG,CAAEI,MAAM,MAAKC,oBAAS,CAACC,MAAM,IAAIL,EAAE,KAAK,KAAK,EAAE;MAClD,OAAO,MAAM,CAAC,CAAC;IACnB;IAEA,MAAMM,cAAc,GAAGA,CAACC,EAAe,EAAEC,KAAa,KAAK;MACvDC,MAAM,CAACC,UAAU,CAAC,MAAM;QACpB;QACAH,EAAE,CAACI,KAAK,CAACC,SAAS,GAAG,iBAAiB;QAEtCC,qBAAqB,CAAC,MAAM;UACxB;UACAN,EAAE,CAACI,KAAK,CAACC,SAAS,GAAG,EAAE;QAC3B,CAAC,CAAC;MACN,CAAC,EAAEJ,KAAK,CAAC;IACb,CAAC;IAED,MAAMM,WAAW,GAAGA,CAAA,KAAM;MACtB,MAAMP,EAAE,GAAGT,GAAG,CAACiB,OAAO;MACtB,IAAI,CAACR,EAAE,EAAE;MAET,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,CAACS,OAAO,CAAER,KAAK,IAC5DF,cAAc,CAACC,EAAE,EAAEC,KAAK,CAC5B,CAAC;IACL,CAAC;IAED,MAAMD,EAAE,GAAGT,GAAG,CAACiB,OAAO;IACtB,IAAIR,EAAE,EAAEA,EAAE,CAACU,gBAAgB,CAAC,OAAO,EAAEH,WAAW,CAAC;IAEjD,OAAO,MAAM;MACT,IAAIP,EAAE,EAAEA,EAAE,CAACW,mBAAmB,CAAC,OAAO,EAAEJ,WAAW,CAAC;IACxD,CAAC;EACL,CAAC,EAAE,CAACf,GAAG,EAAEC,EAAE,EAAEF,GAAG,CAAC,CAAC;AACtB","ignoreList":[]}