@hitachivantara/uikit-react-core 5.27.6 → 5.27.7

package/dist/cjs/components/VerticalNavigation/Navigation/Navigation.cjs.map

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

package/dist/cjs/components/VerticalNavigation/NavigationPopup/NavigationPopupContainer.cjs

@@ -1,9 +1,9 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const material = require("@mui/material");
 const VerticalNavigation = require("../VerticalNavigation.cjs");
 const NavigationPopup_styles = require("./NavigationPopup.styles.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const NavigationPopupContainer = ({
   anchorEl,
   onClose,
@@ -17,23 +17,7 @@ const NavigationPopupContainer = ({
   const handleClickAway = () => {
     onClose == null ? void 0 : onClose();
   };
-  return /* @__PURE__ */ jsxRuntime.jsx(NavigationPopup_styles.StyledPopper, {
-    open: true,
-    anchorEl,
-    placement: "right-start",
-    ...others,
-    children: /* @__PURE__ */ jsxRuntime.jsx(material.ClickAwayListener, {
-      onClickAway: handleClickAway,
-      children: /* @__PURE__ */ jsxRuntime.jsx("div", {
-        className: classes.container,
-        children: /* @__PURE__ */ jsxRuntime.jsx(VerticalNavigation.HvVerticalNavigation, {
-          open: true,
-          useIcons: true,
-          children
-        })
-      })
-    })
-  });
+  return /* @__PURE__ */ jsxRuntime.jsx(NavigationPopup_styles.StyledPopper, { open: true, anchorEl, placement: "right-start", ...others, children: /* @__PURE__ */ jsxRuntime.jsx(material.ClickAwayListener, { onClickAway: handleClickAway, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.container, children: /* @__PURE__ */ jsxRuntime.jsx(VerticalNavigation.HvVerticalNavigation, { open: true, useIcons: true, children }) }) }) });
 };
 exports.verticalNavigationPopupClasses = NavigationPopup_styles.staticClasses;
 exports.NavigationPopupContainer = NavigationPopupContainer;

package/dist/cjs/components/VerticalNavigation/NavigationPopup/NavigationPopupContainer.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationPopupContainer.cjs","sources":["../../../../../src/components/VerticalNavigation/NavigationPopup/NavigationPopupContainer.tsx"],"sourcesContent":["import { ClickAwayListener } from \"@mui/material\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvVerticalNavigation } from \"../VerticalNavigation\";\n\nimport {\n  StyledPopper,\n  staticClasses,\n  useClasses,\n} 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  ...others\n}: NavigationPopupContainerProps) => {\n  const { classes } = useClasses(classesProp);\n\n  const handleClickAway = () => {\n    onClose?.();\n  };\n\n  return (\n    <StyledPopper open anchorEl={anchorEl} placement=\"right-start\" {...others}>\n      <ClickAwayListener onClickAway={handleClickAway}>\n        <div className={classes.container}>\n          <HvVerticalNavigation open useIcons>\n            {children}\n          </HvVerticalNavigation>\n        </div>\n      </ClickAwayListener>\n    </StyledPopper>\n  );\n};\n"],"names":["NavigationPopupContainer","anchorEl","onClose","children","classes","classesProp","others","useClasses","handleClickAway","StyledPopper","open","placement","ClickAwayListener","onClickAway","className","container","HvVerticalNavigation","useIcons"],"mappings":";;;;;;AAuBO,MAAMA,2BAA2BA,CAAC;AAAA,EACvCC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,SAASC;AAAAA,EACT,GAAGC;AAC0B,MAAM;AAC7B,QAAA;AAAA,IAAEF;AAAAA,EAAAA,IAAYG,uBAAAA,WAAWF,WAAW;AAE1C,QAAMG,kBAAkBA,MAAM;AAClB;AAAA,EAAA;AAGZ,wCACGC,uBAAAA,cAAY;AAAA,IAACC,MAAI;AAAA,IAACT;AAAAA,IAAoBU,WAAU;AAAA,IAAa,GAAKL;AAAAA,IAAMH,yCACtES,4BAAiB;AAAA,MAACC,aAAaL;AAAAA,MAAgBL,yCAC9C,OAAA;AAAA,QAAKW,WAAWV,QAAQW;AAAAA,QAAUZ,yCAC/Ba,yCAAoB;AAAA,UAACN,MAAI;AAAA,UAACO,UAAQ;AAAA,UAAAd;AAAAA,QAAAA,CAEb;AAAA,MAAA,CACnB;AAAA,IAAA,CACY;AAAA,EAAA,CACP;AAElB;;;"}
+{"version":3,"file":"NavigationPopupContainer.cjs","sources":["../../../../../src/components/VerticalNavigation/NavigationPopup/NavigationPopupContainer.tsx"],"sourcesContent":["import { ClickAwayListener } from \"@mui/material\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvVerticalNavigation } from \"../VerticalNavigation\";\n\nimport {\n  StyledPopper,\n  staticClasses,\n  useClasses,\n} 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  ...others\n}: NavigationPopupContainerProps) => {\n  const { classes } = useClasses(classesProp);\n\n  const handleClickAway = () => {\n    onClose?.();\n  };\n\n  return (\n    <StyledPopper open anchorEl={anchorEl} placement=\"right-start\" {...others}>\n      <ClickAwayListener onClickAway={handleClickAway}>\n        <div className={classes.container}>\n          <HvVerticalNavigation open useIcons>\n            {children}\n          </HvVerticalNavigation>\n        </div>\n      </ClickAwayListener>\n    </StyledPopper>\n  );\n};\n"],"names":["NavigationPopupContainer","anchorEl","onClose","children","classes","classesProp","others","useClasses","handleClickAway","jsx","StyledPopper","ClickAwayListener","container","HvVerticalNavigation"],"mappings":";;;;;;AAuBO,MAAMA,2BAA2BA,CAAC;AAAA,EACvCC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,SAASC;AAAAA,EACT,GAAGC;AAC0B,MAAM;AAC7B,QAAA;AAAA,IAAEF;AAAAA,EAAAA,IAAYG,uBAAAA,WAAWF,WAAW;AAE1C,QAAMG,kBAAkBA,MAAM;AAClB;AAAA,EAAA;AAIV,SAAAC,2BAAAA,IAACC,uBAAAA,cAAa,EAAA,MAAI,MAAC,UAAoB,WAAU,eAAc,GAAIJ,QACjE,UAACG,+BAAAE,SAAAA,mBAAA,EAAkB,aAAaH,iBAC9B,UAACC,2BAAAA,IAAA,OAAA,EAAI,WAAWL,QAAQQ,WACtB,UAAAH,2BAAAA,IAACI,mBAAAA,sBAAqB,EAAA,MAAI,MAAC,UAAQ,MAChCV,SAAAA,CACH,EACF,CAAA,EAAA,CACF,EACF,CAAA;AAEJ;;;"}

package/dist/cjs/components/VerticalNavigation/NavigationSlider/NavigationSlider.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const NavigationSlider_styles = require("./NavigationSlider.styles.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const Button = require("../../Button/Button.cjs");
 const ListContainer = require("../../ListContainer/ListContainer.cjs");
 const ListItem = require("../../ListContainer/ListItem/ListItem.cjs");
@@ -19,37 +19,15 @@ const HvVerticalNavigationSlider = ({
   const {
     classes
   } = NavigationSlider_styles.useClasses(classesProp);
-  return /* @__PURE__ */ jsxRuntime.jsx(ListContainer.HvListContainer, {
-    interactive: true,
-    id,
-    children: data && data.map((item) => /* @__PURE__ */ jsxRuntime.jsx(ListItem.HvListItem, {
-      classes: {
-        root: classes.root,
-        selected: classes.listItemSelected,
-        focus: classes.listItemFocus
-      },
-      onClick: (event) => {
-        onNavigateToTarget == null ? void 0 : onNavigateToTarget(event, item);
-      },
-      "aria-label": item.label,
-      "aria-current": selected === item.id ? item.href ? "page" : true : void 0,
-      selected: selected === item.id,
-      startAdornment: item.icon ? /* @__PURE__ */ jsxRuntime.jsx("div", {
-        children: item.icon
-      }) : void 0,
-      endAdornment: item.data && item.data.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(Button.HvButton, {
-        icon: true,
-        onClick: (event) => {
-          onNavigateToChild == null ? void 0 : onNavigateToChild(event, item);
-        },
-        "aria-label": forwardButtonAriaLabel,
-        children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.DropRightXS, {})
-      }) : void 0,
-      children: /* @__PURE__ */ jsxRuntime.jsx(OverflowTooltip.HvOverflowTooltip, {
-        data: item.label
-      })
-    }, item.id))
-  });
+  return /* @__PURE__ */ jsxRuntime.jsx(ListContainer.HvListContainer, { interactive: true, id, children: data && data.map((item) => /* @__PURE__ */ jsxRuntime.jsx(ListItem.HvListItem, { classes: {
+    root: classes.root,
+    selected: classes.listItemSelected,
+    focus: classes.listItemFocus
+  }, onClick: (event) => {
+    onNavigateToTarget == null ? void 0 : onNavigateToTarget(event, item);
+  }, "aria-label": item.label, "aria-current": selected === item.id ? item.href ? "page" : true : void 0, selected: selected === item.id, startAdornment: item.icon ? /* @__PURE__ */ jsxRuntime.jsx("div", { children: item.icon }) : void 0, endAdornment: item.data && item.data.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(Button.HvButton, { icon: true, onClick: (event) => {
+    onNavigateToChild == null ? void 0 : onNavigateToChild(event, item);
+  }, "aria-label": forwardButtonAriaLabel, children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.DropRightXS, {}) }) : void 0, children: /* @__PURE__ */ jsxRuntime.jsx(OverflowTooltip.HvOverflowTooltip, { data: item.label }) }, item.id)) });
 };
 exports.verticalNavigationSliderClasses = NavigationSlider_styles.staticClasses;
 exports.HvVerticalNavigationSlider = HvVerticalNavigationSlider;

package/dist/cjs/components/VerticalNavigation/NavigationSlider/NavigationSlider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationSlider.cjs","sources":["../../../../../src/components/VerticalNavigation/NavigationSlider/NavigationSlider.tsx"],"sourcesContent":["import { DropRightXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvButton } from \"@core/components/Button\";\nimport { HvListContainer, HvListItem } from \"@core/components/ListContainer\";\nimport { HvOverflowTooltip } from \"@core/components/OverflowTooltip\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { NavigationData } from \"../VerticalNavigationContext\";\n\nimport { staticClasses, useClasses } from \"./NavigationSlider.styles\";\n\nexport { staticClasses as verticalNavigationSliderClasses };\n\nexport type HvVerticalNavigationSliderClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalNavigationSliderProps {\n  /**\n   * Id to be applied to the root node of the panel.\n   */\n  id?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\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  /**\n   * The selected item id.\n   */\n  selected?: string;\n  /**\n   * Triggered when the item is clicked.\n   */\n  onNavigateToTarget?: (\n    event: React.MouseEvent<HTMLLIElement>,\n    item: NavigationData\n  ) => void;\n  /**\n   * Triggered when the navigate to child button is clicked.\n   */\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  id,\n  classes: classesProp,\n  data,\n  selected,\n  onNavigateToTarget,\n  onNavigateToChild,\n  forwardButtonAriaLabel = \"Navigate to submenu\",\n}: HvVerticalNavigationSliderProps) => {\n  const { classes } = useClasses(classesProp);\n\n  return (\n    <HvListContainer interactive id={id}>\n      {data &&\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            }}\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                  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":["HvVerticalNavigationSlider","id","classes","classesProp","data","selected","onNavigateToTarget","onNavigateToChild","forwardButtonAriaLabel","useClasses","HvListContainer","interactive","children","map","item","HvListItem","root","listItemSelected","focus","listItemFocus","onClick","event","label","href","undefined","startAdornment","icon","_jsx","endAdornment","length","HvButton","DropRightXS","HvOverflowTooltip"],"mappings":";;;;;;;;;AAyDO,MAAMA,6BAA6BA,CAAC;AAAA,EACzCC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,yBAAyB;AACM,MAAM;AAC/B,QAAA;AAAA,IAAEN;AAAAA,EAAAA,IAAYO,wBAAAA,WAAWN,WAAW;AAE1C,wCACGO,cAAAA,iBAAe;AAAA,IAACC,aAAW;AAAA,IAACV;AAAAA,IAAOW,UACjCR,QACCA,KAAKS,IAAKC,CAAAA,wCACPC,qBAAU;AAAA,MAETb,SAAS;AAAA,QACPc,MAAMd,QAAQc;AAAAA,QACdX,UAAUH,QAAQe;AAAAA,QAClBC,OAAOhB,QAAQiB;AAAAA,MACjB;AAAA,MACAC,SAAUC,CAAU,UAAA;AAClBf,iEAAqBe,OAAOP;AAAAA,MAC9B;AAAA,MACA,cAAYA,KAAKQ;AAAAA,MACjB,gBACEjB,aAAaS,KAAKb,KAAMa,KAAKS,OAAO,SAAS,OAAQC;AAAAA,MAEvDnB,UAAUA,aAAaS,KAAKb;AAAAA,MAC5BwB,gBAAgBX,KAAKY,OAAOC,2BAAAA,IAAA,OAAA;AAAA,QAAAf,UAAME,KAAKY;AAAAA,MAAU,CAAA,IAAIF;AAAAA,MACrDI,cACEd,KAAKV,QAAQU,KAAKV,KAAKyB,SAAS,mCAC7BC,iBAAQ;AAAA,QACPJ,MAAI;AAAA,QACJN,SAAUC,CAAU,UAAA;AAClBd,iEAAoBc,OAAOP;AAAAA,QAC7B;AAAA,QACA,cAAYN;AAAAA,QAAuBI,UAEnCe,2BAAAA,IAACI,gBAAa,aAAA,EAAA;AAAA,MACN,CAAA,IACRP;AAAAA,MACLZ,yCAEAoB,mCAAiB;AAAA,QAAC5B,MAAMU,KAAKQ;AAAAA,MAAAA,CAAQ;AAAA,IAAA,GA7BjCR,KAAKb,EA8BA,CACb;AAAA,EAAA,CACY;AAErB;;;"}
+{"version":3,"file":"NavigationSlider.cjs","sources":["../../../../../src/components/VerticalNavigation/NavigationSlider/NavigationSlider.tsx"],"sourcesContent":["import { DropRightXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvButton } from \"@core/components/Button\";\nimport { HvListContainer, HvListItem } from \"@core/components/ListContainer\";\nimport { HvOverflowTooltip } from \"@core/components/OverflowTooltip\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { NavigationData } from \"../VerticalNavigationContext\";\n\nimport { staticClasses, useClasses } from \"./NavigationSlider.styles\";\n\nexport { staticClasses as verticalNavigationSliderClasses };\n\nexport type HvVerticalNavigationSliderClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalNavigationSliderProps {\n  /**\n   * Id to be applied to the root node of the panel.\n   */\n  id?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\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  /**\n   * The selected item id.\n   */\n  selected?: string;\n  /**\n   * Triggered when the item is clicked.\n   */\n  onNavigateToTarget?: (\n    event: React.MouseEvent<HTMLLIElement>,\n    item: NavigationData\n  ) => void;\n  /**\n   * Triggered when the navigate to child button is clicked.\n   */\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  id,\n  classes: classesProp,\n  data,\n  selected,\n  onNavigateToTarget,\n  onNavigateToChild,\n  forwardButtonAriaLabel = \"Navigate to submenu\",\n}: HvVerticalNavigationSliderProps) => {\n  const { classes } = useClasses(classesProp);\n\n  return (\n    <HvListContainer interactive id={id}>\n      {data &&\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            }}\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                  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":["HvVerticalNavigationSlider","id","classes","classesProp","data","selected","onNavigateToTarget","onNavigateToChild","forwardButtonAriaLabel","useClasses","jsx","HvListContainer","map","item","HvListItem","root","listItemSelected","focus","listItemFocus","event","label","href","undefined","icon","length","HvButton","DropRightXS","HvOverflowTooltip"],"mappings":";;;;;;;;;AAyDO,MAAMA,6BAA6BA,CAAC;AAAA,EACzCC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,yBAAyB;AACM,MAAM;AAC/B,QAAA;AAAA,IAAEN;AAAAA,EAAAA,IAAYO,wBAAAA,WAAWN,WAAW;AAGxC,SAAAO,2BAAAA,IAACC,cAAAA,iBAAgB,EAAA,aAAW,MAAC,IAC1BP,UACCA,QAAAA,KAAKQ,IAAKC,CAAAA,SACPH,2BAAAA,IAAAI,SAAAA,YAAA,EAEC,SAAS;AAAA,IACPC,MAAMb,QAAQa;AAAAA,IACdV,UAAUH,QAAQc;AAAAA,IAClBC,OAAOf,QAAQgB;AAAAA,EAAAA,GAEjB,SAAUC,CAAU,UAAA;AAClBb,6DAAqBa,OAAON;AAAAA,EAAI,GAElC,cAAYA,KAAKO,OACjB,gBACEf,aAAaQ,KAAKZ,KAAMY,KAAKQ,OAAO,SAAS,OAAQC,QAEvD,UAAUjB,aAAaQ,KAAKZ,IAC5B,gBAAgBY,KAAKU,OAAOb,2BAAAA,IAAC,SAAKG,UAAKU,KAAAA,KAAK,CAAA,IAASD,QACrD,cACET,KAAKT,QAAQS,KAAKT,KAAKoB,SAAS,IAC9Bd,2BAAAA,IAACe,mBACC,MAAI,MACJ,SAAUN,CAAU,UAAA;AAClBZ,2DAAoBY,OAAON;AAAAA,EAAI,GAEjC,cAAYL,wBAEZ,UAACE,2BAAA,IAAAgB,6BAAA,CAAA,CAAW,EACd,CAAA,IACEJ,QAGN,UAACZ,2BAAA,IAAAiB,mCAAA,EAAkB,MAAMd,KAAKO,MAAAA,CAAM,KA7B/BP,KAAKZ,EA8BZ,CACD,EACL,CAAA;AAEJ;;;"}

package/dist/cjs/components/VerticalNavigation/TreeView/IconWrapper/IconWrapper.cjs

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const React = require("react");
 const VerticalNavigationContext = require("../../VerticalNavigationContext.cjs");
 const IconWrapper_styles = require("./IconWrapper.styles.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const TooltipWrapper = require("../TooltipWrapper/TooltipWrapper.cjs");
 const Avatar = require("../../../Avatar/Avatar.cjs");
 const IconWrapper = ({
@@ -18,24 +18,12 @@ const IconWrapper = ({
   const {
     hasAnyChildWithData
   } = React.useContext(VerticalNavigationContext.VerticalNavigationContext);
-  return /* @__PURE__ */ jsxRuntime.jsx(TooltipWrapper.TooltipWrapper, {
-    showTooltip: !hasChildren && !isOpen && !disableTooltip,
-    label,
-    children: /* @__PURE__ */ jsxRuntime.jsxs(IconWrapper_styles.StyledIconsContainer, {
-      hasAnyChildWithData,
-      children: [showAvatar ? /* @__PURE__ */ jsxRuntime.jsx(Avatar.HvAvatar, {
-        variant: "square",
-        size: "xs",
-        backgroundColor: "secondary_80",
-        style: {
-          fontSize: "15px"
-        },
-        children: label.substring(0, 1)
-      }) : icon, hasChildren && !isOpen ? /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Forwards, {
-        iconSize: "XS"
-      }) : hasAnyChildWithData && !isOpen && /* @__PURE__ */ jsxRuntime.jsx(IconWrapper_styles.SpacerDiv, {})]
-    })
-  });
+  return /* @__PURE__ */ jsxRuntime.jsx(TooltipWrapper.TooltipWrapper, { showTooltip: !hasChildren && !isOpen && !disableTooltip, label, children: /* @__PURE__ */ jsxRuntime.jsxs(IconWrapper_styles.StyledIconsContainer, { hasAnyChildWithData, children: [
+    showAvatar ? /* @__PURE__ */ jsxRuntime.jsx(Avatar.HvAvatar, { variant: "square", size: "xs", backgroundColor: "secondary_80", style: {
+      fontSize: "15px"
+    }, children: label.substring(0, 1) }) : icon,
+    hasChildren && !isOpen ? /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Forwards, { iconSize: "XS" }) : hasAnyChildWithData && !isOpen && /* @__PURE__ */ jsxRuntime.jsx(IconWrapper_styles.SpacerDiv, {})
+  ] }) });
 };
 exports.IconWrapper = IconWrapper;
 //# sourceMappingURL=IconWrapper.cjs.map

package/dist/cjs/components/VerticalNavigation/TreeView/IconWrapper/IconWrapper.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"IconWrapper.cjs","sources":["../../../../../../src/components/VerticalNavigation/TreeView/IconWrapper/IconWrapper.tsx"],"sourcesContent":["import { Forwards } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useContext } from \"react\";\n\nimport { HvAvatar } from \"@core/components/Avatar\";\n\nimport { VerticalNavigationContext } from \"../../VerticalNavigationContext\";\nimport { TooltipWrapper } from \"../TooltipWrapper\";\nimport { SpacerDiv, StyledIconsContainer } from \"./IconWrapper.styles\";\n\nexport const IconWrapper = ({\n  icon,\n  label,\n  hasChildren,\n  showAvatar,\n  isOpen,\n  disableTooltip,\n}) => {\n  const { hasAnyChildWithData } = useContext(VerticalNavigationContext);\n  return (\n    <TooltipWrapper\n      showTooltip={!hasChildren && !isOpen && !disableTooltip}\n      label={label}\n    >\n      <StyledIconsContainer hasAnyChildWithData={hasAnyChildWithData}>\n        {showAvatar ? (\n          <HvAvatar\n            variant=\"square\"\n            size=\"xs\"\n            backgroundColor=\"secondary_80\"\n            style={{ fontSize: \"15px\" }}\n          >\n            {label.substring(0, 1)}\n          </HvAvatar>\n        ) : (\n          icon\n        )}\n\n        {hasChildren && !isOpen ? (\n          <Forwards iconSize=\"XS\" />\n        ) : (\n          hasAnyChildWithData && !isOpen && <SpacerDiv />\n        )}\n      </StyledIconsContainer>\n    </TooltipWrapper>\n  );\n};\n"],"names":["IconWrapper","icon","label","hasChildren","showAvatar","isOpen","disableTooltip","hasAnyChildWithData","useContext","VerticalNavigationContext","TooltipWrapper","showTooltip","children","StyledIconsContainer","_jsx","HvAvatar","variant","size","backgroundColor","style","fontSize","substring","Forwards","iconSize","SpacerDiv"],"mappings":";;;;;;;;;AAUO,MAAMA,cAAcA,CAAC;AAAA,EAC1BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AACF,MAAM;AACE,QAAA;AAAA,IAAEC;AAAAA,EAAAA,IAAwBC,MAAAA,WAAWC,0BAAAA,yBAAyB;AACpE,wCACGC,eAAAA,gBAAc;AAAA,IACbC,aAAa,CAACR,eAAe,CAACE,UAAU,CAACC;AAAAA,IACzCJ;AAAAA,IAAaU,0CAEZC,yCAAoB;AAAA,MAACN;AAAAA,MAAyCK,UAC5DR,CAAAA,aACCU,2BAAAA,IAACC,iBAAQ;AAAA,QACPC,SAAQ;AAAA,QACRC,MAAK;AAAA,QACLC,iBAAgB;AAAA,QAChBC,OAAO;AAAA,UAAEC,UAAU;AAAA,QAAO;AAAA,QAAER,UAE3BV,MAAMmB,UAAU,GAAG,CAAC;AAAA,MAAA,CACb,IAEVpB,MAGDE,eAAe,CAACE,wCACdiB,gBAAAA,UAAQ;AAAA,QAACC,UAAS;AAAA,MAAA,CAAM,IAEzBhB,uBAAuB,CAACF,UAAWmB,2BAAAA,IAAAA,mBAAAA,WAAS,CAAA,CAAE,CAC/C;AAAA,IAAA,CACmB;AAAA,EAAA,CACR;AAEpB;;"}
+{"version":3,"file":"IconWrapper.cjs","sources":["../../../../../../src/components/VerticalNavigation/TreeView/IconWrapper/IconWrapper.tsx"],"sourcesContent":["import { Forwards } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useContext } from \"react\";\n\nimport { HvAvatar } from \"@core/components/Avatar\";\n\nimport { VerticalNavigationContext } from \"../../VerticalNavigationContext\";\nimport { TooltipWrapper } from \"../TooltipWrapper\";\nimport { SpacerDiv, StyledIconsContainer } from \"./IconWrapper.styles\";\n\nexport const IconWrapper = ({\n  icon,\n  label,\n  hasChildren,\n  showAvatar,\n  isOpen,\n  disableTooltip,\n}) => {\n  const { hasAnyChildWithData } = useContext(VerticalNavigationContext);\n  return (\n    <TooltipWrapper\n      showTooltip={!hasChildren && !isOpen && !disableTooltip}\n      label={label}\n    >\n      <StyledIconsContainer hasAnyChildWithData={hasAnyChildWithData}>\n        {showAvatar ? (\n          <HvAvatar\n            variant=\"square\"\n            size=\"xs\"\n            backgroundColor=\"secondary_80\"\n            style={{ fontSize: \"15px\" }}\n          >\n            {label.substring(0, 1)}\n          </HvAvatar>\n        ) : (\n          icon\n        )}\n\n        {hasChildren && !isOpen ? (\n          <Forwards iconSize=\"XS\" />\n        ) : (\n          hasAnyChildWithData && !isOpen && <SpacerDiv />\n        )}\n      </StyledIconsContainer>\n    </TooltipWrapper>\n  );\n};\n"],"names":["IconWrapper","icon","label","hasChildren","showAvatar","isOpen","disableTooltip","hasAnyChildWithData","useContext","VerticalNavigationContext","jsx","TooltipWrapper","jsxs","StyledIconsContainer","HvAvatar","fontSize","substring","Forwards","SpacerDiv"],"mappings":";;;;;;;;;AAUO,MAAMA,cAAcA,CAAC;AAAA,EAC1BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AACF,MAAM;AACE,QAAA;AAAA,IAAEC;AAAAA,EAAAA,IAAwBC,MAAAA,WAAWC,0BAAAA,yBAAyB;AACpE,SACGC,2BAAAA,IAAAC,eAAAA,gBAAA,EACC,aAAa,CAACR,eAAe,CAACE,UAAU,CAACC,gBACzC,OAEA,UAACM,2BAAAA,KAAAC,mBAAAA,sBAAA,EAAqB,qBACnBT,UAAAA;AAAAA,IACC,aAAAM,2BAAA,IAACI,mBACC,SAAQ,UACR,MAAK,MACL,iBAAgB,gBAChB,OAAO;AAAA,MAAEC,UAAU;AAAA,IAAA,GAElBb,UAAMc,MAAAA,UAAU,GAAG,CAAC,EACvB,CAAA,IAEAf;AAAAA,IAGDE,eAAe,CAACE,SACfK,2BAAA,IAACO,gBAAS,UAAA,EAAA,UAAS,MAAI,IAEvBV,uBAAuB,CAACF,UAAUK,2BAAAA,IAACQ,mBAAAA,WACpC,CAAA,CAAA;AAAA,EAAA,EACH,CAAA,EACF,CAAA;AAEJ;;"}

package/dist/cjs/components/VerticalNavigation/TreeView/TooltipWrapper/TooltipWrapper.cjs

@@ -10,13 +10,7 @@ const TooltipWrapper = ({
   placement = "right"
 }) => {
   if (showTooltip) {
-    return /* @__PURE__ */ jsxRuntime.jsx(Tooltip.HvTooltip, {
-      title: /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
-        children: label
-      }),
-      placement,
-      children
-    });
+    return /* @__PURE__ */ jsxRuntime.jsx(Tooltip.HvTooltip, { title: /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { children: label }), placement, children });
   }
   return children;
 };

package/dist/cjs/components/VerticalNavigation/TreeView/TooltipWrapper/TooltipWrapper.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TooltipWrapper.cjs","sources":["../../../../../../src/components/VerticalNavigation/TreeView/TooltipWrapper/TooltipWrapper.tsx"],"sourcesContent":["import { HvTooltip, HvTooltipPlacementType } from \"@core/components/Tooltip\";\nimport { HvTypography } from \"@core/components/Typography\";\n\ninterface TooltipWrapperProps {\n  showTooltip: boolean;\n  label: string;\n  children: React.ReactElement;\n  placement?: HvTooltipPlacementType;\n}\n\nexport const TooltipWrapper = ({\n  showTooltip,\n  label,\n  children,\n  placement = \"right\",\n}: TooltipWrapperProps) => {\n  if (showTooltip) {\n    return (\n      <HvTooltip\n        title={<HvTypography>{label}</HvTypography>}\n        placement={placement}\n      >\n        {children}\n      </HvTooltip>\n    );\n  }\n  return children;\n};\n"],"names":["TooltipWrapper","showTooltip","label","children","placement","HvTooltip","title","HvTypography"],"mappings":";;;;;AAUO,MAAMA,iBAAiBA,CAAC;AAAA,EAC7BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,YAAY;AACO,MAAM;AACzB,MAAIH,aAAa;AACf,0CACGI,QAAAA,WAAS;AAAA,MACRC,sCAAQC,yBAAY;AAAA,QAAAJ,UAAED;AAAAA,MAAAA,CAAoB;AAAA,MAC1CE;AAAAA,MAAqBD;AAAAA,IAAAA,CAGZ;AAAA,EAEf;AACOA,SAAAA;AACT;;"}
+{"version":3,"file":"TooltipWrapper.cjs","sources":["../../../../../../src/components/VerticalNavigation/TreeView/TooltipWrapper/TooltipWrapper.tsx"],"sourcesContent":["import { HvTooltip, HvTooltipPlacementType } from \"@core/components/Tooltip\";\nimport { HvTypography } from \"@core/components/Typography\";\n\ninterface TooltipWrapperProps {\n  showTooltip: boolean;\n  label: string;\n  children: React.ReactElement;\n  placement?: HvTooltipPlacementType;\n}\n\nexport const TooltipWrapper = ({\n  showTooltip,\n  label,\n  children,\n  placement = \"right\",\n}: TooltipWrapperProps) => {\n  if (showTooltip) {\n    return (\n      <HvTooltip\n        title={<HvTypography>{label}</HvTypography>}\n        placement={placement}\n      >\n        {children}\n      </HvTooltip>\n    );\n  }\n  return children;\n};\n"],"names":["TooltipWrapper","showTooltip","label","children","placement","jsx","HvTooltip","HvTypography"],"mappings":";;;;;AAUO,MAAMA,iBAAiBA,CAAC;AAAA,EAC7BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,YAAY;AACO,MAAM;AACzB,MAAIH,aAAa;AAEb,WAAAI,2BAAA,IAACC,qBACC,OAAOD,2BAAA,IAACE,2BAAcL,UAAM,MAAA,CAAA,GAC5B,WAECC,SACH,CAAA;AAAA,EAEJ;AACOA,SAAAA;AACT;;"}

package/dist/cjs/components/VerticalNavigation/TreeView/TreeView.cjs

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const useControlled = require("../../../hooks/useControlled.cjs");
 const useUniqueId = require("../../../hooks/useUniqueId.cjs");
@@ -7,7 +8,6 @@ const useForkRef = require("../../../hooks/useForkRef.cjs");
 const TreeViewContext = require("./TreeViewContext.cjs");
 const descendants = require("./descendants.cjs");
 const TreeView_styles = require("./TreeView.styles.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 function isPrintableCharacter(string) {
   return string && string.length === 1 && string.match(/\S/);
 }
@@ -618,31 +618,16 @@ const HvVerticalNavigationTreeView = React.forwardRef((props, ref) => {
     isDisabled,
     isChildSelected
   }), [isDisabled, isExpanded, isFocused, isSelected, isChildSelected]);
-  return /* @__PURE__ */ jsxRuntime.jsx(TreeViewContext.TreeViewControlContext.Provider, {
-    value: treeControlContext,
-    children: /* @__PURE__ */ jsxRuntime.jsx(TreeViewContext.TreeViewStateContext.Provider, {
-      value: treeStateContext,
-      children: /* @__PURE__ */ jsxRuntime.jsx(descendants.DescendantProvider, {
-        children: /* @__PURE__ */ jsxRuntime.jsx("ul", {
-          ref: handleRef,
-          id: idProp,
-          className: cx(classes.root, className),
-          ...treeviewMode && {
-            id: treeId,
-            role: "tree",
-            "aria-multiselectable": multiSelect,
-            "aria-activedescendant": activeDescendant,
-            tabIndex: 0,
-            onFocus: handleFocus,
-            onBlur: handleBlur,
-            onKeyDown: handleKeyDown
-          },
-          ...others,
-          children
-        })
-      })
-    })
-  });
+  return /* @__PURE__ */ jsxRuntime.jsx(TreeViewContext.TreeViewControlContext.Provider, { value: treeControlContext, children: /* @__PURE__ */ jsxRuntime.jsx(TreeViewContext.TreeViewStateContext.Provider, { value: treeStateContext, children: /* @__PURE__ */ jsxRuntime.jsx(descendants.DescendantProvider, { children: /* @__PURE__ */ jsxRuntime.jsx("ul", { ref: handleRef, id: idProp, className: cx(classes.root, className), ...treeviewMode && {
+    id: treeId,
+    role: "tree",
+    "aria-multiselectable": multiSelect,
+    "aria-activedescendant": activeDescendant,
+    tabIndex: 0,
+    onFocus: handleFocus,
+    onBlur: handleBlur,
+    onKeyDown: handleKeyDown
+  }, ...others, children }) }) }) });
 });
 exports.treeViewClasses = TreeView_styles.staticClasses;
 exports.HvVerticalNavigationTreeView = HvVerticalNavigationTreeView;