@kaizen/components 1.28.0 → 1.29.0

package/dist/cjs/Menu/subcomponents/MenuHeading/MenuHeading.module.scss.cjs

@@ -0,0 +1,7 @@
+'use strict';
+
+var styles = {
+  "heading": "MenuHeading-module_heading__a9BY8"
+};
+module.exports = styles;
+//# sourceMappingURL=MenuHeading.module.scss.cjs.map

package/dist/cjs/Menu/subcomponents/MenuHeading/MenuHeading.module.scss.cjs.map

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

package/dist/cjs/Menu/subcomponents/MenuItem/MenuItem.cjs

@@ -0,0 +1,58 @@
+'use strict';
+
+var React = require('react');
+var classnames = require('classnames');
+var MenuItem_module = require('./MenuItem.module.scss.cjs');
+const MenuItem = /*#__PURE__*/function () {
+  const MenuItem = function (_a) {
+    var label = _a.label,
+      icon = _a.icon,
+      destructive = _a.destructive,
+      disabled = _a.disabled,
+      onClick = _a.onClick,
+      href = _a.href,
+      target = _a.target,
+      isActive = _a.isActive,
+      dataTestId = _a["data-testid"];
+    var wrappedLabel = React.createElement("span", {
+      className: MenuItem_module.menuItem__Label
+    }, label);
+    var iconNode = icon && React.createElement("span", {
+      className: MenuItem_module.menuItem__Icon
+    }, icon);
+    var className = classnames(MenuItem_module.menuItem, destructive && MenuItem_module["menuItem--destructive"], disabled && MenuItem_module["menuItem--disabled"], isActive && MenuItem_module["menuItem--active"]);
+    if (disabled) {
+      return React.createElement("li", {
+        className: MenuItem_module.menuListItem
+      }, React.createElement("button", {
+        type: "button",
+        disabled: true,
+        className: className,
+        "data-testid": dataTestId
+      }, iconNode, wrappedLabel));
+    }
+    if (href) {
+      return React.createElement("li", {
+        className: MenuItem_module.menuListItem
+      }, React.createElement("a", {
+        href: href,
+        className: className,
+        target: target,
+        "aria-current": isActive ? "page" : undefined,
+        "data-testid": dataTestId
+      }, iconNode, wrappedLabel));
+    }
+    return React.createElement("li", {
+      className: MenuItem_module.menuListItem
+    }, React.createElement("button", {
+      type: "button",
+      onClick: onClick,
+      className: className,
+      "data-testid": dataTestId
+    }, iconNode, wrappedLabel));
+  };
+  MenuItem.displayName = "MenuItem";
+  return MenuItem;
+}();
+exports.MenuItem = MenuItem;
+//# sourceMappingURL=MenuItem.cjs.map

package/dist/cjs/Menu/subcomponents/MenuItem/MenuItem.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItem.cjs","sources":["../../../../../src/Menu/subcomponents/MenuItem/MenuItem.tsx"],"sourcesContent":["import React from \"react\"\nimport classnames from \"classnames\"\nimport styles from \"./MenuItem.module.scss\"\n\nexport type MenuItemProps = {\n  label: string\n  href?: string\n  // Only applicable if href is supplied above\n  target?: string\n  onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void\n  icon?: JSX.Element\n  destructive?: boolean\n  disabled?: boolean\n  /**\n   * @deprecated use data-testid\n   */\n  automationId?: string\n  /**\n   * Not recommended - this was added for use in exceptional cases like the navigation bar, which needs\n   * to highlight which page the user is currently on. By design, Menus don't have active items,\n   * because they are supposed to be a bunch of links/actions.\n   */\n  isActive?: boolean\n  \"data-testid\"?: string\n}\n\nexport const MenuItem = ({\n  label,\n  icon,\n  destructive,\n  disabled,\n  onClick,\n  href,\n  target,\n  isActive,\n  \"data-testid\": dataTestId,\n}: MenuItemProps): JSX.Element => {\n  const wrappedLabel = <span className={styles.menuItem__Label}>{label}</span>\n  const iconNode = icon && <span className={styles.menuItem__Icon}>{icon}</span>\n\n  const className = classnames(\n    styles.menuItem,\n    destructive && styles[\"menuItem--destructive\"],\n    disabled && styles[\"menuItem--disabled\"],\n    isActive && styles[\"menuItem--active\"]\n  )\n\n  if (disabled) {\n    return (\n      <li className={styles.menuListItem}>\n        <button\n          type=\"button\"\n          disabled={true}\n          className={className}\n          data-testid={dataTestId}\n        >\n          {iconNode}\n          {wrappedLabel}\n        </button>\n      </li>\n    )\n  }\n\n  if (href) {\n    return (\n      <li className={styles.menuListItem}>\n        <a\n          href={href}\n          className={className}\n          target={target}\n          // this tells screenreaders that this link represents the current page\n          // (only intended for use in things like a nav with dropdowns)\n          aria-current={isActive ? \"page\" : undefined}\n          data-testid={dataTestId}\n        >\n          {iconNode}\n          {wrappedLabel}\n        </a>\n      </li>\n    )\n  }\n\n  return (\n    <li className={styles.menuListItem}>\n      <button\n        type=\"button\"\n        onClick={onClick}\n        className={className}\n        data-testid={dataTestId}\n      >\n        {iconNode}\n        {wrappedLabel}\n      </button>\n    </li>\n  )\n}\n\nMenuItem.displayName = \"MenuItem\"\n"],"names":["MenuItem","_a","label","icon","destructive","disabled","onClick","href","target","isActive","dataTestId","wrappedLabel","React","createElement","className","styles","menuItem__Label","iconNode","menuItem__Icon","classnames","menuItem","menuListItem","type","undefined","displayName"],"mappings":";;;;;MA0BaA,QAAQ;EAAA,MAARA,QAAQ,GAAG,SAAAA,CAACC,EAUT,EAAA;QATdC,KAAK,GAAAD,EAAA,CAAAC,KAAA;MACLC,IAAI,GAAAF,EAAA,CAAAE,IAAA;MACJC,WAAW,GAAAH,EAAA,CAAAG,WAAA;MACXC,QAAQ,GAAAJ,EAAA,CAAAI,QAAA;MACRC,OAAO,aAAA;MACPC,IAAI,GAAAN,EAAA,CAAAM,IAAA;MACJC,MAAM,GAAAP,EAAA,CAAAO,MAAA;MACNC,QAAQ,GAAAR,EAAA,CAAAQ,QAAA;MACOC,UAAU,GAAAT,EAAA,CAAA,aAAA,CAAA;IAEzB,IAAMU,YAAY,GAAGC,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;MAAMC,SAAS,EAAEC,eAAM,CAACC;KAAe,EAAGd,KAAK,CAAQ;IAC5E,IAAMe,QAAQ,GAAGd,IAAI,IAAIS,KAAM,CAAAC,aAAA,CAAA,MAAA,EAAA;MAAAC,SAAS,EAAEC,eAAM,CAACG;IAAiB,CAAA,EAAAf,IAAI,CAAQ;IAE9E,IAAMW,SAAS,GAAGK,UAAU,CAC1BJ,eAAM,CAACK,QAAQ,EACfhB,WAAW,IAAIW,eAAM,CAAC,uBAAuB,CAAC,EAC9CV,QAAQ,IAAIU,eAAM,CAAC,oBAAoB,CAAC,EACxCN,QAAQ,IAAIM,eAAM,CAAC,kBAAkB,CAAC,CACvC;IAED,IAAIV,QAAQ,EAAE;MACZ,OACEO,KAAI,CAAAC,aAAA,CAAA,IAAA,EAAA;QAAAC,SAAS,EAAEC,eAAM,CAACM;MAAY,CAAA,EAChCT,KAAA,CAAAC,aAAA,CAAA,QAAA,EAAA;QACES,IAAI,EAAC,QAAQ;QACbjB,QAAQ,EAAE,IAAI;QACdS,SAAS,EAAEA,SAAS;QAAA,aAAA,EACPJ;MAAU,CAAA,EAEtBO,QAAQ,EACRN,YAAY,CACN,CACN;IAER;IAED,IAAIJ,IAAI,EAAE;MACR,OACEK,KAAI,CAAAC,aAAA,CAAA,IAAA,EAAA;QAAAC,SAAS,EAAEC,eAAM,CAACM;MAAY,CAAA,EAChCT,KACE,CAAAC,aAAA,CAAA,GAAA,EAAA;QAAAN,IAAI,EAAEA,IAAI;QACVO,SAAS,EAAEA,SAAS;QACpBN,MAAM,EAAEA,MAAM;wBAGAC,QAAQ,GAAG,MAAM,GAAGc,SAAS;QAAA,aAAA,EAC9Bb;MAAU,CAAA,EAEtBO,QAAQ,EACRN,YAAY,CACX,CACD;IAER;IAED,OACEC,KAAI,CAAAC,aAAA,CAAA,IAAA,EAAA;MAAAC,SAAS,EAAEC,eAAM,CAACM;IAAY,CAAA,EAChCT,KAAA,CAAAC,aAAA,CAAA,QAAA,EAAA;MACES,IAAI,EAAC,QAAQ;MACbhB,OAAO,EAAEA,OAAO;MAChBQ,SAAS,EAAEA,SAAS;MAAA,aAAA,EACPJ;IAAU,CAAA,EAEtBO,QAAQ,EACRN,YAAY,CACN,CACN;EAET,CAAC;EAEDX,QAAQ,CAACwB,WAAW,GAAG,UAAU;EAAA,OAvEpBxB,QAAQ;AAAA;"}

package/dist/cjs/Menu/subcomponents/MenuItem/MenuItem.module.scss.cjs

@@ -0,0 +1,13 @@
+'use strict';
+
+var styles = {
+  "menuListItem": "MenuItem-module_menuListItem__TlgwJ",
+  "menuItem": "MenuItem-module_menuItem__sVlLA",
+  "menuItem--disabled": "MenuItem-module_menuItem--disabled__hPAaZ",
+  "menuItem__Icon": "MenuItem-module_menuItem__Icon__MwIT9",
+  "menuItem--destructive": "MenuItem-module_menuItem--destructive__PRybF",
+  "menuItem--active": "MenuItem-module_menuItem--active__XRziT",
+  "menuItem__Label": "MenuItem-module_menuItem__Label__gXz-G"
+};
+module.exports = styles;
+//# sourceMappingURL=MenuItem.module.scss.cjs.map

package/dist/cjs/Menu/subcomponents/MenuItem/MenuItem.module.scss.cjs.map

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

package/dist/cjs/Menu/subcomponents/MenuList/MenuList.cjs

@@ -0,0 +1,25 @@
+'use strict';
+
+var tslib = require('tslib');
+var React = require('react');
+var MenuList_module = require('./MenuList.module.scss.cjs');
+const MenuList = /*#__PURE__*/function () {
+  const MenuList = function (props) {
+    var _a;
+    var heading = props.heading,
+      children = props.children,
+      restProps = tslib.__rest(props, ["heading", "children"]);
+    var reactId = React.useId();
+    var listHeadingID = (_a = heading === null || heading === void 0 ? void 0 : heading.props.id) !== null && _a !== void 0 ? _a : reactId;
+    return React.createElement(React.Fragment, null, heading && React.cloneElement(heading, {
+      id: listHeadingID
+    }), React.createElement("ul", tslib.__assign({
+      className: MenuList_module.menuSection,
+      "aria-labelledby": heading ? listHeadingID : undefined
+    }, restProps), children));
+  };
+  MenuList.displayName = "MenuList";
+  return MenuList;
+}();
+exports.MenuList = MenuList;
+//# sourceMappingURL=MenuList.cjs.map

package/dist/cjs/Menu/subcomponents/MenuList/MenuList.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuList.cjs","sources":["../../../../../src/Menu/subcomponents/MenuList/MenuList.tsx"],"sourcesContent":["import React, { HTMLAttributes, cloneElement, useId } from \"react\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport styles from \"./MenuList.module.scss\"\n\nexport type MenuListProps = {\n  heading?: JSX.Element\n  children: React.ReactNode\n} & OverrideClassName<HTMLAttributes<HTMLUListElement>>\n\nexport const MenuList = (props: MenuListProps): JSX.Element => {\n  const { heading, children, ...restProps } = props\n  const reactId = useId()\n  const listHeadingID = heading?.props.id ?? reactId\n\n  return (\n    <>\n      {heading && cloneElement(heading, { id: listHeadingID })}\n      <ul\n        className={styles.menuSection}\n        aria-labelledby={heading ? listHeadingID : undefined}\n        {...restProps}\n      >\n        {children}\n      </ul>\n    </>\n  )\n}\n\nMenuList.displayName = \"MenuList\"\n"],"names":["MenuList","props","heading","children","restProps","__rest","reactId","useId","listHeadingID","_a","id","React","createElement","Fragment","cloneElement","__assign","className","styles","menuSection","undefined","displayName"],"mappings":";;;;;MASaA,QAAQ;EAAA,MAARA,QAAQ,GAAG,SAAAA,CAACC,KAAoB,EAAA;;IACnC,IAAAC,OAAO,GAA6BD,KAAK,CAAlCC,OAAA;MAAEC,QAAQ,GAAmBF,KAAK,CAAxBE,QAAA;MAAKC,SAAS,GAAKC,KAAA,CAAAA,MAAA,CAAAJ,KAAK,EAA3C,CAAA,SAAA,EAAA,UAAA,CAAmC,CAAF;IACvC,IAAMK,OAAO,GAAGC,KAAAA,CAAAA,KAAK,EAAE;IACvB,IAAMC,aAAa,GAAG,CAAAC,EAAA,GAAAP,OAAO,aAAPA,OAAO,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAPA,OAAO,CAAED,KAAK,CAACS,EAAE,MAAA,IAAA,IAAAD,EAAA,KAAA,KAAA,CAAA,GAAAA,EAAA,GAAIH,OAAO;IAElD,OACEK,KAAA,CAAAC,aAAA,CAAAD,KAAA,CAAAE,QAAA,EAAA,IAAA,EACGX,OAAO,IAAIY,KAAAA,CAAAA,YAAY,CAACZ,OAAO,EAAE;MAAEQ,EAAE,EAAEF;IAAa,CAAE,CAAC,EACxDG,KACE,CAAAC,aAAA,CAAA,IAAA,EAAAG,KAAA,CAAAA,QAAA,CAAA;MAAAC,SAAS,EAAEC,eAAM,CAACC,WAAW;MACZ,iBAAA,EAAAhB,OAAO,GAAGM,aAAa,GAAGW;IAAS,CAChD,EAAAf,SAAS,GAEZD,QAAQ,CACN,CACJ;EAEP,CAAC;EAEDH,QAAQ,CAACoB,WAAW,GAAG,UAAU;EAAA,OAnBpBpB,QAAQ;AAAA;"}

package/dist/cjs/Menu/subcomponents/MenuList/MenuList.module.scss.cjs

@@ -0,0 +1,7 @@
+'use strict';
+
+var styles = {
+  "menuSection": "MenuList-module_menuSection__Wbgbr"
+};
+module.exports = styles;
+//# sourceMappingURL=MenuList.module.scss.cjs.map

package/dist/cjs/Menu/subcomponents/MenuList/MenuList.module.scss.cjs.map

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

package/dist/cjs/Menu/subcomponents/StatelessMenu/StatelessMenu.cjs

@@ -0,0 +1,72 @@
+'use strict';
+
+var React = require('react');
+var ReactDOM = require('react-dom');
+var MenuDropdown = require('../MenuDropdown/MenuDropdown.cjs');
+var StatelessMenu_module = require('./StatelessMenu.module.scss.cjs');
+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 = React.useState(null),
+      referenceElement = _e[0],
+      setReferenceElement = _e[1];
+    var portalSelectorElementRef = React.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
+    });
+    React.useEffect(function () {
+      portalSelectorElementRef.current = portalSelector ? document.querySelector(portalSelector) : null;
+    }, [portalSelector]);
+    React.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 ? React.createElement(MenuDropdown.MenuDropdown, {
+      referenceElement: referenceElement,
+      align: align,
+      hideMenuDropdown: hideMenuDropdown,
+      width: dropdownWidth,
+      id: dropdownId,
+      autoHide: autoHide
+    }, children) : null;
+    return (
+      // 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
+      }, React.createElement("div", {
+        className: StatelessMenu_module.buttonWrapper,
+        ref: setReferenceElement
+      }, menuButton), portalSelector && portalSelectorElementRef.current ? ReactDOM.createPortal(menu, portalSelectorElementRef.current) : menu)
+    );
+  };
+  StatelessMenu.displayName = "StatelessMenu";
+  return StatelessMenu;
+}();
+exports.StatelessMenu = StatelessMenu;
+//# sourceMappingURL=StatelessMenu.cjs.map

package/dist/cjs/Menu/subcomponents/StatelessMenu/StatelessMenu.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatelessMenu.cjs","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":";;;;;;MAsDaA,aAAa;EAAA,MAAbA,aAAa,GAAG,SAAAA,CAACC,EAaT,EAAA;QAZnBC,EAAc,GAAAD,EAAA,CAAAE,KAAA;MAAdA,KAAK,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,MAAM,KAAA;MACdE,EAAA,GAAAH,EAAA,CAAAI,aAAyB;MAAzBA,aAAa,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,SAAS,GAAAA,EAAA;MACzBE,gBAAe;MAAfC,QAAQ,mBAAG,IAAI,GAAAD,EAAA;MACAE,UAAU,GAAAP,EAAA,CAAA,aAAA,CAAA;MACzBQ,UAAU,GAAAR,EAAA,CAAAQ,UAAA;MACVC,QAAQ,GAAAT,EAAA,CAAAS,QAAA;MACRC,cAAc,GAAAV,EAAA,CAAAU,cAAA;MACdC,aAAa,GAAAX,EAAA,CAAAW,aAAA;MACbC,kBAAkB,GAAAZ,EAAA,CAAAY,kBAAA;MAClBC,gBAAgB,GAAAb,EAAA,CAAAa,gBAAA;MAChBC,YAAY,GAAAd,EAAA,CAAAc,YAAA;MACZC,OAAO,GAAAf,EAAA,CAAAe,OAAA;IAED,IAAAC,EAAA,GACJC,KAAAA,CAAAA,QAAQ,CAAyB,IAAI,CAAC;MADjCC,gBAAgB,GAAAF,EAAA,CAAA,CAAA,CAAA;MAAEG,mBAAmB,GAAAH,EAAA,CAAA,CAAA,CACJ;IACxC,IAAMI,wBAAwB,GAAGC,YAAM,CAAiB,IAAI,CAAC;IAE7D,IAAMC,UAAU,GAAGR,YAAY,CAAC;MAC9BC,OAAO,EAAE,SAAAA,CAACQ,CAAwC,EAAA;QAChDA,CAAC,CAACC,cAAc,CAAA,CAAE;QAClBD,CAAC,CAACE,eAAe,CAAA,CAAE;QACnBb,kBAAkB,EAAE;MACrB,CAAA;MACDc,WAAW,EAAE,SAAAA,CAACH,CAAwC,EAAA;QACpD,OAAAA,CAAC,CAACC,cAAc,EAAE;MAAA,CAAA;MACpB,eAAe,EAAE,IAAI;MACrB,eAAe,EAAEb;IAClB,CAAA,CAAC;IAEFgB,KAAAA,CAAAA,SAAS,CAAC,YAAA;MACRP,wBAAwB,CAACQ,OAAO,GAAGlB,cAAc,GAC7CmB,QAAQ,CAACC,aAAa,CAACpB,cAAc,CAAC,GACtC,IAAI;IACV,CAAC,EAAE,CAACA,cAAc,CAAC,CAAC;IAEpBiB,KAAAA,CAAAA,SAAS,CAAC,YAAA;MACR,IAAIjB,cAAc,IAAI,CAACU,wBAAwB,CAACQ,OAAO,EAAE;;QAEvDG,OAAO,CAACC,IAAI,CACV,sDAAsD,GAAGtB,cAAc,CACxE;MACF;IACH,CAAC,EAAE,CAACU,wBAAwB,EAAEV,cAAc,CAAC,CAAC;IAE9C,IAAMuB,IAAI,GAAGtB,aAAa,GACxBuB,KAAC,CAAAC,aAAA,CAAAC,YAAY,CAAAA,YAAA,EACX;MAAAlB,gBAAgB,EAAEA,gBAAgB;MAClChB,KAAK,EAAEA,KAAK;MACZW,gBAAgB,EAAEA,gBAAgB;MAClCwB,KAAK,EAAEjC,aAAa;MACpBkC,EAAE,EAAE9B,UAAU;MACdF,QAAQ,EAAEA;IAAQ,CAAA,EAEjBG,QAAQ,CACI,GACb,IAAI;IAER;;MAEEyB,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;QAAA,aAAA,EAAkB5B,UAAU;QAAEQ,OAAO,EAAEA;MAAO,CAAA,EAC5CmB,KAAK,CAAAC,aAAA,CAAA,KAAA,EAAA;QAAAI,SAAS,EAAEC,oBAAM,CAACC,aAAa;QAAEC,GAAG,EAAEvB;MACxC,CAAA,EAAAG,UAAU,CACP,EACLZ,cAAc,IAAIU,wBAAwB,CAACQ,OAAO,GAC/Ce,QAAQ,CAACC,YAAY,CAACX,IAAI,EAAEb,wBAAwB,CAACQ,OAAO,CAAC,GAC7DK,IAAI;IACJ;EAEV,CAAC;EAEDlC,aAAa,CAAC8C,WAAW,GAAG,eAAe;EAAA,OAvE9B9C,aAAa;AAAA;"}

package/dist/cjs/Menu/subcomponents/StatelessMenu/StatelessMenu.module.scss.cjs

@@ -0,0 +1,7 @@
+'use strict';
+
+var styles = {
+  "buttonWrapper": "StatelessMenu-module_buttonWrapper__9LgSC"
+};
+module.exports = styles;
+//# sourceMappingURL=StatelessMenu.module.scss.cjs.map

package/dist/cjs/Menu/subcomponents/StatelessMenu/StatelessMenu.module.scss.cjs.map

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

package/dist/cjs/Modal/GenericModal/GenericModal.cjs

@@ -1,7 +1,7 @@
 'use strict';
 
 var React = require('react');
-var reactDom = require('react-dom');
+var ReactDOM = require('react-dom');
 var react = require('@headlessui/react');
 var FocusLock = require('react-focus-lock');
 var console = require('../util/console.cjs');
@@ -88,7 +88,7 @@ const GenericModal = /*#__PURE__*/function () {
       }
       propsOnAfterLeave === null || propsOnAfterLeave === void 0 ? void 0 : propsOnAfterLeave();
     };
-    return reactDom.createPortal(React.createElement(react.Transition, {
+    return ReactDOM.createPortal(React.createElement(react.Transition, {
       appear: true,
       show: isOpen,
       enter: GenericModal_module.animatingEnter,

package/dist/cjs/Modal/GenericModal/subcomponents/ModalFooter/ModalFooter.cjs

@@ -5,8 +5,6 @@ var React = require('react');
 var classnames = require('classnames');
 var Button = require('../../../../Button/Button/Button.cjs');
 require('../../../../Button/IconButton/IconButton.cjs');
-require('../../../../Button/PaginationLink/PaginationLink.cjs');
-require('../../../../Button/DirectionalLink/DirectionalLink.cjs');
 var useMediaQueries = require('../../../../utils/useMediaQueries.cjs');
 var ModalBody = require('../ModalBody/ModalBody.cjs');
 var ModalFooter_module = require('./ModalFooter.module.scss.cjs');

package/dist/cjs/Modal/GenericModal/subcomponents/ModalFooter/ModalFooter.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ModalFooter.cjs","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,KAAA,CAAAA,MAAA,CAAAR,EAAA,EAAA,CAAA,UAAA,EAAA,SAAA,EAAA,YAAA,EAAA,YAAA,EAAA,SAAA,CAO3B,CADS;IAEA,IAAAS,OAAO,GAAKC,+BAAe,CAAE,CAAA,QAAtB;IAEf,OACEC,oBAACC,SAAAA,CAAAA,SAAS,EAAA;MAACC,SAAS,EAAEP,OAAO,KAAK;IAAW,CAAA,EAC3CK,KACE,CAAAG,aAAA,CAAA,KAAA,EAAAC,KAAAA,CAAAA,QAAA,CAAA;MAAAC,SAAS,EAAEC,UAAU,CACnBC,kBAAM,CAAChB,OAAO,EACd,CAACD,QAAQ,IAAIiB,kBAAM,CAACC,MAAM,EAC1Bb,OAAO,KAAK,SAAS,IAAIY,kBAAM,CAACE,iBAAiB,EACjDf,UAAU,IAAIa,kBAAM,CAACG,iBAAiB;IACvC,CACG,EAAAd,KAAK,CAER,EAAAL,OAAO,CAACoB,GAAG,CAAC,UAACC,MAAM,EAAEC,KAAK;MAAK,OAC9Bb,KAAK,CAAAG,aAAA,CAAA,KAAA,EAAA;QAAAE,SAAS,EAAEE,kBAAM,CAACO,YAAY;QAAEC,GAAG,EAAEF;MAAK,CAAA,EAC7Cb,KAAC,CAAAG,aAAA,CAAAa,MAAAA,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.cjs","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,KAAA,CAAAA,MAAA,CAAAR,EAAA,EAAA,CAAA,UAAA,EAAA,SAAA,EAAA,YAAA,EAAA,YAAA,EAAA,SAAA,CAO3B,CADS;IAEA,IAAAS,OAAO,GAAKC,+BAAe,CAAE,CAAA,QAAtB;IAEf,OACEC,oBAACC,SAAAA,CAAAA,SAAS,EAAA;MAACC,SAAS,EAAEP,OAAO,KAAK;IAAW,CAAA,EAC3CK,KACE,CAAAG,aAAA,CAAA,KAAA,EAAAC,KAAAA,CAAAA,QAAA,CAAA;MAAAC,SAAS,EAAEC,UAAU,CACnBC,kBAAM,CAAChB,OAAO,EACd,CAACD,QAAQ,IAAIiB,kBAAM,CAACC,MAAM,EAC1Bb,OAAO,KAAK,SAAS,IAAIY,kBAAM,CAACE,iBAAiB,EACjDf,UAAU,IAAIa,kBAAM,CAACG,iBAAiB;IACvC,CACG,EAAAd,KAAK,CAER,EAAAL,OAAO,CAACoB,GAAG,CAAC,UAACC,MAAM,EAAEC,KAAK;MAAK,OAC9Bb,KAAK,CAAAG,aAAA,CAAA,KAAA,EAAA;QAAAE,SAAS,EAAEE,kBAAM,CAACO,YAAY;QAAEC,GAAG,EAAEF;MAAK,CAAA,EAC7Cb,KAAC,CAAAG,aAAA,CAAAa,MAAAA,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/cjs/Modal/GenericModal/subcomponents/ModalHeader/ModalHeader.cjs

@@ -3,8 +3,6 @@
 var React = require('react');
 require('../../../../Button/Button/Button.cjs');
 var IconButton = require('../../../../Button/IconButton/IconButton.cjs');
-require('../../../../Button/PaginationLink/PaginationLink.cjs');
-require('../../../../Button/DirectionalLink/DirectionalLink.cjs');
 require('tslib');
 require('uuid');
 require('../../../../Icon/subcomponents/SVG/SVG.cjs');

package/dist/cjs/Modal/GenericModal/subcomponents/ModalHeader/ModalHeader.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ModalHeader.cjs","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,OACnCC,oBAACC,SAAAA,CAAAA,SAAS,EAAA,IAAA,EACRD,KAAA,CAAAE,aAAA,CAAA,KAAA,EAAA;MAAKC,SAAS,EAAEC,kBAAM,CAACC;IAAa,CAAA,EAClCL,KAAA,CAAAE,aAAA,CAACI,UAAU,CAAAA,UAAA,EAAA;MACTC,KAAK,EAAC,SAAS;MACfC,IAAI,EAAER,KAAC,CAAAE,aAAA,CAAAO,mBAAS,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.cjs","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,OACnCC,oBAACC,SAAAA,CAAAA,SAAS,EAAA,IAAA,EACRD,KAAA,CAAAE,aAAA,CAAA,KAAA,EAAA;MAAKC,SAAS,EAAEC,kBAAM,CAACC;IAAa,CAAA,EAClCL,KAAA,CAAAE,aAAA,CAACI,UAAU,CAAAA,UAAA,EAAA;MACTC,KAAK,EAAC,SAAS;MACfC,IAAI,EAAER,KAAC,CAAAE,aAAA,CAAAO,mBAAS,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/cjs/MultiSelect/subcomponents/Popover/Popover.cjs

@@ -2,7 +2,7 @@
 
 var tslib = require('tslib');
 var React = require('react');
-var reactDom$1 = require('react-dom');
+var ReactDOM = require('react-dom');
 var reactDom = require('@floating-ui/react-dom');
 var classnames = require('classnames');
 var reactFocusOn = require('react-focus-on');
@@ -36,7 +36,7 @@ const Popover = /*#__PURE__*/function () {
       })],
       whileElementsMounted: reactDom.autoUpdate
     }, floatingOptions)).floatingStyles;
-    return reactDom$1.createPortal(React.createElement(reactFocusOn.FocusOn, tslib.__assign({
+    return ReactDOM.createPortal(React.createElement(reactFocusOn.FocusOn, tslib.__assign({
       scrollLock: false
     }, focusOnProps), React.createElement("div", tslib.__assign({
       ref: refs.setFloating,

package/dist/cjs/MultiSelect/subcomponents/Popover/Popover.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.cjs","sources":["../../../../../src/MultiSelect/subcomponents/Popover/Popover.tsx"],"sourcesContent":["import React, { HTMLAttributes } from \"react\"\nimport { createPortal } from \"react-dom\"\nimport {\n  autoUpdate,\n  flip,\n  offset,\n  ReferenceType,\n  useFloating,\n  UseFloatingReturn,\n  UseFloatingOptions,\n  size,\n} from \"@floating-ui/react-dom\"\nimport classnames from \"classnames\"\nimport { FocusOn } from \"react-focus-on\"\nimport { ReactFocusOnProps } from \"react-focus-on/dist/es5/types\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport styles from \"./Popover.module.scss\"\n\nexport type PopoverProps<RT extends ReferenceType = ReferenceType> = {\n  children: React.ReactNode\n  refs: UseFloatingReturn<RT>[\"refs\"]\n  /**\n   * passes in additional options / override for https://floating-ui.com/docs/tooltip#usefloating-hook\n   */\n  floatingOptions?: Omit<UseFloatingOptions, \"elements\">\n  focusOnProps?: Omit<ReactFocusOnProps, \"children\">\n  portalContainer?: Element | DocumentFragment\n} & OverrideClassName<HTMLAttributes<HTMLDivElement>>\n\nexport const Popover = <RT extends ReferenceType>({\n  children,\n  refs,\n  floatingOptions,\n  focusOnProps,\n  portalContainer,\n  classNameOverride,\n  ...restProps\n}: PopoverProps<RT>): JSX.Element => {\n  const { floatingStyles } = useFloating({\n    elements: {\n      reference: refs.reference.current,\n      floating: refs.floating.current,\n    },\n    placement: \"bottom-start\",\n    middleware: [\n      offset(15),\n      flip(),\n      size({\n        apply({ availableWidth, availableHeight, elements }) {\n          Object.assign(elements.floating.style, {\n            maxWidth: `${Math.min(availableWidth, 400)}px`,\n            minWidth: `${Math.min(availableWidth, 196)}px`,\n            maxHeight: `${Math.min(availableHeight, 352)}px`,\n          })\n        },\n      }),\n    ],\n    whileElementsMounted: autoUpdate,\n    ...floatingOptions,\n  })\n\n  return createPortal(\n    <FocusOn scrollLock={false} {...focusOnProps}>\n      <div\n        ref={refs.setFloating}\n        style={floatingStyles}\n        className={classnames(styles.popover, classNameOverride)}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        {...restProps}\n      >\n        {children}\n      </div>\n    </FocusOn>,\n    portalContainer ?? document.body\n  )\n}\n\nPopover.displayName = \"Popover\"\n"],"names":["Popover","_a","children","refs","floatingOptions","focusOnProps","portalContainer","classNameOverride","restProps","__rest","floatingStyles","useFloating","__assign","elements","reference","current","floating","placement","middleware","offset","flip","size","apply","availableWidth","availableHeight","Object","assign","style","maxWidth","concat","Math","min","minWidth","maxHeight","whileElementsMounted","autoUpdate","createPortal","React","createElement","FocusOn","scrollLock","ref","setFloating","className","classnames","styles","popover","role","document","body","displayName"],"mappings":";;;;;;;;;MA6BaA,OAAO;EAAA,MAAPA,OAAO,GAAG,SAAAA,CAA2BC,EAQ/B,EAAA;IAPjB,IAAAC,QAAQ,cAAA;MACRC,IAAI,UAAA;MACJC,eAAe,qBAAA;MACfC,YAAY,kBAAA;MACZC,eAAe,qBAAA;MACfC,iBAAiB,uBAAA;MACdC,SAAS,GAPoCC,KAAA,CAAAA,MAAA,CAAAR,EAAA,EAAA,CAAA,UAAA,EAAA,MAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,iBAAA,EAAA,mBAAA,CAQjD,CADa;IAEJ,IAAAS,cAAc,GAAKC,QAAAA,CAAAA,WAAW,CAAAC,KAAA,CAAAA,QAAA,CAAA;MACpCC,QAAQ,EAAE;QACRC,SAAS,EAAEX,IAAI,CAACW,SAAS,CAACC,OAAO;QACjCC,QAAQ,EAAEb,IAAI,CAACa,QAAQ,CAACD;MACzB,CAAA;MACDE,SAAS,EAAE,cAAc;MACzBC,UAAU,EAAE,CACVC,QAAAA,CAAAA,MAAM,CAAC,EAAE,CAAC,EACVC,aAAI,CAAE,CAAA,EACNC,aAAI,CAAC;QACHC,KAAK,YAACrB,EAA6C,EAAA;UAA3C,IAAAsB,cAAc,oBAAA;YAAEC,eAAe,GAAAvB,EAAA,CAAAuB,eAAA;YAAEX,QAAQ,GAAAZ,EAAA,CAAAY,QAAA;UAC/CY,MAAM,CAACC,MAAM,CAACb,QAAQ,CAACG,QAAQ,CAACW,KAAK,EAAE;YACrCC,QAAQ,EAAE,EAAG,CAAAC,MAAA,CAAAC,IAAI,CAACC,GAAG,CAACR,cAAc,EAAE,GAAG,CAAC,EAAI,IAAA,CAAA;YAC9CS,QAAQ,EAAE,EAAG,CAAAH,MAAA,CAAAC,IAAI,CAACC,GAAG,CAACR,cAAc,EAAE,GAAG,CAAC,EAAI,IAAA,CAAA;YAC9CU,SAAS,EAAE,EAAG,CAAAJ,MAAA,CAAAC,IAAI,CAACC,GAAG,CAACP,eAAe,EAAE,GAAG,CAAC,EAAI,IAAA;UACjD,CAAA,CAAC;QACH;OACF,CAAC,CACH;MACDU,oBAAoB,EAAEC,QAAU,CAAAA;IAAA,GAC7B/B,eAAe,CAAA,CAClB,eArBoB;IAuBtB,OAAOgC,UAAY,CAAAA,YAAA,CACjBC,KAAC,CAAAC,aAAA,CAAAC,YAAO,CAAAA,OAAA;MAACC,UAAU,EAAE;IAAK,CAAA,EAAMnC,YAAY,CAAA,EAC1CgC,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA1B,KAAA,CAAAA,QAAA,CAAA;MACE6B,GAAG,EAAEtC,IAAI,CAACuC,WAAW;MACrBf,KAAK,EAAEjB,cAAc;MACrBiC,SAAS,EAAEC,UAAU,CAACC,cAAM,CAACC,OAAO,EAAEvC,iBAAiB,CAAC;MACxDwC,IAAI,EAAC,QAAQ;oBACF;IAAM,CAAA,EACbvC,SAAS,CAEZ,EAAAN,QAAQ,CACL,CACE,EACVI,eAAe,KAAf,IAAA,IAAAA,eAAe,cAAfA,eAAe,GAAI0C,QAAQ,CAACC,IAAI,CACjC;EACH,CAAC;EAEDjD,OAAO,CAACkD,WAAW,GAAG,SAAS;EAAA,OAjDlBlD,OAAO;AAAA;"}
+{"version":3,"file":"Popover.cjs","sources":["../../../../../src/MultiSelect/subcomponents/Popover/Popover.tsx"],"sourcesContent":["import React, { HTMLAttributes } from \"react\"\nimport { createPortal } from \"react-dom\"\nimport {\n  autoUpdate,\n  flip,\n  offset,\n  ReferenceType,\n  useFloating,\n  UseFloatingReturn,\n  UseFloatingOptions,\n  size,\n} from \"@floating-ui/react-dom\"\nimport classnames from \"classnames\"\nimport { FocusOn } from \"react-focus-on\"\nimport { ReactFocusOnProps } from \"react-focus-on/dist/es5/types\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport styles from \"./Popover.module.scss\"\n\nexport type PopoverProps<RT extends ReferenceType = ReferenceType> = {\n  children: React.ReactNode\n  refs: UseFloatingReturn<RT>[\"refs\"]\n  /**\n   * passes in additional options / override for https://floating-ui.com/docs/tooltip#usefloating-hook\n   */\n  floatingOptions?: Omit<UseFloatingOptions, \"elements\">\n  focusOnProps?: Omit<ReactFocusOnProps, \"children\">\n  portalContainer?: Element | DocumentFragment\n} & OverrideClassName<HTMLAttributes<HTMLDivElement>>\n\nexport const Popover = <RT extends ReferenceType>({\n  children,\n  refs,\n  floatingOptions,\n  focusOnProps,\n  portalContainer,\n  classNameOverride,\n  ...restProps\n}: PopoverProps<RT>): JSX.Element => {\n  const { floatingStyles } = useFloating({\n    elements: {\n      reference: refs.reference.current,\n      floating: refs.floating.current,\n    },\n    placement: \"bottom-start\",\n    middleware: [\n      offset(15),\n      flip(),\n      size({\n        apply({ availableWidth, availableHeight, elements }) {\n          Object.assign(elements.floating.style, {\n            maxWidth: `${Math.min(availableWidth, 400)}px`,\n            minWidth: `${Math.min(availableWidth, 196)}px`,\n            maxHeight: `${Math.min(availableHeight, 352)}px`,\n          })\n        },\n      }),\n    ],\n    whileElementsMounted: autoUpdate,\n    ...floatingOptions,\n  })\n\n  return createPortal(\n    <FocusOn scrollLock={false} {...focusOnProps}>\n      <div\n        ref={refs.setFloating}\n        style={floatingStyles}\n        className={classnames(styles.popover, classNameOverride)}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        {...restProps}\n      >\n        {children}\n      </div>\n    </FocusOn>,\n    portalContainer ?? document.body\n  )\n}\n\nPopover.displayName = \"Popover\"\n"],"names":["Popover","_a","children","refs","floatingOptions","focusOnProps","portalContainer","classNameOverride","restProps","__rest","floatingStyles","useFloating","__assign","elements","reference","current","floating","placement","middleware","offset","flip","size","apply","availableWidth","availableHeight","Object","assign","style","maxWidth","concat","Math","min","minWidth","maxHeight","whileElementsMounted","autoUpdate","createPortal","React","createElement","FocusOn","scrollLock","ref","setFloating","className","classnames","styles","popover","role","document","body","displayName"],"mappings":";;;;;;;;;MA6BaA,OAAO;EAAA,MAAPA,OAAO,GAAG,SAAAA,CAA2BC,EAQ/B,EAAA;IAPjB,IAAAC,QAAQ,cAAA;MACRC,IAAI,UAAA;MACJC,eAAe,qBAAA;MACfC,YAAY,kBAAA;MACZC,eAAe,qBAAA;MACfC,iBAAiB,uBAAA;MACdC,SAAS,GAPoCC,KAAA,CAAAA,MAAA,CAAAR,EAAA,EAAA,CAAA,UAAA,EAAA,MAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,iBAAA,EAAA,mBAAA,CAQjD,CADa;IAEJ,IAAAS,cAAc,GAAKC,QAAAA,CAAAA,WAAW,CAAAC,KAAA,CAAAA,QAAA,CAAA;MACpCC,QAAQ,EAAE;QACRC,SAAS,EAAEX,IAAI,CAACW,SAAS,CAACC,OAAO;QACjCC,QAAQ,EAAEb,IAAI,CAACa,QAAQ,CAACD;MACzB,CAAA;MACDE,SAAS,EAAE,cAAc;MACzBC,UAAU,EAAE,CACVC,QAAAA,CAAAA,MAAM,CAAC,EAAE,CAAC,EACVC,aAAI,CAAE,CAAA,EACNC,aAAI,CAAC;QACHC,KAAK,YAACrB,EAA6C,EAAA;UAA3C,IAAAsB,cAAc,oBAAA;YAAEC,eAAe,GAAAvB,EAAA,CAAAuB,eAAA;YAAEX,QAAQ,GAAAZ,EAAA,CAAAY,QAAA;UAC/CY,MAAM,CAACC,MAAM,CAACb,QAAQ,CAACG,QAAQ,CAACW,KAAK,EAAE;YACrCC,QAAQ,EAAE,EAAG,CAAAC,MAAA,CAAAC,IAAI,CAACC,GAAG,CAACR,cAAc,EAAE,GAAG,CAAC,EAAI,IAAA,CAAA;YAC9CS,QAAQ,EAAE,EAAG,CAAAH,MAAA,CAAAC,IAAI,CAACC,GAAG,CAACR,cAAc,EAAE,GAAG,CAAC,EAAI,IAAA,CAAA;YAC9CU,SAAS,EAAE,EAAG,CAAAJ,MAAA,CAAAC,IAAI,CAACC,GAAG,CAACP,eAAe,EAAE,GAAG,CAAC,EAAI,IAAA;UACjD,CAAA,CAAC;QACH;OACF,CAAC,CACH;MACDU,oBAAoB,EAAEC,QAAU,CAAAA;IAAA,GAC7B/B,eAAe,CAAA,CAClB,eArBoB;IAuBtB,OAAOgC,QAAY,CAAAA,YAAA,CACjBC,KAAC,CAAAC,aAAA,CAAAC,YAAO,CAAAA,OAAA;MAACC,UAAU,EAAE;IAAK,CAAA,EAAMnC,YAAY,CAAA,EAC1CgC,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA1B,KAAA,CAAAA,QAAA,CAAA;MACE6B,GAAG,EAAEtC,IAAI,CAACuC,WAAW;MACrBf,KAAK,EAAEjB,cAAc;MACrBiC,SAAS,EAAEC,UAAU,CAACC,cAAM,CAACC,OAAO,EAAEvC,iBAAiB,CAAC;MACxDwC,IAAI,EAAC,QAAQ;oBACF;IAAM,CAAA,EACbvC,SAAS,CAEZ,EAAAN,QAAQ,CACL,CACE,EACVI,eAAe,KAAf,IAAA,IAAAA,eAAe,cAAfA,eAAe,GAAI0C,QAAQ,CAACC,IAAI,CACjC;EACH,CAAC;EAEDjD,OAAO,CAACkD,WAAW,GAAG,SAAS;EAAA,OAjDlBlD,OAAO;AAAA;"}

package/dist/cjs/Pagination/Pagination.cjs

@@ -0,0 +1,116 @@
+'use strict';
+
+var tslib = require('tslib');
+var React = require('react');
+var classnames = require('classnames');
+var DirectionalLink = require('./subcomponents/DirectionalLink/DirectionalLink.cjs');
+var PaginationLink = require('./subcomponents/PaginationLink/PaginationLink.cjs');
+var TruncateIndicator = require('./subcomponents/TruncateIndicator/TruncateIndicator.cjs');
+var createRange = require('./utils/createRange.cjs');
+var Pagination_module = require('./Pagination.module.scss.cjs');
+
+/**
+ * {@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 = tslib.__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 React.createElement(PaginationLink.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.createRange(1, pageCount).map(paginationIndicator);
+    } else {
+      // Calculate group of first pages
+      var firstPagesStart = 1;
+      var firstPagesEnd = boundaryPagesRange;
+      var firstPages = createRange.createRange(firstPagesStart, firstPagesEnd).map(paginationIndicator);
+      // Calculate group of last pages
+      var lastPagesStart = pageCount + 1 - boundaryPagesRange;
+      var lastPagesEnd = pageCount;
+      var lastPages = createRange.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.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) : React.createElement(TruncateIndicator.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) : React.createElement(TruncateIndicator.TruncateIndicator, {
+        key: secondEllipsisPageNumber
+      }));
+      // Add group of last pages
+      items.push.apply(items, lastPages);
+    }
+    return items;
+  };
+  var previousPageDisabled = currentPage <= 1;
+  var nextPageDisabled = currentPage >= pageCount;
+  return React.createElement("nav", tslib.__assign({
+    className: classnames(Pagination_module.container, classNameOverride)
+  }, restProps), React.createElement(DirectionalLink.DirectionalLink, {
+    label: ariaLabelPreviousPage,
+    direction: "prev",
+    disabled: previousPageDisabled,
+    onClick: function () {
+      return handleButtonClick("prev");
+    }
+  }), React.createElement("div", {
+    className: Pagination_module.pagesIndicatorWrapper
+  }, pagination()), React.createElement(DirectionalLink.DirectionalLink, {
+    label: ariaLabelNextPage,
+    direction: "next",
+    disabled: nextPageDisabled,
+    onClick: function () {
+      return handleButtonClick("next");
+    }
+  }));
+};
+exports.Pagination = Pagination;
+//# sourceMappingURL=Pagination.cjs.map

package/dist/cjs/Pagination/Pagination.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.cjs","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/cjs/Pagination/Pagination.module.scss.cjs

@@ -0,0 +1,11 @@
+'use strict';
+
+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"
+};
+module.exports = styles;
+//# sourceMappingURL=Pagination.module.scss.cjs.map

package/dist/cjs/Pagination/Pagination.module.scss.cjs.map

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

package/dist/cjs/{Button → Pagination/subcomponents}/DirectionalLink/DirectionalLink.cjs

@@ -3,12 +3,12 @@
 var tslib = require('tslib');
 var React = require('react');
 require('uuid');
-require('../../Icon/subcomponents/SVG/SVG.cjs');
-var ArrowBackwardIcon = require('../../Icon/ArrowBackwardIcon.cjs');
-var ArrowForwardIcon = require('../../Icon/ArrowForwardIcon.cjs');
-var EndIcon = require('../../Icon/EndIcon.cjs');
-var StartIcon = require('../../Icon/StartIcon.cjs');
-var GenericButton = require('../GenericButton/GenericButton.cjs');
+require('../../../Icon/subcomponents/SVG/SVG.cjs');
+var ArrowBackwardIcon = require('../../../Icon/ArrowBackwardIcon.cjs');
+var ArrowForwardIcon = require('../../../Icon/ArrowForwardIcon.cjs');
+var EndIcon = require('../../../Icon/EndIcon.cjs');
+var StartIcon = require('../../../Icon/StartIcon.cjs');
+var GenericButton = require('../../../Button/GenericButton/GenericButton.cjs');
 var iconMap = {
   prev: React.createElement(ArrowBackwardIcon.ArrowBackwardIcon, {
     role: "presentation"

package/dist/cjs/Pagination/subcomponents/DirectionalLink/DirectionalLink.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DirectionalLink.cjs","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,CAAAA,iBAAA;IAACC,IAAI,EAAC;GAAiB,CAAA;EAC/CC,IAAI,EAAEJ,KAAC,CAAAC,aAAA,CAAAI,gBAAgB,CAAAA,gBAAA;IAACF,IAAI,EAAC;GAAiB,CAAA;EAC9CG,KAAK,EAAEN,KAAC,CAAAC,aAAA,CAAAM,SAAS,CAAAA,SAAA;IAACJ,IAAI,EAAC;GAAiB,CAAA;EACxCK,GAAG,EAAER,KAAC,CAAAC,aAAA,CAAAQ,OAAO,CAAAA,OAAA;IAACN,IAAI,EAAC;GAAiB;CACrC;AAED;;;AAGG;AAHH,MAIaO,eAAe;EAAA,MAAfA,eAAe,GAAG,SAAAA,CAACC,KAA2B,EAAkB;IAAA,OAC3EX,KAAA,CAAAC,aAAA,CAACW,2BAAa,EAAAC,KAAAA,CAAAA,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/cjs/{Button → Pagination/subcomponents}/PaginationLink/PaginationLink.cjs

@@ -2,7 +2,7 @@
 
 var tslib = require('tslib');
 var React = require('react');
-var GenericButton = require('../GenericButton/GenericButton.cjs');
+var GenericButton = require('../../../Button/GenericButton/GenericButton.cjs');
 
 /**
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082092975/Pagination Guidance} |

package/dist/cjs/Pagination/subcomponents/PaginationLink/PaginationLink.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaginationLink.cjs","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,KAAAA,CAAAA,MAAA,CAAAH,EAAA,EAFiB,cAG9B,CADa;IAC0B,OACtCI,KAAA,CAAAC,aAAA,CAACC,aAAAA,CAAAA,aAAa,EAAAC,KAAAA,CAAAA,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/cjs/Pagination/subcomponents/TruncateIndicator/TruncateIndicator.cjs

@@ -0,0 +1,18 @@
+'use strict';
+
+var React = require('react');
+require('tslib');
+require('uuid');
+require('../../../Icon/subcomponents/SVG/SVG.cjs');
+var EllipsisIcon = require('../../../Icon/EllipsisIcon.cjs');
+var TruncateIndicator_module = require('./TruncateIndicator.module.scss.cjs');
+var TruncateIndicator = function () {
+  return React.createElement("div", {
+    className: TruncateIndicator_module.truncateIndicatorWrapper,
+    "data-testid": "truncate-indicator"
+  }, React.createElement(EllipsisIcon.EllipsisIcon, {
+    role: "presentation"
+  }));
+};
+exports.TruncateIndicator = TruncateIndicator;
+//# sourceMappingURL=TruncateIndicator.cjs.map

package/dist/cjs/Pagination/subcomponents/TruncateIndicator/TruncateIndicator.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TruncateIndicator.cjs","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,OAClDC,KACE,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAAC,SAAS,EAAEC,wBAAM,CAACC,wBAAwB;mBAC9B;EAAoB,CAAA,EAEhCJ,KAAC,CAAAC,aAAA,CAAAI,YAAY,CAAAA,YAAA,EAAC;IAAAC,IAAI,EAAC;IAAiB,CAChC;AAN4C,CAAA;"}

package/dist/cjs/Pagination/subcomponents/TruncateIndicator/TruncateIndicator.module.scss.cjs

@@ -0,0 +1,7 @@
+'use strict';
+
+var styles = {
+  "truncateIndicatorWrapper": "TruncateIndicator-module_truncateIndicatorWrapper__FgApk"
+};
+module.exports = styles;
+//# sourceMappingURL=TruncateIndicator.module.scss.cjs.map