@hitachivantara/uikit-react-core 5.0.0-next.12 → 5.0.0-next.15

package/dist/cjs/components/Tabs/Tabs.cjs

@@ -1,23 +1,27 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const jsxRuntime = require("@emotion/react/jsx-runtime");
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const Tabs_styles = require("./Tabs.styles.cjs");
 const tabsClasses = require("./tabsClasses.cjs");
 const clsx = require("clsx");
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const clsx__default = /* @__PURE__ */ _interopDefault(clsx);
 const HvTabs = ({
   classes,
   ...others
 }) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(Tabs_styles.StyledTabs, { classes: {
-    root: clsx__default.default(tabsClasses.default.root, classes == null ? void 0 : classes.root),
-    flexContainer: clsx__default.default(tabsClasses.default.flexContainer, classes == null ? void 0 : classes.flexContainer),
-    indicator: clsx__default.default(tabsClasses.default.indicator, classes == null ? void 0 : classes.indicator),
-    scroller: clsx__default.default(tabsClasses.default.scroller, classes == null ? void 0 : classes.scroller)
-  }, TabIndicatorProps: {
-    children: /* @__PURE__ */ jsxRuntime.jsx("div", {})
-  }, ...others });
+  return /* @__PURE__ */ jsxRuntime.jsx(Tabs_styles.StyledTabs, {
+    classes: {
+      root: clsx__default.default(tabsClasses.default.root, classes == null ? void 0 : classes.root),
+      flexContainer: clsx__default.default(tabsClasses.default.flexContainer, classes == null ? void 0 : classes.flexContainer),
+      indicator: clsx__default.default(tabsClasses.default.indicator, classes == null ? void 0 : classes.indicator),
+      scroller: clsx__default.default(tabsClasses.default.scroller, classes == null ? void 0 : classes.scroller)
+    },
+    TabIndicatorProps: {
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", {})
+    },
+    ...others
+  });
 };
 exports.HvTabs = HvTabs;
 //# sourceMappingURL=Tabs.cjs.map

package/dist/cjs/components/Tabs/Tabs.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.cjs","sources":["../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import { TabsProps as MuiTabsProps } from \"@mui/material\";\nimport { HvBaseProps } from \"../../types\";\nimport { StyledTabs } from \"./Tabs.styles\";\nimport tabsClasses, { HvTabsClasses } from \"./tabsClasses\";\nimport clsx from \"clsx\";\n\n// Mui Tabs props: https://mui.com/material-ui/api/tabs/#props\nexport type HvTabsProps = MuiTabsProps &\n  HvBaseProps<HTMLButtonElement, { onChange }> & {\n    /**\n     * The value of the currently selected Tab. If you don't want any selected Tab, you can set this property to `false`.\n     */\n    value?: any;\n    /**\n     * Callback fired when the value changes.\n     */\n    onChange?: (event: React.SyntheticEvent, value: any) => void;\n    /**\n     * A Jss Object used to override or extend the component styles.\n     */\n    classes?: HvTabsClasses;\n  };\n\n/**\n * A Tab is a graphical control element that allows multiple documents or panels to be contained within a single window.\n * Tabs can be used as a navigational widget for switching between sets of documents.\n */\nexport const HvTabs = ({ classes, ...others }: HvTabsProps) => {\n  return (\n    <StyledTabs\n      classes={{\n        root: clsx(tabsClasses.root, classes?.root),\n        flexContainer: clsx(tabsClasses.flexContainer, classes?.flexContainer),\n        indicator: clsx(tabsClasses.indicator, classes?.indicator),\n        scroller: clsx(tabsClasses.scroller, classes?.scroller),\n      }}\n      TabIndicatorProps={{ children: <div /> }}\n      {...others}\n    />\n  );\n};\n"],"names":["HvTabs","classes","others","jsx","StyledTabs","root","clsx","tabsClasses","flexContainer","indicator","scroller","children"],"mappings":";;;;;;;;AA2BO,MAAMA,SAASA,CAAC;AAAA,EAAEC;AAAAA,KAAYC;AAAoB,MAAM;AAE3D,SAAAC,2BAAA,IAACC,0BACC,SAAS;AAAA,IACPC,MAAMC,cAAAA,QAAKC,YAAAA,QAAYF,MAAMJ,mCAASI,IAAI;AAAA,IAC1CG,eAAeF,cAAAA,QAAKC,YAAAA,QAAYC,eAAeP,mCAASO,aAAa;AAAA,IACrEC,WAAWH,cAAAA,QAAKC,YAAAA,QAAYE,WAAWR,mCAASQ,SAAS;AAAA,IACzDC,UAAUJ,cAAAA,QAAKC,YAAAA,QAAYG,UAAUT,mCAASS,QAAQ;AAAA,KAExD,mBAAmB;AAAA,IAAEC,yCAAW,OAAG,EAAA;AAAA,EAAA,GAC/BT,GAAAA,OACJ,CAAA;AAEN;;"}
+{"version":3,"file":"Tabs.cjs","sources":["../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import { TabsProps as MuiTabsProps } from \"@mui/material\";\nimport { HvBaseProps } from \"../../types\";\nimport { StyledTabs } from \"./Tabs.styles\";\nimport tabsClasses, { HvTabsClasses } from \"./tabsClasses\";\nimport clsx from \"clsx\";\n\n// Mui Tabs props: https://mui.com/material-ui/api/tabs/#props\nexport type HvTabsProps = MuiTabsProps &\n  HvBaseProps<HTMLButtonElement, { onChange }> & {\n    /**\n     * The value of the currently selected Tab. If you don't want any selected Tab, you can set this property to `false`.\n     */\n    value?: any;\n    /**\n     * Callback fired when the value changes.\n     */\n    onChange?: (event: React.SyntheticEvent, value: any) => void;\n    /**\n     * A Jss Object used to override or extend the component styles.\n     */\n    classes?: HvTabsClasses;\n  };\n\n/**\n * A Tab is a graphical control element that allows multiple documents or panels to be contained within a single window.\n * Tabs can be used as a navigational widget for switching between sets of documents.\n */\nexport const HvTabs = ({ classes, ...others }: HvTabsProps) => {\n  return (\n    <StyledTabs\n      classes={{\n        root: clsx(tabsClasses.root, classes?.root),\n        flexContainer: clsx(tabsClasses.flexContainer, classes?.flexContainer),\n        indicator: clsx(tabsClasses.indicator, classes?.indicator),\n        scroller: clsx(tabsClasses.scroller, classes?.scroller),\n      }}\n      TabIndicatorProps={{ children: <div /> }}\n      {...others}\n    />\n  );\n};\n"],"names":["HvTabs","classes","others","StyledTabs","root","clsx","tabsClasses","flexContainer","indicator","scroller","TabIndicatorProps","children","_jsx"],"mappings":";;;;;;;;AA2BO,MAAMA,SAASA,CAAC;AAAA,EAAEC;AAAAA,EAAS,GAAGC;AAAoB,MAAM;AAC7D,wCACGC,YAAAA,YAAU;AAAA,IACTF,SAAS;AAAA,MACPG,MAAMC,cAAAA,QAAKC,YAAAA,QAAYF,MAAMH,mCAASG,IAAI;AAAA,MAC1CG,eAAeF,cAAAA,QAAKC,YAAAA,QAAYC,eAAeN,mCAASM,aAAa;AAAA,MACrEC,WAAWH,cAAAA,QAAKC,YAAAA,QAAYE,WAAWP,mCAASO,SAAS;AAAA,MACzDC,UAAUJ,cAAAA,QAAKC,YAAAA,QAAYG,UAAUR,mCAASQ,QAAQ;AAAA,IACxD;AAAA,IACAC,mBAAmB;AAAA,MAAEC,UAAUC,2BAAAA,IAAA,OAAA,EAAA;AAAA,IAAQ;AAAA,IAAE,GACrCV;AAAAA,EAAAA,CACJ;AAEN;;"}

package/dist/cjs/components/Tabs/Tabs.styles.cjs

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const _styled = require("@emotion/styled/base");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const material = require("@mui/material");
@@ -11,8 +11,10 @@ const StyledTabs = /* @__PURE__ */ _styled__default.default(material.Tabs, proce
   target: "ex13pr80",
   label: "StyledTabs"
 })({
+  // Root
   minHeight: 0,
   overflow: "visible",
+  // Override Mui styling: https://mui.com/material-ui/api/tabs/#css
   "& .MuiTabs-indicator": {
     display: "flex",
     justifyContent: "center",

package/dist/cjs/components/Tabs/Tabs.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.styles.cjs","sources":["../../../../src/components/Tabs/Tabs.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { Tabs as MuiTabs } from \"@mui/material\";\n\nexport const StyledTabs = styled(MuiTabs)({\n  // Root\n  minHeight: 0,\n  overflow: \"visible\",\n\n  // Override Mui styling: https://mui.com/material-ui/api/tabs/#css\n  \"& .MuiTabs-indicator\": {\n    display: \"flex\",\n    justifyContent: \"center\",\n    backgroundColor: \"transparent\",\n    \"& > div\": {\n      width: \"100%\",\n      backgroundColor: theme.colors.acce1,\n    },\n    height: 2,\n  },\n  \"& .MuiTabs-scroller\": {\n    overflow: \"visible !important\",\n  },\n  \"& .MuiTabs-flexContainer\": {\n    \"& button:first-of-type\": {\n      marginLeft: \"3px\",\n    },\n  },\n});\n"],"names":["StyledTabs","MuiTabs","process","env","NODE_ENV","target","label","minHeight","overflow","display","justifyContent","backgroundColor","width","theme","colors","acce1","height","marginLeft"],"mappings":";;;;;;;AAIO,MAAMA,aAAoBC,iCAAAA,QAAAA,SAAAA,MAAOC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EAExCC,WAAW;AAAA,EACXC,UAAU;AAAA,EAGV,wBAAwB;AAAA,IACtBC,SAAS;AAAA,IACTC,gBAAgB;AAAA,IAChBC,iBAAiB;AAAA,IACjB,WAAW;AAAA,MACTC,OAAO;AAAA,MACPD,iBAAiBE,YAAAA,MAAMC,OAAOC;AAAAA,IAChC;AAAA,IACAC,QAAQ;AAAA,EACV;AAAA,EACA,uBAAuB;AAAA,IACrBR,UAAU;AAAA,EACZ;AAAA,EACA,4BAA4B;AAAA,IAC1B,0BAA0B;AAAA,MACxBS,YAAY;AAAA,IACd;AAAA,EACF;AACF,GAACf,QAAAC,IAAAC,aAAC,eAAA,KAAA,q7CAAA;;"}
+{"version":3,"file":"Tabs.styles.cjs","sources":["../../../../src/components/Tabs/Tabs.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { Tabs as MuiTabs } from \"@mui/material\";\n\nexport const StyledTabs = styled(MuiTabs)({\n  // Root\n  minHeight: 0,\n  overflow: \"visible\",\n\n  // Override Mui styling: https://mui.com/material-ui/api/tabs/#css\n  \"& .MuiTabs-indicator\": {\n    display: \"flex\",\n    justifyContent: \"center\",\n    backgroundColor: \"transparent\",\n    \"& > div\": {\n      width: \"100%\",\n      backgroundColor: theme.colors.acce1,\n    },\n    height: 2,\n  },\n  \"& .MuiTabs-scroller\": {\n    overflow: \"visible !important\",\n  },\n  \"& .MuiTabs-flexContainer\": {\n    \"& button:first-of-type\": {\n      marginLeft: \"3px\",\n    },\n  },\n});\n"],"names":["StyledTabs","MuiTabs","process","env","NODE_ENV","target","label","minHeight","overflow","display","justifyContent","backgroundColor","width","theme","colors","acce1","height","marginLeft"],"mappings":";;;;;;;AAIO,MAAMA,aAAoBC,iCAAAA,QAAAA,SAAAA,MAAOC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA;AAAA,EAExCC,WAAW;AAAA,EACXC,UAAU;AAAA;AAAA,EAGV,wBAAwB;AAAA,IACtBC,SAAS;AAAA,IACTC,gBAAgB;AAAA,IAChBC,iBAAiB;AAAA,IACjB,WAAW;AAAA,MACTC,OAAO;AAAA,MACPD,iBAAiBE,YAAAA,MAAMC,OAAOC;AAAAA,IAChC;AAAA,IACAC,QAAQ;AAAA,EACV;AAAA,EACA,uBAAuB;AAAA,IACrBR,UAAU;AAAA,EACZ;AAAA,EACA,4BAA4B;AAAA,IAC1B,0BAA0B;AAAA,MACxBS,YAAY;AAAA,IACd;AAAA,EACF;AACF,GAACf,QAAAC,IAAAC,aAAC,eAAA,KAAA,q7CAAA;;"}

package/dist/cjs/components/Tag/Tag.cjs

@@ -1,13 +1,13 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const jsxRuntime = require("@emotion/react/jsx-runtime");
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const clsx = require("clsx");
 const React = require("react");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const Tag_styles = require("./Tag.styles.cjs");
 const utils = require("./utils.cjs");
 const tagClasses = require("./tagClasses.cjs");
-const ThemeProvider = require("../../providers/ThemeProvider.cjs");
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const useTheme = require("../../hooks/useTheme.cjs");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const clsx__default = /* @__PURE__ */ _interopDefault(clsx);
 const getColor = (customColor, type, colors) => {
@@ -42,22 +42,34 @@ const HvTag = ({
   const {
     activeTheme,
     selectedMode
-  } = React.useContext(ThemeProvider.HvThemeContext);
+  } = useTheme.useTheme();
   const getDeleteIcon = () => {
     const disabledSemanticColor = type === "semantic" ? "atmo5" : "base2";
     const {
       tabIndex = 0
     } = deleteButtonProps;
-    return /* @__PURE__ */ jsxRuntime.jsx(Tag_styles.StyledButton, { classes: {
-      startIcon: clsx__default.default(tagClasses.default.tagButton, classes == null ? void 0 : classes.tagButton),
-      focusVisible: clsx__default.default(tagClasses.default.focusVisible, classes == null ? void 0 : classes.focusVisible),
-      root: clsx__default.default(tagClasses.default.button, classes == null ? void 0 : classes.button)
-    }, "aria-label": deleteButtonArialLabel, tabIndex, variant: "secondaryGhost", ...deleteButtonProps, children: /* @__PURE__ */ jsxRuntime.jsx(Tag_styles.StyledCloseXS, { iconSize: "XS", style: {
-      ...disabled ? {
-        cursor: "not-allowed"
-      } : void 0,
-      height: 16
-    }, color: disabled ? disabledSemanticColor : "base2", $color: disabled ? disabledSemanticColor : "base2" }) });
+    return /* @__PURE__ */ jsxRuntime.jsx(Tag_styles.StyledButton, {
+      classes: {
+        startIcon: clsx__default.default(tagClasses.default.tagButton, classes == null ? void 0 : classes.tagButton),
+        focusVisible: clsx__default.default(tagClasses.default.focusVisible, classes == null ? void 0 : classes.focusVisible),
+        root: clsx__default.default(tagClasses.default.button, classes == null ? void 0 : classes.button)
+      },
+      "aria-label": deleteButtonArialLabel,
+      tabIndex,
+      variant: "secondaryGhost",
+      ...deleteButtonProps,
+      children: /* @__PURE__ */ jsxRuntime.jsx(Tag_styles.StyledCloseXS, {
+        iconSize: "XS",
+        style: {
+          ...disabled ? {
+            cursor: "not-allowed"
+          } : void 0,
+          height: 16
+        },
+        color: disabled ? disabledSemanticColor : "base2",
+        $color: disabled ? disabledSemanticColor : "base2"
+      })
+    });
   };
   const inlineStyle = {
     ...style
@@ -70,20 +82,38 @@ const HvTag = ({
     inlineStyle.backgroundColor = `${categoricalBackgroundColor}30`;
   }
   const [hover, setHover] = React.useState(false);
-  return /* @__PURE__ */ jsxRuntime.jsx(Tag_styles.StyledChip, { label, className: clsx__default.default(classes == null ? void 0 : classes.root, className, tagClasses.default.root), onMouseEnter: () => {
-    setHover(!!onClick);
-  }, onMouseLeave: () => {
-    setHover(false);
-  }, style: {
-    ...disabled ? null : inlineStyle,
-    ...hover && !disabled ? {
-      boxShadow: `0 0 0 1pt ${categoricalBackgroundColor}`
-    } : null
-  }, classes: {
-    root: clsx__default.default(tagClasses.default.chipRoot, classes == null ? void 0 : classes.chipRoot, type === "categorical" && clsx__default.default(tagClasses.default.categorical, classes == null ? void 0 : classes.categorical), disabled && clsx__default.default(tagClasses.default.disabled, classes == null ? void 0 : classes.disabled), !!onClick && clsx__default.default(tagClasses.default.clickable, classes == null ? void 0 : classes.clickable), type === "categorical" && !disabled && clsx__default.default(tagClasses.default.categoricalFocus, classes == null ? void 0 : classes.categoricalFocus), type === "categorical" && disabled && clsx__default.default(tagClasses.default.categoricalDisabled, classes == null ? void 0 : classes.categoricalDisabled)),
-    label: clsx__default.default(tagClasses.default.label, classes == null ? void 0 : classes.label),
-    deleteIcon: clsx__default.default(classes == null ? void 0 : classes.deleteIcon, tagClasses.default.deleteIcon, disabled && clsx__default.default(tagClasses.default.disabledDeleteIcon, classes == null ? void 0 : classes.disabledDeleteIcon))
-  }, deleteIcon: utils.hasDeleteAction(onDelete) && deleteIcon || getDeleteIcon(), onDelete: utils.getOnDeleteCallback(disabled, onDelete), onClick: disabled ? void 0 : onClick, role: role || (utils.hasClickAction(onClick) ? "button" : void 0), tabIndex: utils.hasDeleteAction(onDelete) ? void 0 : 0, $type: type, $disabled: disabled || false, $categoricalFocus: type === "categorical" && !disabled, $categoricalDisabled: type === "categorical" && disabled || false, $base1Color: ((_b = activeTheme == null ? void 0 : activeTheme.colors) == null ? void 0 : _b.modes[selectedMode].base1) || uikitStyles.theme.colors.base1, ...others });
+  return /* @__PURE__ */ jsxRuntime.jsx(Tag_styles.StyledChip, {
+    label,
+    className: clsx__default.default(classes == null ? void 0 : classes.root, className, tagClasses.default.root),
+    onMouseEnter: () => {
+      setHover(!!onClick);
+    },
+    onMouseLeave: () => {
+      setHover(false);
+    },
+    style: {
+      ...disabled ? null : inlineStyle,
+      ...hover && !disabled ? {
+        boxShadow: `0 0 0 1pt ${categoricalBackgroundColor}`
+      } : null
+    },
+    classes: {
+      root: clsx__default.default(tagClasses.default.chipRoot, classes == null ? void 0 : classes.chipRoot, type === "categorical" && clsx__default.default(tagClasses.default.categorical, classes == null ? void 0 : classes.categorical), disabled && clsx__default.default(tagClasses.default.disabled, classes == null ? void 0 : classes.disabled), !!onClick && clsx__default.default(tagClasses.default.clickable, classes == null ? void 0 : classes.clickable), type === "categorical" && !disabled && clsx__default.default(tagClasses.default.categoricalFocus, classes == null ? void 0 : classes.categoricalFocus), type === "categorical" && disabled && clsx__default.default(tagClasses.default.categoricalDisabled, classes == null ? void 0 : classes.categoricalDisabled)),
+      label: clsx__default.default(tagClasses.default.label, classes == null ? void 0 : classes.label),
+      deleteIcon: clsx__default.default(classes == null ? void 0 : classes.deleteIcon, tagClasses.default.deleteIcon, disabled && clsx__default.default(tagClasses.default.disabledDeleteIcon, classes == null ? void 0 : classes.disabledDeleteIcon))
+    },
+    deleteIcon: utils.hasDeleteAction(onDelete) && deleteIcon || getDeleteIcon(),
+    onDelete: utils.getOnDeleteCallback(disabled, onDelete),
+    onClick: disabled ? void 0 : onClick,
+    role: role || (utils.hasClickAction(onClick) ? "button" : void 0),
+    tabIndex: utils.hasDeleteAction(onDelete) ? void 0 : 0,
+    $type: type,
+    $disabled: disabled || false,
+    $categoricalFocus: type === "categorical" && !disabled,
+    $categoricalDisabled: type === "categorical" && disabled || false,
+    $base1Color: ((_b = activeTheme == null ? void 0 : activeTheme.colors) == null ? void 0 : _b.modes[selectedMode].base1) || uikitStyles.theme.colors.base1,
+    ...others
+  });
 };
 exports.HvTag = HvTag;
 //# sourceMappingURL=Tag.cjs.map

package/dist/cjs/components/Tag/Tag.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.cjs","sources":["../../../../src/components/Tag/Tag.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { CSSProperties, useState, useContext } from \"react\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { ChipProps as MuiChipProps } from \"@mui/material/Chip\";\nimport { HvBaseProps } from \"../../types\";\nimport { StyledChip, StyledButton, StyledCloseXS } from \"./Tag.styles\";\nimport { getOnDeleteCallback, hasDeleteAction, hasClickAction } from \"./utils\";\nimport { HvSemanticColorKeys, HvCategoricalColorKeys } from \"types/tokens\";\nimport { HvThemeContext } from \"../../providers\";\nimport { HvButtonProps } from \"../Button\";\nimport tagClasses, { HvTagClasses } from \"./tagClasses\";\n\nexport type HvTagProps = Omit<MuiChipProps, \"color\" | \"classes\"> &\n  HvBaseProps<HTMLDivElement, { children }> & {\n    /** Inline styles to be applied to the root element. */\n    style?: CSSProperties;\n    /** The label of the tag element. */\n    label?: React.ReactNode;\n    /** Indicates that the form element is disabled. */\n    disabled?: boolean;\n    /** The type of the tag element. A tag can be of semantic or categoric type. */\n    type?: \"semantic\" | \"categorical\";\n    /** Background color to be applied to the tag */\n    color?: HvSemanticColorKeys | HvCategoricalColorKeys | string;\n    /** Icon used to customize the delete icon in the Chip element */\n    deleteIcon?: React.ReactElement;\n    /**\n     * The callback fired when the delete icon is pressed.\n     * This function has to be provided to the component, in order to render the delete icon\n     * */\n    onDelete?: (event: React.MouseEvent<HTMLElement>) => void;\n    /** Callback triggered when any item is clicked. */\n    onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n    /** The role of the element with an attributed event. */\n    role?: string;\n    /** Aria properties to apply to delete button in tag */\n    deleteButtonArialLabel?: string;\n    /** Props to apply to delete button */\n    deleteButtonProps?: HvButtonProps;\n    /** A Jss Object used to override or extend the styles applied to the component. */\n    classes?: HvTagClasses;\n  };\n\nconst getColor = (customColor, type, colors) => {\n  const defaultSemanticColor = theme.colors.sema7;\n  const defaultCategoricalColor = colors.cviz1;\n\n  let backgroundColor;\n\n  if (type === \"semantic\") {\n    backgroundColor =\n      theme.colors[customColor] || customColor || defaultSemanticColor;\n  }\n  if (type === \"categorical\") {\n    backgroundColor =\n      colors[customColor] || customColor || defaultCategoricalColor;\n  }\n  return backgroundColor;\n};\n\n/**\n * A Tag is one word that describes a specific aspect of an asset. A single asset can have\n * multiple tags.\n * Use tags to highlight an item's status for quick recognition and navigation\n * Use color to indicate meanings that users can learn and recognize across products\n *\n * It leverages the Chip component from Material UI\n */\nexport const HvTag = ({\n  classes,\n  className,\n  style,\n  label,\n  disabled,\n  type = \"semantic\",\n  color,\n  deleteIcon,\n  onDelete,\n  onClick,\n  role,\n  deleteButtonArialLabel = \"Delete tag\",\n  deleteButtonProps = {},\n  ...others\n}: HvTagProps) => {\n  const { activeTheme, selectedMode } = useContext(HvThemeContext);\n\n  const getDeleteIcon = () => {\n    const disabledSemanticColor = type === \"semantic\" ? \"atmo5\" : \"base2\";\n    const { tabIndex = 0 } = deleteButtonProps;\n\n    return (\n      <StyledButton\n        classes={{\n          startIcon: clsx(tagClasses.tagButton, classes?.tagButton),\n          focusVisible: clsx(tagClasses.focusVisible, classes?.focusVisible),\n          root: clsx(tagClasses.button, classes?.button),\n        }}\n        aria-label={deleteButtonArialLabel}\n        tabIndex={tabIndex}\n        variant=\"secondaryGhost\"\n        {...deleteButtonProps}\n      >\n        <StyledCloseXS\n          iconSize=\"XS\"\n          style={{\n            ...(disabled ? { cursor: \"not-allowed\" } : undefined),\n            height: 16,\n          }}\n          color={disabled ? disabledSemanticColor : \"base2\"}\n          $color={disabled ? disabledSemanticColor : \"base2\"}\n        />\n      </StyledButton>\n    );\n  };\n\n  const inlineStyle = {\n    ...style,\n  };\n\n  let categoricalBackgroundColor;\n\n  if (type === \"semantic\") {\n    inlineStyle.backgroundColor = getColor(color, type, {});\n  } else if (type === \"categorical\") {\n    categoricalBackgroundColor = getColor(\n      color,\n      type,\n      activeTheme?.colors?.modes[selectedMode]\n    );\n\n    inlineStyle.backgroundColor = `${categoricalBackgroundColor}30`;\n  }\n\n  const [hover, setHover] = useState(false);\n\n  return (\n    <StyledChip\n      label={label}\n      className={clsx(classes?.root, className, tagClasses.root)}\n      onMouseEnter={() => {\n        setHover(!!onClick);\n      }}\n      onMouseLeave={() => {\n        setHover(false);\n      }}\n      style={{\n        ...(disabled ? null : inlineStyle),\n        ...(hover && !disabled\n          ? { boxShadow: `0 0 0 1pt ${categoricalBackgroundColor}` }\n          : null),\n      }}\n      classes={{\n        root: clsx(\n          tagClasses.chipRoot,\n          classes?.chipRoot,\n          type === \"categorical\" &&\n            clsx(tagClasses.categorical, classes?.categorical),\n          disabled && clsx(tagClasses.disabled, classes?.disabled),\n          !!onClick && clsx(tagClasses.clickable, classes?.clickable),\n          type === \"categorical\" &&\n            !disabled &&\n            clsx(tagClasses.categoricalFocus, classes?.categoricalFocus),\n          type === \"categorical\" &&\n            disabled &&\n            clsx(tagClasses.categoricalDisabled, classes?.categoricalDisabled)\n        ),\n        label: clsx(tagClasses.label, classes?.label),\n        deleteIcon: clsx(\n          classes?.deleteIcon,\n          tagClasses.deleteIcon,\n          disabled &&\n            clsx(tagClasses.disabledDeleteIcon, classes?.disabledDeleteIcon)\n        ),\n      }}\n      deleteIcon={(hasDeleteAction(onDelete) && deleteIcon) || getDeleteIcon()}\n      onDelete={getOnDeleteCallback(disabled, onDelete)}\n      onClick={disabled ? undefined : onClick}\n      role={role || (hasClickAction(onClick) ? \"button\" : undefined)}\n      tabIndex={hasDeleteAction(onDelete) ? undefined : 0}\n      $type={type}\n      $disabled={disabled || false}\n      $categoricalFocus={type === \"categorical\" && !disabled}\n      $categoricalDisabled={(type === \"categorical\" && disabled) || false}\n      $base1Color={\n        activeTheme?.colors?.modes[selectedMode].base1 || theme.colors.base1\n      }\n      {...others}\n    />\n  );\n};\n"],"names":["getColor","customColor","type","colors","defaultSemanticColor","theme","sema7","defaultCategoricalColor","cviz1","backgroundColor","HvTag","classes","className","style","label","disabled","color","deleteIcon","onDelete","onClick","role","deleteButtonArialLabel","deleteButtonProps","others","activeTheme","selectedMode","useContext","HvThemeContext","getDeleteIcon","disabledSemanticColor","tabIndex","jsx","StyledButton","startIcon","clsx","tagClasses","tagButton","focusVisible","root","button","StyledCloseXS","cursor","undefined","height","inlineStyle","categoricalBackgroundColor","modes","hover","setHover","useState","StyledChip","boxShadow","chipRoot","categorical","clickable","categoricalFocus","categoricalDisabled","disabledDeleteIcon","hasDeleteAction","getOnDeleteCallback","hasClickAction","base1"],"mappings":"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"}
+{"version":3,"file":"Tag.cjs","sources":["../../../../src/components/Tag/Tag.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { CSSProperties, useState } from \"react\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { ChipProps as MuiChipProps } from \"@mui/material/Chip\";\nimport { HvBaseProps } from \"../../types\";\nimport { StyledChip, StyledButton, StyledCloseXS } from \"./Tag.styles\";\nimport { getOnDeleteCallback, hasDeleteAction, hasClickAction } from \"./utils\";\nimport { HvSemanticColorKeys, HvCategoricalColorKeys } from \"types/tokens\";\nimport { HvButtonProps } from \"../Button\";\nimport tagClasses, { HvTagClasses } from \"./tagClasses\";\nimport { useTheme } from \"hooks\";\n\nexport type HvTagProps = Omit<MuiChipProps, \"color\" | \"classes\"> &\n  HvBaseProps<HTMLDivElement, { children }> & {\n    /** Inline styles to be applied to the root element. */\n    style?: CSSProperties;\n    /** The label of the tag element. */\n    label?: React.ReactNode;\n    /** Indicates that the form element is disabled. */\n    disabled?: boolean;\n    /** The type of the tag element. A tag can be of semantic or categoric type. */\n    type?: \"semantic\" | \"categorical\";\n    /** Background color to be applied to the tag */\n    color?: HvSemanticColorKeys | HvCategoricalColorKeys | string;\n    /** Icon used to customize the delete icon in the Chip element */\n    deleteIcon?: React.ReactElement;\n    /**\n     * The callback fired when the delete icon is pressed.\n     * This function has to be provided to the component, in order to render the delete icon\n     * */\n    onDelete?: (event: React.MouseEvent<HTMLElement>) => void;\n    /** Callback triggered when any item is clicked. */\n    onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n    /** The role of the element with an attributed event. */\n    role?: string;\n    /** Aria properties to apply to delete button in tag */\n    deleteButtonArialLabel?: string;\n    /** Props to apply to delete button */\n    deleteButtonProps?: HvButtonProps;\n    /** A Jss Object used to override or extend the styles applied to the component. */\n    classes?: HvTagClasses;\n  };\n\nconst getColor = (customColor, type, colors) => {\n  const defaultSemanticColor = theme.colors.sema7;\n  const defaultCategoricalColor = colors.cviz1;\n\n  let backgroundColor;\n\n  if (type === \"semantic\") {\n    backgroundColor =\n      theme.colors[customColor] || customColor || defaultSemanticColor;\n  }\n  if (type === \"categorical\") {\n    backgroundColor =\n      colors[customColor] || customColor || defaultCategoricalColor;\n  }\n  return backgroundColor;\n};\n\n/**\n * A Tag is one word that describes a specific aspect of an asset. A single asset can have\n * multiple tags.\n * Use tags to highlight an item's status for quick recognition and navigation\n * Use color to indicate meanings that users can learn and recognize across products\n *\n * It leverages the Chip component from Material UI\n */\nexport const HvTag = ({\n  classes,\n  className,\n  style,\n  label,\n  disabled,\n  type = \"semantic\",\n  color,\n  deleteIcon,\n  onDelete,\n  onClick,\n  role,\n  deleteButtonArialLabel = \"Delete tag\",\n  deleteButtonProps = {},\n  ...others\n}: HvTagProps) => {\n  const { activeTheme, selectedMode } = useTheme();\n\n  const getDeleteIcon = () => {\n    const disabledSemanticColor = type === \"semantic\" ? \"atmo5\" : \"base2\";\n    const { tabIndex = 0 } = deleteButtonProps;\n\n    return (\n      <StyledButton\n        classes={{\n          startIcon: clsx(tagClasses.tagButton, classes?.tagButton),\n          focusVisible: clsx(tagClasses.focusVisible, classes?.focusVisible),\n          root: clsx(tagClasses.button, classes?.button),\n        }}\n        aria-label={deleteButtonArialLabel}\n        tabIndex={tabIndex}\n        variant=\"secondaryGhost\"\n        {...deleteButtonProps}\n      >\n        <StyledCloseXS\n          iconSize=\"XS\"\n          style={{\n            ...(disabled ? { cursor: \"not-allowed\" } : undefined),\n            height: 16,\n          }}\n          color={disabled ? disabledSemanticColor : \"base2\"}\n          $color={disabled ? disabledSemanticColor : \"base2\"}\n        />\n      </StyledButton>\n    );\n  };\n\n  const inlineStyle = {\n    ...style,\n  };\n\n  let categoricalBackgroundColor;\n\n  if (type === \"semantic\") {\n    inlineStyle.backgroundColor = getColor(color, type, {});\n  } else if (type === \"categorical\") {\n    categoricalBackgroundColor = getColor(\n      color,\n      type,\n      activeTheme?.colors?.modes[selectedMode]\n    );\n\n    inlineStyle.backgroundColor = `${categoricalBackgroundColor}30`;\n  }\n\n  const [hover, setHover] = useState(false);\n\n  return (\n    <StyledChip\n      label={label}\n      className={clsx(classes?.root, className, tagClasses.root)}\n      onMouseEnter={() => {\n        setHover(!!onClick);\n      }}\n      onMouseLeave={() => {\n        setHover(false);\n      }}\n      style={{\n        ...(disabled ? null : inlineStyle),\n        ...(hover && !disabled\n          ? { boxShadow: `0 0 0 1pt ${categoricalBackgroundColor}` }\n          : null),\n      }}\n      classes={{\n        root: clsx(\n          tagClasses.chipRoot,\n          classes?.chipRoot,\n          type === \"categorical\" &&\n            clsx(tagClasses.categorical, classes?.categorical),\n          disabled && clsx(tagClasses.disabled, classes?.disabled),\n          !!onClick && clsx(tagClasses.clickable, classes?.clickable),\n          type === \"categorical\" &&\n            !disabled &&\n            clsx(tagClasses.categoricalFocus, classes?.categoricalFocus),\n          type === \"categorical\" &&\n            disabled &&\n            clsx(tagClasses.categoricalDisabled, classes?.categoricalDisabled)\n        ),\n        label: clsx(tagClasses.label, classes?.label),\n        deleteIcon: clsx(\n          classes?.deleteIcon,\n          tagClasses.deleteIcon,\n          disabled &&\n            clsx(tagClasses.disabledDeleteIcon, classes?.disabledDeleteIcon)\n        ),\n      }}\n      deleteIcon={(hasDeleteAction(onDelete) && deleteIcon) || getDeleteIcon()}\n      onDelete={getOnDeleteCallback(disabled, onDelete)}\n      onClick={disabled ? undefined : onClick}\n      role={role || (hasClickAction(onClick) ? \"button\" : undefined)}\n      tabIndex={hasDeleteAction(onDelete) ? undefined : 0}\n      $type={type}\n      $disabled={disabled || false}\n      $categoricalFocus={type === \"categorical\" && !disabled}\n      $categoricalDisabled={(type === \"categorical\" && disabled) || false}\n      $base1Color={\n        activeTheme?.colors?.modes[selectedMode].base1 || theme.colors.base1\n      }\n      {...others}\n    />\n  );\n};\n"],"names":["getColor","customColor","type","colors","defaultSemanticColor","theme","sema7","defaultCategoricalColor","cviz1","backgroundColor","HvTag","classes","className","style","label","disabled","color","deleteIcon","onDelete","onClick","role","deleteButtonArialLabel","deleteButtonProps","others","activeTheme","selectedMode","useTheme","getDeleteIcon","disabledSemanticColor","tabIndex","StyledButton","startIcon","clsx","tagClasses","tagButton","focusVisible","root","button","variant","children","StyledCloseXS","iconSize","cursor","undefined","height","$color","inlineStyle","categoricalBackgroundColor","modes","hover","setHover","useState","StyledChip","onMouseEnter","onMouseLeave","boxShadow","chipRoot","categorical","clickable","categoricalFocus","categoricalDisabled","disabledDeleteIcon","hasDeleteAction","getOnDeleteCallback","hasClickAction","$type","$disabled","$categoricalFocus","$categoricalDisabled","$base1Color","base1"],"mappings":";;;;;;;;;;;;AA2CA,MAAMA,WAAWA,CAACC,aAAaC,MAAMC,WAAW;AACxCC,QAAAA,uBAAuBC,YAAAA,MAAMF,OAAOG;AAC1C,QAAMC,0BAA0BJ,OAAOK;AAEnCC,MAAAA;AAEJ,MAAIP,SAAS,YAAY;AACvBO,sBACEJ,YAAMF,MAAAA,OAAOF,WAAW,KAAKA,eAAeG;AAAAA,EAChD;AACA,MAAIF,SAAS,eAAe;AAExBC,sBAAAA,OAAOF,WAAW,KAAKA,eAAeM;AAAAA,EAC1C;AACOE,SAAAA;AACT;AAUO,MAAMC,QAAQA,CAAC;AAAA,EACpBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAb,OAAO;AAAA,EACPc;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,yBAAyB;AAAA,EACzBC,oBAAoB,CAAC;AAAA,EACrB,GAAGC;AACO,MAAM;;AACV,QAAA;AAAA,IAAEC;AAAAA,IAAaC;AAAAA,MAAiBC,SAAU,SAAA;AAEhD,QAAMC,gBAAgBA,MAAM;AACpBC,UAAAA,wBAAwB1B,SAAS,aAAa,UAAU;AACxD,UAAA;AAAA,MAAE2B,WAAW;AAAA,IAAMP,IAAAA;AAEzB,0CACGQ,WAAAA,cAAY;AAAA,MACXnB,SAAS;AAAA,QACPoB,WAAWC,cAAAA,QAAKC,WAAAA,QAAWC,WAAWvB,mCAASuB,SAAS;AAAA,QACxDC,cAAcH,cAAAA,QAAKC,WAAAA,QAAWE,cAAcxB,mCAASwB,YAAY;AAAA,QACjEC,MAAMJ,cAAAA,QAAKC,WAAAA,QAAWI,QAAQ1B,mCAAS0B,MAAM;AAAA,MAC/C;AAAA,MACA,cAAYhB;AAAAA,MACZQ;AAAAA,MACAS,SAAQ;AAAA,MAAgB,GACpBhB;AAAAA,MAAiBiB,yCAEpBC,0BAAa;AAAA,QACZC,UAAS;AAAA,QACT5B,OAAO;AAAA,UACL,GAAIE,WAAW;AAAA,YAAE2B,QAAQ;AAAA,UAAkBC,IAAAA;AAAAA,UAC3CC,QAAQ;AAAA,QACV;AAAA,QACA5B,OAAOD,WAAWa,wBAAwB;AAAA,QAC1CiB,QAAQ9B,WAAWa,wBAAwB;AAAA,MAAA,CAAQ;AAAA,IAAA,CAExC;AAAA,EAAA;AAInB,QAAMkB,cAAc;AAAA,IAClB,GAAGjC;AAAAA,EAAAA;AAGDkC,MAAAA;AAEJ,MAAI7C,SAAS,YAAY;AACvB4C,gBAAYrC,kBAAkBT,SAASgB,OAAOd,MAAM,CAAE,CAAA;AAAA,EAAA,WAC7CA,SAAS,eAAe;AACjC6C,iCAA6B/C,SAC3BgB,OACAd,OACAsB,gDAAarB,WAAbqB,mBAAqBwB,MAAMvB,aAAa;AAG1CqB,gBAAYrC,kBAAmB,GAAEsC;AAAAA,EACnC;AAEA,QAAM,CAACE,OAAOC,QAAQ,IAAIC,eAAS,KAAK;AAExC,wCACGC,WAAAA,YAAU;AAAA,IACTtC;AAAAA,IACAF,WAAWoB,cAAKrB,QAAAA,mCAASyB,MAAMxB,WAAWqB,mBAAWG,IAAI;AAAA,IACzDiB,cAAcA,MAAM;AACT,eAAA,CAAC,CAAClC,OAAO;AAAA,IACpB;AAAA,IACAmC,cAAcA,MAAM;AAClBJ,eAAS,KAAK;AAAA,IAChB;AAAA,IACArC,OAAO;AAAA,MACL,GAAIE,WAAW,OAAO+B;AAAAA,MACtB,GAAIG,SAAS,CAAClC,WACV;AAAA,QAAEwC,WAAY,aAAYR;AAAAA,MAAAA,IAC1B;AAAA,IACN;AAAA,IACApC,SAAS;AAAA,MACPyB,MAAMJ,cAAAA,QACJC,WAAWuB,QAAAA,UACX7C,mCAAS6C,UACTtD,SAAS,iBACP8B,cAAAA,QAAKC,mBAAWwB,aAAa9C,mCAAS8C,WAAW,GACnD1C,YAAYiB,sBAAKC,WAAAA,QAAWlB,UAAUJ,mCAASI,QAAQ,GACvD,CAAC,CAACI,WAAWa,sBAAKC,mBAAWyB,WAAW/C,mCAAS+C,SAAS,GAC1DxD,SAAS,iBACP,CAACa,YACDiB,cAAAA,QAAKC,mBAAW0B,kBAAkBhD,mCAASgD,gBAAgB,GAC7DzD,SAAS,iBACPa,YACAiB,sBAAKC,WAAAA,QAAW2B,qBAAqBjD,mCAASiD,mBAAmB,CAAC;AAAA,MAEtE9C,OAAOkB,cAAAA,QAAKC,WAAAA,QAAWnB,OAAOH,mCAASG,KAAK;AAAA,MAC5CG,YAAYe,cAAAA,QACVrB,mCAASM,YACTgB,WAAWhB,QAAAA,YACXF,YACEiB,cAAAA,QAAKC,WAAAA,QAAW4B,oBAAoBlD,mCAASkD,kBAAkB,CAAC;AAAA,IAEtE;AAAA,IACA5C,YAAa6C,MAAAA,gBAAgB5C,QAAQ,KAAKD,cAAeU,cAAgB;AAAA,IACzET,UAAU6C,MAAAA,oBAAoBhD,UAAUG,QAAQ;AAAA,IAChDC,SAASJ,WAAW4B,SAAYxB;AAAAA,IAChCC,MAAMA,SAAS4C,MAAe7C,eAAAA,OAAO,IAAI,WAAWwB;AAAAA,IACpDd,UAAUiC,MAAAA,gBAAgB5C,QAAQ,IAAIyB,SAAY;AAAA,IAClDsB,OAAO/D;AAAAA,IACPgE,WAAWnD,YAAY;AAAA,IACvBoD,mBAAmBjE,SAAS,iBAAiB,CAACa;AAAAA,IAC9CqD,sBAAuBlE,SAAS,iBAAiBa,YAAa;AAAA,IAC9DsD,eACE7C,gDAAarB,WAAbqB,mBAAqBwB,MAAMvB,cAAc6C,UAASjE,kBAAMF,OAAOmE;AAAAA,IAChE,GACG/C;AAAAA,EAAAA,CACJ;AAEN;;"}

package/dist/cjs/components/Tag/Tag.styles.cjs

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const _styled = require("@emotion/styled/base");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const uikitStyles = require("@hitachivantara/uikit-styles");

package/dist/cjs/components/Tag/Tag.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.styles.cjs","sources":["../../../../src/components/Tag/Tag.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { CloseXS } from \"@hitachivantara/uikit-react-icons\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport Chip from \"@mui/material/Chip\";\nimport { HvButton } from \"components\";\nimport { CSSProperties } from \"react\";\nimport { outlineStyles } from \"utils\";\nimport fade from \"utils/hexToRgbA\";\nimport { transientOptions } from \"utils/transientOptions\";\nimport tagClasses from \"./tagClasses\";\n\nexport const StyledChip = styled(\n  Chip,\n  transientOptions\n)(\n  ({\n    $type,\n    $disabled,\n    $categoricalFocus,\n    $categoricalDisabled,\n    $base1Color,\n  }: {\n    $type: string;\n    $disabled: boolean;\n    $categoricalFocus: boolean;\n    $categoricalDisabled: boolean;\n    $base1Color: string;\n  }) => ({\n    \"&.MuiChip-root\": {\n      height: 16,\n      borderRadius: 0,\n      maxWidth: 180,\n      fontFamily: theme.fontFamily.body,\n      [`& .${tagClasses.focusVisible}`]: {\n        backgroundColor: fade(theme.colors.base1, 0.3),\n      },\n      ...($type === \"categorical\" && {\n        borderRadius: 8,\n        [`&.${tagClasses.clickable}`]: {\n          cursor: \"pointer\",\n        },\n        \"&:hover\": {\n          borderRadius: 8,\n        },\n        [`& .${tagClasses.label}`]: {\n          color: theme.colors.acce1,\n        },\n        \"&:focus:not(:focus-visible)\": {\n          outline: \"0 !important\",\n          boxShadow: \"none !important\",\n        },\n      }),\n      ...($disabled && {\n        backgroundColor: theme.colors.atmo3,\n        cursor: \"not-allowed\",\n        [`& .${tagClasses.label}`]: {\n          color: theme.colors.atmo5,\n        },\n      }),\n      ...($categoricalFocus && {\n        \"&:focus\": {\n          ...outlineStyles,\n        },\n      }),\n      ...($categoricalDisabled && {\n        backgroundColor: theme.colors.atmo3,\n        cursor: \"not-allowed\",\n        [`& .${tagClasses.label}`]: {\n          color: theme.colors.atmo5,\n        },\n        \"&:hover\": {\n          backgroundColor: theme.colors.atmo3,\n        },\n        \"&:focus\": {\n          outline: \"none\",\n        },\n      }),\n    },\n\n    \"& .MuiChip-label\": {\n      paddingLeft: theme.space.xs,\n      paddingRight: theme.space.xs,\n      ...(theme.typography.body as CSSProperties),\n      color: theme.colors.base2,\n      \"& p\": {\n        color: theme.colors.base2,\n      },\n    },\n\n    \"& .MuiChip-deleteIcon\": {\n      marginRight: 0,\n      width: 16,\n      height: 16,\n      minWidth: 16,\n      minHeight: 16,\n      padding: 0,\n      \"&:hover\": {\n        backgroundColor: `${$base1Color}30`,\n      },\n      \"&:focus\": {\n        ...outlineStyles,\n        borderRadius: 0,\n      },\n      \"&:focus:not(:focus-visible)\": {\n        outline: \"0 !important\",\n        boxShadow: \"none !important\",\n      },\n      ...($disabled && {\n        \"&:hover\": {\n          backgroundColor: theme.colors.atmo3,\n        },\n        \"&:focus\": {\n          backgroundColor: theme.colors.atmo3,\n          outline: \"none\",\n          boxShadow: \"none\",\n          outlineOffset: 0,\n        },\n      }),\n    },\n  })\n);\n\nexport const StyledButton = styled(HvButton)({\n  \"& .MuiButton-startIcon\": {\n    width: 16,\n    height: 16,\n    minWidth: 16,\n    minHeight: 16,\n    padding: 0,\n    margin: 0,\n  },\n  \"& .MuiButton-textPrimary\": {\n    background: \"transparent\",\n  },\n});\n\nexport const StyledCloseXS = styled(\n  CloseXS,\n  transientOptions\n)(({ $color }: { $color: string }) => ({\n  \"& svg .color0\": {\n    fill: theme.colors[$color],\n  },\n}));\n"],"names":["StyledChip","Chip","process","env","NODE_ENV","_extends","target","transientOptions","label","$type","$disabled","$categoricalFocus","$categoricalDisabled","$base1Color","height","borderRadius","maxWidth","fontFamily","theme","body","tagClasses","focusVisible","backgroundColor","fade","colors","base1","clickable","cursor","color","acce1","outline","boxShadow","atmo3","atmo5","outlineStyles","paddingLeft","space","xs","paddingRight","typography","base2","marginRight","width","minWidth","minHeight","padding","outlineOffset","StyledButton","HvButton","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","StyledCloseXS","CloseXS","$color","fill"],"mappings":"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"}
+{"version":3,"file":"Tag.styles.cjs","sources":["../../../../src/components/Tag/Tag.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { CloseXS } from \"@hitachivantara/uikit-react-icons\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport Chip from \"@mui/material/Chip\";\nimport { HvButton } from \"components\";\nimport { CSSProperties } from \"react\";\nimport { outlineStyles } from \"utils\";\nimport fade from \"utils/hexToRgbA\";\nimport { transientOptions } from \"utils/transientOptions\";\nimport tagClasses from \"./tagClasses\";\n\nexport const StyledChip = styled(\n  Chip,\n  transientOptions\n)(\n  ({\n    $type,\n    $disabled,\n    $categoricalFocus,\n    $categoricalDisabled,\n    $base1Color,\n  }: {\n    $type: string;\n    $disabled: boolean;\n    $categoricalFocus: boolean;\n    $categoricalDisabled: boolean;\n    $base1Color: string;\n  }) => ({\n    \"&.MuiChip-root\": {\n      height: 16,\n      borderRadius: 0,\n      maxWidth: 180,\n      fontFamily: theme.fontFamily.body,\n      [`& .${tagClasses.focusVisible}`]: {\n        backgroundColor: fade(theme.colors.base1, 0.3),\n      },\n      ...($type === \"categorical\" && {\n        borderRadius: 8,\n        [`&.${tagClasses.clickable}`]: {\n          cursor: \"pointer\",\n        },\n        \"&:hover\": {\n          borderRadius: 8,\n        },\n        [`& .${tagClasses.label}`]: {\n          color: theme.colors.acce1,\n        },\n        \"&:focus:not(:focus-visible)\": {\n          outline: \"0 !important\",\n          boxShadow: \"none !important\",\n        },\n      }),\n      ...($disabled && {\n        backgroundColor: theme.colors.atmo3,\n        cursor: \"not-allowed\",\n        [`& .${tagClasses.label}`]: {\n          color: theme.colors.atmo5,\n        },\n      }),\n      ...($categoricalFocus && {\n        \"&:focus\": {\n          ...outlineStyles,\n        },\n      }),\n      ...($categoricalDisabled && {\n        backgroundColor: theme.colors.atmo3,\n        cursor: \"not-allowed\",\n        [`& .${tagClasses.label}`]: {\n          color: theme.colors.atmo5,\n        },\n        \"&:hover\": {\n          backgroundColor: theme.colors.atmo3,\n        },\n        \"&:focus\": {\n          outline: \"none\",\n        },\n      }),\n    },\n\n    \"& .MuiChip-label\": {\n      paddingLeft: theme.space.xs,\n      paddingRight: theme.space.xs,\n      ...(theme.typography.body as CSSProperties),\n      color: theme.colors.base2,\n      \"& p\": {\n        color: theme.colors.base2,\n      },\n    },\n\n    \"& .MuiChip-deleteIcon\": {\n      marginRight: 0,\n      width: 16,\n      height: 16,\n      minWidth: 16,\n      minHeight: 16,\n      padding: 0,\n      \"&:hover\": {\n        backgroundColor: `${$base1Color}30`,\n      },\n      \"&:focus\": {\n        ...outlineStyles,\n        borderRadius: 0,\n      },\n      \"&:focus:not(:focus-visible)\": {\n        outline: \"0 !important\",\n        boxShadow: \"none !important\",\n      },\n      ...($disabled && {\n        \"&:hover\": {\n          backgroundColor: theme.colors.atmo3,\n        },\n        \"&:focus\": {\n          backgroundColor: theme.colors.atmo3,\n          outline: \"none\",\n          boxShadow: \"none\",\n          outlineOffset: 0,\n        },\n      }),\n    },\n  })\n);\n\nexport const StyledButton = styled(HvButton)({\n  \"& .MuiButton-startIcon\": {\n    width: 16,\n    height: 16,\n    minWidth: 16,\n    minHeight: 16,\n    padding: 0,\n    margin: 0,\n  },\n  \"& .MuiButton-textPrimary\": {\n    background: \"transparent\",\n  },\n});\n\nexport const StyledCloseXS = styled(\n  CloseXS,\n  transientOptions\n)(({ $color }: { $color: string }) => ({\n  \"& svg .color0\": {\n    fill: theme.colors[$color],\n  },\n}));\n"],"names":["StyledChip","Chip","process","env","NODE_ENV","_extends","target","transientOptions","label","$type","$disabled","$categoricalFocus","$categoricalDisabled","$base1Color","height","borderRadius","maxWidth","fontFamily","theme","body","tagClasses","focusVisible","backgroundColor","fade","colors","base1","clickable","cursor","color","acce1","outline","boxShadow","atmo3","atmo5","outlineStyles","paddingLeft","space","xs","paddingRight","typography","base2","marginRight","width","minWidth","minHeight","padding","outlineOffset","StyledButton","HvButton","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","StyledCloseXS","CloseXS","$color","fill"],"mappings":"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"}

package/dist/cjs/components/Tag/utils.cjs

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const getOnDeleteCallback = (tagIsDisabled, providedOnDelete) => {
   const nullCallback = () => {
   };

package/dist/cjs/components/TagsInput/TagsInput.cjs

@@ -1,6 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const jsxRuntime = require("@emotion/react/jsx-runtime");
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
 const clsx = require("clsx");
 const isNil = require("lodash/isNil");
@@ -8,6 +7,7 @@ const TagsInput_styles = require("./TagsInput.styles.cjs");
 const validationStates = require("../Forms/FormElement/validationStates.cjs");
 const validations = require("../BaseInput/validations.cjs");
 const tagsInputClasses = require("./tagsInputClasses.cjs");
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const useUniqueId = require("../../hooks/useUniqueId.cjs");
 const useIsMounted = require("../../hooks/useIsMounted.cjs");
 const useControlled = require("../../hooks/useControlled.cjs");
@@ -239,14 +239,47 @@ const HvTagsInput = ({
     clearTimeout(blurTimeout.current);
     onFocus == null ? void 0 : onFocus(evt, tagInput);
   };
-  return /* @__PURE__ */ jsxRuntime.jsxs(TagsInput_styles.StyledFormElement, { id, name, disabled, readOnly, status: validationState, required, onBlur: onBlurHandler, onFocus: onFocusHandler, className: clsx__default.default(tagsInputClasses.default.root, classes == null ? void 0 : classes.root, className, disabled && clsx__default.default(tagsInputClasses.default.disabled, classes == null ? void 0 : classes.disabled)), children: [
-    (hasLabel || hasDescription) && /* @__PURE__ */ jsxRuntime.jsxs(TagsInput_styles.StyledLabelContainer, { className: clsx__default.default(tagsInputClasses.default.labelContainer, classes == null ? void 0 : classes.labelContainer), children: [
-      hasLabel && /* @__PURE__ */ jsxRuntime.jsx(TagsInput_styles.StyledLabel, { className: clsx__default.default(tagsInputClasses.default.label, classes == null ? void 0 : classes.label), id: setId.setId(id, "label"), htmlFor: setId.setId(elementId, "input"), label: textAreaLabel }),
-      hasDescription && /* @__PURE__ */ jsxRuntime.jsx(TagsInput_styles.StyledDescription, { className: clsx__default.default(tagsInputClasses.default.description, classes == null ? void 0 : classes.description), id: setId.setId(elementId, "description"), children: description })
-    ] }),
-    hasCounter && /* @__PURE__ */ jsxRuntime.jsx(TagsInput_styles.StyledCharCounter, { id: setId.setId(elementId, "charCounter"), className: clsx__default.default(tagsInputClasses.default.characterCounter, classes == null ? void 0 : classes.characterCounter), separator: middleCountLabel, currentCharQuantity: value.length, maxCharQuantity: maxTagsQuantity, ...countCharProps }),
-    /* @__PURE__ */ jsxRuntime.jsxs(TagsInput_styles.StyledTagsList, { className: clsx__default.default(tagsInputClasses.default.tagsList, classes == null ? void 0 : classes.tagsList, canShowError && clsx__default.default(tagsInputClasses.default.error, classes == null ? void 0 : classes.error), resizable && multiline && clsx__default.default(tagsInputClasses.default.resizable, classes == null ? void 0 : classes.resizable), isStateInvalid && clsx__default.default(tagsInputClasses.default.invalid, classes == null ? void 0 : classes.invalid), !multiline && clsx__default.default(tagsInputClasses.default.singleLine, classes == null ? void 0 : classes.singleLine)), $disabled: disabled, $singleLine: !multiline, $error: canShowError, $resizable: resizable && multiline, $invalid: isStateInvalid, $readOnly: readOnly, onKeyDown: onKeyDownHandler, onClick: onContainerClickHandler, ref: containerRef, children: [
-      value && value.map((t, i) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs(TagsInput_styles.StyledFormElement, {
+    id,
+    name,
+    disabled,
+    readOnly,
+    status: validationState,
+    required,
+    onBlur: onBlurHandler,
+    onFocus: onFocusHandler,
+    className: clsx__default.default(tagsInputClasses.default.root, classes == null ? void 0 : classes.root, className, disabled && clsx__default.default(tagsInputClasses.default.disabled, classes == null ? void 0 : classes.disabled)),
+    children: [(hasLabel || hasDescription) && /* @__PURE__ */ jsxRuntime.jsxs(TagsInput_styles.StyledLabelContainer, {
+      className: clsx__default.default(tagsInputClasses.default.labelContainer, classes == null ? void 0 : classes.labelContainer),
+      children: [hasLabel && /* @__PURE__ */ jsxRuntime.jsx(TagsInput_styles.StyledLabel, {
+        className: clsx__default.default(tagsInputClasses.default.label, classes == null ? void 0 : classes.label),
+        id: setId.setId(id, "label"),
+        htmlFor: setId.setId(elementId, "input"),
+        label: textAreaLabel
+      }), hasDescription && /* @__PURE__ */ jsxRuntime.jsx(TagsInput_styles.StyledDescription, {
+        className: clsx__default.default(tagsInputClasses.default.description, classes == null ? void 0 : classes.description),
+        id: setId.setId(elementId, "description"),
+        children: description
+      })]
+    }), hasCounter && /* @__PURE__ */ jsxRuntime.jsx(TagsInput_styles.StyledCharCounter, {
+      id: setId.setId(elementId, "charCounter"),
+      className: clsx__default.default(tagsInputClasses.default.characterCounter, classes == null ? void 0 : classes.characterCounter),
+      separator: middleCountLabel,
+      currentCharQuantity: value.length,
+      maxCharQuantity: maxTagsQuantity,
+      ...countCharProps
+    }), /* @__PURE__ */ jsxRuntime.jsxs(TagsInput_styles.StyledTagsList, {
+      className: clsx__default.default(tagsInputClasses.default.tagsList, classes == null ? void 0 : classes.tagsList, canShowError && clsx__default.default(tagsInputClasses.default.error, classes == null ? void 0 : classes.error), resizable && multiline && clsx__default.default(tagsInputClasses.default.resizable, classes == null ? void 0 : classes.resizable), isStateInvalid && clsx__default.default(tagsInputClasses.default.invalid, classes == null ? void 0 : classes.invalid), !multiline && clsx__default.default(tagsInputClasses.default.singleLine, classes == null ? void 0 : classes.singleLine)),
+      $disabled: disabled,
+      $singleLine: !multiline,
+      $error: canShowError,
+      $resizable: resizable && multiline,
+      $invalid: isStateInvalid,
+      $readOnly: readOnly,
+      onKeyDown: onKeyDownHandler,
+      onClick: onContainerClickHandler,
+      ref: containerRef,
+      children: [value && value.map((t, i) => {
         const tag = typeof t === "string" ? {
           label: t,
           type: "semantic"
@@ -256,42 +289,93 @@ const HvTagsInput = ({
           type,
           ...otherProps
         } = tag;
-        return /* @__PURE__ */ jsxRuntime.jsx(TagsInput_styles.StyledListItem, { tabIndex: -1, className: clsx__default.default(!multiline && clsx__default.default(tagsInputClasses.default.singleLine, classes == null ? void 0 : classes.singleLine)), classes: {
-          gutters: clsx__default.default(tagsInputClasses.default.listItemGutters, classes == null ? void 0 : classes.listItemGutters),
-          root: clsx__default.default(tagsInputClasses.default.listItemRoot, classes == null ? void 0 : classes.listItemRoot)
-        }, id: `tag-${i}`, $singleLine: !multiline, children: /* @__PURE__ */ jsxRuntime.jsx(TagsInput_styles.StyledTag, { label, className: clsx__default.default(i === tagCursorPos && clsx__default.default(tagsInputClasses.default.tagSelected, classes == null ? void 0 : classes.tagSelected)), classes: {
-          chipRoot: clsx__default.default(tagsInputClasses.default.chipRoot, classes == null ? void 0 : classes.chipRoot)
-        }, type, ...!(readOnly || disabled || type === "categorical") && {
-          onDelete: (event) => onDeleteTagHandler(event, i)
-        }, deleteButtonProps: {
-          tabIndex: -1
-        }, $selected: i === tagCursorPos, ...otherProps }) }, `${tag.label}-${i}`);
-      }),
-      !(disabled || readOnly) && /* @__PURE__ */ jsxRuntime.jsx(TagsInput_styles.StyledInputListItem, { className: clsx__default.default(!multiline && clsx__default.default(tagsInputClasses.default.singleLine, classes == null ? void 0 : classes.singleLine, value.length === 0 && clsx__default.default(tagsInputClasses.default.tagInputRootEmpty, classes == null ? void 0 : classes.tagInputRootEmpty))), classes: {
-        root: clsx__default.default(tagsInputClasses.default.tagInputContainerRoot, classes == null ? void 0 : classes.tagInputContainerRoot),
-        gutters: clsx__default.default(tagsInputClasses.default.listItemGutters, classes == null ? void 0 : classes.listItemGutters)
-      }, id: `tag-${value.length}`, $singleLine: !multiline, $isTagSelected: !!isTagSelected, children: /* @__PURE__ */ jsxRuntime.jsx(TagsInput_styles.StyledInput, { value: tagInput, disableClear: true, onChange: onChangeHandler, onKeyDown: onInputKeyDownHandler, placeholder: value.length === 0 ? placeholder : "", autoFocus, className: clsx__default.default(!multiline && clsx__default.default(tagsInputClasses.default.singleLine, classes == null ? void 0 : classes.singleLine)), classes: {
-        root: clsx__default.default(tagsInputClasses.default.tagInputRoot, classes == null ? void 0 : classes.tagInputRoot),
-        input: clsx__default.default(tagsInputClasses.default.input, classes == null ? void 0 : classes.input),
-        inputBorderContainer: clsx__default.default(tagsInputClasses.default.tagInputBorderContainer, classes == null ? void 0 : classes.tagInputBorderContainer),
-        inputRootFocused: clsx__default.default(tagsInputClasses.default.tagInputRootFocused, classes == null ? void 0 : classes.tagInputRootFocused)
-      }, disabled, readOnly: readOnly || isTagSelected, inputProps: {
-        ref: materialInputRef,
-        "aria-label": ariaLabel,
-        "aria-labelledby": ariaLabelledBy,
-        "aria-describedby": ariaDescribedBy != null ? ariaDescribedBy : description && setId.setId(elementId, "description") || void 0,
-        ...inputProps
-      }, inputRef, $singleLine: !multiline, ...others }) })
-    ] }),
-    canShowSuggestions && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      hasSuggestions && /* @__PURE__ */ jsxRuntime.jsx("div", { role: "presentation", className: clsx__default.default(tagsInputClasses.default.inputExtension, classes == null ? void 0 : classes.inputExtension) }),
-      /* @__PURE__ */ jsxRuntime.jsx(TagsInput_styles.StyledSuggestions, { id: setId.setId(elementId, "suggestions"), classes: {
-        root: clsx__default.default(tagsInputClasses.default.suggestionsContainer, classes == null ? void 0 : classes.suggestionsContainer),
-        list: clsx__default.default(tagsInputClasses.default.suggestionList, classes == null ? void 0 : classes.suggestionList)
-      }, expanded: hasSuggestions, anchorEl: (_a = containerRef == null ? void 0 : containerRef.current) == null ? void 0 : _a.parentElement, onClose: suggestionClearHandler, onKeyDown: onSuggestionKeyDown, onSuggestionSelected: suggestionSelectedHandler, suggestionValues })
-    ] }),
-    canShowError && /* @__PURE__ */ jsxRuntime.jsx(TagsInput_styles.StyledError, { id: setId.setId(elementId, "error"), disableBorder: true, className: clsx__default.default(tagsInputClasses.default.error, classes == null ? void 0 : classes.error), children: validationMessage })
-  ] });
+        return /* @__PURE__ */ jsxRuntime.jsx(TagsInput_styles.StyledListItem, {
+          tabIndex: -1,
+          className: clsx__default.default(!multiline && clsx__default.default(tagsInputClasses.default.singleLine, classes == null ? void 0 : classes.singleLine)),
+          classes: {
+            gutters: clsx__default.default(tagsInputClasses.default.listItemGutters, classes == null ? void 0 : classes.listItemGutters),
+            root: clsx__default.default(tagsInputClasses.default.listItemRoot, classes == null ? void 0 : classes.listItemRoot)
+          },
+          id: `tag-${i}`,
+          $singleLine: !multiline,
+          children: /* @__PURE__ */ jsxRuntime.jsx(TagsInput_styles.StyledTag, {
+            label,
+            className: clsx__default.default(i === tagCursorPos && clsx__default.default(tagsInputClasses.default.tagSelected, classes == null ? void 0 : classes.tagSelected)),
+            classes: {
+              chipRoot: clsx__default.default(tagsInputClasses.default.chipRoot, classes == null ? void 0 : classes.chipRoot)
+            },
+            type,
+            ...!(readOnly || disabled || type === "categorical") && {
+              onDelete: (event) => onDeleteTagHandler(event, i)
+            },
+            deleteButtonProps: {
+              tabIndex: -1
+            },
+            $selected: i === tagCursorPos,
+            ...otherProps
+          })
+        }, `${tag.label}-${i}`);
+      }), !(disabled || readOnly) && /* @__PURE__ */ jsxRuntime.jsx(TagsInput_styles.StyledInputListItem, {
+        className: clsx__default.default(!multiline && clsx__default.default(tagsInputClasses.default.singleLine, classes == null ? void 0 : classes.singleLine, value.length === 0 && clsx__default.default(tagsInputClasses.default.tagInputRootEmpty, classes == null ? void 0 : classes.tagInputRootEmpty))),
+        classes: {
+          root: clsx__default.default(tagsInputClasses.default.tagInputContainerRoot, classes == null ? void 0 : classes.tagInputContainerRoot),
+          gutters: clsx__default.default(tagsInputClasses.default.listItemGutters, classes == null ? void 0 : classes.listItemGutters)
+        },
+        id: `tag-${value.length}`,
+        $singleLine: !multiline,
+        $isTagSelected: !!isTagSelected,
+        children: /* @__PURE__ */ jsxRuntime.jsx(TagsInput_styles.StyledInput, {
+          value: tagInput,
+          disableClear: true,
+          onChange: onChangeHandler,
+          onKeyDown: onInputKeyDownHandler,
+          placeholder: value.length === 0 ? placeholder : "",
+          autoFocus,
+          className: clsx__default.default(!multiline && clsx__default.default(tagsInputClasses.default.singleLine, classes == null ? void 0 : classes.singleLine)),
+          classes: {
+            root: clsx__default.default(tagsInputClasses.default.tagInputRoot, classes == null ? void 0 : classes.tagInputRoot),
+            input: clsx__default.default(tagsInputClasses.default.input, classes == null ? void 0 : classes.input),
+            inputBorderContainer: clsx__default.default(tagsInputClasses.default.tagInputBorderContainer, classes == null ? void 0 : classes.tagInputBorderContainer),
+            inputRootFocused: clsx__default.default(tagsInputClasses.default.tagInputRootFocused, classes == null ? void 0 : classes.tagInputRootFocused)
+          },
+          disabled,
+          readOnly: readOnly || isTagSelected,
+          inputProps: {
+            ref: materialInputRef,
+            "aria-label": ariaLabel,
+            "aria-labelledby": ariaLabelledBy,
+            "aria-describedby": ariaDescribedBy != null ? ariaDescribedBy : description && setId.setId(elementId, "description") || void 0,
+            ...inputProps
+          },
+          inputRef,
+          $singleLine: !multiline,
+          ...others
+        })
+      })]
+    }), canShowSuggestions && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
+      children: [hasSuggestions && /* @__PURE__ */ jsxRuntime.jsx("div", {
+        role: "presentation",
+        className: clsx__default.default(tagsInputClasses.default.inputExtension, classes == null ? void 0 : classes.inputExtension)
+      }), /* @__PURE__ */ jsxRuntime.jsx(TagsInput_styles.StyledSuggestions, {
+        id: setId.setId(elementId, "suggestions"),
+        classes: {
+          root: clsx__default.default(tagsInputClasses.default.suggestionsContainer, classes == null ? void 0 : classes.suggestionsContainer),
+          list: clsx__default.default(tagsInputClasses.default.suggestionList, classes == null ? void 0 : classes.suggestionList)
+        },
+        expanded: hasSuggestions,
+        anchorEl: (_a = containerRef == null ? void 0 : containerRef.current) == null ? void 0 : _a.parentElement,
+        onClose: suggestionClearHandler,
+        onKeyDown: onSuggestionKeyDown,
+        onSuggestionSelected: suggestionSelectedHandler,
+        suggestionValues
+      })]
+    }), canShowError && /* @__PURE__ */ jsxRuntime.jsx(TagsInput_styles.StyledError, {
+      id: setId.setId(elementId, "error"),
+      disableBorder: true,
+      className: clsx__default.default(tagsInputClasses.default.error, classes == null ? void 0 : classes.error),
+      children: validationMessage
+    })]
+  });
 };
 exports.HvTagsInput = HvTagsInput;
 //# sourceMappingURL=TagsInput.cjs.map