@hitachivantara/uikit-react-core 5.44.1 → 5.44.3

package/dist/esm/utils/theme.js

@@ -0,0 +1,104 @@
+import { theme, themes } from "@hitachivantara/uikit-styles";
+import { getElementById } from "./document.js";
+const setElementStyle = (element, style) => {
+  Object.entries(style).forEach(([property, value]) => {
+    element.style[property] = value;
+  });
+};
+const setElementAttrs = (themeName, modeName, colorScheme, themeRootId) => {
+  const element = themeRootId ? document.getElementById(themeRootId) : document.body;
+  if (element) {
+    element.setAttribute(`data-theme`, themeName);
+    element.setAttribute(`data-color-mode`, modeName);
+    setElementStyle(element, {
+      colorScheme,
+      backgroundColor: theme.colors.backgroundColor,
+      accentColor: theme.colors.secondary,
+      color: theme.colors.secondary,
+      fontSize: theme.typography.body.fontSize,
+      fontWeight: theme.typography.body.fontWeight,
+      lineHeight: theme.typography.body.lineHeight,
+      letterSpacing: theme.typography.body.letterSpacing,
+      fontFamily: theme.fontFamily.body
+    });
+  }
+};
+const applyThemeCustomizations = (obj, customizations) => {
+  const isObject = (val) => val && typeof val === "object" && !Array.isArray(val);
+  const customizedTheme = { ...obj };
+  Object.keys(customizations).forEach((key) => {
+    if (customizedTheme[key]) {
+      if (isObject(customizedTheme[key]) && isObject(customizations[key])) {
+        customizedTheme[key] = applyThemeCustomizations(
+          customizedTheme[key],
+          customizations[key]
+        );
+      } else if (typeof customizedTheme[key] === typeof customizations[key]) {
+        customizedTheme[key] = customizations[key];
+      }
+    } else {
+      customizedTheme[key] = customizations[key];
+    }
+  });
+  return customizedTheme;
+};
+const createTheme = (props) => {
+  const {
+    name,
+    base = "ds5",
+    inheritColorModes = true,
+    ...customizations
+  } = props;
+  const customizedTheme = customizations ? applyThemeCustomizations(themes[base], customizations) : { ...themes[base] };
+  customizedTheme.name = name.trim();
+  customizedTheme.base = base;
+  if (customizations) {
+    Object.keys(customizedTheme.colors.modes).forEach((mode) => {
+      if (!themes[base].colors.modes[mode]) {
+        customizedTheme.colors.modes[mode] = {
+          ...themes[base].colors.modes.dawn,
+          ...customizedTheme.colors.modes[mode]
+        };
+      }
+    });
+  }
+  if (!inheritColorModes && customizations.colors?.modes) {
+    Object.keys(customizedTheme.colors.modes).forEach((mode) => {
+      if (!Object.keys(customizations.colors?.modes || {}).includes(mode)) {
+        delete customizedTheme.colors.modes[mode];
+      }
+    });
+  }
+  return customizedTheme;
+};
+const processThemes = (themesList) => {
+  if (themesList && Array.isArray(themesList) && themesList.length > 0) {
+    const list = [];
+    themesList.forEach((thm) => {
+      const i = list.findIndex(
+        (t) => t.name.trim() === thm.name.trim()
+      );
+      if (i !== -1) {
+        list.splice(i, 1);
+        list.push(thm);
+      } else {
+        list.push(thm);
+      }
+    });
+    return list;
+  }
+  return [themes.ds5];
+};
+const getVarValue = (cssVar, rootElementId) => {
+  const root = getElementById(rootElementId || "hv-root");
+  if (!root)
+    return void 0;
+  return getComputedStyle(root).getPropertyValue(cssVar.replace("var(", "").replace(")", "")).trim();
+};
+export {
+  createTheme,
+  getVarValue,
+  processThemes,
+  setElementAttrs
+};
+//# sourceMappingURL=theme.js.map

package/dist/esm/utils/theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.js","sources":["../../../src/utils/theme.ts"],"sourcesContent":["import { CSSProperties } from \"react\";\n\nimport {\n  themes,\n  HvThemeColorModeStructure,\n  HvThemeStructure,\n  theme,\n} from \"@hitachivantara/uikit-styles\";\n\nimport { HvTheme, HvCreateThemeProps } from \"../types/theme\";\n\nimport { getElementById } from \"./document\";\n\n/**\n * Sets the element style properties.\n */\nconst setElementStyle = (element: HTMLElement, style: CSSProperties) => {\n  Object.entries(style).forEach(([property, value]) => {\n    element.style[property] = value;\n  });\n};\n\n/**\n * Sets the element attributes and style for a theme and color mode.\n */\nexport const setElementAttrs = (\n  themeName: string,\n  modeName: string,\n  colorScheme: string,\n  themeRootId?: string\n) => {\n  const element = themeRootId\n    ? document.getElementById(themeRootId)\n    : document.body;\n\n  if (element) {\n    element.setAttribute(`data-theme`, themeName);\n    element.setAttribute(`data-color-mode`, modeName);\n\n    // Set default properties for all components to inherit\n    setElementStyle(element, {\n      colorScheme,\n      backgroundColor: theme.colors.backgroundColor,\n      accentColor: theme.colors.secondary,\n      color: theme.colors.secondary,\n      fontSize: theme.typography.body.fontSize,\n      fontWeight: theme.typography.body.fontWeight,\n      lineHeight: theme.typography.body.lineHeight,\n      letterSpacing: theme.typography.body.letterSpacing,\n      fontFamily: theme.fontFamily.body,\n    });\n  }\n};\n\n/**\n * Applies customizations to a theme.\n */\nconst applyThemeCustomizations = (obj: any, customizations: any) => {\n  const isObject = (val: any) =>\n    val && typeof val === \"object\" && !Array.isArray(val);\n\n  // Customized theme\n  const customizedTheme = { ...obj };\n\n  // Add new values to the theme or replace values\n  Object.keys(customizations).forEach((key) => {\n    if (customizedTheme[key]) {\n      if (isObject(customizedTheme[key]) && isObject(customizations[key])) {\n        customizedTheme[key] = applyThemeCustomizations(\n          customizedTheme[key],\n          customizations[key]\n        );\n      } else if (typeof customizedTheme[key] === typeof customizations[key]) {\n        customizedTheme[key] = customizations[key];\n      }\n    } else {\n      customizedTheme[key] = customizations[key];\n    }\n  });\n\n  return customizedTheme;\n};\n\n/**\n * Creates a customized theme based on the base theme and customizations given.\n * For the color modes, the colors that are not defined will be replaced by the values from the dawn mode of the base theme.\n */\nexport const createTheme = (\n  props: HvCreateThemeProps\n): HvTheme | HvThemeStructure => {\n  const {\n    name,\n    base = \"ds5\",\n    inheritColorModes = true,\n    ...customizations\n  } = props;\n\n  // Apply customizations to the base theme\n  const customizedTheme: HvTheme | HvThemeStructure = customizations\n    ? (applyThemeCustomizations(themes[base], customizations) as HvTheme)\n    : { ...themes[base] };\n\n  // Set theme name\n  customizedTheme.name = name.trim();\n  // Set theme base\n  customizedTheme.base = base;\n\n  // Fill new color modes with missing colors\n  if (customizations) {\n    Object.keys(customizedTheme.colors.modes).forEach((mode) => {\n      if (!themes[base].colors.modes[mode]) {\n        customizedTheme.colors.modes[mode] = {\n          ...themes[base].colors.modes.dawn,\n          ...(customizedTheme.colors.modes[mode] as Partial<\n            HvThemeColorModeStructure & { [key: string]: string }\n          >),\n        };\n      }\n    });\n  }\n\n  // If the flag `inheritColorModes` is false and customizations were given for the color modes,\n  // we're removing any color modes that might have been inherited\n  if (!inheritColorModes && customizations.colors?.modes) {\n    Object.keys(customizedTheme.colors.modes).forEach((mode) => {\n      if (!Object.keys(customizations.colors?.modes || {}).includes(mode)) {\n        delete customizedTheme.colors.modes[mode];\n      }\n    });\n  }\n\n  // Created theme\n  return customizedTheme;\n};\n\n/**\n * Process the themes provided to the HvProvider:\n *  - Cleans themes with the same name\n *  - Returns the default if the list is empty (ds5)\n */\nexport const processThemes = (\n  themesList?: (HvTheme | HvThemeStructure)[]\n): (HvTheme | HvThemeStructure)[] => {\n  if (themesList && Array.isArray(themesList) && themesList.length > 0) {\n    const list: (HvTheme | HvThemeStructure)[] = [];\n\n    themesList.forEach((thm) => {\n      const i: number = list.findIndex(\n        (t) => t.name.trim() === thm.name.trim()\n      );\n\n      if (i !== -1) {\n        list.splice(i, 1);\n        list.push(thm);\n      } else {\n        list.push(thm);\n      }\n    });\n\n    // Cleaned themes\n    return list;\n  }\n  // DS5\n  return [themes.ds5];\n};\n\nexport const getVarValue = (cssVar: string, rootElementId?: string) => {\n  const root = getElementById(rootElementId || \"hv-root\");\n  if (!root) return undefined;\n\n  return getComputedStyle(root)\n    .getPropertyValue(cssVar.replace(\"var(\", \"\").replace(\")\", \"\"))\n    .trim();\n};\n"],"names":[],"mappings":"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"}

package/dist/esm/utils/useSavedState.js

@@ -0,0 +1,21 @@
+import { useState, useCallback } from "react";
+function useSavedState(defaultState) {
+  const [initialState] = useState(defaultState);
+  const [state, setState] = useState(initialState);
+  const [submittedState, setSubmittedState] = useState(
+    initialState
+  );
+  const changeState = useCallback((value, save = false) => {
+    setState(value);
+    if (save)
+      setSubmittedState(value);
+  }, []);
+  const rollback = () => {
+    setState(submittedState);
+  };
+  return [state, changeState, rollback, submittedState, initialState];
+}
+export {
+  useSavedState
+};
+//# sourceMappingURL=useSavedState.js.map

package/dist/esm/utils/useSavedState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSavedState.js","sources":["../../../src/utils/useSavedState.ts"],"sourcesContent":["import { useCallback, useState } from \"react\";\n\nexport function useSavedState<T>(defaultState: T) {\n  const [initialState] = useState<T>(defaultState);\n\n  const [state, setState] = useState<T | undefined>(initialState);\n  const [submittedState, setSubmittedState] = useState<T | undefined>(\n    initialState\n  );\n\n  const changeState = useCallback((value?: T, save = false) => {\n    setState(value);\n    if (save) setSubmittedState(value);\n  }, []);\n\n  const rollback = () => {\n    setState(submittedState);\n  };\n\n  return [state, changeState, rollback, submittedState, initialState] as const;\n}\n"],"names":[],"mappings":";AAEO,SAAS,cAAiB,cAAiB;AAChD,QAAM,CAAC,YAAY,IAAI,SAAY,YAAY;AAE/C,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAwB,YAAY;AACxD,QAAA,CAAC,gBAAgB,iBAAiB,IAAI;AAAA,IAC1C;AAAA,EAAA;AAGF,QAAM,cAAc,YAAY,CAAC,OAAW,OAAO,UAAU;AAC3D,aAAS,KAAK;AACV,QAAA;AAAM,wBAAkB,KAAK;AAAA,EACnC,GAAG,CAAE,CAAA;AAEL,QAAM,WAAW,MAAM;AACrB,aAAS,cAAc;AAAA,EAAA;AAGzB,SAAO,CAAC,OAAO,aAAa,UAAU,gBAAgB,YAAY;AACpE;"}

package/dist/esm/utils/wrapperTooltip.js

@@ -0,0 +1,15 @@
+import { withTooltip } from "../hocs/withTooltip.js";
+const hideTooltip = (evt) => {
+  const isOverFlow = evt.target.children.length > 1 ? Array.of(...evt.target.children).some(
+    (child) => child.scrollWidth > child.clientWidth
+  ) : evt.target.scrollWidth > evt.target.clientWidth;
+  return !isOverFlow;
+};
+const wrapperTooltip = (hasTooltips, Component, label) => {
+  const ComponentFunction = () => Component;
+  return hasTooltips ? withTooltip(ComponentFunction, label, "top", hideTooltip) : ComponentFunction;
+};
+export {
+  wrapperTooltip
+};
+//# sourceMappingURL=wrapperTooltip.js.map

package/dist/esm/utils/wrapperTooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"wrapperTooltip.js","sources":["../../../src/utils/wrapperTooltip.tsx"],"sourcesContent":["import { withTooltip } from \"../hocs/withTooltip\";\n\nconst hideTooltip = (evt: any) => {\n  const isOverFlow =\n    evt.target.children.length > 1\n      ? Array.of(...evt.target.children).some(\n          (child) => child.scrollWidth > child.clientWidth\n        )\n      : evt.target.scrollWidth > evt.target.clientWidth;\n\n  return !isOverFlow;\n};\n\nexport const wrapperTooltip = (\n  hasTooltips: boolean,\n  Component: any,\n  label: any\n) => {\n  const ComponentFunction = () => Component;\n  return hasTooltips\n    ? withTooltip(ComponentFunction, label, \"top\", hideTooltip)\n    : ComponentFunction;\n};\n"],"names":[],"mappings":";AAEA,MAAM,cAAc,CAAC,QAAa;AAChC,QAAM,aACJ,IAAI,OAAO,SAAS,SAAS,IACzB,MAAM,GAAG,GAAG,IAAI,OAAO,QAAQ,EAAE;AAAA,IAC/B,CAAC,UAAU,MAAM,cAAc,MAAM;AAAA,EAAA,IAEvC,IAAI,OAAO,cAAc,IAAI,OAAO;AAE1C,SAAO,CAAC;AACV;AAEO,MAAM,iBAAiB,CAC5B,aACA,WACA,UACG;AACH,QAAM,oBAAoB,MAAM;AAChC,SAAO,cACH,YAAY,mBAAmB,OAAO,OAAO,WAAW,IACxD;AACN;"}

package/dist/types/index.d.ts

@@ -6376,7 +6376,7 @@ export declare interface HvTabsProps extends Omit<TabsProps, "onChange"> {
  *
  * It leverages the Chip component from Material UI
  */
-export declare const HvTag: (props: HvTagProps) => JSX_2.Element;
+export declare const HvTag: React_2.ForwardRefExoticComponent<Omit<HvTagProps, "ref"> & React_2.RefAttributes<HTMLDivElement>>;
 
 export declare type HvTagClasses = ExtractNames<typeof useClasses_107>;
 
@@ -6920,7 +6920,10 @@ export declare type HvTypographyProps<C extends React.ElementType = "p"> = Polym
     link?: boolean;
     /** If `true` the typography will display the look of a disabled state. */
     disabled?: boolean;
-    /** If `true`, the text will have a bottom margin. */
+    /**
+     * If `true`, the typography will render a "p" element
+     * @deprecated use `component="p"` instead
+     * */
     paragraph?: boolean;
     /**
      * If `true`, the text will not wrap, but instead will truncate with a text overflow ellipsis.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hitachivantara/uikit-react-core",
-  "version": "5.44.1",
+  "version": "5.44.3",
   "private": false,
   "author": "Hitachi Vantara UI Kit Team",
   "description": "Core React components for the NEXT Design System.",
@@ -33,8 +33,8 @@
     "@emotion/css": "^11.11.2",
     "@emotion/serialize": "^1.1.2",
     "@emotion/utils": "^1.2.1",
-    "@hitachivantara/uikit-react-icons": "^5.7.13",
-    "@hitachivantara/uikit-react-shared": "^5.1.25",
+    "@hitachivantara/uikit-react-icons": "^5.8.0",
+    "@hitachivantara/uikit-react-shared": "^5.1.26",
     "@hitachivantara/uikit-styles": "^5.17.2",
     "@internationalized/date": "^3.2.0",
     "@mui/base": "^5.0.0-beta.4",
@@ -42,7 +42,6 @@
     "@react-aria/datepicker": "^3.9.0",
     "@react-stately/datepicker": "^3.9.0",
     "@types/react-table": "^7.7.18",
-    "attr-accept": "^2.2.2",
     "clsx": "^2.0.0",
     "dayjs": "^1.11.10",
     "detect-browser": "^5.3.0",
@@ -64,14 +63,14 @@
     "access": "public",
     "directory": "package"
   },
-  "gitHead": "bddad5703ed4ce1a72048abf4782d2f55213a303",
+  "gitHead": "5cf0119ea66c034bda2108043eb3c6b09ab4b7ff",
   "main": "dist/cjs/index.cjs",
   "exports": {
     ".": {
       "require": "./dist/cjs/index.cjs",
-      "import": "./dist/esm/index.mjs"
+      "import": "./dist/esm/index.js"
     }
   },
   "types": "dist/types/index.d.ts",
-  "module": "dist/esm/index.mjs"
+  "module": "dist/esm/index.js"
 }

package/dist/esm/Accordion/Accordion.mjs

@@ -1,128 +0,0 @@
-import { jsxs, jsx } from "@emotion/react/jsx-runtime";
-import { useCallback, useMemo } from "react";
-import { DropUpXS, DropDownXS } from "@hitachivantara/uikit-react-icons";
-import { useDefaultProps } from "../hooks/useDefaultProps.mjs";
-import { useControlled } from "../hooks/useControlled.mjs";
-import { useUniqueId } from "../hooks/useUniqueId.mjs";
-import { setId } from "../utils/setId.mjs";
-import { useClasses } from "./Accordion.styles.mjs";
-import { staticClasses } from "./Accordion.styles.mjs";
-import { HvTypography } from "../Typography/Typography.mjs";
-const HvAccordion = (props) => {
-  const {
-    id: idProp,
-    className,
-    classes: classesProp,
-    disabled = false,
-    label,
-    onChange,
-    children,
-    expanded,
-    headingLevel,
-    defaultExpanded = false,
-    containerProps,
-    labelVariant = "label",
-    ...others
-  } = useDefaultProps("HvAccordion", props);
-  const id = useUniqueId(idProp, "hvaccordion");
-  const { classes, cx } = useClasses(classesProp);
-  const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));
-  const handleAction = useCallback(
-    (event) => {
-      if (!disabled) {
-        onChange?.(event, isOpen);
-        setIsOpen(!isOpen);
-        return true;
-      }
-      return false;
-    },
-    [disabled, onChange, isOpen, setIsOpen]
-  );
-  const handleClick = useCallback(
-    (event) => {
-      handleAction(event);
-      event.preventDefault();
-      event.stopPropagation();
-    },
-    [handleAction]
-  );
-  const handleKeyDown = useCallback(
-    (event) => {
-      let isEventHandled = false;
-      const { key } = event;
-      if (event.altKey || event.ctrlKey || event.metaKey || event.currentTarget !== event.target) {
-        return;
-      }
-      switch (key) {
-        case "Enter":
-        case " ":
-          isEventHandled = handleAction(event);
-          break;
-        default:
-          return;
-      }
-      if (isEventHandled) {
-        event.preventDefault();
-        event.stopPropagation();
-      }
-    },
-    [handleAction]
-  );
-  const accordionHeaderId = setId(id, "button");
-  const accordionContainer = setId(id, "container");
-  const accordionHeader = useMemo(() => {
-    const color = disabled ? "secondary_60" : void 0;
-    const accordionButton = /* @__PURE__ */ jsxs(
-      HvTypography,
-      {
-        id: accordionHeaderId,
-        component: "div",
-        role: "button",
-        className: cx(classes.label, { [classes.disabled]: disabled }),
-        disabled,
-        tabIndex: 0,
-        onKeyDown: handleKeyDown,
-        onClick: handleClick,
-        variant: labelVariant,
-        "aria-expanded": isOpen,
-        "aria-disabled": disabled,
-        children: [
-          isOpen ? /* @__PURE__ */ jsx(DropUpXS, { color }) : /* @__PURE__ */ jsx(DropDownXS, { color }),
-          label
-        ]
-      }
-    );
-    return headingLevel === void 0 ? accordionButton : /* @__PURE__ */ jsx(HvTypography, { component: `h${headingLevel}`, variant: labelVariant, children: accordionButton });
-  }, [
-    cx,
-    classes,
-    handleClick,
-    handleKeyDown,
-    label,
-    accordionHeaderId,
-    disabled,
-    headingLevel,
-    isOpen,
-    labelVariant
-  ]);
-  return /* @__PURE__ */ jsxs("div", { id, className: cx(classes.root, className), ...others, children: [
-    accordionHeader,
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        id: accordionContainer,
-        role: "region",
-        "aria-labelledby": accordionHeaderId,
-        className: cx(classes.container, { [classes.hidden]: !isOpen }),
-        hidden: !isOpen,
-        ...containerProps,
-        children
-      }
-    )
-  ] });
-};
-export {
-  HvAccordion,
-  staticClasses as accordionClasses
-};
-//# sourceMappingURL=Accordion.mjs.map

package/dist/esm/Accordion/Accordion.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"Accordion.mjs","sources":["../../../src/Accordion/Accordion.tsx"],"sourcesContent":["import React, {\n  SyntheticEvent,\n  useCallback,\n  useMemo,\n  HTMLAttributes,\n} from \"react\";\n\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useControlled } from \"../hooks/useControlled\";\nimport { useUniqueId } from \"../hooks/useUniqueId\";\n\nimport { HvBaseProps } from \"../types/generic\";\nimport { setId } from \"../utils/setId\";\nimport { HvTypographyVariants, HvTypography } from \"../Typography\";\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Accordion.styles\";\n\nexport { staticClasses as accordionClasses };\n\nexport type HvAccordionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvAccordionProps\n  extends HvBaseProps<HTMLDivElement, \"onChange\" | \"children\"> {\n  /**\n   * Content to be rendered\n   */\n  children: React.ReactNode;\n  /**\n   * The accordion label button.\n   */\n  label?: string;\n  /**\n   * The function that will be executed whenever the accordion toggles it will receive the state of the accordion\n   */\n  onChange?: (event: React.SyntheticEvent, value: boolean) => void;\n  /**\n   * Whether the accordion is open or not, if this property is defined the accordion must be fully controlled.\n   */\n  expanded?: boolean;\n  /**\n   * When uncontrolled, defines the initial expanded state.\n   */\n  defaultExpanded?: boolean;\n  /**\n   * An object containing props to be passed onto container holding the accordion children.\n   */\n  containerProps?: HTMLAttributes<HTMLDivElement>;\n  /**\n   * Heading Level to apply to accordion button if ´undefined´ the button won't have a header wrapper.\n   */\n  headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;\n  /**\n   * Is the accordion disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Typography variant for the label.\n   */\n  labelVariant?: HvTypographyVariants;\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes?: HvAccordionClasses;\n}\n\n/**\n * A accordion is a design element that expands in place to expose hidden information.\n */\nexport const HvAccordion = (props: HvAccordionProps) => {\n  const {\n    id: idProp,\n    className,\n    classes: classesProp,\n    disabled = false,\n    label,\n    onChange,\n    children,\n    expanded,\n    headingLevel,\n    defaultExpanded = false,\n    containerProps,\n    labelVariant = \"label\",\n    ...others\n  } = useDefaultProps(\"HvAccordion\", props);\n\n  const id = useUniqueId(idProp, \"hvaccordion\");\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));\n\n  const handleAction = useCallback(\n    (event: SyntheticEvent) => {\n      if (!disabled) {\n        onChange?.(event, isOpen);\n        setIsOpen(!isOpen);\n        return true;\n      }\n      return false;\n    },\n    [disabled, onChange, isOpen, setIsOpen]\n  );\n\n  const handleClick = useCallback(\n    (event: SyntheticEvent) => {\n      handleAction(event);\n      event.preventDefault();\n      event.stopPropagation();\n    },\n    [handleAction]\n  );\n\n  const handleKeyDown = useCallback(\n    (event: React.KeyboardEvent<HTMLDivElement>) => {\n      let isEventHandled = false;\n      const { key } = event;\n\n      if (\n        event.altKey ||\n        event.ctrlKey ||\n        event.metaKey ||\n        event.currentTarget !== event.target\n      ) {\n        return;\n      }\n      switch (key) {\n        case \"Enter\":\n        case \" \":\n          isEventHandled = handleAction(event);\n          break;\n        default:\n          return;\n      }\n\n      if (isEventHandled) {\n        event.preventDefault();\n        event.stopPropagation();\n      }\n    },\n    [handleAction]\n  );\n\n  const accordionHeaderId = setId(id, \"button\");\n  const accordionContainer = setId(id, \"container\");\n  const accordionHeader = useMemo(() => {\n    const color = disabled ? \"secondary_60\" : undefined;\n\n    const accordionButton = (\n      <HvTypography\n        id={accordionHeaderId}\n        component=\"div\"\n        role=\"button\"\n        className={cx(classes.label, { [classes.disabled]: disabled })}\n        disabled={disabled}\n        tabIndex={0}\n        onKeyDown={handleKeyDown}\n        onClick={handleClick}\n        variant={labelVariant}\n        aria-expanded={isOpen}\n        aria-disabled={disabled}\n      >\n        {isOpen ? <DropUpXS color={color} /> : <DropDownXS color={color} />}\n        {label}\n      </HvTypography>\n    );\n\n    return headingLevel === undefined ? (\n      accordionButton\n    ) : (\n      <HvTypography component={`h${headingLevel}`} variant={labelVariant}>\n        {accordionButton}\n      </HvTypography>\n    );\n  }, [\n    cx,\n    classes,\n    handleClick,\n    handleKeyDown,\n    label,\n    accordionHeaderId,\n    disabled,\n    headingLevel,\n    isOpen,\n    labelVariant,\n  ]);\n\n  return (\n    <div id={id} className={cx(classes.root, className)} {...others}>\n      {accordionHeader}\n      <div\n        id={accordionContainer}\n        role=\"region\"\n        aria-labelledby={accordionHeaderId}\n        className={cx(classes.container, { [classes.hidden]: !isOpen })}\n        hidden={!isOpen}\n        {...containerProps}\n      >\n        {children}\n      </div>\n    </div>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/esm/Accordion/Accordion.styles.mjs

@@ -1,48 +0,0 @@
-import { theme } from "@hitachivantara/uikit-styles";
-import { outlineStyles } from "../utils/focusUtils.mjs";
-import { createClasses } from "../utils/classes.mjs";
-const { staticClasses, useClasses } = createClasses("HvAccordion", {
-  root: {
-    "& + root": {
-      paddingTop: 8
-    }
-  },
-  hidden: { height: 0, display: "none" },
-  container: { paddingTop: 8, height: "auto" },
-  label: {
-    width: "100%",
-    display: "flex",
-    justifyContent: "flex-start",
-    alignItems: "center",
-    height: "32px",
-    "&[disabled], &:active": {
-      outline: "none"
-    },
-    "&:focus": {
-      outline: "none",
-      background: theme.colors.atmo3
-    },
-    "&:hover": {
-      background: theme.colors.atmo3
-    },
-    "&:focus-visible": {
-      ...outlineStyles
-    },
-    cursor: "pointer"
-  },
-  disabled: {
-    cursor: "not-allowed",
-    color: theme.colors.secondary_60,
-    "&:focus": {
-      background: "none"
-    },
-    "&:hover": {
-      background: "none"
-    }
-  }
-});
-export {
-  staticClasses,
-  useClasses
-};
-//# sourceMappingURL=Accordion.styles.mjs.map

package/dist/esm/Accordion/Accordion.styles.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"Accordion.styles.mjs","sources":["../../../src/Accordion/Accordion.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"../utils/focusUtils\";\nimport { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvAccordion\", {\n  root: {\n    \"& + root\": {\n      paddingTop: 8,\n    },\n  },\n  hidden: { height: 0, display: \"none\" },\n  container: { paddingTop: 8, height: \"auto\" },\n  label: {\n    width: \"100%\",\n    display: \"flex\",\n    justifyContent: \"flex-start\",\n    alignItems: \"center\",\n    height: \"32px\",\n\n    \"&[disabled], &:active\": {\n      outline: \"none\",\n    },\n\n    \"&:focus\": {\n      outline: \"none\",\n      background: theme.colors.atmo3,\n    },\n\n    \"&:hover\": {\n      background: theme.colors.atmo3,\n    },\n\n    \"&:focus-visible\": {\n      ...outlineStyles,\n    },\n\n    cursor: \"pointer\",\n  },\n  disabled: {\n    cursor: \"not-allowed\",\n    color: theme.colors.secondary_60,\n\n    \"&:focus\": {\n      background: \"none\",\n    },\n\n    \"&:hover\": {\n      background: \"none\",\n    },\n  },\n});\n"],"names":[],"mappings":";;;AAKO,MAAM,EAAE,eAAe,eAAe,cAAc,eAAe;AAAA,EACxE,MAAM;AAAA,IACJ,YAAY;AAAA,MACV,YAAY;AAAA,IACd;AAAA,EACF;AAAA,EACA,QAAQ,EAAE,QAAQ,GAAG,SAAS,OAAO;AAAA,EACrC,WAAW,EAAE,YAAY,GAAG,QAAQ,OAAO;AAAA,EAC3C,OAAO;AAAA,IACL,OAAO;AAAA,IACP,SAAS;AAAA,IACT,gBAAgB;AAAA,IAChB,YAAY;AAAA,IACZ,QAAQ;AAAA,IAER,yBAAyB;AAAA,MACvB,SAAS;AAAA,IACX;AAAA,IAEA,WAAW;AAAA,MACT,SAAS;AAAA,MACT,YAAY,MAAM,OAAO;AAAA,IAC3B;AAAA,IAEA,WAAW;AAAA,MACT,YAAY,MAAM,OAAO;AAAA,IAC3B;AAAA,IAEA,mBAAmB;AAAA,MACjB,GAAG;AAAA,IACL;AAAA,IAEA,QAAQ;AAAA,EACV;AAAA,EACA,UAAU;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,MAAM,OAAO;AAAA,IAEpB,WAAW;AAAA,MACT,YAAY;AAAA,IACd;AAAA,IAEA,WAAW;AAAA,MACT,YAAY;AAAA,IACd;AAAA,EACF;AACF,CAAC;"}

package/dist/esm/ActionBar/ActionBar.mjs

@@ -1,19 +0,0 @@
-import { jsx } from "@emotion/react/jsx-runtime";
-import { useDefaultProps } from "../hooks/useDefaultProps.mjs";
-import { useClasses } from "./ActionBar.styles.mjs";
-import { staticClasses } from "./ActionBar.styles.mjs";
-const HvActionBar = (props) => {
-  const {
-    classes: classesProp,
-    className,
-    children,
-    ...others
-  } = useDefaultProps("HvActionBar", props);
-  const { classes, cx } = useClasses(classesProp);
-  return /* @__PURE__ */ jsx("div", { className: cx(classes.root, className), ...others, children });
-};
-export {
-  HvActionBar,
-  staticClasses as actionBarClasses
-};
-//# sourceMappingURL=ActionBar.mjs.map

package/dist/esm/ActionBar/ActionBar.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"ActionBar.mjs","sources":["../../../src/ActionBar/ActionBar.tsx"],"sourcesContent":["import { HvBaseProps } from \"../types/generic\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\n\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { staticClasses, useClasses } from \"./ActionBar.styles\";\n\nexport { staticClasses as actionBarClasses };\n\nexport type HvActionBarClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvActionBarProps extends HvBaseProps {\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvActionBarClasses;\n}\n\nexport const HvActionBar = (props: HvActionBarProps) => {\n  const {\n    classes: classesProp,\n    className,\n    children,\n    ...others\n  } = useDefaultProps(\"HvActionBar\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  return (\n    <div className={cx(classes.root, className)} {...others}>\n      {children}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;AAgBa,MAAA,cAAc,CAAC,UAA4B;AAChD,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,eAAe,KAAK;AACxC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAG5C,SAAA,oBAAC,OAAI,EAAA,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,QAC9C,SACH,CAAA;AAEJ;"}

package/dist/esm/ActionBar/ActionBar.styles.mjs

@@ -1,17 +0,0 @@
-import { theme } from "@hitachivantara/uikit-styles";
-import { createClasses } from "../utils/classes.mjs";
-const { staticClasses, useClasses } = createClasses("HvActionBar", {
-  root: {
-    width: "100%",
-    padding: theme.space.sm,
-    borderTop: `1px solid ${theme.colors.atmo4}`,
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "flex-end"
-  }
-});
-export {
-  staticClasses,
-  useClasses
-};
-//# sourceMappingURL=ActionBar.styles.mjs.map

package/dist/esm/ActionBar/ActionBar.styles.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"ActionBar.styles.mjs","sources":["../../../src/ActionBar/ActionBar.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvActionBar\", {\n  root: {\n    width: \"100%\",\n    padding: theme.space.sm,\n    borderTop: `1px solid ${theme.colors.atmo4}`,\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"flex-end\",\n  },\n});\n"],"names":[],"mappings":";;AAIO,MAAM,EAAE,eAAe,eAAe,cAAc,eAAe;AAAA,EACxE,MAAM;AAAA,IACJ,OAAO;AAAA,IACP,SAAS,MAAM,MAAM;AAAA,IACrB,WAAW,aAAa,MAAM,OAAO,KAAK;AAAA,IAC1C,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,EAClB;AACF,CAAC;"}

package/dist/esm/ActionsGeneric/ActionsGeneric.mjs

@@ -1,90 +0,0 @@
-import { jsx, jsxs, Fragment } from "@emotion/react/jsx-runtime";
-import { isValidElement } from "react";
-import { MoreOptionsVertical } from "@hitachivantara/uikit-react-icons";
-import { useDefaultProps } from "../hooks/useDefaultProps.mjs";
-import { setId } from "../utils/setId.mjs";
-import { useClasses } from "./ActionsGeneric.styles.mjs";
-import { staticClasses } from "./ActionsGeneric.styles.mjs";
-import { HvButton } from "../Button/Button.mjs";
-import { HvDropDownMenu } from "../DropDownMenu/DropDownMenu.mjs";
-const HvActionsGeneric = (props) => {
-  const {
-    id,
-    classes: classesProp,
-    className,
-    category = "secondaryGhost",
-    disabled = false,
-    actions = [],
-    actionsCallback,
-    maxVisibleActions = Infinity,
-    ...others
-  } = useDefaultProps("HvActionsGeneric", props);
-  const { classes, cx } = useClasses(classesProp);
-  if (!Array.isArray(actions))
-    return isValidElement(actions) ? actions : null;
-  const renderButton = (action, idx) => {
-    const { disabled: actDisabled, id: actId, icon, label, ...other } = action;
-    const actionId = setId(id, idx, "action", action.id);
-    const renderedIcon = isValidElement(icon) ? icon : icon?.({ isDisabled: disabled });
-    return /* @__PURE__ */ jsx(
-      HvButton,
-      {
-        id: actionId,
-        variant: category,
-        className: classes.button,
-        disabled: actDisabled ?? disabled,
-        onClick: (event) => actionsCallback?.(event, id || "", action),
-        startIcon: renderedIcon,
-        ...other,
-        children: label
-      },
-      actionId || idx
-    );
-  };
-  const renderActionsGrid = () => {
-    const actsVisible = actions.slice(0, maxVisibleActions);
-    const actsDropdown = actions.slice(maxVisibleActions);
-    const semantic = category === "semantic";
-    const iconColor = disabled && "secondary_60" || semantic && "base_dark" || void 0;
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
-      actsVisible.map((action, idx) => renderButton(action, idx)),
-      /* @__PURE__ */ jsx(
-        HvDropDownMenu,
-        {
-          id: setId(id, "menu"),
-          disabled,
-          category,
-          classes: {
-            root: classes.dropDownMenu,
-            icon: classes.dropDownMenuButton,
-            iconSelected: classes.dropDownMenuButtonSelected
-          },
-          icon: /* @__PURE__ */ jsx(MoreOptionsVertical, { color: iconColor }),
-          placement: "left",
-          onClick: (event, action) => actionsCallback?.(event, id || "", action),
-          dataList: actsDropdown,
-          keepOpened: false,
-          disablePortal: false
-        }
-      )
-    ] });
-  };
-  const actionOverflow = actions.length > maxVisibleActions;
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: cx(
-        classes.root,
-        { [classes.actionContainer]: actionOverflow },
-        className
-      ),
-      ...others,
-      children: actionOverflow ? renderActionsGrid() : actions.map((action, idx) => renderButton(action, idx))
-    }
-  );
-};
-export {
-  HvActionsGeneric,
-  staticClasses as actionsGenericClasses
-};
-//# sourceMappingURL=ActionsGeneric.mjs.map

package/dist/esm/ActionsGeneric/ActionsGeneric.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"ActionsGeneric.mjs","sources":["../../../src/ActionsGeneric/ActionsGeneric.tsx"],"sourcesContent":["import React, { isValidElement } from \"react\";\nimport { MoreOptionsVertical } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvButton, HvButtonVariant } from \"../Button\";\nimport { HvDropDownMenu } from \"../DropDownMenu\";\nimport { setId } from \"../utils/setId\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { HvBaseProps } from \"../types/generic\";\n\nimport { staticClasses, useClasses } from \"./ActionsGeneric.styles\";\n\nexport { staticClasses as actionsGenericClasses };\n\nexport type HvActionsGenericClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvActionGeneric {\n  id: string;\n  label: string;\n  icon?:\n    | React.ReactNode\n    | ((params: { isDisabled?: boolean }) => React.ReactNode);\n  disabled?: boolean;\n}\n\nexport interface HvActionsGenericProps extends HvBaseProps {\n  /** Button category. */\n  category?: HvButtonVariant;\n  /**  Whether actions should be all disabled */\n  disabled?: boolean;\n  /** The renderable content inside the actions slot of the footer, or an Array of actions `{id, label, icon, disabled}` */\n  actions: React.ReactNode | HvActionGeneric[];\n  /**  The callback function ran when an action is triggered, receiving `action` as param */\n  actionsCallback?: (\n    event: React.SyntheticEvent,\n    id: string,\n    action: HvActionGeneric\n  ) => void;\n  /**  The number of maximum visible actions before they're collapsed into a `DropDownMenu`. */\n  maxVisibleActions?: number;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvActionsGenericClasses;\n}\n\nexport const HvActionsGeneric = (props: HvActionsGenericProps) => {\n  const {\n    id,\n    classes: classesProp,\n    className,\n    category = \"secondaryGhost\",\n    disabled = false,\n    actions = [],\n    actionsCallback,\n    maxVisibleActions = Infinity,\n    ...others\n  } = useDefaultProps(\"HvActionsGeneric\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  if (!Array.isArray(actions)) return isValidElement(actions) ? actions : null;\n\n  const renderButton = (action: HvActionGeneric, idx: number) => {\n    const { disabled: actDisabled, id: actId, icon, label, ...other } = action;\n    const actionId = setId(id, idx, \"action\", action.id);\n\n    const renderedIcon = isValidElement(icon)\n      ? icon\n      : (icon as Function)?.({ isDisabled: disabled });\n\n    return (\n      <HvButton\n        id={actionId}\n        key={actionId || idx}\n        variant={category}\n        className={classes.button}\n        disabled={actDisabled ?? disabled}\n        onClick={(event) => actionsCallback?.(event, id || \"\", action)}\n        startIcon={renderedIcon}\n        {...other}\n      >\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 = category === \"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(id, \"menu\")}\n          disabled={disabled}\n          category={category}\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            actionsCallback?.(event, id || \"\", action as HvActionGeneric)\n          }\n          dataList={actsDropdown}\n          keepOpened={false}\n          disablePortal={false}\n        />\n      </>\n    );\n  };\n\n  const actionOverflow = actions.length > maxVisibleActions;\n\n  return (\n    <div\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":[],"mappings":";;;;;;;;;AA4Ca,MAAA,mBAAmB,CAAC,UAAiC;AAC1D,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,WAAW;AAAA,IACX,WAAW;AAAA,IACX,UAAU,CAAC;AAAA,IACX;AAAA,IACA,oBAAoB;AAAA,IACpB,GAAG;AAAA,EAAA,IACD,gBAAgB,oBAAoB,KAAK;AAE7C,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE1C,MAAA,CAAC,MAAM,QAAQ,OAAO;AAAU,WAAA,eAAe,OAAO,IAAI,UAAU;AAElE,QAAA,eAAe,CAAC,QAAyB,QAAgB;AACvD,UAAA,EAAE,UAAU,aAAa,IAAI,OAAO,MAAM,OAAO,GAAG,MAAU,IAAA;AACpE,UAAM,WAAW,MAAM,IAAI,KAAK,UAAU,OAAO,EAAE;AAE7C,UAAA,eAAe,eAAe,IAAI,IACpC,OACC,OAAoB,EAAE,YAAY,SAAA,CAAU;AAG/C,WAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,IAAI;AAAA,QAEJ,SAAS;AAAA,QACT,WAAW,QAAQ;AAAA,QACnB,UAAU,eAAe;AAAA,QACzB,SAAS,CAAC,UAAU,kBAAkB,OAAO,MAAM,IAAI,MAAM;AAAA,QAC7D,WAAW;AAAA,QACV,GAAG;AAAA,QAEH,UAAA;AAAA,MAAA;AAAA,MARI,YAAY;AAAA,IAAA;AAAA,EASnB;AAIJ,QAAM,oBAAoB,MAAM;AAC9B,UAAM,cAAc,QAAQ,MAAM,GAAG,iBAAiB;AAChD,UAAA,eAAe,QAAQ,MAAM,iBAAiB;AAEpD,UAAM,WAAW,aAAa;AAC9B,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,IAAI,MAAM;AAAA,UACpB;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,WACf,kBAAkB,OAAO,MAAM,IAAI,MAAyB;AAAA,UAE9D,UAAU;AAAA,UACV,YAAY;AAAA,UACZ,eAAe;AAAA,QAAA;AAAA,MACjB;AAAA,IACF,EAAA,CAAA;AAAA,EAAA;AAIE,QAAA,iBAAiB,QAAQ,SAAS;AAGtC,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,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,EAAA;AAGhE;"}

package/dist/esm/ActionsGeneric/ActionsGeneric.styles.mjs

@@ -1,22 +0,0 @@
-import { theme } from "@hitachivantara/uikit-styles";
-import { createClasses } from "../utils/classes.mjs";
-const { staticClasses, useClasses } = createClasses("HvActionsGeneric", {
-  root: {},
-  button: {
-    "&:not(:last-child)": {
-      marginRight: theme.space.xs
-    },
-    "&:hover": {
-      backgroundColor: theme.alpha("base_light", 0.3)
-    }
-  },
-  actionContainer: { display: "flex", alignItems: "center", float: "right" },
-  dropDownMenu: {},
-  dropDownMenuButton: {},
-  dropDownMenuButtonSelected: {}
-});
-export {
-  staticClasses,
-  useClasses
-};
-//# sourceMappingURL=ActionsGeneric.styles.mjs.map

package/dist/esm/ActionsGeneric/ActionsGeneric.styles.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"ActionsGeneric.styles.mjs","sources":["../../../src/ActionsGeneric/ActionsGeneric.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvActionsGeneric\", {\n  root: {},\n  button: {\n    \"&:not(:last-child)\": {\n      marginRight: theme.space.xs,\n    },\n    \"&:hover\": {\n      backgroundColor: theme.alpha(\"base_light\", 0.3),\n    },\n  },\n  actionContainer: { display: \"flex\", alignItems: \"center\", float: \"right\" },\n  dropDownMenu: {},\n  dropDownMenuButton: {},\n  dropDownMenuButtonSelected: {},\n});\n"],"names":[],"mappings":";;AAIO,MAAM,EAAE,eAAe,eAAe,cAAc,oBAAoB;AAAA,EAC7E,MAAM,CAAC;AAAA,EACP,QAAQ;AAAA,IACN,sBAAsB;AAAA,MACpB,aAAa,MAAM,MAAM;AAAA,IAC3B;AAAA,IACA,WAAW;AAAA,MACT,iBAAiB,MAAM,MAAM,cAAc,GAAG;AAAA,IAChD;AAAA,EACF;AAAA,EACA,iBAAiB,EAAE,SAAS,QAAQ,YAAY,UAAU,OAAO,QAAQ;AAAA,EACzE,cAAc,CAAC;AAAA,EACf,oBAAoB,CAAC;AAAA,EACrB,4BAA4B,CAAC;AAC/B,CAAC;"}