@hitachivantara/uikit-react-core 5.23.0 → 5.24.0

package/dist/esm/components/BaseCheckBox/BaseCheckBox.styles.js

@@ -1,45 +1,20 @@
-import _styled from "@emotion/styled/base";
-import { Checkbox, checkboxClasses } from "@mui/material";
 import { theme } from "@hitachivantara/uikit-styles";
-import { transientOptions } from "../../utils/transientOptions.js";
 import { outlineStyles } from "../../utils/focusUtils.js";
-function _extends() {
-  _extends = Object.assign ? Object.assign.bind() : function(target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-    return target;
-  };
-  return _extends.apply(this, arguments);
-}
-const StyledCheckedBox = /* @__PURE__ */ _styled(Checkbox, process.env.NODE_ENV === "production" ? _extends({}, {
-  target: "edk6te40"
-}, transientOptions) : _extends({}, {
-  target: "edk6te40",
-  label: "StyledCheckedBox"
-}, transientOptions))(({
-  $focusVisible
-}) => ({
-  padding: 0,
-  borderRadius: theme.baseCheckBox.borderRadius,
-  cursor: "pointer",
-  "&:hover": {
-    backgroundColor: theme.baseCheckBox.hoverColor
-  },
-  ...$focusVisible && {
-    "& svg": {
-      ...outlineStyles
+import { createClasses } from "../../utils/classes.js";
+const {
+  staticClasses,
+  useClasses
+} = createClasses("HvBaseCheckBox", {
+  root: {
+    padding: 0,
+    borderRadius: theme.baseCheckBox.borderRadius,
+    cursor: "pointer",
+    "&:hover": {
+      backgroundColor: theme.baseCheckBox.hoverColor
     }
   },
-  // Override Mui styling: https://mui.com/material-ui/api/checkbox/#css
-  [`&.${checkboxClasses.disabled}`]: {
-    // Ensure more specificity than .MuiButtonBase-root.Mui-disabled and .MuiIconButton-root.Mui-disabled
-    [`&.${checkboxClasses.root}`]: {
+  disabled: {
+    "&$root": {
       cursor: "not-allowed",
       pointerEvents: "initial"
     },
@@ -48,9 +23,16 @@ const StyledCheckedBox = /* @__PURE__ */ _styled(Checkbox, process.env.NODE_ENV
         fill: theme.colors.secondary_60
       }
     }
-  }
-}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQmFzZUNoZWNrQm94L0Jhc2VDaGVja0JveC5zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBWWdDIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQmFzZUNoZWNrQm94L0Jhc2VDaGVja0JveC5zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBDaGVja2JveCBhcyBNdWlDaGVja0JveCxcbiAgY2hlY2tib3hDbGFzc2VzIGFzIE11aUNoZWNrQm94Q2xhc3Nlcyxcbn0gZnJvbSBcIkBtdWkvbWF0ZXJpYWxcIjtcblxuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5cbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcblxuaW1wb3J0IHsgdHJhbnNpZW50T3B0aW9ucyB9IGZyb20gXCJAY29yZS91dGlscy90cmFuc2llbnRPcHRpb25zXCI7XG5pbXBvcnQgeyBvdXRsaW5lU3R5bGVzIH0gZnJvbSBcIkBjb3JlL3V0aWxzL2ZvY3VzVXRpbHNcIjtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZENoZWNrZWRCb3ggPSBzdHlsZWQoXG4gIE11aUNoZWNrQm94LFxuICB0cmFuc2llbnRPcHRpb25zXG4pKCh7ICRmb2N1c1Zpc2libGUgfTogeyAkZm9jdXNWaXNpYmxlOiBib29sZWFuIH0pID0+ICh7XG4gIHBhZGRpbmc6IDAsXG4gIGJvcmRlclJhZGl1czogdGhlbWUuYmFzZUNoZWNrQm94LmJvcmRlclJhZGl1cyxcbiAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgXCImOmhvdmVyXCI6IHtcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmJhc2VDaGVja0JveC5ob3ZlckNvbG9yLFxuICB9LFxuXG4gIC4uLigkZm9jdXNWaXNpYmxlICYmIHtcbiAgICBcIiYgc3ZnXCI6IHtcbiAgICAgIC4uLm91dGxpbmVTdHlsZXMsXG4gICAgfSxcbiAgfSksXG5cbiAgLy8gT3ZlcnJpZGUgTXVpIHN0eWxpbmc6IGh0dHBzOi8vbXVpLmNvbS9tYXRlcmlhbC11aS9hcGkvY2hlY2tib3gvI2Nzc1xuICBbYCYuJHtNdWlDaGVja0JveENsYXNzZXMuZGlzYWJsZWR9YF06IHtcbiAgICAvLyBFbnN1cmUgbW9yZSBzcGVjaWZpY2l0eSB0aGFuIC5NdWlCdXR0b25CYXNlLXJvb3QuTXVpLWRpc2FibGVkIGFuZCAuTXVpSWNvbkJ1dHRvbi1yb290Lk11aS1kaXNhYmxlZFxuICAgIFtgJi4ke011aUNoZWNrQm94Q2xhc3Nlcy5yb290fWBdOiB7XG4gICAgICBjdXJzb3I6IFwibm90LWFsbG93ZWRcIixcbiAgICAgIHBvaW50ZXJFdmVudHM6IFwiaW5pdGlhbFwiLFxuICAgIH0sXG5cbiAgICBcIiYgc3ZnXCI6IHtcbiAgICAgIFwiJiBwYXRoOm50aC1vZi10eXBlKDIpXCI6IHtcbiAgICAgICAgZmlsbDogdGhlbWUuY29sb3JzLnNlY29uZGFyeV82MCxcbiAgICAgIH0sXG4gICAgfSxcbiAgfSxcbn0pKTtcbiJdfQ== */");
+  },
+  focusVisible: {
+    "& svg": {
+      ...outlineStyles
+    }
+  },
+  icon: {}
+});
 export {
-  StyledCheckedBox
+  staticClasses,
+  useClasses
 };
 //# sourceMappingURL=BaseCheckBox.styles.js.map

package/dist/esm/components/BaseCheckBox/BaseCheckBox.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseCheckBox.styles.js","sources":["../../../../src/components/BaseCheckBox/BaseCheckBox.styles.ts"],"sourcesContent":["import {\n  Checkbox as MuiCheckBox,\n  checkboxClasses as MuiCheckBoxClasses,\n} from \"@mui/material\";\n\nimport styled from \"@emotion/styled\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { transientOptions } from \"@core/utils/transientOptions\";\nimport { outlineStyles } from \"@core/utils/focusUtils\";\n\nexport const StyledCheckedBox = styled(\n  MuiCheckBox,\n  transientOptions\n)(({ $focusVisible }: { $focusVisible: boolean }) => ({\n  padding: 0,\n  borderRadius: theme.baseCheckBox.borderRadius,\n  cursor: \"pointer\",\n  \"&:hover\": {\n    backgroundColor: theme.baseCheckBox.hoverColor,\n  },\n\n  ...($focusVisible && {\n    \"& svg\": {\n      ...outlineStyles,\n    },\n  }),\n\n  // Override Mui styling: https://mui.com/material-ui/api/checkbox/#css\n  [`&.${MuiCheckBoxClasses.disabled}`]: {\n    // Ensure more specificity than .MuiButtonBase-root.Mui-disabled and .MuiIconButton-root.Mui-disabled\n    [`&.${MuiCheckBoxClasses.root}`]: {\n      cursor: \"not-allowed\",\n      pointerEvents: \"initial\",\n    },\n\n    \"& svg\": {\n      \"& path:nth-of-type(2)\": {\n        fill: theme.colors.secondary_60,\n      },\n    },\n  },\n}));\n"],"names":["StyledCheckedBox","MuiCheckBox","process","env","NODE_ENV","_extends","target","transientOptions","label","$focusVisible","padding","borderRadius","theme","baseCheckBox","cursor","backgroundColor","hoverColor","outlineStyles","MuiCheckBoxClasses","disabled","root","pointerEvents","fill","colors","secondary_60"],"mappings":";;;;;;;;;;;;;;;;;;;AAYaA,MAAAA,2CACXC,UAAWC,QAAAC,IAAAC,4BAAAC,SAAA,IAAA;AAAA,EAAAC,QAAA;AAAA,GACXC,gBAAgB,IAAAF,SAAA,IAAA;AAAA,EAAAC,QAAA;AAAA,EAAAE,OAAA;AAAA,GAAhBD,gBAAgB,CAClB,EAAE,CAAC;AAAA,EAAEE;AAA0C,OAAO;AAAA,EACpDC,SAAS;AAAA,EACTC,cAAcC,MAAMC,aAAaF;AAAAA,EACjCG,QAAQ;AAAA,EACR,WAAW;AAAA,IACTC,iBAAiBH,MAAMC,aAAaG;AAAAA,EACtC;AAAA,EAEA,GAAIP,iBAAiB;AAAA,IACnB,SAAS;AAAA,MACP,GAAGQ;AAAAA,IACL;AAAA,EACF;AAAA;AAAA,EAGA,CAAE,KAAIC,gBAAmBC,UAAU,GAAG;AAAA;AAAA,IAEpC,CAAE,KAAID,gBAAmBE,MAAM,GAAG;AAAA,MAChCN,QAAQ;AAAA,MACRO,eAAe;AAAA,IACjB;AAAA,IAEA,SAAS;AAAA,MACP,yBAAyB;AAAA,QACvBC,MAAMV,MAAMW,OAAOC;AAAAA,MACrB;AAAA,IACF;AAAA,EACF;AACF,IAAEtB,QAAAC,IAAAC,aAAC,eAAA,KAAA,qiEAAA;"}
+{"version":3,"file":"BaseCheckBox.styles.js","sources":["../../../../src/components/BaseCheckBox/BaseCheckBox.styles.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"@core/utils/focusUtils\";\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvBaseCheckBox\", {\n  root: {\n    padding: 0,\n    borderRadius: theme.baseCheckBox.borderRadius,\n    cursor: \"pointer\",\n    \"&:hover\": {\n      backgroundColor: theme.baseCheckBox.hoverColor,\n    },\n  },\n  disabled: {\n    \"&$root\": {\n      cursor: \"not-allowed\",\n      pointerEvents: \"initial\",\n    },\n\n    \"& svg\": {\n      \"& path:nth-of-type(2)\": {\n        fill: theme.colors.secondary_60,\n      },\n    },\n  },\n  focusVisible: {\n    \"& svg\": {\n      ...outlineStyles,\n    },\n  },\n  icon: {},\n});\n"],"names":["staticClasses","useClasses","createClasses","root","padding","borderRadius","theme","baseCheckBox","cursor","backgroundColor","hoverColor","disabled","pointerEvents","fill","colors","secondary_60","focusVisible","outlineStyles","icon"],"mappings":";;;AAKa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,kBAAkB;AAAA,EAC3EC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,cAAcC,MAAMC,aAAaF;AAAAA,IACjCG,QAAQ;AAAA,IACR,WAAW;AAAA,MACTC,iBAAiBH,MAAMC,aAAaG;AAAAA,IACtC;AAAA,EACF;AAAA,EACAC,UAAU;AAAA,IACR,UAAU;AAAA,MACRH,QAAQ;AAAA,MACRI,eAAe;AAAA,IACjB;AAAA,IAEA,SAAS;AAAA,MACP,yBAAyB;AAAA,QACvBC,MAAMP,MAAMQ,OAAOC;AAAAA,MACrB;AAAA,IACF;AAAA,EACF;AAAA,EACAC,cAAc;AAAA,IACZ,SAAS;AAAA,MACP,GAAGC;AAAAA,IACL;AAAA,EACF;AAAA,EACAC,MAAM,CAAC;AACT,CAAC;"}

package/dist/esm/components/BaseDropdown/BaseDropdown.js

@@ -1,6 +1,5 @@
 import React__default, { useState, useCallback, useMemo } from "react";
 import { createPortal } from "react-dom";
-import { clsx } from "clsx";
 import { ClickAwayListener } from "@mui/material";
 import { theme } from "@hitachivantara/uikit-styles";
 import { DropUpXS, DropDownXS } from "@hitachivantara/uikit-react-icons";
@@ -14,16 +13,17 @@ import { useDefaultProps } from "../../hooks/useDefaultProps.js";
 import { isKey, isOneOfKeys } from "../../utils/keyboardUtils.js";
 import { setId } from "../../utils/setId.js";
 import { getFirstAndLastFocus } from "../../utils/focusableElementFinder.js";
-import { StyledHeaderRoot, StyledSelection, StyledPlaceholder, StyledAdornment, StyledContainer, StyledExtension, StyledPanel, StyledRoot, StyledAnchor } from "./BaseDropdown.styles.js";
-import baseDropdownClasses from "./baseDropdownClasses.js";
+import { useClasses } from "./BaseDropdown.styles.js";
+import { staticClasses } from "./BaseDropdown.styles.js";
 import { jsxs, jsx } from "@emotion/react/jsx-runtime";
 import BaseDropdownContext from "./BaseDropdownContext/BaseDropdownContext.js";
+import { HvTypography } from "../Typography/Typography.js";
 const HvBaseDropdown = (props) => {
   var _a;
   const {
     id,
     className,
-    classes,
+    classes: classesProp,
     children,
     role,
     placeholder,
@@ -42,8 +42,13 @@ const HvBaseDropdown = (props) => {
     onToggle,
     onClickOutside,
     onContainerCreation,
+    "aria-expanded": ariaExpandedProp,
     ...others
   } = useDefaultProps("HvBaseDropdown", props);
+  const {
+    classes,
+    cx
+  } = useClasses(classesProp);
   const {
     rootId
   } = useTheme();
@@ -54,6 +59,7 @@ const HvBaseDropdown = (props) => {
   const handleDropdownHeaderRefProp = useForkRef(dropdownHeaderRefProp, dropdownHeaderProps == null ? void 0 : dropdownHeaderProps.ref);
   const handleDropdownHeaderRef = useForkRef(setReferenceElement, handleDropdownHeaderRefProp);
   const ariaRole = role || (component == null ? "combobox" : void 0);
+  const ariaExpanded = ariaExpandedProp ?? (ariaRole ? !!isOpen : void 0);
   const elementId = useUniqueId(id, "hvbasedropdown");
   const bottom = placement && `bottom-${placement === "right" ? "start" : "end"}`;
   const extensionWidth = referenceElement ? referenceElement == null ? void 0 : referenceElement.offsetWidth : "inherit";
@@ -166,18 +172,20 @@ const HvBaseDropdown = (props) => {
   const headerComponent = (() => {
     if (component) {
       return React__default.cloneElement(component, {
-        ref: handleDropdownHeaderRef
+        ref: handleDropdownHeaderRef,
+        "aria-controls": isOpen ? setId(elementId, "children-container") : void 0
       });
     }
     const ExpanderComponent = isOpen ? DropUpXS : DropDownXS;
-    return /* @__PURE__ */ jsxs(StyledHeaderRoot, {
+    return /* @__PURE__ */ jsxs("div", {
       id: setId(id, "header"),
-      className: clsx(baseDropdownClasses.header, classes == null ? void 0 : classes.header, disabled && clsx(baseDropdownClasses.headerDisabled, classes == null ? void 0 : classes.headerDisabled), readOnly && clsx(baseDropdownClasses.headerReadOnly, classes == null ? void 0 : classes.headerReadOnly), isOpen && clsx(baseDropdownClasses.headerOpen, classes == null ? void 0 : classes.headerOpen), isOpen && popperPlacement.includes("top") && clsx(baseDropdownClasses.headerOpenUp, classes == null ? void 0 : classes.headerOpenUp), isOpen && popperPlacement.includes("bottom") && clsx(baseDropdownClasses.headerOpenDown, classes == null ? void 0 : classes.headerOpenDown)),
-      $disabled: disabled,
-      $readOnly: readOnly,
-      $opened: isOpen,
-      $openedUp: isOpen && popperPlacement.includes("top"),
-      $openedDown: isOpen && popperPlacement.includes("bottom"),
+      className: cx(classes.header, {
+        [classes.headerDisabled]: disabled,
+        [classes.headerReadOnly]: readOnly,
+        [classes.headerOpen]: isOpen,
+        [classes.headerOpenUp]: isOpen && popperPlacement.includes("top"),
+        [classes.headerOpenDown]: isOpen && popperPlacement.includes("bottom")
+      }),
       role: ariaRole === "combobox" ? "textbox" : void 0,
       style: disabled || readOnly ? {
         pointerEvents: "none"
@@ -188,19 +196,21 @@ const HvBaseDropdown = (props) => {
       tabIndex: disabled ? -1 : 0,
       ref: handleDropdownHeaderRef,
       ...dropdownHeaderProps,
-      children: [/* @__PURE__ */ jsx(StyledSelection, {
-        className: clsx(baseDropdownClasses.selection, classes == null ? void 0 : classes.selection),
-        children: placeholder && typeof placeholder === "string" ? /* @__PURE__ */ jsx(StyledPlaceholder, {
-          className: clsx(baseDropdownClasses.placeholder, classes == null ? void 0 : classes.placeholder, disabled && clsx(baseDropdownClasses.selectionDisabled, classes == null ? void 0 : classes.selectionDisabled)),
-          $disabled: disabled,
+      children: [/* @__PURE__ */ jsx("div", {
+        className: classes.selection,
+        children: placeholder && typeof placeholder === "string" ? /* @__PURE__ */ jsx(HvTypography, {
+          className: cx(classes.placeholder, {
+            [classes.selectionDisabled]: disabled
+          }),
           variant: "body",
           children: placeholder
         }) : placeholder
-      }), /* @__PURE__ */ jsx(StyledAdornment, {
+      }), /* @__PURE__ */ jsx("div", {
+        className: classes.arrowContainer,
         children: adornment || /* @__PURE__ */ jsx(ExpanderComponent, {
           iconSize: "XS",
           color: disabled ? theme.colors.secondary_60 : void 0,
-          className: clsx(baseDropdownClasses.arrow, classes == null ? void 0 : classes.arrow)
+          className: classes.arrow
         })
       })]
     });
@@ -227,42 +237,41 @@ const HvBaseDropdown = (props) => {
         onToggle == null ? void 0 : onToggle(event, false);
       }
     };
-    const container = /* @__PURE__ */ jsx(StyledContainer, {
+    const container = /* @__PURE__ */ jsx("div", {
       role: "tooltip",
       ref: setPopperElement,
-      className: clsx(baseDropdownClasses.container, classes == null ? void 0 : classes.container),
+      className: classes.container,
       style: popperStyles.popper,
       ...attributes.popper,
       children: /* @__PURE__ */ jsx(ClickAwayListener, {
         onClickAway: handleOutside,
         children: /* @__PURE__ */ jsxs("div", {
           onKeyDown: handleContainerKeyDown,
-          children: [popperPlacement.includes("bottom") && /* @__PURE__ */ jsx(StyledExtension, {
+          children: [popperPlacement.includes("bottom") && /* @__PURE__ */ jsx("div", {
             style: {
               width: extensionWidth
             },
-            className: clsx(baseDropdownClasses.inputExtensionOpen, classes == null ? void 0 : classes.inputExtensionOpen, popperPlacement.includes("end") && clsx(baseDropdownClasses.inputExtensionLeftPosition, classes == null ? void 0 : classes.inputExtensionLeftPosition)),
-            $leftPosition: popperPlacement.includes("end"),
-            $openShadow: false,
-            $floatLeft: false,
-            $floatRight: false
+            className: cx(classes.inputExtensionOpen, {
+              [classes.inputExtensionLeftPosition]: popperPlacement.includes("end")
+            })
           }), /* @__PURE__ */ jsx(BaseDropdownContext.Provider, {
             value: popperMaxSize,
-            children: /* @__PURE__ */ jsx(StyledPanel, {
+            children: /* @__PURE__ */ jsx("div", {
               id: setId(elementId, "children-container"),
-              className: clsx(baseDropdownClasses.panel, classes == null ? void 0 : classes.panel),
-              $popperPlacement: popperPlacement.includes("top") ? "top" : "bottom",
+              className: cx(classes.panel, {
+                [classes.panelOpenedUp]: popperPlacement.includes("top"),
+                [classes.panelOpenedDown]: popperPlacement.includes("bottom")
+              }),
               children
             })
-          }), popperPlacement.includes("top") && /* @__PURE__ */ jsx(StyledExtension, {
+          }), popperPlacement.includes("top") && /* @__PURE__ */ jsx("div", {
             style: {
               width: extensionWidth
             },
-            className: clsx(baseDropdownClasses.inputExtensionOpen, classes == null ? void 0 : classes.inputExtensionOpen, baseDropdownClasses.inputExtensionOpenShadow, classes == null ? void 0 : classes.inputExtensionOpenShadow, popperPlacement.includes("end") && clsx(baseDropdownClasses.inputExtensionFloatRight, classes == null ? void 0 : classes.inputExtensionFloatRight), popperPlacement.includes("start") && clsx(baseDropdownClasses.inputExtensionFloatLeft, classes == null ? void 0 : classes.inputExtensionFloatLeft)),
-            $leftPosition: false,
-            $openShadow: true,
-            $floatLeft: popperPlacement.includes("start"),
-            $floatRight: popperPlacement.includes("end")
+            className: cx(classes.inputExtensionOpen, classes.inputExtensionOpenShadow, {
+              [classes.inputExtensionFloatRight]: popperPlacement.includes("end"),
+              [classes.inputExtensionFloatLeft]: popperPlacement.includes("start")
+            })
           })]
         })
       })
@@ -271,15 +280,16 @@ const HvBaseDropdown = (props) => {
       return container;
     return createPortal(container, document.getElementById(rootId || "") || document.body);
   })();
-  return /* @__PURE__ */ jsxs(StyledRoot, {
-    className: clsx(baseDropdownClasses.root, classes == null ? void 0 : classes.root),
-    children: [/* @__PURE__ */ jsx(StyledAnchor, {
+  return /* @__PURE__ */ jsxs("div", {
+    className: classes.root,
+    children: [/* @__PURE__ */ jsx("div", {
       id,
       role: ariaRole,
-      "aria-expanded": !!isOpen,
+      "aria-expanded": ariaExpanded,
       "aria-owns": isOpen ? setId(elementId, "children-container") : void 0,
-      className: clsx(className, baseDropdownClasses.anchor, classes == null ? void 0 : classes.anchor, disabled && clsx(baseDropdownClasses.rootDisabled, classes == null ? void 0 : classes.rootDisabled)),
-      $disabled: disabled,
+      className: cx(classes.anchor, {
+        [classes.rootDisabled]: disabled
+      }, className),
       ...!readOnly && {
         onKeyDown: handleToggle,
         onClick: handleToggle
@@ -292,6 +302,7 @@ const HvBaseDropdown = (props) => {
   });
 };
 export {
-  HvBaseDropdown
+  HvBaseDropdown,
+  staticClasses as baseDropdownClasses
 };
 //# sourceMappingURL=BaseDropdown.js.map

package/dist/esm/components/BaseDropdown/BaseDropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseDropdown.js","sources":["../../../../src/components/BaseDropdown/BaseDropdown.tsx"],"sourcesContent":["import React, {\n  useMemo,\n  useState,\n  useCallback,\n  KeyboardEventHandler,\n} from \"react\";\n\nimport { createPortal } from \"react-dom\";\n\nimport { clsx } from \"clsx\";\n\nimport {\n  ClickAwayListener,\n  ClickAwayListenerProps,\n  PopperPlacementType,\n  PopperProps,\n} from \"@mui/material\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { usePopper } from \"react-popper\";\nimport { detectOverflow, ModifierArguments, Options } from \"@popperjs/core\";\n\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { useForkRef } from \"@core/hooks/useForkRef\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { isKey, isOneOfKeys } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport { getFirstAndLastFocus } from \"@core/utils/focusableElementFinder\";\nimport { HvBaseProps } from \"@core/types/generic\";\n\nimport {\n  StyledAdornment,\n  StyledAnchor,\n  StyledContainer,\n  StyledExtension,\n  StyledHeaderRoot,\n  StyledPanel,\n  StyledPlaceholder,\n  StyledRoot,\n  StyledSelection,\n} from \"./BaseDropdown.styles\";\nimport BaseDropdownContext from \"./BaseDropdownContext\";\nimport baseDropdownClasses, {\n  HvBaseDropdownClasses,\n} from \"./baseDropdownClasses\";\n\nexport interface HvBaseDropdownProps\n  extends HvBaseProps<HTMLDivElement, \"placeholder\"> {\n  /**\n   * The role of the element that triggers the popup.\n   *\n   * Defaults to \"combobox\" if `component` and the default\n   * \"textbox\" header is used, undefined otherwise.\n   */\n  role?: string;\n  /**\n   * Header placeholder.\n   */\n  placeholder?: string | React.ReactNode;\n  /**\n   * If `true` the dropdown is disabled unable to be interacted, if `false` it is enabled.\n   */\n  disabled?: boolean;\n  /**\n   * If `true` the dropdown will be in read only mode, unable to be interacted.\n   */\n  readOnly?: boolean;\n  /**\n   * Disable the portal behavior.\n   * The children stay within it's parent DOM hierarchy.\n   */\n  disablePortal?: boolean;\n  /**\n   * If `true` the dropdown width depends size of content if `false` the width depends on the header size.\n   * Defaults to `false`.\n   */\n  variableWidth?: boolean;\n  /**\n   * If `true` the dropdown starts opened if `false` it starts closed.\n   */\n  expanded?: boolean;\n  /**\n   * When uncontrolled, defines the initial expanded state.\n   */\n  defaultExpanded?: boolean;\n  /**\n   * An object containing props to be wired to the popper component.\n   */\n  popperProps?: Partial<PopperProps>;\n  /**\n   * Placement of the dropdown.\n   */\n  placement?: \"left\" | \"right\";\n  /**\n   * Replacement for the header component.\n   */\n  component?: React.ReactNode;\n  /**\n   * Adornment to replace the default arrows.\n   */\n  adornment?: React.ReactNode;\n  /**\n   * When dropdown changes the expanded state.\n   */\n  onToggle?: (event: Event, open: boolean) => void;\n  /**\n   * When user click outside the open container.\n   */\n  onClickOutside?: (event: Event) => void;\n  /**\n   * Callback called when the dropdown is opened and ready,\n   * commonly used to set focus to the content.\n   */\n  onContainerCreation?: (container: HTMLElement | null) => void;\n  /**\n   * Attributes applied to the dropdown header element.\n   */\n  dropdownHeaderProps?: React.DetailedHTMLProps<\n    React.HTMLAttributes<HTMLDivElement>,\n    HTMLDivElement\n  >;\n  /**\n   * Pass a ref to the dropdown header element.\n   */\n  dropdownHeaderRef?: React.Ref<any>;\n  /**\n   * A Jss Object used to override or extend the component styles applied.\n   */\n  classes?: HvBaseDropdownClasses;\n}\n\nexport const HvBaseDropdown = (props: HvBaseDropdownProps) => {\n  const {\n    id,\n    className,\n    classes,\n    children,\n    role,\n    placeholder,\n    component,\n    adornment,\n    expanded,\n    dropdownHeaderProps,\n    defaultExpanded = false,\n    disabled = false,\n    readOnly = false,\n    disablePortal = false,\n    variableWidth = false,\n    placement = \"right\",\n    popperProps = {},\n    dropdownHeaderRef: dropdownHeaderRefProp,\n    onToggle,\n    onClickOutside,\n    onContainerCreation,\n    ...others\n  } = useDefaultProps(\"HvBaseDropdown\", props);\n  const { rootId } = useTheme();\n\n  const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));\n\n  const [referenceElement, setReferenceElement] = useState<HTMLElement | null>(\n    null\n  );\n  const [popperElement, setPopperElement] = useState<HTMLElement | null>(null);\n  const [popperMaxSize, setPopperMaxSize] = useState<{\n    width?: number;\n    height?: number;\n  }>({});\n\n  const handleDropdownHeaderRefProp = useForkRef(\n    dropdownHeaderRefProp,\n    dropdownHeaderProps?.ref\n  );\n  const handleDropdownHeaderRef = useForkRef(\n    setReferenceElement,\n    handleDropdownHeaderRefProp\n  );\n\n  const ariaRole = role || (component == null ? \"combobox\" : undefined);\n\n  const elementId = useUniqueId(id, \"hvbasedropdown\");\n\n  const bottom: PopperPlacementType =\n    placement && `bottom-${placement === \"right\" ? \"start\" : \"end\"}`;\n\n  const extensionWidth = referenceElement\n    ? referenceElement?.offsetWidth\n    : \"inherit\";\n\n  const { modifiers: popperPropsModifiers = [], ...otherPopperProps } =\n    popperProps;\n\n  const onFirstUpdate = useCallback(() => {\n    if (onContainerCreation) onContainerCreation(popperElement);\n  }, [onContainerCreation, popperElement]);\n\n  const widthCalculator = useCallback(\n    ({ state }: ModifierArguments<Options>) => {\n      state.styles.popper.width = `${state.rects.reference.width}px`;\n    },\n    []\n  );\n\n  const widthCalculatorEffect = useCallback(\n    ({ state }: ModifierArguments<Options>) => {\n      state.elements.popper.style.width = `${\n        (state.elements.reference as any).offsetWidth\n      }px`;\n    },\n    []\n  );\n\n  const applyMaxSizeCalculator = useCallback(\n    ({ state }: ModifierArguments<Options>) => {\n      // The `maxSize` modifier provides this data\n      const { width, height } = state.modifiersData.maxSize;\n      if (width !== popperMaxSize?.width || height !== popperMaxSize?.height) {\n        setPopperMaxSize({ width, height });\n      }\n\n      state.styles.popper = {\n        ...state.styles.popper,\n        maxWidth: `${width}px`,\n        maxHeight: `${height}px`,\n      };\n    },\n    [popperMaxSize]\n  );\n\n  const maxSizeCalculator = useCallback(\n    ({ state, name, options }: ModifierArguments<Options>) => {\n      const overflow = detectOverflow(state, options);\n\n      const x = state.modifiersData.preventOverflow?.x || 0;\n      const y = state.modifiersData.preventOverflow?.y || 0;\n\n      const popperWidth = state.rects.popper.width;\n      const popperHeight = state.rects.popper.height;\n\n      const basePlacement = state.placement.split(\"-\")[0];\n\n      const widthProp = basePlacement === \"left\" ? \"left\" : \"right\";\n      const heightProp = basePlacement === \"top\" ? \"top\" : \"bottom\";\n\n      state.modifiersData[name] = {\n        width: popperWidth - overflow[widthProp] - x,\n        height: popperHeight - overflow[heightProp] - y,\n      };\n    },\n    []\n  );\n\n  const modifiers: PopperProps[\"modifiers\"] = useMemo(\n    () => [\n      {\n        name: \"variableWidth\",\n        enabled: !variableWidth,\n        phase: \"beforeWrite\",\n        requires: [\"computeStyles\"],\n        fn: widthCalculator,\n        effect: widthCalculatorEffect,\n      },\n      {\n        name: \"maxSize\",\n        enabled: true,\n        phase: \"main\",\n        requiresIfExists: [\"offset\", \"preventOverflow\", \"flip\"],\n        fn: maxSizeCalculator,\n      },\n      {\n        name: \"applyMaxSize\",\n        enabled: true,\n        phase: \"beforeWrite\",\n        requires: [\"maxSize\"],\n        fn: applyMaxSizeCalculator,\n      },\n      ...popperPropsModifiers,\n    ],\n    [\n      maxSizeCalculator,\n      applyMaxSizeCalculator,\n      popperPropsModifiers,\n      variableWidth,\n      widthCalculator,\n      widthCalculatorEffect,\n    ]\n  );\n\n  const { styles: popperStyles, attributes } = usePopper(\n    referenceElement,\n    popperElement,\n    {\n      placement: bottom,\n      modifiers,\n      onFirstUpdate,\n      ...otherPopperProps,\n    }\n  );\n\n  const popperPlacement =\n    attributes.popper?.[\"data-popper-placement\"] ?? \"bottom\";\n\n  const handleToggle = useCallback(\n    (event) => {\n      if (event && !isKey(event, \"Tab\")) {\n        event.preventDefault();\n      }\n\n      const notControlKey =\n        !!event?.code &&\n        !isOneOfKeys(event, [\"Tab\", \"Enter\", \"Esc\", \"ArrowDown\", \"Space\"]);\n\n      const ignoredCombinations =\n        (isKey(event, \"Esc\") && !isOpen) ||\n        (isKey(event, \"ArrowDown\") && isOpen) ||\n        (isKey(event, \"Tab\") && !isOpen);\n\n      if (disabled || notControlKey || ignoredCombinations) return;\n\n      const newOpen = !isOpen;\n\n      /* If about to close focus on the header component. */\n      const focusHeader = () => {\n        if (!newOpen) {\n          // Focus-ring won't be visible even if using the keyboard:\n          // https://github.com/WICG/focus-visible/issues/88\n          referenceElement?.focus({ preventScroll: true });\n        }\n\n        return newOpen;\n      };\n      setIsOpen(focusHeader());\n\n      onToggle?.(event, newOpen);\n    },\n    [isOpen, disabled, setIsOpen, onToggle, referenceElement]\n  );\n\n  const headerComponent = (() => {\n    if (component) {\n      return React.cloneElement(component as React.ReactElement, {\n        ref: handleDropdownHeaderRef,\n      });\n    }\n\n    const ExpanderComponent = isOpen ? DropUpXS : DropDownXS;\n\n    return (\n      <StyledHeaderRoot\n        id={setId(id, \"header\")}\n        className={clsx(\n          baseDropdownClasses.header,\n          classes?.header,\n          disabled &&\n            clsx(baseDropdownClasses.headerDisabled, classes?.headerDisabled),\n          readOnly &&\n            clsx(baseDropdownClasses.headerReadOnly, classes?.headerReadOnly),\n          isOpen && clsx(baseDropdownClasses.headerOpen, classes?.headerOpen),\n          isOpen &&\n            popperPlacement.includes(\"top\") &&\n            clsx(baseDropdownClasses.headerOpenUp, classes?.headerOpenUp),\n          isOpen &&\n            popperPlacement.includes(\"bottom\") &&\n            clsx(baseDropdownClasses.headerOpenDown, classes?.headerOpenDown)\n        )}\n        $disabled={disabled}\n        $readOnly={readOnly}\n        $opened={isOpen}\n        $openedUp={isOpen && popperPlacement.includes(\"top\")}\n        $openedDown={isOpen && popperPlacement.includes(\"bottom\")}\n        role={ariaRole === \"combobox\" ? \"textbox\" : undefined}\n        style={disabled || readOnly ? { pointerEvents: \"none\" } : undefined}\n        aria-controls={\n          isOpen ? setId(elementId, \"children-container\") : undefined\n        }\n        aria-label={others[\"aria-label\"] ?? undefined}\n        aria-labelledby={others[\"aria-labelledby\"] ?? undefined}\n        // Removes the element from the navigation sequence for keyboard focus if disabled\n        tabIndex={disabled ? -1 : 0}\n        ref={handleDropdownHeaderRef}\n        {...dropdownHeaderProps}\n      >\n        <StyledSelection\n          className={clsx(baseDropdownClasses.selection, classes?.selection)}\n        >\n          {placeholder && typeof placeholder === \"string\" ? (\n            <StyledPlaceholder\n              className={clsx(\n                baseDropdownClasses.placeholder,\n                classes?.placeholder,\n                disabled &&\n                  clsx(\n                    baseDropdownClasses.selectionDisabled,\n                    classes?.selectionDisabled\n                  )\n              )}\n              $disabled={disabled}\n              variant=\"body\"\n            >\n              {placeholder}\n            </StyledPlaceholder>\n          ) : (\n            placeholder\n          )}\n        </StyledSelection>\n        <StyledAdornment>\n          {adornment || (\n            <ExpanderComponent\n              iconSize=\"XS\"\n              color={disabled ? theme.colors.secondary_60 : undefined}\n              className={clsx(baseDropdownClasses.arrow, classes?.arrow)}\n            />\n          )}\n        </StyledAdornment>\n      </StyledHeaderRoot>\n    );\n  })();\n\n  const containerComponent = (() => {\n    /**\n     *  Handle keyboard inside children container.\n     */\n    const handleContainerKeyDown: KeyboardEventHandler = (event) => {\n      if (isKey(event, \"Esc\")) {\n        handleToggle(event);\n      }\n      if (isKey(event, \"Tab\") && !event.shiftKey) {\n        const focusList = getFirstAndLastFocus(popperElement);\n        if (document.activeElement === focusList?.last) {\n          event.preventDefault();\n          focusList?.first?.focus();\n        }\n      }\n    };\n\n    const handleOutside: ClickAwayListenerProps[\"onClickAway\"] = (event) => {\n      const isButtonClick = referenceElement?.contains(event.target as any);\n      if (!isButtonClick) {\n        onClickOutside?.(event);\n        setIsOpen(false);\n        onToggle?.(event, false);\n      }\n    };\n\n    const container = (\n      <StyledContainer\n        role=\"tooltip\"\n        ref={setPopperElement}\n        className={clsx(baseDropdownClasses.container, classes?.container)}\n        style={popperStyles.popper}\n        {...attributes.popper}\n      >\n        <ClickAwayListener onClickAway={handleOutside}>\n          {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n          <div onKeyDown={handleContainerKeyDown}>\n            {popperPlacement.includes(\"bottom\") && (\n              <StyledExtension\n                style={{ width: extensionWidth }}\n                className={clsx(\n                  baseDropdownClasses.inputExtensionOpen,\n                  classes?.inputExtensionOpen,\n                  popperPlacement.includes(\"end\") &&\n                    clsx(\n                      baseDropdownClasses.inputExtensionLeftPosition,\n                      classes?.inputExtensionLeftPosition\n                    )\n                )}\n                $leftPosition={popperPlacement.includes(\"end\")}\n                $openShadow={false}\n                $floatLeft={false}\n                $floatRight={false}\n              />\n            )}\n            <BaseDropdownContext.Provider value={popperMaxSize}>\n              <StyledPanel\n                id={setId(elementId, \"children-container\")}\n                className={clsx(baseDropdownClasses.panel, classes?.panel)}\n                $popperPlacement={\n                  popperPlacement.includes(\"top\") ? \"top\" : \"bottom\"\n                }\n              >\n                {children}\n              </StyledPanel>\n            </BaseDropdownContext.Provider>\n            {popperPlacement.includes(\"top\") && (\n              <StyledExtension\n                style={{ width: extensionWidth }}\n                className={clsx(\n                  baseDropdownClasses.inputExtensionOpen,\n                  classes?.inputExtensionOpen,\n                  baseDropdownClasses.inputExtensionOpenShadow,\n                  classes?.inputExtensionOpenShadow,\n                  popperPlacement.includes(\"end\") &&\n                    clsx(\n                      baseDropdownClasses.inputExtensionFloatRight,\n                      classes?.inputExtensionFloatRight\n                    ),\n                  popperPlacement.includes(\"start\") &&\n                    clsx(\n                      baseDropdownClasses.inputExtensionFloatLeft,\n                      classes?.inputExtensionFloatLeft\n                    )\n                )}\n                $leftPosition={false}\n                $openShadow\n                $floatLeft={popperPlacement.includes(\"start\")}\n                $floatRight={popperPlacement.includes(\"end\")}\n              />\n            )}\n          </div>\n        </ClickAwayListener>\n      </StyledContainer>\n    );\n\n    if (disablePortal) return container;\n\n    return createPortal(\n      container,\n      document.getElementById(rootId || \"\") || document.body\n    );\n  })();\n\n  return (\n    <StyledRoot className={clsx(baseDropdownClasses.root, classes?.root)}>\n      <StyledAnchor\n        id={id}\n        role={ariaRole}\n        aria-expanded={!!isOpen}\n        aria-owns={isOpen ? setId(elementId, \"children-container\") : undefined}\n        className={clsx(\n          className,\n          baseDropdownClasses.anchor,\n          classes?.anchor,\n          disabled &&\n            clsx(baseDropdownClasses.rootDisabled, classes?.rootDisabled)\n        )}\n        $disabled={disabled}\n        {...(!readOnly && {\n          onKeyDown: handleToggle,\n          onClick: handleToggle,\n        })}\n        // Removes the element from the navigation sequence for keyboard focus\n        tabIndex={-1}\n        {...others}\n      >\n        {headerComponent}\n      </StyledAnchor>\n      {isOpen && containerComponent}\n    </StyledRoot>\n  );\n};\n"],"names":["HvBaseDropdown","props","id","className","classes","children","role","placeholder","component","adornment","expanded","dropdownHeaderProps","defaultExpanded","disabled","readOnly","disablePortal","variableWidth","placement","popperProps","dropdownHeaderRef","dropdownHeaderRefProp","onToggle","onClickOutside","onContainerCreation","others","useDefaultProps","rootId","useTheme","isOpen","setIsOpen","useControlled","Boolean","referenceElement","setReferenceElement","useState","popperElement","setPopperElement","popperMaxSize","setPopperMaxSize","handleDropdownHeaderRefProp","useForkRef","ref","handleDropdownHeaderRef","ariaRole","undefined","elementId","useUniqueId","bottom","extensionWidth","offsetWidth","modifiers","popperPropsModifiers","otherPopperProps","onFirstUpdate","useCallback","widthCalculator","state","styles","popper","width","rects","reference","widthCalculatorEffect","elements","style","applyMaxSizeCalculator","height","modifiersData","maxSize","maxWidth","maxHeight","maxSizeCalculator","name","options","overflow","detectOverflow","x","preventOverflow","y","popperWidth","popperHeight","basePlacement","split","widthProp","heightProp","useMemo","enabled","phase","requires","fn","effect","requiresIfExists","popperStyles","attributes","usePopper","popperPlacement","handleToggle","event","isKey","preventDefault","notControlKey","code","isOneOfKeys","ignoredCombinations","newOpen","focusHeader","focus","preventScroll","headerComponent","React","cloneElement","ExpanderComponent","DropUpXS","DropDownXS","StyledHeaderRoot","setId","clsx","baseDropdownClasses","header","headerDisabled","headerReadOnly","headerOpen","includes","headerOpenUp","headerOpenDown","$disabled","$readOnly","$opened","$openedUp","$openedDown","pointerEvents","tabIndex","_jsx","StyledSelection","selection","StyledPlaceholder","selectionDisabled","variant","StyledAdornment","iconSize","color","theme","colors","secondary_60","arrow","containerComponent","handleContainerKeyDown","shiftKey","focusList","getFirstAndLastFocus","document","activeElement","last","first","handleOutside","isButtonClick","contains","target","container","StyledContainer","ClickAwayListener","onClickAway","onKeyDown","StyledExtension","inputExtensionOpen","inputExtensionLeftPosition","$leftPosition","$openShadow","$floatLeft","$floatRight","BaseDropdownContext","Provider","value","StyledPanel","panel","$popperPlacement","inputExtensionOpenShadow","inputExtensionFloatRight","inputExtensionFloatLeft","createPortal","getElementById","body","StyledRoot","root","StyledAnchor","anchor","rootDisabled","onClick"],"mappings":"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"}
+{"version":3,"file":"BaseDropdown.js","sources":["../../../../src/components/BaseDropdown/BaseDropdown.tsx"],"sourcesContent":["import React, {\n  useMemo,\n  useState,\n  useCallback,\n  KeyboardEventHandler,\n} from \"react\";\n\nimport { createPortal } from \"react-dom\";\n\nimport {\n  ClickAwayListener,\n  ClickAwayListenerProps,\n  PopperPlacementType,\n  PopperProps,\n} from \"@mui/material\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { usePopper } from \"react-popper\";\nimport { detectOverflow, ModifierArguments, Options } from \"@popperjs/core\";\n\nimport { HvTypography } from \"@core/components/Typography\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { useForkRef } from \"@core/hooks/useForkRef\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { isKey, isOneOfKeys } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport { getFirstAndLastFocus } from \"@core/utils/focusableElementFinder\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./BaseDropdown.styles\";\nimport BaseDropdownContext from \"./BaseDropdownContext\";\n\nexport { staticClasses as baseDropdownClasses };\n\nexport type HvBaseDropdownClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvBaseDropdownProps\n  extends HvBaseProps<HTMLDivElement, \"placeholder\"> {\n  /**\n   * The role of the element that triggers the popup.\n   *\n   * Defaults to \"combobox\" if `component` and the default\n   * \"textbox\" header is used, undefined otherwise.\n   */\n  role?: string;\n  /**\n   * Header placeholder.\n   */\n  placeholder?: string | React.ReactNode;\n  /**\n   * If `true` the dropdown is disabled unable to be interacted, if `false` it is enabled.\n   */\n  disabled?: boolean;\n  /**\n   * If `true` the dropdown will be in read only mode, unable to be interacted.\n   */\n  readOnly?: boolean;\n  /**\n   * Disable the portal behavior.\n   * The children stay within it's parent DOM hierarchy.\n   */\n  disablePortal?: boolean;\n  /**\n   * If `true` the dropdown width depends size of content if `false` the width depends on the header size.\n   * Defaults to `false`.\n   */\n  variableWidth?: boolean;\n  /**\n   * If `true` the dropdown starts opened if `false` it starts closed.\n   */\n  expanded?: boolean;\n  /**\n   * When uncontrolled, defines the initial expanded state.\n   */\n  defaultExpanded?: boolean;\n  /**\n   * An object containing props to be wired to the popper component.\n   */\n  popperProps?: Partial<PopperProps>;\n  /**\n   * Placement of the dropdown.\n   */\n  placement?: \"left\" | \"right\";\n  /**\n   * Replacement for the header component.\n   */\n  component?: React.ReactNode;\n  /**\n   * Adornment to replace the default arrows.\n   */\n  adornment?: React.ReactNode;\n  /**\n   * When dropdown changes the expanded state.\n   */\n  onToggle?: (event: Event, open: boolean) => void;\n  /**\n   * When user click outside the open container.\n   */\n  onClickOutside?: (event: Event) => void;\n  /**\n   * Callback called when the dropdown is opened and ready,\n   * commonly used to set focus to the content.\n   */\n  onContainerCreation?: (container: HTMLElement | null) => void;\n  /**\n   * Attributes applied to the dropdown header element.\n   */\n  dropdownHeaderProps?: React.DetailedHTMLProps<\n    React.HTMLAttributes<HTMLDivElement>,\n    HTMLDivElement\n  >;\n  /**\n   * Pass a ref to the dropdown header element.\n   */\n  dropdownHeaderRef?: React.Ref<any>;\n  /**\n   * A Jss Object used to override or extend the component styles applied.\n   */\n  classes?: HvBaseDropdownClasses;\n}\n\nexport const HvBaseDropdown = (props: HvBaseDropdownProps) => {\n  const {\n    id,\n    className,\n    classes: classesProp,\n    children,\n    role,\n    placeholder,\n    component,\n    adornment,\n    expanded,\n    dropdownHeaderProps,\n    defaultExpanded = false,\n    disabled = false,\n    readOnly = false,\n    disablePortal = false,\n    variableWidth = false,\n    placement = \"right\",\n    popperProps = {},\n    dropdownHeaderRef: dropdownHeaderRefProp,\n    onToggle,\n    onClickOutside,\n    onContainerCreation,\n    \"aria-expanded\": ariaExpandedProp,\n    ...others\n  } = useDefaultProps(\"HvBaseDropdown\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  const { rootId } = useTheme();\n\n  const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));\n\n  const [referenceElement, setReferenceElement] = useState<HTMLElement | null>(\n    null\n  );\n  const [popperElement, setPopperElement] = useState<HTMLElement | null>(null);\n  const [popperMaxSize, setPopperMaxSize] = useState<{\n    width?: number;\n    height?: number;\n  }>({});\n\n  const handleDropdownHeaderRefProp = useForkRef(\n    dropdownHeaderRefProp,\n    dropdownHeaderProps?.ref\n  );\n  const handleDropdownHeaderRef = useForkRef(\n    setReferenceElement,\n    handleDropdownHeaderRefProp\n  );\n\n  const ariaRole = role || (component == null ? \"combobox\" : undefined);\n\n  const ariaExpanded = ariaExpandedProp ?? (ariaRole ? !!isOpen : undefined);\n\n  const elementId = useUniqueId(id, \"hvbasedropdown\");\n\n  const bottom: PopperPlacementType =\n    placement && `bottom-${placement === \"right\" ? \"start\" : \"end\"}`;\n\n  const extensionWidth = referenceElement\n    ? referenceElement?.offsetWidth\n    : \"inherit\";\n\n  const { modifiers: popperPropsModifiers = [], ...otherPopperProps } =\n    popperProps;\n\n  const onFirstUpdate = useCallback(() => {\n    if (onContainerCreation) onContainerCreation(popperElement);\n  }, [onContainerCreation, popperElement]);\n\n  const widthCalculator = useCallback(\n    ({ state }: ModifierArguments<Options>) => {\n      state.styles.popper.width = `${state.rects.reference.width}px`;\n    },\n    []\n  );\n\n  const widthCalculatorEffect = useCallback(\n    ({ state }: ModifierArguments<Options>) => {\n      state.elements.popper.style.width = `${\n        (state.elements.reference as any).offsetWidth\n      }px`;\n    },\n    []\n  );\n\n  const applyMaxSizeCalculator = useCallback(\n    ({ state }: ModifierArguments<Options>) => {\n      // The `maxSize` modifier provides this data\n      const { width, height } = state.modifiersData.maxSize;\n      if (width !== popperMaxSize?.width || height !== popperMaxSize?.height) {\n        setPopperMaxSize({ width, height });\n      }\n\n      state.styles.popper = {\n        ...state.styles.popper,\n        maxWidth: `${width}px`,\n        maxHeight: `${height}px`,\n      };\n    },\n    [popperMaxSize]\n  );\n\n  const maxSizeCalculator = useCallback(\n    ({ state, name, options }: ModifierArguments<Options>) => {\n      const overflow = detectOverflow(state, options);\n\n      const x = state.modifiersData.preventOverflow?.x || 0;\n      const y = state.modifiersData.preventOverflow?.y || 0;\n\n      const popperWidth = state.rects.popper.width;\n      const popperHeight = state.rects.popper.height;\n\n      const basePlacement = state.placement.split(\"-\")[0];\n\n      const widthProp = basePlacement === \"left\" ? \"left\" : \"right\";\n      const heightProp = basePlacement === \"top\" ? \"top\" : \"bottom\";\n\n      state.modifiersData[name] = {\n        width: popperWidth - overflow[widthProp] - x,\n        height: popperHeight - overflow[heightProp] - y,\n      };\n    },\n    []\n  );\n\n  const modifiers: PopperProps[\"modifiers\"] = useMemo(\n    () => [\n      {\n        name: \"variableWidth\",\n        enabled: !variableWidth,\n        phase: \"beforeWrite\",\n        requires: [\"computeStyles\"],\n        fn: widthCalculator,\n        effect: widthCalculatorEffect,\n      },\n      {\n        name: \"maxSize\",\n        enabled: true,\n        phase: \"main\",\n        requiresIfExists: [\"offset\", \"preventOverflow\", \"flip\"],\n        fn: maxSizeCalculator,\n      },\n      {\n        name: \"applyMaxSize\",\n        enabled: true,\n        phase: \"beforeWrite\",\n        requires: [\"maxSize\"],\n        fn: applyMaxSizeCalculator,\n      },\n      ...popperPropsModifiers,\n    ],\n    [\n      maxSizeCalculator,\n      applyMaxSizeCalculator,\n      popperPropsModifiers,\n      variableWidth,\n      widthCalculator,\n      widthCalculatorEffect,\n    ]\n  );\n\n  const { styles: popperStyles, attributes } = usePopper(\n    referenceElement,\n    popperElement,\n    {\n      placement: bottom,\n      modifiers,\n      onFirstUpdate,\n      ...otherPopperProps,\n    }\n  );\n\n  const popperPlacement =\n    attributes.popper?.[\"data-popper-placement\"] ?? \"bottom\";\n\n  const handleToggle = useCallback(\n    (event) => {\n      if (event && !isKey(event, \"Tab\")) {\n        event.preventDefault();\n      }\n\n      const notControlKey =\n        !!event?.code &&\n        !isOneOfKeys(event, [\"Tab\", \"Enter\", \"Esc\", \"ArrowDown\", \"Space\"]);\n\n      const ignoredCombinations =\n        (isKey(event, \"Esc\") && !isOpen) ||\n        (isKey(event, \"ArrowDown\") && isOpen) ||\n        (isKey(event, \"Tab\") && !isOpen);\n\n      if (disabled || notControlKey || ignoredCombinations) return;\n\n      const newOpen = !isOpen;\n\n      /* If about to close focus on the header component. */\n      const focusHeader = () => {\n        if (!newOpen) {\n          // Focus-ring won't be visible even if using the keyboard:\n          // https://github.com/WICG/focus-visible/issues/88\n          referenceElement?.focus({ preventScroll: true });\n        }\n\n        return newOpen;\n      };\n      setIsOpen(focusHeader());\n\n      onToggle?.(event, newOpen);\n    },\n    [isOpen, disabled, setIsOpen, onToggle, referenceElement]\n  );\n\n  const headerComponent = (() => {\n    if (component) {\n      return React.cloneElement(component as React.ReactElement, {\n        ref: handleDropdownHeaderRef,\n        \"aria-controls\": isOpen\n          ? setId(elementId, \"children-container\")\n          : undefined,\n      });\n    }\n\n    const ExpanderComponent = isOpen ? DropUpXS : DropDownXS;\n\n    return (\n      <div\n        id={setId(id, \"header\")}\n        className={cx(classes.header, {\n          [classes.headerDisabled]: disabled,\n          [classes.headerReadOnly]: readOnly,\n          [classes.headerOpen]: isOpen,\n          [classes.headerOpenUp]: isOpen && popperPlacement.includes(\"top\"),\n          [classes.headerOpenDown]:\n            isOpen && popperPlacement.includes(\"bottom\"),\n        })}\n        role={ariaRole === \"combobox\" ? \"textbox\" : undefined}\n        style={disabled || readOnly ? { pointerEvents: \"none\" } : undefined}\n        aria-controls={\n          isOpen ? setId(elementId, \"children-container\") : undefined\n        }\n        aria-label={others[\"aria-label\"] ?? undefined}\n        aria-labelledby={others[\"aria-labelledby\"] ?? undefined}\n        // Removes the element from the navigation sequence for keyboard focus if disabled\n        tabIndex={disabled ? -1 : 0}\n        ref={handleDropdownHeaderRef}\n        {...dropdownHeaderProps}\n      >\n        <div className={classes.selection}>\n          {placeholder && typeof placeholder === \"string\" ? (\n            <HvTypography\n              className={cx(classes.placeholder, {\n                [classes.selectionDisabled]: disabled,\n              })}\n              variant=\"body\"\n            >\n              {placeholder}\n            </HvTypography>\n          ) : (\n            placeholder\n          )}\n        </div>\n        <div className={classes.arrowContainer}>\n          {adornment || (\n            <ExpanderComponent\n              iconSize=\"XS\"\n              color={disabled ? theme.colors.secondary_60 : undefined}\n              className={classes.arrow}\n            />\n          )}\n        </div>\n      </div>\n    );\n  })();\n\n  const containerComponent = (() => {\n    /**\n     *  Handle keyboard inside children container.\n     */\n    const handleContainerKeyDown: KeyboardEventHandler = (event) => {\n      if (isKey(event, \"Esc\")) {\n        handleToggle(event);\n      }\n      if (isKey(event, \"Tab\") && !event.shiftKey) {\n        const focusList = getFirstAndLastFocus(popperElement);\n        if (document.activeElement === focusList?.last) {\n          event.preventDefault();\n          focusList?.first?.focus();\n        }\n      }\n    };\n\n    const handleOutside: ClickAwayListenerProps[\"onClickAway\"] = (event) => {\n      const isButtonClick = referenceElement?.contains(event.target as any);\n      if (!isButtonClick) {\n        onClickOutside?.(event);\n        setIsOpen(false);\n        onToggle?.(event, false);\n      }\n    };\n\n    const container = (\n      <div\n        role=\"tooltip\"\n        ref={setPopperElement}\n        className={classes.container}\n        style={popperStyles.popper}\n        {...attributes.popper}\n      >\n        <ClickAwayListener onClickAway={handleOutside}>\n          {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n          <div onKeyDown={handleContainerKeyDown}>\n            {popperPlacement.includes(\"bottom\") && (\n              <div\n                style={{ width: extensionWidth }}\n                className={cx(classes.inputExtensionOpen, {\n                  [classes.inputExtensionLeftPosition]:\n                    popperPlacement.includes(\"end\"),\n                })}\n              />\n            )}\n            <BaseDropdownContext.Provider value={popperMaxSize}>\n              <div\n                id={setId(elementId, \"children-container\")}\n                className={cx(classes.panel, {\n                  [classes.panelOpenedUp]: popperPlacement.includes(\"top\"),\n                  [classes.panelOpenedDown]: popperPlacement.includes(\"bottom\"),\n                })}\n              >\n                {children}\n              </div>\n            </BaseDropdownContext.Provider>\n            {popperPlacement.includes(\"top\") && (\n              <div\n                style={{ width: extensionWidth }}\n                className={cx(\n                  classes.inputExtensionOpen,\n                  classes.inputExtensionOpenShadow,\n                  {\n                    [classes.inputExtensionFloatRight]:\n                      popperPlacement.includes(\"end\"),\n                    [classes.inputExtensionFloatLeft]:\n                      popperPlacement.includes(\"start\"),\n                  }\n                )}\n              />\n            )}\n          </div>\n        </ClickAwayListener>\n      </div>\n    );\n\n    if (disablePortal) return container;\n\n    return createPortal(\n      container,\n      document.getElementById(rootId || \"\") || document.body\n    );\n  })();\n\n  return (\n    <div className={classes.root}>\n      <div\n        id={id}\n        role={ariaRole}\n        aria-expanded={ariaExpanded}\n        aria-owns={isOpen ? setId(elementId, \"children-container\") : undefined}\n        className={cx(\n          classes.anchor,\n          { [classes.rootDisabled]: disabled },\n          className\n        )}\n        {...(!readOnly && {\n          onKeyDown: handleToggle,\n          onClick: handleToggle,\n        })}\n        // Removes the element from the navigation sequence for keyboard focus\n        tabIndex={-1}\n        {...others}\n      >\n        {headerComponent}\n      </div>\n      {isOpen && containerComponent}\n    </div>\n  );\n};\n"],"names":["HvBaseDropdown","props","id","className","classes","classesProp","children","role","placeholder","component","adornment","expanded","dropdownHeaderProps","defaultExpanded","disabled","readOnly","disablePortal","variableWidth","placement","popperProps","dropdownHeaderRef","dropdownHeaderRefProp","onToggle","onClickOutside","onContainerCreation","ariaExpandedProp","others","useDefaultProps","cx","useClasses","rootId","useTheme","isOpen","setIsOpen","useControlled","Boolean","referenceElement","setReferenceElement","useState","popperElement","setPopperElement","popperMaxSize","setPopperMaxSize","handleDropdownHeaderRefProp","useForkRef","ref","handleDropdownHeaderRef","ariaRole","undefined","ariaExpanded","elementId","useUniqueId","bottom","extensionWidth","offsetWidth","modifiers","popperPropsModifiers","otherPopperProps","onFirstUpdate","useCallback","widthCalculator","state","styles","popper","width","rects","reference","widthCalculatorEffect","elements","style","applyMaxSizeCalculator","height","modifiersData","maxSize","maxWidth","maxHeight","maxSizeCalculator","name","options","overflow","detectOverflow","x","preventOverflow","y","popperWidth","popperHeight","basePlacement","split","widthProp","heightProp","useMemo","enabled","phase","requires","fn","effect","requiresIfExists","popperStyles","attributes","usePopper","popperPlacement","handleToggle","event","isKey","preventDefault","notControlKey","code","isOneOfKeys","ignoredCombinations","newOpen","focusHeader","focus","preventScroll","headerComponent","React","cloneElement","setId","ExpanderComponent","DropUpXS","DropDownXS","header","headerDisabled","headerReadOnly","headerOpen","headerOpenUp","includes","headerOpenDown","pointerEvents","tabIndex","_jsx","selection","HvTypography","selectionDisabled","variant","arrowContainer","iconSize","color","theme","colors","secondary_60","arrow","containerComponent","handleContainerKeyDown","shiftKey","focusList","getFirstAndLastFocus","document","activeElement","last","first","handleOutside","isButtonClick","contains","target","container","ClickAwayListener","onClickAway","onKeyDown","inputExtensionOpen","inputExtensionLeftPosition","BaseDropdownContext","Provider","value","panel","panelOpenedUp","panelOpenedDown","inputExtensionOpenShadow","inputExtensionFloatRight","inputExtensionFloatLeft","createPortal","getElementById","body","root","anchor","rootDisabled","onClick"],"mappings":"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"}