@hitachivantara/uikit-react-core 5.27.5 → 5.27.7

package/dist/esm/components/TimePicker/Unit/Unit.styles.js

@@ -10,7 +10,7 @@ const {
     justifyContent: "center",
     alignItems: "center",
     textAlign: "center",
-    ...theme.typography.sTitle
+    ...theme.typography.title3
   },
   separator: {
     width: 8
@@ -27,7 +27,7 @@ const {
     width: 40
   },
   input: {
-    ...theme.typography.sTitle,
+    ...theme.typography.title3,
     fontWeight: 600,
     textAlign: "center",
     height: 40,

package/dist/esm/components/TimePicker/Unit/Unit.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Unit.styles.js","sources":["../../../../../src/components/TimePicker/Unit/Unit.styles.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvTimePickerUnit\", {\n  root: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    textAlign: \"center\",\n    ...theme.typography.sTitle,\n  },\n\n  separator: {\n    width: 8,\n  },\n\n  periodToggle: {\n    height: 40,\n    width: 40,\n  },\n\n  element: {\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    height: 40,\n    width: 40,\n  },\n\n  input: {\n    ...theme.typography.sTitle,\n    fontWeight: 600,\n    textAlign: \"center\",\n    height: 40,\n    width: 40,\n    padding: 0,\n    margin: 0,\n    \"&::placeholder\": {\n      fontSize: 16,\n      fontWeight: 600,\n    },\n  },\n  inputRoot: {\n    width: 40,\n    height: 40,\n  },\n\n  subtractIcon: {\n    marginTop: theme.space.xs,\n  },\n  inputContainer: {\n    minWidth: 40,\n    maxWidth: 40,\n  },\n  inputBorderContainer: {\n    top: 40,\n  },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","display","flexDirection","justifyContent","alignItems","textAlign","theme","typography","sTitle","separator","width","periodToggle","height","element","input","fontWeight","padding","margin","fontSize","inputRoot","subtractIcon","marginTop","space","xs","inputContainer","minWidth","maxWidth","inputBorderContainer","top"],"mappings":";;AAIa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,oBAAoB;AAAA,EAC7EC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,IACZC,WAAW;AAAA,IACX,GAAGC,MAAMC,WAAWC;AAAAA,EACtB;AAAA,EAEAC,WAAW;AAAA,IACTC,OAAO;AAAA,EACT;AAAA,EAEAC,cAAc;AAAA,IACZC,QAAQ;AAAA,IACRF,OAAO;AAAA,EACT;AAAA,EAEAG,SAAS;AAAA,IACPZ,SAAS;AAAA,IACTE,gBAAgB;AAAA,IAChBC,YAAY;AAAA,IACZQ,QAAQ;AAAA,IACRF,OAAO;AAAA,EACT;AAAA,EAEAI,OAAO;AAAA,IACL,GAAGR,MAAMC,WAAWC;AAAAA,IACpBO,YAAY;AAAA,IACZV,WAAW;AAAA,IACXO,QAAQ;AAAA,IACRF,OAAO;AAAA,IACPM,SAAS;AAAA,IACTC,QAAQ;AAAA,IACR,kBAAkB;AAAA,MAChBC,UAAU;AAAA,MACVH,YAAY;AAAA,IACd;AAAA,EACF;AAAA,EACAI,WAAW;AAAA,IACTT,OAAO;AAAA,IACPE,QAAQ;AAAA,EACV;AAAA,EAEAQ,cAAc;AAAA,IACZC,WAAWf,MAAMgB,MAAMC;AAAAA,EACzB;AAAA,EACAC,gBAAgB;AAAA,IACdC,UAAU;AAAA,IACVC,UAAU;AAAA,EACZ;AAAA,EACAC,sBAAsB;AAAA,IACpBC,KAAK;AAAA,EACP;AACF,CAAC;"}
+{"version":3,"file":"Unit.styles.js","sources":["../../../../../src/components/TimePicker/Unit/Unit.styles.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvTimePickerUnit\", {\n  root: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    textAlign: \"center\",\n    ...theme.typography.title3,\n  },\n\n  separator: {\n    width: 8,\n  },\n\n  periodToggle: {\n    height: 40,\n    width: 40,\n  },\n\n  element: {\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    height: 40,\n    width: 40,\n  },\n\n  input: {\n    ...theme.typography.title3,\n    fontWeight: 600,\n    textAlign: \"center\",\n    height: 40,\n    width: 40,\n    padding: 0,\n    margin: 0,\n    \"&::placeholder\": {\n      fontSize: 16,\n      fontWeight: 600,\n    },\n  },\n  inputRoot: {\n    width: 40,\n    height: 40,\n  },\n\n  subtractIcon: {\n    marginTop: theme.space.xs,\n  },\n  inputContainer: {\n    minWidth: 40,\n    maxWidth: 40,\n  },\n  inputBorderContainer: {\n    top: 40,\n  },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","display","flexDirection","justifyContent","alignItems","textAlign","theme","typography","title3","separator","width","periodToggle","height","element","input","fontWeight","padding","margin","fontSize","inputRoot","subtractIcon","marginTop","space","xs","inputContainer","minWidth","maxWidth","inputBorderContainer","top"],"mappings":";;AAIa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,oBAAoB;AAAA,EAC7EC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,IACZC,WAAW;AAAA,IACX,GAAGC,MAAMC,WAAWC;AAAAA,EACtB;AAAA,EAEAC,WAAW;AAAA,IACTC,OAAO;AAAA,EACT;AAAA,EAEAC,cAAc;AAAA,IACZC,QAAQ;AAAA,IACRF,OAAO;AAAA,EACT;AAAA,EAEAG,SAAS;AAAA,IACPZ,SAAS;AAAA,IACTE,gBAAgB;AAAA,IAChBC,YAAY;AAAA,IACZQ,QAAQ;AAAA,IACRF,OAAO;AAAA,EACT;AAAA,EAEAI,OAAO;AAAA,IACL,GAAGR,MAAMC,WAAWC;AAAAA,IACpBO,YAAY;AAAA,IACZV,WAAW;AAAA,IACXO,QAAQ;AAAA,IACRF,OAAO;AAAA,IACPM,SAAS;AAAA,IACTC,QAAQ;AAAA,IACR,kBAAkB;AAAA,MAChBC,UAAU;AAAA,MACVH,YAAY;AAAA,IACd;AAAA,EACF;AAAA,EACAI,WAAW;AAAA,IACTT,OAAO;AAAA,IACPE,QAAQ;AAAA,EACV;AAAA,EAEAQ,cAAc;AAAA,IACZC,WAAWf,MAAMgB,MAAMC;AAAAA,EACzB;AAAA,EACAC,gBAAgB;AAAA,IACdC,UAAU;AAAA,IACVC,UAAU;AAAA,EACZ;AAAA,EACAC,sBAAsB;AAAA,IACpBC,KAAK;AAAA,EACP;AACF,CAAC;"}

package/dist/esm/components/ToggleButton/ToggleButton.js

@@ -1,7 +1,7 @@
+import { jsx } from "@emotion/react/jsx-runtime";
 import { forwardRef } from "react";
 import { useControlled } from "../../hooks/useControlled.js";
 import { useDefaultProps } from "../../hooks/useDefaultProps.js";
-import { jsx } from "@emotion/react/jsx-runtime";
 import { HvButton } from "../Button/Button.js";
 const HvToggleButton = forwardRef((props, ref) => {
   const {
@@ -18,14 +18,7 @@ const HvToggleButton = forwardRef((props, ref) => {
     setIsSelected(!isSelected);
     onClick == null ? void 0 : onClick(event, !isSelected);
   };
-  return /* @__PURE__ */ jsx(HvButton, {
-    ref,
-    icon: true,
-    "aria-pressed": isSelected,
-    onClick: onClickHandler,
-    ...others,
-    children: children || (!isSelected ? notSelectedIcon : selectedIcon)
-  });
+  return /* @__PURE__ */ jsx(HvButton, { ref, icon: true, "aria-pressed": isSelected, onClick: onClickHandler, ...others, children: children || (!isSelected ? notSelectedIcon : selectedIcon) });
 });
 export {
   HvToggleButton

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

@@ -1 +1 @@
-{"version":3,"file":"ToggleButton.js","sources":["../../../../src/components/ToggleButton/ToggleButton.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvButton } from \"@core/components/Button\";\n\nexport interface HvToggleButtonProps\n  extends HvBaseProps<HTMLButtonElement, \"onClick\"> {\n  /** When uncontrolled, defines the initial selected state. */\n  defaultSelected?: boolean;\n  /** Defines if the button is selected. When defined the button state becomes controlled. */\n  selected?: boolean;\n  /** Defines if the button is disabled. */\n  disabled?: boolean;\n  /** Icon for when not selected. Ignored if the component has children. */\n  notSelectedIcon?: React.ReactNode;\n  /** Icon for when selected. Ignored if the component has children. */\n  selectedIcon?: React.ReactNode;\n  /** Function called when icon is clicked. */\n  onClick?: (\n    event: React.MouseEvent<HTMLButtonElement>,\n    selected: boolean\n  ) => void;\n}\n\nexport const HvToggleButton = forwardRef<\n  HTMLButtonElement,\n  HvToggleButtonProps\n>((props, ref) => {\n  const {\n    defaultSelected,\n    selected,\n    notSelectedIcon,\n    selectedIcon = null,\n    onClick,\n    children,\n    ...others\n  } = useDefaultProps(\"HvToggleButton\", props);\n\n  const [isSelected, setIsSelected] = useControlled(\n    selected,\n    Boolean(defaultSelected)\n  );\n\n  const onClickHandler = (event: React.MouseEvent<HTMLButtonElement>) => {\n    setIsSelected(!isSelected);\n    onClick?.(event, !isSelected);\n  };\n\n  return (\n    <HvButton\n      ref={ref}\n      icon\n      aria-pressed={isSelected}\n      onClick={onClickHandler}\n      {...others}\n    >\n      {children || (!isSelected ? notSelectedIcon : selectedIcon)}\n    </HvButton>\n  );\n});\n"],"names":["HvToggleButton","forwardRef","props","ref","defaultSelected","selected","notSelectedIcon","selectedIcon","onClick","children","others","useDefaultProps","isSelected","setIsSelected","useControlled","Boolean","onClickHandler","event","HvButton","icon"],"mappings":";;;;;AA0BO,MAAMA,iBAAiBC,WAG5B,CAACC,OAAOC,QAAQ;AACV,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,eAAe;AAAA,IACfC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,kBAAkBT,KAAK;AAErC,QAAA,CAACU,YAAYC,aAAa,IAAIC,cAClCT,UACAU,QAAQX,eAAe,CACzB;AAEMY,QAAAA,iBAAiBA,CAACC,UAA+C;AACrEJ,kBAAc,CAACD,UAAU;AACfK,uCAAAA,OAAO,CAACL;AAAAA,EAAU;AAG9B,6BACGM,UAAQ;AAAA,IACPf;AAAAA,IACAgB,MAAI;AAAA,IACJ,gBAAcP;AAAAA,IACdJ,SAASQ;AAAAA,IAAe,GACpBN;AAAAA,IAAMD,UAETA,aAAa,CAACG,aAAaN,kBAAkBC;AAAAA,EAAAA,CACtC;AAEd,CAAC;"}
+{"version":3,"file":"ToggleButton.js","sources":["../../../../src/components/ToggleButton/ToggleButton.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvButton } from \"@core/components/Button\";\n\nexport interface HvToggleButtonProps\n  extends HvBaseProps<HTMLButtonElement, \"onClick\"> {\n  /** When uncontrolled, defines the initial selected state. */\n  defaultSelected?: boolean;\n  /** Defines if the button is selected. When defined the button state becomes controlled. */\n  selected?: boolean;\n  /** Defines if the button is disabled. */\n  disabled?: boolean;\n  /** Icon for when not selected. Ignored if the component has children. */\n  notSelectedIcon?: React.ReactNode;\n  /** Icon for when selected. Ignored if the component has children. */\n  selectedIcon?: React.ReactNode;\n  /** Function called when icon is clicked. */\n  onClick?: (\n    event: React.MouseEvent<HTMLButtonElement>,\n    selected: boolean\n  ) => void;\n}\n\nexport const HvToggleButton = forwardRef<\n  HTMLButtonElement,\n  HvToggleButtonProps\n>((props, ref) => {\n  const {\n    defaultSelected,\n    selected,\n    notSelectedIcon,\n    selectedIcon = null,\n    onClick,\n    children,\n    ...others\n  } = useDefaultProps(\"HvToggleButton\", props);\n\n  const [isSelected, setIsSelected] = useControlled(\n    selected,\n    Boolean(defaultSelected)\n  );\n\n  const onClickHandler = (event: React.MouseEvent<HTMLButtonElement>) => {\n    setIsSelected(!isSelected);\n    onClick?.(event, !isSelected);\n  };\n\n  return (\n    <HvButton\n      ref={ref}\n      icon\n      aria-pressed={isSelected}\n      onClick={onClickHandler}\n      {...others}\n    >\n      {children || (!isSelected ? notSelectedIcon : selectedIcon)}\n    </HvButton>\n  );\n});\n"],"names":["HvToggleButton","forwardRef","props","ref","defaultSelected","selected","notSelectedIcon","selectedIcon","onClick","children","others","useDefaultProps","isSelected","setIsSelected","useControlled","Boolean","onClickHandler","event"],"mappings":";;;;;AA0BO,MAAMA,iBAAiBC,WAG5B,CAACC,OAAOC,QAAQ;AACV,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,eAAe;AAAA,IACfC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,kBAAkBT,KAAK;AAErC,QAAA,CAACU,YAAYC,aAAa,IAAIC,cAClCT,UACAU,QAAQX,eAAe,CACzB;AAEMY,QAAAA,iBAAiBA,CAACC,UAA+C;AACrEJ,kBAAc,CAACD,UAAU;AACfK,uCAAAA,OAAO,CAACL;AAAAA,EAAU;AAG9B,SACG,oBAAA,UAAA,EACC,KACA,MAAI,MACJ,gBAAcA,YACd,SAASI,gBACLN,GAAAA,QAEHD,UAAAA,aAAa,CAACG,aAAaN,kBAAkBC,cAChD,CAAA;AAEJ,CAAC;"}

package/dist/esm/components/Tooltip/Tooltip.js

@@ -1,10 +1,10 @@
+import { jsx } from "@emotion/react/jsx-runtime";
 import { Tooltip, Fade } from "@mui/material";
 import { forwardRef } from "react";
 import { useTheme } from "../../hooks/useTheme.js";
 import { useDefaultProps } from "../../hooks/useDefaultProps.js";
 import { useClasses, popperSx } from "./Tooltip.styles.js";
 import { staticClasses } from "./Tooltip.styles.js";
-import { jsx } from "@emotion/react/jsx-runtime";
 const HvTooltip = forwardRef((props, ref) => {
   const {
     className,
@@ -29,26 +29,13 @@ const HvTooltip = forwardRef((props, ref) => {
   const {
     classes
   } = useClasses(classesProp);
-  return /* @__PURE__ */ jsx(Tooltip, {
-    ref,
-    open: open ?? void 0,
-    enterDelay,
-    placement,
-    TransitionComponent,
-    TransitionProps,
-    className,
-    classes: {
-      tooltip: useSingle ? classes.tooltip : classes.tooltipMulti,
-      popper: classes.popper
-    },
-    title,
-    PopperProps: {
-      sx: popperSx(useSingle),
-      container: typeof window !== "undefined" ? document.getElementById(containerId || rootId || "") || document.body : void 0
-    },
-    ...others,
-    children
-  });
+  return /* @__PURE__ */ jsx(Tooltip, { ref, open: open ?? void 0, enterDelay, placement, TransitionComponent, TransitionProps, className, classes: {
+    tooltip: useSingle ? classes.tooltip : classes.tooltipMulti,
+    popper: classes.popper
+  }, title, PopperProps: {
+    sx: popperSx(useSingle),
+    container: typeof window !== "undefined" ? document.getElementById(containerId || rootId || "") || document.body : void 0
+  }, ...others, children });
 });
 export {
   HvTooltip,

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

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import { Fade, Tooltip, TooltipProps as MuiTooltipProps } from \"@mui/material\";\nimport { forwardRef, ReactElement } from \"react\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { popperSx, staticClasses, useClasses } from \"./Tooltip.styles\";\n\nexport { staticClasses as tooltipClasses };\n\nexport type HvTooltipClasses = ExtractNames<typeof useClasses>;\nexport type HvTooltipPlacementType = MuiTooltipProps[\"placement\"];\n\nexport interface HvTooltipProps extends Omit<MuiTooltipProps, \"classes\"> {\n  /**\n   * Class names to be applied.\n   */\n  className?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes?: HvTooltipClasses;\n  /**\n   * If true, the tooltip is shown.\n   */\n  open?: boolean;\n  /**\n   * Tooltip placement.\n   */\n  placement?: HvTooltipPlacementType;\n  /**\n   * The number of milliseconds to wait before showing the tooltip.\n   * This property won't impact the enter touch delay (enterTouchDelay).\n   */\n  enterDelay?: number;\n  /** @inheritdoc */\n  title: MuiTooltipProps[\"title\"];\n  /** @inheritdoc */\n  TransitionComponent?: MuiTooltipProps[\"TransitionComponent\"];\n  /** @inheritdoc */\n  TransitionProps?: MuiTooltipProps[\"TransitionProps\"];\n  /**\n   * Defines if should use a single or multiline tooltip.\n   */\n  useSingle?: boolean;\n  /**\n   * Node to apply the tooltip.\n   */\n  children: ReactElement;\n  /**\n   * Id attribute value of an HTML Element to have the tooltip appended to it.\n   */\n  containerId?: string;\n}\n\n/**\n * Tooltips display informative text when users hover over, focus on, or tap an element.\n * Accessibility-wise, the tooltip automatically labels the `children` content.\n */\nexport const HvTooltip = forwardRef((props: HvTooltipProps, ref) => {\n  const {\n    className,\n    classes: classesProp,\n    open,\n    enterDelay = 300,\n    placement = \"top\",\n    useSingle = true,\n    children,\n    title,\n    TransitionComponent = Fade,\n    TransitionProps = { timeout: 400, placement },\n    containerId,\n    ...others\n  } = useDefaultProps(\"HvTooltip\", props);\n\n  const { rootId } = useTheme();\n  const { classes } = useClasses(classesProp);\n\n  return (\n    <Tooltip\n      ref={ref}\n      open={open ?? undefined}\n      enterDelay={enterDelay}\n      placement={placement}\n      TransitionComponent={TransitionComponent}\n      TransitionProps={TransitionProps}\n      className={className}\n      classes={{\n        tooltip: useSingle ? classes.tooltip : classes.tooltipMulti,\n        popper: classes.popper,\n      }}\n      title={title}\n      PopperProps={{\n        sx: popperSx(useSingle),\n        container:\n          typeof window !== \"undefined\"\n            ? document.getElementById(containerId || rootId || \"\") ||\n              document.body\n            : undefined,\n      }}\n      {...others}\n    >\n      {children}\n    </Tooltip>\n  );\n});\n"],"names":["HvTooltip","forwardRef","props","ref","className","classes","classesProp","open","enterDelay","placement","useSingle","children","title","TransitionComponent","Fade","TransitionProps","timeout","containerId","others","useDefaultProps","rootId","useTheme","useClasses","Tooltip","undefined","tooltip","tooltipMulti","popper","PopperProps","sx","popperSx","container","window","document","getElementById","body"],"mappings":";;;;;;;AA0DO,MAAMA,YAAYC,WAAW,CAACC,OAAuBC,QAAQ;AAC5D,QAAA;AAAA,IACJC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACAC,aAAa;AAAA,IACbC,YAAY;AAAA,IACZC,YAAY;AAAA,IACZC;AAAAA,IACAC;AAAAA,IACAC,sBAAsBC;AAAAA,IACtBC,kBAAkB;AAAA,MAAEC,SAAS;AAAA,MAAKP;AAAAA,IAAU;AAAA,IAC5CQ;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,aAAajB,KAAK;AAEhC,QAAA;AAAA,IAAEkB;AAAAA,MAAWC,SAAS;AACtB,QAAA;AAAA,IAAEhB;AAAAA,EAAAA,IAAYiB,WAAWhB,WAAW;AAE1C,6BACGiB,SAAO;AAAA,IACNpB;AAAAA,IACAI,MAAMA,QAAQiB;AAAAA,IACdhB;AAAAA,IACAC;AAAAA,IACAI;AAAAA,IACAE;AAAAA,IACAX;AAAAA,IACAC,SAAS;AAAA,MACPoB,SAASf,YAAYL,QAAQoB,UAAUpB,QAAQqB;AAAAA,MAC/CC,QAAQtB,QAAQsB;AAAAA,IAClB;AAAA,IACAf;AAAAA,IACAgB,aAAa;AAAA,MACXC,IAAIC,SAASpB,SAAS;AAAA,MACtBqB,WACE,OAAOC,WAAW,cACdC,SAASC,eAAejB,eAAeG,UAAU,EAAE,KACnDa,SAASE,OACTX;AAAAA,IACR;AAAA,IAAE,GACEN;AAAAA,IAAMP;AAAAA,EAAAA,CAGH;AAEb,CAAC;"}
+{"version":3,"file":"Tooltip.js","sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import { Fade, Tooltip, TooltipProps as MuiTooltipProps } from \"@mui/material\";\nimport { forwardRef, ReactElement } from \"react\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { popperSx, staticClasses, useClasses } from \"./Tooltip.styles\";\n\nexport { staticClasses as tooltipClasses };\n\nexport type HvTooltipClasses = ExtractNames<typeof useClasses>;\nexport type HvTooltipPlacementType = MuiTooltipProps[\"placement\"];\n\nexport interface HvTooltipProps extends Omit<MuiTooltipProps, \"classes\"> {\n  /**\n   * Class names to be applied.\n   */\n  className?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes?: HvTooltipClasses;\n  /**\n   * If true, the tooltip is shown.\n   */\n  open?: boolean;\n  /**\n   * Tooltip placement.\n   */\n  placement?: HvTooltipPlacementType;\n  /**\n   * The number of milliseconds to wait before showing the tooltip.\n   * This property won't impact the enter touch delay (enterTouchDelay).\n   */\n  enterDelay?: number;\n  /** @inheritdoc */\n  title: MuiTooltipProps[\"title\"];\n  /** @inheritdoc */\n  TransitionComponent?: MuiTooltipProps[\"TransitionComponent\"];\n  /** @inheritdoc */\n  TransitionProps?: MuiTooltipProps[\"TransitionProps\"];\n  /**\n   * Defines if should use a single or multiline tooltip.\n   */\n  useSingle?: boolean;\n  /**\n   * Node to apply the tooltip.\n   */\n  children: ReactElement;\n  /**\n   * Id attribute value of an HTML Element to have the tooltip appended to it.\n   */\n  containerId?: string;\n}\n\n/**\n * Tooltips display informative text when users hover over, focus on, or tap an element.\n * Accessibility-wise, the tooltip automatically labels the `children` content.\n */\nexport const HvTooltip = forwardRef((props: HvTooltipProps, ref) => {\n  const {\n    className,\n    classes: classesProp,\n    open,\n    enterDelay = 300,\n    placement = \"top\",\n    useSingle = true,\n    children,\n    title,\n    TransitionComponent = Fade,\n    TransitionProps = { timeout: 400, placement },\n    containerId,\n    ...others\n  } = useDefaultProps(\"HvTooltip\", props);\n\n  const { rootId } = useTheme();\n  const { classes } = useClasses(classesProp);\n\n  return (\n    <Tooltip\n      ref={ref}\n      open={open ?? undefined}\n      enterDelay={enterDelay}\n      placement={placement}\n      TransitionComponent={TransitionComponent}\n      TransitionProps={TransitionProps}\n      className={className}\n      classes={{\n        tooltip: useSingle ? classes.tooltip : classes.tooltipMulti,\n        popper: classes.popper,\n      }}\n      title={title}\n      PopperProps={{\n        sx: popperSx(useSingle),\n        container:\n          typeof window !== \"undefined\"\n            ? document.getElementById(containerId || rootId || \"\") ||\n              document.body\n            : undefined,\n      }}\n      {...others}\n    >\n      {children}\n    </Tooltip>\n  );\n});\n"],"names":["HvTooltip","forwardRef","props","ref","className","classes","classesProp","open","enterDelay","placement","useSingle","children","title","TransitionComponent","Fade","TransitionProps","timeout","containerId","others","useDefaultProps","rootId","useTheme","useClasses","undefined","tooltip","tooltipMulti","popper","sx","popperSx","container","window","document","getElementById","body"],"mappings":";;;;;;;AA0DO,MAAMA,YAAYC,WAAW,CAACC,OAAuBC,QAAQ;AAC5D,QAAA;AAAA,IACJC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACAC,aAAa;AAAA,IACbC,YAAY;AAAA,IACZC,YAAY;AAAA,IACZC;AAAAA,IACAC;AAAAA,IACAC,sBAAsBC;AAAAA,IACtBC,kBAAkB;AAAA,MAAEC,SAAS;AAAA,MAAKP;AAAAA,IAAU;AAAA,IAC5CQ;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,aAAajB,KAAK;AAEhC,QAAA;AAAA,IAAEkB;AAAAA,MAAWC,SAAS;AACtB,QAAA;AAAA,IAAEhB;AAAAA,EAAAA,IAAYiB,WAAWhB,WAAW;AAGxC,SAAA,oBAAC,SACC,EAAA,KACA,MAAMC,QAAQgB,QACd,YACA,WACA,qBACA,iBACA,WACA,SAAS;AAAA,IACPC,SAASd,YAAYL,QAAQmB,UAAUnB,QAAQoB;AAAAA,IAC/CC,QAAQrB,QAAQqB;AAAAA,EAAAA,GAElB,OACA,aAAa;AAAA,IACXC,IAAIC,SAASlB,SAAS;AAAA,IACtBmB,WACE,OAAOC,WAAW,cACdC,SAASC,eAAef,eAAeG,UAAU,EAAE,KACnDW,SAASE,OACTV;AAAAA,EAAAA,GAEJL,GAAAA,QAEHP,SACH,CAAA;AAEJ,CAAC;"}

package/dist/esm/components/Typography/Typography.js

@@ -1,10 +1,10 @@
+import { jsx } from "@emotion/react/jsx-runtime";
 import { forwardRef } from "react";
 import { useTheme } from "../../hooks/useTheme.js";
 import { useDefaultProps } from "../../hooks/useDefaultProps.js";
 import { mapVariant } from "./utils.js";
 import { useClasses } from "./Typography.styles.js";
 import { staticClasses } from "./Typography.styles.js";
-import { jsx } from "@emotion/react/jsx-runtime";
 const HvTypographyMap = {
   display: "h1",
   title1: "h1",
@@ -51,15 +51,11 @@ const HvTypography = forwardRef((props, ref) => {
   } = useTheme();
   const variant = mapVariant(variantProp, activeTheme == null ? void 0 : activeTheme.name);
   const Component = ComponentProp || paragraph && "p" || HvTypographyMap[variant] || "span";
-  return /* @__PURE__ */ jsx(Component, {
-    ref,
-    className: cx(classes.root, classes[variant], {
-      [classes.isLink]: link,
-      [classes.noWrap]: noWrap,
-      [classes.disabled]: disabled
-    }, className),
-    ...others
-  });
+  return /* @__PURE__ */ jsx(Component, { ref, className: cx(classes.root, classes[variant], {
+    [classes.isLink]: link,
+    [classes.noWrap]: noWrap,
+    [classes.disabled]: disabled
+  }, className), ...others });
 });
 export {
   HvTypography,

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

@@ -1 +1 @@
-{"version":3,"file":"Typography.js","sources":["../../../../src/components/Typography/Typography.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport { PolymorphicComponentRef, PolymorphicRef } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport {\n  HvTypographyLegacyVariants,\n  HvTypographyVariants,\n  mapVariant,\n} from \"./utils\";\nimport { staticClasses, useClasses } from \"./Typography.styles\";\n\nexport { staticClasses as typographyClasses };\n\nexport type HvTypographyClasses = ExtractNames<typeof useClasses>;\n\nconst HvTypographyMap = {\n  display: \"h1\",\n  title1: \"h1\",\n  title2: \"h2\",\n  title3: \"h3\",\n  title4: \"h4\",\n  body: \"p\",\n  label: \"span\",\n  caption1: \"p\",\n  caption2: \"p\",\n  // LEGACY\n  \"5xlTitle\": \"h1\",\n  \"4xlTitle\": \"h1\",\n  xxlTitle: \"h1\",\n  lTitle: \"h2\",\n  sTitle: \"h4\",\n  xxsTitle: \"h6\",\n  sectionTitle: \"p\",\n  placeholderText: \"p\",\n  link: \"p\",\n  disabledText: \"p\",\n  selectedNavText: \"p\",\n  vizTextDisabled: \"p\",\n  xsInlineLink: \"p\",\n} as const;\n\nexport type HvTypographyProps<C extends React.ElementType = \"p\"> =\n  PolymorphicComponentRef<\n    C,\n    {\n      /** Use the variant prop to change the visual style of the Typography. */\n      variant?: HvTypographyVariants | HvTypographyLegacyVariants;\n      /** If `true` the typography will display the look of a link. */\n      link?: boolean;\n      /** If `true` the typography will display the look of a disabled state. */\n      disabled?: boolean;\n      /** If `true`, the text will have a bottom margin. */\n      paragraph?: boolean;\n      /**\n       * If `true`, the text will not wrap, but instead will truncate with a text overflow ellipsis.\n       *\n       * Note that text overflow can only happen with block or inline-block level elements\n       * (the element needs to have a width in order to overflow).\n       */\n      noWrap?: boolean;\n      /** A Jss Object used to override or extend the styles applied to the component. */\n      classes?: HvTypographyClasses;\n    }\n  >;\n\n/**\n * Typography component is used to render text and paragraphs within an interface.\n */\nexport const HvTypography: <C extends React.ElementType = \"p\">(\n  props: HvTypographyProps<C>\n) => React.ReactElement | null = forwardRef(\n  <C extends React.ElementType = \"p\">(\n    props: HvTypographyProps<C>,\n    ref: PolymorphicRef<C>\n  ) => {\n    const {\n      className,\n      component: ComponentProp,\n      classes: classesProp,\n      variant: variantProp = \"body\",\n      link = false,\n      disabled = false,\n      noWrap = false,\n      paragraph = false,\n      ...others\n    } = useDefaultProps(\"HvTypography\", props);\n    const { classes, cx } = useClasses(classesProp);\n    const { activeTheme } = useTheme();\n\n    const variant = mapVariant(variantProp, activeTheme?.name);\n\n    const Component =\n      ComponentProp || (paragraph && \"p\") || HvTypographyMap[variant] || \"span\";\n\n    return (\n      <Component\n        ref={ref}\n        className={cx(\n          classes.root,\n          classes[variant],\n          {\n            [classes.isLink]: link,\n            [classes.noWrap]: noWrap,\n            [classes.disabled]: disabled,\n          },\n          className\n        )}\n        {...others}\n      />\n    );\n  }\n);\n"],"names":["HvTypographyMap","display","title1","title2","title3","title4","body","label","caption1","caption2","xxlTitle","lTitle","sTitle","xxsTitle","sectionTitle","placeholderText","link","disabledText","selectedNavText","vizTextDisabled","xsInlineLink","HvTypography","forwardRef","props","ref","className","component","ComponentProp","classes","classesProp","variant","variantProp","disabled","noWrap","paragraph","others","useDefaultProps","cx","useClasses","activeTheme","useTheme","mapVariant","name","Component","root","isLink"],"mappings":";;;;;;;AAkBA,MAAMA,kBAAkB;AAAA,EACtBC,SAAS;AAAA,EACTC,QAAQ;AAAA,EACRC,QAAQ;AAAA,EACRC,QAAQ;AAAA,EACRC,QAAQ;AAAA,EACRC,MAAM;AAAA,EACNC,OAAO;AAAA,EACPC,UAAU;AAAA,EACVC,UAAU;AAAA;AAAA,EAEV,YAAY;AAAA,EACZ,YAAY;AAAA,EACZC,UAAU;AAAA,EACVC,QAAQ;AAAA,EACRC,QAAQ;AAAA,EACRC,UAAU;AAAA,EACVC,cAAc;AAAA,EACdC,iBAAiB;AAAA,EACjBC,MAAM;AAAA,EACNC,cAAc;AAAA,EACdC,iBAAiB;AAAA,EACjBC,iBAAiB;AAAA,EACjBC,cAAc;AAChB;AA6BO,MAAMC,eAEoBC,WAC/B,CACEC,OACAC,QACG;AACG,QAAA;AAAA,IACJC;AAAAA,IACAC,WAAWC;AAAAA,IACXC,SAASC;AAAAA,IACTC,SAASC,cAAc;AAAA,IACvBf,OAAO;AAAA,IACPgB,WAAW;AAAA,IACXC,SAAS;AAAA,IACTC,YAAY;AAAA,IACZ,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAgBb,KAAK;AACnC,QAAA;AAAA,IAAEK;AAAAA,IAASS;AAAAA,EAAAA,IAAOC,WAAWT,WAAW;AACxC,QAAA;AAAA,IAAEU;AAAAA,MAAgBC,SAAS;AAEjC,QAAMV,UAAUW,WAAWV,aAAaQ,2CAAaG,IAAI;AAEzD,QAAMC,YACJhB,iBAAkBO,aAAa,OAAQlC,gBAAgB8B,OAAO,KAAK;AAErE,6BACGa,WAAS;AAAA,IACRnB;AAAAA,IACAC,WAAWY,GACTT,QAAQgB,MACRhB,QAAQE,OAAO,GACf;AAAA,MACE,CAACF,QAAQiB,MAAM,GAAG7B;AAAAA,MAClB,CAACY,QAAQK,MAAM,GAAGA;AAAAA,MAClB,CAACL,QAAQI,QAAQ,GAAGA;AAAAA,OAEtBP,SACF;AAAA,IAAE,GACEU;AAAAA,EAAAA,CACL;AAEL,CACF;"}
+{"version":3,"file":"Typography.js","sources":["../../../../src/components/Typography/Typography.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport { PolymorphicComponentRef, PolymorphicRef } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport {\n  HvTypographyLegacyVariants,\n  HvTypographyVariants,\n  mapVariant,\n} from \"./utils\";\nimport { staticClasses, useClasses } from \"./Typography.styles\";\n\nexport { staticClasses as typographyClasses };\n\nexport type HvTypographyClasses = ExtractNames<typeof useClasses>;\n\nconst HvTypographyMap = {\n  display: \"h1\",\n  title1: \"h1\",\n  title2: \"h2\",\n  title3: \"h3\",\n  title4: \"h4\",\n  body: \"p\",\n  label: \"span\",\n  caption1: \"p\",\n  caption2: \"p\",\n  // LEGACY\n  \"5xlTitle\": \"h1\",\n  \"4xlTitle\": \"h1\",\n  xxlTitle: \"h1\",\n  lTitle: \"h2\",\n  sTitle: \"h4\",\n  xxsTitle: \"h6\",\n  sectionTitle: \"p\",\n  placeholderText: \"p\",\n  link: \"p\",\n  disabledText: \"p\",\n  selectedNavText: \"p\",\n  vizTextDisabled: \"p\",\n  xsInlineLink: \"p\",\n} as const;\n\nexport type HvTypographyProps<C extends React.ElementType = \"p\"> =\n  PolymorphicComponentRef<\n    C,\n    {\n      /** Use the variant prop to change the visual style of the Typography. */\n      variant?: HvTypographyVariants | HvTypographyLegacyVariants;\n      /** If `true` the typography will display the look of a link. */\n      link?: boolean;\n      /** If `true` the typography will display the look of a disabled state. */\n      disabled?: boolean;\n      /** If `true`, the text will have a bottom margin. */\n      paragraph?: boolean;\n      /**\n       * If `true`, the text will not wrap, but instead will truncate with a text overflow ellipsis.\n       *\n       * Note that text overflow can only happen with block or inline-block level elements\n       * (the element needs to have a width in order to overflow).\n       */\n      noWrap?: boolean;\n      /** A Jss Object used to override or extend the styles applied to the component. */\n      classes?: HvTypographyClasses;\n    }\n  >;\n\n/**\n * Typography component is used to render text and paragraphs within an interface.\n */\nexport const HvTypography: <C extends React.ElementType = \"p\">(\n  props: HvTypographyProps<C>\n) => React.ReactElement | null = forwardRef(\n  <C extends React.ElementType = \"p\">(\n    props: HvTypographyProps<C>,\n    ref: PolymorphicRef<C>\n  ) => {\n    const {\n      className,\n      component: ComponentProp,\n      classes: classesProp,\n      variant: variantProp = \"body\",\n      link = false,\n      disabled = false,\n      noWrap = false,\n      paragraph = false,\n      ...others\n    } = useDefaultProps(\"HvTypography\", props);\n    const { classes, cx } = useClasses(classesProp);\n    const { activeTheme } = useTheme();\n\n    const variant = mapVariant(variantProp, activeTheme?.name);\n\n    const Component =\n      ComponentProp || (paragraph && \"p\") || HvTypographyMap[variant] || \"span\";\n\n    return (\n      <Component\n        ref={ref}\n        className={cx(\n          classes.root,\n          classes[variant],\n          {\n            [classes.isLink]: link,\n            [classes.noWrap]: noWrap,\n            [classes.disabled]: disabled,\n          },\n          className\n        )}\n        {...others}\n      />\n    );\n  }\n);\n"],"names":["HvTypographyMap","display","title1","title2","title3","title4","body","label","caption1","caption2","xxlTitle","lTitle","sTitle","xxsTitle","sectionTitle","placeholderText","link","disabledText","selectedNavText","vizTextDisabled","xsInlineLink","HvTypography","forwardRef","props","ref","className","component","ComponentProp","classes","classesProp","variant","variantProp","disabled","noWrap","paragraph","others","useDefaultProps","cx","useClasses","activeTheme","useTheme","mapVariant","name","Component","root","isLink"],"mappings":";;;;;;;AAkBA,MAAMA,kBAAkB;AAAA,EACtBC,SAAS;AAAA,EACTC,QAAQ;AAAA,EACRC,QAAQ;AAAA,EACRC,QAAQ;AAAA,EACRC,QAAQ;AAAA,EACRC,MAAM;AAAA,EACNC,OAAO;AAAA,EACPC,UAAU;AAAA,EACVC,UAAU;AAAA;AAAA,EAEV,YAAY;AAAA,EACZ,YAAY;AAAA,EACZC,UAAU;AAAA,EACVC,QAAQ;AAAA,EACRC,QAAQ;AAAA,EACRC,UAAU;AAAA,EACVC,cAAc;AAAA,EACdC,iBAAiB;AAAA,EACjBC,MAAM;AAAA,EACNC,cAAc;AAAA,EACdC,iBAAiB;AAAA,EACjBC,iBAAiB;AAAA,EACjBC,cAAc;AAChB;AA6BO,MAAMC,eAEoBC,WAC/B,CACEC,OACAC,QACG;AACG,QAAA;AAAA,IACJC;AAAAA,IACAC,WAAWC;AAAAA,IACXC,SAASC;AAAAA,IACTC,SAASC,cAAc;AAAA,IACvBf,OAAO;AAAA,IACPgB,WAAW;AAAA,IACXC,SAAS;AAAA,IACTC,YAAY;AAAA,IACZ,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAgBb,KAAK;AACnC,QAAA;AAAA,IAAEK;AAAAA,IAASS;AAAAA,EAAAA,IAAOC,WAAWT,WAAW;AACxC,QAAA;AAAA,IAAEU;AAAAA,MAAgBC,SAAS;AAEjC,QAAMV,UAAUW,WAAWV,aAAaQ,2CAAaG,IAAI;AAEzD,QAAMC,YACJhB,iBAAkBO,aAAa,OAAQlC,gBAAgB8B,OAAO,KAAK;AAGnE,SAAA,oBAAC,aACC,KACA,WAAWO,GACTT,QAAQgB,MACRhB,QAAQE,OAAO,GACf;AAAA,IACE,CAACF,QAAQiB,MAAM,GAAG7B;AAAAA,IAClB,CAACY,QAAQK,MAAM,GAAGA;AAAAA,IAClB,CAACL,QAAQI,QAAQ,GAAGA;AAAAA,EAEtBP,GAAAA,SACF,GACIU,GAAAA,OACJ,CAAA;AAEN,CACF;"}

package/dist/esm/components/VerticalNavigation/Actions/Action.js

@@ -1,10 +1,10 @@
+import { jsxs } from "@emotion/react/jsx-runtime";
 import { useContext, useCallback } from "react";
 import { isKey } from "../../../utils/keyboardUtils.js";
 import { setId } from "../../../utils/setId.js";
 import { VerticalNavigationContext } from "../VerticalNavigationContext.js";
 import { useClasses } from "./Action.styles.js";
 import { staticClasses } from "./Action.styles.js";
-import { jsxs } from "@emotion/react/jsx-runtime";
 import { HvTypography } from "../../Typography/Typography.js";
 const HvVerticalNavigationAction = ({
   className,
@@ -28,23 +28,15 @@ const HvVerticalNavigationAction = ({
     }
     onClick(event);
   }, [onClick]);
-  return /* @__PURE__ */ jsxs(HvTypography, {
-    id: setId(id, "button"),
-    component: "div",
-    role: "button",
-    className: cx(classes.action, {
-      [classes.noIcon]: !icon,
-      [classes.minimized]: !isOpen
-    }, className),
-    tabIndex: 0,
-    ...!isOpen && {
-      "aria-label": label
-    },
-    onKeyDown: handleKeyDown,
-    onClick,
-    ...others,
-    children: [icon, isOpen && label]
-  });
+  return /* @__PURE__ */ jsxs(HvTypography, { id: setId(id, "button"), component: "div", role: "button", className: cx(classes.action, {
+    [classes.noIcon]: !icon,
+    [classes.minimized]: !isOpen
+  }, className), tabIndex: 0, ...!isOpen && {
+    "aria-label": label
+  }, onKeyDown: handleKeyDown, onClick, ...others, children: [
+    icon,
+    isOpen && label
+  ] });
 };
 export {
   HvVerticalNavigationAction,

package/dist/esm/components/VerticalNavigation/Actions/Action.js.map

@@ -1 +1 @@
-{"version":3,"file":"Action.js","sources":["../../../../../src/components/VerticalNavigation/Actions/Action.tsx"],"sourcesContent":["import { MouseEventHandler, useCallback, useContext } from \"react\";\n\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { VerticalNavigationContext } from \"../VerticalNavigationContext\";\nimport { staticClasses, useClasses } from \"./Action.styles\";\n\nexport { staticClasses as actionClasses };\n\nexport type HvVerticalNavigationActionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalNavigationActionProps {\n  /**\n   * Class names to be applied.\n   */\n  className?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied to the component.\n   */\n  classes?: HvVerticalNavigationActionClasses;\n  /**\n   * Id to be applied to the action.\n   */\n  id?: string;\n  /**\n   * Visual label.\n   */\n  label?: string;\n  /**\n   * Icon.\n   */\n  icon?: React.ReactNode;\n  /**\n   * Callback called when clicked.\n   */\n  onClick?: MouseEventHandler<HTMLElement>;\n}\n\nexport const HvVerticalNavigationAction = ({\n  className,\n  classes: classesProp,\n  id,\n  label = \"\",\n  icon,\n  onClick,\n  ...others\n}: HvVerticalNavigationActionProps) => {\n  const { isOpen } = useContext(VerticalNavigationContext);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const handleKeyDown = useCallback(\n    (event) => {\n      if (\n        onClick == null ||\n        (!isKey(event, \"Enter\") && !isKey(event, \"Space\"))\n      ) {\n        return;\n      }\n\n      onClick(event);\n    },\n    [onClick]\n  );\n\n  return (\n    <HvTypography\n      id={setId(id, \"button\")}\n      component=\"div\"\n      role=\"button\"\n      className={cx(\n        classes.action,\n        {\n          [classes.noIcon]: !icon,\n          [classes.minimized]: !isOpen,\n        },\n        className\n      )}\n      tabIndex={0}\n      {...(!isOpen && { \"aria-label\": label })}\n      onKeyDown={handleKeyDown}\n      onClick={onClick}\n      {...others}\n    >\n      {icon}\n      {isOpen && label}\n    </HvTypography>\n  );\n};\n"],"names":["HvVerticalNavigationAction","className","classes","classesProp","id","label","icon","onClick","others","isOpen","useContext","VerticalNavigationContext","cx","useClasses","handleKeyDown","useCallback","event","isKey","HvTypography","setId","component","role","action","noIcon","minimized","tabIndex","onKeyDown","children"],"mappings":";;;;;;;;AAyCO,MAAMA,6BAA6BA,CAAC;AAAA,EACzCC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACAC,QAAQ;AAAA,EACRC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AAC4B,MAAM;AAC/B,QAAA;AAAA,IAAEC;AAAAA,EAAAA,IAAWC,WAAWC,yBAAyB;AAEjD,QAAA;AAAA,IAAET;AAAAA,IAASU;AAAAA,EAAAA,IAAOC,WAAWV,WAAW;AAExCW,QAAAA,gBAAgBC,YACnBC,CAAU,UAAA;AAEPT,QAAAA,WAAW,QACV,CAACU,MAAMD,OAAO,OAAO,KAAK,CAACC,MAAMD,OAAO,OAAO,GAChD;AACA;AAAA,IACF;AAEAT,YAAQS,KAAK;AAAA,EAAA,GAEf,CAACT,OAAO,CACV;AAEA,8BACGW,cAAY;AAAA,IACXd,IAAIe,MAAMf,IAAI,QAAQ;AAAA,IACtBgB,WAAU;AAAA,IACVC,MAAK;AAAA,IACLpB,WAAWW,GACTV,QAAQoB,QACR;AAAA,MACE,CAACpB,QAAQqB,MAAM,GAAG,CAACjB;AAAAA,MACnB,CAACJ,QAAQsB,SAAS,GAAG,CAACf;AAAAA,OAExBR,SACF;AAAA,IACAwB,UAAU;AAAA,IAAE,GACP,CAAChB,UAAU;AAAA,MAAE,cAAcJ;AAAAA,IAAM;AAAA,IACtCqB,WAAWZ;AAAAA,IACXP;AAAAA,IAAiB,GACbC;AAAAA,IAAMmB,UAETrB,CAAAA,MACAG,UAAUJ,KAAK;AAAA,EAAA,CACJ;AAElB;"}
+{"version":3,"file":"Action.js","sources":["../../../../../src/components/VerticalNavigation/Actions/Action.tsx"],"sourcesContent":["import { MouseEventHandler, useCallback, useContext } from \"react\";\n\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { VerticalNavigationContext } from \"../VerticalNavigationContext\";\nimport { staticClasses, useClasses } from \"./Action.styles\";\n\nexport { staticClasses as actionClasses };\n\nexport type HvVerticalNavigationActionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalNavigationActionProps {\n  /**\n   * Class names to be applied.\n   */\n  className?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied to the component.\n   */\n  classes?: HvVerticalNavigationActionClasses;\n  /**\n   * Id to be applied to the action.\n   */\n  id?: string;\n  /**\n   * Visual label.\n   */\n  label?: string;\n  /**\n   * Icon.\n   */\n  icon?: React.ReactNode;\n  /**\n   * Callback called when clicked.\n   */\n  onClick?: MouseEventHandler<HTMLElement>;\n}\n\nexport const HvVerticalNavigationAction = ({\n  className,\n  classes: classesProp,\n  id,\n  label = \"\",\n  icon,\n  onClick,\n  ...others\n}: HvVerticalNavigationActionProps) => {\n  const { isOpen } = useContext(VerticalNavigationContext);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const handleKeyDown = useCallback(\n    (event) => {\n      if (\n        onClick == null ||\n        (!isKey(event, \"Enter\") && !isKey(event, \"Space\"))\n      ) {\n        return;\n      }\n\n      onClick(event);\n    },\n    [onClick]\n  );\n\n  return (\n    <HvTypography\n      id={setId(id, \"button\")}\n      component=\"div\"\n      role=\"button\"\n      className={cx(\n        classes.action,\n        {\n          [classes.noIcon]: !icon,\n          [classes.minimized]: !isOpen,\n        },\n        className\n      )}\n      tabIndex={0}\n      {...(!isOpen && { \"aria-label\": label })}\n      onKeyDown={handleKeyDown}\n      onClick={onClick}\n      {...others}\n    >\n      {icon}\n      {isOpen && label}\n    </HvTypography>\n  );\n};\n"],"names":["HvVerticalNavigationAction","className","classes","classesProp","id","label","icon","onClick","others","isOpen","useContext","VerticalNavigationContext","cx","useClasses","handleKeyDown","useCallback","event","isKey","setId","action","noIcon","minimized"],"mappings":";;;;;;;;AAyCO,MAAMA,6BAA6BA,CAAC;AAAA,EACzCC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACAC,QAAQ;AAAA,EACRC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AAC4B,MAAM;AAC/B,QAAA;AAAA,IAAEC;AAAAA,EAAAA,IAAWC,WAAWC,yBAAyB;AAEjD,QAAA;AAAA,IAAET;AAAAA,IAASU;AAAAA,EAAAA,IAAOC,WAAWV,WAAW;AAExCW,QAAAA,gBAAgBC,YACnBC,CAAU,UAAA;AAEPT,QAAAA,WAAW,QACV,CAACU,MAAMD,OAAO,OAAO,KAAK,CAACC,MAAMD,OAAO,OAAO,GAChD;AACA;AAAA,IACF;AAEAT,YAAQS,KAAK;AAAA,EAAA,GAEf,CAACT,OAAO,CACV;AAEA,SACG,qBAAA,cAAA,EACC,IAAIW,MAAMd,IAAI,QAAQ,GACtB,WAAU,OACV,MAAK,UACL,WAAWQ,GACTV,QAAQiB,QACR;AAAA,IACE,CAACjB,QAAQkB,MAAM,GAAG,CAACd;AAAAA,IACnB,CAACJ,QAAQmB,SAAS,GAAG,CAACZ;AAAAA,KAExBR,SACF,GACA,UAAU,GACL,GAAA,CAACQ,UAAU;AAAA,IAAE,cAAcJ;AAAAA,EAChC,GAAA,WAAWS,eACX,SACA,GAAIN,QAEHF,UAAAA;AAAAA,IAAAA;AAAAA,IACAG,UAAUJ;AAAAA,EACb,EAAA,CAAA;AAEJ;"}

package/dist/esm/components/VerticalNavigation/Actions/Actions.js

@@ -1,8 +1,8 @@
+import { jsx } from "@emotion/react/jsx-runtime";
 import { useContext } from "react";
 import { VerticalNavigationContext } from "../VerticalNavigationContext.js";
 import { useClasses } from "./Actions.styles.js";
 import { staticClasses } from "./Actions.styles.js";
-import { jsx } from "@emotion/react/jsx-runtime";
 const HvVerticalNavigationActions = ({
   className,
   classes: classesProp,
@@ -18,14 +18,9 @@ const HvVerticalNavigationActions = ({
     isOpen,
     useIcons
   } = useContext(VerticalNavigationContext);
-  return /* @__PURE__ */ jsx("div", {
-    id,
-    className: cx(classes.root, {
-      [classes.hide]: !isOpen && !useIcons
-    }, className),
-    ...others,
-    children
-  });
+  return /* @__PURE__ */ jsx("div", { id, className: cx(classes.root, {
+    [classes.hide]: !isOpen && !useIcons
+  }, className), ...others, children });
 };
 export {
   HvVerticalNavigationActions,

package/dist/esm/components/VerticalNavigation/Actions/Actions.js.map

@@ -1 +1 @@
-{"version":3,"file":"Actions.js","sources":["../../../../../src/components/VerticalNavigation/Actions/Actions.tsx"],"sourcesContent":["import { ExtractNames } from \"@core/utils/classes\";\n\nimport { useContext } from \"react\";\n\nimport { VerticalNavigationContext } from \"../VerticalNavigationContext\";\nimport { staticClasses, useClasses } from \"./Actions.styles\";\n\nexport { staticClasses as actionsClasses };\n\nexport type HvVerticalNavigationActionsClasses = ExtractNames<\n  typeof useClasses\n>;\n\nexport interface HvVerticalNavigationActionsProps {\n  /**\n   * Class names to be applied.\n   */\n  className?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied to the component.\n   */\n  classes?: HvVerticalNavigationActionsClasses;\n  /**\n   * Id to be applied to the actions container.\n   */\n  id?: string;\n  /**\n   * Node to be rendered\n   */\n  children?: React.ReactNode;\n}\n\nexport const HvVerticalNavigationActions = ({\n  className,\n  classes: classesProp,\n  id,\n  children,\n  ...others\n}: HvVerticalNavigationActionsProps) => {\n  const { classes, cx } = useClasses(classesProp);\n\n  const { isOpen, useIcons } = useContext(VerticalNavigationContext);\n\n  return (\n    <div\n      id={id}\n      className={cx(\n        classes.root,\n        {\n          [classes.hide]: !isOpen && !useIcons,\n        },\n        className\n      )}\n      {...others}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["HvVerticalNavigationActions","className","classes","classesProp","id","children","others","cx","useClasses","isOpen","useIcons","useContext","VerticalNavigationContext","root","hide"],"mappings":";;;;;AAgCO,MAAMA,8BAA8BA,CAAC;AAAA,EAC1CC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AAC6B,MAAM;AAChC,QAAA;AAAA,IAAEJ;AAAAA,IAASK;AAAAA,EAAAA,IAAOC,WAAWL,WAAW;AAExC,QAAA;AAAA,IAAEM;AAAAA,IAAQC;AAAAA,EAAAA,IAAaC,WAAWC,yBAAyB;AAEjE,6BACE,OAAA;AAAA,IACER;AAAAA,IACAH,WAAWM,GACTL,QAAQW,MACR;AAAA,MACE,CAACX,QAAQY,IAAI,GAAG,CAACL,UAAU,CAACC;AAAAA,OAE9BT,SACF;AAAA,IAAE,GACEK;AAAAA,IAAMD;AAAAA,EAAAA,CAGP;AAET;"}
+{"version":3,"file":"Actions.js","sources":["../../../../../src/components/VerticalNavigation/Actions/Actions.tsx"],"sourcesContent":["import { ExtractNames } from \"@core/utils/classes\";\n\nimport { useContext } from \"react\";\n\nimport { VerticalNavigationContext } from \"../VerticalNavigationContext\";\nimport { staticClasses, useClasses } from \"./Actions.styles\";\n\nexport { staticClasses as actionsClasses };\n\nexport type HvVerticalNavigationActionsClasses = ExtractNames<\n  typeof useClasses\n>;\n\nexport interface HvVerticalNavigationActionsProps {\n  /**\n   * Class names to be applied.\n   */\n  className?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied to the component.\n   */\n  classes?: HvVerticalNavigationActionsClasses;\n  /**\n   * Id to be applied to the actions container.\n   */\n  id?: string;\n  /**\n   * Node to be rendered\n   */\n  children?: React.ReactNode;\n}\n\nexport const HvVerticalNavigationActions = ({\n  className,\n  classes: classesProp,\n  id,\n  children,\n  ...others\n}: HvVerticalNavigationActionsProps) => {\n  const { classes, cx } = useClasses(classesProp);\n\n  const { isOpen, useIcons } = useContext(VerticalNavigationContext);\n\n  return (\n    <div\n      id={id}\n      className={cx(\n        classes.root,\n        {\n          [classes.hide]: !isOpen && !useIcons,\n        },\n        className\n      )}\n      {...others}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["HvVerticalNavigationActions","className","classes","classesProp","id","children","others","cx","useClasses","isOpen","useIcons","useContext","VerticalNavigationContext","root","hide"],"mappings":";;;;;AAgCO,MAAMA,8BAA8BA,CAAC;AAAA,EAC1CC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AAC6B,MAAM;AAChC,QAAA;AAAA,IAAEJ;AAAAA,IAASK;AAAAA,EAAAA,IAAOC,WAAWL,WAAW;AAExC,QAAA;AAAA,IAAEM;AAAAA,IAAQC;AAAAA,EAAAA,IAAaC,WAAWC,yBAAyB;AAEjE,6BACG,OACC,EAAA,IACA,WAAWL,GACTL,QAAQW,MACR;AAAA,IACE,CAACX,QAAQY,IAAI,GAAG,CAACL,UAAU,CAACC;AAAAA,EAE9BT,GAAAA,SACF,GACA,GAAIK,QAEHD,SACH,CAAA;AAEJ;"}

package/dist/esm/components/VerticalNavigation/Header/Header.js

@@ -1,9 +1,9 @@
+import { jsxs, jsx } from "@emotion/react/jsx-runtime";
 import { Backwards, Forwards, Menu } from "@hitachivantara/uikit-react-icons";
 import { useContext, useMemo } from "react";
 import { VerticalNavigationContext } from "../VerticalNavigationContext.js";
 import { useClasses } from "./Header.styles.js";
 import { staticClasses } from "./Header.styles.js";
-import { jsxs, jsx } from "@emotion/react/jsx-runtime";
 import { HvButton } from "../../Button/Button.js";
 import { HvTypography } from "../../Typography/Typography.js";
 const HvVerticalNavigationHeader = ({
@@ -35,33 +35,15 @@ const HvVerticalNavigationHeader = ({
       navigateToParentHandler();
   };
   const shouldShowTitle = useMemo(() => !slider || slider && !Array.isArray(parentItem), [parentItem, slider]);
-  return shouldShowTitle ? /* @__PURE__ */ jsxs("div", {
-    className: cx(classes.root, {
-      [classes.minimized]: !isOpen
-    }, className),
-    ...others,
-    children: [isOpen && headerTitle && slider && /* @__PURE__ */ jsx(HvButton, {
-      icon: true,
-      onClick: backButtonClickHandler,
-      "aria-label": "Back",
-      ...backButtonProps,
-      children: /* @__PURE__ */ jsx(Backwards, {
-        iconSize: "XS"
-      })
-    }), isOpen && /* @__PURE__ */ jsx(HvTypography, {
-      variant: slider ? "label" : "title3",
-      children: headerTitle && slider ? headerTitle : title
-    }), onCollapseButtonClick && /* @__PURE__ */ jsx(HvButton, {
-      icon: true,
-      onClick: onCollapseButtonClick,
-      className: classes.collapseButton,
-      classes: {
-        root: isOpen ? "" : classes.minimized
-      },
-      ...collapseButtonProps,
-      children: isOpen ? closeIcon : openIcon
-    })]
-  }) : null;
+  return shouldShowTitle ? /* @__PURE__ */ jsxs("div", { className: cx(classes.root, {
+    [classes.minimized]: !isOpen
+  }, className), ...others, children: [
+    isOpen && headerTitle && slider && /* @__PURE__ */ jsx(HvButton, { icon: true, onClick: backButtonClickHandler, "aria-label": "Back", ...backButtonProps, children: /* @__PURE__ */ jsx(Backwards, { iconSize: "XS" }) }),
+    isOpen && /* @__PURE__ */ jsx(HvTypography, { variant: slider ? "label" : "title3", children: headerTitle && slider ? headerTitle : title }),
+    onCollapseButtonClick && /* @__PURE__ */ jsx(HvButton, { icon: true, onClick: onCollapseButtonClick, className: classes.collapseButton, classes: {
+      root: isOpen ? "" : classes.minimized
+    }, ...collapseButtonProps, children: isOpen ? closeIcon : openIcon })
+  ] }) : null;
 };
 export {
   HvVerticalNavigationHeader,

package/dist/esm/components/VerticalNavigation/Header/Header.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sources":["../../../../../src/components/VerticalNavigation/Header/Header.tsx"],"sourcesContent":["import { Backwards, Forwards, Menu } from \"@hitachivantara/uikit-react-icons\";\n\nimport { MouseEventHandler, useContext, useMemo } from \"react\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { HvButton, HvButtonProps } from \"@core/components/Button\";\nimport { VerticalNavigationContext } from \"../VerticalNavigationContext\";\nimport { staticClasses, useClasses } from \"./Header.styles\";\n\nexport { staticClasses as verticalNavigationHeaderClasses };\n\nexport type HvVerticalNavigationHeaderClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalNavigationHeaderProps {\n  /**\n   * Id to be applied to the root node.\n   */\n  id?: string;\n  /**\n   * The title text to show on Header.\n   */\n  title?: string;\n  /**\n   * Icon to show when Vertical Navigation is collapsed.\n   */\n  openIcon?: React.ReactNode;\n  /**\n   * Icon to show when Vertical Navigation is expanded.\n   */\n  closeIcon?: React.ReactNode;\n  /**\n   * Props for the collapse button.\n   */\n  collapseButtonProps?: HvButtonProps;\n  /**\n   * Props for the back button.\n   */\n  backButtonProps?: HvButtonProps;\n  /**\n   * Class names to be applied.\n   */\n  className?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied to the component.\n   */\n  classes?: HvVerticalNavigationHeaderClasses;\n  /**\n   * Handler for the collapse button.\n   */\n  onCollapseButtonClick?: MouseEventHandler<HTMLElement>;\n}\n\nexport const HvVerticalNavigationHeader = ({\n  title,\n  openIcon = <Forwards />,\n  closeIcon = <Backwards />,\n  collapseButtonProps,\n  backButtonProps,\n  className,\n  classes: classesProp,\n  onCollapseButtonClick,\n  ...others\n}: HvVerticalNavigationHeaderProps) => {\n  const {\n    isOpen,\n    useIcons,\n    headerTitle,\n    slider,\n    navigateToParentHandler,\n    parentItem,\n  } = useContext(VerticalNavigationContext);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  openIcon = !useIcons ? <Menu /> : openIcon;\n\n  const backButtonClickHandler = () => {\n    if (navigateToParentHandler) navigateToParentHandler();\n  };\n\n  // whenever we're in a sublevel, the parentItem is always a single item.\n  // In the first level it's always an array with the first level elements.\n  const shouldShowTitle = useMemo(\n    () => !slider || (slider && !Array.isArray(parentItem)),\n    [parentItem, slider]\n  );\n\n  return shouldShowTitle ? (\n    <div\n      className={cx(classes.root, { [classes.minimized]: !isOpen }, className)}\n      {...others}\n    >\n      {isOpen && headerTitle && slider && (\n        <HvButton\n          icon\n          onClick={backButtonClickHandler}\n          aria-label=\"Back\"\n          {...backButtonProps}\n        >\n          <Backwards iconSize=\"XS\" />\n        </HvButton>\n      )}\n      {isOpen && (\n        <HvTypography variant={slider ? \"label\" : \"title3\"}>\n          {headerTitle && slider ? headerTitle : title}\n        </HvTypography>\n      )}\n      {onCollapseButtonClick && (\n        <HvButton\n          icon\n          onClick={onCollapseButtonClick}\n          className={classes.collapseButton}\n          classes={{\n            root: isOpen ? \"\" : classes.minimized,\n          }}\n          {...collapseButtonProps}\n        >\n          {isOpen ? closeIcon : openIcon}\n        </HvButton>\n      )}\n    </div>\n  ) : null;\n};\n"],"names":["HvVerticalNavigationHeader","title","openIcon","_jsx","Forwards","closeIcon","Backwards","collapseButtonProps","backButtonProps","className","classes","classesProp","onCollapseButtonClick","others","isOpen","useIcons","headerTitle","slider","navigateToParentHandler","parentItem","useContext","VerticalNavigationContext","cx","useClasses","Menu","backButtonClickHandler","shouldShowTitle","useMemo","Array","isArray","root","minimized","children","HvButton","icon","onClick","iconSize","HvTypography","variant","collapseButton"],"mappings":";;;;;;;;AAqDO,MAAMA,6BAA6BA,CAAC;AAAA,EACzCC;AAAAA,EACAC,WAAWC,oBAACC,YAAU;AAAA,EACtBC,YAAYF,oBAACG,aAAW;AAAA,EACxBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACA,GAAGC;AAC4B,MAAM;AAC/B,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,EAAAA,IACEC,WAAWC,yBAAyB;AAElC,QAAA;AAAA,IAAEX;AAAAA,IAASY;AAAAA,EAAAA,IAAOC,WAAWZ,WAAW;AAE9CT,aAAW,CAACa,WAAWZ,oBAACqB,MAAI,CAAA,CAAE,IAAItB;AAElC,QAAMuB,yBAAyBA,MAAM;AAC/BP,QAAAA;AAAiD;EAAA;AAKvD,QAAMQ,kBAAkBC,QACtB,MAAM,CAACV,UAAWA,UAAU,CAACW,MAAMC,QAAQV,UAAU,GACrD,CAACA,YAAYF,MAAM,CACrB;AAEOS,SAAAA,uCACL,OAAA;AAAA,IACEjB,WAAWa,GAAGZ,QAAQoB,MAAM;AAAA,MAAE,CAACpB,QAAQqB,SAAS,GAAG,CAACjB;AAAAA,OAAUL,SAAS;AAAA,IAAE,GACrEI;AAAAA,IAAMmB,UAAA,CAETlB,UAAUE,eAAeC,8BACvBgB,UAAQ;AAAA,MACPC,MAAI;AAAA,MACJC,SAASV;AAAAA,MACT,cAAW;AAAA,MAAM,GACbjB;AAAAA,MAAewB,8BAElB1B,WAAS;AAAA,QAAC8B,UAAS;AAAA,MAAA,CAAM;AAAA,IAAA,CAClB,GAEXtB,UACCX,oBAACkC,cAAY;AAAA,MAACC,SAASrB,SAAS,UAAU;AAAA,MAASe,UAChDhB,eAAeC,SAASD,cAAcf;AAAAA,IAAAA,CAC3B,GAEfW,yBACCT,oBAAC8B,UAAQ;AAAA,MACPC,MAAI;AAAA,MACJC,SAASvB;AAAAA,MACTH,WAAWC,QAAQ6B;AAAAA,MACnB7B,SAAS;AAAA,QACPoB,MAAMhB,SAAS,KAAKJ,QAAQqB;AAAAA,MAC9B;AAAA,MAAE,GACExB;AAAAA,MAAmByB,UAEtBlB,SAAST,YAAYH;AAAAA,IAAAA,CACd,CACX;AAAA,EACE,CAAA,IACH;AACN;"}
+{"version":3,"file":"Header.js","sources":["../../../../../src/components/VerticalNavigation/Header/Header.tsx"],"sourcesContent":["import { Backwards, Forwards, Menu } from \"@hitachivantara/uikit-react-icons\";\n\nimport { MouseEventHandler, useContext, useMemo } from \"react\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { HvButton, HvButtonProps } from \"@core/components/Button\";\nimport { VerticalNavigationContext } from \"../VerticalNavigationContext\";\nimport { staticClasses, useClasses } from \"./Header.styles\";\n\nexport { staticClasses as verticalNavigationHeaderClasses };\n\nexport type HvVerticalNavigationHeaderClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalNavigationHeaderProps {\n  /**\n   * Id to be applied to the root node.\n   */\n  id?: string;\n  /**\n   * The title text to show on Header.\n   */\n  title?: string;\n  /**\n   * Icon to show when Vertical Navigation is collapsed.\n   */\n  openIcon?: React.ReactNode;\n  /**\n   * Icon to show when Vertical Navigation is expanded.\n   */\n  closeIcon?: React.ReactNode;\n  /**\n   * Props for the collapse button.\n   */\n  collapseButtonProps?: HvButtonProps;\n  /**\n   * Props for the back button.\n   */\n  backButtonProps?: HvButtonProps;\n  /**\n   * Class names to be applied.\n   */\n  className?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied to the component.\n   */\n  classes?: HvVerticalNavigationHeaderClasses;\n  /**\n   * Handler for the collapse button.\n   */\n  onCollapseButtonClick?: MouseEventHandler<HTMLElement>;\n}\n\nexport const HvVerticalNavigationHeader = ({\n  title,\n  openIcon = <Forwards />,\n  closeIcon = <Backwards />,\n  collapseButtonProps,\n  backButtonProps,\n  className,\n  classes: classesProp,\n  onCollapseButtonClick,\n  ...others\n}: HvVerticalNavigationHeaderProps) => {\n  const {\n    isOpen,\n    useIcons,\n    headerTitle,\n    slider,\n    navigateToParentHandler,\n    parentItem,\n  } = useContext(VerticalNavigationContext);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  openIcon = !useIcons ? <Menu /> : openIcon;\n\n  const backButtonClickHandler = () => {\n    if (navigateToParentHandler) navigateToParentHandler();\n  };\n\n  // whenever we're in a sublevel, the parentItem is always a single item.\n  // In the first level it's always an array with the first level elements.\n  const shouldShowTitle = useMemo(\n    () => !slider || (slider && !Array.isArray(parentItem)),\n    [parentItem, slider]\n  );\n\n  return shouldShowTitle ? (\n    <div\n      className={cx(classes.root, { [classes.minimized]: !isOpen }, className)}\n      {...others}\n    >\n      {isOpen && headerTitle && slider && (\n        <HvButton\n          icon\n          onClick={backButtonClickHandler}\n          aria-label=\"Back\"\n          {...backButtonProps}\n        >\n          <Backwards iconSize=\"XS\" />\n        </HvButton>\n      )}\n      {isOpen && (\n        <HvTypography variant={slider ? \"label\" : \"title3\"}>\n          {headerTitle && slider ? headerTitle : title}\n        </HvTypography>\n      )}\n      {onCollapseButtonClick && (\n        <HvButton\n          icon\n          onClick={onCollapseButtonClick}\n          className={classes.collapseButton}\n          classes={{\n            root: isOpen ? \"\" : classes.minimized,\n          }}\n          {...collapseButtonProps}\n        >\n          {isOpen ? closeIcon : openIcon}\n        </HvButton>\n      )}\n    </div>\n  ) : null;\n};\n"],"names":["HvVerticalNavigationHeader","title","openIcon","closeIcon","collapseButtonProps","backButtonProps","className","classes","classesProp","onCollapseButtonClick","others","isOpen","useIcons","headerTitle","slider","navigateToParentHandler","parentItem","useContext","VerticalNavigationContext","cx","useClasses","backButtonClickHandler","shouldShowTitle","useMemo","Array","isArray","root","minimized","collapseButton"],"mappings":";;;;;;;;AAqDO,MAAMA,6BAA6BA,CAAC;AAAA,EACzCC;AAAAA,EACAC,+BAAY,UAAW,EAAA;AAAA,EACvBC,gCAAa,WAAY,EAAA;AAAA,EACzBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACA,GAAGC;AAC4B,MAAM;AAC/B,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,EAAAA,IACEC,WAAWC,yBAAyB;AAElC,QAAA;AAAA,IAAEX;AAAAA,IAASY;AAAAA,EAAAA,IAAOC,WAAWZ,WAAW;AAE9CN,aAAW,CAACU,WAAY,oBAAA,MAAA,CAAA,CAAI,IAAMV;AAElC,QAAMmB,yBAAyBA,MAAM;AAC/BN,QAAAA;AAAiD;EAAA;AAKvD,QAAMO,kBAAkBC,QACtB,MAAM,CAACT,UAAWA,UAAU,CAACU,MAAMC,QAAQT,UAAU,GACrD,CAACA,YAAYF,MAAM,CACrB;AAEA,SAAOQ,kBACJ,qBAAA,OAAA,EACC,WAAWH,GAAGZ,QAAQmB,MAAM;AAAA,IAAE,CAACnB,QAAQoB,SAAS,GAAG,CAAChB;AAAAA,EAAUL,GAAAA,SAAS,GACvE,GAAII,QAEHC,UAAAA;AAAAA,IAAAA,UAAUE,eAAeC,UACxB,oBAAC,UACC,EAAA,MAAI,MACJ,SAASO,wBACT,cAAW,QACPhB,GAAAA,iBAEJ,UAAA,oBAAC,WAAU,EAAA,UAAS,KAAI,CAAA,GAC1B;AAAA,IAEDM,UACE,oBAAA,cAAA,EAAa,SAASG,SAAS,UAAU,UACvCD,UAAAA,eAAeC,SAASD,cAAcZ,MACzC,CAAA;AAAA,IAEDQ,yBACE,oBAAA,UAAA,EACC,MAAI,MACJ,SAASA,uBACT,WAAWF,QAAQqB,gBACnB,SAAS;AAAA,MACPF,MAAMf,SAAS,KAAKJ,QAAQoB;AAAAA,IAAAA,GAE1BvB,GAAAA,qBAEHO,UAAAA,SAASR,YAAYD,SACxB,CAAA;AAAA,EAAA,EAEJ,CAAA,IACE;AACN;"}

package/dist/esm/components/VerticalNavigation/Navigation/Navigation.js

@@ -1,3 +1,4 @@
+import { jsx, jsxs } from "@emotion/react/jsx-runtime";
 import { useContext, useState, useCallback, useMemo, useEffect } from "react";
 import uniqueId from "lodash/uniqueId";
 import { wrapperTooltip } from "../../../utils/wrapperTooltip.js";
@@ -8,7 +9,6 @@ import { staticClasses } from "./Navigation.styles.js";
 import { VerticalNavigationContext } from "../VerticalNavigationContext.js";
 import { getParentItemById } from "../NavigationSlider/utils/NavigationSlider.utils.js";
 import { NavigationPopupContainer } from "../NavigationPopup/NavigationPopupContainer.js";
-import { jsx, jsxs } from "@emotion/react/jsx-runtime";
 import { HvVerticalNavigationSlider } from "../NavigationSlider/NavigationSlider.js";
 import { HvVerticalNavigationTreeView } from "../TreeView/TreeView.js";
 import { HvVerticalNavigationTreeViewItem } from "../TreeView/TreeViewItem.js";
@@ -27,21 +27,7 @@ const createListHierarchy = (items, id, classes, mouseEnterHandler, disableToolt
   const itemMouseEnterHandler = (event) => {
     mouseEnterHandler == null ? void 0 : mouseEnterHandler(event, item);
   };
-  return /* @__PURE__ */ jsx(HvVerticalNavigationTreeViewItem, {
-    id: setId(id, itemId),
-    className: classes == null ? void 0 : classes.listItem,
-    href,
-    target,
-    nodeId: itemId,
-    label: /* @__PURE__ */ jsx(ItemText, {}),
-    icon,
-    payload: item,
-    selectable,
-    disabled,
-    onMouseEnter: itemMouseEnterHandler,
-    disableTooltip,
-    children: children ? createListHierarchy(children, id, classes, mouseEnterHandler, disableTooltip) : void 0
-  }, itemId);
+  return /* @__PURE__ */ jsx(HvVerticalNavigationTreeViewItem, { id: setId(id, itemId), className: classes == null ? void 0 : classes.listItem, href, target, nodeId: itemId, label: /* @__PURE__ */ jsx(ItemText, {}), icon, payload: item, selectable, disabled, onMouseEnter: itemMouseEnterHandler, disableTooltip, children: children ? createListHierarchy(children, id, classes, mouseEnterHandler, disableTooltip) : void 0 }, itemId);
 });
 const getAllParents = (items) => {
   const parents = items.filter((item) => item.data != null && item.data.length > 0);
@@ -200,46 +186,12 @@ const HvVerticalNavigationTree = ({
   const handleNavigationPopupChange = (event, selectedItem) => {
     handleChange(event, selectedItem.id, selectedItem);
   };
-  return /* @__PURE__ */ jsx("nav", {
-    id,
-    className: cx(classes.root, {
-      [classes.collapsed]: !isOpen && !useIcons
-    }, className),
-    onMouseLeave: handleStyledNavMouseLeave,
-    ...others,
-    children: slider ? /* @__PURE__ */ jsx(HvVerticalNavigationSlider, {
-      data: parentItem.data || withParentData,
-      selected,
-      onNavigateToTarget: navigateToTargetHandler,
-      onNavigateToChild: navigateToChildHandler,
-      forwardButtonAriaLabel: sliderForwardButtonAriaLabel
-    }) : /* @__PURE__ */ jsxs(HvVerticalNavigationTreeView, {
-      id: setId(id, "tree"),
-      className: classes.list,
-      selectable: true,
-      mode,
-      collapsible,
-      selected,
-      onChange: handleChange,
-      expanded,
-      onToggle: handleToggle,
-      children: [useIcons && !isOpen && navigationPopup && /* @__PURE__ */ jsx(NavigationPopupContainer, {
-        anchorEl: navigationPopup.anchorEl,
-        onClose: handleNavigationPopupClose,
-        className: classes.navigationPopup,
-        children: /* @__PURE__ */ jsx(HvVerticalNavigationTree, {
-          className: classes.popup,
-          id: setId(id, "navigation-popup-tree"),
-          collapsible: true,
-          defaultExpanded: true,
-          selected,
-          data: navigationPopup.data,
-          onChange: handleNavigationPopupChange,
-          onMouseLeave: handleNavigationPopupMouseLeave
-        })
-      }, navigationPopup.uniqueKey), children]
-    })
-  });
+  return /* @__PURE__ */ jsx("nav", { id, className: cx(classes.root, {
+    [classes.collapsed]: !isOpen && !useIcons
+  }, className), onMouseLeave: handleStyledNavMouseLeave, ...others, children: slider ? /* @__PURE__ */ jsx(HvVerticalNavigationSlider, { data: parentItem.data || withParentData, selected, onNavigateToTarget: navigateToTargetHandler, onNavigateToChild: navigateToChildHandler, forwardButtonAriaLabel: sliderForwardButtonAriaLabel }) : /* @__PURE__ */ jsxs(HvVerticalNavigationTreeView, { id: setId(id, "tree"), className: classes.list, selectable: true, mode, collapsible, selected, onChange: handleChange, expanded, onToggle: handleToggle, children: [
+    useIcons && !isOpen && navigationPopup && /* @__PURE__ */ jsx(NavigationPopupContainer, { anchorEl: navigationPopup.anchorEl, onClose: handleNavigationPopupClose, className: classes.navigationPopup, children: /* @__PURE__ */ jsx(HvVerticalNavigationTree, { className: classes.popup, id: setId(id, "navigation-popup-tree"), collapsible: true, defaultExpanded: true, selected, data: navigationPopup.data, onChange: handleNavigationPopupChange, onMouseLeave: handleNavigationPopupMouseLeave }) }, navigationPopup.uniqueKey),
+    children
+  ] }) });
 };
 export {
   HvVerticalNavigationTree,

package/dist/esm/components/VerticalNavigation/Navigation/Navigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"Navigation.js","sources":["../../../../../src/components/VerticalNavigation/Navigation/Navigation.tsx"],"sourcesContent":["import { useCallback, useMemo, useContext, useEffect, useState } from \"react\";\n\nimport uniqueId from \"lodash/uniqueId\";\n\nimport { wrapperTooltip } from \"@core/utils/wrapperTooltip\";\nimport { setId } from \"@core/utils/setId\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { HvBaseProps } from \"@core/types/generic\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport {\n  HvVerticalNavigationTreeView,\n  HvVerticalNavigationTreeViewItem,\n  NavigationMode,\n} from \"../TreeView\";\nimport { staticClasses, useClasses } from \"./Navigation.styles\";\nimport { HvVerticalNavigationSlider } from \"../NavigationSlider\";\nimport {\n  VerticalNavigationContext,\n  NavigationData,\n} from \"../VerticalNavigationContext\";\nimport { getParentItemById } from \"../NavigationSlider/utils/NavigationSlider.utils\";\nimport { NavigationPopupContainer } from \"../NavigationPopup/NavigationPopupContainer\";\n\nexport { staticClasses as verticalNavigationTreeClasses };\n\nexport type HvVerticalNavigationTreeClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalNavigationTreeProps\n  extends HvBaseProps<HTMLDivElement, \"onChange\"> {\n  /**\n   * Id to be applied to the root node.\n   */\n  id?: string;\n  /**\n   * Class names to be applied.\n   */\n  className?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes?: HvVerticalNavigationTreeClasses;\n  /**\n   * Modus operandi (role) of the widget instance.\n   */\n  mode?: NavigationMode;\n  /**\n   * Can non-leaf nodes be collapsed / expanded.\n   */\n  collapsible?: boolean;\n  /**\n   * The ID of the selected page.\n   */\n  selected?: string;\n  /**\n   * When uncontrolled, defines the initial selected page ID.\n   */\n  defaultSelected?: string;\n  /**\n   * Callback fired when a navigation item is selected.\n   *\n   * @param {object} event The event source of the callback.\n   * @param {object} page The data of the selected page.\n   */\n  onChange?: (event, page) => void;\n  /**\n   * Expanded nodes' ids.\n   */\n  expanded?: string[];\n  /**\n   * When uncontrolled, defines the initial expanded nodes' ids.\n   *\n   * It also supports `true` for starting with all nodes expanded.\n   * With `false` all nodes will be collapsed.\n   *\n   * By default it expands the needed nodes to display the current selection, if any.\n   */\n  defaultExpanded?: string[] | boolean;\n  /**\n   * Callback fired when tree items are expanded/collapsed.\n   *\n   * @param {object} event The event source of the callback.\n   * @param {array} nodeIds The ids of the expanded nodes (old and new).\n   */\n  onToggle?: (event, nodeIds) => void;\n  /**\n   * An array containing the data for each menu item.\n   *\n   * id - the id to be applied to the root element.\n   * label - the label to be rendered on the menu item.\n   * data - sub-menu items\n   * href - the url used for navigation.\n   * target - the behavior when opening an url.\n   */\n  data?: NavigationData[];\n  /** Aria label to apply to the navigate to submenu button on the navigation slider list items. */\n  sliderForwardButtonAriaLabel?: string;\n}\n\nconst createListHierarchy = (\n  items,\n  id,\n  classes?: HvVerticalNavigationTreeClasses,\n  mouseEnterHandler?: (event, item) => void,\n  disableTooltip = false\n) =>\n  items.map((item) => {\n    const {\n      id: itemId,\n      label: itemLabel,\n      icon,\n      data: children,\n      selectable,\n      disabled,\n      href,\n      target,\n    } = item;\n\n    const ItemText = wrapperTooltip(true, itemLabel, itemLabel);\n\n    const itemMouseEnterHandler = (event) => {\n      mouseEnterHandler?.(event, item);\n    };\n\n    return (\n      <HvVerticalNavigationTreeViewItem\n        id={setId(id, itemId)}\n        className={classes?.listItem}\n        href={href}\n        target={target}\n        key={itemId}\n        nodeId={itemId}\n        label={<ItemText />}\n        icon={icon}\n        payload={item}\n        selectable={selectable}\n        disabled={disabled}\n        onMouseEnter={itemMouseEnterHandler}\n        disableTooltip={disableTooltip}\n      >\n        {children\n          ? createListHierarchy(\n              children,\n              id,\n              classes,\n              mouseEnterHandler,\n              disableTooltip\n            )\n          : undefined}\n      </HvVerticalNavigationTreeViewItem>\n    );\n  });\n\nconst getAllParents = (items) => {\n  const parents = items.filter(\n    (item) => item.data != null && item.data.length > 0\n  );\n  const childParents = parents.flatMap((item) => getAllParents(item.data));\n\n  return [...parents, ...childParents];\n};\n\nfunction pathToElement(data, targetId) {\n  const path: string[] = [];\n\n  if (data != null && data.length > 0) {\n    for (let i = 0; i !== data.length; ++i) {\n      const item = data[i];\n      if (item.id === targetId) {\n        path.push(item.id);\n        break;\n      }\n\n      const subPaths = pathToElement(item.data, targetId);\n      if (subPaths.length > 0) {\n        path.push(item.id);\n        path.push(...subPaths);\n        break;\n      }\n    }\n  }\n\n  return path;\n}\n\nexport const HvVerticalNavigationTree = ({\n  id,\n\n  className,\n  classes: classesProp,\n\n  data,\n\n  mode = \"navigation\",\n\n  collapsible = false,\n  expanded: expandedProp,\n  defaultExpanded,\n  onToggle,\n\n  selected: selectedProp,\n  defaultSelected,\n  onChange,\n\n  sliderForwardButtonAriaLabel = \"Navigate to submenu\",\n\n  ...others\n}: HvVerticalNavigationTreeProps) => {\n  const { classes, cx } = useClasses(classesProp);\n\n  const [selected, setSelected] = useControlled(selectedProp, defaultSelected);\n  const [expanded, setExpanded] = useControlled(expandedProp, () => {\n    if (defaultExpanded === true) {\n      // all parent nodes will be expanded by default\n      return getAllParents(data).map((item) => item.id);\n    }\n\n    if (defaultExpanded === false) {\n      // all parent nodes will be collapsed by default\n      return [];\n    }\n\n    if (defaultExpanded == null) {\n      if (selected != null) {\n        // the path to the selected node will be expanded (default behaviour)\n        const path = pathToElement(data, selected);\n        return path.slice(0, -1);\n      }\n\n      // nothing is expanded\n      return [];\n    }\n\n    return defaultExpanded;\n  });\n\n  const {\n    isOpen,\n    useIcons,\n    slider,\n\n    parentItem,\n    setParentItem,\n    withParentData,\n    navigateToChildHandler,\n\n    setParentData,\n    setParentSelected,\n  } = useContext(VerticalNavigationContext);\n\n  const [navigationPopup, setNavigationPopup] = useState<{\n    // This value is needed to guarantee that the NavigationPopup is fully re-rendered with keeping any previous values\n    uniqueKey: string;\n    anchorEl: HTMLButtonElement | null;\n    fixedMode: boolean;\n    data: NavigationData[];\n  } | null>(null);\n\n  const handleChange = useCallback(\n    (event, selectedId, selectedItem) => {\n      if (useIcons && !isOpen && selectedItem.data) {\n        const currentEventTarget = event.currentTarget;\n        setNavigationPopup((prevState) => {\n          // We want to close the popup in case the clicked element is the same as the previous one\n          return prevState?.anchorEl === currentEventTarget\n            ? null\n            : {\n                uniqueKey: uniqueId(),\n                anchorEl: currentEventTarget,\n                fixedMode: true,\n                data: selectedItem.data,\n              };\n        });\n\n        // We need this stopPropagation or else the Popup will close due to the clickaway being triggered\n        event.stopPropagation();\n      } else {\n        setSelected(selectedId);\n        setExpanded((prevState) => {\n          if (!isOpen) {\n            return [...prevState, ...pathToElement(data, selectedId)];\n          }\n          return [...prevState];\n        });\n        setNavigationPopup(null);\n        if (onChange) {\n          onChange(event, selectedItem);\n        }\n      }\n    },\n    [onChange, setSelected, setExpanded, isOpen, useIcons, data]\n  );\n\n  const treeViewItemMouseEnterHandler = useCallback(\n    (event, item) => {\n      const isCollapsed = useIcons && !isOpen;\n\n      if (isCollapsed && item.data && !navigationPopup?.fixedMode) {\n        const currentEventTarget = event.currentTarget;\n\n        setNavigationPopup?.({\n          uniqueKey: uniqueId(),\n          anchorEl: currentEventTarget,\n          fixedMode: false,\n          data: item.data,\n        });\n      } else if (isCollapsed && !item.data && !navigationPopup?.fixedMode) {\n        setNavigationPopup(null);\n      }\n    },\n    [isOpen, useIcons, navigationPopup]\n  );\n\n  const handleToggle = useCallback(\n    (event, newExpanded) => {\n      setExpanded(newExpanded);\n\n      if (onToggle) {\n        onToggle(event, newExpanded);\n      }\n    },\n    [onToggle, setExpanded]\n  );\n\n  const children = useMemo(\n    () =>\n      data &&\n      createListHierarchy(\n        data,\n        id,\n        classes,\n        treeViewItemMouseEnterHandler,\n        navigationPopup?.fixedMode\n      ),\n    [classes, data, id, navigationPopup, treeViewItemMouseEnterHandler]\n  );\n\n  useEffect(() => {\n    if (!isOpen) {\n      setNavigationPopup?.(null);\n    }\n  }, [isOpen]);\n\n  useEffect(() => {\n    if (setParentSelected) setParentSelected(selected);\n  }, [selected, setSelected, setParentSelected]);\n\n  useEffect(() => {\n    if (setParentData) setParentData(data);\n  }, [data, setParentData]);\n\n  useEffect(() => {\n    if (\n      withParentData &&\n      selected &&\n      setParentItem &&\n      getParentItemById(withParentData, selected)\n    ) {\n      setParentItem(getParentItemById(withParentData, selected));\n    }\n  }, [withParentData, selected, setParentItem]);\n\n  // navigation slider\n  const navigateToTargetHandler = (event, selectedItem) => {\n    handleChange(event, selectedItem.id, selectedItem);\n  };\n\n  const handleNavigationPopupClose = () => {\n    setNavigationPopup(null);\n  };\n\n  const handleStyledNavMouseLeave = () => {\n    if (useIcons && !isOpen && !navigationPopup?.fixedMode) {\n      setNavigationPopup(null);\n    }\n  };\n\n  const handleNavigationPopupMouseLeave = () => {\n    if (!navigationPopup?.fixedMode) {\n      handleNavigationPopupClose();\n    }\n  };\n\n  const handleNavigationPopupChange = (event, selectedItem) => {\n    handleChange(event, selectedItem.id, selectedItem);\n  };\n\n  return (\n    <nav\n      id={id}\n      className={cx(\n        classes.root,\n        { [classes.collapsed]: !isOpen && !useIcons },\n        className\n      )}\n      onMouseLeave={handleStyledNavMouseLeave}\n      {...others}\n    >\n      {slider ? (\n        <HvVerticalNavigationSlider\n          data={parentItem.data || withParentData}\n          selected={selected}\n          onNavigateToTarget={navigateToTargetHandler}\n          onNavigateToChild={navigateToChildHandler}\n          forwardButtonAriaLabel={sliderForwardButtonAriaLabel}\n        />\n      ) : (\n        <HvVerticalNavigationTreeView\n          id={setId(id, \"tree\")}\n          className={classes.list}\n          selectable\n          mode={mode}\n          collapsible={collapsible}\n          selected={selected}\n          onChange={handleChange}\n          expanded={expanded}\n          onToggle={handleToggle}\n        >\n          {useIcons && !isOpen && navigationPopup && (\n            <NavigationPopupContainer\n              anchorEl={navigationPopup.anchorEl}\n              onClose={handleNavigationPopupClose}\n              key={navigationPopup.uniqueKey}\n              className={classes.navigationPopup}\n            >\n              <HvVerticalNavigationTree\n                className={classes.popup}\n                id={setId(id, \"navigation-popup-tree\")}\n                collapsible\n                defaultExpanded\n                selected={selected}\n                data={navigationPopup.data}\n                onChange={handleNavigationPopupChange}\n                onMouseLeave={handleNavigationPopupMouseLeave}\n              />\n            </NavigationPopupContainer>\n          )}\n          {children}\n        </HvVerticalNavigationTreeView>\n      )}\n    </nav>\n  );\n};\n"],"names":["createListHierarchy","items","id","classes","mouseEnterHandler","disableTooltip","map","item","itemId","label","itemLabel","icon","data","children","selectable","disabled","href","target","ItemText","wrapperTooltip","itemMouseEnterHandler","event","HvVerticalNavigationTreeViewItem","setId","className","listItem","nodeId","_jsx","payload","onMouseEnter","undefined","getAllParents","parents","filter","length","childParents","flatMap","pathToElement","targetId","path","i","push","subPaths","HvVerticalNavigationTree","classesProp","mode","collapsible","expanded","expandedProp","defaultExpanded","onToggle","selected","selectedProp","defaultSelected","onChange","sliderForwardButtonAriaLabel","others","cx","useClasses","setSelected","useControlled","setExpanded","slice","isOpen","useIcons","slider","parentItem","setParentItem","withParentData","navigateToChildHandler","setParentData","setParentSelected","useContext","VerticalNavigationContext","navigationPopup","setNavigationPopup","useState","handleChange","useCallback","selectedId","selectedItem","currentEventTarget","currentTarget","prevState","anchorEl","uniqueKey","uniqueId","fixedMode","stopPropagation","treeViewItemMouseEnterHandler","isCollapsed","handleToggle","newExpanded","useMemo","useEffect","getParentItemById","navigateToTargetHandler","handleNavigationPopupClose","handleStyledNavMouseLeave","handleNavigationPopupMouseLeave","handleNavigationPopupChange","root","collapsed","onMouseLeave","HvVerticalNavigationSlider","onNavigateToTarget","onNavigateToChild","forwardButtonAriaLabel","_jsxs","HvVerticalNavigationTreeView","list","NavigationPopupContainer","onClose","popup"],"mappings":"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"}
+{"version":3,"file":"Navigation.js","sources":["../../../../../src/components/VerticalNavigation/Navigation/Navigation.tsx"],"sourcesContent":["import { useCallback, useMemo, useContext, useEffect, useState } from \"react\";\n\nimport uniqueId from \"lodash/uniqueId\";\n\nimport { wrapperTooltip } from \"@core/utils/wrapperTooltip\";\nimport { setId } from \"@core/utils/setId\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { HvBaseProps } from \"@core/types/generic\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport {\n  HvVerticalNavigationTreeView,\n  HvVerticalNavigationTreeViewItem,\n  NavigationMode,\n} from \"../TreeView\";\nimport { staticClasses, useClasses } from \"./Navigation.styles\";\nimport { HvVerticalNavigationSlider } from \"../NavigationSlider\";\nimport {\n  VerticalNavigationContext,\n  NavigationData,\n} from \"../VerticalNavigationContext\";\nimport { getParentItemById } from \"../NavigationSlider/utils/NavigationSlider.utils\";\nimport { NavigationPopupContainer } from \"../NavigationPopup/NavigationPopupContainer\";\n\nexport { staticClasses as verticalNavigationTreeClasses };\n\nexport type HvVerticalNavigationTreeClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalNavigationTreeProps\n  extends HvBaseProps<HTMLDivElement, \"onChange\"> {\n  /**\n   * Id to be applied to the root node.\n   */\n  id?: string;\n  /**\n   * Class names to be applied.\n   */\n  className?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes?: HvVerticalNavigationTreeClasses;\n  /**\n   * Modus operandi (role) of the widget instance.\n   */\n  mode?: NavigationMode;\n  /**\n   * Can non-leaf nodes be collapsed / expanded.\n   */\n  collapsible?: boolean;\n  /**\n   * The ID of the selected page.\n   */\n  selected?: string;\n  /**\n   * When uncontrolled, defines the initial selected page ID.\n   */\n  defaultSelected?: string;\n  /**\n   * Callback fired when a navigation item is selected.\n   *\n   * @param {object} event The event source of the callback.\n   * @param {object} page The data of the selected page.\n   */\n  onChange?: (event, page) => void;\n  /**\n   * Expanded nodes' ids.\n   */\n  expanded?: string[];\n  /**\n   * When uncontrolled, defines the initial expanded nodes' ids.\n   *\n   * It also supports `true` for starting with all nodes expanded.\n   * With `false` all nodes will be collapsed.\n   *\n   * By default it expands the needed nodes to display the current selection, if any.\n   */\n  defaultExpanded?: string[] | boolean;\n  /**\n   * Callback fired when tree items are expanded/collapsed.\n   *\n   * @param {object} event The event source of the callback.\n   * @param {array} nodeIds The ids of the expanded nodes (old and new).\n   */\n  onToggle?: (event, nodeIds) => void;\n  /**\n   * An array containing the data for each menu item.\n   *\n   * id - the id to be applied to the root element.\n   * label - the label to be rendered on the menu item.\n   * data - sub-menu items\n   * href - the url used for navigation.\n   * target - the behavior when opening an url.\n   */\n  data?: NavigationData[];\n  /** Aria label to apply to the navigate to submenu button on the navigation slider list items. */\n  sliderForwardButtonAriaLabel?: string;\n}\n\nconst createListHierarchy = (\n  items,\n  id,\n  classes?: HvVerticalNavigationTreeClasses,\n  mouseEnterHandler?: (event, item) => void,\n  disableTooltip = false\n) =>\n  items.map((item) => {\n    const {\n      id: itemId,\n      label: itemLabel,\n      icon,\n      data: children,\n      selectable,\n      disabled,\n      href,\n      target,\n    } = item;\n\n    const ItemText = wrapperTooltip(true, itemLabel, itemLabel);\n\n    const itemMouseEnterHandler = (event) => {\n      mouseEnterHandler?.(event, item);\n    };\n\n    return (\n      <HvVerticalNavigationTreeViewItem\n        id={setId(id, itemId)}\n        className={classes?.listItem}\n        href={href}\n        target={target}\n        key={itemId}\n        nodeId={itemId}\n        label={<ItemText />}\n        icon={icon}\n        payload={item}\n        selectable={selectable}\n        disabled={disabled}\n        onMouseEnter={itemMouseEnterHandler}\n        disableTooltip={disableTooltip}\n      >\n        {children\n          ? createListHierarchy(\n              children,\n              id,\n              classes,\n              mouseEnterHandler,\n              disableTooltip\n            )\n          : undefined}\n      </HvVerticalNavigationTreeViewItem>\n    );\n  });\n\nconst getAllParents = (items) => {\n  const parents = items.filter(\n    (item) => item.data != null && item.data.length > 0\n  );\n  const childParents = parents.flatMap((item) => getAllParents(item.data));\n\n  return [...parents, ...childParents];\n};\n\nfunction pathToElement(data, targetId) {\n  const path: string[] = [];\n\n  if (data != null && data.length > 0) {\n    for (let i = 0; i !== data.length; ++i) {\n      const item = data[i];\n      if (item.id === targetId) {\n        path.push(item.id);\n        break;\n      }\n\n      const subPaths = pathToElement(item.data, targetId);\n      if (subPaths.length > 0) {\n        path.push(item.id);\n        path.push(...subPaths);\n        break;\n      }\n    }\n  }\n\n  return path;\n}\n\nexport const HvVerticalNavigationTree = ({\n  id,\n\n  className,\n  classes: classesProp,\n\n  data,\n\n  mode = \"navigation\",\n\n  collapsible = false,\n  expanded: expandedProp,\n  defaultExpanded,\n  onToggle,\n\n  selected: selectedProp,\n  defaultSelected,\n  onChange,\n\n  sliderForwardButtonAriaLabel = \"Navigate to submenu\",\n\n  ...others\n}: HvVerticalNavigationTreeProps) => {\n  const { classes, cx } = useClasses(classesProp);\n\n  const [selected, setSelected] = useControlled(selectedProp, defaultSelected);\n  const [expanded, setExpanded] = useControlled(expandedProp, () => {\n    if (defaultExpanded === true) {\n      // all parent nodes will be expanded by default\n      return getAllParents(data).map((item) => item.id);\n    }\n\n    if (defaultExpanded === false) {\n      // all parent nodes will be collapsed by default\n      return [];\n    }\n\n    if (defaultExpanded == null) {\n      if (selected != null) {\n        // the path to the selected node will be expanded (default behaviour)\n        const path = pathToElement(data, selected);\n        return path.slice(0, -1);\n      }\n\n      // nothing is expanded\n      return [];\n    }\n\n    return defaultExpanded;\n  });\n\n  const {\n    isOpen,\n    useIcons,\n    slider,\n\n    parentItem,\n    setParentItem,\n    withParentData,\n    navigateToChildHandler,\n\n    setParentData,\n    setParentSelected,\n  } = useContext(VerticalNavigationContext);\n\n  const [navigationPopup, setNavigationPopup] = useState<{\n    // This value is needed to guarantee that the NavigationPopup is fully re-rendered with keeping any previous values\n    uniqueKey: string;\n    anchorEl: HTMLButtonElement | null;\n    fixedMode: boolean;\n    data: NavigationData[];\n  } | null>(null);\n\n  const handleChange = useCallback(\n    (event, selectedId, selectedItem) => {\n      if (useIcons && !isOpen && selectedItem.data) {\n        const currentEventTarget = event.currentTarget;\n        setNavigationPopup((prevState) => {\n          // We want to close the popup in case the clicked element is the same as the previous one\n          return prevState?.anchorEl === currentEventTarget\n            ? null\n            : {\n                uniqueKey: uniqueId(),\n                anchorEl: currentEventTarget,\n                fixedMode: true,\n                data: selectedItem.data,\n              };\n        });\n\n        // We need this stopPropagation or else the Popup will close due to the clickaway being triggered\n        event.stopPropagation();\n      } else {\n        setSelected(selectedId);\n        setExpanded((prevState) => {\n          if (!isOpen) {\n            return [...prevState, ...pathToElement(data, selectedId)];\n          }\n          return [...prevState];\n        });\n        setNavigationPopup(null);\n        if (onChange) {\n          onChange(event, selectedItem);\n        }\n      }\n    },\n    [onChange, setSelected, setExpanded, isOpen, useIcons, data]\n  );\n\n  const treeViewItemMouseEnterHandler = useCallback(\n    (event, item) => {\n      const isCollapsed = useIcons && !isOpen;\n\n      if (isCollapsed && item.data && !navigationPopup?.fixedMode) {\n        const currentEventTarget = event.currentTarget;\n\n        setNavigationPopup?.({\n          uniqueKey: uniqueId(),\n          anchorEl: currentEventTarget,\n          fixedMode: false,\n          data: item.data,\n        });\n      } else if (isCollapsed && !item.data && !navigationPopup?.fixedMode) {\n        setNavigationPopup(null);\n      }\n    },\n    [isOpen, useIcons, navigationPopup]\n  );\n\n  const handleToggle = useCallback(\n    (event, newExpanded) => {\n      setExpanded(newExpanded);\n\n      if (onToggle) {\n        onToggle(event, newExpanded);\n      }\n    },\n    [onToggle, setExpanded]\n  );\n\n  const children = useMemo(\n    () =>\n      data &&\n      createListHierarchy(\n        data,\n        id,\n        classes,\n        treeViewItemMouseEnterHandler,\n        navigationPopup?.fixedMode\n      ),\n    [classes, data, id, navigationPopup, treeViewItemMouseEnterHandler]\n  );\n\n  useEffect(() => {\n    if (!isOpen) {\n      setNavigationPopup?.(null);\n    }\n  }, [isOpen]);\n\n  useEffect(() => {\n    if (setParentSelected) setParentSelected(selected);\n  }, [selected, setSelected, setParentSelected]);\n\n  useEffect(() => {\n    if (setParentData) setParentData(data);\n  }, [data, setParentData]);\n\n  useEffect(() => {\n    if (\n      withParentData &&\n      selected &&\n      setParentItem &&\n      getParentItemById(withParentData, selected)\n    ) {\n      setParentItem(getParentItemById(withParentData, selected));\n    }\n  }, [withParentData, selected, setParentItem]);\n\n  // navigation slider\n  const navigateToTargetHandler = (event, selectedItem) => {\n    handleChange(event, selectedItem.id, selectedItem);\n  };\n\n  const handleNavigationPopupClose = () => {\n    setNavigationPopup(null);\n  };\n\n  const handleStyledNavMouseLeave = () => {\n    if (useIcons && !isOpen && !navigationPopup?.fixedMode) {\n      setNavigationPopup(null);\n    }\n  };\n\n  const handleNavigationPopupMouseLeave = () => {\n    if (!navigationPopup?.fixedMode) {\n      handleNavigationPopupClose();\n    }\n  };\n\n  const handleNavigationPopupChange = (event, selectedItem) => {\n    handleChange(event, selectedItem.id, selectedItem);\n  };\n\n  return (\n    <nav\n      id={id}\n      className={cx(\n        classes.root,\n        { [classes.collapsed]: !isOpen && !useIcons },\n        className\n      )}\n      onMouseLeave={handleStyledNavMouseLeave}\n      {...others}\n    >\n      {slider ? (\n        <HvVerticalNavigationSlider\n          data={parentItem.data || withParentData}\n          selected={selected}\n          onNavigateToTarget={navigateToTargetHandler}\n          onNavigateToChild={navigateToChildHandler}\n          forwardButtonAriaLabel={sliderForwardButtonAriaLabel}\n        />\n      ) : (\n        <HvVerticalNavigationTreeView\n          id={setId(id, \"tree\")}\n          className={classes.list}\n          selectable\n          mode={mode}\n          collapsible={collapsible}\n          selected={selected}\n          onChange={handleChange}\n          expanded={expanded}\n          onToggle={handleToggle}\n        >\n          {useIcons && !isOpen && navigationPopup && (\n            <NavigationPopupContainer\n              anchorEl={navigationPopup.anchorEl}\n              onClose={handleNavigationPopupClose}\n              key={navigationPopup.uniqueKey}\n              className={classes.navigationPopup}\n            >\n              <HvVerticalNavigationTree\n                className={classes.popup}\n                id={setId(id, \"navigation-popup-tree\")}\n                collapsible\n                defaultExpanded\n                selected={selected}\n                data={navigationPopup.data}\n                onChange={handleNavigationPopupChange}\n                onMouseLeave={handleNavigationPopupMouseLeave}\n              />\n            </NavigationPopupContainer>\n          )}\n          {children}\n        </HvVerticalNavigationTreeView>\n      )}\n    </nav>\n  );\n};\n"],"names":["createListHierarchy","items","id","classes","mouseEnterHandler","disableTooltip","map","item","itemId","label","itemLabel","icon","data","children","selectable","disabled","href","target","ItemText","wrapperTooltip","itemMouseEnterHandler","event","setId","listItem","undefined","getAllParents","parents","filter","length","childParents","flatMap","pathToElement","targetId","path","i","push","subPaths","HvVerticalNavigationTree","className","classesProp","mode","collapsible","expanded","expandedProp","defaultExpanded","onToggle","selected","selectedProp","defaultSelected","onChange","sliderForwardButtonAriaLabel","others","cx","useClasses","setSelected","useControlled","setExpanded","slice","isOpen","useIcons","slider","parentItem","setParentItem","withParentData","navigateToChildHandler","setParentData","setParentSelected","useContext","VerticalNavigationContext","navigationPopup","setNavigationPopup","useState","handleChange","useCallback","selectedId","selectedItem","currentEventTarget","currentTarget","prevState","anchorEl","uniqueKey","uniqueId","fixedMode","stopPropagation","treeViewItemMouseEnterHandler","isCollapsed","handleToggle","newExpanded","useMemo","useEffect","getParentItemById","navigateToTargetHandler","handleNavigationPopupClose","handleStyledNavMouseLeave","handleNavigationPopupMouseLeave","handleNavigationPopupChange","root","collapsed","list","popup"],"mappings":"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"}