@amboss/design-system 1.9.1 → 1.9.5

package/build/esm/src/components/VirtualScrollList/VirtualScrollListReducer.js

@@ -0,0 +1,130 @@
+const findClosestOffsetIndex = (arr, val) => {
+  let start = 0;
+  let end = arr.length - 1;
+  let mid = Math.floor((start + end) / 2);
+  while (start <= end) {
+    mid = Math.floor((start + end) / 2);
+    if (arr[mid].amount === val) {
+      return mid;
+    }
+    if (val < arr[mid].amount) {
+      end = mid - 1;
+    } else {
+      start = mid + 1;
+    }
+  }
+  return mid;
+};
+const getMaxHeight = function (maxAmountOfItems, offsets) {
+  let lastItemHeight = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+  const amountOfOffsets = Math.min(offsets.length, maxAmountOfItems);
+  const maxOffset = offsets[amountOfOffsets - 1]?.amount || 0;
+  const result = maxOffset + lastItemHeight;
+  return result;
+};
+const reduceScroll = (prevState, scrollTop) => {
+  const {
+    topOffsets,
+    overscan: tolerance
+  } = prevState;
+  const scrolledItemCount = Math.max(0, findClosestOffsetIndex(topOffsets, scrollTop) - tolerance / 2);
+  const scrolledInPx = topOffsets[scrolledItemCount]?.amount || 0;
+  return {
+    ...prevState,
+    scrolledItemCount,
+    scrolledInPx
+  };
+};
+const reduceUpdateViewport = (prevState, viewportNode, itemAmount) => {
+  const {
+    topOffsets = [],
+    scrolledInPx,
+    scrolledItemCount,
+    avgItemHeight,
+    lastItemHeight,
+    maxHeight,
+    overscan: tolerance
+  } = prevState;
+  const newTopOffsets = [...topOffsets];
+  let updatedLastItemHeight = lastItemHeight;
+  Array.from(viewportNode.children).forEach((child, i) => {
+    newTopOffsets[i + scrolledItemCount] = {
+      amount: scrolledInPx + child.offsetTop,
+      isInterpolated: false
+    };
+    if (i + scrolledItemCount === itemAmount - 1 && !lastItemHeight) {
+      updatedLastItemHeight = child.getBoundingClientRect().height;
+    }
+  });
+  for (let i = 0; i < itemAmount; i += 1) {
+    if (!newTopOffsets[i] || newTopOffsets[i].isInterpolated) {
+      newTopOffsets[i] = {
+        amount: newTopOffsets[i - 1].amount + avgItemHeight,
+        isInterpolated: true
+      };
+    }
+  }
+  const newAvgItemHeight = Math.max(avgItemHeight, viewportNode.getBoundingClientRect().height / (viewportNode.childElementCount || 1));
+  const maxContentHeight = getMaxHeight(itemAmount, newTopOffsets, updatedLastItemHeight);
+  return {
+    ...prevState,
+    lastItemHeight: updatedLastItemHeight,
+    avgItemHeight,
+    topOffsets: newTopOffsets,
+    amountOfItemsInView: Math.round(maxHeight / newAvgItemHeight) + tolerance,
+    maxContentHeight
+  };
+};
+const reduceReset = (prevState, itemHeight, maxHeight, overscan) => ({
+  ...prevState,
+  lastItemHeight: null,
+  topOffsets: [{
+    amount: 0,
+    isInterpolated: false
+  }],
+  scrolledInPx: 0,
+  scrolledItemCount: 0,
+  maxHeight,
+  avgItemHeight: itemHeight,
+  overscan
+});
+const reduceRecommendScrollPosition = (prevState, scrollTop, itemToBeInView) => {
+  const {
+    topOffsets,
+    maxHeight
+  } = prevState;
+  if (!topOffsets) return prevState;
+  const bottomOfTarget = topOffsets[itemToBeInView + 1]?.amount;
+  const topOfTarget = topOffsets[itemToBeInView]?.amount;
+  let recommendedScrollPosition = null;
+  if (topOfTarget < scrollTop) {
+    recommendedScrollPosition = topOfTarget;
+  }
+  if (bottomOfTarget >= scrollTop + maxHeight) {
+    recommendedScrollPosition = bottomOfTarget - maxHeight;
+  }
+  if (itemToBeInView === topOffsets.length - 1) {
+    recommendedScrollPosition = topOffsets[itemToBeInView].amount;
+  }
+  return {
+    ...prevState,
+    recommendedScrollPosition
+  };
+};
+const VirtualScrollReducer = (prevState, action) => {
+  switch (action.type) {
+    case "reset":
+      return reduceReset(prevState, action.itemHeight, action.maxHeight, action.overscan);
+    case "scroll":
+      return reduceScroll(prevState, action.scrollTop);
+    case "updateViewport":
+      return reduceUpdateViewport(prevState, action.viewportNode, action.itemAmount);
+    case "recommendScrollPosition":
+      return reduceRecommendScrollPosition(prevState, action.scrollTop, action.itemToBeInView);
+    default:
+      throw new Error();
+  }
+};
+
+export { VirtualScrollReducer };
+//# sourceMappingURL=VirtualScrollListReducer.js.map

package/build/esm/src/components/VirtualScrollList/VirtualScrollListReducer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VirtualScrollListReducer.js","sources":["../../../../../src/components/VirtualScrollList/VirtualScrollListReducer.ts"],"sourcesContent":["type Offset = { amount: number; isInterpolated: boolean };\n\ntype State = {\n  avgItemHeight?: number;\n  overscan?: number;\n  maxHeight?: number;\n  topOffsets?: Offset[];\n  renderFrom?: number;\n  scrolledItemCount?: number;\n  scrolledInPx?: number;\n  lastItemHeight?: number;\n  amountOfItemsInView?: number;\n  maxContentHeight?: number;\n  recommendedScrollPosition?: number;\n};\n\ntype Action =\n  | {\n      type: \"scroll\";\n      scrollTop: number;\n    }\n  | {\n      type: \"updateViewport\";\n      viewportNode: HTMLDivElement;\n      itemAmount: number;\n    }\n  | {\n      type: \"reset\";\n      itemHeight: number;\n      maxHeight: number;\n      overscan: number;\n    }\n  | {\n      type: \"recommendScrollPosition\";\n      scrollTop: number;\n      itemToBeInView: number;\n    };\n\nconst findClosestOffsetIndex = (arr: Offset[], val: number): number => {\n  let start = 0;\n  let end = arr.length - 1;\n  let mid = Math.floor((start + end) / 2);\n\n  while (start <= end) {\n    mid = Math.floor((start + end) / 2);\n    if (arr[mid].amount === val) {\n      return mid;\n    }\n\n    if (val < arr[mid].amount) {\n      end = mid - 1;\n    } else {\n      start = mid + 1;\n    }\n  }\n  return mid;\n};\n\nconst getMaxHeight = (\n  maxAmountOfItems: number,\n  offsets: Offset[],\n  lastItemHeight = 0\n): number => {\n  const amountOfOffsets = Math.min(offsets.length, maxAmountOfItems);\n  const maxOffset = offsets[amountOfOffsets - 1]?.amount || 0;\n  const result = maxOffset + lastItemHeight;\n\n  return result;\n};\n\nconst reduceScroll = (prevState: State, scrollTop: number): State => {\n  const { topOffsets, overscan: tolerance } = prevState;\n  const scrolledItemCount = Math.max(\n    0,\n    findClosestOffsetIndex(topOffsets, scrollTop) - tolerance / 2\n  );\n  const scrolledInPx = topOffsets[scrolledItemCount]?.amount || 0;\n\n  return {\n    ...prevState,\n    scrolledItemCount,\n    scrolledInPx,\n  };\n};\n\nconst reduceUpdateViewport = (\n  prevState: State,\n  viewportNode: HTMLDivElement,\n  itemAmount: number\n): State => {\n  const {\n    topOffsets = [],\n    scrolledInPx,\n    scrolledItemCount,\n    avgItemHeight,\n    lastItemHeight,\n    maxHeight,\n    overscan: tolerance,\n  } = prevState;\n  const newTopOffsets = [...topOffsets];\n  let updatedLastItemHeight = lastItemHeight;\n\n  Array.from(viewportNode.children).forEach((child: HTMLElement, i: number) => {\n    newTopOffsets[i + scrolledItemCount] = {\n      amount: scrolledInPx + child.offsetTop,\n      isInterpolated: false,\n    };\n\n    if (i + scrolledItemCount === itemAmount - 1 && !lastItemHeight) {\n      updatedLastItemHeight = child.getBoundingClientRect().height;\n    }\n  });\n\n  for (let i = 0; i < itemAmount; i += 1) {\n    if (!newTopOffsets[i] || newTopOffsets[i].isInterpolated) {\n      newTopOffsets[i] = {\n        amount: newTopOffsets[i - 1].amount + avgItemHeight,\n        isInterpolated: true,\n      };\n    }\n  }\n\n  const newAvgItemHeight = Math.max(\n    avgItemHeight,\n    viewportNode.getBoundingClientRect().height /\n      (viewportNode.childElementCount || 1)\n  );\n\n  const maxContentHeight = getMaxHeight(\n    itemAmount,\n    newTopOffsets,\n    updatedLastItemHeight\n  );\n\n  return {\n    ...prevState,\n    lastItemHeight: updatedLastItemHeight,\n    avgItemHeight,\n    topOffsets: newTopOffsets,\n    amountOfItemsInView: Math.round(maxHeight / newAvgItemHeight) + tolerance,\n    maxContentHeight,\n  };\n};\n\nconst reduceReset = (\n  prevState: State,\n  itemHeight: number,\n  maxHeight: number,\n  overscan: number\n): State => ({\n  ...prevState,\n  lastItemHeight: null,\n  topOffsets: [{ amount: 0, isInterpolated: false }],\n  scrolledInPx: 0,\n  scrolledItemCount: 0,\n  maxHeight,\n  avgItemHeight: itemHeight,\n  overscan,\n});\n\nconst reduceRecommendScrollPosition = (\n  prevState: State,\n  scrollTop: number,\n  itemToBeInView: number\n): State => {\n  const { topOffsets, maxHeight } = prevState;\n  if (!topOffsets) return prevState;\n\n  const bottomOfTarget = topOffsets[itemToBeInView + 1]?.amount;\n  const topOfTarget = topOffsets[itemToBeInView]?.amount;\n  let recommendedScrollPosition = null;\n\n  if (topOfTarget < scrollTop) {\n    recommendedScrollPosition = topOfTarget;\n  }\n\n  if (bottomOfTarget >= scrollTop + maxHeight) {\n    recommendedScrollPosition = bottomOfTarget - maxHeight;\n  }\n\n  if (itemToBeInView === topOffsets.length - 1) {\n    recommendedScrollPosition = topOffsets[itemToBeInView].amount;\n  }\n\n  return {\n    ...prevState,\n    recommendedScrollPosition,\n  };\n};\n\nexport const VirtualScrollReducer = (\n  prevState: State,\n  action: Action\n): State => {\n  switch (action.type) {\n    case \"reset\":\n      return reduceReset(\n        prevState,\n        action.itemHeight,\n        action.maxHeight,\n        action.overscan\n      );\n    case \"scroll\":\n      return reduceScroll(prevState, action.scrollTop);\n    case \"updateViewport\":\n      return reduceUpdateViewport(\n        prevState,\n        action.viewportNode,\n        action.itemAmount\n      );\n    case \"recommendScrollPosition\":\n      return reduceRecommendScrollPosition(\n        prevState,\n        action.scrollTop,\n        action.itemToBeInView\n      );\n    default:\n      throw new Error();\n  }\n};\n"],"names":["findClosestOffsetIndex","arr","val","start","end","length","mid","Math","floor","amount","getMaxHeight","maxAmountOfItems","offsets","lastItemHeight","arguments","undefined","amountOfOffsets","min","maxOffset","result","reduceScroll","prevState","scrollTop","topOffsets","overscan","tolerance","scrolledItemCount","max","scrolledInPx","reduceUpdateViewport","viewportNode","itemAmount","avgItemHeight","maxHeight","newTopOffsets","updatedLastItemHeight","Array","from","children","forEach","child","i","offsetTop","isInterpolated","getBoundingClientRect","height","newAvgItemHeight","childElementCount","maxContentHeight","amountOfItemsInView","round","reduceReset","itemHeight","reduceRecommendScrollPosition","itemToBeInView","bottomOfTarget","topOfTarget","recommendedScrollPosition","VirtualScrollReducer","action","type","Error"],"mappings":"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"}

package/build/esm/src/index.js

@@ -0,0 +1,53 @@
+import { ambossVisualConfiguration } from '../build-tokens/visualConfig.js';
+export { CacheProvider, ThemeProvider } from '@emotion/react';
+export { default as createCache } from '@emotion/cache';
+export { Card } from './components/Card/Card.js';
+export { CardBox } from './components/Card/CardBox.js';
+export { Box } from './components/Box/Box.js';
+export { Inline } from './components/Inline/Inline.js';
+export { Stack } from './components/Stack/Stack.js';
+export { H1, H2, H3, H4, H5, H6 } from './components/Typography/Header/Header.js';
+export { Text } from './components/Typography/Text/Text.js';
+export { TextClamped } from './components/Typography/TextClamped/TextClamped.js';
+export { StyledText } from './components/Typography/StyledText/StyledText.js';
+export { Link } from './components/Link/Link.js';
+export { Icon } from './components/Icon/Icon.js';
+export { Button } from './components/Button/Button.js';
+export { Divider } from './components/Divider/Divider.js';
+export { Column, Columns } from './components/Column/Columns.js';
+export { Tabs } from './components/Tabs/Tabs.js';
+export { Badge } from './components/Badge/Badge.js';
+export { SearchResult } from './components/SearchResult/SearchResult.js';
+export { ToggleButton } from './components/Form/ToggleButton/ToggleButton.js';
+export { DropdownMenu } from './components/DropdownMenu/DropdownMenu.js';
+export { FormFieldGroup } from './components/Form/FormFieldGroup/FormFieldGroup.js';
+export { Input } from './components/Form/Input/Input.js';
+export { Checkbox } from './components/Form/Checkbox/Checkbox.js';
+export { Toggle } from './components/Form/Toggle/Toggle.js';
+export { Radio } from './components/Form/Radio/Radio.js';
+export { RadioButton } from './components/Form/RadioButton/RadioButton.js';
+export { Textarea } from './components/Form/Textarea/Textarea.js';
+export { Select } from './components/Form/Select/Select.js';
+export { SubThemeProvider } from './components/SubThemeProvider/SubThemeProvider.js';
+export { PictogramButton } from './components/PictogramButton/PictogramButton.js';
+export { MediaViewerBar } from './components/MediaViewerBar/MediaViewerBar.js';
+export { SegmentedProgressBar } from './components/SegmentedProgressBar/SegmentedProgressBar.js';
+export { ProgressBar } from './components/ProgressBar/ProgressBar.js';
+export { Container } from './components/Container/Container.js';
+export { PasswordInput } from './components/Form/PasswordInput/PasswordInput.js';
+export { RoundButton } from './components/RoundButton/RoundButton.js';
+export { Notification } from './components/Notification/Notification.js';
+export { Logo } from './components/Logo/Logo.js';
+export { MediaItem } from './components/MediaItem/MediaItem.js';
+export { Callout } from './components/Callout/Callout.js';
+export { Modal } from './components/Patterns/Modal/Modal.js';
+export { ButtonGroup } from './components/Patterns/ButtonGroup/ButtonGroup.js';
+export { Collapsible, CollapsibleHeader } from './components/Collapsible/Collapsible.js';
+
+const {
+  dark,
+  light
+} = ambossVisualConfiguration;
+
+export { dark, light };
+//# sourceMappingURL=index.js.map

package/build/esm/src/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/index.ts"],"sourcesContent":["import { ambossVisualConfiguration } from \"../build-tokens/visualConfig\";\n\nexport const { dark, light } = ambossVisualConfiguration;\nexport { ThemeProvider, CacheProvider } from \"@emotion/react\";\nexport { default as createCache } from \"@emotion/cache\";\nexport { Card } from \"./components/Card/Card\";\nexport { CardBox } from \"./components/Card/CardBox\";\nexport { Box } from \"./components/Box/Box\";\nexport { Inline } from \"./components/Inline/Inline\";\nexport { Stack } from \"./components/Stack/Stack\";\nexport { H1, H2, H3, H4, H5, H6 } from \"./components/Typography/Header/Header\";\nexport { Text } from \"./components/Typography/Text/Text\";\nexport { TextClamped } from \"./components/Typography/TextClamped/TextClamped\";\nexport { StyledText } from \"./components/Typography/StyledText/StyledText\";\nexport { Link } from \"./components/Link/Link\";\nexport { Icon } from \"./components/Icon/Icon\";\nexport { Button } from \"./components/Button/Button\";\nexport { Divider } from \"./components/Divider/Divider\";\nexport { Column, Columns } from \"./components/Column/Columns\";\nexport { Tabs } from \"./components/Tabs/Tabs\";\nexport { Badge } from \"./components/Badge/Badge\";\nexport { SearchResult } from \"./components/SearchResult/SearchResult\";\nexport { ToggleButton } from \"./components/Form/ToggleButton/ToggleButton\";\nexport { DropdownMenu } from \"./components/DropdownMenu/DropdownMenu\";\nexport { FormFieldGroup } from \"./components/Form/FormFieldGroup/FormFieldGroup\";\nexport { Input } from \"./components/Form/Input/Input\";\nexport { Checkbox } from \"./components/Form/Checkbox/Checkbox\";\nexport { Toggle } from \"./components/Form/Toggle/Toggle\";\nexport { Radio } from \"./components/Form/Radio/Radio\";\nexport { RadioButton } from \"./components/Form/RadioButton/RadioButton\";\nexport { Textarea } from \"./components/Form/Textarea/Textarea\";\nexport { Select } from \"./components/Form/Select/Select\";\nexport { SubThemeProvider } from \"./components/SubThemeProvider/SubThemeProvider\";\nexport { PictogramButton } from \"./components/PictogramButton/PictogramButton\";\nexport { MediaViewerBar } from \"./components/MediaViewerBar/MediaViewerBar\";\nexport { SegmentedProgressBar } from \"./components/SegmentedProgressBar/SegmentedProgressBar\";\nexport { ProgressBar } from \"./components/ProgressBar/ProgressBar\";\nexport { Container } from \"./components/Container/Container\";\nexport { PasswordInput } from \"./components/Form/PasswordInput/PasswordInput\";\nexport { RoundButton } from \"./components/RoundButton/RoundButton\";\nexport { Notification } from \"./components/Notification/Notification\";\nexport { Logo } from \"./components/Logo/Logo\";\nexport { MediaItem } from \"./components/MediaItem/MediaItem\";\nexport { Callout } from \"./components/Callout/Callout\";\nexport { Modal } from \"./components/Patterns/Modal/Modal\";\nexport { ButtonGroup } from \"./components/Patterns/ButtonGroup/ButtonGroup\";\nexport {\n  Collapsible,\n  CollapsibleHeader,\n} from \"./components/Collapsible/Collapsible\";\n"],"names":["dark","light","ambossVisualConfiguration"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEa,MAAA;EAAEA,IAAI;AAAEC,EAAAA,KAAAA;AAAM,CAAC,GAAGC;;;;"}

package/build/esm/src/shared/flattenChildren.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+/**
+ * Copied from https://github.com/grrowl/react-keyed-flatten-children (since ESM import doesn't work with the module)
+ *
+ * Similar to [React's built-in `Children.toArray` method](https://reactjs.org/docs/react-api.html#reactchildrentoarray),
+ * this utility takes children and returns them as an array for introspection or filtering.
+ *
+ * Different from `Children.toArray`, it will flatten arrays and `React.Fragment`s into a regular, one-dimensional
+ * array while ensuring element and fragment keys are preserved, unique, and stable between renders.
+ */
+export declare const flattenChildren: (children: React.ReactNode, depth?: number, keys?: string[]) => any;

package/build/esm/src/shared/flattenChildren.js

@@ -0,0 +1,32 @@
+import { Children, isValidElement, cloneElement } from 'react';
+import { isFragment } from 'react-is';
+
+/**
+ * Copied from https://github.com/grrowl/react-keyed-flatten-children (since ESM import doesn't work with the module)
+ *
+ * Similar to [React's built-in `Children.toArray` method](https://reactjs.org/docs/react-api.html#reactchildrentoarray),
+ * this utility takes children and returns them as an array for introspection or filtering.
+ *
+ * Different from `Children.toArray`, it will flatten arrays and `React.Fragment`s into a regular, one-dimensional
+ * array while ensuring element and fragment keys are preserved, unique, and stable between renders.
+ */
+
+const flattenChildren = function (children) {
+  let depth = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  let keys = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+  return Children.toArray(children).reduce((acc, node, nodeIndex) => {
+    if (isFragment(node)) {
+      acc.push(...flattenChildren(node.props.children, depth + 1, keys.concat(String(node.key || nodeIndex))));
+    } else if ( /*#__PURE__*/isValidElement(node)) {
+      acc.push( /*#__PURE__*/cloneElement(node, {
+        key: keys.concat(String(node.key)).join(".")
+      }));
+    } else if (typeof node === "string" || typeof node === "number") {
+      acc.push(node);
+    }
+    return acc;
+  }, []);
+};
+
+export { flattenChildren };
+//# sourceMappingURL=flattenChildren.js.map

package/build/esm/src/shared/flattenChildren.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"flattenChildren.js","sources":["../../../../src/shared/flattenChildren.ts"],"sourcesContent":["import React, {\n  Children,\n  isValidElement,\n  cloneElement,\n  ReactChild,\n} from \"react\";\nimport { isFragment } from \"react-is\";\n\n/**\n * Copied from https://github.com/grrowl/react-keyed-flatten-children (since ESM import doesn't work with the module)\n *\n * Similar to [React's built-in `Children.toArray` method](https://reactjs.org/docs/react-api.html#reactchildrentoarray),\n * this utility takes children and returns them as an array for introspection or filtering.\n *\n * Different from `Children.toArray`, it will flatten arrays and `React.Fragment`s into a regular, one-dimensional\n * array while ensuring element and fragment keys are preserved, unique, and stable between renders.\n */\n\nexport const flattenChildren = (\n  children: React.ReactNode,\n  depth = 0,\n  keys: string[] = []\n): any =>\n  Children.toArray(children).reduce((acc: ReactChild[], node, nodeIndex) => {\n    if (isFragment(node)) {\n      acc.push(\n        ...flattenChildren(\n          node.props.children,\n          depth + 1,\n          keys.concat(String(node.key || nodeIndex))\n        )\n      );\n    } else if (isValidElement(node)) {\n      acc.push(\n        cloneElement(node, {\n          key: keys.concat(String(node.key)).join(\".\"),\n        })\n      );\n    } else if (typeof node === \"string\" || typeof node === \"number\") {\n      acc.push(node);\n    }\n    return acc;\n  }, []);\n"],"names":["flattenChildren","children","depth","arguments","length","undefined","keys","Children","toArray","reduce","acc","node","nodeIndex","isFragment","push","props","concat","String","key","isValidElement","cloneElement","join"],"mappings":";;;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEaA,MAAAA,eAAe,GAAG,UAC7BC,QAAyB,EAAA;AAAA,EAAA,IACzBC,KAAK,GAAAC,SAAA,CAAAC,MAAA,GAAA,CAAA,IAAAD,SAAA,CAAA,CAAA,CAAA,KAAAE,SAAA,GAAAF,SAAA,CAAA,CAAA,CAAA,GAAG,CAAC,CAAA;AAAA,EAAA,IACTG,IAAc,GAAAH,SAAA,CAAAC,MAAA,GAAA,CAAA,IAAAD,SAAA,CAAA,CAAA,CAAA,KAAAE,SAAA,GAAAF,SAAA,CAAA,CAAA,CAAA,GAAG,EAAE,CAAA;AAAA,EAAA,OAEnBI,QAAQ,CAACC,OAAO,CAACP,QAAQ,CAAC,CAACQ,MAAM,CAAC,CAACC,GAAiB,EAAEC,IAAI,EAAEC,SAAS,KAAK;AACxE,IAAA,IAAIC,UAAU,CAACF,IAAI,CAAC,EAAE;AACpBD,MAAAA,GAAG,CAACI,IAAI,CACN,GAAGd,eAAe,CAChBW,IAAI,CAACI,KAAK,CAACd,QAAQ,EACnBC,KAAK,GAAG,CAAC,EACTI,IAAI,CAACU,MAAM,CAACC,MAAM,CAACN,IAAI,CAACO,GAAG,IAAIN,SAAS,CAAC,CAAC,CAC3C,CACF,CAAA;AACH,KAAC,MAAM,kBAAIO,cAAc,CAACR,IAAI,CAAC,EAAE;AAC/BD,MAAAA,GAAG,CAACI,IAAI,eACNM,YAAY,CAACT,IAAI,EAAE;AACjBO,QAAAA,GAAG,EAAEZ,IAAI,CAACU,MAAM,CAACC,MAAM,CAACN,IAAI,CAACO,GAAG,CAAC,CAAC,CAACG,IAAI,CAAC,GAAG,CAAA;AAC7C,OAAC,CAAC,CACH,CAAA;KACF,MAAM,IAAI,OAAOV,IAAI,KAAK,QAAQ,IAAI,OAAOA,IAAI,KAAK,QAAQ,EAAE;AAC/DD,MAAAA,GAAG,CAACI,IAAI,CAACH,IAAI,CAAC,CAAA;AAChB,KAAA;AACA,IAAA,OAAOD,GAAG,CAAA;GACX,EAAE,EAAE,CAAC,CAAA;AAAA;;;;"}

package/build/esm/src/shared/informDeprecation.js

@@ -0,0 +1,11 @@
+const informDeprecation = function (property, value, location) {
+  let details = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : "";
+  if (property === undefined) return;
+  if (property === value) {
+    // eslint-disable-next-line no-console
+    console.error(`value ${JSON.stringify(value)} is depricated in ${location} \n ${details}`);
+  }
+};
+
+export { informDeprecation };
+//# sourceMappingURL=informDeprecation.js.map

package/build/esm/src/shared/informDeprecation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"informDeprecation.js","sources":["../../../../src/shared/informDeprecation.ts"],"sourcesContent":["export const informDeprecation = (\n  property: unknown,\n  value: unknown,\n  location: string,\n  details = \"\"\n): void => {\n  if (property === undefined) return;\n  if (property === value) {\n    // eslint-disable-next-line no-console\n    console.error(\n      `value ${JSON.stringify(\n        value\n      )} is depricated in ${location} \\n ${details}`\n    );\n  }\n};\n"],"names":["informDeprecation","property","value","location","details","arguments","length","undefined","console","error","JSON","stringify"],"mappings":"AAAO,MAAMA,iBAAiB,GAAG,UAC/BC,QAAiB,EACjBC,KAAc,EACdC,QAAgB,EAEP;AAAA,EAAA,IADTC,OAAO,GAAAC,SAAA,CAAAC,MAAA,GAAA,CAAA,IAAAD,SAAA,CAAA,CAAA,CAAA,KAAAE,SAAA,GAAAF,SAAA,CAAA,CAAA,CAAA,GAAG,EAAE,CAAA;EAEZ,IAAIJ,QAAQ,KAAKM,SAAS,EAAE,OAAA;EAC5B,IAAIN,QAAQ,KAAKC,KAAK,EAAE;AACtB;AACAM,IAAAA,OAAO,CAACC,KAAK,CACV,CAAA,MAAA,EAAQC,IAAI,CAACC,SAAS,CACrBT,KAAK,CACL,CAAoBC,kBAAAA,EAAAA,QAAS,CAAMC,IAAAA,EAAAA,OAAQ,EAAC,CAC/C,CAAA;AACH,GAAA;AACF;;;;"}

package/build/esm/src/shared/mediaQueries.js

@@ -0,0 +1,66 @@
+import breakpoints from '../../build-tokens/_breakpoints.json.js';
+
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
+/*
+ Although, mq implementation supports any property type, the following types are specified to provide type safety. If you need support for a new type, add it here.
+*/
+
+// this thing probably deserves to be a separate library, like facepaint for emotion
+function getMq(breakpointRules) {
+  const keys = breakpointRules;
+  return rules => {
+    const res = {};
+    keys.forEach(key => {
+      res[key] = {};
+    });
+    res[`@media screen`] = {};
+
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    Object.entries(rules).forEach(_ref => {
+      let [cssProperty, [prop, map]] = _ref;
+      if (Array.isArray(prop)) {
+        const sm = prop[0];
+        const md = prop[1] || prop[0];
+        const lg = prop[2] || prop[1] || prop[0];
+        const [s, m, l] = keys;
+        res[s][cssProperty] = map[sm];
+        res[m][cssProperty] = map[md];
+        res[l][cssProperty] = map[lg];
+      } else {
+        res[`@media screen`][cssProperty] = map[prop];
+      }
+    });
+    return res;
+  };
+}
+const mq = getMq([`@media (max-width: ${breakpoints[1].value}px)`, `@media (min-width: ${breakpoints[1].value}px) and (max-width: ${breakpoints[2].value}px)`, `@media (min-width: ${breakpoints[2].value}px)`]);
+function getMqValue(breakpointRules) {
+  const keys = breakpointRules;
+  return rules => {
+    const res = {};
+    keys.forEach(key => {
+      res[key] = {};
+    });
+    res[`@media screen`] = {};
+    Object.entries(rules).forEach(_ref2 => {
+      let [cssProperty, cssValues] = _ref2;
+      if (Array.isArray(cssValues)) {
+        breakpointRules.forEach((breakpoint, index) => {
+          let i = index;
+          while (!cssValues[i] && i !== 0) {
+            i -= 1;
+          }
+          res[breakpoint][cssProperty] = cssValues[i];
+        });
+      } else {
+        res[`@media screen`][cssProperty] = cssValues;
+      }
+    });
+    return res;
+  };
+}
+const mqValue = getMqValue([`@media (max-width: ${breakpoints[1].value}px)`, `@media (min-width: ${breakpoints[1].value}px) and (max-width: ${breakpoints[2].value}px)`, `@media (min-width: ${breakpoints[2].value}px)`]);
+
+export { mq, mqValue };
+//# sourceMappingURL=mediaQueries.js.map

package/build/esm/src/shared/mediaQueries.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mediaQueries.js","sources":["../../../../src/shared/mediaQueries.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/* eslint-disable @typescript-eslint/no-unused-vars */\nimport {\n  ColumnSizes,\n  HorizontalAlignment,\n  MQ,\n  SpaceSizes,\n  TextAlignment,\n  VerticalAlignment,\n  Order,\n  ColumnAlignment,\n  Hyphens,\n} from \"../types\";\nimport breakpoints from \"../../build-tokens/_breakpoints.json\";\n\ntype MqProp<T> = [\n  T | MQ<T>,\n  Record<T extends string ? T : never, string | number>\n];\n\n/*\n Although, mq implementation supports any property type, the following types are specified to provide type safety. If you need support for a new type, add it here.\n*/\ntype MqRules = Record<\n  string,\n  | MqProp<TextAlignment>\n  | MqProp<SpaceSizes>\n  | MqProp<HorizontalAlignment>\n  | MqProp<VerticalAlignment>\n  | MqProp<ColumnSizes>\n  | MqProp<Order>\n  | MqProp<ColumnAlignment>\n  | MqProp<Hyphens>\n>;\n\ntype EmotionCssPropertyName = string;\ntype EmotionCssValue = string | number;\ntype EmotionCssDescription = Record<EmotionCssPropertyName, EmotionCssValue>;\ntype MqFunc = (\n  rules: MqRules\n) => Record<string, EmotionCssValue | EmotionCssDescription>;\n\n// this thing probably deserves to be a separate library, like facepaint for emotion\nfunction getMq(breakpointRules: string[]): MqFunc {\n  const keys = breakpointRules;\n\n  return (rules) => {\n    const res: Record<string, EmotionCssValue | EmotionCssDescription> = {};\n\n    keys.forEach((key: string) => {\n      res[key] = {};\n    });\n    res[`@media screen`] = {};\n\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    Object.entries(rules).forEach(([cssProperty, [prop, map]]: any) => {\n      if (Array.isArray(prop)) {\n        const sm = prop[0];\n        const md = prop[1] || prop[0];\n        const lg = prop[2] || prop[1] || prop[0];\n        const [s, m, l]: string[] = keys;\n\n        (res[s] as EmotionCssDescription)[cssProperty] = map[sm];\n        (res[m] as EmotionCssDescription)[cssProperty] = map[md];\n        (res[l] as EmotionCssDescription)[cssProperty] = map[lg];\n      } else {\n        (res[`@media screen`] as EmotionCssDescription)[cssProperty] = map[\n          prop as string\n        ] as string;\n      }\n    });\n\n    return res;\n  };\n}\n\nexport const mq = getMq([\n  `@media (max-width: ${breakpoints[1].value}px)`,\n  `@media (min-width: ${breakpoints[1].value}px) and (max-width: ${breakpoints[2].value}px)`,\n  `@media (min-width: ${breakpoints[2].value}px)`,\n]);\n\nfunction getMqValue(breakpointRules: string[]) {\n  const keys = breakpointRules;\n  return (\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    rules: Record<EmotionCssPropertyName, EmotionCssValue[] | EmotionCssValue>\n  ): Record<string, EmotionCssValue | EmotionCssDescription> => {\n    const res: Record<string, EmotionCssValue | EmotionCssDescription> = {};\n    keys.forEach((key: string) => {\n      res[key] = {};\n    });\n    res[`@media screen`] = {};\n\n    Object.entries(rules).forEach(([cssProperty, cssValues]) => {\n      if (Array.isArray(cssValues)) {\n        breakpointRules.forEach((breakpoint, index) => {\n          let i = index;\n          while (!cssValues[i] && i !== 0) {\n            i -= 1;\n          }\n\n          (res[breakpoint] as EmotionCssDescription)[cssProperty] =\n            cssValues[i];\n        });\n      } else {\n        (res[`@media screen`] as EmotionCssDescription)[\n          cssProperty\n        ] = cssValues;\n      }\n    });\n\n    return res;\n  };\n}\n\nexport const mqValue = getMqValue([\n  `@media (max-width: ${breakpoints[1].value}px)`,\n  `@media (min-width: ${breakpoints[1].value}px) and (max-width: ${breakpoints[2].value}px)`,\n  `@media (min-width: ${breakpoints[2].value}px)`,\n]);\n\nexport function getMediaQueryClasses<T>(\n  s: T | MQ<T> | undefined,\n  styles: Record<string, string>,\n  prefix = \"\"\n): string[] {\n  if (s === undefined) return [];\n\n  let res;\n  if (Array.isArray(s)) {\n    const sm = s[0];\n    const md = s[1] || s[0];\n    const lg = s[2] || s[1] || s[0];\n\n    res = [`${sm}-small`, `${md}-medium`, `${lg}-large`];\n  } else {\n    res = [(s as unknown) as string];\n  }\n\n  return res.map((cl) => `${prefix}${cl}`).map((cl) => styles[cl]);\n}\n"],"names":["getMq","breakpointRules","keys","rules","res","forEach","key","Object","entries","_ref","cssProperty","prop","map","Array","isArray","sm","md","lg","s","m","l","mq","breakpoints","value","getMqValue","_ref2","cssValues","breakpoint","index","i","mqValue"],"mappings":"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"}

package/build/esm/src/shared/useAutoPosition.js

@@ -0,0 +1,41 @@
+import { useState, useLayoutEffect } from 'react';
+import { useWindow } from './useWindow.js';
+import { useDocument } from './useDocument.js';
+
+const useAutoPosition = (anchorRef, contentRef, isActive) => {
+  const [verticalPosition, setVerticalPosition] = useState("down");
+  const [horizontalPosition, setHorizontalPosition] = useState("left");
+  const document = useDocument();
+  const window = useWindow();
+  useLayoutEffect(() => {
+    if (!contentRef) return;
+    if (isActive) {
+      const maxHeight = Math.max(document.documentElement.clientHeight || 0, window.innerHeight || 0);
+      const rect = contentRef.current.getBoundingClientRect();
+      const anchorHeight = anchorRef.current.getBoundingClientRect().height;
+      const anchorX = anchorRef.current.getBoundingClientRect().x;
+      const screenWidth = window.innerWidth;
+      const isUp = rect.top + rect.height > maxHeight;
+      const isDown = rect.top - anchorHeight < rect.height;
+      const isLeft = anchorX > screenWidth / 2;
+      const isRight = anchorX < screenWidth / 2;
+      if (isUp) {
+        setVerticalPosition("up");
+      } else if (isDown) {
+        setVerticalPosition("down");
+      }
+      if (isLeft) {
+        setHorizontalPosition("left");
+      } else if (isRight) {
+        setHorizontalPosition("right");
+      }
+    } else {
+      setVerticalPosition("down");
+      setHorizontalPosition("left");
+    }
+  }, [anchorRef, contentRef, document.documentElement.clientHeight, isActive, window.innerHeight, window.innerWidth]);
+  return [verticalPosition, horizontalPosition];
+};
+
+export { useAutoPosition };
+//# sourceMappingURL=useAutoPosition.js.map

package/build/esm/src/shared/useAutoPosition.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAutoPosition.js","sources":["../../../../src/shared/useAutoPosition.ts"],"sourcesContent":["import { useState, useLayoutEffect, RefObject } from \"react\";\n\nimport { useWindow } from \"./useWindow\";\nimport { useDocument } from \"./useDocument\";\n\nexport type VerticalPosition = \"up\" | \"down\";\nexport type HorizontalPosition = \"left\" | \"right\";\nexport type Position = [VerticalPosition, HorizontalPosition];\n\nexport const useAutoPosition = (\n  anchorRef: RefObject<HTMLElement>,\n  contentRef: RefObject<HTMLElement>,\n  isActive: boolean\n): Position => {\n  const [verticalPosition, setVerticalPosition] = useState(\n    \"down\" as VerticalPosition\n  );\n  const [horizontalPosition, setHorizontalPosition] = useState(\n    \"left\" as HorizontalPosition\n  );\n  const document = useDocument();\n  const window = useWindow();\n\n  useLayoutEffect(() => {\n    if (!contentRef) return;\n\n    if (isActive) {\n      const maxHeight = Math.max(\n        document.documentElement.clientHeight || 0,\n        window.innerHeight || 0\n      );\n\n      const rect: DOMRect = contentRef.current.getBoundingClientRect();\n      const anchorHeight = anchorRef.current.getBoundingClientRect().height;\n      const anchorX = anchorRef.current.getBoundingClientRect().x;\n      const screenWidth = window.innerWidth;\n\n      const isUp = rect.top + rect.height > maxHeight;\n      const isDown = rect.top - anchorHeight < rect.height;\n      const isLeft = anchorX > screenWidth / 2;\n      const isRight = anchorX < screenWidth / 2;\n\n      if (isUp) {\n        setVerticalPosition(\"up\");\n      } else if (isDown) {\n        setVerticalPosition(\"down\");\n      }\n\n      if (isLeft) {\n        setHorizontalPosition(\"left\");\n      } else if (isRight) {\n        setHorizontalPosition(\"right\");\n      }\n    } else {\n      setVerticalPosition(\"down\");\n      setHorizontalPosition(\"left\");\n    }\n  }, [\n    anchorRef,\n    contentRef,\n    document.documentElement.clientHeight,\n    isActive,\n    window.innerHeight,\n    window.innerWidth,\n  ]);\n\n  return [verticalPosition, horizontalPosition];\n};\n"],"names":["useAutoPosition","anchorRef","contentRef","isActive","verticalPosition","setVerticalPosition","useState","horizontalPosition","setHorizontalPosition","document","useDocument","window","useWindow","useLayoutEffect","maxHeight","Math","max","documentElement","clientHeight","innerHeight","rect","current","getBoundingClientRect","anchorHeight","height","anchorX","x","screenWidth","innerWidth","isUp","top","isDown","isLeft","isRight"],"mappings":";;;;AASO,MAAMA,eAAe,GAAGA,CAC7BC,SAAiC,EACjCC,UAAkC,EAClCC,QAAiB,KACJ;EACb,MAAM,CAACC,gBAAgB,EAAEC,mBAAmB,CAAC,GAAGC,QAAQ,CACtD,MAAM,CACP,CAAA;EACD,MAAM,CAACC,kBAAkB,EAAEC,qBAAqB,CAAC,GAAGF,QAAQ,CAC1D,MAAM,CACP,CAAA;EACD,MAAMG,QAAQ,GAAGC,WAAW,EAAE,CAAA;EAC9B,MAAMC,MAAM,GAAGC,SAAS,EAAE,CAAA;AAE1BC,EAAAA,eAAe,CAAC,MAAM;IACpB,IAAI,CAACX,UAAU,EAAE,OAAA;AAEjB,IAAA,IAAIC,QAAQ,EAAE;AACZ,MAAA,MAAMW,SAAS,GAAGC,IAAI,CAACC,GAAG,CACxBP,QAAQ,CAACQ,eAAe,CAACC,YAAY,IAAI,CAAC,EAC1CP,MAAM,CAACQ,WAAW,IAAI,CAAC,CACxB,CAAA;AAED,MAAA,MAAMC,IAAa,GAAGlB,UAAU,CAACmB,OAAO,CAACC,qBAAqB,EAAE,CAAA;MAChE,MAAMC,YAAY,GAAGtB,SAAS,CAACoB,OAAO,CAACC,qBAAqB,EAAE,CAACE,MAAM,CAAA;MACrE,MAAMC,OAAO,GAAGxB,SAAS,CAACoB,OAAO,CAACC,qBAAqB,EAAE,CAACI,CAAC,CAAA;AAC3D,MAAA,MAAMC,WAAW,GAAGhB,MAAM,CAACiB,UAAU,CAAA;MAErC,MAAMC,IAAI,GAAGT,IAAI,CAACU,GAAG,GAAGV,IAAI,CAACI,MAAM,GAAGV,SAAS,CAAA;MAC/C,MAAMiB,MAAM,GAAGX,IAAI,CAACU,GAAG,GAAGP,YAAY,GAAGH,IAAI,CAACI,MAAM,CAAA;AACpD,MAAA,MAAMQ,MAAM,GAAGP,OAAO,GAAGE,WAAW,GAAG,CAAC,CAAA;AACxC,MAAA,MAAMM,OAAO,GAAGR,OAAO,GAAGE,WAAW,GAAG,CAAC,CAAA;AAEzC,MAAA,IAAIE,IAAI,EAAE;QACRxB,mBAAmB,CAAC,IAAI,CAAC,CAAA;OAC1B,MAAM,IAAI0B,MAAM,EAAE;QACjB1B,mBAAmB,CAAC,MAAM,CAAC,CAAA;AAC7B,OAAA;AAEA,MAAA,IAAI2B,MAAM,EAAE;QACVxB,qBAAqB,CAAC,MAAM,CAAC,CAAA;OAC9B,MAAM,IAAIyB,OAAO,EAAE;QAClBzB,qBAAqB,CAAC,OAAO,CAAC,CAAA;AAChC,OAAA;AACF,KAAC,MAAM;MACLH,mBAAmB,CAAC,MAAM,CAAC,CAAA;MAC3BG,qBAAqB,CAAC,MAAM,CAAC,CAAA;AAC/B,KAAA;GACD,EAAE,CACDP,SAAS,EACTC,UAAU,EACVO,QAAQ,CAACQ,eAAe,CAACC,YAAY,EACrCf,QAAQ,EACRQ,MAAM,CAACQ,WAAW,EAClBR,MAAM,CAACiB,UAAU,CAClB,CAAC,CAAA;AAEF,EAAA,OAAO,CAACxB,gBAAgB,EAAEG,kBAAkB,CAAC,CAAA;AAC/C;;;;"}

package/build/esm/src/shared/useDocument.js

@@ -0,0 +1,6 @@
+function useDocument() {
+  return document;
+}
+
+export { useDocument };
+//# sourceMappingURL=useDocument.js.map

package/build/esm/src/shared/useDocument.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDocument.js","sources":["../../../../src/shared/useDocument.ts"],"sourcesContent":["export function useDocument(): Document {\n  return document;\n}\n"],"names":["useDocument","document"],"mappings":"AAAO,SAASA,WAAWA,GAAa;AACtC,EAAA,OAAOC,QAAQ,CAAA;AACjB;;;;"}

package/build/esm/src/shared/useHover.js

@@ -0,0 +1,25 @@
+import { useState, useEffect } from 'react';
+
+function useHover(ref) {
+  const [hovered, setHovered] = useState(false);
+  const handleMouseOver = () => setHovered(true);
+  const handleMouseOut = () => setHovered(false);
+  useEffect(() => {
+    if (!ref) return undefined;
+    const node = ref.current;
+    if (node) {
+      node.addEventListener("mouseover", handleMouseOver);
+      node.addEventListener("mouseout", handleMouseOut);
+      return () => {
+        node.removeEventListener("mouseover", handleMouseOver);
+        node.removeEventListener("mouseout", handleMouseOut);
+      };
+    }
+    return undefined;
+  }, [ref]);
+  if (!ref) return null;
+  return hovered;
+}
+
+export { useHover };
+//# sourceMappingURL=useHover.js.map

package/build/esm/src/shared/useHover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useHover.js","sources":["../../../../src/shared/useHover.ts"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\n\nexport function useHover(ref: React.MutableRefObject<any>): boolean {\n  const [hovered, setHovered] = useState(false);\n\n  const handleMouseOver = () => setHovered(true);\n  const handleMouseOut = () => setHovered(false);\n\n  useEffect(() => {\n    if (!ref) return undefined;\n    const node = ref.current;\n    if (node) {\n      node.addEventListener(\"mouseover\", handleMouseOver);\n      node.addEventListener(\"mouseout\", handleMouseOut);\n\n      return () => {\n        node.removeEventListener(\"mouseover\", handleMouseOver);\n        node.removeEventListener(\"mouseout\", handleMouseOut);\n      };\n    }\n    return undefined;\n  }, [ref]);\n\n  if (!ref) return null;\n  return hovered;\n}\n"],"names":["useHover","ref","hovered","setHovered","useState","handleMouseOver","handleMouseOut","useEffect","undefined","node","current","addEventListener","removeEventListener"],"mappings":";;AAEO,SAASA,QAAQA,CAACC,GAAgC,EAAW;EAClE,MAAM,CAACC,OAAO,EAAEC,UAAU,CAAC,GAAGC,QAAQ,CAAC,KAAK,CAAC,CAAA;AAE7C,EAAA,MAAMC,eAAe,GAAGA,MAAMF,UAAU,CAAC,IAAI,CAAC,CAAA;AAC9C,EAAA,MAAMG,cAAc,GAAGA,MAAMH,UAAU,CAAC,KAAK,CAAC,CAAA;AAE9CI,EAAAA,SAAS,CAAC,MAAM;AACd,IAAA,IAAI,CAACN,GAAG,EAAE,OAAOO,SAAS,CAAA;AAC1B,IAAA,MAAMC,IAAI,GAAGR,GAAG,CAACS,OAAO,CAAA;AACxB,IAAA,IAAID,IAAI,EAAE;AACRA,MAAAA,IAAI,CAACE,gBAAgB,CAAC,WAAW,EAAEN,eAAe,CAAC,CAAA;AACnDI,MAAAA,IAAI,CAACE,gBAAgB,CAAC,UAAU,EAAEL,cAAc,CAAC,CAAA;AAEjD,MAAA,OAAO,MAAM;AACXG,QAAAA,IAAI,CAACG,mBAAmB,CAAC,WAAW,EAAEP,eAAe,CAAC,CAAA;AACtDI,QAAAA,IAAI,CAACG,mBAAmB,CAAC,UAAU,EAAEN,cAAc,CAAC,CAAA;OACrD,CAAA;AACH,KAAA;AACA,IAAA,OAAOE,SAAS,CAAA;AAClB,GAAC,EAAE,CAACP,GAAG,CAAC,CAAC,CAAA;AAET,EAAA,IAAI,CAACA,GAAG,EAAE,OAAO,IAAI,CAAA;AACrB,EAAA,OAAOC,OAAO,CAAA;AAChB;;;;"}

package/build/esm/src/shared/useKeyboard.js

@@ -0,0 +1,42 @@
+import { useEffect } from 'react';
+import { useDocument } from './useDocument.js';
+
+/**
+ * useKeyboard handles activation of keyboard hotkeys on a given element.
+ * @param {Record<string, (e: KeyboardEvent) => {}} config - A map of keyboardEvent code to function.
+ * @param {RefObject} ref - The element which the keyboard config has to apply on.
+ * @param {boolean} isActive - A flag to determine when the keyboard config has to be applied.
+ *
+ * Example:
+ * useKeyboard({
+ *  Escape: closeMenu,
+ *  ArrowUp: () => { doSomething() },
+ *  KeyB: () => { console.log("bagi") },
+ * }, menuRef, menuOpen)
+ *
+ * This mean that these keyboard shortcuts will be applied on menuRef when the menu is opened.
+ */
+
+function useKeyboard(config, ref, isActive) {
+  const document = useDocument();
+  const handleKeyboard = event => {
+    if (!isActive) return;
+    if (document.activeElement !== ref.current && !ref.current.contains(document.activeElement)) return;
+    const targetConfigKey = Object.keys(config).find(targetKeys => targetKeys.split(" ").includes(event.code));
+    if (!targetConfigKey) return;
+    event.preventDefault();
+    const res = config[targetConfigKey](event);
+    if (res === false) {
+      event.stopPropagation();
+    }
+  };
+  useEffect(() => {
+    document.addEventListener("keydown", handleKeyboard);
+    return () => {
+      document.removeEventListener("keydown", handleKeyboard);
+    };
+  });
+}
+
+export { useKeyboard };
+//# sourceMappingURL=useKeyboard.js.map

package/build/esm/src/shared/useKeyboard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useKeyboard.js","sources":["../../../../src/shared/useKeyboard.ts"],"sourcesContent":["import { useEffect, RefObject } from \"react\";\nimport { useDocument } from \"./useDocument\";\n\n/**\n * useKeyboard handles activation of keyboard hotkeys on a given element.\n * @param {Record<string, (e: KeyboardEvent) => {}} config - A map of keyboardEvent code to function.\n * @param {RefObject} ref - The element which the keyboard config has to apply on.\n * @param {boolean} isActive - A flag to determine when the keyboard config has to be applied.\n *\n * Example:\n * useKeyboard({\n *  Escape: closeMenu,\n *  ArrowUp: () => { doSomething() },\n *  KeyB: () => { console.log(\"bagi\") },\n * }, menuRef, menuOpen)\n *\n * This mean that these keyboard shortcuts will be applied on menuRef when the menu is opened.\n */\n\nexport function useKeyboard(\n  config: Record<string, (e: KeyboardEvent) => void | boolean>,\n  ref: RefObject<any>,\n  isActive: boolean\n): void {\n  const document = useDocument();\n  const handleKeyboard = (event: KeyboardEvent) => {\n    if (!isActive) return;\n\n    if (\n      document.activeElement !== ref.current &&\n      !ref.current.contains(document.activeElement)\n    )\n      return;\n\n    const targetConfigKey = Object.keys(config).find((targetKeys: string) =>\n      targetKeys.split(\" \").includes(event.code)\n    );\n    if (!targetConfigKey) return;\n\n    event.preventDefault();\n    const res = config[targetConfigKey](event);\n    if (res === false) {\n      event.stopPropagation();\n    }\n  };\n\n  useEffect(() => {\n    document.addEventListener(\"keydown\", handleKeyboard);\n\n    return () => {\n      document.removeEventListener(\"keydown\", handleKeyboard);\n    };\n  });\n}\n"],"names":["useKeyboard","config","ref","isActive","document","useDocument","handleKeyboard","event","activeElement","current","contains","targetConfigKey","Object","keys","find","targetKeys","split","includes","code","preventDefault","res","stopPropagation","useEffect","addEventListener","removeEventListener"],"mappings":";;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEO,SAASA,WAAWA,CACzBC,MAA4D,EAC5DC,GAAmB,EACnBC,QAAiB,EACX;EACN,MAAMC,QAAQ,GAAGC,WAAW,EAAE,CAAA;EAC9B,MAAMC,cAAc,GAAIC,KAAoB,IAAK;IAC/C,IAAI,CAACJ,QAAQ,EAAE,OAAA;AAEf,IAAA,IACEC,QAAQ,CAACI,aAAa,KAAKN,GAAG,CAACO,OAAO,IACtC,CAACP,GAAG,CAACO,OAAO,CAACC,QAAQ,CAACN,QAAQ,CAACI,aAAa,CAAC,EAE7C,OAAA;IAEF,MAAMG,eAAe,GAAGC,MAAM,CAACC,IAAI,CAACZ,MAAM,CAAC,CAACa,IAAI,CAAEC,UAAkB,IAClEA,UAAU,CAACC,KAAK,CAAC,GAAG,CAAC,CAACC,QAAQ,CAACV,KAAK,CAACW,IAAI,CAAC,CAC3C,CAAA;IACD,IAAI,CAACP,eAAe,EAAE,OAAA;IAEtBJ,KAAK,CAACY,cAAc,EAAE,CAAA;IACtB,MAAMC,GAAG,GAAGnB,MAAM,CAACU,eAAe,CAAC,CAACJ,KAAK,CAAC,CAAA;IAC1C,IAAIa,GAAG,KAAK,KAAK,EAAE;MACjBb,KAAK,CAACc,eAAe,EAAE,CAAA;AACzB,KAAA;GACD,CAAA;AAEDC,EAAAA,SAAS,CAAC,MAAM;AACdlB,IAAAA,QAAQ,CAACmB,gBAAgB,CAAC,SAAS,EAAEjB,cAAc,CAAC,CAAA;AAEpD,IAAA,OAAO,MAAM;AACXF,MAAAA,QAAQ,CAACoB,mBAAmB,CAAC,SAAS,EAAElB,cAAc,CAAC,CAAA;KACxD,CAAA;AACH,GAAC,CAAC,CAAA;AACJ;;;;"}

package/build/esm/src/shared/useOnEscapePress.js

@@ -0,0 +1,51 @@
+import { useCallback, useMemo, useEffect } from 'react';
+import { useDocument } from './useDocument.js';
+
+const registry = {};
+const handleEscape = event => {
+  if (!event.defaultPrevented) {
+    const handlers = Object.values(registry).reverse();
+    for (let i = 0; i < handlers.length; i += 1) {
+      const handler = handlers[i];
+      handler(event);
+      if (event.defaultPrevented) break;
+    }
+  }
+};
+const register = (id, handler) => {
+  registry[id] = handler;
+};
+const deregister = id => {
+  delete registry[id];
+};
+
+// For auto-incrementing unique identifiers for registered different handlers.
+let handlerId = 0;
+const useOnEscapePress = function (onEscape) {
+  let callbackDependencies = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [onEscape];
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  const escapeCallback = useCallback(onEscape, callbackDependencies);
+  const document = useDocument();
+  const handler = useCallback(event => {
+    if (event.key === "Escape") escapeCallback(event);
+  }, [escapeCallback]);
+  const id = useMemo(() => {
+    handlerId += 1;
+    return handlerId;
+  }, []);
+  useEffect(() => {
+    if (Object.keys(registry).length === 0) {
+      document.addEventListener("keydown", handleEscape);
+    }
+    register(id, handler);
+    return () => {
+      deregister(id);
+      if (Object.keys(registry).length === 0) {
+        document.removeEventListener("keydown", handleEscape);
+      }
+    };
+  }, [id, handler, document]);
+};
+
+export { useOnEscapePress };
+//# sourceMappingURL=useOnEscapePress.js.map

package/build/esm/src/shared/useOnEscapePress.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOnEscapePress.js","sources":["../../../../src/shared/useOnEscapePress.ts"],"sourcesContent":["import { useEffect, useCallback, useMemo } from \"react\";\nimport { useDocument } from \"./useDocument\";\n\ntype KeyboardEventCallback = (event: KeyboardEvent) => void;\n\nconst registry: { [id: number]: KeyboardEventCallback } = {};\n\nconst handleEscape = (event: KeyboardEvent) => {\n  if (!event.defaultPrevented) {\n    const handlers = Object.values(registry).reverse();\n\n    for (let i = 0; i < handlers.length; i += 1) {\n      const handler = handlers[i];\n\n      handler(event);\n\n      if (event.defaultPrevented) break;\n    }\n  }\n};\n\nconst register = (id: number, handler: KeyboardEventCallback): void => {\n  registry[id] = handler;\n};\n\nconst deregister = (id: number) => {\n  delete registry[id];\n};\n\n// For auto-incrementing unique identifiers for registered different handlers.\nlet handlerId = 0;\n\nexport const useOnEscapePress = (\n  onEscape: (e: KeyboardEvent) => void,\n  callbackDependencies: React.DependencyList = [onEscape]\n): void => {\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  const escapeCallback = useCallback(onEscape, callbackDependencies);\n  const document = useDocument();\n\n  const handler = useCallback<KeyboardEventCallback>(\n    (event) => {\n      if (event.key === \"Escape\") escapeCallback(event);\n    },\n    [escapeCallback]\n  );\n\n  const id = useMemo(() => {\n    handlerId += 1;\n    return handlerId;\n  }, []);\n\n  useEffect(() => {\n    if (Object.keys(registry).length === 0) {\n      document.addEventListener(\"keydown\", handleEscape);\n    }\n    register(id, handler);\n\n    return () => {\n      deregister(id);\n      if (Object.keys(registry).length === 0) {\n        document.removeEventListener(\"keydown\", handleEscape);\n      }\n    };\n  }, [id, handler, document]);\n};\n"],"names":["registry","handleEscape","event","defaultPrevented","handlers","Object","values","reverse","i","length","handler","register","id","deregister","handlerId","useOnEscapePress","onEscape","callbackDependencies","arguments","undefined","escapeCallback","useCallback","document","useDocument","key","useMemo","useEffect","keys","addEventListener","removeEventListener"],"mappings":";;;AAKA,MAAMA,QAAiD,GAAG,EAAE,CAAA;AAE5D,MAAMC,YAAY,GAAIC,KAAoB,IAAK;AAC7C,EAAA,IAAI,CAACA,KAAK,CAACC,gBAAgB,EAAE;IAC3B,MAAMC,QAAQ,GAAGC,MAAM,CAACC,MAAM,CAACN,QAAQ,CAAC,CAACO,OAAO,EAAE,CAAA;AAElD,IAAA,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGJ,QAAQ,CAACK,MAAM,EAAED,CAAC,IAAI,CAAC,EAAE;AAC3C,MAAA,MAAME,OAAO,GAAGN,QAAQ,CAACI,CAAC,CAAC,CAAA;MAE3BE,OAAO,CAACR,KAAK,CAAC,CAAA;MAEd,IAAIA,KAAK,CAACC,gBAAgB,EAAE,MAAA;AAC9B,KAAA;AACF,GAAA;AACF,CAAC,CAAA;AAED,MAAMQ,QAAQ,GAAGA,CAACC,EAAU,EAAEF,OAA8B,KAAW;AACrEV,EAAAA,QAAQ,CAACY,EAAE,CAAC,GAAGF,OAAO,CAAA;AACxB,CAAC,CAAA;AAED,MAAMG,UAAU,GAAID,EAAU,IAAK;EACjC,OAAOZ,QAAQ,CAACY,EAAE,CAAC,CAAA;AACrB,CAAC,CAAA;;AAED;AACA,IAAIE,SAAS,GAAG,CAAC,CAAA;MAEJC,gBAAgB,GAAG,UAC9BC,QAAoC,EAE3B;AAAA,EAAA,IADTC,oBAA0C,GAAAC,SAAA,CAAAT,MAAA,GAAAS,CAAAA,IAAAA,SAAA,CAAAC,CAAAA,CAAAA,KAAAA,SAAA,GAAAD,SAAA,CAAG,CAAA,CAAA,GAAA,CAACF,QAAQ,CAAC,CAAA;AAEvD;AACA,EAAA,MAAMI,cAAc,GAAGC,WAAW,CAACL,QAAQ,EAAEC,oBAAoB,CAAC,CAAA;EAClE,MAAMK,QAAQ,GAAGC,WAAW,EAAE,CAAA;AAE9B,EAAA,MAAMb,OAAO,GAAGW,WAAW,CACxBnB,KAAK,IAAK;IACT,IAAIA,KAAK,CAACsB,GAAG,KAAK,QAAQ,EAAEJ,cAAc,CAAClB,KAAK,CAAC,CAAA;AACnD,GAAC,EACD,CAACkB,cAAc,CAAC,CACjB,CAAA;AAED,EAAA,MAAMR,EAAE,GAAGa,OAAO,CAAC,MAAM;AACvBX,IAAAA,SAAS,IAAI,CAAC,CAAA;AACd,IAAA,OAAOA,SAAS,CAAA;GACjB,EAAE,EAAE,CAAC,CAAA;AAENY,EAAAA,SAAS,CAAC,MAAM;IACd,IAAIrB,MAAM,CAACsB,IAAI,CAAC3B,QAAQ,CAAC,CAACS,MAAM,KAAK,CAAC,EAAE;AACtCa,MAAAA,QAAQ,CAACM,gBAAgB,CAAC,SAAS,EAAE3B,YAAY,CAAC,CAAA;AACpD,KAAA;AACAU,IAAAA,QAAQ,CAACC,EAAE,EAAEF,OAAO,CAAC,CAAA;AAErB,IAAA,OAAO,MAAM;MACXG,UAAU,CAACD,EAAE,CAAC,CAAA;MACd,IAAIP,MAAM,CAACsB,IAAI,CAAC3B,QAAQ,CAAC,CAACS,MAAM,KAAK,CAAC,EAAE;AACtCa,QAAAA,QAAQ,CAACO,mBAAmB,CAAC,SAAS,EAAE5B,YAAY,CAAC,CAAA;AACvD,OAAA;KACD,CAAA;GACF,EAAE,CAACW,EAAE,EAAEF,OAAO,EAAEY,QAAQ,CAAC,CAAC,CAAA;AAC7B;;;;"}

package/build/esm/src/shared/useOutsideClick.js

@@ -0,0 +1,32 @@
+import { useCallback, useEffect } from 'react';
+import { useWindow } from './useWindow.js';
+
+/**
+ * useOutsideClick handles outside click of a given element.
+ * @param {RefObject} ref - Reference to a DOM element.
+ * @param {e: Event) => void} handler - Function invoked when a click is triggered outside the referenced element.
+ * @param {boolean} isActive - A flag to determine when the outside click event needs to be applied.
+ *
+ * Example: useOutsideClick(menuRef, closeMenu, menuIsOpen)
+ * Means that when a menu is opened, clicking outside of the menu will close the mneu.
+ */
+
+const useOutsideClick = (ref, handler, isActive) => {
+  const window = useWindow();
+  const outsideClickEvent = useCallback(e => {
+    if (ref && ref.current && !ref.current.contains(e.target)) {
+      handler(e);
+    }
+  }, [handler, ref]);
+  useEffect(() => {
+    if (isActive) {
+      window.addEventListener("click", outsideClickEvent);
+    }
+    return () => {
+      window.removeEventListener("click", outsideClickEvent);
+    };
+  }, [isActive, window, outsideClickEvent]);
+};
+
+export { useOutsideClick };
+//# sourceMappingURL=useOutsideClick.js.map