@okta/odyssey-react-mui 1.32.4 → 1.34.0

package/dist/esm/ui-shell/SideNav/SideNav.js

@@ -27,9 +27,8 @@ import { SideNavToggleButton } from "./SideNavToggleButton.js";
 import { SortableList } from "./SortableList/SortableList.js";
 import { Overline } from "../../Typography.js";
 import { useUiShellContext } from "../../ui-shell/UiShellProvider.js";
+import { SIDE_NAV_VISIBILITY_TOGGLE_ICON_POSITION, SIDE_NAV_WIDTH, UI_SHELL_BASE_Z_INDEX, UI_SHELL_OVERLAY_Z_INDEX } from "../uiShellSharedConstants.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export const DEFAULT_SIDE_NAV_WIDTH = "300px";
-export const SIDENAV_COLLAPSE_ICON_POSITION = "77px";
 const StyledCollapsibleContent = styled("div", {
   shouldForwardProp: prop => prop !== "odysseyDesignTokens" && prop !== "isSideNavCollapsed"
 })(({
@@ -37,8 +36,8 @@ const StyledCollapsibleContent = styled("div", {
   isSideNavCollapsed
 }) => ({
   position: "relative",
-  display: "inline-grid",
-  gridTemplateColumns: DEFAULT_SIDE_NAV_WIDTH,
+  display: "grid",
+  gridTemplateColumns: SIDE_NAV_WIDTH,
   height: "100%",
   transition: `grid-template-columns ${odysseyDesignTokens.TransitionDurationMain}, opacity 300ms`,
   transitionTimingFunction: odysseyDesignTokens.TransitionTimingMain,
@@ -54,7 +53,7 @@ const StyledOpacityTransitionContainer = styled("div", {
   odysseyDesignTokens,
   isSideNavCollapsed
 }) => ({
-  display: "inline-grid",
+  display: "grid",
   gridTemplateRows: "max-content 1fr max-content",
   height: "100%",
   transition: `opacity 50ms`,
@@ -64,7 +63,7 @@ const StyledOpacityTransitionContainer = styled("div", {
     opacity: 0
   })
 }));
-const StyledSideNav = styled("nav", {
+const StyledSideNavContainer = styled("nav", {
   shouldForwardProp: prop => prop !== "backgroundColor" && prop !== "odysseyDesignTokens" && prop !== "isAppContentWhiteBackground" && prop !== "isSideNavCollapsed"
 })(({
   backgroundColor,
@@ -72,10 +71,10 @@ const StyledSideNav = styled("nav", {
   isSideNavCollapsed,
   odysseyDesignTokens
 }) => ({
-  position: "relative",
-  display: "inline-block",
-  height: "100%",
   backgroundColor: backgroundColor || odysseyDesignTokens.HueNeutralWhite,
+  height: "100%",
+  position: "relative",
+  width: "fit-content",
   ...(isAppContentWhiteBackground && {
     borderRightWidth: odysseyDesignTokens.BorderWidthMain,
     borderRightStyle: odysseyDesignTokens.BorderStyleMain,
@@ -92,7 +91,7 @@ const StyledSideNav = styled("nav", {
     transform: `translateX(0)`,
     transition: `opacity ${odysseyDesignTokens.TransitionDurationMain}, transform ${odysseyDesignTokens.TransitionDurationMain}`,
     width: odysseyDesignTokens.Spacing2,
-    zIndex: 2
+    zIndex: UI_SHELL_OVERLAY_Z_INDEX
   },
   "&:has([data-sidenav-toggle='true']:hover), &:has([data-sidenav-toggle='true']:focus-visible)": {
     ...(isSideNavCollapsed && {
@@ -107,13 +106,13 @@ const StyledSideNav = styled("nav", {
   },
   "[data-sidenav-toggle='true']": {
     position: "absolute",
-    top: SIDENAV_COLLAPSE_ICON_POSITION,
+    top: SIDE_NAV_VISIBILITY_TOGGLE_ICON_POSITION,
     right: 0,
     transition: `transform ${odysseyDesignTokens.TransitionDurationMain}`,
     transform: `translate3d(100%, 0, 0)`
   }
 }));
-const SideNavHeaderContainer = styled("div", {
+const StyledSideNavHeaderContainer = styled("div", {
   shouldForwardProp: prop => prop !== "borderColor" && prop !== "hasContentScrolled" && prop !== "odysseyDesignTokens"
 })(({
   borderColor,
@@ -130,24 +129,23 @@ const SideNavHeaderContainer = styled("div", {
     })
   })
 }));
-const SideNavListContainer = styled("ul")(() => ({
+const StyledSideNavListContainer = styled("ul")(() => ({
   padding: 0,
   listStyle: "none",
   listStyleType: "none",
   margin: 0
 }));
-const SideNavScrollableContainer = styled("div", {
+const StyledSideNavScrollableContainer = styled("div", {
   shouldForwardProp: prop => prop !== "odysseyDesignTokens"
 })(({
   odysseyDesignTokens
 }) => ({
-  display: "grid",
+  display: "inline-grid",
   gridTemplateRows: "1fr max-content",
-  flex: "1 1 100%",
   overflowY: "auto",
   paddingInline: odysseyDesignTokens.Spacing2
 }));
-const SectionHeaderContainer = styled("li", {
+const StyledSectionHeaderContainer = styled("li", {
   shouldForwardProp: prop => prop !== "odysseyDesignTokens" && prop !== "contrastFontColor"
 })(({
   contrastFontColor,
@@ -158,7 +156,7 @@ const SectionHeaderContainer = styled("li", {
   marginBlock: `${odysseyDesignTokens.Spacing3}`,
   color: contrastFontColor || odysseyDesignTokens.HueNeutral600
 }));
-const SideNavFooter = styled("div", {
+const StyledSideNavFooter = styled("div", {
   shouldForwardProp: prop => prop !== "odysseyDesignTokens" && prop !== "sideNavBackgroundColor"
 })(({
   odysseyDesignTokens,
@@ -171,7 +169,7 @@ const SideNavFooter = styled("div", {
     backgroundColor: sideNavBackgroundColor
   })
 }));
-const PersistentSideNavFooter = styled(SideNavFooter, {
+const StyledPersistentSideNavFooter = styled(StyledSideNavFooter, {
   shouldForwardProp: prop => prop !== "isContentScrollable" && prop !== "odysseyDesignTokens" && prop !== "sideNavBackgroundColor"
 })(({
   isContentScrollable,
@@ -181,7 +179,7 @@ const PersistentSideNavFooter = styled(SideNavFooter, {
   transitionProperty: "box-shadow",
   transitionDuration: odysseyDesignTokens.TransitionDurationMain,
   transitionTiming: odysseyDesignTokens.TransitionTimingMain,
-  zIndex: 2,
+  zIndex: UI_SHELL_BASE_Z_INDEX,
   ...(isContentScrollable && {
     boxShadow: "0px -8px 8px -8px rgba(39, 39, 39, 0.08)"
   }),
@@ -189,7 +187,7 @@ const PersistentSideNavFooter = styled(SideNavFooter, {
     backgroundColor: sideNavBackgroundColor
   })
 }));
-const SideNavFooterItemsContainer = styled("div", {
+const StyledSideNavFooterItemsContainer = styled("div", {
   shouldForwardProp: prop => prop !== "odysseyDesignTokens" && prop !== "sideNavContrastColors"
 })(({
   odysseyDesignTokens,
@@ -220,7 +218,7 @@ const SideNavFooterItemsContainer = styled("div", {
     })
   }
 }));
-const LoadingItemContainer = styled("div", {
+const StyledLoadingItemContainer = styled("div", {
   shouldForwardProp: prop => prop !== "odysseyDesignTokens"
 })(({
   odysseyDesignTokens
@@ -234,7 +232,7 @@ const LoadingItemContainer = styled("div", {
 const getHasScrollableContent = scrollableContainer => scrollableContainer.scrollHeight > scrollableContainer.clientHeight;
 const LoadingItem = () => {
   const odysseyDesignTokens = useOdysseyDesignTokens();
-  return _jsxs(LoadingItemContainer, {
+  return _jsxs(StyledLoadingItemContainer, {
     odysseyDesignTokens: odysseyDesignTokens,
     children: [_jsx(_Skeleton, {
       variant: "circular",
@@ -255,13 +253,14 @@ const SideNav = ({
   isCollapsed = false,
   isCompact,
   isLoading,
+  isObtrusive,
   logoProps,
   onCollapse,
   onExpand,
   onSort,
   sideNavItems
 }) => {
-  const [isSideNavCollapsed, setSideNavCollapsed] = useState(isCollapsed);
+  const [isSideNavCollapsed, setIsSideNavCollapsed] = useState(isCollapsed);
   const [hasContentScrolled, setHasContentScrolled] = useState(false);
   const [isContentScrollable, setIsContentScrollable] = useState(false);
   const [sideNavItemsList, updateSideNavItemsList] = useState(sideNavItems);
@@ -275,7 +274,7 @@ const SideNav = ({
   const intersectionObserverRef = useRef(null);
   const blankElement = useMemo(() => _jsx("div", {}), []);
   useEffect(() => updateSideNavItemsList(sideNavItems), [sideNavItems]);
-  useEffect(() => setSideNavCollapsed(isCollapsed), [isCollapsed]);
+  useEffect(() => setIsSideNavCollapsed(isCollapsed), [isCollapsed]);
   useEffect(() => {
     const updateIsContentScrollable = () => {
       if (scrollableContentRef.current && scrollableContentRef.current.parentElement) {
@@ -360,7 +359,10 @@ const SideNav = ({
       } : item;
     });
     updateSideNavItemsList(updatedSideNavItems);
-  }, [sideNavItemsList]);
+    if (isCollapsed || isObtrusive) {
+      uiShellContext?.closeSideNavMenu();
+    }
+  }, [isCollapsed, isObtrusive, sideNavItemsList, uiShellContext]);
   const processedSideNavItems = useMemo(() => {
     return sideNavItemsList?.map(item => ({
       ...item,
@@ -388,19 +390,33 @@ const SideNav = ({
     }));
   }, [getRefIfThisIsFirstNodeWithIsSelected, sideNavItemsList, sideNavItemContentProviderValue, setSelectedItem]);
   const sideNavExpandClickHandler = useCallback(() => {
-    if (isSideNavCollapsed) {
-      onExpand?.();
-    } else {
-      onCollapse?.();
-    }
-    setSideNavCollapsed(!isSideNavCollapsed);
-  }, [isSideNavCollapsed, setSideNavCollapsed, onExpand, onCollapse]);
+    setIsSideNavCollapsed(isSideNavCollapsed => {
+      if (isSideNavCollapsed) {
+        onExpand?.();
+      } else {
+        onCollapse?.();
+      }
+      return !isSideNavCollapsed;
+    });
+  }, [onExpand, onCollapse]);
   const sideNavExpandKeyHandler = useCallback(event => {
     if (event?.key === "Enter" || event?.code === "Space") {
       event.preventDefault();
       sideNavExpandClickHandler();
     }
   }, [sideNavExpandClickHandler]);
+  useEffect(() => {
+    if (isCollapsed) {
+      const unsubscribe = uiShellContext?.subscribeToCloseSideNavMenu(() => {
+        onCollapse?.();
+        setIsSideNavCollapsed(true);
+      });
+      return () => {
+        unsubscribe?.();
+      };
+    }
+    return () => {};
+  }, [isCollapsed, onCollapse, uiShellContext]);
   const setSortedItems = useCallback((parentId, activeId, activeIndex, overIndex) => {
     const sortedSideNavItems = sideNavItemsList.map(item => item.id === parentId && item.nestedNavItems ? {
       ...item,
@@ -409,7 +425,7 @@ const SideNav = ({
     updateSideNavItemsList(sortedSideNavItems);
     onSort?.(sortedSideNavItems, parentId, activeId, activeIndex, overIndex);
   }, [onSort, sideNavItemsList]);
-  return _jsxs(StyledSideNav, {
+  return _jsxs(StyledSideNavContainer, {
     "aria-label": t("navigation.label"),
     backgroundColor: uiShellContext?.sideNavBackgroundColor,
     id: "side-nav-expandable",
@@ -429,19 +445,21 @@ const SideNav = ({
         children: _jsxs(StyledOpacityTransitionContainer, {
           isSideNavCollapsed: isSideNavCollapsed,
           odysseyDesignTokens: odysseyDesignTokens,
-          children: [_jsx(SideNavHeaderContainer, {
+          children: [appName || isLoading || logoProps ? _jsx(StyledSideNavHeaderContainer, {
             hasContentScrolled: hasContentScrolled,
             odysseyDesignTokens: odysseyDesignTokens,
             borderColor: uiShellContext?.sideNavContrastColors?.fontColor,
-            children: _jsx(SideNavHeader, {
+            children: isLoading && !appName && !logoProps ? _jsx(SideNavHeader, {
+              isLoading: isLoading
+            }) : _jsx(SideNavHeader, {
               appName: appName,
               isLoading: isLoading,
               logoProps: logoProps
             })
-          }), _jsxs(SideNavScrollableContainer, {
+          }) : _jsx("div", {}), _jsxs(StyledSideNavScrollableContainer, {
             odysseyDesignTokens: odysseyDesignTokens,
             "data-se": "scrollable-region",
-            children: [_jsx(SideNavListContainer, {
+            children: [_jsx(StyledSideNavListContainer, {
               role: "none",
               ref: scrollableContentRef,
               children: isLoading ? Array(6).fill(null).map((_, index) => _jsx(LoadingItem, {}, index)) : processedSideNavItems?.map(item => {
@@ -459,7 +477,7 @@ const SideNav = ({
                 if (isSectionHeader) {
                   return _jsx(ErrorBoundary, {
                     fallback: blankElement,
-                    children: _jsx(SectionHeaderContainer, {
+                    children: _jsx(StyledSectionHeaderContainer, {
                       contrastFontColor: uiShellContext?.sideNavContrastColors?.fontColor,
                       id: id,
                       odysseyDesignTokens: odysseyDesignTokens,
@@ -484,7 +502,7 @@ const SideNav = ({
                         isExpanded: isExpanded,
                         startIcon: startIcon,
                         isDisabled: isDisabled,
-                        children: _jsx(SideNavListContainer, {
+                        children: _jsx(StyledSideNavListContainer, {
                           role: "none",
                           children: isSortable ? _jsx(SortableList, {
                             parentId: item.id,
@@ -518,10 +536,10 @@ const SideNav = ({
                   });
                 }
               })
-            }), !isLoading && footerItems && !hasCustomFooter && _jsx(SideNavFooter, {
+            }), !isLoading && footerItems && !hasCustomFooter && _jsx(StyledSideNavFooter, {
               odysseyDesignTokens: odysseyDesignTokens,
               sideNavBackgroundColor: uiShellContext?.sideNavBackgroundColor,
-              children: _jsx(SideNavFooterItemsContainer, {
+              children: _jsx(StyledSideNavFooterItemsContainer, {
                 odysseyDesignTokens: odysseyDesignTokens,
                 sideNavContrastColors: uiShellContext?.sideNavContrastColors,
                 children: _jsx(SideNavFooterContent, {
@@ -529,7 +547,7 @@ const SideNav = ({
                 })
               })
             })]
-          }), !isLoading && !footerItems && hasCustomFooter && _jsx(PersistentSideNavFooter, {
+          }), !isLoading && !footerItems && hasCustomFooter && _jsx(StyledPersistentSideNavFooter, {
             isContentScrollable: isContentScrollable,
             odysseyDesignTokens: odysseyDesignTokens,
             sideNavBackgroundColor: uiShellContext?.sideNavBackgroundColor,

package/dist/esm/ui-shell/SideNav/SideNav.js.map

@@ -1 +1 @@
-{"version":3,"file":"SideNav.js","names":["styled","memo","useMemo","useState","useCallback","useRef","useEffect","createElement","_createElement","useTranslation","arrayMove","ErrorBoundary","NavAccordion","useOdysseyDesignTokens","OdysseyThemeProvider","SideNavHeader","SideNavItemContent","StyledSideNavListItem","SideNavFooterContent","SideNavItemContentContext","SideNavToggleButton","SortableList","Overline","useUiShellContext","jsx","_jsx","jsxs","_jsxs","DEFAULT_SIDE_NAV_WIDTH","SIDENAV_COLLAPSE_ICON_POSITION","StyledCollapsibleContent","shouldForwardProp","prop","odysseyDesignTokens","isSideNavCollapsed","position","display","gridTemplateColumns","height","transition","TransitionDurationMain","transitionTimingFunction","TransitionTimingMain","overflow","opacity","StyledOpacityTransitionContainer","gridTemplateRows","StyledSideNav","backgroundColor","isAppContentWhiteBackground","HueNeutralWhite","borderRightWidth","BorderWidthMain","borderRightStyle","BorderStyleMain","borderRightColor","HueNeutral100","HueNeutral200","content","right","top","transform","width","Spacing2","zIndex","Spacing3","SideNavHeaderContainer","borderColor","hasContentScrolled","flexShrink","borderBottomWidth","borderBottomStyle","borderBottomColor","concat","SideNavListContainer","padding","listStyle","listStyleType","margin","SideNavScrollableContainer","flex","overflowY","paddingInline","SectionHeaderContainer","contrastFontColor","paddingBlock","Spacing1","Spacing4","marginBlock","color","HueNeutral600","SideNavFooter","sideNavBackgroundColor","PersistentSideNavFooter","isContentScrollable","transitionProperty","transitionDuration","transitionTiming","boxShadow","SideNavFooterItemsContainer","sideNavContrastColors","flexWrap","alignItems","fontSize","TypographySizeOverline","fontColor","textDecoration","HueNeutral900","LoadingItemContainer","gap","getHasScrollableContent","scrollableContainer","scrollHeight","clientHeight","LoadingItem","children","_Skeleton","variant","SideNav","appName","footerComponent","footerItems","hasCustomFooter","isCollapsible","isCollapsed","isCompact","isLoading","logoProps","onCollapse","onExpand","onSort","sideNavItems","setSideNavCollapsed","setHasContentScrolled","setIsContentScrollable","sideNavItemsList","updateSideNavItemsList","uiShellContext","t","scrollableContentRef","resizeObserverRef","intersectionObserverRef","blankElement","updateIsContentScrollable","current","parentElement","resizeObserverDebounceTimer","ResizeObserver","cancelAnimationFrame","requestAnimationFrame","observe","IntersectionObserver","entries","isIntersecting","slice","sort","a","b","time","at","root","threshold","ulElement","liElement","Array","from","disconnect","scrollIntoViewRef","firstSideNavItemIdWithIsSelected","flattenedItems","flatMap","sideNavItem","nestedNavItems","firstItemWithIsSelected","find","isSelected","id","scrollIntoView","getRefIfThisIsFirstNodeWithIsSelected","itemId","undefined","sideNavItemContentProviderValue","depth","setSelectedItem","selectedItemId","updatedSideNavItems","map","item","childItem","processedSideNavItems","childNavItems","childProps","isDisabled","isSortable","navItem","Provider","value","scrollRef","onItemSelected","translate","sideNavExpandClickHandler","sideNavExpandKeyHandler","event","key","code","preventDefault","setSortedItems","parentId","activeId","activeIndex","overIndex","sortedSideNavItems","appBackgroundColor","ariaControls","onClick","onKeyDown","role","ref","fill","_","index","label","isSectionHeader","startIcon","isDefaultExpanded","isExpanded","fallback","component","disabled","items","onChange","renderItem","sortableItem","Item","MemoizedSideNav","displayName"],"sources":["../../../../src/ui-shell/SideNav/SideNav.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport styled from \"@emotion/styled\";\nimport {\n  memo,\n  useMemo,\n  useState,\n  useCallback,\n  useRef,\n  useEffect,\n  KeyboardEventHandler,\n} from \"react\";\nimport { Skeleton } from \"@mui/material\";\nimport { useTranslation } from \"react-i18next\";\nimport { arrayMove } from \"@dnd-kit/sortable\";\nimport { UniqueIdentifier } from \"@dnd-kit/core\";\nimport { ErrorBoundary } from \"react-error-boundary\";\nimport { Property } from \"csstype\";\n\nimport { ContrastColors } from \"../../createContrastColors.js\";\nimport { NavAccordion } from \"./NavAccordion.js\";\nimport {\n  DesignTokens,\n  useOdysseyDesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\nimport { OdysseyThemeProvider } from \"../../OdysseyThemeProvider.js\";\nimport type { SideNavProps } from \"./types.js\";\nimport { SideNavHeader } from \"./SideNavHeader.js\";\nimport {\n  SideNavItemContent,\n  StyledSideNavListItem,\n} from \"./SideNavItemContent.js\";\nimport { SideNavFooterContent } from \"./SideNavFooterContent.js\";\nimport { SideNavItemContentContext } from \"./SideNavItemContentContext.js\";\nimport { SideNavToggleButton } from \"./SideNavToggleButton.js\";\nimport { SortableList } from \"./SortableList/SortableList.js\";\nimport { Overline } from \"../../Typography.js\";\nimport {\n  UiShellColors,\n  useUiShellContext,\n} from \"../../ui-shell/UiShellProvider.js\";\n\nexport const DEFAULT_SIDE_NAV_WIDTH = \"300px\";\n\n// The side nav collapse icon is placed absolutely from the top (Logo container + nav header height)\n// to align it in the middle of the nav header text\nexport const SIDENAV_COLLAPSE_ICON_POSITION = \"77px\";\n\nconst StyledCollapsibleContent = styled(\"div\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"odysseyDesignTokens\" && prop !== \"isSideNavCollapsed\",\n})<{\n  odysseyDesignTokens: DesignTokens;\n  isSideNavCollapsed: boolean;\n}>(({ odysseyDesignTokens, isSideNavCollapsed }) => ({\n  position: \"relative\",\n  display: \"inline-grid\",\n  gridTemplateColumns: DEFAULT_SIDE_NAV_WIDTH,\n  height: \"100%\",\n  transition: `grid-template-columns ${odysseyDesignTokens.TransitionDurationMain}, opacity 300ms`,\n  transitionTimingFunction: odysseyDesignTokens.TransitionTimingMain,\n  overflow: \"hidden\",\n\n  ...(isSideNavCollapsed && {\n    gridTemplateColumns: 0,\n    opacity: 0,\n  }),\n}));\n\nconst StyledOpacityTransitionContainer = styled(\"div\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"odysseyDesignTokens\" && prop !== \"isSideNavCollapsed\",\n})(\n  ({\n    odysseyDesignTokens,\n    isSideNavCollapsed,\n  }: {\n    odysseyDesignTokens: DesignTokens;\n    isSideNavCollapsed: boolean;\n  }) => ({\n    display: \"inline-grid\",\n    gridTemplateRows: \"max-content 1fr max-content\",\n    height: \"100%\",\n    transition: `opacity 50ms`,\n    transitionTimingFunction: odysseyDesignTokens.TransitionTimingMain,\n    overflow: \"hidden\",\n\n    ...(isSideNavCollapsed && {\n      opacity: 0,\n    }),\n  }),\n);\n\nconst StyledSideNav = styled(\"nav\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"backgroundColor\" &&\n    prop !== \"odysseyDesignTokens\" &&\n    prop !== \"isAppContentWhiteBackground\" &&\n    prop !== \"isSideNavCollapsed\",\n})<{\n  isAppContentWhiteBackground: boolean;\n  backgroundColor?: UiShellColors[\"sideNavBackgroundColor\"];\n  isSideNavCollapsed: boolean;\n  odysseyDesignTokens: DesignTokens;\n}>(\n  ({\n    backgroundColor,\n    isAppContentWhiteBackground,\n    isSideNavCollapsed,\n    odysseyDesignTokens,\n  }) => ({\n    position: \"relative\",\n    display: \"inline-block\",\n    height: \"100%\",\n    backgroundColor: backgroundColor || odysseyDesignTokens.HueNeutralWhite,\n\n    ...(isAppContentWhiteBackground && {\n      borderRightWidth: odysseyDesignTokens.BorderWidthMain,\n      borderRightStyle:\n        odysseyDesignTokens.BorderStyleMain as Property.BorderRightStyle,\n      borderRightColor: odysseyDesignTokens.HueNeutral100,\n    }),\n\n    \"&::after\": {\n      backgroundColor: odysseyDesignTokens.HueNeutral200,\n      content: \"''\",\n      height: \"100%\",\n      opacity: 0,\n      position: \"absolute\",\n      right: 0,\n      top: 0,\n      transform: `translateX(0)`,\n      transition: `opacity ${odysseyDesignTokens.TransitionDurationMain}, transform ${odysseyDesignTokens.TransitionDurationMain}`,\n      width: odysseyDesignTokens.Spacing2,\n      zIndex: 2,\n    },\n\n    \"&:has([data-sidenav-toggle='true']:hover), &:has([data-sidenav-toggle='true']:focus-visible)\":\n      {\n        ...(isSideNavCollapsed && {\n          \"&::after\": {\n            opacity: 1,\n            transform: `translateX(100%)`,\n          },\n\n          \"[data-sidenav-toggle='true']\": {\n            transform: `translate3d(calc(100% + ${odysseyDesignTokens.Spacing3}), 0, 0)`,\n          },\n        }),\n      },\n\n    \"[data-sidenav-toggle='true']\": {\n      position: \"absolute\",\n      top: SIDENAV_COLLAPSE_ICON_POSITION,\n      right: 0,\n      transition: `transform ${odysseyDesignTokens.TransitionDurationMain}`,\n      transform: `translate3d(100%, 0, 0)`,\n    },\n  }),\n);\n\nconst SideNavHeaderContainer = styled(\"div\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"borderColor\" &&\n    prop !== \"hasContentScrolled\" &&\n    prop !== \"odysseyDesignTokens\",\n})(\n  ({\n    borderColor,\n    hasContentScrolled,\n    odysseyDesignTokens,\n  }: {\n    borderColor: ContrastColors[\"fontColor\"];\n    hasContentScrolled: boolean;\n    odysseyDesignTokens: DesignTokens;\n  }) => ({\n    flexShrink: 0,\n    // The bottom border should appear only if the scrollable region has been scrolled\n    ...(hasContentScrolled && {\n      borderBottomWidth: odysseyDesignTokens.BorderWidthMain,\n      borderBottomStyle:\n        odysseyDesignTokens.BorderStyleMain as Property.BorderBottomStyle,\n      borderBottomColor: odysseyDesignTokens.HueNeutral100,\n\n      ...(borderColor && {\n        borderBottomColor: borderColor.concat(\"15\"),\n      }),\n    }),\n  }),\n);\n\nconst SideNavListContainer = styled(\"ul\")(() => ({\n  padding: 0,\n  listStyle: \"none\",\n  listStyleType: \"none\",\n  margin: 0,\n}));\n\nconst SideNavScrollableContainer = styled(\"div\", {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n  display: \"grid\",\n  gridTemplateRows: \"1fr max-content\",\n  flex: \"1 1 100%\",\n  overflowY: \"auto\",\n  paddingInline: odysseyDesignTokens.Spacing2,\n}));\n\nconst SectionHeaderContainer = styled(\"li\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"odysseyDesignTokens\" && prop !== \"contrastFontColor\",\n})(\n  ({\n    contrastFontColor,\n    odysseyDesignTokens,\n  }: {\n    contrastFontColor: ContrastColors[\"fontColor\"];\n    odysseyDesignTokens: DesignTokens;\n  }) => ({\n    paddingBlock: odysseyDesignTokens.Spacing1,\n    paddingInline: odysseyDesignTokens.Spacing4,\n    marginBlock: `${odysseyDesignTokens.Spacing3}`,\n    color: contrastFontColor || odysseyDesignTokens.HueNeutral600,\n  }),\n);\n\nconst SideNavFooter = styled(\"div\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"odysseyDesignTokens\" && prop !== \"sideNavBackgroundColor\",\n})(\n  ({\n    odysseyDesignTokens,\n    sideNavBackgroundColor,\n  }: {\n    odysseyDesignTokens: DesignTokens;\n    sideNavBackgroundColor?: UiShellColors[\"sideNavBackgroundColor\"];\n  }) => ({\n    flexShrink: 0,\n    padding: odysseyDesignTokens.Spacing4,\n    backgroundColor: odysseyDesignTokens.HueNeutralWhite,\n\n    ...(sideNavBackgroundColor && {\n      backgroundColor: sideNavBackgroundColor,\n    }),\n  }),\n);\n\nconst PersistentSideNavFooter = styled(SideNavFooter, {\n  shouldForwardProp: (prop) =>\n    prop !== \"isContentScrollable\" &&\n    prop !== \"odysseyDesignTokens\" &&\n    prop !== \"sideNavBackgroundColor\",\n})(\n  ({\n    isContentScrollable,\n    odysseyDesignTokens,\n    sideNavBackgroundColor,\n  }: {\n    isContentScrollable: boolean;\n    odysseyDesignTokens: DesignTokens;\n    sideNavBackgroundColor?: UiShellColors[\"sideNavBackgroundColor\"];\n  }) => ({\n    transitionProperty: \"box-shadow\",\n    transitionDuration: odysseyDesignTokens.TransitionDurationMain,\n    transitionTiming: odysseyDesignTokens.TransitionTimingMain,\n    zIndex: 2,\n    // The box shadow should appear above the footer only if the scrollable region has overflow\n    ...(isContentScrollable && {\n      boxShadow: \"0px -8px 8px -8px rgba(39, 39, 39, 0.08)\",\n    }),\n    ...(sideNavBackgroundColor && {\n      backgroundColor: sideNavBackgroundColor,\n    }),\n  }),\n);\n\nconst SideNavFooterItemsContainer = styled(\"div\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"odysseyDesignTokens\" && prop !== \"sideNavContrastColors\",\n})<{\n  odysseyDesignTokens: DesignTokens;\n  sideNavContrastColors: UiShellColors[\"sideNavContrastColors\"];\n}>(({ odysseyDesignTokens, sideNavContrastColors }) => ({\n  display: \"flex\",\n  flexWrap: \"wrap\",\n  alignItems: \"center\",\n  fontSize: odysseyDesignTokens.TypographySizeOverline,\n\n  \"a, span\": {\n    color: odysseyDesignTokens.HueNeutral600,\n    transition: `color ${odysseyDesignTokens.TransitionDurationMain}`,\n\n    \"&:visited\": {\n      color: odysseyDesignTokens.HueNeutral600,\n\n      ...(sideNavContrastColors?.fontColor && {\n        color: sideNavContrastColors?.fontColor,\n      }),\n    },\n\n    \"&:hover\": {\n      textDecoration: \"none\",\n      color: odysseyDesignTokens.HueNeutral900,\n\n      ...(sideNavContrastColors?.fontColor && {\n        color: sideNavContrastColors?.fontColor,\n      }),\n    },\n\n    ...(sideNavContrastColors?.fontColor && {\n      color: sideNavContrastColors?.fontColor,\n    }),\n  },\n}));\n\nconst LoadingItemContainer = styled(\"div\", {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n  alignItems: \"center\",\n  display: \"flex\",\n  gap: odysseyDesignTokens.Spacing2,\n  paddingBlock: odysseyDesignTokens.Spacing2,\n  paddingInline: odysseyDesignTokens.Spacing4,\n}));\n\nconst getHasScrollableContent = (scrollableContainer: HTMLElement) =>\n  scrollableContainer.scrollHeight > scrollableContainer.clientHeight;\n\nconst LoadingItem = () => {\n  const odysseyDesignTokens: DesignTokens = useOdysseyDesignTokens();\n  return (\n    <LoadingItemContainer odysseyDesignTokens={odysseyDesignTokens}>\n      <Skeleton\n        variant=\"circular\"\n        width={odysseyDesignTokens.Spacing4}\n        height={odysseyDesignTokens.Spacing4}\n      />\n      <Skeleton variant=\"rounded\" width=\"100%\" />\n    </LoadingItemContainer>\n  );\n};\n\nconst SideNav = ({\n  appName,\n  footerComponent,\n  footerItems,\n  hasCustomFooter,\n  isCollapsible,\n  isCollapsed = false,\n  isCompact,\n  isLoading,\n  logoProps,\n  onCollapse,\n  onExpand,\n  onSort,\n  sideNavItems,\n}: SideNavProps) => {\n  const [isSideNavCollapsed, setSideNavCollapsed] = useState(isCollapsed);\n  const [hasContentScrolled, setHasContentScrolled] = useState(false);\n  const [isContentScrollable, setIsContentScrollable] = useState(false);\n  const [sideNavItemsList, updateSideNavItemsList] = useState(sideNavItems);\n\n  const uiShellContext = useUiShellContext();\n  const odysseyDesignTokens: DesignTokens = useOdysseyDesignTokens();\n  const { t } = useTranslation();\n\n  const scrollableContentRef = useRef<HTMLUListElement>(null);\n  const resizeObserverRef = useRef<ResizeObserver | null>(null);\n  const intersectionObserverRef = useRef<IntersectionObserver | null>(null);\n\n  const blankElement = useMemo(() => <div />, []);\n\n  // The default value (sideNavItems) passed to useState is ONLY used by the useState hook for\n  // the very first value. Subsequent updates to the prop (sideNavItems) need to cause the state\n  // to update!\n  useEffect(() => updateSideNavItemsList(sideNavItems), [sideNavItems]);\n\n  // update sidenav collapse status\n  useEffect(() => setSideNavCollapsed(isCollapsed), [isCollapsed]);\n\n  useEffect(() => {\n    // This is called directly in this effect AND perhaps as a result of the ResizeObserver\n    const updateIsContentScrollable = () => {\n      if (\n        scrollableContentRef.current &&\n        scrollableContentRef.current.parentElement\n      ) {\n        setIsContentScrollable(\n          getHasScrollableContent(scrollableContentRef.current.parentElement),\n        );\n      }\n    };\n\n    // If the window is resized, we may need to re-determine if the scrollable container has overflow\n    // Setup a ResizeObserver to know if the size of the scrollableContent changes\n    let resizeObserverDebounceTimer: ReturnType<typeof requestAnimationFrame>;\n    if (!resizeObserverRef.current) {\n      resizeObserverRef.current = new ResizeObserver(() => {\n        cancelAnimationFrame(resizeObserverDebounceTimer);\n        resizeObserverDebounceTimer = requestAnimationFrame(\n          updateIsContentScrollable,\n        );\n      });\n    }\n\n    if (resizeObserverRef.current && scrollableContentRef.current) {\n      // Observe the <ul> itself (in case it changes size due to the content expanding)\n      resizeObserverRef.current.observe(scrollableContentRef.current);\n      if (scrollableContentRef.current.parentElement) {\n        // ALSO observe the parent (<SideNavScrollableContainer>) in case the window resizes\n        resizeObserverRef.current.observe(\n          scrollableContentRef.current.parentElement,\n        );\n      }\n    }\n\n    // Determine if the scrollable container has overflow or not on load\n    updateIsContentScrollable();\n\n    // Finally, we only want to have the border on the bottom of the header iff the user has scrolled\n    // the scrollable container\n    if (!intersectionObserverRef.current && scrollableContentRef.current) {\n      intersectionObserverRef.current = new IntersectionObserver(\n        (entries) => {\n          // If isIntersecting is true, then we're at the top of the scroll container\n          // If isIntersecting is false, some scrolling has occurred.\n          // The entries must be sorted by time and we only really need to look at the latest one\n          const isIntersecting = entries\n            .slice()\n            .sort((a, b) => a.time - b.time)\n            .at(0)?.isIntersecting;\n          setHasContentScrolled(!isIntersecting);\n        },\n        {\n          root: scrollableContentRef.current.parentElement,\n          threshold: 1.0,\n        },\n      );\n    }\n\n    if (intersectionObserverRef.current && scrollableContentRef.current) {\n      const ulElement = scrollableContentRef.current;\n      const [liElement] = Array.from(ulElement?.children || []);\n\n      if (liElement) {\n        intersectionObserverRef.current.observe(liElement);\n      }\n    }\n\n    // Cleanup when unmounted:\n    return () => {\n      if (resizeObserverRef.current) {\n        resizeObserverRef.current.disconnect();\n        resizeObserverRef.current = null;\n      }\n      if (intersectionObserverRef.current) {\n        intersectionObserverRef.current.disconnect();\n        intersectionObserverRef.current = null;\n      }\n      cancelAnimationFrame(resizeObserverDebounceTimer); // Ensure timer is cleared on component unmount\n    };\n  }, [sideNavItemsList]);\n\n  const scrollIntoViewRef = useRef<HTMLLIElement>(null);\n  /**\n   * Look through the sideNavItems and determine which is the first node\n   * with isSelected. This should be the node we set a ref on in order to\n   * call scrollIntoView in the effect\n   */\n  const firstSideNavItemIdWithIsSelected = useMemo(() => {\n    const flattenedItems = sideNavItemsList.flatMap((sideNavItem) =>\n      sideNavItem.nestedNavItems\n        ? [sideNavItem, ...sideNavItem.nestedNavItems]\n        : sideNavItem,\n    );\n    const firstItemWithIsSelected = flattenedItems.find(\n      (sideNavItem) => sideNavItem.isSelected,\n    );\n    return firstItemWithIsSelected?.id;\n  }, [sideNavItemsList]);\n  /**\n   * Once we've rendered and if we have an item to scroll to, do the scroll action.\n   * This must rely on checking firstSideNavItemIdWithIsSelected or it will not run\n   * once the actual ref is populated.\n   */\n  useEffect(() => {\n    if (firstSideNavItemIdWithIsSelected && scrollIntoViewRef.current) {\n      scrollIntoViewRef.current.scrollIntoView();\n    }\n  }, [firstSideNavItemIdWithIsSelected]);\n\n  /**\n   * We only want to put a ref on a node iff it is the first selected node.\n   * This function returns the ref only if the ID provided matches the first\n   * selected node, otherwise returns undefined (so that the node has no ref)\n   */\n  const getRefIfThisIsFirstNodeWithIsSelected = useCallback(\n    (itemId: string) =>\n      itemId === firstSideNavItemIdWithIsSelected\n        ? scrollIntoViewRef\n        : undefined,\n    [firstSideNavItemIdWithIsSelected],\n  );\n\n  const sideNavItemContentProviderValue = useMemo(\n    () => ({ isCompact, depth: 1 }),\n    [isCompact],\n  );\n\n  const setSelectedItem = useCallback(\n    (selectedItemId: string) => {\n      const updatedSideNavItems = sideNavItemsList.map((item) => {\n        if (item.id === selectedItemId) {\n          item.isSelected = true;\n        } else if (item.isSelected) {\n          delete item.isSelected;\n        }\n\n        return item.nestedNavItems\n          ? {\n              ...item,\n              nestedNavItems: item.nestedNavItems.map((childItem) => {\n                if (childItem.id === selectedItemId) {\n                  childItem.isSelected = true;\n                } else if (childItem.isSelected) {\n                  delete childItem.isSelected;\n                }\n                return childItem;\n              }),\n            }\n          : item;\n      });\n      updateSideNavItemsList(updatedSideNavItems);\n    },\n    [sideNavItemsList],\n  );\n\n  const processedSideNavItems = useMemo(() => {\n    return sideNavItemsList?.map((item) => ({\n      ...item,\n      childNavItems: item.nestedNavItems?.map((childProps) => {\n        return {\n          id: childProps.id,\n          isSelected: childProps.isSelected,\n          isDisabled: childProps.isDisabled,\n          isSortable: childProps.isSortable,\n          navItem: (\n            <SideNavItemContentContext.Provider\n              value={{\n                ...sideNavItemContentProviderValue,\n                depth: 2,\n                isSortable: item.isSortable,\n              }}\n              key={childProps.id}\n            >\n              <SideNavItemContent\n                {...childProps}\n                scrollRef={getRefIfThisIsFirstNodeWithIsSelected(childProps.id)}\n                onItemSelected={setSelectedItem}\n                translate={childProps.translate}\n              />\n            </SideNavItemContentContext.Provider>\n          ),\n        };\n      }),\n    }));\n  }, [\n    getRefIfThisIsFirstNodeWithIsSelected,\n    sideNavItemsList,\n    sideNavItemContentProviderValue,\n    setSelectedItem,\n  ]);\n\n  const sideNavExpandClickHandler = useCallback(() => {\n    if (isSideNavCollapsed) {\n      onExpand?.();\n    } else {\n      onCollapse?.();\n    }\n\n    setSideNavCollapsed(!isSideNavCollapsed);\n  }, [isSideNavCollapsed, setSideNavCollapsed, onExpand, onCollapse]);\n\n  const sideNavExpandKeyHandler = useCallback<\n    KeyboardEventHandler<HTMLButtonElement>\n  >(\n    (event) => {\n      if (event?.key === \"Enter\" || event?.code === \"Space\") {\n        event.preventDefault();\n        sideNavExpandClickHandler();\n      }\n    },\n    [sideNavExpandClickHandler],\n  );\n\n  const setSortedItems = useCallback(\n    (\n      parentId: string,\n      activeId: UniqueIdentifier,\n      activeIndex: number,\n      overIndex: number,\n    ) => {\n      const sortedSideNavItems = sideNavItemsList.map((item) =>\n        item.id === parentId && item.nestedNavItems\n          ? {\n              ...item,\n              nestedNavItems: arrayMove(\n                item.nestedNavItems,\n                activeIndex,\n                overIndex,\n              ),\n            }\n          : item,\n      );\n      updateSideNavItemsList(sortedSideNavItems);\n      onSort?.(sortedSideNavItems, parentId, activeId, activeIndex, overIndex);\n    },\n    [onSort, sideNavItemsList],\n  );\n\n  return (\n    <StyledSideNav\n      aria-label={t(\"navigation.label\")}\n      backgroundColor={uiShellContext?.sideNavBackgroundColor}\n      id=\"side-nav-expandable\"\n      isAppContentWhiteBackground={\n        uiShellContext?.appBackgroundColor ===\n        odysseyDesignTokens.HueNeutralWhite\n      }\n      isSideNavCollapsed={isSideNavCollapsed}\n      odysseyDesignTokens={odysseyDesignTokens}\n    >\n      {isCollapsible && (\n        <SideNavToggleButton\n          ariaControls=\"side-nav-expandable\"\n          isSideNavCollapsed={isSideNavCollapsed}\n          onClick={sideNavExpandClickHandler}\n          onKeyDown={sideNavExpandKeyHandler}\n        />\n      )}\n      <OdysseyThemeProvider>\n        <StyledCollapsibleContent\n          data-se=\"collapsible-region\"\n          isSideNavCollapsed={isSideNavCollapsed}\n          odysseyDesignTokens={odysseyDesignTokens}\n        >\n          <StyledOpacityTransitionContainer\n            isSideNavCollapsed={isSideNavCollapsed}\n            odysseyDesignTokens={odysseyDesignTokens}\n          >\n            <SideNavHeaderContainer\n              hasContentScrolled={hasContentScrolled}\n              odysseyDesignTokens={odysseyDesignTokens}\n              borderColor={uiShellContext?.sideNavContrastColors?.fontColor}\n            >\n              <SideNavHeader\n                appName={appName}\n                isLoading={isLoading}\n                logoProps={logoProps}\n              />\n            </SideNavHeaderContainer>\n            <SideNavScrollableContainer\n              odysseyDesignTokens={odysseyDesignTokens}\n              data-se=\"scrollable-region\"\n            >\n              <SideNavListContainer role=\"none\" ref={scrollableContentRef}>\n                {isLoading\n                  ? Array(6)\n                      .fill(null)\n                      .map((_, index) => <LoadingItem key={index} />)\n                  : processedSideNavItems?.map((item) => {\n                      const {\n                        id,\n                        label,\n                        isSectionHeader,\n                        startIcon,\n                        childNavItems,\n                        isSortable,\n                        isDefaultExpanded,\n                        isDisabled,\n                        isExpanded,\n                      } = item;\n\n                      if (isSectionHeader) {\n                        return (\n                          <ErrorBoundary fallback={blankElement}>\n                            <SectionHeaderContainer\n                              contrastFontColor={\n                                uiShellContext?.sideNavContrastColors?.fontColor\n                              }\n                              id={id}\n                              key={id}\n                              odysseyDesignTokens={odysseyDesignTokens}\n                            >\n                              <Overline component=\"h3\">{label}</Overline>\n                            </SectionHeaderContainer>\n                          </ErrorBoundary>\n                        );\n                      } else if (childNavItems) {\n                        return (\n                          <ErrorBoundary fallback={blankElement}>\n                            <StyledSideNavListItem\n                              id={id}\n                              key={id}\n                              odysseyDesignTokens={odysseyDesignTokens}\n                              disabled={isDisabled}\n                              aria-disabled={isDisabled}\n                            >\n                              <NavAccordion\n                                label={label}\n                                isCompact={isCompact}\n                                isDefaultExpanded={isDefaultExpanded}\n                                isExpanded={isExpanded}\n                                startIcon={startIcon}\n                                isDisabled={isDisabled}\n                              >\n                                <SideNavListContainer role=\"none\">\n                                  {isSortable ? (\n                                    <SortableList\n                                      parentId={item.id}\n                                      items={childNavItems}\n                                      onChange={setSortedItems}\n                                      renderItem={(sortableItem) => (\n                                        <SortableList.Item\n                                          id={sortableItem.id}\n                                          isDisabled={sortableItem.isDisabled}\n                                          isSelected={sortableItem.isSelected}\n                                          isSortable={sortableItem.isSortable}\n                                        >\n                                          {sortableItem.navItem}\n                                        </SortableList.Item>\n                                      )}\n                                    />\n                                  ) : (\n                                    childNavItems.map((item) => item.navItem)\n                                  )}\n                                </SideNavListContainer>\n                              </NavAccordion>\n                            </StyledSideNavListItem>\n                          </ErrorBoundary>\n                        );\n                      } else {\n                        return (\n                          <ErrorBoundary fallback={blankElement}>\n                            <SideNavItemContentContext.Provider\n                              key={item.id}\n                              value={sideNavItemContentProviderValue}\n                            >\n                              <SideNavItemContent\n                                {...item}\n                                key={item.id}\n                                onItemSelected={setSelectedItem}\n                                scrollRef={getRefIfThisIsFirstNodeWithIsSelected(\n                                  item.id,\n                                )}\n                                startIcon={item.startIcon}\n                              />\n                            </SideNavItemContentContext.Provider>\n                          </ErrorBoundary>\n                        );\n                      }\n                    })}\n              </SideNavListContainer>\n              {!isLoading && footerItems && !hasCustomFooter && (\n                <SideNavFooter\n                  odysseyDesignTokens={odysseyDesignTokens}\n                  sideNavBackgroundColor={\n                    uiShellContext?.sideNavBackgroundColor\n                  }\n                >\n                  <SideNavFooterItemsContainer\n                    odysseyDesignTokens={odysseyDesignTokens}\n                    sideNavContrastColors={\n                      uiShellContext?.sideNavContrastColors\n                    }\n                  >\n                    <SideNavFooterContent footerItems={footerItems} />\n                  </SideNavFooterItemsContainer>\n                </SideNavFooter>\n              )}\n            </SideNavScrollableContainer>\n            {!isLoading && !footerItems && hasCustomFooter && (\n              <PersistentSideNavFooter\n                isContentScrollable={isContentScrollable}\n                odysseyDesignTokens={odysseyDesignTokens}\n                sideNavBackgroundColor={uiShellContext?.sideNavBackgroundColor}\n              >\n                {footerComponent}\n              </PersistentSideNavFooter>\n            )}\n          </StyledOpacityTransitionContainer>\n        </StyledCollapsibleContent>\n      </OdysseyThemeProvider>\n    </StyledSideNav>\n  );\n};\n\nconst MemoizedSideNav = memo(SideNav);\nMemoizedSideNav.displayName = \"SideNav\";\n\nexport { MemoizedSideNav as SideNav };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"SideNav.js","names":["styled","memo","useMemo","useState","useCallback","useRef","useEffect","createElement","_createElement","useTranslation","arrayMove","ErrorBoundary","NavAccordion","useOdysseyDesignTokens","OdysseyThemeProvider","SideNavHeader","SideNavItemContent","StyledSideNavListItem","SideNavFooterContent","SideNavItemContentContext","SideNavToggleButton","SortableList","Overline","useUiShellContext","SIDE_NAV_VISIBILITY_TOGGLE_ICON_POSITION","SIDE_NAV_WIDTH","UI_SHELL_BASE_Z_INDEX","UI_SHELL_OVERLAY_Z_INDEX","jsx","_jsx","jsxs","_jsxs","StyledCollapsibleContent","shouldForwardProp","prop","odysseyDesignTokens","isSideNavCollapsed","position","display","gridTemplateColumns","height","transition","TransitionDurationMain","transitionTimingFunction","TransitionTimingMain","overflow","opacity","StyledOpacityTransitionContainer","gridTemplateRows","StyledSideNavContainer","backgroundColor","isAppContentWhiteBackground","HueNeutralWhite","width","borderRightWidth","BorderWidthMain","borderRightStyle","BorderStyleMain","borderRightColor","HueNeutral100","HueNeutral200","content","right","top","transform","Spacing2","zIndex","Spacing3","StyledSideNavHeaderContainer","borderColor","hasContentScrolled","flexShrink","borderBottomWidth","borderBottomStyle","borderBottomColor","concat","StyledSideNavListContainer","padding","listStyle","listStyleType","margin","StyledSideNavScrollableContainer","overflowY","paddingInline","StyledSectionHeaderContainer","contrastFontColor","paddingBlock","Spacing1","Spacing4","marginBlock","color","HueNeutral600","StyledSideNavFooter","sideNavBackgroundColor","StyledPersistentSideNavFooter","isContentScrollable","transitionProperty","transitionDuration","transitionTiming","boxShadow","StyledSideNavFooterItemsContainer","sideNavContrastColors","flexWrap","alignItems","fontSize","TypographySizeOverline","fontColor","textDecoration","HueNeutral900","StyledLoadingItemContainer","gap","getHasScrollableContent","scrollableContainer","scrollHeight","clientHeight","LoadingItem","children","_Skeleton","variant","SideNav","appName","footerComponent","footerItems","hasCustomFooter","isCollapsible","isCollapsed","isCompact","isLoading","isObtrusive","logoProps","onCollapse","onExpand","onSort","sideNavItems","setIsSideNavCollapsed","setHasContentScrolled","setIsContentScrollable","sideNavItemsList","updateSideNavItemsList","uiShellContext","t","scrollableContentRef","resizeObserverRef","intersectionObserverRef","blankElement","updateIsContentScrollable","current","parentElement","resizeObserverDebounceTimer","ResizeObserver","cancelAnimationFrame","requestAnimationFrame","observe","IntersectionObserver","entries","isIntersecting","slice","sort","a","b","time","at","root","threshold","ulElement","liElement","Array","from","disconnect","scrollIntoViewRef","firstSideNavItemIdWithIsSelected","flattenedItems","flatMap","sideNavItem","nestedNavItems","firstItemWithIsSelected","find","isSelected","id","scrollIntoView","getRefIfThisIsFirstNodeWithIsSelected","itemId","undefined","sideNavItemContentProviderValue","depth","setSelectedItem","selectedItemId","updatedSideNavItems","map","item","childItem","closeSideNavMenu","processedSideNavItems","childNavItems","childProps","isDisabled","isSortable","navItem","Provider","value","scrollRef","onItemSelected","translate","sideNavExpandClickHandler","sideNavExpandKeyHandler","event","key","code","preventDefault","unsubscribe","subscribeToCloseSideNavMenu","setSortedItems","parentId","activeId","activeIndex","overIndex","sortedSideNavItems","appBackgroundColor","ariaControls","onClick","onKeyDown","role","ref","fill","_","index","label","isSectionHeader","startIcon","isDefaultExpanded","isExpanded","fallback","component","disabled","items","onChange","renderItem","sortableItem","Item","MemoizedSideNav","displayName"],"sources":["../../../../src/ui-shell/SideNav/SideNav.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport styled from \"@emotion/styled\";\nimport {\n  memo,\n  useMemo,\n  useState,\n  useCallback,\n  useRef,\n  useEffect,\n  KeyboardEventHandler,\n  CSSProperties,\n} from \"react\";\nimport { Skeleton } from \"@mui/material\";\nimport { useTranslation } from \"react-i18next\";\nimport { arrayMove } from \"@dnd-kit/sortable\";\nimport { UniqueIdentifier } from \"@dnd-kit/core\";\nimport { ErrorBoundary } from \"react-error-boundary\";\nimport { Property } from \"csstype\";\n\nimport { ContrastColors } from \"../../createContrastColors.js\";\nimport { NavAccordion } from \"./NavAccordion.js\";\nimport {\n  DesignTokens,\n  useOdysseyDesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\nimport { OdysseyThemeProvider } from \"../../OdysseyThemeProvider.js\";\nimport type { SideNavProps } from \"./types.js\";\nimport { SideNavHeader } from \"./SideNavHeader.js\";\nimport {\n  SideNavItemContent,\n  StyledSideNavListItem,\n} from \"./SideNavItemContent.js\";\nimport { SideNavFooterContent } from \"./SideNavFooterContent.js\";\nimport { SideNavItemContentContext } from \"./SideNavItemContentContext.js\";\nimport { SideNavToggleButton } from \"./SideNavToggleButton.js\";\nimport { SortableList } from \"./SortableList/SortableList.js\";\nimport { Overline } from \"../../Typography.js\";\nimport {\n  UiShellColors,\n  useUiShellContext,\n} from \"../../ui-shell/UiShellProvider.js\";\nimport {\n  SIDE_NAV_VISIBILITY_TOGGLE_ICON_POSITION,\n  SIDE_NAV_WIDTH,\n  UI_SHELL_BASE_Z_INDEX,\n  UI_SHELL_OVERLAY_Z_INDEX,\n} from \"../uiShellSharedConstants.js\";\n\nconst StyledCollapsibleContent = styled(\"div\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"odysseyDesignTokens\" && prop !== \"isSideNavCollapsed\",\n})<{\n  odysseyDesignTokens: DesignTokens;\n  isSideNavCollapsed: boolean;\n}>(({ odysseyDesignTokens, isSideNavCollapsed }) => ({\n  position: \"relative\",\n  display: \"grid\",\n  gridTemplateColumns: SIDE_NAV_WIDTH,\n  height: \"100%\",\n  transition: `grid-template-columns ${odysseyDesignTokens.TransitionDurationMain}, opacity 300ms`,\n  transitionTimingFunction: odysseyDesignTokens.TransitionTimingMain,\n  overflow: \"hidden\",\n\n  ...(isSideNavCollapsed &&\n    ({\n      gridTemplateColumns: 0,\n      opacity: 0,\n    } as CSSProperties)),\n}));\n\nconst StyledOpacityTransitionContainer = styled(\"div\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"odysseyDesignTokens\" && prop !== \"isSideNavCollapsed\",\n})(\n  ({\n    odysseyDesignTokens,\n    isSideNavCollapsed,\n  }: {\n    odysseyDesignTokens: DesignTokens;\n    isSideNavCollapsed: boolean;\n  }) => ({\n    display: \"grid\",\n    gridTemplateRows: \"max-content 1fr max-content\",\n    height: \"100%\",\n    transition: `opacity 50ms`,\n    transitionTimingFunction: odysseyDesignTokens.TransitionTimingMain,\n    overflow: \"hidden\",\n\n    ...(isSideNavCollapsed &&\n      ({\n        opacity: 0,\n      } as CSSProperties)),\n  }),\n);\n\nconst StyledSideNavContainer = styled(\"nav\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"backgroundColor\" &&\n    prop !== \"odysseyDesignTokens\" &&\n    prop !== \"isAppContentWhiteBackground\" &&\n    prop !== \"isSideNavCollapsed\",\n})<{\n  isAppContentWhiteBackground: boolean;\n  backgroundColor?: UiShellColors[\"sideNavBackgroundColor\"];\n  isSideNavCollapsed: boolean;\n  odysseyDesignTokens: DesignTokens;\n}>(\n  ({\n    backgroundColor,\n    isAppContentWhiteBackground,\n    isSideNavCollapsed,\n    odysseyDesignTokens,\n  }) => ({\n    backgroundColor: backgroundColor || odysseyDesignTokens.HueNeutralWhite,\n    height: \"100%\",\n    position: \"relative\",\n    width: \"fit-content\",\n\n    ...(isAppContentWhiteBackground &&\n      ({\n        borderRightWidth: odysseyDesignTokens.BorderWidthMain,\n        borderRightStyle:\n          odysseyDesignTokens.BorderStyleMain as Property.BorderRightStyle,\n        borderRightColor: odysseyDesignTokens.HueNeutral100,\n      } as CSSProperties)),\n\n    \"&::after\": {\n      backgroundColor: odysseyDesignTokens.HueNeutral200,\n      content: \"''\",\n      height: \"100%\",\n      opacity: 0,\n      position: \"absolute\",\n      right: 0,\n      top: 0,\n      transform: `translateX(0)`,\n      transition: `opacity ${odysseyDesignTokens.TransitionDurationMain}, transform ${odysseyDesignTokens.TransitionDurationMain}`,\n      width: odysseyDesignTokens.Spacing2,\n      zIndex: UI_SHELL_OVERLAY_Z_INDEX,\n    },\n\n    \"&:has([data-sidenav-toggle='true']:hover), &:has([data-sidenav-toggle='true']:focus-visible)\":\n      {\n        ...(isSideNavCollapsed &&\n          ({\n            \"&::after\": {\n              opacity: 1,\n              transform: `translateX(100%)`,\n            } as CSSProperties,\n\n            \"[data-sidenav-toggle='true']\": {\n              transform: `translate3d(calc(100% + ${odysseyDesignTokens.Spacing3}), 0, 0)`,\n            } as CSSProperties,\n          } as CSSProperties)),\n      },\n\n    \"[data-sidenav-toggle='true']\": {\n      position: \"absolute\",\n      top: SIDE_NAV_VISIBILITY_TOGGLE_ICON_POSITION,\n      right: 0,\n      transition: `transform ${odysseyDesignTokens.TransitionDurationMain}`,\n      transform: `translate3d(100%, 0, 0)`,\n    },\n  }),\n);\n\nconst StyledSideNavHeaderContainer = styled(\"div\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"borderColor\" &&\n    prop !== \"hasContentScrolled\" &&\n    prop !== \"odysseyDesignTokens\",\n})<{\n  borderColor: ContrastColors[\"fontColor\"];\n  hasContentScrolled: boolean;\n  odysseyDesignTokens: DesignTokens;\n}>(({ borderColor, hasContentScrolled, odysseyDesignTokens }) => ({\n  flexShrink: 0,\n  // The bottom border should appear only if the scrollable region has been scrolled\n  ...(hasContentScrolled &&\n    ({\n      borderBottomWidth: odysseyDesignTokens.BorderWidthMain,\n      borderBottomStyle: odysseyDesignTokens.BorderStyleMain,\n      borderBottomColor: odysseyDesignTokens.HueNeutral100,\n\n      ...(borderColor &&\n        ({\n          borderBottomColor: borderColor.concat(\"15\"),\n        } as CSSProperties)),\n    } as CSSProperties)),\n}));\n\nconst StyledSideNavListContainer = styled(\"ul\")(() => ({\n  padding: 0,\n  listStyle: \"none\",\n  listStyleType: \"none\",\n  margin: 0,\n}));\n\nconst StyledSideNavScrollableContainer = styled(\"div\", {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n  display: \"inline-grid\",\n  gridTemplateRows: \"1fr max-content\",\n  overflowY: \"auto\",\n  paddingInline: odysseyDesignTokens.Spacing2,\n}));\n\nconst StyledSectionHeaderContainer = styled(\"li\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"odysseyDesignTokens\" && prop !== \"contrastFontColor\",\n})(\n  ({\n    contrastFontColor,\n    odysseyDesignTokens,\n  }: {\n    contrastFontColor: ContrastColors[\"fontColor\"];\n    odysseyDesignTokens: DesignTokens;\n  }) => ({\n    paddingBlock: odysseyDesignTokens.Spacing1,\n    paddingInline: odysseyDesignTokens.Spacing4,\n    marginBlock: `${odysseyDesignTokens.Spacing3}`,\n    color: contrastFontColor || odysseyDesignTokens.HueNeutral600,\n  }),\n);\n\nconst StyledSideNavFooter = styled(\"div\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"odysseyDesignTokens\" && prop !== \"sideNavBackgroundColor\",\n})(\n  ({\n    odysseyDesignTokens,\n    sideNavBackgroundColor,\n  }: {\n    odysseyDesignTokens: DesignTokens;\n    sideNavBackgroundColor?: UiShellColors[\"sideNavBackgroundColor\"];\n  }) => ({\n    flexShrink: 0,\n    padding: odysseyDesignTokens.Spacing4,\n    backgroundColor: odysseyDesignTokens.HueNeutralWhite,\n\n    ...(sideNavBackgroundColor &&\n      ({\n        backgroundColor: sideNavBackgroundColor,\n      } as CSSProperties)),\n  }),\n);\n\nconst StyledPersistentSideNavFooter = styled(StyledSideNavFooter, {\n  shouldForwardProp: (prop) =>\n    prop !== \"isContentScrollable\" &&\n    prop !== \"odysseyDesignTokens\" &&\n    prop !== \"sideNavBackgroundColor\",\n})(\n  ({\n    isContentScrollable,\n    odysseyDesignTokens,\n    sideNavBackgroundColor,\n  }: {\n    isContentScrollable: boolean;\n    odysseyDesignTokens: DesignTokens;\n    sideNavBackgroundColor?: UiShellColors[\"sideNavBackgroundColor\"];\n  }) => ({\n    transitionProperty: \"box-shadow\",\n    transitionDuration: odysseyDesignTokens.TransitionDurationMain,\n    transitionTiming: odysseyDesignTokens.TransitionTimingMain,\n    zIndex: UI_SHELL_BASE_Z_INDEX,\n\n    // The box shadow should appear above the footer only if the scrollable region has overflow\n    ...(isContentScrollable &&\n      ({\n        boxShadow: \"0px -8px 8px -8px rgba(39, 39, 39, 0.08)\",\n      } as CSSProperties)),\n\n    ...(sideNavBackgroundColor &&\n      ({\n        backgroundColor: sideNavBackgroundColor,\n      } as CSSProperties)),\n  }),\n);\n\nconst StyledSideNavFooterItemsContainer = styled(\"div\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"odysseyDesignTokens\" && prop !== \"sideNavContrastColors\",\n})<{\n  odysseyDesignTokens: DesignTokens;\n  sideNavContrastColors: UiShellColors[\"sideNavContrastColors\"];\n}>(({ odysseyDesignTokens, sideNavContrastColors }) => ({\n  display: \"flex\",\n  flexWrap: \"wrap\",\n  alignItems: \"center\",\n  fontSize: odysseyDesignTokens.TypographySizeOverline,\n\n  \"a, span\": {\n    color: odysseyDesignTokens.HueNeutral600,\n    transition: `color ${odysseyDesignTokens.TransitionDurationMain}`,\n\n    \"&:visited\": {\n      color: odysseyDesignTokens.HueNeutral600,\n\n      ...(sideNavContrastColors?.fontColor &&\n        ({\n          color: sideNavContrastColors?.fontColor,\n        } as CSSProperties)),\n    },\n\n    \"&:hover\": {\n      textDecoration: \"none\",\n      color: odysseyDesignTokens.HueNeutral900,\n\n      ...(sideNavContrastColors?.fontColor &&\n        ({\n          color: sideNavContrastColors?.fontColor,\n        } as CSSProperties)),\n    },\n\n    ...(sideNavContrastColors?.fontColor &&\n      ({\n        color: sideNavContrastColors?.fontColor,\n      } as CSSProperties)),\n  },\n}));\n\nconst StyledLoadingItemContainer = styled(\"div\", {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n  alignItems: \"center\",\n  display: \"flex\",\n  gap: odysseyDesignTokens.Spacing2,\n  paddingBlock: odysseyDesignTokens.Spacing2,\n  paddingInline: odysseyDesignTokens.Spacing4,\n}));\n\nconst getHasScrollableContent = (scrollableContainer: HTMLElement) =>\n  scrollableContainer.scrollHeight > scrollableContainer.clientHeight;\n\nconst LoadingItem = () => {\n  const odysseyDesignTokens: DesignTokens = useOdysseyDesignTokens();\n  return (\n    <StyledLoadingItemContainer odysseyDesignTokens={odysseyDesignTokens}>\n      <Skeleton\n        variant=\"circular\"\n        width={odysseyDesignTokens.Spacing4}\n        height={odysseyDesignTokens.Spacing4}\n      />\n      <Skeleton variant=\"rounded\" width=\"100%\" />\n    </StyledLoadingItemContainer>\n  );\n};\n\nconst SideNav = ({\n  appName,\n  footerComponent,\n  footerItems,\n  hasCustomFooter,\n  isCollapsible,\n  isCollapsed = false,\n  isCompact,\n  isLoading,\n  isObtrusive,\n  logoProps,\n  onCollapse,\n  onExpand,\n  onSort,\n  sideNavItems,\n}: SideNavProps) => {\n  const [isSideNavCollapsed, setIsSideNavCollapsed] = useState(isCollapsed);\n  const [hasContentScrolled, setHasContentScrolled] = useState(false);\n  const [isContentScrollable, setIsContentScrollable] = useState(false);\n  const [sideNavItemsList, updateSideNavItemsList] = useState(sideNavItems);\n\n  const uiShellContext = useUiShellContext();\n  const odysseyDesignTokens: DesignTokens = useOdysseyDesignTokens();\n  const { t } = useTranslation();\n\n  const scrollableContentRef = useRef<HTMLUListElement>(null);\n  const resizeObserverRef = useRef<ResizeObserver | null>(null);\n  const intersectionObserverRef = useRef<IntersectionObserver | null>(null);\n\n  const blankElement = useMemo(() => <div />, []);\n\n  // The default value (sideNavItems) passed to useState is ONLY used by the useState hook for\n  // the very first value. Subsequent updates to the prop (sideNavItems) need to cause the state\n  // to update!\n  useEffect(() => updateSideNavItemsList(sideNavItems), [sideNavItems]);\n\n  // update sidenav collapse status\n  useEffect(() => setIsSideNavCollapsed(isCollapsed), [isCollapsed]);\n\n  useEffect(() => {\n    // This is called directly in this effect AND perhaps as a result of the ResizeObserver\n    const updateIsContentScrollable = () => {\n      if (\n        scrollableContentRef.current &&\n        scrollableContentRef.current.parentElement\n      ) {\n        setIsContentScrollable(\n          getHasScrollableContent(scrollableContentRef.current.parentElement),\n        );\n      }\n    };\n\n    // If the window is resized, we may need to re-determine if the scrollable container has overflow\n    // Setup a ResizeObserver to know if the size of the scrollableContent changes\n    let resizeObserverDebounceTimer: ReturnType<typeof requestAnimationFrame>;\n    if (!resizeObserverRef.current) {\n      resizeObserverRef.current = new ResizeObserver(() => {\n        cancelAnimationFrame(resizeObserverDebounceTimer);\n        resizeObserverDebounceTimer = requestAnimationFrame(\n          updateIsContentScrollable,\n        );\n      });\n    }\n\n    if (resizeObserverRef.current && scrollableContentRef.current) {\n      // Observe the <ul> itself (in case it changes size due to the content expanding)\n      resizeObserverRef.current.observe(scrollableContentRef.current);\n      if (scrollableContentRef.current.parentElement) {\n        // ALSO observe the parent (<SideNavScrollableContainer>) in case the window resizes\n        resizeObserverRef.current.observe(\n          scrollableContentRef.current.parentElement,\n        );\n      }\n    }\n\n    // Determine if the scrollable container has overflow or not on load\n    updateIsContentScrollable();\n\n    // Finally, we only want to have the border on the bottom of the header iff the user has scrolled\n    // the scrollable container\n    if (!intersectionObserverRef.current && scrollableContentRef.current) {\n      intersectionObserverRef.current = new IntersectionObserver(\n        (entries) => {\n          // If isIntersecting is true, then we're at the top of the scroll container\n          // If isIntersecting is false, some scrolling has occurred.\n          // The entries must be sorted by time and we only really need to look at the latest one\n          const isIntersecting = entries\n            .slice()\n            .sort((a, b) => a.time - b.time)\n            .at(0)?.isIntersecting;\n          setHasContentScrolled(!isIntersecting);\n        },\n        {\n          root: scrollableContentRef.current.parentElement,\n          threshold: 1.0,\n        },\n      );\n    }\n\n    if (intersectionObserverRef.current && scrollableContentRef.current) {\n      const ulElement = scrollableContentRef.current;\n      const [liElement] = Array.from(ulElement?.children || []);\n\n      if (liElement) {\n        intersectionObserverRef.current.observe(liElement);\n      }\n    }\n\n    // Cleanup when unmounted:\n    return () => {\n      if (resizeObserverRef.current) {\n        resizeObserverRef.current.disconnect();\n        resizeObserverRef.current = null;\n      }\n      if (intersectionObserverRef.current) {\n        intersectionObserverRef.current.disconnect();\n        intersectionObserverRef.current = null;\n      }\n      cancelAnimationFrame(resizeObserverDebounceTimer); // Ensure timer is cleared on component unmount\n    };\n  }, [sideNavItemsList]);\n\n  const scrollIntoViewRef = useRef<HTMLLIElement>(null);\n  /**\n   * Look through the sideNavItems and determine which is the first node\n   * with isSelected. This should be the node we set a ref on in order to\n   * call scrollIntoView in the effect\n   */\n  const firstSideNavItemIdWithIsSelected = useMemo(() => {\n    const flattenedItems = sideNavItemsList.flatMap((sideNavItem) =>\n      sideNavItem.nestedNavItems\n        ? [sideNavItem, ...sideNavItem.nestedNavItems]\n        : sideNavItem,\n    );\n    const firstItemWithIsSelected = flattenedItems.find(\n      (sideNavItem) => sideNavItem.isSelected,\n    );\n    return firstItemWithIsSelected?.id;\n  }, [sideNavItemsList]);\n  /**\n   * Once we've rendered and if we have an item to scroll to, do the scroll action.\n   * This must rely on checking firstSideNavItemIdWithIsSelected or it will not run\n   * once the actual ref is populated.\n   */\n  useEffect(() => {\n    if (firstSideNavItemIdWithIsSelected && scrollIntoViewRef.current) {\n      scrollIntoViewRef.current.scrollIntoView();\n    }\n  }, [firstSideNavItemIdWithIsSelected]);\n\n  /**\n   * We only want to put a ref on a node iff it is the first selected node.\n   * This function returns the ref only if the ID provided matches the first\n   * selected node, otherwise returns undefined (so that the node has no ref)\n   */\n  const getRefIfThisIsFirstNodeWithIsSelected = useCallback(\n    (itemId: string) =>\n      itemId === firstSideNavItemIdWithIsSelected\n        ? scrollIntoViewRef\n        : undefined,\n    [firstSideNavItemIdWithIsSelected],\n  );\n\n  const sideNavItemContentProviderValue = useMemo(\n    () => ({ isCompact, depth: 1 }),\n    [isCompact],\n  );\n\n  const setSelectedItem = useCallback(\n    (selectedItemId: string) => {\n      const updatedSideNavItems = sideNavItemsList.map((item) => {\n        if (item.id === selectedItemId) {\n          item.isSelected = true;\n        } else if (item.isSelected) {\n          delete item.isSelected;\n        }\n\n        return item.nestedNavItems\n          ? {\n              ...item,\n              nestedNavItems: item.nestedNavItems.map((childItem) => {\n                if (childItem.id === selectedItemId) {\n                  childItem.isSelected = true;\n                } else if (childItem.isSelected) {\n                  delete childItem.isSelected;\n                }\n                return childItem;\n              }),\n            }\n          : item;\n      });\n      updateSideNavItemsList(updatedSideNavItems);\n\n      if (isCollapsed || isObtrusive) {\n        uiShellContext?.closeSideNavMenu();\n      }\n    },\n    [isCollapsed, isObtrusive, sideNavItemsList, uiShellContext],\n  );\n\n  const processedSideNavItems = useMemo(() => {\n    return sideNavItemsList?.map((item) => ({\n      ...item,\n      childNavItems: item.nestedNavItems?.map((childProps) => {\n        return {\n          id: childProps.id,\n          isSelected: childProps.isSelected,\n          isDisabled: childProps.isDisabled,\n          isSortable: childProps.isSortable,\n          navItem: (\n            <SideNavItemContentContext.Provider\n              value={{\n                ...sideNavItemContentProviderValue,\n                depth: 2,\n                isSortable: item.isSortable,\n              }}\n              key={childProps.id}\n            >\n              <SideNavItemContent\n                {...childProps}\n                scrollRef={getRefIfThisIsFirstNodeWithIsSelected(childProps.id)}\n                onItemSelected={setSelectedItem}\n                translate={childProps.translate}\n              />\n            </SideNavItemContentContext.Provider>\n          ),\n        };\n      }),\n    }));\n  }, [\n    getRefIfThisIsFirstNodeWithIsSelected,\n    sideNavItemsList,\n    sideNavItemContentProviderValue,\n    setSelectedItem,\n  ]);\n\n  const sideNavExpandClickHandler = useCallback(() => {\n    setIsSideNavCollapsed((isSideNavCollapsed) => {\n      if (isSideNavCollapsed) {\n        onExpand?.();\n      } else {\n        onCollapse?.();\n      }\n\n      return !isSideNavCollapsed;\n    });\n  }, [onExpand, onCollapse]);\n\n  const sideNavExpandKeyHandler = useCallback<\n    KeyboardEventHandler<HTMLButtonElement>\n  >(\n    (event) => {\n      if (event?.key === \"Enter\" || event?.code === \"Space\") {\n        event.preventDefault();\n        sideNavExpandClickHandler();\n      }\n    },\n    [sideNavExpandClickHandler],\n  );\n\n  useEffect(() => {\n    if (isCollapsed) {\n      const unsubscribe = uiShellContext?.subscribeToCloseSideNavMenu(() => {\n        onCollapse?.();\n        setIsSideNavCollapsed(true);\n      });\n\n      return () => {\n        unsubscribe?.();\n      };\n    }\n\n    return () => {};\n  }, [isCollapsed, onCollapse, uiShellContext]);\n\n  const setSortedItems = useCallback(\n    (\n      parentId: string,\n      activeId: UniqueIdentifier,\n      activeIndex: number,\n      overIndex: number,\n    ) => {\n      const sortedSideNavItems = sideNavItemsList.map((item) =>\n        item.id === parentId && item.nestedNavItems\n          ? {\n              ...item,\n              nestedNavItems: arrayMove(\n                item.nestedNavItems,\n                activeIndex,\n                overIndex,\n              ),\n            }\n          : item,\n      );\n      updateSideNavItemsList(sortedSideNavItems);\n      onSort?.(sortedSideNavItems, parentId, activeId, activeIndex, overIndex);\n    },\n    [onSort, sideNavItemsList],\n  );\n\n  return (\n    <StyledSideNavContainer\n      aria-label={t(\"navigation.label\")}\n      backgroundColor={uiShellContext?.sideNavBackgroundColor}\n      id=\"side-nav-expandable\"\n      isAppContentWhiteBackground={\n        uiShellContext?.appBackgroundColor ===\n        odysseyDesignTokens.HueNeutralWhite\n      }\n      isSideNavCollapsed={isSideNavCollapsed}\n      odysseyDesignTokens={odysseyDesignTokens}\n    >\n      {isCollapsible && (\n        <SideNavToggleButton\n          ariaControls=\"side-nav-expandable\"\n          isSideNavCollapsed={isSideNavCollapsed}\n          onClick={sideNavExpandClickHandler}\n          onKeyDown={sideNavExpandKeyHandler}\n        />\n      )}\n\n      <OdysseyThemeProvider>\n        <StyledCollapsibleContent\n          data-se=\"collapsible-region\"\n          isSideNavCollapsed={isSideNavCollapsed}\n          odysseyDesignTokens={odysseyDesignTokens}\n        >\n          <StyledOpacityTransitionContainer\n            isSideNavCollapsed={isSideNavCollapsed}\n            odysseyDesignTokens={odysseyDesignTokens}\n          >\n            {appName || isLoading || logoProps ? (\n              <StyledSideNavHeaderContainer\n                hasContentScrolled={hasContentScrolled}\n                odysseyDesignTokens={odysseyDesignTokens}\n                borderColor={uiShellContext?.sideNavContrastColors?.fontColor}\n              >\n                {isLoading && !appName && !logoProps ? (\n                  <SideNavHeader isLoading={isLoading} />\n                ) : (\n                  <SideNavHeader\n                    appName={appName}\n                    isLoading={isLoading}\n                    logoProps={logoProps}\n                  />\n                )}\n              </StyledSideNavHeaderContainer>\n            ) : (\n              <div />\n            )}\n\n            <StyledSideNavScrollableContainer\n              odysseyDesignTokens={odysseyDesignTokens}\n              data-se=\"scrollable-region\"\n            >\n              <StyledSideNavListContainer\n                role=\"none\"\n                ref={scrollableContentRef}\n              >\n                {isLoading\n                  ? Array(6)\n                      .fill(null)\n                      .map((_, index) => <LoadingItem key={index} />)\n                  : processedSideNavItems?.map((item) => {\n                      const {\n                        id,\n                        label,\n                        isSectionHeader,\n                        startIcon,\n                        childNavItems,\n                        isSortable,\n                        isDefaultExpanded,\n                        isDisabled,\n                        isExpanded,\n                      } = item;\n\n                      if (isSectionHeader) {\n                        return (\n                          <ErrorBoundary fallback={blankElement}>\n                            <StyledSectionHeaderContainer\n                              contrastFontColor={\n                                uiShellContext?.sideNavContrastColors?.fontColor\n                              }\n                              id={id}\n                              key={id}\n                              odysseyDesignTokens={odysseyDesignTokens}\n                            >\n                              <Overline component=\"h3\">{label}</Overline>\n                            </StyledSectionHeaderContainer>\n                          </ErrorBoundary>\n                        );\n                      } else if (childNavItems) {\n                        return (\n                          <ErrorBoundary fallback={blankElement}>\n                            <StyledSideNavListItem\n                              id={id}\n                              key={id}\n                              odysseyDesignTokens={odysseyDesignTokens}\n                              disabled={isDisabled}\n                              aria-disabled={isDisabled}\n                            >\n                              <NavAccordion\n                                label={label}\n                                isCompact={isCompact}\n                                isDefaultExpanded={isDefaultExpanded}\n                                isExpanded={isExpanded}\n                                startIcon={startIcon}\n                                isDisabled={isDisabled}\n                              >\n                                <StyledSideNavListContainer role=\"none\">\n                                  {isSortable ? (\n                                    <SortableList\n                                      parentId={item.id}\n                                      items={childNavItems}\n                                      onChange={setSortedItems}\n                                      renderItem={(sortableItem) => (\n                                        <SortableList.Item\n                                          id={sortableItem.id}\n                                          isDisabled={sortableItem.isDisabled}\n                                          isSelected={sortableItem.isSelected}\n                                          isSortable={sortableItem.isSortable}\n                                        >\n                                          {sortableItem.navItem}\n                                        </SortableList.Item>\n                                      )}\n                                    />\n                                  ) : (\n                                    childNavItems.map((item) => item.navItem)\n                                  )}\n                                </StyledSideNavListContainer>\n                              </NavAccordion>\n                            </StyledSideNavListItem>\n                          </ErrorBoundary>\n                        );\n                      } else {\n                        return (\n                          <ErrorBoundary fallback={blankElement}>\n                            <SideNavItemContentContext.Provider\n                              key={item.id}\n                              value={sideNavItemContentProviderValue}\n                            >\n                              <SideNavItemContent\n                                {...item}\n                                key={item.id}\n                                onItemSelected={setSelectedItem}\n                                scrollRef={getRefIfThisIsFirstNodeWithIsSelected(\n                                  item.id,\n                                )}\n                                startIcon={item.startIcon}\n                              />\n                            </SideNavItemContentContext.Provider>\n                          </ErrorBoundary>\n                        );\n                      }\n                    })}\n              </StyledSideNavListContainer>\n              {!isLoading && footerItems && !hasCustomFooter && (\n                <StyledSideNavFooter\n                  odysseyDesignTokens={odysseyDesignTokens}\n                  sideNavBackgroundColor={\n                    uiShellContext?.sideNavBackgroundColor\n                  }\n                >\n                  <StyledSideNavFooterItemsContainer\n                    odysseyDesignTokens={odysseyDesignTokens}\n                    sideNavContrastColors={\n                      uiShellContext?.sideNavContrastColors\n                    }\n                  >\n                    <SideNavFooterContent footerItems={footerItems} />\n                  </StyledSideNavFooterItemsContainer>\n                </StyledSideNavFooter>\n              )}\n            </StyledSideNavScrollableContainer>\n            {!isLoading && !footerItems && hasCustomFooter && (\n              <StyledPersistentSideNavFooter\n                isContentScrollable={isContentScrollable}\n                odysseyDesignTokens={odysseyDesignTokens}\n                sideNavBackgroundColor={uiShellContext?.sideNavBackgroundColor}\n              >\n                {footerComponent}\n              </StyledPersistentSideNavFooter>\n            )}\n          </StyledOpacityTransitionContainer>\n        </StyledCollapsibleContent>\n      </OdysseyThemeProvider>\n    </StyledSideNavContainer>\n  );\n};\n\nconst MemoizedSideNav = memo(SideNav);\nMemoizedSideNav.displayName = \"SideNav\";\n\nexport { MemoizedSideNav as SideNav };\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/ui-shell/SideNav/SideNavHeader.js

@@ -16,18 +16,19 @@ import { memo } from "react";
 import { useOdysseyDesignTokens } from "../../OdysseyDesignTokensContext.js";
 import { SideNavLogo } from "./SideNavLogo.js";
 import { Heading5 } from "../../Typography.js";
-import { TOP_NAV_HEIGHT } from "../TopNav/index.js";
 import { useUiShellContext } from "../../ui-shell/UiShellProvider.js";
+import { TOP_NAV_HEIGHT, UI_SHELL_BASE_Z_INDEX } from "../uiShellSharedConstants.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const SideNavHeaderContainer = styled("div")({
   position: "relative",
   display: "flex",
   flexDirection: "column",
-  zIndex: 1
+  zIndex: UI_SHELL_BASE_Z_INDEX
 });
 const SideNavLogoContainer = styled("div", {
-  shouldForwardProp: prop => prop !== "odysseyDesignTokens" && prop !== "isSameBackgroundAsMain"
+  shouldForwardProp: prop => prop !== "headerBackgroundColor" && prop !== "isSameBackgroundAsMain" && prop !== "odysseyDesignTokens"
 })(({
+  headerBackgroundColor,
   isSameBackgroundAsMain,
   odysseyDesignTokens
 }) => ({
@@ -36,7 +37,7 @@ const SideNavLogoContainer = styled("div", {
   height: TOP_NAV_HEIGHT,
   paddingBlock: odysseyDesignTokens.Spacing4,
   paddingInline: odysseyDesignTokens.Spacing5,
-  backgroundColor: isSameBackgroundAsMain ? "transparent" : odysseyDesignTokens.HueNeutralWhite,
+  backgroundColor: isSameBackgroundAsMain ? headerBackgroundColor : odysseyDesignTokens.HueNeutralWhite,
   "svg, img": {
     maxHeight: "100%",
     width: "auto",
@@ -71,7 +72,9 @@ const SideNavHeader = ({
   return _jsxs(SideNavHeaderContainer, {
     children: [_jsx(SideNavLogoContainer, {
       isSameBackgroundAsMain: logoProps?.isSameBackgroundAsMain,
+      headerBackgroundColor: uiShellContext?.sideNavBackgroundColor,
       odysseyDesignTokens: odysseyDesignTokens,
+      "data-se": "sidenav-header-logo-container",
       children: isLoading ? _jsx(_Skeleton, {
         variant: "rounded",
         height: 24,