@hitachivantara/uikit-react-core 5.87.3 → 5.89.0

package/dist/cjs/TagsInput/TagsInput.styles.cjs

@@ -2,50 +2,34 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const BaseInput_styles = require("../BaseInput/BaseInput.styles.cjs");
-require("../BaseInput/BaseInput.cjs");
-const Suggestions_styles = require("../FormElement/Suggestions/Suggestions.styles.cjs");
+const focusUtils = require("../utils/focusUtils.cjs");
 const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvTagsInput", {
-  input: {
-    width: "100%",
-    ...uikitStyles.theme.typography.caption1
-  },
-  listItemGutters: { padding: "0 5px" },
-  listItemRoot: {
-    marginBottom: 2,
-    height: 24,
-    lineHeight: "24px",
-    "&:not(:last-child)": {
-      marginBottom: 2
-    },
-    "&$singleLine": {
-      display: "table-cell",
-      paddingTop: "2px"
-    }
-  },
+  /** @deprecated unused */
+  listItemGutters: {},
+  /** @deprecated use `chipRoot` */
+  listItemRoot: {},
   root: { display: "inline-block", width: "100%" },
+  // TODO: consider renaming this
   chipRoot: {
     maxWidth: "none"
   },
   disabled: {
     "& $tagsList": {
       backgroundColor: uikitStyles.theme.colors.atmo2,
-      border: `1px solid ${uikitStyles.theme.colors.atmo4}`,
-      "&:focus-within, &:hover": {
-        border: `1px solid ${uikitStyles.theme.colors.atmo4}`
+      "&,:hover": {
+        borderColor: uikitStyles.theme.colors.atmo4
       }
     }
   },
   readOnly: {
     "& $tagsList": {
       backgroundColor: uikitStyles.theme.colors.atmo2,
-      border: `1px solid ${uikitStyles.theme.colors.secondary_60}`,
-      "&:hover": {
-        border: `1px solid ${uikitStyles.theme.colors.secondary_60}`
+      "&,:hover": {
+        borderColor: uikitStyles.theme.colors.secondary_60
       }
     }
   },
-  resizable: { width: "auto", resize: "both", overflow: "auto" },
+  resizable: { width: "auto", resize: "both", clear: "both", overflow: "auto" },
   invalid: {},
   labelContainer: { float: "left", display: "flex", alignItems: "flex-start" },
   label: {},
@@ -58,112 +42,67 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvTagsInput
   },
   tagsList: {
     display: "flex",
+    alignItems: "center",
     alignContent: "flex-start",
-    float: "left",
-    clear: "both",
+    gap: uikitStyles.theme.spacing("xxs", "xs"),
+    cursor: "text",
     width: "100%",
-    maxWidth: "100%",
-    height: "32px",
-    padding: 5,
+    minHeight: 32,
+    padding: uikitStyles.theme.spacing("xxs", "xs"),
     overflow: "auto",
     position: "relative",
     flexDirection: "row",
     flexWrap: "wrap",
     backgroundColor: uikitStyles.theme.colors.atmo1,
-    border: `1px solid ${uikitStyles.theme.colors.secondary_80}`,
+    borderWidth: 1,
+    borderColor: uikitStyles.theme.colors.secondary_80,
     borderRadius: uikitStyles.theme.radii.base,
     "&:hover": {
-      cursor: "text",
-      border: `1px solid ${uikitStyles.theme.colors.primary}`
-    },
-    [`& .${BaseInput_styles.staticClasses.inputRoot}`]: {
-      border: "none"
+      borderColor: uikitStyles.theme.colors.primary
     },
-    "&:focus, &:focus-within, &:focus-visible": {
-      outlineColor: "#52A8EC",
-      outlineStyle: "solid",
-      outlineWidth: "0px",
-      outlineOffset: "-1px",
-      boxShadow: "0 0 0 1px #52A8EC, 0 0 0 4px rgba(29,155,209,.3)"
+    "&:focus-within, &:focus-visible": {
+      ...focusUtils.outlineStyles
     },
     "&$singleLine": {
-      overflowX: "hidden",
-      overflowY: "hidden",
-      height: 32,
-      display: "table-row",
-      paddingTop: 0
+      flexWrap: "nowrap"
     },
     "&$error": {
-      border: `1px solid ${uikitStyles.theme.colors.negative_120}`
+      borderColor: uikitStyles.theme.colors.negative_120
     },
     "&$invalid": {
-      border: `1px solid ${uikitStyles.theme.colors.negative_120}`
+      borderColor: uikitStyles.theme.colors.negative_120
     }
   },
-  tagInputContainerRoot: {
+  /** @deprecated use `classes.input` instead */
+  tagInputContainerRoot: {},
+  /** @deprecated use `classes.input` instead */
+  tagInputRoot: {},
+  input: {
     display: "flex",
-    flexGrow: 1,
-    height: 24,
-    lineHeight: "24px",
-    "&$singleLine": {
-      display: "table-cell",
-      minWidth: 60,
-      width: "100%",
-      paddingTop: "3px",
-      verticalAlign: "middle"
-    }
-  },
-  tagInputRoot: {
-    [`& .${BaseInput_styles.staticClasses.root}`]: {
-      width: "100%",
-      border: "none"
-    },
-    [`&& .${BaseInput_styles.staticClasses.inputRoot}`]: {
-      marginLeft: 0,
-      marginRight: 0,
-      flex: "1 1 auto",
-      height: 24,
-      lineHeight: "24px",
-      padding: 0,
-      border: "none"
-    },
-    [`& .${BaseInput_styles.staticClasses.inputRootFocused}`]: {
-      outline: "none",
-      boxShadow: "none"
-    },
-    [`& .${BaseInput_styles.staticClasses.root} .${BaseInput_styles.staticClasses.inputRootReadOnly}`]: {
-      backgroundColor: "transparent",
-      border: "none",
-      "&:hover": {
-        border: "none"
-      }
-    },
-    [`&& .${BaseInput_styles.staticClasses.input}`]: {
-      marginLeft: 0
-    }
-  },
-  tagSelected: {
-    outlineColor: "#52A8EC",
-    outlineStyle: "solid",
-    outlineWidth: "0px",
-    outlineOffset: "-1px",
-    boxShadow: "0 0 0 1px #52A8EC, 0 0 0 4px rgba(29,155,209,.3)"
+    flex: "1 0 auto",
+    height: "auto",
+    width: 0,
+    minWidth: 60,
+    border: "none",
+    margin: 0,
+    padding: 0,
+    ...uikitStyles.theme.typography.caption1,
+    backgroundColor: "transparent",
+    outline: "none",
+    boxShadow: "none"
   },
+  /** @deprecated unused.  use `:focus` or `:focus-visible` instead */
+  tagSelected: {},
   /** @deprecated unused. use `::after` instead */
   tagInputBorderContainer: {},
+  /** @deprecated unused. use `:focus` or `:focus-visible` instead */
   tagInputRootFocused: {},
+  /** @deprecated unused */
   tagInputRootEmpty: {},
   singleLine: {},
   error: { float: "left" },
   inputExtension: {},
-  suggestionsContainer: {
-    width: "100%",
-    position: "relative",
-    top: 59,
-    [`& .${Suggestions_styles.staticClasses.root} .${Suggestions_styles.staticClasses.list} &`]: {
-      width: "100%"
-    }
-  },
+  suggestionsContainer: {},
   suggestionList: {}
 });
 exports.staticClasses = staticClasses;

package/dist/cjs/TextArea/TextArea.cjs

@@ -83,7 +83,6 @@ const HvTextArea = React.forwardRef(function HvTextArea2(props, ref) {
   const performValidation = React.useCallback(() => {
     const inputValidity = validations.validateInput(
       inputRef.current,
-      String(value),
       required,
       minCharQuantity,
       maxCharQuantity,
@@ -104,8 +103,7 @@ const HvTextArea = React.forwardRef(function HvTextArea2(props, ref) {
     required,
     setValidationMessage,
     setValidationState,
-    validation,
-    value
+    validation
   ]);
   const limitValue = (currentValue) => {
     if (currentValue === void 0 || !blockMax) return currentValue;

package/dist/cjs/TimePicker/TimePicker.cjs

@@ -3,12 +3,12 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const date = require("@internationalized/date");
-const utils = require("@mui/material/utils");
+const utils$1 = require("@mui/material/utils");
 const datepicker$1 = require("@react-aria/datepicker");
 const datepicker = require("@react-stately/datepicker");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
-const utils$1 = require("../Calendar/utils.cjs");
+const utils = require("../Calendar/utils.cjs");
 const useControlled = require("../hooks/useControlled.cjs");
 const useUniqueId = require("../hooks/useUniqueId.cjs");
 const setId = require("../utils/setId.cjs");
@@ -52,7 +52,7 @@ const HvTimePicker = React.forwardRef(
       timeFormat,
       showSeconds,
       disableExpand,
-      locale = utils$1.DEFAULT_LOCALE,
+      locale = utils.DEFAULT_LOCALE,
       onToggle,
       onChange,
       // misc properties:
@@ -65,7 +65,7 @@ const HvTimePicker = React.forwardRef(
     const { classes, cx } = TimePicker_styles.useClasses(classesProp);
     const timeFieldRef = React.useRef(null);
     const { ref: refProp, ...otherDropdownProps } = dropdownProps;
-    const dropdownForkedRef = utils.useForkRef(ref, refProp);
+    const dropdownForkedRef = utils$1.useForkRef(ref, refProp);
     const stateProps = {
       value: toTime(valueProp),
       defaultValue: toTime(defaultValueProp),
@@ -77,6 +77,7 @@ const HvTimePicker = React.forwardRef(
       granularity: showSeconds === false ? "minute" : "second",
       hourCycle: timeFormat === "12" ? 12 : 24,
       onChange: (value) => {
+        if (!value) return;
         const { hour: hours, minute: minutes, second: seconds } = value;
         onChange?.({ hours, minutes, seconds });
       }

package/dist/cjs/Typography/Typography.styles.cjs

@@ -4,7 +4,8 @@ const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const { useClasses, staticClasses } = uikitReactUtils.createClasses("HvTypography", {
   root: {
-    fontFamily: uikitStyles.theme.fontFamily.body
+    fontFamily: uikitStyles.theme.fontFamily.body,
+    color: "inherit"
   },
   disabled: {
     color: uikitStyles.theme.colors.secondary_60

package/dist/cjs/VerticalNavigation/NavigationSlider/NavigationSlider.styles.cjs

@@ -14,9 +14,6 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses(
       marginBottom: "8px",
       "& > button": {
         marginLeft: "auto"
-      },
-      "& .HvListItem-startAdornment .color0": {
-        fill: "currentColor"
       }
     },
     listItemSelected: {

package/dist/cjs/VerticalNavigation/TreeView/TreeViewItem.styles.cjs

@@ -42,7 +42,6 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses(
       width: "100%",
       display: "flex",
       justifyContent: "flex-start",
-      color: "inherit",
       alignItems: "center",
       height: "32px",
       borderLeft: `4px solid transparent`,
@@ -128,9 +127,6 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses(
     },
     icon: {
       display: "flex",
-      "& .color0": {
-        fill: "currentColor"
-      },
       "> div:first-of-type": {
         marginLeft: "var(--icon-margin-left)"
       },

package/dist/cjs/hooks/useFocus.cjs

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const React = require("react");
+const document = require("../utils/document.cjs");
+const getActiveEl = () => document.getDocument()?.activeElement || null;
+function makeFocusUtils(containerRef) {
+  function focus(el, checkFocus = true) {
+    if (!checkFocus || containerRef.current?.contains(getActiveEl())) {
+      el?.focus();
+    }
+  }
+  return {
+    focusPrevious() {
+      focus(getActiveEl()?.previousElementSibling);
+    },
+    focusNext() {
+      focus(getActiveEl()?.nextElementSibling);
+    },
+    focusFirst() {
+      focus(getActiveEl()?.parentElement?.firstElementChild);
+    },
+    focusLast() {
+      focus(getActiveEl()?.parentElement?.lastElementChild);
+    },
+    focusChild(index) {
+      focus(containerRef.current?.children[index], false);
+    },
+    focusSibling(index) {
+      focus(getActiveEl()?.parentElement?.children[index]);
+    }
+  };
+}
+function useFocus({
+  containerRef
+}) {
+  return React.useMemo(() => makeFocusUtils(containerRef), [containerRef]);
+}
+exports.useFocus = useFocus;

package/dist/cjs/index.cjs

@@ -236,6 +236,8 @@ const Table_styles = require("./Table/Table.styles.cjs");
 const Table = require("./Table/Table.cjs");
 const TableContainer_styles = require("./Table/TableContainer/TableContainer.styles.cjs");
 const TableContainer = require("./Table/TableContainer/TableContainer.cjs");
+const TableSection_styles = require("./Table/TableSection/TableSection.styles.cjs");
+const TableSection = require("./Table/TableSection/TableSection.cjs");
 const TableBody_styles = require("./Table/TableBody/TableBody.styles.cjs");
 const TableBody = require("./Table/TableBody/TableBody.cjs");
 const TableHead_styles = require("./Table/TableHead/TableHead.styles.cjs");
@@ -302,9 +304,8 @@ const TreeView$1 = require("./VerticalNavigation/TreeView/TreeView.cjs");
 const TreeViewItem_styles = require("./VerticalNavigation/TreeView/TreeViewItem.styles.cjs");
 const TreeViewItem = require("./VerticalNavigation/TreeView/TreeViewItem.cjs");
 const VerticalNavigationContext = require("./VerticalNavigation/VerticalNavigationContext.cjs");
-const TableSection_styles = require("./TableSection/TableSection.styles.cjs");
-const TableSection = require("./TableSection/TableSection.cjs");
 const IconButton = require("./IconButton/IconButton.cjs");
+const IconContainer = require("./IconContainer/IconContainer.cjs");
 const Skeleton_styles = require("./Skeleton/Skeleton.styles.cjs");
 const Skeleton = require("./Skeleton/Skeleton.cjs");
 const uikitReactShared = require("@hitachivantara/uikit-react-shared");
@@ -595,6 +596,8 @@ exports.tableClasses = Table_styles.staticClasses;
 exports.HvTable = Table.HvTable;
 exports.tableContainerClasses = TableContainer_styles.staticClasses;
 exports.HvTableContainer = TableContainer.HvTableContainer;
+exports.tableSectionClasses = TableSection_styles.staticClasses;
+exports.HvTableSection = TableSection.HvTableSection;
 exports.tableBodyClasses = TableBody_styles.staticClasses;
 exports.HvTableBody = TableBody.HvTableBody;
 exports.tableHeadClasses = TableHead_styles.staticClasses;
@@ -677,9 +680,11 @@ exports.HvVerticalNavigationTreeView = TreeView$1.HvVerticalNavigationTreeView;
 exports.treeViewItemClasses = TreeViewItem_styles.staticClasses;
 exports.HvVerticalNavigationTreeViewItem = TreeViewItem.HvVerticalNavigationTreeViewItem;
 exports.VerticalNavigationContext = VerticalNavigationContext.VerticalNavigationContext;
-exports.tableSectionClasses = TableSection_styles.staticClasses;
-exports.HvTableSection = TableSection.HvTableSection;
 exports.HvIconButton = IconButton.HvIconButton;
+exports.HvIconContainer = IconContainer.HvIconContainer;
+exports.iconContainerClasses = IconContainer.staticClasses;
+exports.staticClasses = IconContainer.staticClasses;
+exports.useClasses = IconContainer.useClasses;
 exports.skeletonClasses = Skeleton_styles.staticClasses;
 exports.HvSkeleton = Skeleton.HvSkeleton;
 Object.defineProperty(exports, "EmotionContext", {

package/dist/cjs/utils/Callout.cjs

@@ -0,0 +1,134 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const SnackbarContent = require("@mui/material/SnackbarContent");
+const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
+const uikitStyles = require("@hitachivantara/uikit-styles");
+const iconVariant = require("./iconVariant.cjs");
+const ActionsGeneric = require("../ActionsGeneric/ActionsGeneric.cjs");
+const Button = require("../Button/Button.cjs");
+const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
+const SnackbarContent__default = /* @__PURE__ */ _interopDefault(SnackbarContent);
+const { useClasses, staticClasses } = uikitReactUtils.createClasses("HvCallout", {
+  root: {
+    position: "relative",
+    boxShadow: "none",
+    flexWrap: "nowrap",
+    padding: 0
+  },
+  success: {
+    backgroundColor: uikitStyles.theme.colors.positive_20
+  },
+  warning: {
+    backgroundColor: uikitStyles.theme.colors.warning_20
+  },
+  error: {
+    backgroundColor: uikitStyles.theme.colors.negative_20
+  },
+  default: {
+    backgroundColor: uikitStyles.theme.colors.neutral_20
+  },
+  message: {
+    display: "flex",
+    alignItems: "center",
+    padding: 0,
+    color: uikitStyles.theme.colors.base_dark
+  },
+  messageContent: {
+    textWrap: "balance",
+    overflow: "hidden",
+    wordBreak: "break-word"
+  },
+  messageIcon: {
+    "& svg .color0": {
+      fill: "inherit"
+    }
+  },
+  action: {
+    marginRight: 0
+  },
+  actionContent: {
+    display: "flex",
+    flexDirection: "column",
+    height: "100%",
+    justifyContent: "space-between",
+    gap: uikitStyles.theme.space.xs
+  },
+  actionCustom: {
+    flex: "0 0 auto"
+  },
+  actionClose: {
+    alignSelf: "flex-end"
+  }
+});
+const HvCallout = React.forwardRef(function HvCallout2(props, ref) {
+  const {
+    id,
+    classes: classesProp,
+    className,
+    showClose,
+    showIcon,
+    customIcon,
+    variant = "default",
+    onClose,
+    actions,
+    onAction,
+    actionsPosition: actionsPositionProp = "auto",
+    children,
+    actionProps,
+    ...others
+  } = uikitReactUtils.useDefaultProps("HvCallout", props);
+  const { classes, cx } = useClasses(classesProp, false);
+  const { activeTheme } = uikitReactUtils.useTheme();
+  const icon = customIcon || showIcon && iconVariant.iconVariant(variant, "inherit");
+  const actionsPosition = actionsPositionProp === "auto" ? "inline" : actionsPositionProp;
+  const actionsContent = /* @__PURE__ */ jsxRuntime.jsx(
+    ActionsGeneric.HvActionsGeneric,
+    {
+      id,
+      className: classes.actionCustom,
+      variant: showClose ? "semantic" : activeTheme?.snackbar.actionButtonVariant,
+      actions,
+      onAction
+    }
+  );
+  const showCustomActions = actions && actionsPosition === "bottom-right";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    SnackbarContent__default.default,
+    {
+      ref,
+      id,
+      classes: {
+        root: cx(classes.root, classes[variant], className),
+        message: classes.message,
+        action: classes.action
+      },
+      message: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.messageIcon, children: icon }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.messageContent, children }),
+        actions && actionsPosition === "inline" && actionsContent
+      ] }),
+      action: (showClose || showCustomActions) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.actionContent, children: [
+        showClose && /* @__PURE__ */ jsxRuntime.jsx(
+          Button.HvButton,
+          {
+            icon: true,
+            className: classes.actionClose,
+            variant: "semantic",
+            "aria-label": "Close",
+            onClick: (evt) => onClose?.(evt, "clickaway"),
+            ...actionProps,
+            children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Close, { size: "XS" })
+          }
+        ),
+        showCustomActions && actionsContent
+      ] }),
+      ...others
+    }
+  );
+});
+exports.HvCallout = HvCallout;
+exports.staticClasses = staticClasses;
+exports.useClasses = useClasses;

package/dist/cjs/utils/focusUtils.cjs

@@ -1,10 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const outlineStyles = {
-  outlineColor: "#52A8EC",
-  outlineStyle: "solid",
-  outlineWidth: "0px",
-  outlineOffset: "-1px",
   boxShadow: "0 0 0 1px #52A8EC, 0 0 0 4px rgba(29,155,209,.3)"
 };
 exports.outlineStyles = outlineStyles;

package/dist/esm/ActionsGeneric/ActionsGeneric.js

@@ -5,9 +5,9 @@ import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import { setId } from "../utils/setId.js";
 import { useClasses } from "./ActionsGeneric.styles.js";
 import { staticClasses } from "./ActionsGeneric.styles.js";
+import { HvDropDownMenu } from "../DropDownMenu/DropDownMenu.js";
 import { HvIconButton } from "../IconButton/IconButton.js";
 import { HvButton } from "../Button/Button.js";
-import { HvDropDownMenu } from "../DropDownMenu/DropDownMenu.js";
 const HvActionsGeneric = forwardRef(function HvActionsGeneric2(props, ref) {
   const {
     id: idProp,
@@ -63,8 +63,7 @@ const HvActionsGeneric = forwardRef(function HvActionsGeneric2(props, ref) {
   const renderActionsGrid = () => {
     const actsVisible = actions.slice(0, maxVisibleActions);
     const actsDropdown = actions.slice(maxVisibleActions);
-    const semantic = variant === "semantic";
-    const iconColor = disabled && "secondary_60" || semantic && "base_dark" || void 0;
+    const iconColor = variant === "semantic" && "base_dark" || void 0;
     return /* @__PURE__ */ jsxs(Fragment, { children: [
       actsVisible.map((action, idx) => renderButton(action, idx)),
       /* @__PURE__ */ jsx(

package/dist/esm/ActionsGeneric/ActionsGeneric.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionsGeneric.js","sources":["../../../src/ActionsGeneric/ActionsGeneric.tsx"],"sourcesContent":["import { forwardRef, isValidElement } from \"react\";\nimport { MoreOptionsVertical } from \"@hitachivantara/uikit-react-icons\";\nimport {\n  useDefaultProps,\n  type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\n\nimport { HvButton, HvButtonProps, HvButtonVariant } from \"../Button\";\nimport { HvDropDownMenu, HvDropDownMenuProps } from \"../DropDownMenu\";\nimport { HvIconButton } from \"../IconButton\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { setId } from \"../utils/setId\";\nimport { staticClasses, useClasses } from \"./ActionsGeneric.styles\";\n\nexport { staticClasses as actionsGenericClasses };\n\nexport type HvActionsGenericClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvActionGeneric {\n  /** Action id. */\n  id: string;\n  /** Action label. */\n  label: string;\n  /** Action icon. */\n  icon?:\n    | React.ReactNode\n    | ((params: { isDisabled?: boolean }) => React.ReactNode);\n  /** Whether the action is disabled or not. */\n  disabled?: boolean;\n  /** When set to `true`, the button will have the icon has its content and a tooltip with the label will appear when the button is visible and hovered. */\n  iconOnly?: boolean;\n}\n\nexport interface HvActionsGenericProps extends HvBaseProps {\n  /**\n   * The button category for all actions.\n   *\n   * @deprecated Use `variant` instead.\n   */\n  category?: HvButtonVariant;\n  /** The button variant for all actions. */\n  variant?: HvButtonVariant;\n  /** Whether the actions should be all disabled. */\n  disabled?: boolean;\n  /** Whether the actions should be all icon buttons when visible. */\n  iconOnly?: boolean;\n  /** The renderable content inside the actions slot of the footer, or an array of actions. */\n  actions: React.ReactNode | HvActionGeneric[];\n  /**\n   * The callback function called when an action is triggered, receiving the `action` as parameter.\n   *\n   * @deprecated Use `onAction` instead.\n   * */\n  actionsCallback?: (\n    event: React.SyntheticEvent,\n    id: string,\n    action: HvActionGeneric,\n  ) => void;\n  /** The callback function called when an action is triggered, receiving the `action` as parameter. */\n  onAction?: (event: React.SyntheticEvent, action: HvActionGeneric) => void;\n  /** The maximum number of visible actions before they're collapsed into a dropdown menu. */\n  maxVisibleActions?: number;\n  /** Props to be applied to the dropdown menu. */\n  dropdownMenuProps?: Partial<HvDropDownMenuProps>;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvActionsGenericClasses;\n}\n\nexport const HvActionsGeneric = forwardRef<\n  React.ComponentRef<\"div\">,\n  HvActionsGenericProps\n>(function HvActionsGeneric(props, ref) {\n  const {\n    id: idProp,\n    classes: classesProp,\n    className,\n    category = \"secondaryGhost\", // TODO - remove and update variant default in v6\n    variant: variantProp,\n    disabled = false,\n    actions = [],\n    actionsCallback, // TODO - remove in v6\n    onAction,\n    maxVisibleActions = Infinity,\n    iconOnly: iconOnlyProp,\n    dropdownMenuProps: dropdownMenuPropsProp,\n    ...others\n  } = useDefaultProps(\"HvActionsGeneric\", props);\n\n  const { onClick: onClickDropdownMenu, ...dropdownMenuProps } =\n    dropdownMenuPropsProp || {};\n\n  const variant = variantProp || category;\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const handleCallback: HvActionsGenericProps[\"actionsCallback\"] = (\n    event,\n    id,\n    action,\n  ) => {\n    actionsCallback?.(event, id, action);\n    onAction?.(event, action);\n  };\n\n  if (!Array.isArray(actions)) return isValidElement(actions) ? actions : null;\n\n  const renderButton = (action: HvActionGeneric, idx: number) => {\n    const {\n      disabled: actDisabled,\n      id: actId,\n      icon,\n      label,\n      iconOnly,\n      ...other\n    } = action;\n    const actionId = setId(idProp, idx, \"action\", action.id);\n\n    const renderedIcon = isValidElement(icon)\n      ? icon\n      : (icon as Function)?.({ isDisabled: disabled });\n\n    const commonButtonProps: HvButtonProps = {\n      id: actionId,\n      variant,\n      className: classes.button,\n      disabled: actDisabled ?? disabled,\n      onClick: (event) => handleCallback(event, idProp || \"\", action),\n      ...other,\n    };\n\n    const key = actionId || idx;\n    const isIcon = iconOnly ?? iconOnlyProp;\n\n    if (isIcon) {\n      return (\n        <HvIconButton key={key} {...commonButtonProps} title={label}>\n          {renderedIcon}\n        </HvIconButton>\n      );\n    }\n\n    return (\n      <HvButton key={key} {...commonButtonProps} startIcon={renderedIcon}>\n        {label}\n      </HvButton>\n    );\n  };\n\n  const renderActionsGrid = () => {\n    const actsVisible = actions.slice(0, maxVisibleActions);\n    const actsDropdown = actions.slice(maxVisibleActions);\n\n    const semantic = variant === \"semantic\";\n    const iconColor =\n      (disabled && \"secondary_60\") || (semantic && \"base_dark\") || undefined;\n\n    return (\n      <>\n        {actsVisible.map((action, idx) => renderButton(action, idx))}\n        <HvDropDownMenu\n          id={setId(idProp, \"menu\")}\n          disabled={disabled}\n          variant={variant}\n          classes={{\n            root: classes.dropDownMenu,\n            icon: classes.dropDownMenuButton,\n            iconSelected: classes.dropDownMenuButtonSelected,\n          }}\n          icon={<MoreOptionsVertical color={iconColor} />}\n          placement=\"left\"\n          onClick={(event, action) => {\n            handleCallback(event, idProp || \"\", action as HvActionGeneric);\n            onClickDropdownMenu?.(event, action);\n          }}\n          dataList={actsDropdown}\n          keepOpened={false}\n          disablePortal={false}\n          {...dropdownMenuProps}\n        />\n      </>\n    );\n  };\n\n  const actionOverflow = actions.length > maxVisibleActions;\n\n  return (\n    <div\n      ref={ref}\n      className={cx(\n        classes.root,\n        { [classes.actionContainer]: actionOverflow },\n        className,\n      )}\n      {...others}\n    >\n      {actionOverflow\n        ? renderActionsGrid()\n        : actions.map((action, idx) => renderButton(action, idx))}\n    </div>\n  );\n});\n"],"names":["HvActionsGeneric"],"mappings":";;;;;;;;;;AAoEO,MAAM,mBAAmB,WAG9B,SAASA,kBAAiB,OAAO,KAAK;AAChC,QAAA;AAAA,IACJ,IAAI;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA,WAAW;AAAA;AAAA,IACX,SAAS;AAAA,IACT,WAAW;AAAA,IACX,UAAU,CAAC;AAAA,IACX;AAAA;AAAA,IACA;AAAA,IACA,oBAAoB;AAAA,IACpB,UAAU;AAAA,IACV,mBAAmB;AAAA,IACnB,GAAG;AAAA,EAAA,IACD,gBAAgB,oBAAoB,KAAK;AAE7C,QAAM,EAAE,SAAS,qBAAqB,GAAG,kBAAkB,IACzD,yBAAyB,CAAC;AAE5B,QAAM,UAAU,eAAe;AAE/B,QAAM,EAAE,SAAS,OAAO,WAAW,WAAW;AAE9C,QAAM,iBAA2D,CAC/D,OACA,IACA,WACG;AACe,sBAAA,OAAO,IAAI,MAAM;AACnC,eAAW,OAAO,MAAM;AAAA,EAC1B;AAEI,MAAA,CAAC,MAAM,QAAQ,OAAO,EAAU,QAAA,eAAe,OAAO,IAAI,UAAU;AAElE,QAAA,eAAe,CAAC,QAAyB,QAAgB;AACvD,UAAA;AAAA,MACJ,UAAU;AAAA,MACV,IAAI;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IAAA,IACD;AACJ,UAAM,WAAW,MAAM,QAAQ,KAAK,UAAU,OAAO,EAAE;AAEjD,UAAA,eAAe,eAAe,IAAI,IACpC,OACC,OAAoB,EAAE,YAAY,UAAU;AAEjD,UAAM,oBAAmC;AAAA,MACvC,IAAI;AAAA,MACJ;AAAA,MACA,WAAW,QAAQ;AAAA,MACnB,UAAU,eAAe;AAAA,MACzB,SAAS,CAAC,UAAU,eAAe,OAAO,UAAU,IAAI,MAAM;AAAA,MAC9D,GAAG;AAAA,IACL;AAEA,UAAM,MAAM,YAAY;AACxB,UAAM,SAAS,YAAY;AAE3B,QAAI,QAAQ;AACV,iCACG,cAAwB,EAAA,GAAG,mBAAmB,OAAO,OACnD,0BADgB,GAEnB;AAAA,IAAA;AAIJ,+BACG,UAAoB,EAAA,GAAG,mBAAmB,WAAW,cACnD,mBADY,GAEf;AAAA,EAEJ;AAEA,QAAM,oBAAoB,MAAM;AAC9B,UAAM,cAAc,QAAQ,MAAM,GAAG,iBAAiB;AAChD,UAAA,eAAe,QAAQ,MAAM,iBAAiB;AAEpD,UAAM,WAAW,YAAY;AAC7B,UAAM,YACH,YAAY,kBAAoB,YAAY,eAAgB;AAE/D,WAEK,qBAAA,UAAA,EAAA,UAAA;AAAA,MAAA,YAAY,IAAI,CAAC,QAAQ,QAAQ,aAAa,QAAQ,GAAG,CAAC;AAAA,MAC3D;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,IAAI,MAAM,QAAQ,MAAM;AAAA,UACxB;AAAA,UACA;AAAA,UACA,SAAS;AAAA,YACP,MAAM,QAAQ;AAAA,YACd,MAAM,QAAQ;AAAA,YACd,cAAc,QAAQ;AAAA,UACxB;AAAA,UACA,MAAM,oBAAC,qBAAoB,EAAA,OAAO,UAAW,CAAA;AAAA,UAC7C,WAAU;AAAA,UACV,SAAS,CAAC,OAAO,WAAW;AACX,2BAAA,OAAO,UAAU,IAAI,MAAyB;AAC7D,kCAAsB,OAAO,MAAM;AAAA,UACrC;AAAA,UACA,UAAU;AAAA,UACV,YAAY;AAAA,UACZ,eAAe;AAAA,UACd,GAAG;AAAA,QAAA;AAAA,MAAA;AAAA,IACN,GACF;AAAA,EAEJ;AAEM,QAAA,iBAAiB,QAAQ,SAAS;AAGtC,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT,QAAQ;AAAA,QACR,EAAE,CAAC,QAAQ,eAAe,GAAG,eAAe;AAAA,QAC5C;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH,UAAA,iBACG,kBAAkB,IAClB,QAAQ,IAAI,CAAC,QAAQ,QAAQ,aAAa,QAAQ,GAAG,CAAC;AAAA,IAAA;AAAA,EAC5D;AAEJ,CAAC;"}
+{"version":3,"file":"ActionsGeneric.js","sources":["../../../src/ActionsGeneric/ActionsGeneric.tsx"],"sourcesContent":["import { forwardRef, isValidElement } from \"react\";\nimport { MoreOptionsVertical } from \"@hitachivantara/uikit-react-icons\";\nimport {\n  useDefaultProps,\n  type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\n\nimport { HvButton, HvButtonProps, HvButtonVariant } from \"../Button\";\nimport { HvDropDownMenu, HvDropDownMenuProps } from \"../DropDownMenu\";\nimport { HvIconButton } from \"../IconButton\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { setId } from \"../utils/setId\";\nimport { staticClasses, useClasses } from \"./ActionsGeneric.styles\";\n\nexport { staticClasses as actionsGenericClasses };\n\nexport type HvActionsGenericClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvActionGeneric {\n  /** Action id. */\n  id: string;\n  /** Action label. */\n  label: string;\n  /** Action icon. */\n  icon?:\n    | React.ReactNode\n    | ((params: { isDisabled?: boolean }) => React.ReactNode);\n  /** Whether the action is disabled or not. */\n  disabled?: boolean;\n  /** When set to `true`, the button will have the icon has its content and a tooltip with the label will appear when the button is visible and hovered. */\n  iconOnly?: boolean;\n}\n\nexport interface HvActionsGenericProps extends HvBaseProps {\n  /**\n   * The button category for all actions.\n   *\n   * @deprecated Use `variant` instead.\n   */\n  category?: HvButtonVariant;\n  /** The button variant for all actions. */\n  variant?: HvButtonVariant;\n  /** Whether the actions should be all disabled. */\n  disabled?: boolean;\n  /** Whether the actions should be all icon buttons when visible. */\n  iconOnly?: boolean;\n  /** The renderable content inside the actions slot of the footer, or an array of actions. */\n  actions: React.ReactNode | HvActionGeneric[];\n  /**\n   * The callback function called when an action is triggered, receiving the `action` as parameter.\n   *\n   * @deprecated Use `onAction` instead.\n   * */\n  actionsCallback?: (\n    event: React.SyntheticEvent,\n    id: string,\n    action: HvActionGeneric,\n  ) => void;\n  /** The callback function called when an action is triggered, receiving the `action` as parameter. */\n  onAction?: (event: React.SyntheticEvent, action: HvActionGeneric) => void;\n  /** The maximum number of visible actions before they're collapsed into a dropdown menu. */\n  maxVisibleActions?: number;\n  /** Props to be applied to the dropdown menu. */\n  dropdownMenuProps?: Partial<HvDropDownMenuProps>;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvActionsGenericClasses;\n}\n\nexport const HvActionsGeneric = forwardRef<\n  React.ComponentRef<\"div\">,\n  HvActionsGenericProps\n>(function HvActionsGeneric(props, ref) {\n  const {\n    id: idProp,\n    classes: classesProp,\n    className,\n    category = \"secondaryGhost\", // TODO - remove and update variant default in v6\n    variant: variantProp,\n    disabled = false,\n    actions = [],\n    actionsCallback, // TODO - remove in v6\n    onAction,\n    maxVisibleActions = Infinity,\n    iconOnly: iconOnlyProp,\n    dropdownMenuProps: dropdownMenuPropsProp,\n    ...others\n  } = useDefaultProps(\"HvActionsGeneric\", props);\n\n  const { onClick: onClickDropdownMenu, ...dropdownMenuProps } =\n    dropdownMenuPropsProp || {};\n\n  const variant = variantProp || category;\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const handleCallback: HvActionsGenericProps[\"actionsCallback\"] = (\n    event,\n    id,\n    action,\n  ) => {\n    actionsCallback?.(event, id, action);\n    onAction?.(event, action);\n  };\n\n  if (!Array.isArray(actions)) return isValidElement(actions) ? actions : null;\n\n  const renderButton = (action: HvActionGeneric, idx: number) => {\n    const {\n      disabled: actDisabled,\n      id: actId,\n      icon,\n      label,\n      iconOnly,\n      ...other\n    } = action;\n    const actionId = setId(idProp, idx, \"action\", action.id);\n\n    const renderedIcon = isValidElement(icon)\n      ? icon\n      : (icon as Function)?.({ isDisabled: disabled });\n\n    const commonButtonProps: HvButtonProps = {\n      id: actionId,\n      variant,\n      className: classes.button,\n      disabled: actDisabled ?? disabled,\n      onClick: (event) => handleCallback(event, idProp || \"\", action),\n      ...other,\n    };\n\n    const key = actionId || idx;\n    const isIcon = iconOnly ?? iconOnlyProp;\n\n    if (isIcon) {\n      return (\n        <HvIconButton key={key} {...commonButtonProps} title={label}>\n          {renderedIcon}\n        </HvIconButton>\n      );\n    }\n\n    return (\n      <HvButton key={key} {...commonButtonProps} startIcon={renderedIcon}>\n        {label}\n      </HvButton>\n    );\n  };\n\n  const renderActionsGrid = () => {\n    const actsVisible = actions.slice(0, maxVisibleActions);\n    const actsDropdown = actions.slice(maxVisibleActions);\n\n    const iconColor = (variant === \"semantic\" && \"base_dark\") || undefined;\n\n    return (\n      <>\n        {actsVisible.map((action, idx) => renderButton(action, idx))}\n        <HvDropDownMenu\n          id={setId(idProp, \"menu\")}\n          disabled={disabled}\n          variant={variant}\n          classes={{\n            root: classes.dropDownMenu,\n            icon: classes.dropDownMenuButton,\n            iconSelected: classes.dropDownMenuButtonSelected,\n          }}\n          icon={<MoreOptionsVertical color={iconColor} />}\n          placement=\"left\"\n          onClick={(event, action) => {\n            handleCallback(event, idProp || \"\", action as HvActionGeneric);\n            onClickDropdownMenu?.(event, action);\n          }}\n          dataList={actsDropdown}\n          keepOpened={false}\n          disablePortal={false}\n          {...dropdownMenuProps}\n        />\n      </>\n    );\n  };\n\n  const actionOverflow = actions.length > maxVisibleActions;\n\n  return (\n    <div\n      ref={ref}\n      className={cx(\n        classes.root,\n        { [classes.actionContainer]: actionOverflow },\n        className,\n      )}\n      {...others}\n    >\n      {actionOverflow\n        ? renderActionsGrid()\n        : actions.map((action, idx) => renderButton(action, idx))}\n    </div>\n  );\n});\n"],"names":["HvActionsGeneric"],"mappings":"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"}

package/dist/esm/AppSwitcher/Action/Action.styles.js

@@ -24,7 +24,6 @@ const { staticClasses, useClasses } = createClasses(
       borderLeft: `solid 2px ${theme.colors.secondary}`,
       cursor: "pointer",
       textDecoration: "inherit",
-      color: "inherit",
       backgroundColor: "inherit",
       "$disabled &": {
         cursor: "not-allowed"
@@ -36,7 +35,8 @@ const { staticClasses, useClasses } = createClasses(
       textAlign: "left",
       margin: `0 ${theme.space.xs}`,
       textWrap: "balance",
-      ...theme.typography.label
+      ...theme.typography.label,
+      color: "inherit"
     },
     titleAnchor: {
       WebkitLineClamp: 2

package/dist/esm/AppSwitcher/Action/Action.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Action.styles.js","sources":["../../../../src/AppSwitcher/Action/Action.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvAppSwitcher-Action\",\n  {\n    root: {\n      width: \"100%\",\n      maxWidth: 280,\n      minHeight: 52,\n    },\n    icon: { display: \"flex\", minWidth: 40, justifyContent: \"center\" },\n    iconUrl: { width: 32 },\n    iconInfo: { minWidth: 32 },\n    disabled: {},\n    selected: {},\n    typography: {\n      display: \"flex\",\n      justifyContent: \"flex-start\",\n      alignItems: \"center\",\n\n      width: \"100%\",\n      minHeight: 52,\n\n      padding: `6px ${theme.space.xs}`,\n\n      border: \"none\",\n      borderLeft: `solid 2px ${theme.colors.secondary}`,\n\n      cursor: \"pointer\",\n\n      textDecoration: \"inherit\",\n      color: \"inherit\",\n      backgroundColor: \"inherit\",\n\n      \"$disabled &\": {\n        cursor: \"not-allowed\",\n      },\n    },\n    title: {\n      flexGrow: 1,\n      whiteSpace: \"normal\",\n      textAlign: \"left\",\n      margin: `0 ${theme.space.xs}`,\n      textWrap: \"balance\",\n      ...theme.typography.label,\n    },\n    titleAnchor: {\n      WebkitLineClamp: 2,\n    },\n  },\n);\n"],"names":[],"mappings":";;AAGa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,MAAM;AAAA,MACJ,OAAO;AAAA,MACP,UAAU;AAAA,MACV,WAAW;AAAA,IACb;AAAA,IACA,MAAM,EAAE,SAAS,QAAQ,UAAU,IAAI,gBAAgB,SAAS;AAAA,IAChE,SAAS,EAAE,OAAO,GAAG;AAAA,IACrB,UAAU,EAAE,UAAU,GAAG;AAAA,IACzB,UAAU,CAAC;AAAA,IACX,UAAU,CAAC;AAAA,IACX,YAAY;AAAA,MACV,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB,YAAY;AAAA,MAEZ,OAAO;AAAA,MACP,WAAW;AAAA,MAEX,SAAS,OAAO,MAAM,MAAM,EAAE;AAAA,MAE9B,QAAQ;AAAA,MACR,YAAY,aAAa,MAAM,OAAO,SAAS;AAAA,MAE/C,QAAQ;AAAA,MAER,gBAAgB;AAAA,MAChB,OAAO;AAAA,MACP,iBAAiB;AAAA,MAEjB,eAAe;AAAA,QACb,QAAQ;AAAA,MAAA;AAAA,IAEZ;AAAA,IACA,OAAO;AAAA,MACL,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,WAAW;AAAA,MACX,QAAQ,KAAK,MAAM,MAAM,EAAE;AAAA,MAC3B,UAAU;AAAA,MACV,GAAG,MAAM,WAAW;AAAA,IACtB;AAAA,IACA,aAAa;AAAA,MACX,iBAAiB;AAAA,IAAA;AAAA,EACnB;AAEJ;"}
+{"version":3,"file":"Action.styles.js","sources":["../../../../src/AppSwitcher/Action/Action.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvAppSwitcher-Action\",\n  {\n    root: {\n      width: \"100%\",\n      maxWidth: 280,\n      minHeight: 52,\n    },\n    icon: { display: \"flex\", minWidth: 40, justifyContent: \"center\" },\n    iconUrl: { width: 32 },\n    iconInfo: { minWidth: 32 },\n    disabled: {},\n    selected: {},\n    typography: {\n      display: \"flex\",\n      justifyContent: \"flex-start\",\n      alignItems: \"center\",\n\n      width: \"100%\",\n      minHeight: 52,\n\n      padding: `6px ${theme.space.xs}`,\n\n      border: \"none\",\n      borderLeft: `solid 2px ${theme.colors.secondary}`,\n\n      cursor: \"pointer\",\n\n      textDecoration: \"inherit\",\n      backgroundColor: \"inherit\",\n\n      \"$disabled &\": {\n        cursor: \"not-allowed\",\n      },\n    },\n    title: {\n      flexGrow: 1,\n      whiteSpace: \"normal\",\n      textAlign: \"left\",\n      margin: `0 ${theme.space.xs}`,\n      textWrap: \"balance\",\n      ...theme.typography.label,\n      color: \"inherit\",\n    },\n    titleAnchor: {\n      WebkitLineClamp: 2,\n    },\n  },\n);\n"],"names":[],"mappings":";;AAGa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,MAAM;AAAA,MACJ,OAAO;AAAA,MACP,UAAU;AAAA,MACV,WAAW;AAAA,IACb;AAAA,IACA,MAAM,EAAE,SAAS,QAAQ,UAAU,IAAI,gBAAgB,SAAS;AAAA,IAChE,SAAS,EAAE,OAAO,GAAG;AAAA,IACrB,UAAU,EAAE,UAAU,GAAG;AAAA,IACzB,UAAU,CAAC;AAAA,IACX,UAAU,CAAC;AAAA,IACX,YAAY;AAAA,MACV,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB,YAAY;AAAA,MAEZ,OAAO;AAAA,MACP,WAAW;AAAA,MAEX,SAAS,OAAO,MAAM,MAAM,EAAE;AAAA,MAE9B,QAAQ;AAAA,MACR,YAAY,aAAa,MAAM,OAAO,SAAS;AAAA,MAE/C,QAAQ;AAAA,MAER,gBAAgB;AAAA,MAChB,iBAAiB;AAAA,MAEjB,eAAe;AAAA,QACb,QAAQ;AAAA,MAAA;AAAA,IAEZ;AAAA,IACA,OAAO;AAAA,MACL,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,WAAW;AAAA,MACX,QAAQ,KAAK,MAAM,MAAM,EAAE;AAAA,MAC3B,UAAU;AAAA,MACV,GAAG,MAAM,WAAW;AAAA,MACpB,OAAO;AAAA,IACT;AAAA,IACA,aAAa;AAAA,MACX,iBAAiB;AAAA,IAAA;AAAA,EACnB;AAEJ;"}

package/dist/esm/AvatarGroup/AvatarGroupContext.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { createContext, useMemo, useContext } from "react";
+import { useContext, createContext, useMemo } from "react";
 const HvAvatarGroupContext = createContext(null);
 const HvAvatarGroupProvider = ({
   size,