@hitachivantara/uikit-react-core 5.27.6 → 5.27.7

package/dist/cjs/components/Accordion/Accordion.cjs

@@ -1,12 +1,12 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const useControlled = require("../../hooks/useControlled.cjs");
 const setId = require("../../utils/setId.cjs");
 const Accordion_styles = require("./Accordion.styles.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const Typography = require("../Typography/Typography.cjs");
 const HvAccordion = (props) => {
   const {
@@ -67,49 +67,21 @@ const HvAccordion = (props) => {
   const accordionContainer = setId.setId(id, "container");
   const accordionHeader = React.useMemo(() => {
     const color = disabled && ["secondary_60"] || void 0;
-    const accordionButton = /* @__PURE__ */ jsxRuntime.jsxs(Typography.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__ */ jsxRuntime.jsx(uikitReactIcons.DropUpXS, {
-        color
-      }) : /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.DropDownXS, {
-        color
-      }), label]
-    });
-    const result = headingLevel === void 0 ? accordionButton : /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
-      component: `h${headingLevel}`,
-      variant: labelVariant,
-      children: accordionButton
-    });
+    const accordionButton = /* @__PURE__ */ jsxRuntime.jsxs(Typography.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__ */ jsxRuntime.jsx(uikitReactIcons.DropUpXS, { color }) : /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.DropDownXS, { color }),
+      label
+    ] });
+    const result = headingLevel === void 0 ? accordionButton : /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { component: `h${headingLevel}`, variant: labelVariant, children: accordionButton });
     return result;
   }, [cx, classes, handleClick, handleKeyDown, label, accordionHeaderId, disabled, headingLevel, isOpen, labelVariant]);
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    id,
-    className: cx(classes.root, className),
-    ...others,
-    children: [accordionHeader, /* @__PURE__ */ jsxRuntime.jsx("div", {
-      id: accordionContainer,
-      role: "region",
-      "aria-labelledby": accordionHeaderId,
-      className: cx(classes.container, {
-        [classes.hidden]: !isOpen
-      }),
-      hidden: !isOpen,
-      ...containerProps,
-      children
-    })]
-  });
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { id, className: cx(classes.root, className), ...others, children: [
+    accordionHeader,
+    /* @__PURE__ */ jsxRuntime.jsx("div", { id: accordionContainer, role: "region", "aria-labelledby": accordionHeaderId, className: cx(classes.container, {
+      [classes.hidden]: !isOpen
+    }), hidden: !isOpen, ...containerProps, children })
+  ] });
 };
 exports.accordionClasses = Accordion_styles.staticClasses;
 exports.HvAccordion = HvAccordion;

package/dist/cjs/components/Accordion/Accordion.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.cjs","sources":["../../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["import React, {\n  SyntheticEvent,\n  useCallback,\n  useMemo,\n  HTMLAttributes,\n} from \"react\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { setId } from \"@core/utils/setId\";\nimport {\n  HvTypographyVariants,\n  HvTypography,\n} from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/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,\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 { 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    const result =\n      headingLevel === undefined ? (\n        accordionButton\n      ) : (\n        <HvTypography component={`h${headingLevel}`} variant={labelVariant}>\n          {accordionButton}\n        </HvTypography>\n      );\n    return result;\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":["HvAccordion","props","id","className","classes","classesProp","disabled","label","onChange","children","expanded","headingLevel","defaultExpanded","containerProps","labelVariant","others","useDefaultProps","cx","useClasses","isOpen","setIsOpen","useControlled","Boolean","handleAction","useCallback","event","handleClick","preventDefault","stopPropagation","handleKeyDown","isEventHandled","key","altKey","ctrlKey","metaKey","currentTarget","target","accordionHeaderId","setId","accordionContainer","accordionHeader","useMemo","color","undefined","accordionButton","HvTypography","component","role","tabIndex","onKeyDown","onClick","variant","_jsx","DropUpXS","DropDownXS","result","root","container","hidden"],"mappings":"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"}
+{"version":3,"file":"Accordion.cjs","sources":["../../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["import React, {\n  SyntheticEvent,\n  useCallback,\n  useMemo,\n  HTMLAttributes,\n} from \"react\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { setId } from \"@core/utils/setId\";\nimport {\n  HvTypographyVariants,\n  HvTypography,\n} from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/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,\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 { 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    const result =\n      headingLevel === undefined ? (\n        accordionButton\n      ) : (\n        <HvTypography component={`h${headingLevel}`} variant={labelVariant}>\n          {accordionButton}\n        </HvTypography>\n      );\n    return result;\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":["HvAccordion","props","id","className","classes","classesProp","disabled","label","onChange","children","expanded","headingLevel","defaultExpanded","containerProps","labelVariant","others","useDefaultProps","cx","useClasses","isOpen","setIsOpen","useControlled","Boolean","handleAction","useCallback","event","handleClick","preventDefault","stopPropagation","handleKeyDown","isEventHandled","key","altKey","ctrlKey","metaKey","currentTarget","target","accordionHeaderId","setId","accordionContainer","accordionHeader","useMemo","color","undefined","accordionButton","jsxs","HvTypography","DropUpXS","jsx","DropDownXS","result","root","container","hidden"],"mappings":"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"}

package/dist/cjs/components/ActionBar/ActionBar.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
 const ActionBar_styles = require("./ActionBar.styles.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const HvActionBar = (props) => {
   const {
     classes: classesProp,
@@ -14,11 +14,7 @@ const HvActionBar = (props) => {
     classes,
     cx
   } = ActionBar_styles.useClasses(classesProp);
-  return /* @__PURE__ */ jsxRuntime.jsx("div", {
-    className: cx(classes.root, className),
-    ...others,
-    children
-  });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx(classes.root, className), ...others, children });
 };
 exports.actionBarClasses = ActionBar_styles.staticClasses;
 exports.HvActionBar = HvActionBar;

package/dist/cjs/components/ActionBar/ActionBar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ActionBar.cjs","sources":["../../../../src/components/ActionBar/ActionBar.tsx"],"sourcesContent":["import { HvBaseProps } from \"@core/types/generic\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { ExtractNames } from \"@core/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":["HvActionBar","props","classes","classesProp","className","children","others","useDefaultProps","cx","useClasses","root"],"mappings":";;;;;AAgBaA,MAAAA,cAAcA,CAACC,UAA4B;AAChD,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,eAAeN,KAAK;AAClC,QAAA;AAAA,IAAEC;AAAAA,IAASM;AAAAA,EAAAA,IAAOC,iBAAAA,WAAWN,WAAW;AAE9C,wCACE,OAAA;AAAA,IAAKC,WAAWI,GAAGN,QAAQQ,MAAMN,SAAS;AAAA,IAAE,GAAKE;AAAAA,IAAMD;AAAAA,EAAAA,CAElD;AAET;;;"}
+{"version":3,"file":"ActionBar.cjs","sources":["../../../../src/components/ActionBar/ActionBar.tsx"],"sourcesContent":["import { HvBaseProps } from \"@core/types/generic\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { ExtractNames } from \"@core/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":["HvActionBar","props","classes","classesProp","className","children","others","useDefaultProps","cx","useClasses","jsx","root"],"mappings":";;;;;AAgBaA,MAAAA,cAAcA,CAACC,UAA4B;AAChD,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,eAAeN,KAAK;AAClC,QAAA;AAAA,IAAEC;AAAAA,IAASM;AAAAA,EAAAA,IAAOC,iBAAAA,WAAWN,WAAW;AAG5C,SAAAO,+BAAC,OAAI,EAAA,WAAWF,GAAGN,QAAQS,MAAMP,SAAS,GAAG,GAAIE,QAC9CD,SACH,CAAA;AAEJ;;;"}

package/dist/cjs/components/ActionsGeneric/ActionsGeneric.cjs

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
@@ -8,7 +9,6 @@ const hexToRgbA = require("../../utils/hexToRgbA.cjs");
 const setId = require("../../utils/setId.cjs");
 const useTheme = require("../../hooks/useTheme.cjs");
 const ActionsGeneric_styles = require("./ActionsGeneric.styles.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const Button = require("../Button/Button.cjs");
 const DropDownMenu = require("../DropDownMenu/DropDownMenu.cjs");
 const HvActionsGeneric = (props) => {
@@ -45,55 +45,30 @@ const HvActionsGeneric = (props) => {
     const renderedIcon = React.isValidElement(icon) ? icon : icon == null ? void 0 : icon({
       isDisabled: disabled
     });
-    return /* @__PURE__ */ jsxRuntime.jsx(Button.HvButton, {
-      id: actionId,
-      variant: category,
-      className: cx(css({
-        "&:hover": {
-          backgroundColor: hexToRgbA.hexToRgbA((colors == null ? void 0 : colors.base_light) || uikitStyles.theme.colors.base_light, 0.3)
-        }
-      }), classes.button),
-      disabled: actDisabled ?? disabled,
-      onClick: (event) => actionsCallback == null ? void 0 : actionsCallback(event, id || "", action),
-      startIcon: renderedIcon,
-      ...other,
-      children: label
-    }, actionId || idx);
+    return /* @__PURE__ */ jsxRuntime.jsx(Button.HvButton, { id: actionId, variant: category, className: cx(css({
+      "&:hover": {
+        backgroundColor: hexToRgbA.hexToRgbA((colors == null ? void 0 : colors.base_light) || uikitStyles.theme.colors.base_light, 0.3)
+      }
+    }), classes.button), disabled: actDisabled ?? disabled, onClick: (event) => actionsCallback == null ? void 0 : 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__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [actsVisible.map((action, idx) => renderButton(action, idx)), /* @__PURE__ */ jsxRuntime.jsx(DropDownMenu.HvDropDownMenu, {
-        id: setId.setId(id, "menu"),
-        disabled,
-        category,
-        classes: {
-          root: classes.dropDownMenu,
-          icon: classes.dropDownMenuButton,
-          iconSelected: classes.dropDownMenuButtonSelected
-        },
-        icon: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.MoreOptionsVertical, {
-          color: iconColor
-        }),
-        placement: "left",
-        onClick: (event, action) => actionsCallback == null ? void 0 : actionsCallback(event, id || "", action),
-        dataList: actsDropdown,
-        keepOpened: false,
-        disablePortal: false
-      })]
-    });
+    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      actsVisible.map((action, idx) => renderButton(action, idx)),
+      /* @__PURE__ */ jsxRuntime.jsx(DropDownMenu.HvDropDownMenu, { id: setId.setId(id, "menu"), disabled, category, classes: {
+        root: classes.dropDownMenu,
+        icon: classes.dropDownMenuButton,
+        iconSelected: classes.dropDownMenuButtonSelected
+      }, icon: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.MoreOptionsVertical, { color: iconColor }), placement: "left", onClick: (event, action) => actionsCallback == null ? void 0 : actionsCallback(event, id || "", action), dataList: actsDropdown, keepOpened: false, disablePortal: false })
+    ] });
   };
   const actionOverflow = actions.length > maxVisibleActions;
-  return /* @__PURE__ */ jsxRuntime.jsx("div", {
-    className: cx(classes.root, {
-      [classes.actionContainer]: actionOverflow
-    }, className),
-    ...others,
-    children: actionOverflow ? renderActionsGrid() : actions.map((action, idx) => renderButton(action, idx))
-  });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx(classes.root, {
+    [classes.actionContainer]: actionOverflow
+  }, className), ...others, children: actionOverflow ? renderActionsGrid() : actions.map((action, idx) => renderButton(action, idx)) });
 };
 exports.actionsGenericClasses = ActionsGeneric_styles.staticClasses;
 exports.HvActionsGeneric = HvActionsGeneric;

package/dist/cjs/components/ActionsGeneric/ActionsGeneric.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ActionsGeneric.cjs","sources":["../../../../src/components/ActionsGeneric/ActionsGeneric.tsx"],"sourcesContent":["import React, { isValidElement } from \"react\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { MoreOptionsVertical } from \"@hitachivantara/uikit-react-icons\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { hexToRgbA } from \"@core/utils/hexToRgbA\";\nimport { HvButton, HvButtonVariant } from \"@core/components/Button\";\nimport { HvDropDownMenu } from \"@core/components/DropDownMenu\";\nimport { setId } from \"@core/utils/setId\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { useTheme } from \"@core/hooks/useTheme\";\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, css } = useClasses(classesProp);\n\n  const { colors } = useTheme();\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={cx(\n          css({\n            \"&:hover\": {\n              backgroundColor: hexToRgbA(\n                colors?.base_light || theme.colors.base_light,\n                0.3\n              ),\n            },\n          }),\n          classes.button\n        )}\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":["HvActionsGeneric","props","id","classes","classesProp","className","category","disabled","actions","actionsCallback","maxVisibleActions","Infinity","others","useDefaultProps","cx","css","useClasses","colors","useTheme","Array","isArray","isValidElement","renderButton","action","idx","actDisabled","actId","icon","label","other","actionId","setId","renderedIcon","isDisabled","HvButton","variant","backgroundColor","hexToRgbA","base_light","theme","button","onClick","event","startIcon","children","renderActionsGrid","actsVisible","slice","actsDropdown","semantic","iconColor","undefined","_Fragment","map","HvDropDownMenu","root","dropDownMenu","dropDownMenuButton","iconSelected","dropDownMenuButtonSelected","MoreOptionsVertical","color","placement","dataList","keepOpened","disablePortal","actionOverflow","length","actionContainer"],"mappings":"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"}
+{"version":3,"file":"ActionsGeneric.cjs","sources":["../../../../src/components/ActionsGeneric/ActionsGeneric.tsx"],"sourcesContent":["import React, { isValidElement } from \"react\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { MoreOptionsVertical } from \"@hitachivantara/uikit-react-icons\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { hexToRgbA } from \"@core/utils/hexToRgbA\";\nimport { HvButton, HvButtonVariant } from \"@core/components/Button\";\nimport { HvDropDownMenu } from \"@core/components/DropDownMenu\";\nimport { setId } from \"@core/utils/setId\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { useTheme } from \"@core/hooks/useTheme\";\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, css } = useClasses(classesProp);\n\n  const { colors } = useTheme();\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={cx(\n          css({\n            \"&:hover\": {\n              backgroundColor: hexToRgbA(\n                colors?.base_light || theme.colors.base_light,\n                0.3\n              ),\n            },\n          }),\n          classes.button\n        )}\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":["HvActionsGeneric","props","id","classes","classesProp","className","category","disabled","actions","actionsCallback","maxVisibleActions","Infinity","others","useDefaultProps","cx","css","useClasses","colors","useTheme","Array","isArray","isValidElement","renderButton","action","idx","actDisabled","actId","icon","label","other","actionId","setId","renderedIcon","isDisabled","jsx","HvButton","backgroundColor","hexToRgbA","base_light","theme","button","event","renderActionsGrid","actsVisible","slice","actsDropdown","semantic","iconColor","undefined","map","HvDropDownMenu","root","dropDownMenu","dropDownMenuButton","iconSelected","dropDownMenuButtonSelected","MoreOptionsVertical","actionOverflow","length","actionContainer"],"mappings":"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"}

package/dist/cjs/components/AppSwitcher/Action/Action.cjs

@@ -1,12 +1,12 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const useUniqueId = require("../../../hooks/useUniqueId.cjs");
 const TitleWithTooltip = require("../TitleWithTooltip.cjs");
 const Action_styles = require("./Action.styles.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const Avatar = require("../../Avatar/Avatar.cjs");
 const Typography = require("../../Typography/Typography.cjs");
 const ListItem = require("../../ListContainer/ListItem/ListItem.cjs");
@@ -40,24 +40,13 @@ const HvAppSwitcherAction = ({
       return iconElement;
     }
     if (iconUrl && validIconUrl) {
-      return /* @__PURE__ */ jsxRuntime.jsx("img", {
-        className: classes.iconUrl,
-        src: iconUrl,
-        onError: () => {
-          setValidIconUrl(false);
-        },
-        alt: description
-      });
+      return /* @__PURE__ */ jsxRuntime.jsx("img", { className: classes.iconUrl, src: iconUrl, onError: () => {
+        setValidIconUrl(false);
+      }, alt: description });
     }
     const brokenTitle = name.split(" ");
     const initials = brokenTitle[0].substring(0, 1) + (brokenTitle[1] ? brokenTitle[1].substring(0, 1) : "");
-    return /* @__PURE__ */ jsxRuntime.jsx(Avatar.HvAvatar, {
-      size: "sm",
-      backgroundColor: color,
-      variant: "square",
-      "aria-hidden": true,
-      children: initials
-    });
+    return /* @__PURE__ */ jsxRuntime.jsx(Avatar.HvAvatar, { size: "sm", backgroundColor: color, variant: "square", "aria-hidden": true, children: initials });
   };
   const isSelected = isSelectedCallback(application);
   const handleOnClick = React.useCallback((event) => {
@@ -85,54 +74,18 @@ const HvAppSwitcherAction = ({
       }
     };
     if (isLink) {
-      return /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
-        component: "a",
-        href: url,
-        target: target || "_top",
-        ...typographyProps,
-        children
-      });
+      return /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { component: "a", href: url, target: target || "_top", ...typographyProps, children });
     }
-    return /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
-      component: "button",
-      ...typographyProps,
-      children
-    });
+    return /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { component: "button", ...typographyProps, children });
   }, [classes.typography, color, description, descriptionElementId, handleOnClick, isLink, name, target, url]);
-  return /* @__PURE__ */ jsxRuntime.jsx(ListItem.HvListItem, {
-    id,
-    interactive: true,
-    tabIndex: 0,
-    selected: isSelected,
-    disabled,
-    className: cx(classes.root, {
-      [classes.disabled]: disabled,
-      [classes.selected]: isSelected
-    }, className),
-    children: renderApplication(/* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-        className: classes.icon,
-        children: renderApplicationIcon()
-      }), /* @__PURE__ */ jsxRuntime.jsx(TitleWithTooltip.default, {
-        title: name,
-        className: classes.title
-      }), description && /* @__PURE__ */ jsxRuntime.jsx(Tooltip.HvTooltip, {
-        disableFocusListener: true,
-        disableTouchListener: true,
-        title: /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
-          children: description
-        }),
-        children: /* @__PURE__ */ jsxRuntime.jsx("div", {
-          children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Info, {
-            className: classes.iconInfo,
-            role: "img",
-            "aria-label": description,
-            id: descriptionElementId
-          })
-        })
-      })]
-    }))
-  });
+  return /* @__PURE__ */ jsxRuntime.jsx(ListItem.HvListItem, { id, interactive: true, tabIndex: 0, selected: isSelected, disabled, className: cx(classes.root, {
+    [classes.disabled]: disabled,
+    [classes.selected]: isSelected
+  }, className), children: renderApplication(/* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.icon, children: renderApplicationIcon() }),
+    /* @__PURE__ */ jsxRuntime.jsx(TitleWithTooltip.default, { title: name, className: classes.title }),
+    description && /* @__PURE__ */ jsxRuntime.jsx(Tooltip.HvTooltip, { disableFocusListener: true, disableTouchListener: true, title: /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { children: description }), children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Info, { className: classes.iconInfo, role: "img", "aria-label": description, id: descriptionElementId }) }) })
+  ] })) });
 };
 exports.appSwitcherActionClasses = Action_styles.staticClasses;
 exports.HvAppSwitcherAction = HvAppSwitcherAction;

package/dist/cjs/components/AppSwitcher/Action/Action.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Action.cjs","sources":["../../../../../src/components/AppSwitcher/Action/Action.tsx"],"sourcesContent":["import { useCallback, useState } from \"react\";\n\nimport { theme, getColor, HvColorAny } from \"@hitachivantara/uikit-styles\";\nimport { Info } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvAvatar } from \"@core/components/Avatar\";\nimport { HvListItem } from \"@core/components/ListContainer\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { HvTooltip } from \"@core/components/Tooltip\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport TitleWithTooltip from \"../TitleWithTooltip\";\nimport { useClasses, staticClasses } from \"./Action.styles\";\n\nexport { staticClasses as appSwitcherActionClasses };\n\nexport type HvAppSwitcherActionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvAppSwitcherActionApplication {\n  /** Id of the application. */\n  id?: string;\n  /** Name of the application, this is the value that will be displayed on the component. */\n  name: string;\n  /** URL with the icon location to be used to represent the application. iconUrl will only be used if no iconElement is provided. */\n  iconUrl?: string;\n  /** Element to be added as the icon representing the application. The iconElement will be the primary option to be displayed. */\n  iconElement?: React.ReactElement;\n  /** Small description of the application. */\n  description?: string;\n  /**  URL where the application is accessible. */\n  url?: string;\n  /** Defines if the application should be opened in the same tab or in a new one. */\n  target?: \"_top\" | \"_blank\";\n  /** If true, the item will be disabled. */\n  disabled?: boolean;\n  /** True when the application is selected, false otherwise. */\n  isSelected?: boolean;\n  /** The color of the application. */\n  color?: HvColorAny;\n}\n\nexport interface HvAppSwitcherActionProps extends HvBaseProps {\n  /** The application data to be used to render the Action object. */\n  application: HvAppSwitcherActionApplication;\n  /** Callback triggered when the action is clicked. */\n  onClickCallback?: (\n    event: React.MouseEvent,\n    application: HvAppSwitcherActionApplication\n  ) => void;\n  /** Must return a boolean stating if the action element is selected or not. */\n  isSelectedCallback?: (application: HvAppSwitcherActionApplication) => boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvAppSwitcherActionClasses;\n}\n\nexport const HvAppSwitcherAction = ({\n  id,\n  className,\n  classes: classesProp,\n  application,\n  onClickCallback = () => {},\n  isSelectedCallback = () => false,\n}: HvAppSwitcherActionProps) => {\n  const { classes, cx } = useClasses(classesProp);\n\n  const { name, description, disabled, iconElement, iconUrl, url, target } =\n    application;\n\n  const color = disabled\n    ? theme.colors.secondary_60\n    : getColor(application?.color, theme.colors.secondary);\n\n  const [validIconUrl, setValidIconUrl] = useState<boolean>(true);\n\n  const renderApplicationIcon = () => {\n    if (iconElement) {\n      return iconElement;\n    }\n\n    if (iconUrl && validIconUrl) {\n      return (\n        <img\n          className={classes.iconUrl}\n          src={iconUrl}\n          onError={() => {\n            setValidIconUrl(false);\n          }}\n          alt={description}\n        />\n      );\n    }\n\n    const brokenTitle = name.split(\" \");\n    const initials =\n      brokenTitle[0].substring(0, 1) +\n      (brokenTitle[1] ? brokenTitle[1].substring(0, 1) : \"\");\n\n    return (\n      <HvAvatar size=\"sm\" backgroundColor={color} variant=\"square\" aria-hidden>\n        {initials}\n      </HvAvatar>\n    );\n  };\n\n  const isSelected = isSelectedCallback(application);\n\n  /**\n   * Handles the onClick event and triggers the appropriate callback if it exists.\n   */\n  const handleOnClick = useCallback(\n    (event: React.MouseEvent) => {\n      if (disabled) {\n        event.preventDefault();\n        return;\n      }\n\n      onClickCallback?.(event, { ...application, isSelected });\n    },\n    [application, disabled, isSelected, onClickCallback]\n  );\n\n  const isLink = url != null;\n  const descriptionElementId = useUniqueId(id, \"hvAction-description\");\n\n  const renderApplication = useCallback(\n    (children: React.ReactNode) => {\n      const typographyProps = {\n        className: classes.typography,\n        onClick: handleOnClick,\n        style: { borderColor: color },\n        \"aria-label\": name,\n        ...(description && { \"aria-describedby\": descriptionElementId }),\n      };\n\n      if (isLink) {\n        return (\n          <HvTypography\n            component=\"a\"\n            href={url}\n            target={target || \"_top\"}\n            {...typographyProps}\n          >\n            {children}\n          </HvTypography>\n        );\n      }\n\n      return (\n        <HvTypography component=\"button\" {...typographyProps}>\n          {children}\n        </HvTypography>\n      );\n    },\n    [\n      classes.typography,\n      color,\n      description,\n      descriptionElementId,\n      handleOnClick,\n      isLink,\n      name,\n      target,\n      url,\n    ]\n  );\n\n  return (\n    <HvListItem\n      id={id}\n      interactive\n      tabIndex={0}\n      selected={isSelected}\n      disabled={disabled}\n      className={cx(\n        classes.root,\n        { [classes.disabled]: disabled, [classes.selected]: isSelected },\n        className\n      )}\n    >\n      {/* As HvTooltip don't have the id prop, is not possible to use the aria-labelledby to reference it.\n       In substitution is used the aria-label with the \"title\" value */}\n      {renderApplication(\n        <>\n          <div className={classes.icon}>{renderApplicationIcon()}</div>\n\n          <TitleWithTooltip title={name} className={classes.title} />\n\n          {description && (\n            <HvTooltip\n              disableFocusListener\n              disableTouchListener\n              title={<HvTypography>{description}</HvTypography>}\n            >\n              <div>\n                <Info\n                  className={classes.iconInfo}\n                  role=\"img\"\n                  aria-label={description}\n                  id={descriptionElementId}\n                />\n              </div>\n            </HvTooltip>\n          )}\n        </>\n      )}\n    </HvListItem>\n  );\n};\n"],"names":["HvAppSwitcherAction","id","className","classes","classesProp","application","onClickCallback","isSelectedCallback","cx","useClasses","name","description","disabled","iconElement","iconUrl","url","target","color","theme","colors","secondary_60","getColor","secondary","validIconUrl","setValidIconUrl","useState","renderApplicationIcon","src","onError","alt","brokenTitle","split","initials","substring","HvAvatar","size","backgroundColor","variant","children","isSelected","handleOnClick","useCallback","event","preventDefault","isLink","descriptionElementId","useUniqueId","renderApplication","typographyProps","typography","onClick","style","borderColor","HvTypography","component","href","HvListItem","interactive","tabIndex","selected","root","_jsxs","_Fragment","_jsx","icon","TitleWithTooltip","title","HvTooltip","disableFocusListener","disableTouchListener","Info","iconInfo","role"],"mappings":"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"}
+{"version":3,"file":"Action.cjs","sources":["../../../../../src/components/AppSwitcher/Action/Action.tsx"],"sourcesContent":["import { useCallback, useState } from \"react\";\n\nimport { theme, getColor, HvColorAny } from \"@hitachivantara/uikit-styles\";\nimport { Info } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvAvatar } from \"@core/components/Avatar\";\nimport { HvListItem } from \"@core/components/ListContainer\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { HvTooltip } from \"@core/components/Tooltip\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport TitleWithTooltip from \"../TitleWithTooltip\";\nimport { useClasses, staticClasses } from \"./Action.styles\";\n\nexport { staticClasses as appSwitcherActionClasses };\n\nexport type HvAppSwitcherActionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvAppSwitcherActionApplication {\n  /** Id of the application. */\n  id?: string;\n  /** Name of the application, this is the value that will be displayed on the component. */\n  name: string;\n  /** URL with the icon location to be used to represent the application. iconUrl will only be used if no iconElement is provided. */\n  iconUrl?: string;\n  /** Element to be added as the icon representing the application. The iconElement will be the primary option to be displayed. */\n  iconElement?: React.ReactElement;\n  /** Small description of the application. */\n  description?: string;\n  /**  URL where the application is accessible. */\n  url?: string;\n  /** Defines if the application should be opened in the same tab or in a new one. */\n  target?: \"_top\" | \"_blank\";\n  /** If true, the item will be disabled. */\n  disabled?: boolean;\n  /** True when the application is selected, false otherwise. */\n  isSelected?: boolean;\n  /** The color of the application. */\n  color?: HvColorAny;\n}\n\nexport interface HvAppSwitcherActionProps extends HvBaseProps {\n  /** The application data to be used to render the Action object. */\n  application: HvAppSwitcherActionApplication;\n  /** Callback triggered when the action is clicked. */\n  onClickCallback?: (\n    event: React.MouseEvent,\n    application: HvAppSwitcherActionApplication\n  ) => void;\n  /** Must return a boolean stating if the action element is selected or not. */\n  isSelectedCallback?: (application: HvAppSwitcherActionApplication) => boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvAppSwitcherActionClasses;\n}\n\nexport const HvAppSwitcherAction = ({\n  id,\n  className,\n  classes: classesProp,\n  application,\n  onClickCallback = () => {},\n  isSelectedCallback = () => false,\n}: HvAppSwitcherActionProps) => {\n  const { classes, cx } = useClasses(classesProp);\n\n  const { name, description, disabled, iconElement, iconUrl, url, target } =\n    application;\n\n  const color = disabled\n    ? theme.colors.secondary_60\n    : getColor(application?.color, theme.colors.secondary);\n\n  const [validIconUrl, setValidIconUrl] = useState<boolean>(true);\n\n  const renderApplicationIcon = () => {\n    if (iconElement) {\n      return iconElement;\n    }\n\n    if (iconUrl && validIconUrl) {\n      return (\n        <img\n          className={classes.iconUrl}\n          src={iconUrl}\n          onError={() => {\n            setValidIconUrl(false);\n          }}\n          alt={description}\n        />\n      );\n    }\n\n    const brokenTitle = name.split(\" \");\n    const initials =\n      brokenTitle[0].substring(0, 1) +\n      (brokenTitle[1] ? brokenTitle[1].substring(0, 1) : \"\");\n\n    return (\n      <HvAvatar size=\"sm\" backgroundColor={color} variant=\"square\" aria-hidden>\n        {initials}\n      </HvAvatar>\n    );\n  };\n\n  const isSelected = isSelectedCallback(application);\n\n  /**\n   * Handles the onClick event and triggers the appropriate callback if it exists.\n   */\n  const handleOnClick = useCallback(\n    (event: React.MouseEvent) => {\n      if (disabled) {\n        event.preventDefault();\n        return;\n      }\n\n      onClickCallback?.(event, { ...application, isSelected });\n    },\n    [application, disabled, isSelected, onClickCallback]\n  );\n\n  const isLink = url != null;\n  const descriptionElementId = useUniqueId(id, \"hvAction-description\");\n\n  const renderApplication = useCallback(\n    (children: React.ReactNode) => {\n      const typographyProps = {\n        className: classes.typography,\n        onClick: handleOnClick,\n        style: { borderColor: color },\n        \"aria-label\": name,\n        ...(description && { \"aria-describedby\": descriptionElementId }),\n      };\n\n      if (isLink) {\n        return (\n          <HvTypography\n            component=\"a\"\n            href={url}\n            target={target || \"_top\"}\n            {...typographyProps}\n          >\n            {children}\n          </HvTypography>\n        );\n      }\n\n      return (\n        <HvTypography component=\"button\" {...typographyProps}>\n          {children}\n        </HvTypography>\n      );\n    },\n    [\n      classes.typography,\n      color,\n      description,\n      descriptionElementId,\n      handleOnClick,\n      isLink,\n      name,\n      target,\n      url,\n    ]\n  );\n\n  return (\n    <HvListItem\n      id={id}\n      interactive\n      tabIndex={0}\n      selected={isSelected}\n      disabled={disabled}\n      className={cx(\n        classes.root,\n        { [classes.disabled]: disabled, [classes.selected]: isSelected },\n        className\n      )}\n    >\n      {/* As HvTooltip don't have the id prop, is not possible to use the aria-labelledby to reference it.\n       In substitution is used the aria-label with the \"title\" value */}\n      {renderApplication(\n        <>\n          <div className={classes.icon}>{renderApplicationIcon()}</div>\n\n          <TitleWithTooltip title={name} className={classes.title} />\n\n          {description && (\n            <HvTooltip\n              disableFocusListener\n              disableTouchListener\n              title={<HvTypography>{description}</HvTypography>}\n            >\n              <div>\n                <Info\n                  className={classes.iconInfo}\n                  role=\"img\"\n                  aria-label={description}\n                  id={descriptionElementId}\n                />\n              </div>\n            </HvTooltip>\n          )}\n        </>\n      )}\n    </HvListItem>\n  );\n};\n"],"names":["HvAppSwitcherAction","id","className","classes","classesProp","application","onClickCallback","isSelectedCallback","cx","useClasses","name","description","disabled","iconElement","iconUrl","url","target","color","theme","colors","secondary_60","getColor","secondary","validIconUrl","setValidIconUrl","useState","renderApplicationIcon","jsx","brokenTitle","split","initials","substring","HvAvatar","isSelected","handleOnClick","useCallback","event","preventDefault","isLink","descriptionElementId","useUniqueId","renderApplication","children","typographyProps","typography","onClick","style","borderColor","HvTypography","HvListItem","root","selected","jsxs","Fragment","icon","TitleWithTooltip","title","HvTooltip","Info","iconInfo"],"mappings":"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"}

package/dist/cjs/components/AppSwitcher/AppSwitcher.cjs

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
 const AppSwitcher_styles = require("./AppSwitcher.styles.cjs");
 const TitleWithTooltip = require("./TitleWithTooltip.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const Action = require("./Action/Action.cjs");
 const Typography = require("../Typography/Typography.cjs");
 const ListContainer = require("../ListContainer/ListContainer.cjs");
@@ -29,48 +29,26 @@ const HvAppSwitcher = (props) => {
   } = AppSwitcher_styles.useClasses(classesProp);
   const panelActions = React.useMemo(() => applications && (applications == null ? void 0 : applications.map((application) => {
     if (application.name) {
-      return /* @__PURE__ */ jsxRuntime.jsx(Action.HvAppSwitcherAction, {
-        application,
-        onClickCallback: onActionClickedCallback,
-        isSelectedCallback: isActionSelectedCallback,
-        classes: {
-          root: classes.item,
-          selected: classes.itemSelected,
-          disabled: classes.itemDisabled,
-          typography: classes.itemTrigger,
-          icon: classes.itemIcon,
-          title: classes.itemTitle,
-          iconInfo: classes.itemInfoIcon
-        }
-      }, application.id || `${application.name}_${application.url}`);
+      return /* @__PURE__ */ jsxRuntime.jsx(Action.HvAppSwitcherAction, { application, onClickCallback: onActionClickedCallback, isSelectedCallback: isActionSelectedCallback, classes: {
+        root: classes.item,
+        selected: classes.itemSelected,
+        disabled: classes.itemDisabled,
+        typography: classes.itemTrigger,
+        icon: classes.itemIcon,
+        title: classes.itemTitle,
+        iconInfo: classes.itemInfoIcon
+      } }, application.id || `${application.name}_${application.url}`);
     }
     return void 0;
   })), [applications, classes, isActionSelectedCallback, onActionClickedCallback]);
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    id,
-    className: cx(classes.root, classes[layout], {
-      [classes.open]: !!isOpen,
-      [classes.closed]: isOpen === false
-    }, className),
-    children: [header && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
-      component: "div",
-      variant: "label",
-      className: classes.title,
-      children: header
-    }) || title && /* @__PURE__ */ jsxRuntime.jsx(TitleWithTooltip.default, {
-      className: classes.title,
-      title
-    }), /* @__PURE__ */ jsxRuntime.jsx(ListContainer.HvListContainer, {
-      disableGutters: true,
-      className: classes.actionsContainer,
-      children: panelActions
-    }), footer && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
-      component: "div",
-      variant: "label",
-      className: classes.footerContainer,
-      children: footer
-    })]
-  });
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { id, className: cx(classes.root, classes[layout], {
+    [classes.open]: !!isOpen,
+    [classes.closed]: isOpen === false
+  }, className), children: [
+    header && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { component: "div", variant: "label", className: classes.title, children: header }) || title && /* @__PURE__ */ jsxRuntime.jsx(TitleWithTooltip.default, { className: classes.title, title }),
+    /* @__PURE__ */ jsxRuntime.jsx(ListContainer.HvListContainer, { disableGutters: true, className: classes.actionsContainer, children: panelActions }),
+    footer && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { component: "div", variant: "label", className: classes.footerContainer, children: footer })
+  ] });
 };
 exports.appSwitcherClasses = AppSwitcher_styles.staticClasses;
 exports.HvAppSwitcher = HvAppSwitcher;

package/dist/cjs/components/AppSwitcher/AppSwitcher.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AppSwitcher.cjs","sources":["../../../../src/components/AppSwitcher/AppSwitcher.tsx"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvListContainer } from \"@core/components/ListContainer\";\nimport { HvTypography } from \"@core/components/Typography\";\n\nimport { HvAppSwitcherAction, HvAppSwitcherActionApplication } from \"./Action\";\nimport { useClasses, staticClasses } from \"./AppSwitcher.styles\";\nimport TitleWithTooltip from \"./TitleWithTooltip\";\n\nexport { staticClasses as appSwitcherClasses };\n\nexport type HvAppSwitcherClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvAppSwitcherProps extends HvBaseProps {\n  /** Number of columns to render. One, two, or whatever fits the component's width. */\n  layout?: \"single\" | \"dual\" | \"fluid\";\n  /** Title to be displayed on the header of the component. */\n  title?: string;\n  /** The list of applications to be used to render the actions on the component. */\n  applications?: HvAppSwitcherActionApplication[];\n  /** Triggered when an action is clicked. */\n  onActionClickedCallback?: (\n    event: React.MouseEvent,\n    application: HvAppSwitcherActionApplication\n  ) => void;\n  /** Must return a boolean stating if the action element is selected or not. */\n  isActionSelectedCallback?: (\n    application: HvAppSwitcherActionApplication\n  ) => boolean;\n  /** Element to be added to the header container, if none is provided a label with the title will be added. */\n  header?: React.ReactNode;\n  /** Element to be added to the footer container. */\n  footer?: React.ReactNode;\n  /**\n   * Flag stating if the panel is opened or closed.\n   *\n   * @deprecated This logic should be external, i.e. using the HvAppSwitcher inside a Drawer component.\n   */\n  isOpen?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvAppSwitcherClasses;\n}\n\nexport const HvAppSwitcher = (props: HvAppSwitcherProps) => {\n  const {\n    id,\n    className,\n    classes: classesProp,\n    layout = \"single\",\n    title,\n    applications,\n    onActionClickedCallback = () => {},\n    isActionSelectedCallback = () => false,\n    header,\n    footer,\n    isOpen,\n  } = useDefaultProps(\"HvAppSwitcher\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  const panelActions = useMemo(\n    () =>\n      applications &&\n      applications?.map((application) => {\n        if (application.name) {\n          return (\n            <HvAppSwitcherAction\n              key={application.id || `${application.name}_${application.url}`}\n              application={application}\n              onClickCallback={onActionClickedCallback}\n              isSelectedCallback={isActionSelectedCallback}\n              classes={{\n                root: classes.item,\n                selected: classes.itemSelected,\n                disabled: classes.itemDisabled,\n                typography: classes.itemTrigger,\n                icon: classes.itemIcon,\n                title: classes.itemTitle,\n                iconInfo: classes.itemInfoIcon,\n              }}\n            />\n          );\n        }\n\n        return undefined;\n      }),\n    [applications, classes, isActionSelectedCallback, onActionClickedCallback]\n  );\n\n  return (\n    <div\n      id={id}\n      className={cx(\n        classes.root,\n        classes[layout],\n        { [classes.open]: !!isOpen, [classes.closed]: isOpen === false },\n        className\n      )}\n    >\n      {(header && (\n        <HvTypography component=\"div\" variant=\"label\" className={classes.title}>\n          {header}\n        </HvTypography>\n      )) ||\n        (title && <TitleWithTooltip className={classes.title} title={title} />)}\n      <HvListContainer disableGutters className={classes.actionsContainer}>\n        {panelActions}\n      </HvListContainer>\n      {footer && (\n        <HvTypography\n          component=\"div\"\n          variant=\"label\"\n          className={classes.footerContainer}\n        >\n          {footer}\n        </HvTypography>\n      )}\n    </div>\n  );\n};\n"],"names":["HvAppSwitcher","props","id","className","classes","classesProp","layout","title","applications","onActionClickedCallback","isActionSelectedCallback","header","footer","isOpen","useDefaultProps","cx","useClasses","panelActions","useMemo","map","application","name","HvAppSwitcherAction","onClickCallback","isSelectedCallback","root","item","selected","itemSelected","disabled","itemDisabled","typography","itemTrigger","icon","itemIcon","itemTitle","iconInfo","itemInfoIcon","url","undefined","open","closed","children","_jsx","HvTypography","component","variant","TitleWithTooltip","HvListContainer","disableGutters","actionsContainer","footerContainer"],"mappings":";;;;;;;;;;AA8CaA,MAAAA,gBAAgBA,CAACC,UAA8B;AACpD,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC,SAASC;AAAAA,IACTC,SAAS;AAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC,0BAA0BA,MAAM;AAAA,IAAC;AAAA,IACjCC,2BAA2BA,MAAM;AAAA,IACjCC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,EAAAA,IACEC,gBAAgB,gBAAA,iBAAiBb,KAAK;AACpC,QAAA;AAAA,IAAEG;AAAAA,IAASW;AAAAA,EAAAA,IAAOC,mBAAAA,WAAWX,WAAW;AAE9C,QAAMY,eAAeC,MAAAA,QACnB,MACEV,iBACAA,6CAAcW,IAAKC,CAAgB,gBAAA;AACjC,QAAIA,YAAYC,MAAM;AACpB,4CACGC,OAAAA,qBAAmB;AAAA,QAElBF;AAAAA,QACAG,iBAAiBd;AAAAA,QACjBe,oBAAoBd;AAAAA,QACpBN,SAAS;AAAA,UACPqB,MAAMrB,QAAQsB;AAAAA,UACdC,UAAUvB,QAAQwB;AAAAA,UAClBC,UAAUzB,QAAQ0B;AAAAA,UAClBC,YAAY3B,QAAQ4B;AAAAA,UACpBC,MAAM7B,QAAQ8B;AAAAA,UACd3B,OAAOH,QAAQ+B;AAAAA,UACfC,UAAUhC,QAAQiC;AAAAA,QACpB;AAAA,MAAA,GAZKjB,YAAYlB,MAAO,GAAEkB,YAAYC,IAAK,IAAGD,YAAYkB,GAAI,EAa/D;AAAA,IAEL;AAEOC,WAAAA;AAAAA,EAAAA,KAEX,CAAC/B,cAAcJ,SAASM,0BAA0BD,uBAAuB,CAC3E;AAEA,yCACE,OAAA;AAAA,IACEP;AAAAA,IACAC,WAAWY,GACTX,QAAQqB,MACRrB,QAAQE,MAAM,GACd;AAAA,MAAE,CAACF,QAAQoC,IAAI,GAAG,CAAC,CAAC3B;AAAAA,MAAQ,CAACT,QAAQqC,MAAM,GAAG5B,WAAW;AAAA,OACzDV,SACF;AAAA,IAAEuC,UAEA/B,CAAAA,UACAgC,2BAAAA,IAACC,yBAAY;AAAA,MAACC,WAAU;AAAA,MAAMC,SAAQ;AAAA,MAAQ3C,WAAWC,QAAQG;AAAAA,MAAMmC,UACpE/B;AAAAA,IAAAA,CACW,KAEbJ,SAASoC,2BAAAA,IAACI,0BAAgB;AAAA,MAAC5C,WAAWC,QAAQG;AAAAA,MAAOA;AAAAA,IAAAA,CAAe,GACvEoC,2BAAAA,IAACK,+BAAe;AAAA,MAACC,gBAAc;AAAA,MAAC9C,WAAWC,QAAQ8C;AAAAA,MAAiBR,UACjEzB;AAAAA,IAAAA,CACc,GAChBL,UACC+B,2BAAAA,IAACC,yBAAY;AAAA,MACXC,WAAU;AAAA,MACVC,SAAQ;AAAA,MACR3C,WAAWC,QAAQ+C;AAAAA,MAAgBT,UAElC9B;AAAAA,IAAAA,CACW,CACf;AAAA,EAAA,CACE;AAET;;;"}
+{"version":3,"file":"AppSwitcher.cjs","sources":["../../../../src/components/AppSwitcher/AppSwitcher.tsx"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvListContainer } from \"@core/components/ListContainer\";\nimport { HvTypography } from \"@core/components/Typography\";\n\nimport { HvAppSwitcherAction, HvAppSwitcherActionApplication } from \"./Action\";\nimport { useClasses, staticClasses } from \"./AppSwitcher.styles\";\nimport TitleWithTooltip from \"./TitleWithTooltip\";\n\nexport { staticClasses as appSwitcherClasses };\n\nexport type HvAppSwitcherClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvAppSwitcherProps extends HvBaseProps {\n  /** Number of columns to render. One, two, or whatever fits the component's width. */\n  layout?: \"single\" | \"dual\" | \"fluid\";\n  /** Title to be displayed on the header of the component. */\n  title?: string;\n  /** The list of applications to be used to render the actions on the component. */\n  applications?: HvAppSwitcherActionApplication[];\n  /** Triggered when an action is clicked. */\n  onActionClickedCallback?: (\n    event: React.MouseEvent,\n    application: HvAppSwitcherActionApplication\n  ) => void;\n  /** Must return a boolean stating if the action element is selected or not. */\n  isActionSelectedCallback?: (\n    application: HvAppSwitcherActionApplication\n  ) => boolean;\n  /** Element to be added to the header container, if none is provided a label with the title will be added. */\n  header?: React.ReactNode;\n  /** Element to be added to the footer container. */\n  footer?: React.ReactNode;\n  /**\n   * Flag stating if the panel is opened or closed.\n   *\n   * @deprecated This logic should be external, i.e. using the HvAppSwitcher inside a Drawer component.\n   */\n  isOpen?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvAppSwitcherClasses;\n}\n\nexport const HvAppSwitcher = (props: HvAppSwitcherProps) => {\n  const {\n    id,\n    className,\n    classes: classesProp,\n    layout = \"single\",\n    title,\n    applications,\n    onActionClickedCallback = () => {},\n    isActionSelectedCallback = () => false,\n    header,\n    footer,\n    isOpen,\n  } = useDefaultProps(\"HvAppSwitcher\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  const panelActions = useMemo(\n    () =>\n      applications &&\n      applications?.map((application) => {\n        if (application.name) {\n          return (\n            <HvAppSwitcherAction\n              key={application.id || `${application.name}_${application.url}`}\n              application={application}\n              onClickCallback={onActionClickedCallback}\n              isSelectedCallback={isActionSelectedCallback}\n              classes={{\n                root: classes.item,\n                selected: classes.itemSelected,\n                disabled: classes.itemDisabled,\n                typography: classes.itemTrigger,\n                icon: classes.itemIcon,\n                title: classes.itemTitle,\n                iconInfo: classes.itemInfoIcon,\n              }}\n            />\n          );\n        }\n\n        return undefined;\n      }),\n    [applications, classes, isActionSelectedCallback, onActionClickedCallback]\n  );\n\n  return (\n    <div\n      id={id}\n      className={cx(\n        classes.root,\n        classes[layout],\n        { [classes.open]: !!isOpen, [classes.closed]: isOpen === false },\n        className\n      )}\n    >\n      {(header && (\n        <HvTypography component=\"div\" variant=\"label\" className={classes.title}>\n          {header}\n        </HvTypography>\n      )) ||\n        (title && <TitleWithTooltip className={classes.title} title={title} />)}\n      <HvListContainer disableGutters className={classes.actionsContainer}>\n        {panelActions}\n      </HvListContainer>\n      {footer && (\n        <HvTypography\n          component=\"div\"\n          variant=\"label\"\n          className={classes.footerContainer}\n        >\n          {footer}\n        </HvTypography>\n      )}\n    </div>\n  );\n};\n"],"names":["HvAppSwitcher","props","id","className","classes","classesProp","layout","title","applications","onActionClickedCallback","isActionSelectedCallback","header","footer","isOpen","useDefaultProps","cx","useClasses","panelActions","useMemo","map","application","name","HvAppSwitcherAction","root","item","selected","itemSelected","disabled","itemDisabled","typography","itemTrigger","icon","itemIcon","itemTitle","iconInfo","itemInfoIcon","url","undefined","jsxs","open","closed","HvTypography","jsx","TitleWithTooltip","HvListContainer","actionsContainer","footerContainer"],"mappings":";;;;;;;;;;AA8CaA,MAAAA,gBAAgBA,CAACC,UAA8B;AACpD,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC,SAASC;AAAAA,IACTC,SAAS;AAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC,0BAA0BA,MAAM;AAAA,IAAC;AAAA,IACjCC,2BAA2BA,MAAM;AAAA,IACjCC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,EAAAA,IACEC,gBAAgB,gBAAA,iBAAiBb,KAAK;AACpC,QAAA;AAAA,IAAEG;AAAAA,IAASW;AAAAA,EAAAA,IAAOC,mBAAAA,WAAWX,WAAW;AAE9C,QAAMY,eAAeC,MAAAA,QACnB,MACEV,iBACAA,6CAAcW,IAAKC,CAAgB,gBAAA;AACjC,QAAIA,YAAYC,MAAM;AACpB,4CACGC,OAEC,qBAAA,EAAA,aACA,iBAAiBb,yBACjB,oBAAoBC,0BACpB,SAAS;AAAA,QACPa,MAAMnB,QAAQoB;AAAAA,QACdC,UAAUrB,QAAQsB;AAAAA,QAClBC,UAAUvB,QAAQwB;AAAAA,QAClBC,YAAYzB,QAAQ0B;AAAAA,QACpBC,MAAM3B,QAAQ4B;AAAAA,QACdzB,OAAOH,QAAQ6B;AAAAA,QACfC,UAAU9B,QAAQ+B;AAAAA,MACpB,EAAA,GAZKf,YAAYlB,MAAO,GAAEkB,YAAYC,IAAK,IAAGD,YAAYgB,GAAI,EAa9D;AAAA,IAEN;AAEOC,WAAAA;AAAAA,EAAAA,KAEX,CAAC7B,cAAcJ,SAASM,0BAA0BD,uBAAuB,CAC3E;AAGE,SAAA6B,gCAAC,SACC,IACA,WAAWvB,GACTX,QAAQmB,MACRnB,QAAQE,MAAM,GACd;AAAA,IAAE,CAACF,QAAQmC,IAAI,GAAG,CAAC,CAAC1B;AAAAA,IAAQ,CAACT,QAAQoC,MAAM,GAAG3B,WAAW;AAAA,EAAA,GACzDV,SACF,GAEEQ,UAAAA;AAAAA,IAAAA,yCACC8B,WAAa,cAAA,EAAA,WAAU,OAAM,SAAQ,SAAQ,WAAWrC,QAAQG,OAC9DI,UAAAA,OACH,CAAA,KAECJ,SAASmC,+BAACC,iBAAAA,WAAiB,WAAWvC,QAAQG,OAAO,OAAiB;AAAA,mCACxEqC,cAAAA,iBAAgB,EAAA,gBAAc,MAAC,WAAWxC,QAAQyC,kBAChD5B,UACH,cAAA;AAAA,IACCL,UACE8B,2BAAAA,IAAAD,WAAAA,cAAA,EACC,WAAU,OACV,SAAQ,SACR,WAAWrC,QAAQ0C,iBAElBlC,UACH,OAAA,CAAA;AAAA,EAEJ,EAAA,CAAA;AAEJ;;;"}

package/dist/cjs/components/AppSwitcher/TitleWithTooltip.cjs

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const React = require("react");
 const jsxRuntime = require("@emotion/react/jsx-runtime");
+const React = require("react");
 const Tooltip = require("../Tooltip/Tooltip.cjs");
 const Typography = require("../Typography/Typography.cjs");
 const TitleWithTooltip = ({
@@ -15,20 +15,7 @@ const TitleWithTooltip = ({
       return false;
     return el.scrollWidth > el.clientWidth || el.scrollHeight > el.clientHeight;
   }, []);
-  return /* @__PURE__ */ jsxRuntime.jsx(Tooltip.HvTooltip, {
-    disableHoverListener: !isOverflowed,
-    placement: "top-start",
-    title: /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
-      children: title
-    }),
-    children: /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
-      className,
-      variant: "label",
-      component: "span",
-      ref: textRef,
-      children: title
-    })
-  });
+  return /* @__PURE__ */ jsxRuntime.jsx(Tooltip.HvTooltip, { disableHoverListener: !isOverflowed, placement: "top-start", title: /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { children: title }), children: /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { className, variant: "label", component: "span", ref: textRef, children: title }) });
 };
 const TitleWithTooltip$1 = TitleWithTooltip;
 exports.default = TitleWithTooltip$1;