@kaizen/components 1.28.0 → 1.29.0

package/dist/esm/Menu/subcomponents/MenuList/MenuList.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuList.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/esm/Menu/subcomponents/StatelessMenu/StatelessMenu.mjs

@@ -0,0 +1,71 @@
+import React, { useState, useRef, useEffect } from 'react';
+import ReactDOM from 'react-dom';
+import { MenuDropdown } from '../MenuDropdown/MenuDropdown.mjs';
+import styles from './StatelessMenu.module.scss.mjs';
+const StatelessMenu = /*#__PURE__*/function () {
+  const StatelessMenu = function (_a) {
+    var _b = _a.align,
+      align = _b === void 0 ? "left" : _b,
+      _c = _a.dropdownWidth,
+      dropdownWidth = _c === void 0 ? "default" : _c,
+      _d = _a.autoHide,
+      autoHide = _d === void 0 ? "on" : _d,
+      dataTestId = _a["data-testid"],
+      dropdownId = _a.dropdownId,
+      children = _a.children,
+      portalSelector = _a.portalSelector,
+      isMenuVisible = _a.isMenuVisible,
+      toggleMenuDropdown = _a.toggleMenuDropdown,
+      hideMenuDropdown = _a.hideMenuDropdown,
+      renderButton = _a.renderButton,
+      onClick = _a.onClick;
+    var _e = useState(null),
+      referenceElement = _e[0],
+      setReferenceElement = _e[1];
+    var portalSelectorElementRef = useRef(null);
+    var menuButton = renderButton({
+      onClick: function (e) {
+        e.preventDefault();
+        e.stopPropagation();
+        toggleMenuDropdown();
+      },
+      onMouseDown: function (e) {
+        return e.preventDefault();
+      },
+      "aria-haspopup": true,
+      "aria-expanded": isMenuVisible
+    });
+    useEffect(function () {
+      portalSelectorElementRef.current = portalSelector ? document.querySelector(portalSelector) : null;
+    }, [portalSelector]);
+    useEffect(function () {
+      if (portalSelector && !portalSelectorElementRef.current) {
+        // eslint-disable-next-line no-console
+        console.warn("The portal could not be created using the selector: " + portalSelector);
+      }
+    }, [portalSelectorElementRef, portalSelector]);
+    var menu = isMenuVisible ? /*#__PURE__*/React.createElement(MenuDropdown, {
+      referenceElement: referenceElement,
+      align: align,
+      hideMenuDropdown: hideMenuDropdown,
+      width: dropdownWidth,
+      id: dropdownId,
+      autoHide: autoHide
+    }, children) : null;
+    return (
+      /*#__PURE__*/
+      // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
+      React.createElement("div", {
+        "data-testid": dataTestId,
+        onClick: onClick
+      }, /*#__PURE__*/React.createElement("div", {
+        className: styles.buttonWrapper,
+        ref: setReferenceElement
+      }, menuButton), portalSelector && portalSelectorElementRef.current ? /*#__PURE__*/ReactDOM.createPortal(menu, portalSelectorElementRef.current) : menu)
+    );
+  };
+  StatelessMenu.displayName = "StatelessMenu";
+  return StatelessMenu;
+}();
+export { StatelessMenu };
+//# sourceMappingURL=StatelessMenu.mjs.map

package/dist/esm/Menu/subcomponents/StatelessMenu/StatelessMenu.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatelessMenu.mjs","sources":["../../../../../src/Menu/subcomponents/StatelessMenu/StatelessMenu.tsx"],"sourcesContent":["import React, { useEffect, useState, SyntheticEvent, useRef } from \"react\"\nimport ReactDOM from \"react-dom\"\nimport { MenuDropdown } from \"../MenuDropdown\"\nimport styles from \"./StatelessMenu.module.scss\"\n\nexport type StatelessMenuProps = {\n  /**\n   * Whether the menu is to be used on the left or right\n   * side of the viewport. If left, the left of the dropdown\n   * is aligned to the left of the button (and vice versa)\n   * @default \"left\"\n   */\n  align?: \"left\" | \"right\"\n\n  /**\n   * The width of the dropdown.\n   * \"default\": a fixed width of 248px\n   * \"contain\": contain the children's width (will be same width as children)\n   * @default \"default\"\n   */\n  dropdownWidth?: \"default\" | \"contain\"\n  /**\n   * @deprecated use data-testid instead\n   */\n  automationId?: string\n  \"data-testid\"?: string\n  dropdownId?: string\n  /**\n   * Determines when the menu should automatically hide.\n   * @default: \"on\"\n   */\n  autoHide?: \"on\" | \"outside-click-only\" | \"off\"\n  /**\n   * The content to appear inside the dropdown when it is open\n   */\n  children: React.ReactNode\n  /**\n   * Render the tooltip inside a react portal, given the CSS selector.\n   * This is typically used for instances where the menu is a descendant of an\n   * `overflow: scroll` or `overflow: hidden` element.\n   */\n  portalSelector?: string\n  isMenuVisible: boolean\n  toggleMenuDropdown: () => void\n  hideMenuDropdown: () => void\n  renderButton: (args: {\n    onClick: (e: any) => void\n    onMouseDown: (e: any) => void\n    \"aria-haspopup\": boolean\n    \"aria-expanded\": boolean\n  }) => React.ReactElement\n  onClick?: (event: SyntheticEvent) => void\n}\n\nexport const StatelessMenu = ({\n  align = \"left\",\n  dropdownWidth = \"default\",\n  autoHide = \"on\",\n  \"data-testid\": dataTestId,\n  dropdownId,\n  children,\n  portalSelector,\n  isMenuVisible,\n  toggleMenuDropdown,\n  hideMenuDropdown,\n  renderButton,\n  onClick,\n}: StatelessMenuProps): JSX.Element => {\n  const [referenceElement, setReferenceElement] =\n    useState<HTMLSpanElement | null>(null)\n  const portalSelectorElementRef = useRef<Element | null>(null)\n\n  const menuButton = renderButton({\n    onClick: (e: React.MouseEvent<Element, MouseEvent>) => {\n      e.preventDefault()\n      e.stopPropagation()\n      toggleMenuDropdown()\n    },\n    onMouseDown: (e: React.MouseEvent<Element, MouseEvent>) =>\n      e.preventDefault(),\n    \"aria-haspopup\": true,\n    \"aria-expanded\": isMenuVisible,\n  })\n\n  useEffect(() => {\n    portalSelectorElementRef.current = portalSelector\n      ? document.querySelector(portalSelector)\n      : null\n  }, [portalSelector])\n\n  useEffect(() => {\n    if (portalSelector && !portalSelectorElementRef.current) {\n      // eslint-disable-next-line no-console\n      console.warn(\n        \"The portal could not be created using the selector: \" + portalSelector\n      )\n    }\n  }, [portalSelectorElementRef, portalSelector])\n\n  const menu = isMenuVisible ? (\n    <MenuDropdown\n      referenceElement={referenceElement}\n      align={align}\n      hideMenuDropdown={hideMenuDropdown}\n      width={dropdownWidth}\n      id={dropdownId}\n      autoHide={autoHide}\n    >\n      {children}\n    </MenuDropdown>\n  ) : null\n\n  return (\n    // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions\n    <div data-testid={dataTestId} onClick={onClick}>\n      <div className={styles.buttonWrapper} ref={setReferenceElement}>\n        {menuButton}\n      </div>\n      {portalSelector && portalSelectorElementRef.current\n        ? ReactDOM.createPortal(menu, portalSelectorElementRef.current)\n        : menu}\n    </div>\n  )\n}\n\nStatelessMenu.displayName = \"StatelessMenu\"\n"],"names":["StatelessMenu","_a","_b","align","_c","dropdownWidth","_d","autoHide","dataTestId","dropdownId","children","portalSelector","isMenuVisible","toggleMenuDropdown","hideMenuDropdown","renderButton","onClick","_e","useState","referenceElement","setReferenceElement","portalSelectorElementRef","useRef","menuButton","e","preventDefault","stopPropagation","onMouseDown","useEffect","current","document","querySelector","console","warn","menu","React","createElement","MenuDropdown","width","id","className","styles","buttonWrapper","ref","ReactDOM","createPortal","displayName"],"mappings":"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"}

package/dist/esm/Menu/subcomponents/StatelessMenu/StatelessMenu.module.scss.mjs

@@ -0,0 +1,5 @@
+var styles = {
+  "buttonWrapper": "StatelessMenu-module_buttonWrapper__9LgSC"
+};
+export { styles as default };
+//# sourceMappingURL=StatelessMenu.module.scss.mjs.map

package/dist/esm/Menu/subcomponents/StatelessMenu/StatelessMenu.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatelessMenu.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/esm/Modal/GenericModal/subcomponents/ModalFooter/ModalFooter.mjs

@@ -3,8 +3,6 @@ import React from 'react';
 import classnames from 'classnames';
 import { Button } from '../../../../Button/Button/Button.mjs';
 import '../../../../Button/IconButton/IconButton.mjs';
-import '../../../../Button/PaginationLink/PaginationLink.mjs';
-import '../../../../Button/DirectionalLink/DirectionalLink.mjs';
 import { useMediaQueries } from '../../../../utils/useMediaQueries.mjs';
 import { ModalBody } from '../ModalBody/ModalBody.mjs';
 import styles from './ModalFooter.module.scss.mjs';

package/dist/esm/Modal/GenericModal/subcomponents/ModalFooter/ModalFooter.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ModalFooter.mjs","sources":["../../../../../../src/Modal/GenericModal/subcomponents/ModalFooter/ModalFooter.tsx"],"sourcesContent":["import React, { HTMLAttributes } from \"react\"\nimport classnames from \"classnames\"\nimport { Button, ButtonProps } from \"~components/Button\"\nimport { useMediaQueries } from \"~utils/useMediaQueries\"\nimport { ModalBody } from \"../ModalBody/ModalBody\"\nimport styles from \"./ModalFooter.module.scss\"\n\ntype ActionsVariantProps = \"context\" | \"inputEdit\"\n\nexport type ModalFooterProps = {\n  /**\n   * We have a special case for the InformationModal when it has an image.\n   * Since this modal may have an image on the right side the actions might look disconected from the content.\n   * So for this instance we need to flip the order of the actions so that the primary\n   * action is anchored to the left edge of the modal.\n   * For this rare instance added the variant prop as optional to update the order of action buttons.\n   */\n  variant?: ActionsVariantProps\n  unpadded?: boolean\n  actions: ButtonProps[]\n  appearance?: \"primary\" | \"destructive\"\n  /**\n   * @deprecated Please use data-testid\n   */\n  automationId?: string\n  alignStart?: boolean\n} & HTMLAttributes<HTMLDivElement>\n\nexport const ModalFooter = ({\n  unpadded,\n  actions,\n  appearance = \"primary\",\n  alignStart,\n  variant,\n  ...props\n}: ModalFooterProps): JSX.Element => {\n  const { queries } = useMediaQueries()\n\n  return (\n    <ModalBody inputEdit={variant === \"inputEdit\"}>\n      <div\n        className={classnames(\n          styles.actions,\n          !unpadded && styles.padded,\n          variant === \"context\" && styles.informationPadded,\n          alignStart && styles.actionsAlignStart\n        )}\n        {...props}\n      >\n        {actions.map((action, index) => (\n          <div className={styles.actionButton} key={index}>\n            <Button\n              type=\"button\"\n              primary={index === 0 && appearance === \"primary\"}\n              destructive={index === 0 && appearance === \"destructive\"}\n              secondary={index > 0}\n              fullWidth={queries.isSmall}\n              {...action}\n            />\n          </div>\n        ))}\n      </div>\n    </ModalBody>\n  )\n}\n\nModalFooter.displayName = \"ModalFooter\"\n"],"names":["ModalFooter","_a","unpadded","actions","_b","appearance","alignStart","variant","props","__rest","queries","useMediaQueries","React","ModalBody","inputEdit","createElement","__assign","className","classnames","styles","padded","informationPadded","actionsAlignStart","map","action","index","actionButton","key","Button","type","primary","destructive","secondary","fullWidth","isSmall","displayName"],"mappings":";;;;;;;;;;MA4BaA,WAAW;EAAA,MAAXA,WAAW,GAAG,SAAAA,CAACC,EAOT,EAAA;IANjB,IAAAC,QAAQ,cAAA;MACRC,OAAO,aAAA;MACPC,EAAA,GAAAH,EAAA,CAAAI,UAAsB;MAAtBA,UAAU,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,SAAS,KAAA;MACtBE,UAAU,gBAAA;MACVC,OAAO,aAAA;MACJC,KAAK,GANkBC,MAAA,CAAAR,EAAA,EAAA,CAAA,UAAA,EAAA,SAAA,EAAA,YAAA,EAAA,YAAA,EAAA,SAAA,CAO3B,CADS;IAEA,IAAAS,OAAO,GAAKC,eAAe,CAAE,CAAA,QAAtB;IAEf,oBACEC,oBAACC,SAAS,EAAA;MAACC,SAAS,EAAEP,OAAO,KAAK;IAAW,CAAA,eAC3CK,KACE,CAAAG,aAAA,CAAA,KAAA,EAAAC,QAAA,CAAA;MAAAC,SAAS,EAAEC,UAAU,CACnBC,MAAM,CAAChB,OAAO,EACd,CAACD,QAAQ,IAAIiB,MAAM,CAACC,MAAM,EAC1Bb,OAAO,KAAK,SAAS,IAAIY,MAAM,CAACE,iBAAiB,EACjDf,UAAU,IAAIa,MAAM,CAACG,iBAAiB;IACvC,CACG,EAAAd,KAAK,CAER,EAAAL,OAAO,CAACoB,GAAG,CAAC,UAACC,MAAM,EAAEC,KAAK;MAAK,oBAC9Bb,KAAK,CAAAG,aAAA,CAAA,KAAA,EAAA;QAAAE,SAAS,EAAEE,MAAM,CAACO,YAAY;QAAEC,GAAG,EAAEF;MAAK,CAAA,eAC7Cb,KAAC,CAAAG,aAAA,CAAAa,MAAM;QACLC,IAAI,EAAC,QAAQ;QACbC,OAAO,EAAEL,KAAK,KAAK,CAAC,IAAIpB,UAAU,KAAK,SAAS;QAChD0B,WAAW,EAAEN,KAAK,KAAK,CAAC,IAAIpB,UAAU,KAAK,aAAa;QACxD2B,SAAS,EAAEP,KAAK,GAAG,CAAC;QACpBQ,SAAS,EAAEvB,OAAO,CAACwB;MAAO,GACtBV,MAAM,CAAA,CACV,CACE;IACP,CAAA,CAAC,CACE,CACI;EAEhB,CAAC;EAEDxB,WAAW,CAACmC,WAAW,GAAG,aAAa;EAAA,OAtC1BnC,WAAW;AAAA;"}
+{"version":3,"file":"ModalFooter.mjs","sources":["../../../../../../src/Modal/GenericModal/subcomponents/ModalFooter/ModalFooter.tsx"],"sourcesContent":["import React, { HTMLAttributes } from \"react\"\nimport classnames from \"classnames\"\nimport { Button, ButtonProps } from \"~components/Button\"\nimport { useMediaQueries } from \"~utils/useMediaQueries\"\nimport { ModalBody } from \"../ModalBody/ModalBody\"\nimport styles from \"./ModalFooter.module.scss\"\n\ntype ActionsVariantProps = \"context\" | \"inputEdit\"\n\nexport type ModalFooterProps = {\n  /**\n   * We have a special case for the InformationModal when it has an image.\n   * Since this modal may have an image on the right side the actions might look disconected from the content.\n   * So for this instance we need to flip the order of the actions so that the primary\n   * action is anchored to the left edge of the modal.\n   * For this rare instance added the variant prop as optional to update the order of action buttons.\n   */\n  variant?: ActionsVariantProps\n  unpadded?: boolean\n  actions: ButtonProps[]\n  appearance?: \"primary\" | \"destructive\"\n  /**\n   * @deprecated Please use data-testid\n   */\n  automationId?: string\n  alignStart?: boolean\n} & HTMLAttributes<HTMLDivElement>\n\nexport const ModalFooter = ({\n  unpadded,\n  actions,\n  appearance = \"primary\",\n  alignStart,\n  variant,\n  ...props\n}: ModalFooterProps): JSX.Element => {\n  const { queries } = useMediaQueries()\n\n  return (\n    <ModalBody inputEdit={variant === \"inputEdit\"}>\n      <div\n        className={classnames(\n          styles.actions,\n          !unpadded && styles.padded,\n          variant === \"context\" && styles.informationPadded,\n          alignStart && styles.actionsAlignStart\n        )}\n        {...props}\n      >\n        {actions.map((action, index) => (\n          <div className={styles.actionButton} key={index}>\n            <Button\n              type=\"button\"\n              primary={index === 0 && appearance === \"primary\"}\n              destructive={index === 0 && appearance === \"destructive\"}\n              secondary={index > 0}\n              fullWidth={queries.isSmall}\n              {...action}\n            />\n          </div>\n        ))}\n      </div>\n    </ModalBody>\n  )\n}\n\nModalFooter.displayName = \"ModalFooter\"\n"],"names":["ModalFooter","_a","unpadded","actions","_b","appearance","alignStart","variant","props","__rest","queries","useMediaQueries","React","ModalBody","inputEdit","createElement","__assign","className","classnames","styles","padded","informationPadded","actionsAlignStart","map","action","index","actionButton","key","Button","type","primary","destructive","secondary","fullWidth","isSmall","displayName"],"mappings":";;;;;;;;MA4BaA,WAAW;EAAA,MAAXA,WAAW,GAAG,SAAAA,CAACC,EAOT,EAAA;IANjB,IAAAC,QAAQ,cAAA;MACRC,OAAO,aAAA;MACPC,EAAA,GAAAH,EAAA,CAAAI,UAAsB;MAAtBA,UAAU,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,SAAS,KAAA;MACtBE,UAAU,gBAAA;MACVC,OAAO,aAAA;MACJC,KAAK,GANkBC,MAAA,CAAAR,EAAA,EAAA,CAAA,UAAA,EAAA,SAAA,EAAA,YAAA,EAAA,YAAA,EAAA,SAAA,CAO3B,CADS;IAEA,IAAAS,OAAO,GAAKC,eAAe,CAAE,CAAA,QAAtB;IAEf,oBACEC,oBAACC,SAAS,EAAA;MAACC,SAAS,EAAEP,OAAO,KAAK;IAAW,CAAA,eAC3CK,KACE,CAAAG,aAAA,CAAA,KAAA,EAAAC,QAAA,CAAA;MAAAC,SAAS,EAAEC,UAAU,CACnBC,MAAM,CAAChB,OAAO,EACd,CAACD,QAAQ,IAAIiB,MAAM,CAACC,MAAM,EAC1Bb,OAAO,KAAK,SAAS,IAAIY,MAAM,CAACE,iBAAiB,EACjDf,UAAU,IAAIa,MAAM,CAACG,iBAAiB;IACvC,CACG,EAAAd,KAAK,CAER,EAAAL,OAAO,CAACoB,GAAG,CAAC,UAACC,MAAM,EAAEC,KAAK;MAAK,oBAC9Bb,KAAK,CAAAG,aAAA,CAAA,KAAA,EAAA;QAAAE,SAAS,EAAEE,MAAM,CAACO,YAAY;QAAEC,GAAG,EAAEF;MAAK,CAAA,eAC7Cb,KAAC,CAAAG,aAAA,CAAAa,MAAM;QACLC,IAAI,EAAC,QAAQ;QACbC,OAAO,EAAEL,KAAK,KAAK,CAAC,IAAIpB,UAAU,KAAK,SAAS;QAChD0B,WAAW,EAAEN,KAAK,KAAK,CAAC,IAAIpB,UAAU,KAAK,aAAa;QACxD2B,SAAS,EAAEP,KAAK,GAAG,CAAC;QACpBQ,SAAS,EAAEvB,OAAO,CAACwB;MAAO,GACtBV,MAAM,CAAA,CACV,CACE;IACP,CAAA,CAAC,CACE,CACI;EAEhB,CAAC;EAEDxB,WAAW,CAACmC,WAAW,GAAG,aAAa;EAAA,OAtC1BnC,WAAW;AAAA;"}

package/dist/esm/Modal/GenericModal/subcomponents/ModalHeader/ModalHeader.mjs

@@ -1,8 +1,6 @@
 import React from 'react';
 import '../../../../Button/Button/Button.mjs';
 import { IconButton } from '../../../../Button/IconButton/IconButton.mjs';
-import '../../../../Button/PaginationLink/PaginationLink.mjs';
-import '../../../../Button/DirectionalLink/DirectionalLink.mjs';
 import 'tslib';
 import 'uuid';
 import '../../../../Icon/subcomponents/SVG/SVG.mjs';

package/dist/esm/Modal/GenericModal/subcomponents/ModalHeader/ModalHeader.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ModalHeader.mjs","sources":["../../../../../../src/Modal/GenericModal/subcomponents/ModalHeader/ModalHeader.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconButton } from \"~components/Button\"\nimport { CloseIcon } from \"~components/Icon\"\nimport { ModalBody } from \"../ModalBody\"\nimport styles from \"./ModalHeader.module.scss\"\n\nexport type ModalHeaderProps = {\n  unpadded?: boolean\n  reversed?: boolean\n  onDismiss?: (evt: React.MouseEvent) => void\n  children: React.ReactNode\n}\n\nexport const ModalHeader = ({\n  reversed,\n  onDismiss,\n  children,\n}: ModalHeaderProps): JSX.Element => (\n  <ModalBody>\n    <div className={styles.dismissButton}>\n      <IconButton\n        label=\"Dismiss\"\n        icon={<CloseIcon role=\"presentation\" />}\n        reversed={reversed}\n        onClick={onDismiss}\n        disabled={onDismiss == undefined}\n      />\n    </div>\n    {children}\n  </ModalBody>\n)\n\nModalHeader.displayName = \"ModalHeader\"\n"],"names":["ModalHeader","_a","reversed","onDismiss","children","React","ModalBody","createElement","className","styles","dismissButton","IconButton","label","icon","CloseIcon","role","onClick","disabled","undefined","displayName"],"mappings":";;;;;;;;;;;MAaaA,WAAW;EAAA,MAAXA,WAAW,GAAG,SAAAA,CAACC,EAIT,EAAA;IAHjB,IAAAC,QAAQ,cAAA;MACRC,SAAS,GAAAF,EAAA,CAAAE,SAAA;MACTC,QAAQ,GAAAH,EAAA,CAAAG,QAAA;IAC2B,oBACnCC,oBAACC,SAAS,EAAA,IAAA,eACRD,KAAA,CAAAE,aAAA,CAAA,KAAA,EAAA;MAAKC,SAAS,EAAEC,MAAM,CAACC;IAAa,CAAA,eAClCL,KAAA,CAAAE,aAAA,CAACI,UAAU,EAAA;MACTC,KAAK,EAAC,SAAS;MACfC,IAAI,eAAER,KAAC,CAAAE,aAAA,CAAAO,SAAS,EAAC;QAAAC,IAAI,EAAC;MAAc,CAAA,CAAG;MACvCb,QAAQ,EAAEA,QAAQ;MAClBc,OAAO,EAAEb,SAAS;MAClBc,QAAQ,EAAEd,SAAS,IAAIe;IAAS,EAChC,CACE,EACLd,QAAQ,CACC;EAZuB,CAapC;EAEDJ,WAAW,CAACmB,WAAW,GAAG,aAAa;EAAA,OAnB1BnB,WAAW;AAAA;"}
+{"version":3,"file":"ModalHeader.mjs","sources":["../../../../../../src/Modal/GenericModal/subcomponents/ModalHeader/ModalHeader.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconButton } from \"~components/Button\"\nimport { CloseIcon } from \"~components/Icon\"\nimport { ModalBody } from \"../ModalBody\"\nimport styles from \"./ModalHeader.module.scss\"\n\nexport type ModalHeaderProps = {\n  unpadded?: boolean\n  reversed?: boolean\n  onDismiss?: (evt: React.MouseEvent) => void\n  children: React.ReactNode\n}\n\nexport const ModalHeader = ({\n  reversed,\n  onDismiss,\n  children,\n}: ModalHeaderProps): JSX.Element => (\n  <ModalBody>\n    <div className={styles.dismissButton}>\n      <IconButton\n        label=\"Dismiss\"\n        icon={<CloseIcon role=\"presentation\" />}\n        reversed={reversed}\n        onClick={onDismiss}\n        disabled={onDismiss == undefined}\n      />\n    </div>\n    {children}\n  </ModalBody>\n)\n\nModalHeader.displayName = \"ModalHeader\"\n"],"names":["ModalHeader","_a","reversed","onDismiss","children","React","ModalBody","createElement","className","styles","dismissButton","IconButton","label","icon","CloseIcon","role","onClick","disabled","undefined","displayName"],"mappings":";;;;;;;;;MAaaA,WAAW;EAAA,MAAXA,WAAW,GAAG,SAAAA,CAACC,EAIT,EAAA;IAHjB,IAAAC,QAAQ,cAAA;MACRC,SAAS,GAAAF,EAAA,CAAAE,SAAA;MACTC,QAAQ,GAAAH,EAAA,CAAAG,QAAA;IAC2B,oBACnCC,oBAACC,SAAS,EAAA,IAAA,eACRD,KAAA,CAAAE,aAAA,CAAA,KAAA,EAAA;MAAKC,SAAS,EAAEC,MAAM,CAACC;IAAa,CAAA,eAClCL,KAAA,CAAAE,aAAA,CAACI,UAAU,EAAA;MACTC,KAAK,EAAC,SAAS;MACfC,IAAI,eAAER,KAAC,CAAAE,aAAA,CAAAO,SAAS,EAAC;QAAAC,IAAI,EAAC;MAAc,CAAA,CAAG;MACvCb,QAAQ,EAAEA,QAAQ;MAClBc,OAAO,EAAEb,SAAS;MAClBc,QAAQ,EAAEd,SAAS,IAAIe;IAAS,EAChC,CACE,EACLd,QAAQ,CACC;EAZuB,CAapC;EAEDJ,WAAW,CAACmB,WAAW,GAAG,aAAa;EAAA,OAnB1BnB,WAAW;AAAA;"}

package/dist/esm/Pagination/Pagination.mjs

@@ -0,0 +1,114 @@
+import { __rest, __assign } from 'tslib';
+import React from 'react';
+import classnames from 'classnames';
+import { DirectionalLink } from './subcomponents/DirectionalLink/DirectionalLink.mjs';
+import { PaginationLink } from './subcomponents/PaginationLink/PaginationLink.mjs';
+import { TruncateIndicator } from './subcomponents/TruncateIndicator/TruncateIndicator.mjs';
+import { createRange } from './utils/createRange.mjs';
+import styles from './Pagination.module.scss.mjs';
+
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082092975/Pagination Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-pagination--docs Storybook}
+ */
+var Pagination = function (_a) {
+  var _b = _a.currentPage,
+    currentPage = _b === void 0 ? 1 : _b,
+    pageCount = _a.pageCount,
+    ariaLabelNextPage = _a.ariaLabelNextPage,
+    ariaLabelPreviousPage = _a.ariaLabelPreviousPage,
+    ariaLabelPage = _a.ariaLabelPage,
+    onPageChange = _a.onPageChange,
+    classNameOverride = _a.classNameOverride,
+    restProps = __rest(_a, ["currentPage", "pageCount", "ariaLabelNextPage", "ariaLabelPreviousPage", "ariaLabelPage", "onPageChange", "classNameOverride"]);
+  // Click event for all pagination buttons (next, prev, and the actual numbers)
+  var handleButtonClick = function (newPage) {
+    if (newPage === "prev") {
+      onPageChange(currentPage - 1);
+      return;
+    }
+    if (newPage === "next") {
+      onPageChange(currentPage + 1);
+      return;
+    }
+    onPageChange(newPage);
+  };
+  var paginationIndicator = function (page) {
+    return /*#__PURE__*/React.createElement(PaginationLink, {
+      key: page,
+      pageNumber: page,
+      isActive: currentPage === page,
+      "aria-label": "".concat(ariaLabelPage, " ").concat(page),
+      onClick: function () {
+        return handleButtonClick(page);
+      }
+    });
+  };
+  var pagination = function () {
+    var items = [];
+    var boundaryPagesRange = 1;
+    var siblingPagesRange = 1;
+    // truncateSize is 1 now but could be 0 if we add the ability to hide it.
+    var truncateSize = 1;
+    var showAllPages = 1 + 2 * truncateSize + 2 * siblingPagesRange + 2 * boundaryPagesRange >= pageCount;
+    // Simplify generation of pages if number of available items is equal or greater than total pages to show
+    if (showAllPages) {
+      return createRange(1, pageCount).map(paginationIndicator);
+    } else {
+      // Calculate group of first pages
+      var firstPagesStart = 1;
+      var firstPagesEnd = boundaryPagesRange;
+      var firstPages = createRange(firstPagesStart, firstPagesEnd).map(paginationIndicator);
+      // Calculate group of last pages
+      var lastPagesStart = pageCount + 1 - boundaryPagesRange;
+      var lastPagesEnd = pageCount;
+      var lastPages = createRange(lastPagesStart, lastPagesEnd).map(paginationIndicator);
+      // Calculate group of main pages
+      var mainPagesStart = Math.min(Math.max(currentPage - siblingPagesRange, firstPagesEnd + truncateSize + 1), lastPagesStart - truncateSize - 2 * siblingPagesRange - 1);
+      var mainPagesEnd = mainPagesStart + 2 * siblingPagesRange;
+      var mainPages = createRange(mainPagesStart, mainPagesEnd).map(paginationIndicator);
+      // Add group of first pages
+      items.push.apply(items, firstPages);
+      // Calculate and add truncate before group of main pages
+      var firstEllipsisPageNumber = mainPagesStart - 1;
+      var showPageInsteadOfFirstEllipsis = firstEllipsisPageNumber === firstPagesEnd + 1;
+      items.push(showPageInsteadOfFirstEllipsis ? paginationIndicator(firstEllipsisPageNumber) : /*#__PURE__*/React.createElement(TruncateIndicator, {
+        key: firstEllipsisPageNumber
+      }));
+      // Add group of main pages
+      items.push.apply(items, mainPages);
+      // Calculate and add truncate after group of main pages
+      var secondEllipsisPageNumber = mainPagesEnd + 1;
+      var showPageInsteadOfSecondEllipsis = secondEllipsisPageNumber === lastPagesStart - 1;
+      items.push(showPageInsteadOfSecondEllipsis ? paginationIndicator(secondEllipsisPageNumber) : /*#__PURE__*/React.createElement(TruncateIndicator, {
+        key: secondEllipsisPageNumber
+      }));
+      // Add group of last pages
+      items.push.apply(items, lastPages);
+    }
+    return items;
+  };
+  var previousPageDisabled = currentPage <= 1;
+  var nextPageDisabled = currentPage >= pageCount;
+  return /*#__PURE__*/React.createElement("nav", __assign({
+    className: classnames(styles.container, classNameOverride)
+  }, restProps), /*#__PURE__*/React.createElement(DirectionalLink, {
+    label: ariaLabelPreviousPage,
+    direction: "prev",
+    disabled: previousPageDisabled,
+    onClick: function () {
+      return handleButtonClick("prev");
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    className: styles.pagesIndicatorWrapper
+  }, pagination()), /*#__PURE__*/React.createElement(DirectionalLink, {
+    label: ariaLabelNextPage,
+    direction: "next",
+    disabled: nextPageDisabled,
+    onClick: function () {
+      return handleButtonClick("next");
+    }
+  }));
+};
+export { Pagination };
+//# sourceMappingURL=Pagination.mjs.map

package/dist/esm/Pagination/Pagination.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.mjs","sources":["../../../src/Pagination/Pagination.tsx"],"sourcesContent":["import React, { HTMLAttributes } from \"react\"\nimport classnames from \"classnames\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport { DirectionalLink } from \"./subcomponents/DirectionalLink\"\nimport { PaginationLink } from \"./subcomponents/PaginationLink\"\nimport { TruncateIndicator } from \"./subcomponents/TruncateIndicator\"\nimport { createRange } from \"./utils/createRange\"\nimport styles from \"./Pagination.module.scss\"\n\nexport type PaginationProps = {\n  currentPage: number\n  pageCount: number\n  ariaLabelNextPage: string\n  ariaLabelPreviousPage: string\n  ariaLabelPage: string\n  onPageChange: (newPage: number) => void\n} & OverrideClassName<HTMLAttributes<HTMLElement>>\n\ntype PageAction = \"prev\" | \"next\"\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082092975/Pagination Guidance} |\n * {@link https://cultureamp.design/?path=/docs/components-pagination--docs Storybook}\n */\nexport const Pagination = ({\n  currentPage = 1,\n  pageCount,\n  ariaLabelNextPage,\n  ariaLabelPreviousPage,\n  ariaLabelPage,\n  onPageChange,\n  classNameOverride,\n  ...restProps\n}: PaginationProps): JSX.Element => {\n  // Click event for all pagination buttons (next, prev, and the actual numbers)\n  const handleButtonClick = (newPage: number | PageAction): void => {\n    if (newPage === \"prev\") {\n      onPageChange(currentPage - 1)\n      return\n    }\n    if (newPage === \"next\") {\n      onPageChange(currentPage + 1)\n      return\n    }\n    onPageChange(newPage)\n  }\n\n  const paginationIndicator = (page: number): JSX.Element => (\n    <PaginationLink\n      key={page}\n      pageNumber={page}\n      isActive={currentPage === page}\n      aria-label={`${ariaLabelPage} ${page}`}\n      onClick={() => handleButtonClick(page)}\n    />\n  )\n\n  const pagination = (): JSX.Element[] => {\n    const items: JSX.Element[] = []\n\n    const boundaryPagesRange = 1\n    const siblingPagesRange = 1\n\n    // truncateSize is 1 now but could be 0 if we add the ability to hide it.\n    const truncateSize = 1\n\n    const showAllPages =\n      1 + 2 * truncateSize + 2 * siblingPagesRange + 2 * boundaryPagesRange >=\n      pageCount\n\n    // Simplify generation of pages if number of available items is equal or greater than total pages to show\n    if (showAllPages) {\n      return createRange(1, pageCount).map(paginationIndicator)\n    } else {\n      // Calculate group of first pages\n      const firstPagesStart = 1\n      const firstPagesEnd = boundaryPagesRange\n      const firstPages = createRange(firstPagesStart, firstPagesEnd).map(\n        paginationIndicator\n      )\n\n      // Calculate group of last pages\n      const lastPagesStart = pageCount + 1 - boundaryPagesRange\n      const lastPagesEnd = pageCount\n      const lastPages = createRange(lastPagesStart, lastPagesEnd).map(\n        paginationIndicator\n      )\n\n      // Calculate group of main pages\n      const mainPagesStart = Math.min(\n        Math.max(\n          currentPage - siblingPagesRange,\n          firstPagesEnd + truncateSize + 1\n        ),\n        lastPagesStart - truncateSize - 2 * siblingPagesRange - 1\n      )\n      const mainPagesEnd = mainPagesStart + 2 * siblingPagesRange\n      const mainPages = createRange(mainPagesStart, mainPagesEnd).map(\n        paginationIndicator\n      )\n\n      // Add group of first pages\n      items.push(...firstPages)\n\n      // Calculate and add truncate before group of main pages\n      const firstEllipsisPageNumber = mainPagesStart - 1\n      const showPageInsteadOfFirstEllipsis =\n        firstEllipsisPageNumber === firstPagesEnd + 1\n      items.push(\n        showPageInsteadOfFirstEllipsis ? (\n          paginationIndicator(firstEllipsisPageNumber)\n        ) : (\n          <TruncateIndicator key={firstEllipsisPageNumber} />\n        )\n      )\n\n      // Add group of main pages\n      items.push(...mainPages)\n\n      // Calculate and add truncate after group of main pages\n      const secondEllipsisPageNumber = mainPagesEnd + 1\n      const showPageInsteadOfSecondEllipsis =\n        secondEllipsisPageNumber === lastPagesStart - 1\n      items.push(\n        showPageInsteadOfSecondEllipsis ? (\n          paginationIndicator(secondEllipsisPageNumber)\n        ) : (\n          <TruncateIndicator key={secondEllipsisPageNumber} />\n        )\n      )\n\n      // Add group of last pages\n      items.push(...lastPages)\n    }\n    return items\n  }\n\n  const previousPageDisabled = currentPage <= 1\n  const nextPageDisabled = currentPage >= pageCount\n\n  return (\n    <nav\n      className={classnames(styles.container, classNameOverride)}\n      {...restProps}\n    >\n      <DirectionalLink\n        label={ariaLabelPreviousPage}\n        direction=\"prev\"\n        disabled={previousPageDisabled}\n        onClick={(): void => handleButtonClick(\"prev\")}\n      />\n\n      <div className={styles.pagesIndicatorWrapper}>{pagination()}</div>\n\n      <DirectionalLink\n        label={ariaLabelNextPage}\n        direction=\"next\"\n        disabled={nextPageDisabled}\n        onClick={(): void => handleButtonClick(\"next\")}\n      />\n    </nav>\n  )\n}\n"],"names":["Pagination","_a","_b","currentPage","pageCount","ariaLabelNextPage","ariaLabelPreviousPage","ariaLabelPage","onPageChange","classNameOverride","restProps","__rest","handleButtonClick","newPage","paginationIndicator","page","React","PaginationLink","key","pageNumber","isActive","concat","onClick","pagination","items","boundaryPagesRange","siblingPagesRange","truncateSize","showAllPages","createRange","map","firstPagesStart","firstPagesEnd","firstPages","lastPagesStart","lastPagesEnd","lastPages","mainPagesStart","Math","min","max","mainPagesEnd","mainPages","push","apply","firstEllipsisPageNumber","showPageInsteadOfFirstEllipsis","createElement","TruncateIndicator","secondEllipsisPageNumber","showPageInsteadOfSecondEllipsis","previousPageDisabled","nextPageDisabled","__assign","className","classnames","styles","container","DirectionalLink","label","direction","disabled","pagesIndicatorWrapper"],"mappings":"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"}

package/dist/esm/Pagination/Pagination.module.scss.mjs

@@ -0,0 +1,9 @@
+var styles = {
+  "container": "Pagination-module_container__JHnDH",
+  "pagesIndicatorWrapper": "Pagination-module_pagesIndicatorWrapper__taluU",
+  "arrowIconWrapper": "Pagination-module_arrowIconWrapper__RMTET",
+  "pageIndicatorFocusRing": "Pagination-module_pageIndicatorFocusRing__57ku4",
+  "truncateIndicatorWrapper": "Pagination-module_truncateIndicatorWrapper__bwywo"
+};
+export { styles as default };
+//# sourceMappingURL=Pagination.module.scss.mjs.map

package/dist/esm/Pagination/Pagination.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/dist/esm/{Button → Pagination/subcomponents}/DirectionalLink/DirectionalLink.mjs

@@ -1,12 +1,12 @@
 import { __assign } from 'tslib';
 import React from 'react';
 import 'uuid';
-import '../../Icon/subcomponents/SVG/SVG.mjs';
-import { ArrowBackwardIcon } from '../../Icon/ArrowBackwardIcon.mjs';
-import { ArrowForwardIcon } from '../../Icon/ArrowForwardIcon.mjs';
-import { EndIcon } from '../../Icon/EndIcon.mjs';
-import { StartIcon } from '../../Icon/StartIcon.mjs';
-import { GenericButton } from '../GenericButton/GenericButton.mjs';
+import '../../../Icon/subcomponents/SVG/SVG.mjs';
+import { ArrowBackwardIcon } from '../../../Icon/ArrowBackwardIcon.mjs';
+import { ArrowForwardIcon } from '../../../Icon/ArrowForwardIcon.mjs';
+import { EndIcon } from '../../../Icon/EndIcon.mjs';
+import { StartIcon } from '../../../Icon/StartIcon.mjs';
+import { GenericButton } from '../../../Button/GenericButton/GenericButton.mjs';
 var iconMap = {
   prev: /*#__PURE__*/React.createElement(ArrowBackwardIcon, {
     role: "presentation"

package/dist/esm/Pagination/subcomponents/DirectionalLink/DirectionalLink.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DirectionalLink.mjs","sources":["../../../../../src/Pagination/subcomponents/DirectionalLink/DirectionalLink.tsx"],"sourcesContent":["import React from \"react\"\nimport {\n  ArrowBackwardIcon,\n  ArrowForwardIcon,\n  EndIcon,\n  StartIcon,\n} from \"~components/Icon\"\nimport { GenericButton, GenericProps } from \"../../../Button/GenericButton\"\n\nexport type DirectionalLinkProps = {\n  label: string\n  disabled?: boolean\n  direction: \"prev\" | \"next\" | \"start\" | \"end\"\n} & GenericProps\n\nconst iconMap = {\n  prev: <ArrowBackwardIcon role=\"presentation\" />,\n  next: <ArrowForwardIcon role=\"presentation\" />,\n  start: <StartIcon role=\"presentation\" />,\n  end: <EndIcon role=\"presentation\" />,\n}\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082092975/Pagination Guidance} |\n * {@link https://cultureamp.design/?path=/story/components-buttons-directionallink--docs Storybook}\n */\nexport const DirectionalLink = (props: DirectionalLinkProps): JSX.Element => (\n  <GenericButton\n    {...props}\n    iconButton\n    directionalLink\n    icon={iconMap[props.direction]}\n  />\n)\n\nDirectionalLink.defaultProps = {\n  reversed: false,\n  disabled: false,\n}\n\nDirectionalLink.displayName = \"DirectionalLink\"\n"],"names":["iconMap","prev","React","createElement","ArrowBackwardIcon","role","next","ArrowForwardIcon","start","StartIcon","end","EndIcon","DirectionalLink","props","GenericButton","__assign","iconButton","directionalLink","icon","direction","defaultProps","reversed","disabled","displayName"],"mappings":";;;;;;;;;AAeA,IAAMA,OAAO,GAAG;EACdC,IAAI,eAAEC,KAAC,CAAAC,aAAA,CAAAC,iBAAiB;IAACC,IAAI,EAAC;GAAiB,CAAA;EAC/CC,IAAI,eAAEJ,KAAC,CAAAC,aAAA,CAAAI,gBAAgB;IAACF,IAAI,EAAC;GAAiB,CAAA;EAC9CG,KAAK,eAAEN,KAAC,CAAAC,aAAA,CAAAM,SAAS;IAACJ,IAAI,EAAC;GAAiB,CAAA;EACxCK,GAAG,eAAER,KAAC,CAAAC,aAAA,CAAAQ,OAAO;IAACN,IAAI,EAAC;GAAiB;CACrC;AAED;;;AAGG;AAHH,MAIaO,eAAe;EAAA,MAAfA,eAAe,GAAG,SAAAA,CAACC,KAA2B,EAAkB;IAAA,oBAC3EX,KAAA,CAAAC,aAAA,CAACW,aAAa,EAAAC,QAAA,CAAA,CAAA,CAAA,EACRF,KAAK,EACT;MAAAG,UAAU,EACV,IAAA;MAAAC,eAAe,EACf,IAAA;MAAAC,IAAI,EAAElB,OAAO,CAACa,KAAK,CAACM,SAAS;KAAC,CAAA,CAC9B;EACH,CAAA;EAEDP,eAAe,CAACQ,YAAY,GAAG;IAC7BC,QAAQ,EAAE,KAAK;IACfC,QAAQ,EAAE;GACX;EAEDV,eAAe,CAACW,WAAW,GAAG,iBAAiB;EAAA,OAdlCX,eAAe;AAAA;"}

package/dist/esm/{Button → Pagination/subcomponents}/PaginationLink/PaginationLink.mjs

@@ -1,6 +1,6 @@
 import { __rest, __assign } from 'tslib';
 import React from 'react';
-import { GenericButton } from '../GenericButton/GenericButton.mjs';
+import { GenericButton } from '../../../Button/GenericButton/GenericButton.mjs';
 
 /**
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082092975/Pagination Guidance} |

package/dist/esm/Pagination/subcomponents/PaginationLink/PaginationLink.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaginationLink.mjs","sources":["../../../../../src/Pagination/subcomponents/PaginationLink/PaginationLink.tsx"],"sourcesContent":["import React from \"react\"\nimport { GenericProps, GenericButton } from \"../../../Button/GenericButton\"\n\nexport type PaginationLinkProps = GenericProps & {\n  pageNumber: number\n  isActive?: boolean\n  /* A description for screen readers to understand because label used here is a number */\n  \"aria-label\": string\n}\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082092975/Pagination Guidance} |\n * {@link https://cultureamp.design/?path=/story/components-buttons-paginationlink--docs Storybook}\n */\nexport const PaginationLink = ({\n  pageNumber,\n  ...restProps\n}: PaginationLinkProps): JSX.Element => (\n  <GenericButton {...restProps} paginationLink label={`${pageNumber}`} />\n)\n\nPaginationLink.defaultProps = {\n  reversed: false,\n  isActive: false,\n}\n\nPaginationLink.displayName = \"PaginationLink\"\n"],"names":["PaginationLink","_a","pageNumber","restProps","__rest","React","createElement","GenericButton","__assign","paginationLink","label","concat","defaultProps","reversed","isActive","displayName"],"mappings":";;;;AAUA;;;AAGG;AAHH,MAIaA,cAAc;EAAA,MAAdA,cAAc,GAAG,SAAAA,CAACC,EAGT,EAAA;IAFpB,IAAAC,UAAU,GAAAD,EAAA,CAAAC,UAAA;MACPC,SAAS,GAAAC,MAAA,CAAAH,EAAA,EAFiB,cAG9B,CADa;IAC0B,oBACtCI,KAAA,CAAAC,aAAA,CAACC,aAAa,EAAAC,QAAA,CAAA,CAAA,CAAA,EAAKL,SAAS,EAAE;MAAAM,cAAc,EAAC,IAAA;MAAAC,KAAK,EAAE,EAAG,CAAAC,MAAA,CAAAT,UAAU;IAAE,CAAA,CAAA,CAAI;GACxE;EAEDF,cAAc,CAACY,YAAY,GAAG;IAC5BC,QAAQ,EAAE,KAAK;IACfC,QAAQ,EAAE;GACX;EAEDd,cAAc,CAACe,WAAW,GAAG,gBAAgB;EAAA,OAZhCf,cAAc;AAAA;"}

package/dist/esm/Pagination/subcomponents/TruncateIndicator/TruncateIndicator.mjs

@@ -0,0 +1,16 @@
+import React from 'react';
+import 'tslib';
+import 'uuid';
+import '../../../Icon/subcomponents/SVG/SVG.mjs';
+import { EllipsisIcon } from '../../../Icon/EllipsisIcon.mjs';
+import styles from './TruncateIndicator.module.scss.mjs';
+var TruncateIndicator = function () {
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles.truncateIndicatorWrapper,
+    "data-testid": "truncate-indicator"
+  }, /*#__PURE__*/React.createElement(EllipsisIcon, {
+    role: "presentation"
+  }));
+};
+export { TruncateIndicator };
+//# sourceMappingURL=TruncateIndicator.mjs.map

package/dist/esm/Pagination/subcomponents/TruncateIndicator/TruncateIndicator.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TruncateIndicator.mjs","sources":["../../../../../src/Pagination/subcomponents/TruncateIndicator/TruncateIndicator.tsx"],"sourcesContent":["import React from \"react\"\nimport { EllipsisIcon } from \"~components/Icon\"\nimport styles from \"./TruncateIndicator.module.scss\"\n\nexport const TruncateIndicator = (): JSX.Element => (\n  <div\n    className={styles.truncateIndicatorWrapper}\n    data-testid=\"truncate-indicator\"\n  >\n    <EllipsisIcon role=\"presentation\" />\n  </div>\n)\n"],"names":["TruncateIndicator","React","createElement","className","styles","truncateIndicatorWrapper","EllipsisIcon","role"],"mappings":";;;;;;AAIO,IAAMA,iBAAiB,GAAG,SAAAA,CAAA;EAAmB,oBAClDC,KACE,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAAC,SAAS,EAAEC,MAAM,CAACC,wBAAwB;mBAC9B;EAAoB,CAAA,eAEhCJ,KAAC,CAAAC,aAAA,CAAAI,YAAY,EAAC;IAAAC,IAAI,EAAC;IAAiB,CAChC;AAN4C,CAAA;"}

package/dist/esm/Pagination/subcomponents/TruncateIndicator/TruncateIndicator.module.scss.mjs

@@ -0,0 +1,5 @@
+var styles = {
+  "truncateIndicatorWrapper": "TruncateIndicator-module_truncateIndicatorWrapper__FgApk"
+};
+export { styles as default };
+//# sourceMappingURL=TruncateIndicator.module.scss.mjs.map

package/dist/esm/Pagination/subcomponents/TruncateIndicator/TruncateIndicator.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TruncateIndicator.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/esm/Pagination/utils/createRange.mjs

@@ -0,0 +1,9 @@
+var createRange = function (start, end) {
+  var range = [];
+  for (var i = start; i <= end; i++) {
+    range.push(i);
+  }
+  return range;
+};
+export { createRange };
+//# sourceMappingURL=createRange.mjs.map

package/dist/esm/Pagination/utils/createRange.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"createRange.mjs","sources":["../../../../src/Pagination/utils/createRange.ts"],"sourcesContent":["export const createRange = (start: number, end: number): number[] => {\n  const range: number[] = []\n\n  for (let i = start; i <= end; i++) {\n    range.push(i)\n  }\n\n  return range\n}\n"],"names":["createRange","start","end","range","i","push"],"mappings":"AAAa,IAAAA,WAAW,GAAG,SAAAA,CAACC,KAAa,EAAEC,GAAW,EAAA;EACpD,IAAMC,KAAK,GAAa,EAAE;EAE1B,KAAK,IAAIC,CAAC,GAAGH,KAAK,EAAEG,CAAC,IAAIF,GAAG,EAAEE,CAAC,EAAE,EAAE;IACjCD,KAAK,CAACE,IAAI,CAACD,CAAC,CAAC;EACd;EAED,OAAOD,KAAK;AACd,CAAA;"}

package/dist/esm/Popover/Popover.mjs

@@ -0,0 +1,155 @@
+import { __rest, __assign } from 'tslib';
+import React, { useState, useMemo } from 'react';
+import classnames from 'classnames';
+import { usePopper } from 'react-popper';
+import { Heading } from '../Heading/Heading.mjs';
+import 'uuid';
+import '../Icon/subcomponents/SVG/SVG.mjs';
+import { CloseIcon } from '../Icon/CloseIcon.mjs';
+import { Text } from '../Text/Text.mjs';
+import { mapSizeToClass, mapVariantToBoxClass, mapVariantToIconClass, mapVariantToIcon, mapLineVariant, mapArrowVariantToClass } from './utils/classMappers.mjs';
+import styles from './Popover.module.scss.mjs';
+
+// Sync with styles.scss
+var arrowWidth = 14;
+var arrowHeight = 7;
+/**
+ * {@link https://cultureamp.design/components/popover/ Guidance} |
+ * {@link https://cultureamp.design/storybook/?path=/docs/components-popover--default-kaizen-site-demo Storybook}
+ */
+const Popover = /*#__PURE__*/function () {
+  const Popover = function (_a) {
+    var children = _a.children,
+      _b = _a.variant,
+      variant = _b === void 0 ? "default" : _b,
+      _c = _a.placement,
+      placement = _c === void 0 ? "top" : _c,
+      _d = _a.size,
+      size = _d === void 0 ? "small" : _d,
+      heading = _a.heading,
+      _e = _a.dismissible,
+      dismissible = _e === void 0 ? false : _e,
+      onClose = _a.onClose,
+      _f = _a.singleLine,
+      singleLine = _f === void 0 ? false : _f,
+      customIcon = _a.customIcon,
+      referenceElement = _a.referenceElement,
+      classNameOverride = _a.classNameOverride,
+      restProps = __rest(_a, ["children", "variant", "placement", "size", "heading", "dismissible", "onClose", "singleLine", "customIcon", "referenceElement", "classNameOverride"]);
+    var _g = useState(null),
+      popperElement = _g[0],
+      setPopperElement = _g[1];
+    var _h = useState(null),
+      arrowElement = _h[0],
+      setArrowElement = _h[1];
+    var _j = usePopper(referenceElement, popperElement, {
+        modifiers: [{
+          name: "arrow",
+          options: {
+            element: arrowElement,
+            // Ensures that the arrow doesn't go too far to the left or right
+            // of the tooltip.
+            padding: arrowWidth / 2 + 10
+          }
+        }, {
+          name: "offset",
+          options: {
+            offset: [0, arrowHeight + 6]
+          }
+        }, {
+          name: "preventOverflow",
+          options: {
+            // Makes sure that the popover isn't flush up against the end of the
+            // viewport
+            padding: 8,
+            altAxis: true,
+            altBoundary: true,
+            tetherOffset: 50
+          }
+        }, {
+          name: "flip",
+          options: {
+            padding: 8,
+            altBoundary: true,
+            fallbackPlacements: ["left", "top", "bottom", "right"]
+          }
+        }],
+        placement: placement
+      }),
+      popperStyles = _j.styles,
+      attributes = _j.attributes;
+    return /*#__PURE__*/React.createElement("div", __assign({
+      ref: setPopperElement,
+      style: popperStyles.popper
+    }, attributes.popper, {
+      className: classnames(styles.root, mapSizeToClass(size), classNameOverride)
+    }, restProps), /*#__PURE__*/React.createElement("div", {
+      className: mapVariantToBoxClass(variant)
+    }, heading && /*#__PURE__*/React.createElement("div", {
+      className: styles.header
+    }, variant !== "default" && /*#__PURE__*/React.createElement("span", {
+      className: classnames(styles.icon, mapVariantToIconClass(variant))
+    }, customIcon !== null && customIcon !== void 0 ? customIcon : mapVariantToIcon(variant)), /*#__PURE__*/React.createElement(Heading, {
+      variant: "heading-6",
+      classNameOverride: styles.singleLine
+    }, heading), dismissible && /*#__PURE__*/React.createElement("button", {
+      className: styles.close,
+      onClick: onClose,
+      type: "button",
+      "aria-label": "close"
+    }, /*#__PURE__*/React.createElement(CloseIcon, {
+      role: "presentation"
+    }))), /*#__PURE__*/React.createElement(Text, {
+      variant: "small",
+      classNameOverride: classnames(styles.container, mapLineVariant(singleLine))
+    }, children)), /*#__PURE__*/React.createElement("div", {
+      ref: setArrowElement,
+      style: popperStyles.arrow,
+      className: styles.arrowWrapper
+    }, /*#__PURE__*/React.createElement("div", {
+      className: classnames(styles.arrow, mapArrowVariantToClass(variant))
+    })));
+  };
+  Popover.displayName = "Popover";
+  /**
+   * How to use:
+   *
+   * const [referenceElementRef, Popover] = usePopover()
+   *
+   * return (<>
+   *   <button ref={referenceElementRef}>
+   *     Hello world
+   *   </button>
+   *   <Popover>Hello world</Popover>
+   * </>)
+   *
+   * The purpose of this hook is to abstract away some of the awkwardness with the
+   * requirement of passing in refs with popper. We need to use `useState` instead
+   * of `useRef`, which may not be immediately intuitive.
+   *
+   * The popper documentation to help provide more context:
+   *   https://popper.js.org/react-popper/v2/hook/
+   */
+  return Popover;
+}();
+var usePopover = function () {
+  var _a = useState(null),
+    referenceElement = _a[0],
+    setReferenceElement = _a[1];
+  // I guess the problem with this pattern, is that every time referenceElement
+  // changes, a brand new component is generated, which would be bad for memoization.
+  // In this situation however, the value is rarely going to change, and
+  // popovers aren't going to include content with expensive render times.
+  var PopoverWithRef = useMemo(
+  // eslint-disable-next-line react/display-name
+  function () {
+    return function (props) {
+      return referenceElement ? /*#__PURE__*/React.createElement(Popover, __assign({}, props, {
+        referenceElement: referenceElement
+      })) : null;
+    };
+  }, [referenceElement]);
+  return [setReferenceElement, PopoverWithRef];
+};
+export { Popover, usePopover };
+//# sourceMappingURL=Popover.mjs.map

package/dist/esm/Popover/Popover.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Popover.mjs","sources":["../../../src/Popover/Popover.tsx"],"sourcesContent":["import React, { HTMLAttributes, useMemo, useState } from \"react\"\nimport classnames from \"classnames\"\nimport { usePopper } from \"react-popper\"\nimport { Heading } from \"~components/Heading\"\nimport { CloseIcon } from \"~components/Icon\"\nimport { Text } from \"~components/Text\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport { Placement, PopoverSize, PopoverVariant } from \"./types\"\nimport {\n  mapArrowVariantToClass,\n  mapLineVariant,\n  mapSizeToClass,\n  mapVariantToBoxClass,\n  mapVariantToIcon,\n  mapVariantToIconClass,\n} from \"./utils/classMappers\"\nimport styles from \"./Popover.module.scss\"\n\nexport type PopoverProps = {\n  children: React.ReactNode\n  variant?: PopoverVariant\n  placement?: Placement\n  size?: PopoverSize\n  heading?: string\n  dismissible?: boolean\n  onClose?: (event: React.MouseEvent<HTMLButtonElement>) => void\n  singleLine?: boolean\n  /**\n   * For almost all intents and purposes, you should be using a pre-defined variant.\n   * Please avoid using a custom icon unless you have a very good reason to do so.\n   */\n  customIcon?: JSX.Element\n  referenceElement: HTMLElement | null\n} & OverrideClassName<HTMLAttributes<HTMLDivElement>>\n\n// Sync with styles.scss\nconst arrowWidth = 14\nconst arrowHeight = 7\n\n/**\n * {@link https://cultureamp.design/components/popover/ Guidance} |\n * {@link https://cultureamp.design/storybook/?path=/docs/components-popover--default-kaizen-site-demo Storybook}\n */\nexport const Popover = ({\n  children,\n  variant = \"default\",\n  placement = \"top\",\n  size = \"small\",\n  heading,\n  dismissible = false,\n  onClose,\n  singleLine = false,\n  customIcon,\n  referenceElement,\n  classNameOverride,\n  ...restProps\n}: PopoverProps): JSX.Element => {\n  const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(\n    null\n  )\n  const [arrowElement, setArrowElement] = useState<HTMLDivElement | null>(null)\n  const { styles: popperStyles, attributes } = usePopper(\n    referenceElement,\n    popperElement,\n    {\n      modifiers: [\n        {\n          name: \"arrow\",\n          options: {\n            element: arrowElement,\n            // Ensures that the arrow doesn't go too far to the left or right\n            // of the tooltip.\n            padding: arrowWidth / 2 + 10,\n          },\n        },\n        {\n          name: \"offset\",\n          options: {\n            offset: [0, arrowHeight + 6],\n          },\n        },\n        {\n          name: \"preventOverflow\",\n          options: {\n            // Makes sure that the popover isn't flush up against the end of the\n            // viewport\n            padding: 8,\n            altAxis: true,\n            altBoundary: true,\n            tetherOffset: 50,\n          },\n        },\n        {\n          name: \"flip\",\n          options: {\n            padding: 8,\n            altBoundary: true,\n            fallbackPlacements: [\"left\", \"top\", \"bottom\", \"right\"],\n          },\n        },\n      ],\n      placement,\n    }\n  )\n\n  return (\n    <div\n      ref={setPopperElement}\n      style={popperStyles.popper}\n      {...attributes.popper}\n      className={classnames(\n        styles.root,\n        mapSizeToClass(size),\n        classNameOverride\n      )}\n      {...restProps}\n    >\n      <div className={mapVariantToBoxClass(variant)}>\n        {heading && (\n          <div className={styles.header}>\n            {variant !== \"default\" && (\n              <span\n                className={classnames(\n                  styles.icon,\n                  mapVariantToIconClass(variant)\n                )}\n              >\n                {customIcon ?? mapVariantToIcon(variant)}\n              </span>\n            )}\n            <Heading variant=\"heading-6\" classNameOverride={styles.singleLine}>\n              {heading}\n            </Heading>\n            {dismissible && (\n              <button\n                className={styles.close}\n                onClick={onClose}\n                type=\"button\"\n                aria-label=\"close\"\n              >\n                <CloseIcon role=\"presentation\" />\n              </button>\n            )}\n          </div>\n        )}\n        <Text\n          variant=\"small\"\n          classNameOverride={classnames(\n            styles.container,\n            mapLineVariant(singleLine)\n          )}\n        >\n          {children}\n        </Text>\n      </div>\n      <div\n        ref={setArrowElement}\n        style={popperStyles.arrow}\n        className={styles.arrowWrapper}\n      >\n        <div\n          className={classnames(styles.arrow, mapArrowVariantToClass(variant))}\n        />\n      </div>\n    </div>\n  )\n}\n\nPopover.displayName = \"Popover\"\n\ntype PopoverPropsWithoutRef = Omit<PopoverProps, \"referenceElement\">\n\n/**\n * How to use:\n *\n * const [referenceElementRef, Popover] = usePopover()\n *\n * return (<>\n *   <button ref={referenceElementRef}>\n *     Hello world\n *   </button>\n *   <Popover>Hello world</Popover>\n * </>)\n *\n * The purpose of this hook is to abstract away some of the awkwardness with the\n * requirement of passing in refs with popper. We need to use `useState` instead\n * of `useRef`, which may not be immediately intuitive.\n *\n * The popper documentation to help provide more context:\n *   https://popper.js.org/react-popper/v2/hook/\n */\nexport const usePopover = (): [\n  (element: HTMLElement | null) => void,\n  (props: PopoverPropsWithoutRef) => JSX.Element | null,\n] => {\n  const [referenceElement, setReferenceElement] = useState<HTMLElement | null>(\n    null\n  )\n\n  // I guess the problem with this pattern, is that every time referenceElement\n  // changes, a brand new component is generated, which would be bad for memoization.\n  // In this situation however, the value is rarely going to change, and\n  // popovers aren't going to include content with expensive render times.\n  const PopoverWithRef = useMemo(\n    // eslint-disable-next-line react/display-name\n    () => (props: PopoverPropsWithoutRef) =>\n      referenceElement ? (\n        <Popover {...props} referenceElement={referenceElement} />\n      ) : null,\n    [referenceElement]\n  )\n\n  return [setReferenceElement, PopoverWithRef]\n}\n"],"names":["arrowWidth","arrowHeight","Popover","_a","children","_b","variant","_c","placement","_d","size","heading","_e","dismissible","onClose","_f","singleLine","customIcon","referenceElement","classNameOverride","restProps","__rest","_g","useState","popperElement","setPopperElement","_h","arrowElement","setArrowElement","_j","usePopper","modifiers","name","options","element","padding","offset","altAxis","altBoundary","tetherOffset","fallbackPlacements","popperStyles","styles","attributes","React","createElement","__assign","ref","style","popper","className","classnames","root","mapSizeToClass","mapVariantToBoxClass","header","icon","mapVariantToIconClass","mapVariantToIcon","Heading","close","onClick","type","CloseIcon","role","Text","container","mapLineVariant","arrow","arrowWrapper","mapArrowVariantToClass","displayName","usePopover","setReferenceElement","PopoverWithRef","useMemo","props"],"mappings":"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"}