@hitachivantara/uikit-react-core 5.67.1 → 5.68.0

package/dist/esm/TreeView/TreeItem/TreeItem.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"TreeItem.styles.js","sources":["../../../../src/TreeView/TreeItem/TreeItem.styles.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../../utils/classes\";\nimport { outlineStyles } from \"../../utils/focusUtils\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvTreeItem\", {\n  /** Applied to the root element */\n  root: {\n    listStyle: \"none\",\n    margin: 0,\n    padding: 0,\n    outline: 0,\n  },\n  group: {\n    margin: 0,\n    padding: 0,\n    marginLeft: theme.space.sm,\n  },\n\n  content: {\n    padding: theme.spacing(0, 1),\n    minHeight: 32, // TODO: review\n\n    width: \"100%\",\n    boxSizing: \"border-box\", // prevent width + padding to overflow\n    display: \"flex\",\n    alignItems: \"center\",\n    cursor: \"pointer\",\n    WebkitTapHighlightColor: \"transparent\",\n    \"&:hover:not($disabled)\": {\n      backgroundColor: theme.colors.containerBackgroundHover,\n    },\n  },\n  expanded: {},\n  selected: {\n    backgroundColor: theme.colors.atmo3,\n  },\n  focused: {\n    backgroundColor: theme.colors.containerBackgroundHover,\n    \"&:focus-visible\": {\n      ...outlineStyles,\n    },\n  },\n  disabled: {\n    cursor: \"not-allowed\",\n    color: theme.colors.secondary_60,\n    \"& $label\": {\n      color: theme.colors.secondary_60,\n    },\n  },\n  label: {\n    paddingLeft: 4,\n    width: \"100%\",\n    boxSizing: \"border-box\",\n\n    // fixes overflow\n    minWidth: 0,\n    position: \"relative\",\n    ...theme.typography.body,\n  },\n  iconContainer: {\n    display: \"flex\",\n    flexShrink: 0,\n    justifyContent: \"center\",\n\n    marginRight: 4,\n    width: theme.space.sm,\n    \":empty\": {\n      width: theme.space.xs,\n    },\n  },\n});\n"],"names":[],"mappings":";;;AAKO,MAAM,EAAE,eAAe,eAAe,cAAc,cAAc;AAAA;AAAA,EAEvE,MAAM;AAAA,IACJ,WAAW;AAAA,IACX,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,SAAS;AAAA,EACX;AAAA,EACA,OAAO;AAAA,IACL,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,YAAY,MAAM,MAAM;AAAA,EAC1B;AAAA,EAEA,SAAS;AAAA,IACP,SAAS,MAAM,QAAQ,GAAG,CAAC;AAAA,IAC3B,WAAW;AAAA;AAAA,IAEX,OAAO;AAAA,IACP,WAAW;AAAA;AAAA,IACX,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,yBAAyB;AAAA,IACzB,0BAA0B;AAAA,MACxB,iBAAiB,MAAM,OAAO;AAAA,IAChC;AAAA,EACF;AAAA,EACA,UAAU,CAAC;AAAA,EACX,UAAU;AAAA,IACR,iBAAiB,MAAM,OAAO;AAAA,EAChC;AAAA,EACA,SAAS;AAAA,IACP,iBAAiB,MAAM,OAAO;AAAA,IAC9B,mBAAmB;AAAA,MACjB,GAAG;AAAA,IACL;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,MAAM,OAAO;AAAA,IACpB,YAAY;AAAA,MACV,OAAO,MAAM,OAAO;AAAA,IACtB;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL,aAAa;AAAA,IACb,OAAO;AAAA,IACP,WAAW;AAAA;AAAA,IAGX,UAAU;AAAA,IACV,UAAU;AAAA,IACV,GAAG,MAAM,WAAW;AAAA,EACtB;AAAA,EACA,eAAe;AAAA,IACb,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAEhB,aAAa;AAAA,IACb,OAAO,MAAM,MAAM;AAAA,IACnB,UAAU;AAAA,MACR,OAAO,MAAM,MAAM;AAAA,IACrB;AAAA,EACF;AACF,CAAC;"}
+{"version":3,"file":"TreeItem.styles.js","sources":["../../../../src/TreeView/TreeItem/TreeItem.styles.ts"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"../../utils/focusUtils\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvTreeItem\", {\n  /** Applied to the root element */\n  root: {\n    listStyle: \"none\",\n    margin: 0,\n    padding: 0,\n    outline: 0,\n  },\n  group: {\n    margin: 0,\n    padding: 0,\n    marginLeft: theme.space.sm,\n  },\n\n  content: {\n    padding: theme.spacing(0, 1),\n    minHeight: 32, // TODO: review\n\n    width: \"100%\",\n    boxSizing: \"border-box\", // prevent width + padding to overflow\n    display: \"flex\",\n    alignItems: \"center\",\n    cursor: \"pointer\",\n    WebkitTapHighlightColor: \"transparent\",\n    \"&:hover:not($disabled)\": {\n      backgroundColor: theme.colors.containerBackgroundHover,\n    },\n  },\n  expanded: {},\n  selected: {\n    backgroundColor: theme.colors.atmo3,\n  },\n  focused: {\n    backgroundColor: theme.colors.containerBackgroundHover,\n    \"&:focus-visible\": {\n      ...outlineStyles,\n    },\n  },\n  disabled: {\n    cursor: \"not-allowed\",\n    color: theme.colors.secondary_60,\n    \"& $label\": {\n      color: theme.colors.secondary_60,\n    },\n  },\n  label: {\n    paddingLeft: 4,\n    width: \"100%\",\n    boxSizing: \"border-box\",\n\n    // fixes overflow\n    minWidth: 0,\n    position: \"relative\",\n    ...theme.typography.body,\n  },\n  iconContainer: {\n    display: \"flex\",\n    flexShrink: 0,\n    justifyContent: \"center\",\n\n    marginRight: 4,\n    width: theme.space.sm,\n    \":empty\": {\n      width: theme.space.xs,\n    },\n  },\n});\n"],"names":[],"mappings":";;;AAKO,MAAM,EAAE,eAAe,eAAe,cAAc,cAAc;AAAA;AAAA,EAEvE,MAAM;AAAA,IACJ,WAAW;AAAA,IACX,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,SAAS;AAAA,EACX;AAAA,EACA,OAAO;AAAA,IACL,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,YAAY,MAAM,MAAM;AAAA,EAC1B;AAAA,EAEA,SAAS;AAAA,IACP,SAAS,MAAM,QAAQ,GAAG,CAAC;AAAA,IAC3B,WAAW;AAAA;AAAA,IAEX,OAAO;AAAA,IACP,WAAW;AAAA;AAAA,IACX,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,yBAAyB;AAAA,IACzB,0BAA0B;AAAA,MACxB,iBAAiB,MAAM,OAAO;AAAA,IAChC;AAAA,EACF;AAAA,EACA,UAAU,CAAC;AAAA,EACX,UAAU;AAAA,IACR,iBAAiB,MAAM,OAAO;AAAA,EAChC;AAAA,EACA,SAAS;AAAA,IACP,iBAAiB,MAAM,OAAO;AAAA,IAC9B,mBAAmB;AAAA,MACjB,GAAG;AAAA,IACL;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,QAAQ;AAAA,IACR,OAAO,MAAM,OAAO;AAAA,IACpB,YAAY;AAAA,MACV,OAAO,MAAM,OAAO;AAAA,IACtB;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL,aAAa;AAAA,IACb,OAAO;AAAA,IACP,WAAW;AAAA;AAAA,IAGX,UAAU;AAAA,IACV,UAAU;AAAA,IACV,GAAG,MAAM,WAAW;AAAA,EACtB;AAAA,EACA,eAAe;AAAA,IACb,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAEhB,aAAa;AAAA,IACb,OAAO,MAAM,MAAM;AAAA,IACnB,UAAU;AAAA,MACR,OAAO,MAAM,MAAM;AAAA,IACrB;AAAA,EACF;AACF,CAAC;"}

package/dist/esm/TreeView/TreeView.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { useSlotProps } from "@mui/base/utils";
 import { DropDownXS, DropRightXS } from "@hitachivantara/uikit-react-icons";
-import { useDefaultProps } from "../hooks/useDefaultProps.js";
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import { fixedForwardRef } from "../types/generic.js";
 import { useTreeView } from "./internals/hooks/useTreeView.js";
 import { TreeViewProvider } from "./internals/TreeViewProvider.js";

package/dist/esm/TreeView/TreeView.js.map

@@ -1 +1 @@
-{"version":3,"file":"TreeView.js","sources":["../../../src/TreeView/TreeView.tsx"],"sourcesContent":["import { useSlotProps } from \"@mui/base/utils\";\nimport { DropDownXS, DropRightXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { fixedForwardRef, HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport {\n  DEFAULT_TREE_VIEW_PLUGINS,\n  DefaultTreeViewPluginParameters,\n} from \"./internals/hooks/plugins\";\nimport { useTreeView } from \"./internals/hooks/useTreeView\";\nimport { TreeViewProvider } from \"./internals/TreeViewProvider\";\nimport { staticClasses, useClasses } from \"./TreeView.styles\";\n\nexport { staticClasses as treeView2Classes }; // TODO: remove old `treeViewClasses`\n\nexport type HvTreeViewClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTreeViewProps<Multiple extends boolean | undefined>\n  extends HvBaseProps<HTMLUListElement>,\n    DefaultTreeViewPluginParameters<Multiple> {\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvTreeViewClasses;\n  /** Tree View children. Usually a `HvTreeItem` instance, or a custom variation of it */\n  children?: React.ReactNode;\n}\n\n/**\n * A Tree View displays hierarchical structures.\n * It also facilitates the exploration of categorical levels and their content.\n *\n * Tree structures are built through composing the `HvTreeItem` component,\n * or a custom variation of it.\n *\n * It is based on MUI's [TreeView](https://mui.com/x/react-tree-view) component.\n *\n * @example\n * ```tsx\n * <HvTreeView>\n *   <HvTreeItem nodeId=\"1\" label=\"File1\" />\n * </HvTreeView>\n * ```\n */\nexport const HvTreeView = fixedForwardRef(function HvTreeView<\n  Multiple extends boolean | undefined,\n>(props: HvTreeViewProps<Multiple>, ref: React.Ref<HTMLUListElement>) {\n  const {\n    id,\n    children,\n    classes: classesProp,\n    className,\n\n    disabledItemsFocusable,\n    multiSelect,\n    expanded,\n    defaultExpanded,\n    selected,\n    defaultSelected,\n    disableSelection,\n    defaultCollapseIcon = <DropDownXS />,\n    defaultExpandIcon = <DropRightXS />,\n    defaultEndIcon,\n    defaultParentIcon,\n    onNodeSelect,\n    onNodeToggle,\n    onNodeFocus,\n    ...others\n  } = useDefaultProps(\"HvTreeView\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  const { getRootProps, contextValue } = useTreeView({\n    disabledItemsFocusable,\n    expanded,\n    defaultExpanded,\n    onNodeToggle,\n    onNodeFocus,\n    disableSelection,\n    defaultSelected,\n    selected,\n    multiSelect,\n    onNodeSelect: onNodeSelect as HvTreeViewProps<any>[\"onNodeSelect\"],\n    id,\n    defaultCollapseIcon,\n    defaultEndIcon,\n    defaultExpandIcon,\n    defaultParentIcon,\n    plugins: DEFAULT_TREE_VIEW_PLUGINS,\n    rootRef: ref,\n  });\n\n  const rootProps = useSlotProps({\n    elementType: \"ul\",\n    externalSlotProps: {},\n    externalForwardedProps: others,\n    className: classes.root,\n    getSlotProps: getRootProps,\n    ownerState: props,\n  });\n\n  return (\n    <TreeViewProvider value={contextValue}>\n      <ul className={cx(classes.root, className)} {...rootProps} {...others}>\n        {children}\n      </ul>\n    </TreeViewProvider>\n  );\n});\n"],"names":["HvTreeView"],"mappings":";;;;;;;;;;AA2CO,MAAM,aAAa,gBAAgB,SAASA,YAEjD,OAAkC,KAAkC;AAC9D,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,0CAAuB,YAAW,EAAA;AAAA,IAClC,wCAAqB,aAAY,EAAA;AAAA,IACjC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,cAAc,KAAK;AACvC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,QAAM,EAAE,cAAc,aAAa,IAAI,YAAY;AAAA,IACjD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT,SAAS;AAAA,EAAA,CACV;AAED,QAAM,YAAY,aAAa;AAAA,IAC7B,aAAa;AAAA,IACb,mBAAmB,CAAC;AAAA,IACpB,wBAAwB;AAAA,IACxB,WAAW,QAAQ;AAAA,IACnB,cAAc;AAAA,IACd,YAAY;AAAA,EAAA,CACb;AAED,6BACG,kBAAiB,EAAA,OAAO,cACvB,UAAA,oBAAC,QAAG,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,WAAY,GAAG,QAC5D,UACH,EACF,CAAA;AAEJ,CAAC;"}
+{"version":3,"file":"TreeView.js","sources":["../../../src/TreeView/TreeView.tsx"],"sourcesContent":["import { useSlotProps } from \"@mui/base/utils\";\nimport { DropDownXS, DropRightXS } from \"@hitachivantara/uikit-react-icons\";\nimport {\n  useDefaultProps,\n  type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\n\nimport { fixedForwardRef, HvBaseProps } from \"../types/generic\";\nimport {\n  DEFAULT_TREE_VIEW_PLUGINS,\n  DefaultTreeViewPluginParameters,\n} from \"./internals/hooks/plugins\";\nimport { useTreeView } from \"./internals/hooks/useTreeView\";\nimport { TreeViewProvider } from \"./internals/TreeViewProvider\";\nimport { staticClasses, useClasses } from \"./TreeView.styles\";\n\nexport { staticClasses as treeView2Classes }; // TODO: remove old `treeViewClasses`\n\nexport type HvTreeViewClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTreeViewProps<Multiple extends boolean | undefined>\n  extends HvBaseProps<HTMLUListElement>,\n    DefaultTreeViewPluginParameters<Multiple> {\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvTreeViewClasses;\n  /** Tree View children. Usually a `HvTreeItem` instance, or a custom variation of it */\n  children?: React.ReactNode;\n}\n\n/**\n * A Tree View displays hierarchical structures.\n * It also facilitates the exploration of categorical levels and their content.\n *\n * Tree structures are built through composing the `HvTreeItem` component,\n * or a custom variation of it.\n *\n * It is based on MUI's [TreeView](https://mui.com/x/react-tree-view) component.\n *\n * @example\n * ```tsx\n * <HvTreeView>\n *   <HvTreeItem nodeId=\"1\" label=\"File1\" />\n * </HvTreeView>\n * ```\n */\nexport const HvTreeView = fixedForwardRef(function HvTreeView<\n  Multiple extends boolean | undefined,\n>(props: HvTreeViewProps<Multiple>, ref: React.Ref<HTMLUListElement>) {\n  const {\n    id,\n    children,\n    classes: classesProp,\n    className,\n\n    disabledItemsFocusable,\n    multiSelect,\n    expanded,\n    defaultExpanded,\n    selected,\n    defaultSelected,\n    disableSelection,\n    defaultCollapseIcon = <DropDownXS />,\n    defaultExpandIcon = <DropRightXS />,\n    defaultEndIcon,\n    defaultParentIcon,\n    onNodeSelect,\n    onNodeToggle,\n    onNodeFocus,\n    ...others\n  } = useDefaultProps(\"HvTreeView\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  const { getRootProps, contextValue } = useTreeView({\n    disabledItemsFocusable,\n    expanded,\n    defaultExpanded,\n    onNodeToggle,\n    onNodeFocus,\n    disableSelection,\n    defaultSelected,\n    selected,\n    multiSelect,\n    onNodeSelect: onNodeSelect as HvTreeViewProps<any>[\"onNodeSelect\"],\n    id,\n    defaultCollapseIcon,\n    defaultEndIcon,\n    defaultExpandIcon,\n    defaultParentIcon,\n    plugins: DEFAULT_TREE_VIEW_PLUGINS,\n    rootRef: ref,\n  });\n\n  const rootProps = useSlotProps({\n    elementType: \"ul\",\n    externalSlotProps: {},\n    externalForwardedProps: others,\n    className: classes.root,\n    getSlotProps: getRootProps,\n    ownerState: props,\n  });\n\n  return (\n    <TreeViewProvider value={contextValue}>\n      <ul className={cx(classes.root, className)} {...rootProps} {...others}>\n        {children}\n      </ul>\n    </TreeViewProvider>\n  );\n});\n"],"names":["HvTreeView"],"mappings":";;;;;;;;;;AA6CO,MAAM,aAAa,gBAAgB,SAASA,YAEjD,OAAkC,KAAkC;AAC9D,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,0CAAuB,YAAW,EAAA;AAAA,IAClC,wCAAqB,aAAY,EAAA;AAAA,IACjC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,cAAc,KAAK;AACvC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,QAAM,EAAE,cAAc,aAAa,IAAI,YAAY;AAAA,IACjD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT,SAAS;AAAA,EAAA,CACV;AAED,QAAM,YAAY,aAAa;AAAA,IAC7B,aAAa;AAAA,IACb,mBAAmB,CAAC;AAAA,IACpB,wBAAwB;AAAA,IACxB,WAAW,QAAQ;AAAA,IACnB,cAAc;AAAA,IACd,YAAY;AAAA,EAAA,CACb;AAED,6BACG,kBAAiB,EAAA,OAAO,cACvB,UAAA,oBAAC,QAAG,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,WAAY,GAAG,QAC5D,UACH,EACF,CAAA;AAEJ,CAAC;"}

package/dist/esm/TreeView/TreeView.styles.js

@@ -1,4 +1,4 @@
-import { createClasses } from "@hitachivantara/uikit-react-shared";
+import { createClasses } from "@hitachivantara/uikit-react-utils";
 const { staticClasses, useClasses } = createClasses("HvTreeView", {
   /** Applied to the root element */
   root: {

package/dist/esm/TreeView/TreeView.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"TreeView.styles.js","sources":["../../../src/TreeView/TreeView.styles.ts"],"sourcesContent":["import { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvTreeView\", {\n  /** Applied to the root element */\n  root: {\n    padding: 0,\n    margin: 0,\n    listStyle: \"none\",\n    outline: \"none\",\n  },\n});\n"],"names":[],"mappings":";AAEO,MAAM,EAAE,eAAe,eAAe,cAAc,cAAc;AAAA;AAAA,EAEvE,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,SAAS;AAAA,EACX;AACF,CAAC;"}
+{"version":3,"file":"TreeView.styles.js","sources":["../../../src/TreeView/TreeView.styles.ts"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvTreeView\", {\n  /** Applied to the root element */\n  root: {\n    padding: 0,\n    margin: 0,\n    listStyle: \"none\",\n    outline: \"none\",\n  },\n});\n"],"names":[],"mappings":";AAEO,MAAM,EAAE,eAAe,eAAe,cAAc,cAAc;AAAA;AAAA,EAEvE,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,SAAS;AAAA,EACX;AACF,CAAC;"}

package/dist/esm/Typography/Typography.js

@@ -1,6 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { useTheme } from "@hitachivantara/uikit-react-shared";
-import { useDefaultProps } from "../hooks/useDefaultProps.js";
+import { useDefaultProps, useTheme } from "@hitachivantara/uikit-react-utils";
 import { fixedForwardRef } from "../types/generic.js";
 import { useClasses } from "./Typography.styles.js";
 import { staticClasses } from "./Typography.styles.js";

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

@@ -1 +1 @@
-{"version":3,"file":"Typography.js","sources":["../../../src/Typography/Typography.tsx"],"sourcesContent":["import { useTheme } from \"@hitachivantara/uikit-react-shared\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport {\n  fixedForwardRef,\n  PolymorphicComponentRef,\n  PolymorphicRef,\n} from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { staticClasses, useClasses } from \"./Typography.styles\";\nimport {\n  HvTypographyLegacyVariants,\n  HvTypographyVariants,\n  mapVariant,\n} from \"./utils\";\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  captionLabel: \"p\",\n  caption1: \"p\",\n  caption2: \"p\",\n  // LEGACY\n  \"5xlTitle\": \"h1\",\n  \"4xlTitle\": \"h1\",\n  \"3xlTitle\": \"h1\",\n  xxlTitle: \"h1\",\n  xlTitle: \"h1\",\n  lTitle: \"h2\",\n  mTitle: \"h3\",\n  sTitle: \"h4\",\n  xsTitle: \"h5\",\n  xxsTitle: \"h6\",\n  sectionTitle: \"p\",\n  highlightText: \"p\",\n  normalText: \"p\",\n  placeholderText: \"p\",\n  link: \"p\",\n  disabledText: \"p\",\n  selectedNavText: \"p\",\n  vizText: \"p\",\n  vizTextDisabled: \"p\",\n  xsInlineLink: \"p\",\n} satisfies Record<\n  HvTypographyVariants | HvTypographyLegacyVariants,\n  React.ElementType\n>;\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      /**\n       * If `true`, the typography will render a \"p\" element\n       * @deprecated use `component=\"p\"` instead\n       * */\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 = fixedForwardRef(function HvTypography<\n  C extends React.ElementType = \"p\",\n>(props: HvTypographyProps<C>, ref: PolymorphicRef<C>) {\n  const {\n    className,\n    component: ComponentProp,\n    classes: classesProp,\n    variant: variantProp = \"body\",\n    link = false,\n    noWrap = false,\n    paragraph = false,\n    disabled = 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      disabled={disabled}\n      {...others}\n    />\n  );\n});\n"],"names":["HvTypography"],"mappings":";;;;;;;AAoBA,MAAM,kBAAkB;AAAA,EACtB,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,OAAO;AAAA,EACP,cAAc;AAAA,EACd,UAAU;AAAA,EACV,UAAU;AAAA;AAAA,EAEV,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,UAAU;AAAA,EACV,cAAc;AAAA,EACd,eAAe;AAAA,EACf,YAAY;AAAA,EACZ,iBAAiB;AAAA,EACjB,MAAM;AAAA,EACN,cAAc;AAAA,EACd,iBAAiB;AAAA,EACjB,SAAS;AAAA,EACT,iBAAiB;AAAA,EACjB,cAAc;AAChB;AAmCO,MAAM,eAAe,gBAAgB,SAASA,cAEnD,OAA6B,KAAwB;AAC/C,QAAA;AAAA,IACJ;AAAA,IACA,WAAW;AAAA,IACX,SAAS;AAAA,IACT,SAAS,cAAc;AAAA,IACvB,OAAO;AAAA,IACP,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,GAAG;AAAA,EAAA,IACD,gBAAgB,gBAAgB,KAAK;AACzC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AACxC,QAAA,EAAE,gBAAgB;AAExB,QAAM,UAAU,WAAW,aAAa,aAAa,IAAI;AAEzD,QAAM,YACJ,iBAAkB,aAAa,OAAQ,gBAAgB,OAAO,KAAK;AAGnE,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT,QAAQ;AAAA,QACR,QAAQ,OAAO;AAAA,QACf;AAAA,UACE,CAAC,QAAQ,MAAM,GAAG;AAAA,UAClB,CAAC,QAAQ,MAAM,GAAG;AAAA,UAClB,CAAC,QAAQ,QAAQ,GAAG;AAAA,QACtB;AAAA,QACA;AAAA,MACF;AAAA,MACA;AAAA,MACC,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC;"}
+{"version":3,"file":"Typography.js","sources":["../../../src/Typography/Typography.tsx"],"sourcesContent":["import {\n  useDefaultProps,\n  useTheme,\n  type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\n\nimport {\n  fixedForwardRef,\n  PolymorphicComponentRef,\n  PolymorphicRef,\n} from \"../types/generic\";\nimport { staticClasses, useClasses } from \"./Typography.styles\";\nimport {\n  HvTypographyLegacyVariants,\n  HvTypographyVariants,\n  mapVariant,\n} from \"./utils\";\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  captionLabel: \"p\",\n  caption1: \"p\",\n  caption2: \"p\",\n  // LEGACY\n  \"5xlTitle\": \"h1\",\n  \"4xlTitle\": \"h1\",\n  \"3xlTitle\": \"h1\",\n  xxlTitle: \"h1\",\n  xlTitle: \"h1\",\n  lTitle: \"h2\",\n  mTitle: \"h3\",\n  sTitle: \"h4\",\n  xsTitle: \"h5\",\n  xxsTitle: \"h6\",\n  sectionTitle: \"p\",\n  highlightText: \"p\",\n  normalText: \"p\",\n  placeholderText: \"p\",\n  link: \"p\",\n  disabledText: \"p\",\n  selectedNavText: \"p\",\n  vizText: \"p\",\n  vizTextDisabled: \"p\",\n  xsInlineLink: \"p\",\n} satisfies Record<\n  HvTypographyVariants | HvTypographyLegacyVariants,\n  React.ElementType\n>;\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      /**\n       * If `true`, the typography will render a \"p\" element\n       * @deprecated use `component=\"p\"` instead\n       * */\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 = fixedForwardRef(function HvTypography<\n  C extends React.ElementType = \"p\",\n>(props: HvTypographyProps<C>, ref: PolymorphicRef<C>) {\n  const {\n    className,\n    component: ComponentProp,\n    classes: classesProp,\n    variant: variantProp = \"body\",\n    link = false,\n    noWrap = false,\n    paragraph = false,\n    disabled = 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      disabled={disabled}\n      {...others}\n    />\n  );\n});\n"],"names":["HvTypography"],"mappings":";;;;;;AAsBA,MAAM,kBAAkB;AAAA,EACtB,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,OAAO;AAAA,EACP,cAAc;AAAA,EACd,UAAU;AAAA,EACV,UAAU;AAAA;AAAA,EAEV,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,UAAU;AAAA,EACV,cAAc;AAAA,EACd,eAAe;AAAA,EACf,YAAY;AAAA,EACZ,iBAAiB;AAAA,EACjB,MAAM;AAAA,EACN,cAAc;AAAA,EACd,iBAAiB;AAAA,EACjB,SAAS;AAAA,EACT,iBAAiB;AAAA,EACjB,cAAc;AAChB;AAmCO,MAAM,eAAe,gBAAgB,SAASA,cAEnD,OAA6B,KAAwB;AAC/C,QAAA;AAAA,IACJ;AAAA,IACA,WAAW;AAAA,IACX,SAAS;AAAA,IACT,SAAS,cAAc;AAAA,IACvB,OAAO;AAAA,IACP,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,GAAG;AAAA,EAAA,IACD,gBAAgB,gBAAgB,KAAK;AACzC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AACxC,QAAA,EAAE,gBAAgB;AAExB,QAAM,UAAU,WAAW,aAAa,aAAa,IAAI;AAEzD,QAAM,YACJ,iBAAkB,aAAa,OAAQ,gBAAgB,OAAO,KAAK;AAGnE,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT,QAAQ;AAAA,QACR,QAAQ,OAAO;AAAA,QACf;AAAA,UACE,CAAC,QAAQ,MAAM,GAAG;AAAA,UAClB,CAAC,QAAQ,MAAM,GAAG;AAAA,UAClB,CAAC,QAAQ,QAAQ,GAAG;AAAA,QACtB;AAAA,QACA;AAAA,MACF;AAAA,MACA;AAAA,MACC,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC;"}

package/dist/esm/Typography/Typography.styles.js

@@ -1,5 +1,5 @@
+import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-import { createClasses } from "@hitachivantara/uikit-react-shared";
 const { useClasses, staticClasses } = createClasses("HvTypography", {
   root: {
     fontFamily: theme.fontFamily.body

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

@@ -1 +1 @@
-{"version":3,"file":"Typography.styles.js","sources":["../../../src/Typography/Typography.styles.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\n\nexport const { useClasses, staticClasses } = createClasses(\"HvTypography\", {\n  root: {\n    fontFamily: theme.fontFamily.body,\n  },\n  disabled: {\n    color: theme.colors.secondary_60,\n  },\n  isLink: {\n    cursor: \"pointer\",\n    color: theme.colors.primary,\n    textDecoration: \"underline\",\n  },\n  noWrap: {\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    whiteSpace: \"nowrap\",\n  },\n  // variants\n  display: { ...theme.typography.display },\n  title1: { ...theme.typography.title1 },\n  title2: { ...theme.typography.title2 },\n  title3: { ...theme.typography.title3 },\n  title4: { ...theme.typography.title4 },\n  body: { ...theme.typography.body },\n  label: { ...theme.typography.label },\n  captionLabel: { ...theme.typography.captionLabel },\n  caption1: { ...theme.typography.caption1 },\n  caption2: { ...theme.typography.caption2 },\n  // legacy variants\n  \"5xlTitle\": { ...theme.typography[\"5xlTitle\"] },\n  \"4xlTitle\": { ...theme.typography[\"4xlTitle\"] },\n  // @ts-ignore non-existent variant\n  \"3xlTitle\": { ...theme.typography[\"3xlTitle\"] },\n  xxlTitle: { ...theme.typography.xxlTitle },\n  xlTitle: {},\n  lTitle: { ...theme.typography.lTitle },\n  mTitle: {},\n  sTitle: { ...theme.typography.sTitle },\n  xsTitle: {},\n  xxsTitle: { ...theme.typography.xxsTitle },\n  sectionTitle: {\n    ...theme.typography.sectionTitle,\n    textTransform: \"uppercase\",\n  },\n  highlightText: {},\n  normalText: {},\n  placeholderText: { ...theme.typography.placeholderText },\n  link: {\n    ...theme.typography.link,\n    cursor: \"pointer\",\n    textDecoration: \"underline\",\n  },\n  disabledText: { ...theme.typography.disabledText },\n  selectedNavText: { ...theme.typography.selectedNavText },\n  vizText: {},\n  vizTextDisabled: { ...theme.typography.vizTextDisabled },\n  xsInlineLink: { ...theme.typography.xsInlineLink },\n});\n"],"names":[],"mappings":";;AAIO,MAAM,EAAE,YAAY,kBAAkB,cAAc,gBAAgB;AAAA,EACzE,MAAM;AAAA,IACJ,YAAY,MAAM,WAAW;AAAA,EAC/B;AAAA,EACA,UAAU;AAAA,IACR,OAAO,MAAM,OAAO;AAAA,EACtB;AAAA,EACA,QAAQ;AAAA,IACN,QAAQ;AAAA,IACR,OAAO,MAAM,OAAO;AAAA,IACpB,gBAAgB;AAAA,EAClB;AAAA,EACA,QAAQ;AAAA,IACN,UAAU;AAAA,IACV,cAAc;AAAA,IACd,YAAY;AAAA,EACd;AAAA;AAAA,EAEA,SAAS,EAAE,GAAG,MAAM,WAAW,QAAQ;AAAA,EACvC,QAAQ,EAAE,GAAG,MAAM,WAAW,OAAO;AAAA,EACrC,QAAQ,EAAE,GAAG,MAAM,WAAW,OAAO;AAAA,EACrC,QAAQ,EAAE,GAAG,MAAM,WAAW,OAAO;AAAA,EACrC,QAAQ,EAAE,GAAG,MAAM,WAAW,OAAO;AAAA,EACrC,MAAM,EAAE,GAAG,MAAM,WAAW,KAAK;AAAA,EACjC,OAAO,EAAE,GAAG,MAAM,WAAW,MAAM;AAAA,EACnC,cAAc,EAAE,GAAG,MAAM,WAAW,aAAa;AAAA,EACjD,UAAU,EAAE,GAAG,MAAM,WAAW,SAAS;AAAA,EACzC,UAAU,EAAE,GAAG,MAAM,WAAW,SAAS;AAAA;AAAA,EAEzC,YAAY,EAAE,GAAG,MAAM,WAAW,UAAU,EAAE;AAAA,EAC9C,YAAY,EAAE,GAAG,MAAM,WAAW,UAAU,EAAE;AAAA;AAAA,EAE9C,YAAY,EAAE,GAAG,MAAM,WAAW,UAAU,EAAE;AAAA,EAC9C,UAAU,EAAE,GAAG,MAAM,WAAW,SAAS;AAAA,EACzC,SAAS,CAAC;AAAA,EACV,QAAQ,EAAE,GAAG,MAAM,WAAW,OAAO;AAAA,EACrC,QAAQ,CAAC;AAAA,EACT,QAAQ,EAAE,GAAG,MAAM,WAAW,OAAO;AAAA,EACrC,SAAS,CAAC;AAAA,EACV,UAAU,EAAE,GAAG,MAAM,WAAW,SAAS;AAAA,EACzC,cAAc;AAAA,IACZ,GAAG,MAAM,WAAW;AAAA,IACpB,eAAe;AAAA,EACjB;AAAA,EACA,eAAe,CAAC;AAAA,EAChB,YAAY,CAAC;AAAA,EACb,iBAAiB,EAAE,GAAG,MAAM,WAAW,gBAAgB;AAAA,EACvD,MAAM;AAAA,IACJ,GAAG,MAAM,WAAW;AAAA,IACpB,QAAQ;AAAA,IACR,gBAAgB;AAAA,EAClB;AAAA,EACA,cAAc,EAAE,GAAG,MAAM,WAAW,aAAa;AAAA,EACjD,iBAAiB,EAAE,GAAG,MAAM,WAAW,gBAAgB;AAAA,EACvD,SAAS,CAAC;AAAA,EACV,iBAAiB,EAAE,GAAG,MAAM,WAAW,gBAAgB;AAAA,EACvD,cAAc,EAAE,GAAG,MAAM,WAAW,aAAa;AACnD,CAAC;"}
+{"version":3,"file":"Typography.styles.js","sources":["../../../src/Typography/Typography.styles.ts"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const { useClasses, staticClasses } = createClasses(\"HvTypography\", {\n  root: {\n    fontFamily: theme.fontFamily.body,\n  },\n  disabled: {\n    color: theme.colors.secondary_60,\n  },\n  isLink: {\n    cursor: \"pointer\",\n    color: theme.colors.primary,\n    textDecoration: \"underline\",\n  },\n  noWrap: {\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    whiteSpace: \"nowrap\",\n  },\n  // variants\n  display: { ...theme.typography.display },\n  title1: { ...theme.typography.title1 },\n  title2: { ...theme.typography.title2 },\n  title3: { ...theme.typography.title3 },\n  title4: { ...theme.typography.title4 },\n  body: { ...theme.typography.body },\n  label: { ...theme.typography.label },\n  captionLabel: { ...theme.typography.captionLabel },\n  caption1: { ...theme.typography.caption1 },\n  caption2: { ...theme.typography.caption2 },\n  // legacy variants\n  \"5xlTitle\": { ...theme.typography[\"5xlTitle\"] },\n  \"4xlTitle\": { ...theme.typography[\"4xlTitle\"] },\n  // @ts-ignore non-existent variant\n  \"3xlTitle\": { ...theme.typography[\"3xlTitle\"] },\n  xxlTitle: { ...theme.typography.xxlTitle },\n  xlTitle: {},\n  lTitle: { ...theme.typography.lTitle },\n  mTitle: {},\n  sTitle: { ...theme.typography.sTitle },\n  xsTitle: {},\n  xxsTitle: { ...theme.typography.xxsTitle },\n  sectionTitle: {\n    ...theme.typography.sectionTitle,\n    textTransform: \"uppercase\",\n  },\n  highlightText: {},\n  normalText: {},\n  placeholderText: { ...theme.typography.placeholderText },\n  link: {\n    ...theme.typography.link,\n    cursor: \"pointer\",\n    textDecoration: \"underline\",\n  },\n  disabledText: { ...theme.typography.disabledText },\n  selectedNavText: { ...theme.typography.selectedNavText },\n  vizText: {},\n  vizTextDisabled: { ...theme.typography.vizTextDisabled },\n  xsInlineLink: { ...theme.typography.xsInlineLink },\n});\n"],"names":[],"mappings":";;AAGO,MAAM,EAAE,YAAY,kBAAkB,cAAc,gBAAgB;AAAA,EACzE,MAAM;AAAA,IACJ,YAAY,MAAM,WAAW;AAAA,EAC/B;AAAA,EACA,UAAU;AAAA,IACR,OAAO,MAAM,OAAO;AAAA,EACtB;AAAA,EACA,QAAQ;AAAA,IACN,QAAQ;AAAA,IACR,OAAO,MAAM,OAAO;AAAA,IACpB,gBAAgB;AAAA,EAClB;AAAA,EACA,QAAQ;AAAA,IACN,UAAU;AAAA,IACV,cAAc;AAAA,IACd,YAAY;AAAA,EACd;AAAA;AAAA,EAEA,SAAS,EAAE,GAAG,MAAM,WAAW,QAAQ;AAAA,EACvC,QAAQ,EAAE,GAAG,MAAM,WAAW,OAAO;AAAA,EACrC,QAAQ,EAAE,GAAG,MAAM,WAAW,OAAO;AAAA,EACrC,QAAQ,EAAE,GAAG,MAAM,WAAW,OAAO;AAAA,EACrC,QAAQ,EAAE,GAAG,MAAM,WAAW,OAAO;AAAA,EACrC,MAAM,EAAE,GAAG,MAAM,WAAW,KAAK;AAAA,EACjC,OAAO,EAAE,GAAG,MAAM,WAAW,MAAM;AAAA,EACnC,cAAc,EAAE,GAAG,MAAM,WAAW,aAAa;AAAA,EACjD,UAAU,EAAE,GAAG,MAAM,WAAW,SAAS;AAAA,EACzC,UAAU,EAAE,GAAG,MAAM,WAAW,SAAS;AAAA;AAAA,EAEzC,YAAY,EAAE,GAAG,MAAM,WAAW,UAAU,EAAE;AAAA,EAC9C,YAAY,EAAE,GAAG,MAAM,WAAW,UAAU,EAAE;AAAA;AAAA,EAE9C,YAAY,EAAE,GAAG,MAAM,WAAW,UAAU,EAAE;AAAA,EAC9C,UAAU,EAAE,GAAG,MAAM,WAAW,SAAS;AAAA,EACzC,SAAS,CAAC;AAAA,EACV,QAAQ,EAAE,GAAG,MAAM,WAAW,OAAO;AAAA,EACrC,QAAQ,CAAC;AAAA,EACT,QAAQ,EAAE,GAAG,MAAM,WAAW,OAAO;AAAA,EACrC,SAAS,CAAC;AAAA,EACV,UAAU,EAAE,GAAG,MAAM,WAAW,SAAS;AAAA,EACzC,cAAc;AAAA,IACZ,GAAG,MAAM,WAAW;AAAA,IACpB,eAAe;AAAA,EACjB;AAAA,EACA,eAAe,CAAC;AAAA,EAChB,YAAY,CAAC;AAAA,EACb,iBAAiB,EAAE,GAAG,MAAM,WAAW,gBAAgB;AAAA,EACvD,MAAM;AAAA,IACJ,GAAG,MAAM,WAAW;AAAA,IACpB,QAAQ;AAAA,IACR,gBAAgB;AAAA,EAClB;AAAA,EACA,cAAc,EAAE,GAAG,MAAM,WAAW,aAAa;AAAA,EACjD,iBAAiB,EAAE,GAAG,MAAM,WAAW,gBAAgB;AAAA,EACvD,SAAS,CAAC;AAAA,EACV,iBAAiB,EAAE,GAAG,MAAM,WAAW,gBAAgB;AAAA,EACvD,cAAc,EAAE,GAAG,MAAM,WAAW,aAAa;AACnD,CAAC;"}

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

@@ -1,6 +1,6 @@
 import { jsxs } from "react/jsx-runtime";
 import { useContext, useCallback } from "react";
-import { useDefaultProps } from "../../hooks/useDefaultProps.js";
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import { isKey } from "../../utils/keyboardUtils.js";
 import { setId } from "../../utils/setId.js";
 import { VerticalNavigationContext } from "../VerticalNavigationContext.js";

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

@@ -1 +1 @@
-{"version":3,"file":"Action.js","sources":["../../../../src/VerticalNavigation/Actions/Action.tsx"],"sourcesContent":["import { useCallback, useContext } from \"react\";\n\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\nimport { HvTypography, HvTypographyProps } from \"../../Typography\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { isKey } from \"../../utils/keyboardUtils\";\nimport { setId } from \"../../utils/setId\";\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  extends Omit<HvTypographyProps, \"classes\" | \"onClick\"> {\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvVerticalNavigationActionClasses;\n  /** Visual label. */\n  label?: string;\n  /** Icon. */\n  icon?: React.ReactNode;\n  /** Callback called when clicked. */\n  onClick?: (\n    event:\n      | React.KeyboardEvent<HTMLDivElement>\n      | React.MouseEvent<HTMLDivElement>,\n  ) => void;\n}\n\nexport const HvVerticalNavigationAction = (\n  props: HvVerticalNavigationActionProps,\n) => {\n  const {\n    className,\n    classes: classesProp,\n    id,\n    label = \"\",\n    icon,\n    onClick,\n    ...others\n  } = useDefaultProps(\"HvVerticalNavigationAction\", props);\n\n  const { isOpen } = useContext(VerticalNavigationContext);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const handleKeyDown = useCallback(\n    (event: React.KeyboardEvent<HTMLDivElement>) => {\n      if (!onClick || (!isKey(event, \"Enter\") && !isKey(event, \"Space\"))) {\n        return;\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":[],"mappings":";;;;;;;;;AA8Ba,MAAA,6BAA6B,CACxC,UACG;AACG,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,8BAA8B,KAAK;AAEvD,QAAM,EAAE,OAAA,IAAW,WAAW,yBAAyB;AAEvD,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,QAAM,gBAAgB;AAAA,IACpB,CAAC,UAA+C;AAC1C,UAAA,CAAC,WAAY,CAAC,MAAM,OAAO,OAAO,KAAK,CAAC,MAAM,OAAO,OAAO,GAAI;AAClE;AAAA,MACF;AACA,cAAQ,KAAK;AAAA,IACf;AAAA,IACA,CAAC,OAAO;AAAA,EAAA;AAIR,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAI,MAAM,IAAI,QAAQ;AAAA,MACtB,WAAU;AAAA,MACV,MAAK;AAAA,MACL,WAAW;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,MAAM,GAAG,CAAC;AAAA,UACnB,CAAC,QAAQ,SAAS,GAAG,CAAC;AAAA,QACxB;AAAA,QACA;AAAA,MACF;AAAA,MACA,UAAU;AAAA,MACT,GAAI,CAAC,UAAU,EAAE,cAAc,MAAM;AAAA,MACtC,WAAW;AAAA,MACX;AAAA,MACC,GAAG;AAAA,MAEH,UAAA;AAAA,QAAA;AAAA,QACA,UAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGjB;"}
+{"version":3,"file":"Action.js","sources":["../../../../src/VerticalNavigation/Actions/Action.tsx"],"sourcesContent":["import { useCallback, useContext } from \"react\";\nimport {\n  useDefaultProps,\n  type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\n\nimport { HvTypography, HvTypographyProps } from \"../../Typography\";\nimport { isKey } from \"../../utils/keyboardUtils\";\nimport { setId } from \"../../utils/setId\";\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  extends Omit<HvTypographyProps, \"classes\" | \"onClick\"> {\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvVerticalNavigationActionClasses;\n  /** Visual label. */\n  label?: string;\n  /** Icon. */\n  icon?: React.ReactNode;\n  /** Callback called when clicked. */\n  onClick?: (\n    event:\n      | React.KeyboardEvent<HTMLDivElement>\n      | React.MouseEvent<HTMLDivElement>,\n  ) => void;\n}\n\nexport const HvVerticalNavigationAction = (\n  props: HvVerticalNavigationActionProps,\n) => {\n  const {\n    className,\n    classes: classesProp,\n    id,\n    label = \"\",\n    icon,\n    onClick,\n    ...others\n  } = useDefaultProps(\"HvVerticalNavigationAction\", props);\n\n  const { isOpen } = useContext(VerticalNavigationContext);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const handleKeyDown = useCallback(\n    (event: React.KeyboardEvent<HTMLDivElement>) => {\n      if (!onClick || (!isKey(event, \"Enter\") && !isKey(event, \"Space\"))) {\n        return;\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":[],"mappings":";;;;;;;;;AAgCa,MAAA,6BAA6B,CACxC,UACG;AACG,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,8BAA8B,KAAK;AAEvD,QAAM,EAAE,OAAA,IAAW,WAAW,yBAAyB;AAEvD,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,QAAM,gBAAgB;AAAA,IACpB,CAAC,UAA+C;AAC1C,UAAA,CAAC,WAAY,CAAC,MAAM,OAAO,OAAO,KAAK,CAAC,MAAM,OAAO,OAAO,GAAI;AAClE;AAAA,MACF;AACA,cAAQ,KAAK;AAAA,IACf;AAAA,IACA,CAAC,OAAO;AAAA,EAAA;AAIR,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAI,MAAM,IAAI,QAAQ;AAAA,MACtB,WAAU;AAAA,MACV,MAAK;AAAA,MACL,WAAW;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,MAAM,GAAG,CAAC;AAAA,UACnB,CAAC,QAAQ,SAAS,GAAG,CAAC;AAAA,QACxB;AAAA,QACA;AAAA,MACF;AAAA,MACA,UAAU;AAAA,MACT,GAAI,CAAC,UAAU,EAAE,cAAc,MAAM;AAAA,MACtC,WAAW;AAAA,MACX;AAAA,MACC,GAAG;AAAA,MAEH,UAAA;AAAA,QAAA;AAAA,QACA,UAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGjB;"}

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

@@ -1,6 +1,6 @@
+import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
 import { outlineStyles } from "../../utils/focusUtils.js";
-import { createClasses } from "@hitachivantara/uikit-react-shared";
 const hover = {
   background: theme.colors.containerBackgroundHover
 };

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

@@ -1 +1 @@
-{"version":3,"file":"Action.styles.js","sources":["../../../../src/VerticalNavigation/Actions/Action.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../../utils/classes\";\nimport { outlineStyles } from \"../../utils/focusUtils\";\n\nconst hover = {\n  background: theme.colors.containerBackgroundHover,\n};\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvVerticalNavigationAction\",\n  {\n    action: {\n      width: \"100%\",\n      display: \"flex\",\n      justifyContent: \"flex-start\",\n      alignItems: \"center\",\n      height: \"32px\",\n      color: theme.colors.secondary,\n\n      // hover\n      \"&:hover\": { ...hover },\n      \"&:focus\": {\n        outline: \"none\",\n        ...hover,\n      },\n\n      \"&:focus-visible\": {\n        ...outlineStyles,\n      },\n\n      // cursor\n      cursor: \"pointer\",\n      \"& *\": {\n        cursor: \"pointer\",\n      },\n    },\n    noIcon: {\n      paddingLeft: theme.space.xs,\n    },\n    minimized: {\n      justifyContent: \"center\",\n      paddingRight: 0,\n    },\n  },\n);\n"],"names":[],"mappings":";;;AAKA,MAAM,QAAQ;AAAA,EACZ,YAAY,MAAM,OAAO;AAC3B;AAEa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,MACN,OAAO;AAAA,MACP,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB,YAAY;AAAA,MACZ,QAAQ;AAAA,MACR,OAAO,MAAM,OAAO;AAAA;AAAA,MAGpB,WAAW,EAAE,GAAG,MAAM;AAAA,MACtB,WAAW;AAAA,QACT,SAAS;AAAA,QACT,GAAG;AAAA,MACL;AAAA,MAEA,mBAAmB;AAAA,QACjB,GAAG;AAAA,MACL;AAAA;AAAA,MAGA,QAAQ;AAAA,MACR,OAAO;AAAA,QACL,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,IACA,QAAQ;AAAA,MACN,aAAa,MAAM,MAAM;AAAA,IAC3B;AAAA,IACA,WAAW;AAAA,MACT,gBAAgB;AAAA,MAChB,cAAc;AAAA,IAChB;AAAA,EACF;AACF;"}
+{"version":3,"file":"Action.styles.js","sources":["../../../../src/VerticalNavigation/Actions/Action.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"../../utils/focusUtils\";\n\nconst hover = {\n  background: theme.colors.containerBackgroundHover,\n};\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvVerticalNavigationAction\",\n  {\n    action: {\n      width: \"100%\",\n      display: \"flex\",\n      justifyContent: \"flex-start\",\n      alignItems: \"center\",\n      height: \"32px\",\n      color: theme.colors.secondary,\n\n      // hover\n      \"&:hover\": { ...hover },\n      \"&:focus\": {\n        outline: \"none\",\n        ...hover,\n      },\n\n      \"&:focus-visible\": {\n        ...outlineStyles,\n      },\n\n      // cursor\n      cursor: \"pointer\",\n      \"& *\": {\n        cursor: \"pointer\",\n      },\n    },\n    noIcon: {\n      paddingLeft: theme.space.xs,\n    },\n    minimized: {\n      justifyContent: \"center\",\n      paddingRight: 0,\n    },\n  },\n);\n"],"names":[],"mappings":";;;AAKA,MAAM,QAAQ;AAAA,EACZ,YAAY,MAAM,OAAO;AAC3B;AAEa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,MACN,OAAO;AAAA,MACP,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB,YAAY;AAAA,MACZ,QAAQ;AAAA,MACR,OAAO,MAAM,OAAO;AAAA;AAAA,MAGpB,WAAW,EAAE,GAAG,MAAM;AAAA,MACtB,WAAW;AAAA,QACT,SAAS;AAAA,QACT,GAAG;AAAA,MACL;AAAA,MAEA,mBAAmB;AAAA,QACjB,GAAG;AAAA,MACL;AAAA;AAAA,MAGA,QAAQ;AAAA,MACR,OAAO;AAAA,QACL,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,IACA,QAAQ;AAAA,MACN,aAAa,MAAM,MAAM;AAAA,IAC3B;AAAA,IACA,WAAW;AAAA,MACT,gBAAgB;AAAA,MAChB,cAAc;AAAA,IAChB;AAAA,EACF;AACF;"}

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

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { useContext } from "react";
-import { useDefaultProps } from "../../hooks/useDefaultProps.js";
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import { VerticalNavigationContext } from "../VerticalNavigationContext.js";
 import { useClasses } from "./Actions.styles.js";
 import { staticClasses } from "./Actions.styles.js";

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

@@ -1 +1 @@
-{"version":3,"file":"Actions.js","sources":["../../../../src/VerticalNavigation/Actions/Actions.tsx"],"sourcesContent":["import { useContext } from \"react\";\n\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../../types/generic\";\nimport { ExtractNames } from \"../../utils/classes\";\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 extends HvBaseProps {\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvVerticalNavigationActionsClasses;\n}\n\nexport const HvVerticalNavigationActions = (\n  props: HvVerticalNavigationActionsProps,\n) => {\n  const {\n    className,\n    classes: classesProp,\n    children,\n    ...others\n  } = useDefaultProps(\"HvVerticalNavigationActions\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const { isOpen, useIcons } = useContext(VerticalNavigationContext);\n\n  return (\n    <div\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":[],"mappings":";;;;;;AAmBa,MAAA,8BAA8B,CACzC,UACG;AACG,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,+BAA+B,KAAK;AAExD,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,QAAM,EAAE,QAAQ,SAAS,IAAI,WAAW,yBAAyB;AAG/D,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,IAAI,GAAG,CAAC,UAAU,CAAC;AAAA,QAC9B;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"Actions.js","sources":["../../../../src/VerticalNavigation/Actions/Actions.tsx"],"sourcesContent":["import { useContext } from \"react\";\nimport {\n  useDefaultProps,\n  type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\n\nimport { HvBaseProps } from \"../../types/generic\";\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 extends HvBaseProps {\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvVerticalNavigationActionsClasses;\n}\n\nexport const HvVerticalNavigationActions = (\n  props: HvVerticalNavigationActionsProps,\n) => {\n  const {\n    className,\n    classes: classesProp,\n    children,\n    ...others\n  } = useDefaultProps(\"HvVerticalNavigationActions\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const { isOpen, useIcons } = useContext(VerticalNavigationContext);\n\n  return (\n    <div\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":[],"mappings":";;;;;;AAqBa,MAAA,8BAA8B,CACzC,UACG;AACG,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,+BAA+B,KAAK;AAExD,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,QAAM,EAAE,QAAQ,SAAS,IAAI,WAAW,yBAAyB;AAG/D,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,IAAI,GAAG,CAAC,UAAU,CAAC;AAAA,QAC9B;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EAAA;AAGP;"}

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

@@ -1,5 +1,5 @@
+import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-import { createClasses } from "@hitachivantara/uikit-react-shared";
 const { staticClasses, useClasses } = createClasses(
   "HvVerticalNavigationActions",
   {

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

@@ -1 +1 @@
-{"version":3,"file":"Actions.styles.js","sources":["../../../../src/VerticalNavigation/Actions/Actions.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvVerticalNavigationActions\",\n  {\n    root: {\n      display: \"block\",\n      background: theme.colors.atmo1,\n      marginTop: \"auto\",\n\n      \"& :not(:last-child)\": {\n        marginBottom: \"8px\",\n      },\n    },\n    hide: {\n      display: \"none\",\n    },\n  },\n);\n"],"names":[],"mappings":";;AAIa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,YAAY,MAAM,OAAO;AAAA,MACzB,WAAW;AAAA,MAEX,uBAAuB;AAAA,QACrB,cAAc;AAAA,MAChB;AAAA,IACF;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,IACX;AAAA,EACF;AACF;"}
+{"version":3,"file":"Actions.styles.js","sources":["../../../../src/VerticalNavigation/Actions/Actions.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvVerticalNavigationActions\",\n  {\n    root: {\n      display: \"block\",\n      background: theme.colors.atmo1,\n      marginTop: \"auto\",\n\n      \"& :not(:last-child)\": {\n        marginBottom: \"8px\",\n      },\n    },\n    hide: {\n      display: \"none\",\n    },\n  },\n);\n"],"names":[],"mappings":";;AAGa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,YAAY,MAAM,OAAO;AAAA,MACzB,WAAW;AAAA,MAEX,uBAAuB;AAAA,QACrB,cAAc;AAAA,MAChB;AAAA,IACF;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,IACX;AAAA,EACF;AACF;"}

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

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useContext, useMemo } from "react";
 import { Backwards, Menu, Forwards } from "@hitachivantara/uikit-react-icons";
-import { useDefaultProps } from "../../hooks/useDefaultProps.js";
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import { VerticalNavigationContext } from "../VerticalNavigationContext.js";
 import { useClasses } from "./Header.styles.js";
 import { staticClasses } from "./Header.styles.js";

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

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sources":["../../../../src/VerticalNavigation/Header/Header.tsx"],"sourcesContent":["import { useContext, useMemo } from \"react\";\nimport { Backwards, Forwards, Menu } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvButton, HvButtonProps } from \"../../Button\";\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../../types/generic\";\nimport { HvTypography } from \"../../Typography\";\nimport { ExtractNames } from \"../../utils/classes\";\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 extends HvBaseProps {\n  /** The title text to show on header. */\n  title?: string;\n  /** Icon to show when vertical navigation is collapsed. */\n  openIcon?: React.ReactNode;\n  /** Icon to show when vertical navigation is expanded. */\n  closeIcon?: React.ReactNode;\n  /** Props for the collapse button. */\n  collapseButtonProps?: HvButtonProps;\n  /** Props for the back button. */\n  backButtonProps?: HvButtonProps;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvVerticalNavigationHeaderClasses;\n  /** Handler for the collapse button. */\n  onCollapseButtonClick?: React.MouseEventHandler<HTMLElement>;\n}\n\nexport const HvVerticalNavigationHeader = (\n  props: HvVerticalNavigationHeaderProps,\n) => {\n  const {\n    title,\n    openIcon: openIconProp,\n    closeIcon: closeIconProp,\n    collapseButtonProps = {},\n    backButtonProps = {},\n    className,\n    classes: classesProp,\n    onCollapseButtonClick,\n    ...others\n  } = useDefaultProps(\"HvVerticalNavigationHeader\", props);\n\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  // 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  if (!shouldShowTitle) return null;\n\n  const openIcon = openIconProp ?? (!useIcons ? <Menu /> : <Forwards />);\n  const closeIcon = closeIconProp ?? <Backwards />;\n\n  const handleClickBack = () => navigateToParentHandler?.();\n\n  const { className: backButtonClassName, ...otherBackButtonProps } =\n    backButtonProps;\n\n  const {\n    className: collapseButtonClassName,\n    classes: collapseButtonClasses,\n    ...otherCollapseButtonProps\n  } = collapseButtonProps;\n\n  return (\n    <div\n      className={cx(classes.root, { [classes.minimized]: !isOpen }, className)}\n      {...others}\n    >\n      {isOpen && headerTitle && slider && (\n        <HvButton\n          icon\n          onClick={handleClickBack}\n          className={cx(classes.backButton, backButtonClassName)}\n          aria-label=\"Back\"\n          {...otherBackButtonProps}\n        >\n          <Backwards iconSize=\"XS\" />\n        </HvButton>\n      )}\n      {isOpen && (\n        <HvTypography\n          variant={slider ? \"label\" : \"title3\"}\n          className={classes.title}\n        >\n          {headerTitle && slider ? headerTitle : title}\n        </HvTypography>\n      )}\n      {onCollapseButtonClick && (\n        <HvButton\n          icon\n          onClick={onCollapseButtonClick}\n          className={cx(classes.collapseButton, collapseButtonClassName)}\n          classes={{\n            ...collapseButtonClasses,\n            root: cx(\n              { [classes.minimized]: !isOpen }, // TODO - v6 don't use minimized classes in two different places\n              collapseButtonClasses?.root,\n            ),\n          }}\n          {...otherCollapseButtonProps}\n        >\n          {isOpen ? closeIcon : openIcon}\n        </HvButton>\n      )}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AAgCa,MAAA,6BAA6B,CACxC,UACG;AACG,QAAA;AAAA,IACJ;AAAA,IACA,UAAU;AAAA,IACV,WAAW;AAAA,IACX,sBAAsB,CAAC;AAAA,IACvB,kBAAkB,CAAC;AAAA,IACnB;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,8BAA8B,KAAK;AAEjD,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,IACE,WAAW,yBAAyB;AAExC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAI9C,QAAM,kBAAkB;AAAA,IACtB,MAAM,CAAC,UAAW,UAAU,CAAC,MAAM,QAAQ,UAAU;AAAA,IACrD,CAAC,YAAY,MAAM;AAAA,EAAA;AAGjB,MAAA,CAAC,gBAAwB,QAAA;AAEvB,QAAA,WAAW,iBAAiB,CAAC,+BAAY,MAAK,CAAA,CAAA,wBAAM,UAAS,CAAA,CAAA;AAC7D,QAAA,YAAY,iBAAiB,oBAAC,WAAU,CAAA,CAAA;AAExC,QAAA,kBAAkB,MAAM;AAE9B,QAAM,EAAE,WAAW,qBAAqB,GAAG,yBACzC;AAEI,QAAA;AAAA,IACJ,WAAW;AAAA,IACX,SAAS;AAAA,IACT,GAAG;AAAA,EACD,IAAA;AAGF,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,GAAG,QAAQ,MAAM,EAAE,CAAC,QAAQ,SAAS,GAAG,CAAC,OAAO,GAAG,SAAS;AAAA,MACtE,GAAG;AAAA,MAEH,UAAA;AAAA,QAAA,UAAU,eAAe,UACxB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAI;AAAA,YACJ,SAAS;AAAA,YACT,WAAW,GAAG,QAAQ,YAAY,mBAAmB;AAAA,YACrD,cAAW;AAAA,YACV,GAAG;AAAA,YAEJ,UAAA,oBAAC,WAAU,EAAA,UAAS,KAAK,CAAA;AAAA,UAAA;AAAA,QAC3B;AAAA,QAED,UACC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAAS,SAAS,UAAU;AAAA,YAC5B,WAAW,QAAQ;AAAA,YAElB,UAAA,eAAe,SAAS,cAAc;AAAA,UAAA;AAAA,QACzC;AAAA,QAED,yBACC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAI;AAAA,YACJ,SAAS;AAAA,YACT,WAAW,GAAG,QAAQ,gBAAgB,uBAAuB;AAAA,YAC7D,SAAS;AAAA,cACP,GAAG;AAAA,cACH,MAAM;AAAA,gBACJ,EAAE,CAAC,QAAQ,SAAS,GAAG,CAAC,OAAO;AAAA;AAAA,gBAC/B,uBAAuB;AAAA,cACzB;AAAA,YACF;AAAA,YACC,GAAG;AAAA,YAEH,mBAAS,YAAY;AAAA,UAAA;AAAA,QACxB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;"}
+{"version":3,"file":"Header.js","sources":["../../../../src/VerticalNavigation/Header/Header.tsx"],"sourcesContent":["import { useContext, useMemo } from \"react\";\nimport { Backwards, Forwards, Menu } from \"@hitachivantara/uikit-react-icons\";\nimport {\n  useDefaultProps,\n  type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\n\nimport { HvButton, HvButtonProps } from \"../../Button\";\nimport { HvBaseProps } from \"../../types/generic\";\nimport { HvTypography } from \"../../Typography\";\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 extends HvBaseProps {\n  /** The title text to show on header. */\n  title?: string;\n  /** Icon to show when vertical navigation is collapsed. */\n  openIcon?: React.ReactNode;\n  /** Icon to show when vertical navigation is expanded. */\n  closeIcon?: React.ReactNode;\n  /** Props for the collapse button. */\n  collapseButtonProps?: HvButtonProps;\n  /** Props for the back button. */\n  backButtonProps?: HvButtonProps;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvVerticalNavigationHeaderClasses;\n  /** Handler for the collapse button. */\n  onCollapseButtonClick?: React.MouseEventHandler<HTMLElement>;\n}\n\nexport const HvVerticalNavigationHeader = (\n  props: HvVerticalNavigationHeaderProps,\n) => {\n  const {\n    title,\n    openIcon: openIconProp,\n    closeIcon: closeIconProp,\n    collapseButtonProps = {},\n    backButtonProps = {},\n    className,\n    classes: classesProp,\n    onCollapseButtonClick,\n    ...others\n  } = useDefaultProps(\"HvVerticalNavigationHeader\", props);\n\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  // 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  if (!shouldShowTitle) return null;\n\n  const openIcon = openIconProp ?? (!useIcons ? <Menu /> : <Forwards />);\n  const closeIcon = closeIconProp ?? <Backwards />;\n\n  const handleClickBack = () => navigateToParentHandler?.();\n\n  const { className: backButtonClassName, ...otherBackButtonProps } =\n    backButtonProps;\n\n  const {\n    className: collapseButtonClassName,\n    classes: collapseButtonClasses,\n    ...otherCollapseButtonProps\n  } = collapseButtonProps;\n\n  return (\n    <div\n      className={cx(classes.root, { [classes.minimized]: !isOpen }, className)}\n      {...others}\n    >\n      {isOpen && headerTitle && slider && (\n        <HvButton\n          icon\n          onClick={handleClickBack}\n          className={cx(classes.backButton, backButtonClassName)}\n          aria-label=\"Back\"\n          {...otherBackButtonProps}\n        >\n          <Backwards iconSize=\"XS\" />\n        </HvButton>\n      )}\n      {isOpen && (\n        <HvTypography\n          variant={slider ? \"label\" : \"title3\"}\n          className={classes.title}\n        >\n          {headerTitle && slider ? headerTitle : title}\n        </HvTypography>\n      )}\n      {onCollapseButtonClick && (\n        <HvButton\n          icon\n          onClick={onCollapseButtonClick}\n          className={cx(classes.collapseButton, collapseButtonClassName)}\n          classes={{\n            ...collapseButtonClasses,\n            root: cx(\n              { [classes.minimized]: !isOpen }, // TODO - v6 don't use minimized classes in two different places\n              collapseButtonClasses?.root,\n            ),\n          }}\n          {...otherCollapseButtonProps}\n        >\n          {isOpen ? closeIcon : openIcon}\n        </HvButton>\n      )}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AAkCa,MAAA,6BAA6B,CACxC,UACG;AACG,QAAA;AAAA,IACJ;AAAA,IACA,UAAU;AAAA,IACV,WAAW;AAAA,IACX,sBAAsB,CAAC;AAAA,IACvB,kBAAkB,CAAC;AAAA,IACnB;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,8BAA8B,KAAK;AAEjD,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,IACE,WAAW,yBAAyB;AAExC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAI9C,QAAM,kBAAkB;AAAA,IACtB,MAAM,CAAC,UAAW,UAAU,CAAC,MAAM,QAAQ,UAAU;AAAA,IACrD,CAAC,YAAY,MAAM;AAAA,EAAA;AAGjB,MAAA,CAAC,gBAAwB,QAAA;AAEvB,QAAA,WAAW,iBAAiB,CAAC,+BAAY,MAAK,CAAA,CAAA,wBAAM,UAAS,CAAA,CAAA;AAC7D,QAAA,YAAY,iBAAiB,oBAAC,WAAU,CAAA,CAAA;AAExC,QAAA,kBAAkB,MAAM;AAE9B,QAAM,EAAE,WAAW,qBAAqB,GAAG,yBACzC;AAEI,QAAA;AAAA,IACJ,WAAW;AAAA,IACX,SAAS;AAAA,IACT,GAAG;AAAA,EACD,IAAA;AAGF,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,GAAG,QAAQ,MAAM,EAAE,CAAC,QAAQ,SAAS,GAAG,CAAC,OAAO,GAAG,SAAS;AAAA,MACtE,GAAG;AAAA,MAEH,UAAA;AAAA,QAAA,UAAU,eAAe,UACxB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAI;AAAA,YACJ,SAAS;AAAA,YACT,WAAW,GAAG,QAAQ,YAAY,mBAAmB;AAAA,YACrD,cAAW;AAAA,YACV,GAAG;AAAA,YAEJ,UAAA,oBAAC,WAAU,EAAA,UAAS,KAAK,CAAA;AAAA,UAAA;AAAA,QAC3B;AAAA,QAED,UACC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAAS,SAAS,UAAU;AAAA,YAC5B,WAAW,QAAQ;AAAA,YAElB,UAAA,eAAe,SAAS,cAAc;AAAA,UAAA;AAAA,QACzC;AAAA,QAED,yBACC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAI;AAAA,YACJ,SAAS;AAAA,YACT,WAAW,GAAG,QAAQ,gBAAgB,uBAAuB;AAAA,YAC7D,SAAS;AAAA,cACP,GAAG;AAAA,cACH,MAAM;AAAA,gBACJ,EAAE,CAAC,QAAQ,SAAS,GAAG,CAAC,OAAO;AAAA;AAAA,gBAC/B,uBAAuB;AAAA,cACzB;AAAA,YACF;AAAA,YACC,GAAG;AAAA,YAEH,mBAAS,YAAY;AAAA,UAAA;AAAA,QACxB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;"}

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

@@ -1,4 +1,4 @@
-import { createClasses } from "@hitachivantara/uikit-react-shared";
+import { createClasses } from "@hitachivantara/uikit-react-utils";
 const { staticClasses, useClasses } = createClasses(
   "HvVerticalNavigationHeader",
   {

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

@@ -1 +1 @@
-{"version":3,"file":"Header.styles.js","sources":["../../../../src/VerticalNavigation/Header/Header.styles.tsx"],"sourcesContent":["import { createClasses } from \"../../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvVerticalNavigationHeader\",\n  {\n    root: {\n      width: \"100%\",\n      display: \"flex\",\n      marginTop: \"12px\",\n      alignItems: \"center\",\n    },\n    minimized: {\n      justifyContent: \"center\",\n      paddingRight: 0,\n    },\n    collapseButton: {\n      marginLeft: \"auto\",\n      \"&$minimized\": {\n        marginLeft: 0,\n      },\n    },\n    backButton: {},\n    title: {},\n  },\n);\n"],"names":[],"mappings":";AAEa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,MAAM;AAAA,MACJ,OAAO;AAAA,MACP,SAAS;AAAA,MACT,WAAW;AAAA,MACX,YAAY;AAAA,IACd;AAAA,IACA,WAAW;AAAA,MACT,gBAAgB;AAAA,MAChB,cAAc;AAAA,IAChB;AAAA,IACA,gBAAgB;AAAA,MACd,YAAY;AAAA,MACZ,eAAe;AAAA,QACb,YAAY;AAAA,MACd;AAAA,IACF;AAAA,IACA,YAAY,CAAC;AAAA,IACb,OAAO,CAAC;AAAA,EACV;AACF;"}
+{"version":3,"file":"Header.styles.js","sources":["../../../../src/VerticalNavigation/Header/Header.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvVerticalNavigationHeader\",\n  {\n    root: {\n      width: \"100%\",\n      display: \"flex\",\n      marginTop: \"12px\",\n      alignItems: \"center\",\n    },\n    minimized: {\n      justifyContent: \"center\",\n      paddingRight: 0,\n    },\n    collapseButton: {\n      marginLeft: \"auto\",\n      \"&$minimized\": {\n        marginLeft: 0,\n      },\n    },\n    backButton: {},\n    title: {},\n  },\n);\n"],"names":[],"mappings":";AAEa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,MAAM;AAAA,MACJ,OAAO;AAAA,MACP,SAAS;AAAA,MACT,WAAW;AAAA,MACX,YAAY;AAAA,IACd;AAAA,IACA,WAAW;AAAA,MACT,gBAAgB;AAAA,MAChB,cAAc;AAAA,IAChB;AAAA,IACA,gBAAgB;AAAA,MACd,YAAY;AAAA,MACZ,eAAe;AAAA,QACb,YAAY;AAAA,MACd;AAAA,IACF;AAAA,IACA,YAAY,CAAC;AAAA,IACb,OAAO,CAAC;AAAA,EACV;AACF;"}

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

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useContext, useState, useCallback, useMemo, useEffect } from "react";
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import { useControlled } from "../../hooks/useControlled.js";
-import { useDefaultProps } from "../../hooks/useDefaultProps.js";
 import { uniqueId } from "../../utils/helpers.js";
 import { setId } from "../../utils/setId.js";
 import { NavigationPopupContainer } from "../NavigationPopup/NavigationPopupContainer.js";

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

@@ -1 +1 @@
-{"version":3,"file":"Navigation.js","sources":["../../../../src/VerticalNavigation/Navigation/Navigation.tsx"],"sourcesContent":["import { useCallback, useContext, useEffect, useMemo, useState } from \"react\";\n\nimport { useControlled } from \"../../hooks/useControlled\";\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../../types/generic\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { uniqueId } from \"../../utils/helpers\";\nimport { setId } from \"../../utils/setId\";\nimport { NavigationPopupContainer } from \"../NavigationPopup/NavigationPopupContainer\";\nimport {\n  HvVerticalNavigationSlider,\n  HvVerticalNavigationSliderProps,\n} from \"../NavigationSlider\";\nimport { getParentItemById } from \"../NavigationSlider/utils/NavigationSlider.utils\";\nimport {\n  HvVerticalNavigationTreeView,\n  HvVerticalNavigationTreeViewItem,\n  NavigationMode,\n} from \"../TreeView\";\nimport {\n  NavigationData,\n  VerticalNavigationContext,\n} from \"../VerticalNavigationContext\";\nimport { staticClasses, useClasses } from \"./Navigation.styles\";\n\nexport { staticClasses as verticalNavigationTreeClasses };\n\nexport type HvVerticalNavigationTreeClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalNavigationTreeProps\n  extends HvBaseProps<HTMLDivElement, \"onChange\" | \"onToggle\"> {\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvVerticalNavigationTreeClasses;\n  /** Modus operandi (role) of the widget instance. */\n  mode?: NavigationMode;\n  /** Can non-leaf nodes be collapsed / expanded. */\n  collapsible?: boolean;\n  /** The ID of the selected page. */\n  selected?: string;\n  /** When uncontrolled, defines the initial selected page ID. */\n  defaultSelected?: string;\n  /** Callback fired when a navigation item is selected. */\n  onChange?: (\n    event:\n      | React.MouseEvent<HTMLLIElement>\n      | React.KeyboardEvent<HTMLUListElement>,\n    page: NavigationData,\n  ) => void;\n  /** Expanded nodes' ids. */\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  /** Callback fired when tree items are expanded/collapsed. */\n  onToggle?: (\n    event: React.KeyboardEvent<HTMLUListElement>,\n    nodeIds: string[],\n  ) => 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: NavigationData[],\n  id: string | undefined,\n  classes?: HvVerticalNavigationTreeClasses,\n  mouseEnterHandler?: (event: any, item: any) => 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 itemMouseEnterHandler = (event: any) => {\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={itemLabel}\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: any) => {\n  const parents = items.filter(\n    (item: any) => item.data != null && item.data.length > 0,\n  );\n  const childParents = parents.flatMap((item: any) => getAllParents(item.data));\n\n  return [...parents, ...childParents];\n};\n\nfunction pathToElement(data: any, targetId: any) {\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  props: HvVerticalNavigationTreeProps,\n) => {\n  const {\n    id,\n    className,\n    classes: classesProp,\n    data,\n    mode = \"navigation\",\n    collapsible = false,\n    expanded: expandedProp,\n    defaultExpanded,\n    onToggle,\n    selected: selectedProp,\n    defaultSelected,\n    onChange,\n    sliderForwardButtonAriaLabel = \"Navigate to submenu\",\n    ...others\n  } = useDefaultProps(\"HvVerticalNavigationTree\", props);\n\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: HTMLElement | null;\n    fixedMode: boolean;\n    data: NavigationData[];\n  } | null>(null);\n\n  const handleChange = useCallback(\n    (\n      event:\n        | React.MouseEvent<HTMLLIElement>\n        | React.KeyboardEvent<HTMLUListElement>,\n      selectedId: string | string[],\n      selectedItem: NavigationData,\n    ) => {\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 as NavigationData[],\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 as string);\n        setExpanded((prevState) => {\n          if (!isOpen) {\n            return [...prevState, ...pathToElement(data, selectedId)];\n          }\n          return [...prevState];\n        });\n        setNavigationPopup(null);\n        onChange?.(event, selectedItem);\n      }\n    },\n    [onChange, setSelected, setExpanded, isOpen, useIcons, data],\n  );\n\n  const treeViewItemMouseEnterHandler = useCallback(\n    (event: any, item: any) => {\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: React.KeyboardEvent<HTMLUListElement>, newExpanded: string[]) => {\n      setExpanded(newExpanded);\n      onToggle?.(event, newExpanded);\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  const navigateToTargetHandler: HvVerticalNavigationSliderProps[\"onNavigateToTarget\"] =\n    (event, selectedItem) => handleChange(event, selectedItem.id, selectedItem);\n\n  const handleNavigationPopupClose = () => setNavigationPopup(null);\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: HvVerticalNavigationTreeProps[\"onChange\"] =\n    (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":[],"mappings":"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"}
+{"version":3,"file":"Navigation.js","sources":["../../../../src/VerticalNavigation/Navigation/Navigation.tsx"],"sourcesContent":["import { useCallback, useContext, useEffect, useMemo, useState } from \"react\";\nimport {\n  useDefaultProps,\n  type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\n\nimport { useControlled } from \"../../hooks/useControlled\";\nimport { HvBaseProps } from \"../../types/generic\";\nimport { uniqueId } from \"../../utils/helpers\";\nimport { setId } from \"../../utils/setId\";\nimport { NavigationPopupContainer } from \"../NavigationPopup/NavigationPopupContainer\";\nimport {\n  HvVerticalNavigationSlider,\n  HvVerticalNavigationSliderProps,\n} from \"../NavigationSlider\";\nimport { getParentItemById } from \"../NavigationSlider/utils/NavigationSlider.utils\";\nimport {\n  HvVerticalNavigationTreeView,\n  HvVerticalNavigationTreeViewItem,\n  NavigationMode,\n} from \"../TreeView\";\nimport {\n  NavigationData,\n  VerticalNavigationContext,\n} from \"../VerticalNavigationContext\";\nimport { staticClasses, useClasses } from \"./Navigation.styles\";\n\nexport { staticClasses as verticalNavigationTreeClasses };\n\nexport type HvVerticalNavigationTreeClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalNavigationTreeProps\n  extends HvBaseProps<HTMLDivElement, \"onChange\" | \"onToggle\"> {\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvVerticalNavigationTreeClasses;\n  /** Modus operandi (role) of the widget instance. */\n  mode?: NavigationMode;\n  /** Can non-leaf nodes be collapsed / expanded. */\n  collapsible?: boolean;\n  /** The ID of the selected page. */\n  selected?: string;\n  /** When uncontrolled, defines the initial selected page ID. */\n  defaultSelected?: string;\n  /** Callback fired when a navigation item is selected. */\n  onChange?: (\n    event:\n      | React.MouseEvent<HTMLLIElement>\n      | React.KeyboardEvent<HTMLUListElement>,\n    page: NavigationData,\n  ) => void;\n  /** Expanded nodes' ids. */\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  /** Callback fired when tree items are expanded/collapsed. */\n  onToggle?: (\n    event: React.KeyboardEvent<HTMLUListElement>,\n    nodeIds: string[],\n  ) => 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: NavigationData[],\n  id: string | undefined,\n  classes?: HvVerticalNavigationTreeClasses,\n  mouseEnterHandler?: (event: any, item: any) => 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 itemMouseEnterHandler = (event: any) => {\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={itemLabel}\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: any) => {\n  const parents = items.filter(\n    (item: any) => item.data != null && item.data.length > 0,\n  );\n  const childParents = parents.flatMap((item: any) => getAllParents(item.data));\n\n  return [...parents, ...childParents];\n};\n\nfunction pathToElement(data: any, targetId: any) {\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  props: HvVerticalNavigationTreeProps,\n) => {\n  const {\n    id,\n    className,\n    classes: classesProp,\n    data,\n    mode = \"navigation\",\n    collapsible = false,\n    expanded: expandedProp,\n    defaultExpanded,\n    onToggle,\n    selected: selectedProp,\n    defaultSelected,\n    onChange,\n    sliderForwardButtonAriaLabel = \"Navigate to submenu\",\n    ...others\n  } = useDefaultProps(\"HvVerticalNavigationTree\", props);\n\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: HTMLElement | null;\n    fixedMode: boolean;\n    data: NavigationData[];\n  } | null>(null);\n\n  const handleChange = useCallback(\n    (\n      event:\n        | React.MouseEvent<HTMLLIElement>\n        | React.KeyboardEvent<HTMLUListElement>,\n      selectedId: string | string[],\n      selectedItem: NavigationData,\n    ) => {\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 as NavigationData[],\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 as string);\n        setExpanded((prevState) => {\n          if (!isOpen) {\n            return [...prevState, ...pathToElement(data, selectedId)];\n          }\n          return [...prevState];\n        });\n        setNavigationPopup(null);\n        onChange?.(event, selectedItem);\n      }\n    },\n    [onChange, setSelected, setExpanded, isOpen, useIcons, data],\n  );\n\n  const treeViewItemMouseEnterHandler = useCallback(\n    (event: any, item: any) => {\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: React.KeyboardEvent<HTMLUListElement>, newExpanded: string[]) => {\n      setExpanded(newExpanded);\n      onToggle?.(event, newExpanded);\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  const navigateToTargetHandler: HvVerticalNavigationSliderProps[\"onNavigateToTarget\"] =\n    (event, selectedItem) => handleChange(event, selectedItem.id, selectedItem);\n\n  const handleNavigationPopupClose = () => setNavigationPopup(null);\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: HvVerticalNavigationTreeProps[\"onChange\"] =\n    (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":[],"mappings":"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"}

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

@@ -1,5 +1,5 @@
+import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-import { createClasses } from "@hitachivantara/uikit-react-shared";
 const { staticClasses, useClasses } = createClasses(
   "HvVerticalNavigationTree",
   {

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

@@ -1 +1 @@
-{"version":3,"file":"Navigation.styles.js","sources":["../../../../src/VerticalNavigation/Navigation/Navigation.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvVerticalNavigationTree\",\n  {\n    root: {\n      display: \"block\",\n      background: theme.colors.atmo1,\n\n      overflowY: \"auto\",\n    },\n    list: {},\n    listItem: {},\n    collapsed: {\n      display: \"none\",\n    },\n    popup: {\n      boxShadow: \"inset 5px 0 5px -3px rgb(65 65 65 / 12%)\",\n    },\n    navigationPopup: {\n      boxShadow: \"inset 5px 0 5px -3px rgb(65 65 65 / 12%)\",\n    },\n  },\n);\n"],"names":[],"mappings":";;AAIa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,YAAY,MAAM,OAAO;AAAA,MAEzB,WAAW;AAAA,IACb;AAAA,IACA,MAAM,CAAC;AAAA,IACP,UAAU,CAAC;AAAA,IACX,WAAW;AAAA,MACT,SAAS;AAAA,IACX;AAAA,IACA,OAAO;AAAA,MACL,WAAW;AAAA,IACb;AAAA,IACA,iBAAiB;AAAA,MACf,WAAW;AAAA,IACb;AAAA,EACF;AACF;"}
+{"version":3,"file":"Navigation.styles.js","sources":["../../../../src/VerticalNavigation/Navigation/Navigation.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvVerticalNavigationTree\",\n  {\n    root: {\n      display: \"block\",\n      background: theme.colors.atmo1,\n\n      overflowY: \"auto\",\n    },\n    list: {},\n    listItem: {},\n    collapsed: {\n      display: \"none\",\n    },\n    popup: {\n      boxShadow: \"inset 5px 0 5px -3px rgb(65 65 65 / 12%)\",\n    },\n    navigationPopup: {\n      boxShadow: \"inset 5px 0 5px -3px rgb(65 65 65 / 12%)\",\n    },\n  },\n);\n"],"names":[],"mappings":";;AAGa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,YAAY,MAAM,OAAO;AAAA,MAEzB,WAAW;AAAA,IACb;AAAA,IACA,MAAM,CAAC;AAAA,IACP,UAAU,CAAC;AAAA,IACX,WAAW;AAAA,MACT,SAAS;AAAA,IACX;AAAA,IACA,OAAO;AAAA,MACL,WAAW;AAAA,IACb;AAAA,IACA,iBAAiB;AAAA,MACf,WAAW;AAAA,IACb;AAAA,EACF;AACF;"}

package/dist/esm/VerticalNavigation/NavigationPopup/NavigationPopup.styles.js

@@ -1,5 +1,5 @@
+import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-import { createClasses } from "@hitachivantara/uikit-react-shared";
 const { staticClasses, useClasses } = createClasses(
   "HvVerticalNavigationPopup",
   {

package/dist/esm/VerticalNavigation/NavigationPopup/NavigationPopup.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationPopup.styles.js","sources":["../../../../src/VerticalNavigation/NavigationPopup/NavigationPopup.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvVerticalNavigationPopup\",\n  {\n    popup: {},\n    container: {\n      marginLeft: theme.spacing(\"xs\"),\n    },\n    popper: {\n      zIndex: theme.zIndices.popover,\n    },\n  },\n);\n"],"names":[],"mappings":";;AAIa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,OAAO,CAAC;AAAA,IACR,WAAW;AAAA,MACT,YAAY,MAAM,QAAQ,IAAI;AAAA,IAChC;AAAA,IACA,QAAQ;AAAA,MACN,QAAQ,MAAM,SAAS;AAAA,IACzB;AAAA,EACF;AACF;"}
+{"version":3,"file":"NavigationPopup.styles.js","sources":["../../../../src/VerticalNavigation/NavigationPopup/NavigationPopup.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvVerticalNavigationPopup\",\n  {\n    popup: {},\n    container: {\n      marginLeft: theme.spacing(\"xs\"),\n    },\n    popper: {\n      zIndex: theme.zIndices.popover,\n    },\n  },\n);\n"],"names":[],"mappings":";;AAGa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,OAAO,CAAC;AAAA,IACR,WAAW;AAAA,MACT,YAAY,MAAM,QAAQ,IAAI;AAAA,IAChC;AAAA,IACA,QAAQ;AAAA,MACN,QAAQ,MAAM,SAAS;AAAA,IACzB;AAAA,EACF;AACF;"}

package/dist/esm/VerticalNavigation/NavigationPopup/NavigationPopupContainer.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { Popper } from "@mui/base/Popper";
 import ClickAwayListener from "@mui/material/ClickAwayListener";
-import { useTheme } from "@hitachivantara/uikit-react-shared";
+import { useTheme } from "@hitachivantara/uikit-react-utils";
 import { getContainerElement } from "../../utils/document.js";
 import { HvVerticalNavigation } from "../VerticalNavigation.js";
 import { useClasses } from "./NavigationPopup.styles.js";

package/dist/esm/VerticalNavigation/NavigationPopup/NavigationPopupContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationPopupContainer.js","sources":["../../../../src/VerticalNavigation/NavigationPopup/NavigationPopupContainer.tsx"],"sourcesContent":["import { Popper } from \"@mui/base/Popper\";\nimport ClickAwayListener from \"@mui/material/ClickAwayListener\";\nimport { useTheme } from \"@hitachivantara/uikit-react-shared\";\n\nimport { HvBaseProps } from \"../../types/generic\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { getContainerElement } from \"../../utils/document\";\nimport { HvVerticalNavigation } from \"../VerticalNavigation\";\nimport { staticClasses, useClasses } from \"./NavigationPopup.styles\";\n\nexport { staticClasses as verticalNavigationPopupClasses };\n\nexport type HvVerticalNavigationPopupClasses = ExtractNames<typeof useClasses>;\n\nexport interface NavigationPopupContainerProps extends HvBaseProps {\n  anchorEl?: HTMLElement | null;\n  onClose?: () => void;\n  classes?: HvVerticalNavigationPopupClasses;\n}\n\nexport const NavigationPopupContainer = ({\n  anchorEl,\n  onClose,\n  children,\n  classes: classesProp,\n  className,\n  ...others\n}: NavigationPopupContainerProps) => {\n  const { classes, cx } = useClasses(classesProp);\n\n  const { rootId } = useTheme();\n\n  const handleClickAway = () => onClose?.();\n\n  return (\n    <Popper\n      open\n      anchorEl={anchorEl}\n      placement=\"right-start\"\n      container={getContainerElement(rootId)}\n      className={cx(classes.popper, classes.popup, className)}\n      {...others}\n    >\n      <ClickAwayListener onClickAway={handleClickAway}>\n        <div className={classes.container}>\n          <HvVerticalNavigation open useIcons>\n            {children}\n          </HvVerticalNavigation>\n        </div>\n      </ClickAwayListener>\n    </Popper>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AAoBO,MAAM,2BAA2B,CAAC;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA,GAAG;AACL,MAAqC;AACnC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAExC,QAAA,EAAE,WAAW;AAEb,QAAA,kBAAkB,MAAM;AAG5B,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAI;AAAA,MACJ;AAAA,MACA,WAAU;AAAA,MACV,WAAW,oBAAoB,MAAM;AAAA,MACrC,WAAW,GAAG,QAAQ,QAAQ,QAAQ,OAAO,SAAS;AAAA,MACrD,GAAG;AAAA,MAEJ,8BAAC,mBAAkB,EAAA,aAAa,iBAC9B,UAAA,oBAAC,SAAI,WAAW,QAAQ,WACtB,UAAA,oBAAC,wBAAqB,MAAI,MAAC,UAAQ,MAChC,UACH,GACF,EACF,CAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"NavigationPopupContainer.js","sources":["../../../../src/VerticalNavigation/NavigationPopup/NavigationPopupContainer.tsx"],"sourcesContent":["import { Popper } from \"@mui/base/Popper\";\nimport ClickAwayListener from \"@mui/material/ClickAwayListener\";\nimport { useTheme, type ExtractNames } from \"@hitachivantara/uikit-react-utils\";\n\nimport { HvBaseProps } from \"../../types/generic\";\nimport { getContainerElement } from \"../../utils/document\";\nimport { HvVerticalNavigation } from \"../VerticalNavigation\";\nimport { staticClasses, useClasses } from \"./NavigationPopup.styles\";\n\nexport { staticClasses as verticalNavigationPopupClasses };\n\nexport type HvVerticalNavigationPopupClasses = ExtractNames<typeof useClasses>;\n\nexport interface NavigationPopupContainerProps extends HvBaseProps {\n  anchorEl?: HTMLElement | null;\n  onClose?: () => void;\n  classes?: HvVerticalNavigationPopupClasses;\n}\n\nexport const NavigationPopupContainer = ({\n  anchorEl,\n  onClose,\n  children,\n  classes: classesProp,\n  className,\n  ...others\n}: NavigationPopupContainerProps) => {\n  const { classes, cx } = useClasses(classesProp);\n\n  const { rootId } = useTheme();\n\n  const handleClickAway = () => onClose?.();\n\n  return (\n    <Popper\n      open\n      anchorEl={anchorEl}\n      placement=\"right-start\"\n      container={getContainerElement(rootId)}\n      className={cx(classes.popper, classes.popup, className)}\n      {...others}\n    >\n      <ClickAwayListener onClickAway={handleClickAway}>\n        <div className={classes.container}>\n          <HvVerticalNavigation open useIcons>\n            {children}\n          </HvVerticalNavigation>\n        </div>\n      </ClickAwayListener>\n    </Popper>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AAmBO,MAAM,2BAA2B,CAAC;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA,GAAG;AACL,MAAqC;AACnC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAExC,QAAA,EAAE,WAAW;AAEb,QAAA,kBAAkB,MAAM;AAG5B,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAI;AAAA,MACJ;AAAA,MACA,WAAU;AAAA,MACV,WAAW,oBAAoB,MAAM;AAAA,MACrC,WAAW,GAAG,QAAQ,QAAQ,QAAQ,OAAO,SAAS;AAAA,MACrD,GAAG;AAAA,MAEJ,8BAAC,mBAAkB,EAAA,aAAa,iBAC9B,UAAA,oBAAC,SAAI,WAAW,QAAQ,WACtB,UAAA,oBAAC,wBAAqB,MAAI,MAAC,UAAQ,MAChC,UACH,GACF,EACF,CAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/esm/VerticalNavigation/NavigationSlider/NavigationSlider.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { DropRightXS } from "@hitachivantara/uikit-react-icons";
-import { useDefaultProps } from "../../hooks/useDefaultProps.js";
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import { useClasses } from "./NavigationSlider.styles.js";
 import { staticClasses } from "./NavigationSlider.styles.js";
 import { HvButton } from "../../Button/Button.js";

package/dist/esm/VerticalNavigation/NavigationSlider/NavigationSlider.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationSlider.js","sources":["../../../../src/VerticalNavigation/NavigationSlider/NavigationSlider.tsx"],"sourcesContent":["import { DropRightXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvButton } from \"../../Button\";\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\nimport {\n  HvListContainer,\n  HvListContainerProps,\n  HvListItem,\n} from \"../../ListContainer\";\nimport { HvOverflowTooltip } from \"../../OverflowTooltip\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { NavigationData } from \"../VerticalNavigationContext\";\nimport { staticClasses, useClasses } from \"./NavigationSlider.styles\";\n\nexport { staticClasses as verticalNavigationSliderClasses };\n\nexport type HvVerticalNavigationSliderClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalNavigationSliderProps\n  extends Omit<HvListContainerProps, \"classes\"> {\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvVerticalNavigationSliderClasses;\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   * icon - the icon react element\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  /** The selected item id. */\n  selected?: string;\n  /** Triggered when the item is clicked. */\n  onNavigateToTarget?: (\n    event: React.MouseEvent<HTMLLIElement>,\n    item: NavigationData,\n  ) => void;\n  /** Triggered when the navigate to child button is clicked. */\n  onNavigateToChild?: (\n    event: React.MouseEvent<HTMLButtonElement>,\n    item: NavigationData,\n  ) => void;\n  /** Aria label to apply to the navigate to submenu button on the list items. */\n  forwardButtonAriaLabel?: string;\n}\n\nexport const HvVerticalNavigationSlider = (\n  props: HvVerticalNavigationSliderProps,\n) => {\n  const {\n    className,\n    classes: classesProp,\n    data,\n    selected,\n    onNavigateToTarget,\n    onNavigateToChild,\n    forwardButtonAriaLabel = \"Navigate to submenu\",\n    ...others\n  } = useDefaultProps(\"HvVerticalNavigationSlider\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  return (\n    <HvListContainer\n      interactive\n      className={cx(classes.listContainer, className)}\n      {...others}\n    >\n      {data?.map((item) => (\n        <HvListItem\n          key={item.id}\n          classes={{\n            root: classes.root,\n            selected: classes.listItemSelected,\n            focus: classes.listItemFocus,\n            disabled: classes.listItemDisabled,\n          }}\n          onClick={(event) => {\n            onNavigateToTarget?.(event, item);\n          }}\n          aria-label={item.label}\n          aria-current={\n            selected === item.id ? (item.href ? \"page\" : true) : undefined\n          }\n          selected={selected === item.id}\n          startAdornment={item.icon ? <div>{item.icon}</div> : undefined}\n          endAdornment={\n            item.data && item.data.length > 0 ? (\n              <HvButton\n                icon\n                onClick={(event) => {\n                  onNavigateToChild?.(event, item);\n                }}\n                className={classes.forwardButton}\n                aria-label={forwardButtonAriaLabel}\n              >\n                <DropRightXS />\n              </HvButton>\n            ) : undefined\n          }\n        >\n          <HvOverflowTooltip data={item.label} />\n        </HvListItem>\n      ))}\n    </HvListContainer>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AAiDa,MAAA,6BAA6B,CACxC,UACG;AACG,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,yBAAyB;AAAA,IACzB,GAAG;AAAA,EAAA,IACD,gBAAgB,8BAA8B,KAAK;AAEvD,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAG5C,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAW;AAAA,MACX,WAAW,GAAG,QAAQ,eAAe,SAAS;AAAA,MAC7C,GAAG;AAAA,MAEH,UAAA,MAAM,IAAI,CAAC,SACV;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,SAAS;AAAA,YACP,MAAM,QAAQ;AAAA,YACd,UAAU,QAAQ;AAAA,YAClB,OAAO,QAAQ;AAAA,YACf,UAAU,QAAQ;AAAA,UACpB;AAAA,UACA,SAAS,CAAC,UAAU;AAClB,iCAAqB,OAAO,IAAI;AAAA,UAClC;AAAA,UACA,cAAY,KAAK;AAAA,UACjB,gBACE,aAAa,KAAK,KAAM,KAAK,OAAO,SAAS,OAAQ;AAAA,UAEvD,UAAU,aAAa,KAAK;AAAA,UAC5B,gBAAgB,KAAK,2BAAQ,OAAK,EAAA,UAAA,KAAK,MAAK,IAAS;AAAA,UACrD,cACE,KAAK,QAAQ,KAAK,KAAK,SAAS,IAC9B;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAI;AAAA,cACJ,SAAS,CAAC,UAAU;AAClB,oCAAoB,OAAO,IAAI;AAAA,cACjC;AAAA,cACA,WAAW,QAAQ;AAAA,cACnB,cAAY;AAAA,cAEZ,8BAAC,aAAY,EAAA;AAAA,YAAA;AAAA,UAEb,IAAA;AAAA,UAGN,UAAC,oBAAA,mBAAA,EAAkB,MAAM,KAAK,OAAO;AAAA,QAAA;AAAA,QA/BhC,KAAK;AAAA,MAAA,CAiCb;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"NavigationSlider.js","sources":["../../../../src/VerticalNavigation/NavigationSlider/NavigationSlider.tsx"],"sourcesContent":["import { DropRightXS } from \"@hitachivantara/uikit-react-icons\";\nimport {\n  useDefaultProps,\n  type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\n\nimport { HvButton } from \"../../Button\";\nimport {\n  HvListContainer,\n  HvListContainerProps,\n  HvListItem,\n} from \"../../ListContainer\";\nimport { HvOverflowTooltip } from \"../../OverflowTooltip\";\nimport { NavigationData } from \"../VerticalNavigationContext\";\nimport { staticClasses, useClasses } from \"./NavigationSlider.styles\";\n\nexport { staticClasses as verticalNavigationSliderClasses };\n\nexport type HvVerticalNavigationSliderClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalNavigationSliderProps\n  extends Omit<HvListContainerProps, \"classes\"> {\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvVerticalNavigationSliderClasses;\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   * icon - the icon react element\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  /** The selected item id. */\n  selected?: string;\n  /** Triggered when the item is clicked. */\n  onNavigateToTarget?: (\n    event: React.MouseEvent<HTMLLIElement>,\n    item: NavigationData,\n  ) => void;\n  /** Triggered when the navigate to child button is clicked. */\n  onNavigateToChild?: (\n    event: React.MouseEvent<HTMLButtonElement>,\n    item: NavigationData,\n  ) => void;\n  /** Aria label to apply to the navigate to submenu button on the list items. */\n  forwardButtonAriaLabel?: string;\n}\n\nexport const HvVerticalNavigationSlider = (\n  props: HvVerticalNavigationSliderProps,\n) => {\n  const {\n    className,\n    classes: classesProp,\n    data,\n    selected,\n    onNavigateToTarget,\n    onNavigateToChild,\n    forwardButtonAriaLabel = \"Navigate to submenu\",\n    ...others\n  } = useDefaultProps(\"HvVerticalNavigationSlider\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  return (\n    <HvListContainer\n      interactive\n      className={cx(classes.listContainer, className)}\n      {...others}\n    >\n      {data?.map((item) => (\n        <HvListItem\n          key={item.id}\n          classes={{\n            root: classes.root,\n            selected: classes.listItemSelected,\n            focus: classes.listItemFocus,\n            disabled: classes.listItemDisabled,\n          }}\n          onClick={(event) => {\n            onNavigateToTarget?.(event, item);\n          }}\n          aria-label={item.label}\n          aria-current={\n            selected === item.id ? (item.href ? \"page\" : true) : undefined\n          }\n          selected={selected === item.id}\n          startAdornment={item.icon ? <div>{item.icon}</div> : undefined}\n          endAdornment={\n            item.data && item.data.length > 0 ? (\n              <HvButton\n                icon\n                onClick={(event) => {\n                  onNavigateToChild?.(event, item);\n                }}\n                className={classes.forwardButton}\n                aria-label={forwardButtonAriaLabel}\n              >\n                <DropRightXS />\n              </HvButton>\n            ) : undefined\n          }\n        >\n          <HvOverflowTooltip data={item.label} />\n        </HvListItem>\n      ))}\n    </HvListContainer>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AAmDa,MAAA,6BAA6B,CACxC,UACG;AACG,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,yBAAyB;AAAA,IACzB,GAAG;AAAA,EAAA,IACD,gBAAgB,8BAA8B,KAAK;AAEvD,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAG5C,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAW;AAAA,MACX,WAAW,GAAG,QAAQ,eAAe,SAAS;AAAA,MAC7C,GAAG;AAAA,MAEH,UAAA,MAAM,IAAI,CAAC,SACV;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,SAAS;AAAA,YACP,MAAM,QAAQ;AAAA,YACd,UAAU,QAAQ;AAAA,YAClB,OAAO,QAAQ;AAAA,YACf,UAAU,QAAQ;AAAA,UACpB;AAAA,UACA,SAAS,CAAC,UAAU;AAClB,iCAAqB,OAAO,IAAI;AAAA,UAClC;AAAA,UACA,cAAY,KAAK;AAAA,UACjB,gBACE,aAAa,KAAK,KAAM,KAAK,OAAO,SAAS,OAAQ;AAAA,UAEvD,UAAU,aAAa,KAAK;AAAA,UAC5B,gBAAgB,KAAK,2BAAQ,OAAK,EAAA,UAAA,KAAK,MAAK,IAAS;AAAA,UACrD,cACE,KAAK,QAAQ,KAAK,KAAK,SAAS,IAC9B;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAI;AAAA,cACJ,SAAS,CAAC,UAAU;AAClB,oCAAoB,OAAO,IAAI;AAAA,cACjC;AAAA,cACA,WAAW,QAAQ;AAAA,cACnB,cAAY;AAAA,cAEZ,8BAAC,aAAY,EAAA;AAAA,YAAA;AAAA,UAEb,IAAA;AAAA,UAGN,UAAC,oBAAA,mBAAA,EAAkB,MAAM,KAAK,OAAO;AAAA,QAAA;AAAA,QA/BhC,KAAK;AAAA,MAAA,CAiCb;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/esm/VerticalNavigation/NavigationSlider/NavigationSlider.styles.js

@@ -1,5 +1,5 @@
+import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-import { createClasses } from "@hitachivantara/uikit-react-shared";
 const { staticClasses, useClasses } = createClasses(
   "HvVerticalNavigationSlider",
   {

package/dist/esm/VerticalNavigation/NavigationSlider/NavigationSlider.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationSlider.styles.js","sources":["../../../../src/VerticalNavigation/NavigationSlider/NavigationSlider.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvVerticalNavigationSlider\",\n  {\n    root: {\n      display: \"flex\",\n      alignItems: \"center\",\n      borderLeft: `4px solid transparent`,\n      minHeight: \"48px\",\n      marginBottom: \"8px\",\n      \"& > button\": {\n        marginLeft: \"auto\",\n      },\n    },\n    listItemSelected: {\n      background: theme.colors.atmo3,\n      borderLeft: `4px solid ${theme.colors.secondary}`,\n    },\n    listItemFocus: {\n      background: theme.colors.atmo3,\n    },\n    forwardButton: {},\n    listContainer: {},\n    listItemDisabled: {},\n  },\n);\n"],"names":[],"mappings":";;AAIa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,YAAY;AAAA,MACZ,WAAW;AAAA,MACX,cAAc;AAAA,MACd,cAAc;AAAA,QACZ,YAAY;AAAA,MACd;AAAA,IACF;AAAA,IACA,kBAAkB;AAAA,MAChB,YAAY,MAAM,OAAO;AAAA,MACzB,YAAY,aAAa,MAAM,OAAO,SAAS;AAAA,IACjD;AAAA,IACA,eAAe;AAAA,MACb,YAAY,MAAM,OAAO;AAAA,IAC3B;AAAA,IACA,eAAe,CAAC;AAAA,IAChB,eAAe,CAAC;AAAA,IAChB,kBAAkB,CAAC;AAAA,EACrB;AACF;"}
+{"version":3,"file":"NavigationSlider.styles.js","sources":["../../../../src/VerticalNavigation/NavigationSlider/NavigationSlider.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvVerticalNavigationSlider\",\n  {\n    root: {\n      display: \"flex\",\n      alignItems: \"center\",\n      borderLeft: `4px solid transparent`,\n      minHeight: \"48px\",\n      marginBottom: \"8px\",\n      \"& > button\": {\n        marginLeft: \"auto\",\n      },\n    },\n    listItemSelected: {\n      background: theme.colors.atmo3,\n      borderLeft: `4px solid ${theme.colors.secondary}`,\n    },\n    listItemFocus: {\n      background: theme.colors.atmo3,\n    },\n    forwardButton: {},\n    listContainer: {},\n    listItemDisabled: {},\n  },\n);\n"],"names":[],"mappings":";;AAGa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,YAAY;AAAA,MACZ,WAAW;AAAA,MACX,cAAc;AAAA,MACd,cAAc;AAAA,QACZ,YAAY;AAAA,MACd;AAAA,IACF;AAAA,IACA,kBAAkB;AAAA,MAChB,YAAY,MAAM,OAAO;AAAA,MACzB,YAAY,aAAa,MAAM,OAAO,SAAS;AAAA,IACjD;AAAA,IACA,eAAe;AAAA,MACb,YAAY,MAAM,OAAO;AAAA,IAC3B;AAAA,IACA,eAAe,CAAC;AAAA,IAChB,eAAe,CAAC;AAAA,IAChB,kBAAkB,CAAC;AAAA,EACrB;AACF;"}

package/dist/esm/VerticalNavigation/TreeView/TreeView.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef, useRef, useState, useCallback, useMemo } from "react";
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import { useControlled } from "../../hooks/useControlled.js";
-import { useDefaultProps } from "../../hooks/useDefaultProps.js";
 import { useForkRef } from "../../hooks/useForkRef.js";
 import { useUniqueId } from "../../hooks/useUniqueId.js";
 import { DescendantProvider } from "../../TreeView/internals/DescendantProvider.js";