@hitachivantara/uikit-react-core 5.39.1 → 5.39.3

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

@@ -27,10 +27,36 @@ const createListHierarchy = (items, id, classes, mouseEnterHandler, disableToolt
   const itemMouseEnterHandler = (event) => {
     mouseEnterHandler?.(event, item);
   };
-  return /* @__PURE__ */ jsx(HvVerticalNavigationTreeViewItem, { id: setId(id, itemId), className: classes?.listItem, href, target, nodeId: itemId, label: /* @__PURE__ */ jsx(ItemText, {}), icon, payload: item, selectable, disabled, onMouseEnter: itemMouseEnterHandler, disableTooltip, children: children ? createListHierarchy(children, id, classes, mouseEnterHandler, disableTooltip) : void 0 }, itemId);
+  return /* @__PURE__ */ jsx(
+    HvVerticalNavigationTreeViewItem,
+    {
+      id: setId(id, itemId),
+      className: classes?.listItem,
+      href,
+      target,
+      nodeId: itemId,
+      label: /* @__PURE__ */ jsx(ItemText, {}),
+      icon,
+      payload: item,
+      selectable,
+      disabled,
+      onMouseEnter: itemMouseEnterHandler,
+      disableTooltip,
+      children: children ? createListHierarchy(
+        children,
+        id,
+        classes,
+        mouseEnterHandler,
+        disableTooltip
+      ) : void 0
+    },
+    itemId
+  );
 });
 const getAllParents = (items) => {
-  const parents = items.filter((item) => item.data != null && item.data.length > 0);
+  const parents = items.filter(
+    (item) => item.data != null && item.data.length > 0
+  );
   const childParents = parents.flatMap((item) => getAllParents(item.data));
   return [...parents, ...childParents];
 };
@@ -69,10 +95,7 @@ const HvVerticalNavigationTree = ({
   sliderForwardButtonAriaLabel = "Navigate to submenu",
   ...others
 }) => {
-  const {
-    classes,
-    cx
-  } = useClasses(classesProp);
+  const { classes, cx } = useClasses(classesProp);
   const [selected, setSelected] = useControlled(selectedProp, defaultSelected);
   const [expanded, setExpanded] = useControlled(expandedProp, () => {
     if (defaultExpanded === true) {
@@ -102,53 +125,71 @@ const HvVerticalNavigationTree = ({
     setParentSelected
   } = useContext(VerticalNavigationContext);
   const [navigationPopup, setNavigationPopup] = useState(null);
-  const handleChange = useCallback((event, selectedId, selectedItem) => {
-    if (useIcons && !isOpen && selectedItem.data) {
-      const currentEventTarget = event.currentTarget;
-      setNavigationPopup((prevState) => {
-        return prevState?.anchorEl === currentEventTarget ? null : {
+  const handleChange = useCallback(
+    (event, selectedId, selectedItem) => {
+      if (useIcons && !isOpen && selectedItem.data) {
+        const currentEventTarget = event.currentTarget;
+        setNavigationPopup((prevState) => {
+          return prevState?.anchorEl === currentEventTarget ? null : {
+            uniqueKey: uniqueId(),
+            anchorEl: currentEventTarget,
+            fixedMode: true,
+            data: selectedItem.data
+          };
+        });
+        event.stopPropagation();
+      } else {
+        setSelected(selectedId);
+        setExpanded((prevState) => {
+          if (!isOpen) {
+            return [...prevState, ...pathToElement(data, selectedId)];
+          }
+          return [...prevState];
+        });
+        setNavigationPopup(null);
+        if (onChange) {
+          onChange(event, selectedItem);
+        }
+      }
+    },
+    [onChange, setSelected, setExpanded, isOpen, useIcons, data]
+  );
+  const treeViewItemMouseEnterHandler = useCallback(
+    (event, item) => {
+      const isCollapsed = useIcons && !isOpen;
+      if (isCollapsed && item.data && !navigationPopup?.fixedMode) {
+        const currentEventTarget = event.currentTarget;
+        setNavigationPopup?.({
           uniqueKey: uniqueId(),
           anchorEl: currentEventTarget,
-          fixedMode: true,
-          data: selectedItem.data
-        };
-      });
-      event.stopPropagation();
-    } else {
-      setSelected(selectedId);
-      setExpanded((prevState) => {
-        if (!isOpen) {
-          return [...prevState, ...pathToElement(data, selectedId)];
-        }
-        return [...prevState];
-      });
-      setNavigationPopup(null);
-      if (onChange) {
-        onChange(event, selectedItem);
+          fixedMode: false,
+          data: item.data
+        });
+      } else if (isCollapsed && !item.data && !navigationPopup?.fixedMode) {
+        setNavigationPopup(null);
       }
-    }
-  }, [onChange, setSelected, setExpanded, isOpen, useIcons, data]);
-  const treeViewItemMouseEnterHandler = useCallback((event, item) => {
-    const isCollapsed = useIcons && !isOpen;
-    if (isCollapsed && item.data && !navigationPopup?.fixedMode) {
-      const currentEventTarget = event.currentTarget;
-      setNavigationPopup?.({
-        uniqueKey: uniqueId(),
-        anchorEl: currentEventTarget,
-        fixedMode: false,
-        data: item.data
-      });
-    } else if (isCollapsed && !item.data && !navigationPopup?.fixedMode) {
-      setNavigationPopup(null);
-    }
-  }, [isOpen, useIcons, navigationPopup]);
-  const handleToggle = useCallback((event, newExpanded) => {
-    setExpanded(newExpanded);
-    if (onToggle) {
-      onToggle(event, newExpanded);
-    }
-  }, [onToggle, setExpanded]);
-  const children = useMemo(() => data && createListHierarchy(data, id, classes, treeViewItemMouseEnterHandler, navigationPopup?.fixedMode), [classes, data, id, navigationPopup, treeViewItemMouseEnterHandler]);
+    },
+    [isOpen, useIcons, navigationPopup]
+  );
+  const handleToggle = useCallback(
+    (event, newExpanded) => {
+      setExpanded(newExpanded);
+      if (onToggle) {
+        onToggle(event, newExpanded);
+      }
+    },
+    [onToggle, setExpanded]
+  );
+  const children = useMemo(
+    () => data && createListHierarchy(
+      data,
+      id,
+      classes,
+      treeViewItemMouseEnterHandler,
+      navigationPopup?.fixedMode
+    ),
+    [classes, data, id, navigationPopup, treeViewItemMouseEnterHandler]
+  );
   useEffect(() => {
     if (!isOpen) {
       setNavigationPopup?.(null);
@@ -186,12 +227,67 @@ const HvVerticalNavigationTree = ({
   const handleNavigationPopupChange = (event, selectedItem) => {
     handleChange(event, selectedItem.id, selectedItem);
   };
-  return /* @__PURE__ */ jsx("nav", { id, className: cx(classes.root, {
-    [classes.collapsed]: !isOpen && !useIcons
-  }, className), onMouseLeave: handleStyledNavMouseLeave, ...others, children: slider ? /* @__PURE__ */ jsx(HvVerticalNavigationSlider, { data: parentItem.data || withParentData, selected, onNavigateToTarget: navigateToTargetHandler, onNavigateToChild: navigateToChildHandler, forwardButtonAriaLabel: sliderForwardButtonAriaLabel }) : /* @__PURE__ */ jsxs(HvVerticalNavigationTreeView, { id: setId(id, "tree"), className: classes.list, selectable: true, mode, collapsible, selected, onChange: handleChange, expanded, onToggle: handleToggle, children: [
-    useIcons && !isOpen && navigationPopup && /* @__PURE__ */ jsx(NavigationPopupContainer, { anchorEl: navigationPopup.anchorEl, onClose: handleNavigationPopupClose, className: classes.navigationPopup, children: /* @__PURE__ */ jsx(HvVerticalNavigationTree, { className: classes.popup, id: setId(id, "navigation-popup-tree"), collapsible: true, defaultExpanded: true, selected, data: navigationPopup.data, onChange: handleNavigationPopupChange, onMouseLeave: handleNavigationPopupMouseLeave }) }, navigationPopup.uniqueKey),
-    children
-  ] }) });
+  return /* @__PURE__ */ jsx(
+    "nav",
+    {
+      id,
+      className: cx(
+        classes.root,
+        { [classes.collapsed]: !isOpen && !useIcons },
+        className
+      ),
+      onMouseLeave: handleStyledNavMouseLeave,
+      ...others,
+      children: slider ? /* @__PURE__ */ jsx(
+        HvVerticalNavigationSlider,
+        {
+          data: parentItem.data || withParentData,
+          selected,
+          onNavigateToTarget: navigateToTargetHandler,
+          onNavigateToChild: navigateToChildHandler,
+          forwardButtonAriaLabel: sliderForwardButtonAriaLabel
+        }
+      ) : /* @__PURE__ */ jsxs(
+        HvVerticalNavigationTreeView,
+        {
+          id: setId(id, "tree"),
+          className: classes.list,
+          selectable: true,
+          mode,
+          collapsible,
+          selected,
+          onChange: handleChange,
+          expanded,
+          onToggle: handleToggle,
+          children: [
+            useIcons && !isOpen && navigationPopup && /* @__PURE__ */ jsx(
+              NavigationPopupContainer,
+              {
+                anchorEl: navigationPopup.anchorEl,
+                onClose: handleNavigationPopupClose,
+                className: classes.navigationPopup,
+                children: /* @__PURE__ */ jsx(
+                  HvVerticalNavigationTree,
+                  {
+                    className: classes.popup,
+                    id: setId(id, "navigation-popup-tree"),
+                    collapsible: true,
+                    defaultExpanded: true,
+                    selected,
+                    data: navigationPopup.data,
+                    onChange: handleNavigationPopupChange,
+                    onMouseLeave: handleNavigationPopupMouseLeave
+                  }
+                )
+              },
+              navigationPopup.uniqueKey
+            ),
+            children
+          ]
+        }
+      )
+    }
+  );
 };
 export {
   HvVerticalNavigationTree,

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

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

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

@@ -1,26 +1,26 @@
 import { theme } from "@hitachivantara/uikit-styles";
 import { createClasses } from "../../../utils/classes.js";
-const {
-  staticClasses,
-  useClasses
-} = createClasses("HvVerticalNavigationTree", {
-  root: {
-    display: "block",
-    background: theme.colors.atmo1,
-    overflowY: "auto"
-  },
-  list: {},
-  listItem: {},
-  collapsed: {
-    display: "none"
-  },
-  popup: {
-    boxShadow: "inset 5px 0 5px -3px rgb(65 65 65 / 12%)"
-  },
-  navigationPopup: {
-    boxShadow: "inset 5px 0 5px -3px rgb(65 65 65 / 12%)"
+const { staticClasses, useClasses } = createClasses(
+  "HvVerticalNavigationTree",
+  {
+    root: {
+      display: "block",
+      background: theme.colors.atmo1,
+      overflowY: "auto"
+    },
+    list: {},
+    listItem: {},
+    collapsed: {
+      display: "none"
+    },
+    popup: {
+      boxShadow: "inset 5px 0 5px -3px rgb(65 65 65 / 12%)"
+    },
+    navigationPopup: {
+      boxShadow: "inset 5px 0 5px -3px rgb(65 65 65 / 12%)"
+    }
   }
-});
+);
 export {
   staticClasses,
   useClasses

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

@@ -1 +1 @@
-{"version":3,"file":"Navigation.styles.js","sources":["../../../../../src/components/VerticalNavigation/Navigation/Navigation.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/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":["staticClasses","useClasses","createClasses","root","display","background","theme","colors","atmo1","overflowY","list","listItem","collapsed","popup","boxShadow","navigationPopup"],"mappings":";;AAIa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAC3C,4BACA;AAAA,EACEC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,YAAYC,MAAMC,OAAOC;AAAAA,IAEzBC,WAAW;AAAA,EACb;AAAA,EACAC,MAAM,CAAC;AAAA,EACPC,UAAU,CAAC;AAAA,EACXC,WAAW;AAAA,IACTR,SAAS;AAAA,EACX;AAAA,EACAS,OAAO;AAAA,IACLC,WAAW;AAAA,EACb;AAAA,EACAC,iBAAiB;AAAA,IACfD,WAAW;AAAA,EACb;AACF,CACF;"}
+{"version":3,"file":"Navigation.styles.js","sources":["../../../../../src/components/VerticalNavigation/Navigation/Navigation.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/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;"}

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

@@ -1,27 +1,22 @@
-import _styled from "@emotion/styled/base";
+import styled from "@emotion/styled";
 import { theme } from "@hitachivantara/uikit-styles";
 import { Popper } from "@mui/base";
 import { createClasses } from "../../../utils/classes.js";
-const StyledPopper = /* @__PURE__ */ _styled(Popper, process.env.NODE_ENV === "production" ? {
-  target: "es2o9lp0"
-} : {
-  target: "es2o9lp0",
-  label: "StyledPopper"
-})({
+const StyledPopper = styled(Popper)({
   zIndex: theme.zIndices.popover
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvVmVydGljYWxOYXZpZ2F0aW9uL05hdmlnYXRpb25Qb3B1cC9OYXZpZ2F0aW9uUG9wdXAuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFPcUIiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9WZXJ0aWNhbE5hdmlnYXRpb24vTmF2aWdhdGlvblBvcHVwL05hdmlnYXRpb25Qb3B1cC5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5cbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcbmltcG9ydCB7IFBvcHBlciB9IGZyb20gXCJAbXVpL2Jhc2VcIjtcblxuaW1wb3J0IHsgY3JlYXRlQ2xhc3NlcyB9IGZyb20gXCJAY29yZS91dGlscy9jbGFzc2VzXCI7XG5cbmNvbnN0IFN0eWxlZFBvcHBlciA9IHN0eWxlZChQb3BwZXIpKHtcbiAgekluZGV4OiB0aGVtZS56SW5kaWNlcy5wb3BvdmVyLFxufSk7XG5cbmV4cG9ydCB7IFN0eWxlZFBvcHBlciB9O1xuXG5leHBvcnQgY29uc3QgeyBzdGF0aWNDbGFzc2VzLCB1c2VDbGFzc2VzIH0gPSBjcmVhdGVDbGFzc2VzKFxuICBcIkh2VmVydGljYWxOYXZpZ2F0aW9uUG9wdXBcIixcbiAge1xuICAgIHBvcHVwOiB7fSxcbiAgICBjb250YWluZXI6IHtcbiAgICAgIG1hcmdpbkxlZnQ6IHRoZW1lLnNwYWNpbmcoXCJ4c1wiKSxcbiAgICB9LFxuICAgIHBvcHBlcjoge1xuICAgICAgekluZGV4OiB0aGVtZS56SW5kaWNlcy5wb3BvdmVyLFxuICAgIH0sXG4gIH1cbik7XG4iXX0= */");
-const {
-  staticClasses,
-  useClasses
-} = createClasses("HvVerticalNavigationPopup", {
-  popup: {},
-  container: {
-    marginLeft: theme.spacing("xs")
-  },
-  popper: {
-    zIndex: theme.zIndices.popover
-  }
 });
+const { staticClasses, useClasses } = createClasses(
+  "HvVerticalNavigationPopup",
+  {
+    popup: {},
+    container: {
+      marginLeft: theme.spacing("xs")
+    },
+    popper: {
+      zIndex: theme.zIndices.popover
+    }
+  }
+);
 export {
   StyledPopper,
   staticClasses,

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

@@ -1 +1 @@
-{"version":3,"file":"NavigationPopup.styles.js","sources":["../../../../../src/components/VerticalNavigation/NavigationPopup/NavigationPopup.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { Popper } from \"@mui/base\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nconst StyledPopper = styled(Popper)({\n  zIndex: theme.zIndices.popover,\n});\n\nexport { StyledPopper };\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":["StyledPopper","Popper","process","env","NODE_ENV","target","label","zIndex","theme","zIndices","popover","staticClasses","useClasses","createClasses","popup","container","marginLeft","spacing","popper"],"mappings":";;;;AAOA,MAAMA,eAAsBC,wBAAAA,QAAMC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EAClCC,QAAQC,MAAMC,SAASC;AACzB,GAACR,QAAAC,IAAAC,aAAC,eAAA,KAAA,6xCAAA;AAIW,MAAA;AAAA,EAAEO;AAAAA,EAAeC;AAAW,IAAIC,cAC3C,6BACA;AAAA,EACEC,OAAO,CAAC;AAAA,EACRC,WAAW;AAAA,IACTC,YAAYR,MAAMS,QAAQ,IAAI;AAAA,EAChC;AAAA,EACAC,QAAQ;AAAA,IACNX,QAAQC,MAAMC,SAASC;AAAAA,EACzB;AACF,CACF;"}
+{"version":3,"file":"NavigationPopup.styles.js","sources":["../../../../../src/components/VerticalNavigation/NavigationPopup/NavigationPopup.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { Popper } from \"@mui/base\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nconst StyledPopper = styled(Popper)({\n  zIndex: theme.zIndices.popover,\n});\n\nexport { StyledPopper };\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":";;;;AAOM,MAAA,eAAe,OAAO,MAAM,EAAE;AAAA,EAClC,QAAQ,MAAM,SAAS;AACzB,CAAC;AAIY,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/components/VerticalNavigation/NavigationPopup/NavigationPopupContainer.js

@@ -10,9 +10,7 @@ const NavigationPopupContainer = ({
   classes: classesProp,
   ...others
 }) => {
-  const {
-    classes
-  } = useClasses(classesProp);
+  const { classes } = useClasses(classesProp);
   const handleClickAway = () => {
     onClose?.();
   };

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

@@ -1 +1 @@
-{"version":3,"file":"NavigationPopupContainer.js","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\";\n\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","container"],"mappings":";;;;;AAwBO,MAAMA,2BAA2BA,CAAC;AAAA,EACvCC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,SAASC;AAAAA,EACT,GAAGC;AAC0B,MAAM;AAC7B,QAAA;AAAA,IAAEF;AAAAA,EAAAA,IAAYG,WAAWF,WAAW;AAE1C,QAAMG,kBAAkBA,MAAM;AAClB;EAAA;AAIV,SAAA,oBAAC,cAAa,EAAA,MAAI,MAAC,UAAoB,WAAU,eAAc,GAAIF,QACjE,UAAC,oBAAA,mBAAA,EAAkB,aAAaE,iBAC9B,UAAC,oBAAA,OAAA,EAAI,WAAWJ,QAAQK,WACtB,UAAA,oBAAC,sBAAqB,EAAA,MAAI,MAAC,UAAQ,MAChCN,SAAAA,CACH,EACF,CAAA,EAAA,CACF,EACF,CAAA;AAEJ;"}
+{"version":3,"file":"NavigationPopupContainer.js","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\";\n\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":[],"mappings":";;;;;AAwBO,MAAM,2BAA2B,CAAC;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT,GAAG;AACL,MAAqC;AACnC,QAAM,EAAE,QAAA,IAAY,WAAW,WAAW;AAE1C,QAAM,kBAAkB,MAAM;AAClB;EAAA;AAIV,SAAA,oBAAC,cAAa,EAAA,MAAI,MAAC,UAAoB,WAAU,eAAe,GAAG,QACjE,UAAC,oBAAA,mBAAA,EAAkB,aAAa,iBAC9B,UAAC,oBAAA,OAAA,EAAI,WAAW,QAAQ,WACtB,UAAA,oBAAC,sBAAqB,EAAA,MAAI,MAAC,UAAQ,MAChC,SAAA,CACH,EACF,CAAA,EAAA,CACF,EACF,CAAA;AAEJ;"}

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

@@ -17,18 +17,37 @@ const HvVerticalNavigationSlider = (props) => {
     onNavigateToChild,
     forwardButtonAriaLabel = "Navigate to submenu"
   } = useDefaultProps("HvVerticalNavigationSlider", props);
-  const {
-    classes
-  } = useClasses(classesProp);
-  return /* @__PURE__ */ jsx(HvListContainer, { interactive: true, id, children: data && data.map((item) => /* @__PURE__ */ jsx(HvListItem, { classes: {
-    root: classes.root,
-    selected: classes.listItemSelected,
-    focus: classes.listItemFocus
-  }, onClick: (event) => {
-    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__ */ jsx("div", { children: item.icon }) : void 0, endAdornment: item.data && item.data.length > 0 ? /* @__PURE__ */ jsx(HvButton, { icon: true, onClick: (event) => {
-    onNavigateToChild?.(event, item);
-  }, "aria-label": forwardButtonAriaLabel, children: /* @__PURE__ */ jsx(DropRightXS, {}) }) : void 0, children: /* @__PURE__ */ jsx(HvOverflowTooltip, { data: item.label }) }, item.id)) });
+  const { classes } = useClasses(classesProp);
+  return /* @__PURE__ */ jsx(HvListContainer, { interactive: true, id, children: data && data.map((item) => /* @__PURE__ */ jsx(
+    HvListItem,
+    {
+      classes: {
+        root: classes.root,
+        selected: classes.listItemSelected,
+        focus: classes.listItemFocus
+      },
+      onClick: (event) => {
+        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__ */ jsx("div", { children: item.icon }) : void 0,
+      endAdornment: item.data && item.data.length > 0 ? /* @__PURE__ */ jsx(
+        HvButton,
+        {
+          icon: true,
+          onClick: (event) => {
+            onNavigateToChild?.(event, item);
+          },
+          "aria-label": forwardButtonAriaLabel,
+          children: /* @__PURE__ */ jsx(DropRightXS, {})
+        }
+      ) : void 0,
+      children: /* @__PURE__ */ jsx(HvOverflowTooltip, { data: item.label })
+    },
+    item.id
+  )) });
 };
 export {
   HvVerticalNavigationSlider,

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

@@ -1 +1 @@
-{"version":3,"file":"NavigationSlider.js","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 { useDefaultProps } from \"@core/hooks\";\n\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  props: HvVerticalNavigationSliderProps\n) => {\n  const {\n    id,\n    classes: classesProp,\n    data,\n    selected,\n    onNavigateToTarget,\n    onNavigateToChild,\n    forwardButtonAriaLabel = \"Navigate to submenu\",\n  } = useDefaultProps(\"HvVerticalNavigationSlider\", props);\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","props","id","classes","classesProp","data","selected","onNavigateToTarget","onNavigateToChild","forwardButtonAriaLabel","useDefaultProps","useClasses","map","item","root","listItemSelected","focus","listItemFocus","event","label","href","undefined","icon","length"],"mappings":";;;;;;;;;AA2DaA,MAAAA,6BAA6BA,CACxCC,UACG;AACG,QAAA;AAAA,IACJC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,yBAAyB;AAAA,EAAA,IACvBC,gBAAgB,8BAA8BT,KAAK;AACjD,QAAA;AAAA,IAAEE;AAAAA,EAAAA,IAAYQ,WAAWP,WAAW;AAGxC,SAAA,oBAAC,iBAAgB,EAAA,aAAW,MAAC,IAC1BC,UACCA,QAAAA,KAAKO,IAAKC,CAAAA,SACP,oBAAA,YAAA,EAEC,SAAS;AAAA,IACPC,MAAMX,QAAQW;AAAAA,IACdR,UAAUH,QAAQY;AAAAA,IAClBC,OAAOb,QAAQc;AAAAA,EAAAA,GAEjB,SAAUC,CAAU,UAAA;AAClBX,yBAAqBW,OAAOL,IAAI;AAAA,EAAA,GAElC,cAAYA,KAAKM,OACjB,gBACEb,aAAaO,KAAKX,KAAMW,KAAKO,OAAO,SAAS,OAAQC,QAEvD,UAAUf,aAAaO,KAAKX,IAC5B,gBAAgBW,KAAKS,OAAO,oBAAC,SAAKT,UAAKS,KAAAA,KAAK,CAAA,IAASD,QACrD,cACER,KAAKR,QAAQQ,KAAKR,KAAKkB,SAAS,IAC9B,oBAAC,YACC,MAAI,MACJ,SAAUL,CAAU,UAAA;AAClBV,wBAAoBU,OAAOL,IAAI;AAAA,EAAA,GAEjC,cAAYJ,wBAEZ,UAAC,oBAAA,aAAA,CAAA,CAAW,EACd,CAAA,IACEY,QAGN,UAAC,oBAAA,mBAAA,EAAkB,MAAMR,KAAKM,MAAAA,CAAM,KA7B/BN,KAAKX,EA8BZ,CACD,EACL,CAAA;AAEJ;"}
+{"version":3,"file":"NavigationSlider.js","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 { useDefaultProps } from \"@core/hooks\";\n\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  props: HvVerticalNavigationSliderProps\n) => {\n  const {\n    id,\n    classes: classesProp,\n    data,\n    selected,\n    onNavigateToTarget,\n    onNavigateToChild,\n    forwardButtonAriaLabel = \"Navigate to submenu\",\n  } = useDefaultProps(\"HvVerticalNavigationSlider\", props);\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":[],"mappings":";;;;;;;;;AA2Da,MAAA,6BAA6B,CACxC,UACG;AACG,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,yBAAyB;AAAA,EAAA,IACvB,gBAAgB,8BAA8B,KAAK;AACvD,QAAM,EAAE,QAAA,IAAY,WAAW,WAAW;AAGxC,SAAA,oBAAC,mBAAgB,aAAW,MAAC,IAC1B,UACC,QAAA,KAAK,IAAI,CAAC,SACR;AAAA,IAAC;AAAA,IAAA;AAAA,MAEC,SAAS;AAAA,QACP,MAAM,QAAQ;AAAA,QACd,UAAU,QAAQ;AAAA,QAClB,OAAO,QAAQ;AAAA,MACjB;AAAA,MACA,SAAS,CAAC,UAAU;AAClB,6BAAqB,OAAO,IAAI;AAAA,MAClC;AAAA,MACA,cAAY,KAAK;AAAA,MACjB,gBACE,aAAa,KAAK,KAAM,KAAK,OAAO,SAAS,OAAQ;AAAA,MAEvD,UAAU,aAAa,KAAK;AAAA,MAC5B,gBAAgB,KAAK,2BAAQ,OAAK,EAAA,UAAA,KAAK,MAAK,IAAS;AAAA,MACrD,cACE,KAAK,QAAQ,KAAK,KAAK,SAAS,IAC9B;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAI;AAAA,UACJ,SAAS,CAAC,UAAU;AAClB,gCAAoB,OAAO,IAAI;AAAA,UACjC;AAAA,UACA,cAAY;AAAA,UAEZ,8BAAC,aAAY,EAAA;AAAA,QAAA;AAAA,MAEb,IAAA;AAAA,MAGN,UAAC,oBAAA,mBAAA,EAAkB,MAAM,KAAK,OAAO;AAAA,IAAA;AAAA,IA7BhC,KAAK;AAAA,EA+Bb,CAAA,EACL,CAAA;AAEJ;"}

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

@@ -1,33 +1,33 @@
 import { theme } from "@hitachivantara/uikit-styles";
 import { createClasses } from "../../../utils/classes.js";
-const {
-  staticClasses,
-  useClasses
-} = createClasses("HvVerticalNavigationSlider", {
-  root: {
-    display: "flex",
-    alignItems: "center",
-    borderLeft: `4px solid transparent`,
-    minHeight: "48px",
-    marginBottom: "8px",
-    "& > button": {
-      marginLeft: "auto"
-    }
-  },
-  listItemSelected: {
-    background: theme.colors.atmo3,
-    borderLeft: `4px solid ${theme.colors.secondary}`,
-    "& *": {
-      background: theme.colors.atmo3
-    }
-  },
-  listItemFocus: {
-    background: theme.colors.atmo3,
-    "& *": {
-      background: theme.colors.atmo3
+const { staticClasses, useClasses } = createClasses(
+  "HvVerticalNavigationSlider",
+  {
+    root: {
+      display: "flex",
+      alignItems: "center",
+      borderLeft: `4px solid transparent`,
+      minHeight: "48px",
+      marginBottom: "8px",
+      "& > button": {
+        marginLeft: "auto"
+      }
+    },
+    listItemSelected: {
+      background: theme.colors.atmo3,
+      borderLeft: `4px solid ${theme.colors.secondary}`,
+      "& *": {
+        background: theme.colors.atmo3
+      }
+    },
+    listItemFocus: {
+      background: theme.colors.atmo3,
+      "& *": {
+        background: theme.colors.atmo3
+      }
     }
   }
-});
+);
 export {
   staticClasses,
   useClasses

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

@@ -1 +1 @@
-{"version":3,"file":"NavigationSlider.styles.js","sources":["../../../../../src/components/VerticalNavigation/NavigationSlider/NavigationSlider.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/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        background: theme.colors.atmo3,\n      },\n    },\n    listItemFocus: {\n      background: theme.colors.atmo3,\n      \"& *\": {\n        background: theme.colors.atmo3,\n      },\n    },\n  }\n);\n"],"names":["staticClasses","useClasses","createClasses","root","display","alignItems","borderLeft","minHeight","marginBottom","marginLeft","listItemSelected","background","theme","colors","atmo3","secondary","listItemFocus"],"mappings":";;AAIa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAC3C,8BACA;AAAA,EACEC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,YAAY;AAAA,IACZC,YAAa;AAAA,IACbC,WAAW;AAAA,IACXC,cAAc;AAAA,IACd,cAAc;AAAA,MACZC,YAAY;AAAA,IACd;AAAA,EACF;AAAA,EACAC,kBAAkB;AAAA,IAChBC,YAAYC,MAAMC,OAAOC;AAAAA,IACzBR,YAAa,aAAYM,MAAMC,OAAOE,SAAU;AAAA,IAChD,OAAO;AAAA,MACLJ,YAAYC,MAAMC,OAAOC;AAAAA,IAC3B;AAAA,EACF;AAAA,EACAE,eAAe;AAAA,IACbL,YAAYC,MAAMC,OAAOC;AAAAA,IACzB,OAAO;AAAA,MACLH,YAAYC,MAAMC,OAAOC;AAAAA,IAC3B;AAAA,EACF;AACF,CACF;"}
+{"version":3,"file":"NavigationSlider.styles.js","sources":["../../../../../src/components/VerticalNavigation/NavigationSlider/NavigationSlider.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/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        background: theme.colors.atmo3,\n      },\n    },\n    listItemFocus: {\n      background: theme.colors.atmo3,\n      \"& *\": {\n        background: theme.colors.atmo3,\n      },\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;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,MAC/C,OAAO;AAAA,QACL,YAAY,MAAM,OAAO;AAAA,MAC3B;AAAA,IACF;AAAA,IACA,eAAe;AAAA,MACb,YAAY,MAAM,OAAO;AAAA,MACzB,OAAO;AAAA,QACL,YAAY,MAAM,OAAO;AAAA,MAC3B;AAAA,IACF;AAAA,EACF;AACF;"}