@okta/odyssey-react-mui 1.43.0 → 1.45.0

package/dist/cjs/ui-shell/SideNav/CollapseIcon.cjs

@@ -20,10 +20,10 @@ var _jsxRuntime = require("react/jsx-runtime");
 
 const CollapseIcon = () => {
   return (0, _jsxRuntime.jsx)("svg", {
-    width: "32",
+    fill: "none",
     height: "32",
     viewBox: "0 0 12 20",
-    fill: "none",
+    width: "32",
     xmlns: "http://www.w3.org/2000/svg",
     children: (0, _jsxRuntime.jsx)("path", {
       d: "M3.55226 9.99998L11.2761 2.27612L9.39051 0.390503L0.723837 9.05717C0.473789 9.30722 0.333313 9.64636 0.333313 9.99998C0.333313 10.3536 0.473789 10.6927 0.723837 10.9428L9.3905 19.6095L11.2761 17.7238L3.55226 9.99998Z",

package/dist/cjs/ui-shell/SideNav/CollapseIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"CollapseIcon.cjs","names":["_react","require","_jsxRuntime","CollapseIcon","jsx","width","height","viewBox","fill","xmlns","children","d","MemoizedCollapseIcon","exports","memo"],"sources":["../../../../src/ui-shell/SideNav/CollapseIcon.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2024-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 { memo } from \"react\";\n\nconst CollapseIcon = () => {\n  return (\n    <svg\n      width=\"32\"\n      height=\"32\"\n      viewBox=\"0 0 12 20\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <path\n        d=\"M3.55226 9.99998L11.2761 2.27612L9.39051 0.390503L0.723837 9.05717C0.473789 9.30722 0.333313 9.64636 0.333313 9.99998C0.333313 10.3536 0.473789 10.6927 0.723837 10.9428L9.3905 19.6095L11.2761 17.7238L3.55226 9.99998Z\"\n        fill=\"#6E6E6E\"\n      />\n    </svg>\n  );\n};\n\nconst MemoizedCollapseIcon = memo(CollapseIcon);\n\nexport { MemoizedCollapseIcon as CollapseIcon };\n"],"mappings":";;;;;;AAYA,IAAAA,MAAA,GAAAC,OAAA;AAA6B,IAAAC,WAAA,GAAAD,OAAA;AAZ7B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAIA,MAAME,YAAY,GAAGA,CAAA,KAAM;EACzB,OACE,IAAAD,WAAA,CAAAE,GAAA;IACEC,KAAK,EAAC,IAAI;IACVC,MAAM,EAAC,IAAI;IACXC,OAAO,EAAC,WAAW;IACnBC,IAAI,EAAC,MAAM;IACXC,KAAK,EAAC,4BAA4B;IAAAC,QAAA,EAElC,IAAAR,WAAA,CAAAE,GAAA;MACEO,CAAC,EAAC,0NAA0N;MAC5NH,IAAI,EAAC;IAAS,CACf;EAAC,CACC,CAAC;AAEV,CAAC;AAED,MAAMI,oBAAoB,GAAAC,OAAA,CAAAV,YAAA,GAAG,IAAAW,WAAI,EAACX,YAAY,CAAC","ignoreList":[]}
+{"version":3,"file":"CollapseIcon.cjs","names":["_react","require","_jsxRuntime","CollapseIcon","jsx","fill","height","viewBox","width","xmlns","children","d","MemoizedCollapseIcon","exports","memo"],"sources":["../../../../src/ui-shell/SideNav/CollapseIcon.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2024-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 { memo } from \"react\";\n\nconst CollapseIcon = () => {\n  return (\n    <svg\n      fill=\"none\"\n      height=\"32\"\n      viewBox=\"0 0 12 20\"\n      width=\"32\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <path\n        d=\"M3.55226 9.99998L11.2761 2.27612L9.39051 0.390503L0.723837 9.05717C0.473789 9.30722 0.333313 9.64636 0.333313 9.99998C0.333313 10.3536 0.473789 10.6927 0.723837 10.9428L9.3905 19.6095L11.2761 17.7238L3.55226 9.99998Z\"\n        fill=\"#6E6E6E\"\n      />\n    </svg>\n  );\n};\n\nconst MemoizedCollapseIcon = memo(CollapseIcon);\n\nexport { MemoizedCollapseIcon as CollapseIcon };\n"],"mappings":";;;;;;AAYA,IAAAA,MAAA,GAAAC,OAAA;AAA6B,IAAAC,WAAA,GAAAD,OAAA;AAZ7B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAIA,MAAME,YAAY,GAAGA,CAAA,KAAM;EACzB,OACE,IAAAD,WAAA,CAAAE,GAAA;IACEC,IAAI,EAAC,MAAM;IACXC,MAAM,EAAC,IAAI;IACXC,OAAO,EAAC,WAAW;IACnBC,KAAK,EAAC,IAAI;IACVC,KAAK,EAAC,4BAA4B;IAAAC,QAAA,EAElC,IAAAR,WAAA,CAAAE,GAAA;MACEO,CAAC,EAAC,0NAA0N;MAC5NN,IAAI,EAAC;IAAS,CACf;EAAC,CACC,CAAC;AAEV,CAAC;AAED,MAAMO,oBAAoB,GAAAC,OAAA,CAAAV,YAAA,GAAG,IAAAW,WAAI,EAACX,YAAY,CAAC","ignoreList":[]}

package/dist/cjs/ui-shell/SideNav/HandleIcon.cjs

@@ -20,16 +20,16 @@ var _jsxRuntime = require("react/jsx-runtime");
 
 const HandleIcon = () => {
   return (0, _jsxRuntime.jsx)("svg", {
-    width: "32",
+    fill: "none",
     height: "32",
     viewBox: "0 0 32 32",
-    fill: "none",
+    width: "32",
     xmlns: "http://www.w3.org/2000/svg",
     children: (0, _jsxRuntime.jsx)("path", {
-      fillRule: "evenodd",
       clipRule: "evenodd",
       d: "M17.4167 6.66687L17.4167 25.3335L14.5834 25.3335L14.5834 6.66687L17.4167 6.66687Z",
-      fill: "#6E6E6E"
+      fill: "#6E6E6E",
+      fillRule: "evenodd"
     })
   });
 };

package/dist/cjs/ui-shell/SideNav/HandleIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"HandleIcon.cjs","names":["_react","require","_jsxRuntime","HandleIcon","jsx","width","height","viewBox","fill","xmlns","children","fillRule","clipRule","d","MemoizedHandleIcon","exports","memo"],"sources":["../../../../src/ui-shell/SideNav/HandleIcon.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2024-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 { memo } from \"react\";\n\nconst HandleIcon = () => {\n  return (\n    <svg\n      width=\"32\"\n      height=\"32\"\n      viewBox=\"0 0 32 32\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M17.4167 6.66687L17.4167 25.3335L14.5834 25.3335L14.5834 6.66687L17.4167 6.66687Z\"\n        fill=\"#6E6E6E\"\n      />\n    </svg>\n  );\n};\nconst MemoizedHandleIcon = memo(HandleIcon);\n\nexport { MemoizedHandleIcon as HandleIcon };\n"],"mappings":";;;;;;AAYA,IAAAA,MAAA,GAAAC,OAAA;AAA6B,IAAAC,WAAA,GAAAD,OAAA;AAZ7B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAIA,MAAME,UAAU,GAAGA,CAAA,KAAM;EACvB,OACE,IAAAD,WAAA,CAAAE,GAAA;IACEC,KAAK,EAAC,IAAI;IACVC,MAAM,EAAC,IAAI;IACXC,OAAO,EAAC,WAAW;IACnBC,IAAI,EAAC,MAAM;IACXC,KAAK,EAAC,4BAA4B;IAAAC,QAAA,EAElC,IAAAR,WAAA,CAAAE,GAAA;MACEO,QAAQ,EAAC,SAAS;MAClBC,QAAQ,EAAC,SAAS;MAClBC,CAAC,EAAC,mFAAmF;MACrFL,IAAI,EAAC;IAAS,CACf;EAAC,CACC,CAAC;AAEV,CAAC;AACD,MAAMM,kBAAkB,GAAAC,OAAA,CAAAZ,UAAA,GAAG,IAAAa,WAAI,EAACb,UAAU,CAAC","ignoreList":[]}
+{"version":3,"file":"HandleIcon.cjs","names":["_react","require","_jsxRuntime","HandleIcon","jsx","fill","height","viewBox","width","xmlns","children","clipRule","d","fillRule","MemoizedHandleIcon","exports","memo"],"sources":["../../../../src/ui-shell/SideNav/HandleIcon.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2024-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 { memo } from \"react\";\n\nconst HandleIcon = () => {\n  return (\n    <svg\n      fill=\"none\"\n      height=\"32\"\n      viewBox=\"0 0 32 32\"\n      width=\"32\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <path\n        clipRule=\"evenodd\"\n        d=\"M17.4167 6.66687L17.4167 25.3335L14.5834 25.3335L14.5834 6.66687L17.4167 6.66687Z\"\n        fill=\"#6E6E6E\"\n        fillRule=\"evenodd\"\n      />\n    </svg>\n  );\n};\nconst MemoizedHandleIcon = memo(HandleIcon);\n\nexport { MemoizedHandleIcon as HandleIcon };\n"],"mappings":";;;;;;AAYA,IAAAA,MAAA,GAAAC,OAAA;AAA6B,IAAAC,WAAA,GAAAD,OAAA;AAZ7B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAIA,MAAME,UAAU,GAAGA,CAAA,KAAM;EACvB,OACE,IAAAD,WAAA,CAAAE,GAAA;IACEC,IAAI,EAAC,MAAM;IACXC,MAAM,EAAC,IAAI;IACXC,OAAO,EAAC,WAAW;IACnBC,KAAK,EAAC,IAAI;IACVC,KAAK,EAAC,4BAA4B;IAAAC,QAAA,EAElC,IAAAR,WAAA,CAAAE,GAAA;MACEO,QAAQ,EAAC,SAAS;MAClBC,CAAC,EAAC,mFAAmF;MACrFP,IAAI,EAAC,SAAS;MACdQ,QAAQ,EAAC;IAAS,CACnB;EAAC,CACC,CAAC;AAEV,CAAC;AACD,MAAMC,kBAAkB,GAAAC,OAAA,CAAAZ,UAAA,GAAG,IAAAa,WAAI,EAACb,UAAU,CAAC","ignoreList":[]}

package/dist/cjs/ui-shell/SideNav/NavAccordion.cjs

@@ -12,8 +12,8 @@ var _react = require("react");
 var _index = require("../../icons.generated/index.cjs");
 var _OdysseyDesignTokensContext = require("../../OdysseyDesignTokensContext.cjs");
 var _Typography = require("../../Typography.cjs");
-var _useUniqueId = require("../../useUniqueId.cjs");
 var _UiShellProvider = require("../../ui-shell/UiShellProvider.cjs");
+var _useUniqueId = require("../../useUniqueId.cjs");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /*!
@@ -130,33 +130,33 @@ const NavAccordion = ({
   return (0, _jsxRuntime.jsx)(SideNavAccordionContainer, {
     backgroundColor: uiShellContext?.sideNavBackgroundColor,
     children: (0, _jsxRuntime.jsxs)(_Accordion2.default, {
+      className: "nav-accordion",
       defaultExpanded: isDefaultExpanded,
       disabled: isDisabled,
       disableGutters: true,
       expanded: isExpanded,
-      className: "nav-accordion",
       children: [(0, _jsxRuntime.jsx)(AccordionSummaryContainer, {
         "aria-controls": contentId,
         className: "nav-accordion-summary",
         expandIcon: (0, _jsxRuntime.jsx)(_index.ChevronDownIcon, {}),
-        sideNavContrastColors: uiShellContext?.sideNavContrastColors,
         id: headerId,
         isCompact: isCompact,
         isDisabled: isDisabled,
         odysseyDesignTokens: odysseyDesignTokens,
+        sideNavContrastColors: uiShellContext?.sideNavContrastColors,
         children: (0, _jsxRuntime.jsxs)(_Typography.Support, {
           component: "div",
           translate: translate,
           children: [startIcon && startIcon, (0, _jsxRuntime.jsx)(AccordionLabelContainer, {
-            sideNavContrastColors: uiShellContext?.sideNavContrastColors,
             isIconVisible: Boolean(startIcon),
             odysseyDesignTokens: odysseyDesignTokens,
+            sideNavContrastColors: uiShellContext?.sideNavContrastColors,
             children: label
           })]
         })
       }), (0, _jsxRuntime.jsx)(_AccordionDetails2.default, {
-        className: "nav-accordion-details",
         "aria-labelledby": headerId,
+        className: "nav-accordion-details",
         children: children
       })]
     })

package/dist/cjs/ui-shell/SideNav/NavAccordion.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"NavAccordion.cjs","names":["_styled","_interopRequireDefault","require","_react","_index","_OdysseyDesignTokensContext","_Typography","_useUniqueId","_UiShellProvider","_jsxRuntime","e","__esModule","default","SideNavAccordionContainer","styled","shouldForwardProp","prop","backgroundColor","fontColor","width","color","AccordionLabelContainer","sideNavContrastColors","odysseyDesignTokens","isIconVisible","marginInlineStart","Spacing3","fontWeight","TypographyWeightHeading","TypographyColorHeading","TypographyColorDisabled","itemDisabledFontColor","AccordionSummaryContainer","_AccordionSummary2","isCompact","isDisabled","borderRadius","BorderRadiusMain","paddingBlock","paddingInline","Spacing4","opacity","svg","path","fill","HueNeutral50","itemHoverBackgroundColor","outline","boxShadow","PalettePrimaryMain","focusRingColor","Spacing2","minHeight","NavAccordion","children","label","id","idOverride","isDefaultExpanded","isExpanded","translate","startIcon","useUniqueId","headerId","contentId","useOdysseyDesignTokens","uiShellContext","useUiShellContext","jsx","sideNavBackgroundColor","jsxs","_Accordion2","defaultExpanded","disabled","disableGutters","expanded","className","expandIcon","ChevronDownIcon","Support","component","Boolean","_AccordionDetails2","MemoizedNavAccordion","exports","memo","displayName"],"sources":["../../../../src/ui-shell/SideNav/NavAccordion.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-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  Accordion as MuiAccordion,\n  AccordionDetails as MuiAccordionDetails,\n  AccordionSummary as MuiAccordionSummary,\n  AccordionProps as MuiAccordionProps,\n} from \"@mui/material\";\nimport { PropsWithChildren, ReactNode, memo } from \"react\";\n\nimport type { HtmlProps } from \"../../HtmlProps.js\";\nimport { ChevronDownIcon } from \"../../icons.generated/index.js\";\nimport {\n  DesignTokens,\n  useOdysseyDesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\nimport { Support } from \"../../Typography.js\";\nimport { useUniqueId } from \"../../useUniqueId.js\";\nimport {\n  UiShellColors,\n  useUiShellContext,\n} from \"../../ui-shell/UiShellProvider.js\";\nimport { ContrastColors } from \"../../createContrastColors.js\";\n\nconst SideNavAccordionContainer = styled(\"div\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"backgroundColor\" && prop !== \"fontColor\",\n})<{\n  backgroundColor?: UiShellColors[\"sideNavBackgroundColor\"];\n  fontColor?: ContrastColors[\"fontColor\"];\n}>(({ backgroundColor, fontColor }) => ({\n  width: \"100%\",\n\n  \".MuiAccordion-root\": {\n    backgroundColor: backgroundColor,\n    color: fontColor || \"inherit\",\n  },\n}));\n\nexport type NavAccordionProps = {\n  /**\n   * The label text for the AccordionSummary\n   */\n  label: string;\n  /**\n   * Defines IDs for the header and the content of the Accordion\n   */\n  id?: string;\n  /**\n   *  Determines if the Accordion component use compact layout\n   */\n  isCompact?: boolean;\n  /**\n   * Whether the item is expanded by default\n   */\n  isDefaultExpanded?: boolean;\n  /**\n   * Whether the item is disabled\n   */\n  isDisabled?: boolean;\n  /**\n   * If true, expands the accordion, otherwise collapse it.\n   * Setting this prop enables control over the accordion.\n   */\n  isExpanded?: boolean;\n  /**\n   * Event fired when the expansion state of the accordion is changed\n   */\n  onChange?: MuiAccordionProps[\"onChange\"];\n  /**\n   * The icon element to display at the start of the Nav Item\n   */\n  startIcon?: ReactNode;\n} & Pick<HtmlProps, \"testId\" | \"translate\">;\n\nconst AccordionLabelContainer = styled(\"span\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"odysseyDesignTokens\" &&\n    prop !== \"isIconVisible\" &&\n    prop !== \"sideNavContrastColors\",\n})<{\n  sideNavContrastColors?: UiShellColors[\"sideNavContrastColors\"];\n  isIconVisible: boolean;\n  odysseyDesignTokens: DesignTokens;\n}>(({ sideNavContrastColors, odysseyDesignTokens, isIconVisible }) => ({\n  width: \"100%\",\n  marginInlineStart: isIconVisible ? odysseyDesignTokens.Spacing3 : 0,\n  fontWeight: odysseyDesignTokens.TypographyWeightHeading,\n  color:\n    sideNavContrastColors?.fontColor ||\n    odysseyDesignTokens.TypographyColorHeading,\n\n  \".Mui-disabled &\": {\n    color: odysseyDesignTokens.TypographyColorDisabled,\n\n    ...(sideNavContrastColors?.itemDisabledFontColor && {\n      color: sideNavContrastColors?.itemDisabledFontColor,\n    }),\n  },\n}));\n\nconst AccordionSummaryContainer = styled(MuiAccordionSummary, {\n  shouldForwardProp: (prop) =>\n    prop !== \"odysseyDesignTokens\" &&\n    prop !== \"isCompact\" &&\n    prop !== \"isDisabled\" &&\n    prop !== \"sideNavContrastColors\",\n})<{\n  sideNavContrastColors?: UiShellColors[\"sideNavContrastColors\"];\n  isCompact?: boolean;\n  isDisabled?: boolean;\n  odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens, sideNavContrastColors, isCompact, isDisabled }) => ({\n  borderRadius: odysseyDesignTokens.BorderRadiusMain,\n  paddingBlock: odysseyDesignTokens.Spacing3,\n  paddingInline: odysseyDesignTokens.Spacing4,\n\n  ...(isDisabled && {\n    opacity: \"1 !important\",\n\n    ...(sideNavContrastColors?.itemDisabledFontColor && {\n      svg: {\n        path: {\n          fill: `${sideNavContrastColors.itemDisabledFontColor} !important`,\n        },\n      },\n    }),\n  }),\n\n  ...(!isDisabled && {\n    \"&:hover\": {\n      backgroundColor: odysseyDesignTokens.HueNeutral50,\n    },\n  }),\n\n  ...(!isDisabled &&\n    sideNavContrastColors?.fontColor && {\n      svg: {\n        path: {\n          fill: `${sideNavContrastColors.fontColor} !important`,\n        },\n      },\n    }),\n\n  ...(sideNavContrastColors?.itemHoverBackgroundColor && {\n    ...(!isDisabled && {\n      \"&:hover\": {\n        backgroundColor: sideNavContrastColors.itemHoverBackgroundColor,\n      },\n    }),\n  }),\n\n  \"&:focus-visible\": {\n    backgroundColor: \"unset\",\n    outline: \"none\",\n    boxShadow: `inset 0 0 0 2px ${odysseyDesignTokens.PalettePrimaryMain}`,\n\n    ...(sideNavContrastColors?.focusRingColor && {\n      boxShadow: `inset 0 0 0 2px ${sideNavContrastColors.focusRingColor}`,\n    }),\n  },\n\n  ...(isCompact && {\n    paddingBlock: odysseyDesignTokens.Spacing2,\n    minHeight: \"unset\",\n  }),\n}));\n\nconst NavAccordion = ({\n  children,\n  label,\n  id: idOverride,\n  isCompact,\n  isDefaultExpanded,\n  isDisabled,\n  isExpanded,\n  translate,\n  startIcon,\n}: PropsWithChildren<NavAccordionProps>) => {\n  const id = useUniqueId(idOverride);\n  const headerId = `${id}-header`;\n  const contentId = `${id}-content`;\n  const odysseyDesignTokens = useOdysseyDesignTokens();\n  const uiShellContext = useUiShellContext();\n\n  return (\n    <SideNavAccordionContainer\n      backgroundColor={uiShellContext?.sideNavBackgroundColor}\n    >\n      <MuiAccordion\n        defaultExpanded={isDefaultExpanded}\n        disabled={isDisabled}\n        disableGutters\n        expanded={isExpanded}\n        className=\"nav-accordion\"\n      >\n        <AccordionSummaryContainer\n          aria-controls={contentId}\n          className=\"nav-accordion-summary\"\n          expandIcon={<ChevronDownIcon />}\n          sideNavContrastColors={uiShellContext?.sideNavContrastColors}\n          id={headerId}\n          isCompact={isCompact}\n          isDisabled={isDisabled}\n          odysseyDesignTokens={odysseyDesignTokens}\n        >\n          <Support component=\"div\" translate={translate}>\n            {startIcon && startIcon}\n            <AccordionLabelContainer\n              sideNavContrastColors={uiShellContext?.sideNavContrastColors}\n              isIconVisible={Boolean(startIcon)}\n              odysseyDesignTokens={odysseyDesignTokens}\n            >\n              {label}\n            </AccordionLabelContainer>\n          </Support>\n        </AccordionSummaryContainer>\n        <MuiAccordionDetails\n          className=\"nav-accordion-details\"\n          aria-labelledby={headerId}\n        >\n          {children}\n        </MuiAccordionDetails>\n      </MuiAccordion>\n    </SideNavAccordionContainer>\n  );\n};\n\nconst MemoizedNavAccordion = memo(NavAccordion);\nMemoizedNavAccordion.displayName = \"NavAccordion\";\n\nexport { MemoizedNavAccordion as NavAccordion };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"NavAccordion.cjs","names":["_styled","_interopRequireDefault","require","_react","_index","_OdysseyDesignTokensContext","_Typography","_UiShellProvider","_useUniqueId","_jsxRuntime","e","__esModule","default","SideNavAccordionContainer","styled","shouldForwardProp","prop","backgroundColor","fontColor","width","color","AccordionLabelContainer","sideNavContrastColors","odysseyDesignTokens","isIconVisible","marginInlineStart","Spacing3","fontWeight","TypographyWeightHeading","TypographyColorHeading","TypographyColorDisabled","itemDisabledFontColor","AccordionSummaryContainer","_AccordionSummary2","isCompact","isDisabled","borderRadius","BorderRadiusMain","paddingBlock","paddingInline","Spacing4","opacity","svg","path","fill","HueNeutral50","itemHoverBackgroundColor","outline","boxShadow","PalettePrimaryMain","focusRingColor","Spacing2","minHeight","NavAccordion","children","label","id","idOverride","isDefaultExpanded","isExpanded","translate","startIcon","useUniqueId","headerId","contentId","useOdysseyDesignTokens","uiShellContext","useUiShellContext","jsx","sideNavBackgroundColor","jsxs","_Accordion2","className","defaultExpanded","disabled","disableGutters","expanded","expandIcon","ChevronDownIcon","Support","component","Boolean","_AccordionDetails2","MemoizedNavAccordion","exports","memo","displayName"],"sources":["../../../../src/ui-shell/SideNav/NavAccordion.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-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  Accordion as MuiAccordion,\n  AccordionDetails as MuiAccordionDetails,\n  AccordionProps as MuiAccordionProps,\n  AccordionSummary as MuiAccordionSummary,\n} from \"@mui/material\";\nimport { memo, PropsWithChildren, ReactNode } from \"react\";\n\nimport type { HtmlProps } from \"../../HtmlProps.js\";\n\nimport { ContrastColors } from \"../../createContrastColors.js\";\nimport { ChevronDownIcon } from \"../../icons.generated/index.js\";\nimport {\n  DesignTokens,\n  useOdysseyDesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\nimport { Support } from \"../../Typography.js\";\nimport {\n  UiShellColors,\n  useUiShellContext,\n} from \"../../ui-shell/UiShellProvider.js\";\nimport { useUniqueId } from \"../../useUniqueId.js\";\n\nconst SideNavAccordionContainer = styled(\"div\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"backgroundColor\" && prop !== \"fontColor\",\n})<{\n  backgroundColor?: UiShellColors[\"sideNavBackgroundColor\"];\n  fontColor?: ContrastColors[\"fontColor\"];\n}>(({ backgroundColor, fontColor }) => ({\n  width: \"100%\",\n\n  \".MuiAccordion-root\": {\n    backgroundColor: backgroundColor,\n    color: fontColor || \"inherit\",\n  },\n}));\n\nexport type NavAccordionProps = {\n  /**\n   * Defines IDs for the header and the content of the Accordion\n   */\n  id?: string;\n  /**\n   *  Determines if the Accordion component use compact layout\n   */\n  isCompact?: boolean;\n  /**\n   * Whether the item is expanded by default\n   */\n  isDefaultExpanded?: boolean;\n  /**\n   * Whether the item is disabled\n   */\n  isDisabled?: boolean;\n  /**\n   * If true, expands the accordion, otherwise collapse it.\n   * Setting this prop enables control over the accordion.\n   */\n  isExpanded?: boolean;\n  /**\n   * The label text for the AccordionSummary\n   */\n  label: string;\n  /**\n   * Event fired when the expansion state of the accordion is changed\n   */\n  onChange?: MuiAccordionProps[\"onChange\"];\n  /**\n   * The icon element to display at the start of the Nav Item\n   */\n  startIcon?: ReactNode;\n} & Pick<HtmlProps, \"testId\" | \"translate\">;\n\nconst AccordionLabelContainer = styled(\"span\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"odysseyDesignTokens\" &&\n    prop !== \"isIconVisible\" &&\n    prop !== \"sideNavContrastColors\",\n})<{\n  isIconVisible: boolean;\n  odysseyDesignTokens: DesignTokens;\n  sideNavContrastColors?: UiShellColors[\"sideNavContrastColors\"];\n}>(({ sideNavContrastColors, odysseyDesignTokens, isIconVisible }) => ({\n  width: \"100%\",\n  marginInlineStart: isIconVisible ? odysseyDesignTokens.Spacing3 : 0,\n  fontWeight: odysseyDesignTokens.TypographyWeightHeading,\n  color:\n    sideNavContrastColors?.fontColor ||\n    odysseyDesignTokens.TypographyColorHeading,\n\n  \".Mui-disabled &\": {\n    color: odysseyDesignTokens.TypographyColorDisabled,\n\n    ...(sideNavContrastColors?.itemDisabledFontColor && {\n      color: sideNavContrastColors?.itemDisabledFontColor,\n    }),\n  },\n}));\n\nconst AccordionSummaryContainer = styled(MuiAccordionSummary, {\n  shouldForwardProp: (prop) =>\n    prop !== \"odysseyDesignTokens\" &&\n    prop !== \"isCompact\" &&\n    prop !== \"isDisabled\" &&\n    prop !== \"sideNavContrastColors\",\n})<{\n  isCompact?: boolean;\n  isDisabled?: boolean;\n  odysseyDesignTokens: DesignTokens;\n  sideNavContrastColors?: UiShellColors[\"sideNavContrastColors\"];\n}>(({ odysseyDesignTokens, sideNavContrastColors, isCompact, isDisabled }) => ({\n  borderRadius: odysseyDesignTokens.BorderRadiusMain,\n  paddingBlock: odysseyDesignTokens.Spacing3,\n  paddingInline: odysseyDesignTokens.Spacing4,\n\n  ...(isDisabled && {\n    opacity: \"1 !important\",\n\n    ...(sideNavContrastColors?.itemDisabledFontColor && {\n      svg: {\n        path: {\n          fill: `${sideNavContrastColors.itemDisabledFontColor} !important`,\n        },\n      },\n    }),\n  }),\n\n  ...(!isDisabled && {\n    \"&:hover\": {\n      backgroundColor: odysseyDesignTokens.HueNeutral50,\n    },\n  }),\n\n  ...(!isDisabled &&\n    sideNavContrastColors?.fontColor && {\n      svg: {\n        path: {\n          fill: `${sideNavContrastColors.fontColor} !important`,\n        },\n      },\n    }),\n\n  ...(sideNavContrastColors?.itemHoverBackgroundColor && {\n    ...(!isDisabled && {\n      \"&:hover\": {\n        backgroundColor: sideNavContrastColors.itemHoverBackgroundColor,\n      },\n    }),\n  }),\n\n  \"&:focus-visible\": {\n    backgroundColor: \"unset\",\n    outline: \"none\",\n    boxShadow: `inset 0 0 0 2px ${odysseyDesignTokens.PalettePrimaryMain}`,\n\n    ...(sideNavContrastColors?.focusRingColor && {\n      boxShadow: `inset 0 0 0 2px ${sideNavContrastColors.focusRingColor}`,\n    }),\n  },\n\n  ...(isCompact && {\n    paddingBlock: odysseyDesignTokens.Spacing2,\n    minHeight: \"unset\",\n  }),\n}));\n\nconst NavAccordion = ({\n  children,\n  label,\n  id: idOverride,\n  isCompact,\n  isDefaultExpanded,\n  isDisabled,\n  isExpanded,\n  translate,\n  startIcon,\n}: PropsWithChildren<NavAccordionProps>) => {\n  const id = useUniqueId(idOverride);\n  const headerId = `${id}-header`;\n  const contentId = `${id}-content`;\n  const odysseyDesignTokens = useOdysseyDesignTokens();\n  const uiShellContext = useUiShellContext();\n\n  return (\n    <SideNavAccordionContainer\n      backgroundColor={uiShellContext?.sideNavBackgroundColor}\n    >\n      <MuiAccordion\n        className=\"nav-accordion\"\n        defaultExpanded={isDefaultExpanded}\n        disabled={isDisabled}\n        disableGutters\n        expanded={isExpanded}\n      >\n        <AccordionSummaryContainer\n          aria-controls={contentId}\n          className=\"nav-accordion-summary\"\n          expandIcon={<ChevronDownIcon />}\n          id={headerId}\n          isCompact={isCompact}\n          isDisabled={isDisabled}\n          odysseyDesignTokens={odysseyDesignTokens}\n          sideNavContrastColors={uiShellContext?.sideNavContrastColors}\n        >\n          <Support component=\"div\" translate={translate}>\n            {startIcon && startIcon}\n            <AccordionLabelContainer\n              isIconVisible={Boolean(startIcon)}\n              odysseyDesignTokens={odysseyDesignTokens}\n              sideNavContrastColors={uiShellContext?.sideNavContrastColors}\n            >\n              {label}\n            </AccordionLabelContainer>\n          </Support>\n        </AccordionSummaryContainer>\n        <MuiAccordionDetails\n          aria-labelledby={headerId}\n          className=\"nav-accordion-details\"\n        >\n          {children}\n        </MuiAccordionDetails>\n      </MuiAccordion>\n    </SideNavAccordionContainer>\n  );\n};\n\nconst MemoizedNavAccordion = memo(NavAccordion);\nMemoizedNavAccordion.displayName = \"NavAccordion\";\n\nexport { MemoizedNavAccordion as NavAccordion };\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/ui-shell/SideNav/OktaLogo.cjs

@@ -20,10 +20,10 @@ var _jsxRuntime = require("react/jsx-runtime");
 
 const OktaLogo = () => {
   return (0, _jsxRuntime.jsxs)("svg", {
-    width: "67",
+    fill: "none",
     height: "24",
     viewBox: "0 0 67 24",
-    fill: "none",
+    width: "67",
     xmlns: "http://www.w3.org/2000/svg",
     children: [(0, _jsxRuntime.jsx)("title", {
       children: "Okta"

package/dist/cjs/ui-shell/SideNav/OktaLogo.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"OktaLogo.cjs","names":["_react","require","_jsxRuntime","OktaLogo","jsxs","width","height","viewBox","fill","xmlns","children","jsx","d","MemoizedOktaLogo","exports","memo"],"sources":["../../../../src/ui-shell/SideNav/OktaLogo.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2024-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 { memo } from \"react\";\n\nconst OktaLogo = () => {\n  return (\n    <svg\n      width=\"67\"\n      height=\"24\"\n      viewBox=\"0 0 67 24\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <title>Okta</title>\n      <path\n        d=\"M55.308 20.5716C52.1058 20.5716 49.8418 18.0813 49.8418 14.8145C49.8418 11.5476 52.1058 9.0574 55.308 9.0574C58.5103 9.0574 60.7097 11.5476 60.7097 14.8145C60.7097 18.0813 58.478 20.5716 55.308 20.5716ZM54.7905 24C57.3782 24 59.5777 22.9972 60.9682 20.8947C61.2267 22.9326 62.7147 23.6763 64.5905 23.6763H66.0785V20.4418H65.4317C64.3643 20.4418 64.1058 19.9242 64.1058 18.7276V5.95153H60.6774V8.57159C59.5131 6.72814 57.3136 5.62842 54.7911 5.62842C50.2952 5.62842 46.1554 9.38051 46.1554 14.8139C46.1554 20.2473 50.2947 24 54.7905 24ZM37.1309 19.5688C37.1309 22.4797 38.942 23.6763 41.1092 23.6763H45.2813V20.4418H42.2412C40.9799 20.4418 40.7209 19.9565 40.7209 18.7276V9.18608H45.2813V5.95153H40.7209V0H37.1309V19.5688ZM20.7972 23.6763H24.3872V16.0758H25.5838L31.6969 23.6763H36.225L28.4301 14.0379L34.4139 5.9521H30.371L25.4869 12.7766H24.3872V0.00113398H20.7972V23.6763ZM9.1532 5.62842C4.13983 5.62842 0 9.38051 0 14.8139C0 20.2473 4.13983 23.9994 9.1532 23.9994C14.1666 23.9994 18.3064 20.2473 18.3064 14.8139C18.3064 9.38051 14.1666 5.62842 9.1532 5.62842ZM9.1532 20.5716C5.95096 20.5716 3.68689 18.0813 3.68689 14.8145C3.68689 11.5476 5.95096 9.0574 9.1532 9.0574C12.3554 9.0574 14.6195 11.5476 14.6195 14.8145C14.6195 18.0813 12.3554 20.5716 9.1532 20.5716Z\"\n        fill=\"black\"\n      />\n    </svg>\n  );\n};\nconst MemoizedOktaLogo = memo(OktaLogo);\n\nexport { MemoizedOktaLogo as OktaLogo };\n"],"mappings":";;;;;;AAYA,IAAAA,MAAA,GAAAC,OAAA;AAA6B,IAAAC,WAAA,GAAAD,OAAA;AAZ7B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAIA,MAAME,QAAQ,GAAGA,CAAA,KAAM;EACrB,OACE,IAAAD,WAAA,CAAAE,IAAA;IACEC,KAAK,EAAC,IAAI;IACVC,MAAM,EAAC,IAAI;IACXC,OAAO,EAAC,WAAW;IACnBC,IAAI,EAAC,MAAM;IACXC,KAAK,EAAC,4BAA4B;IAAAC,QAAA,GAElC,IAAAR,WAAA,CAAAS,GAAA;MAAAD,QAAA,EAAO;IAAI,CAAO,CAAC,EACnB,IAAAR,WAAA,CAAAS,GAAA;MACEC,CAAC,EAAC,mvCAAmvC;MACrvCJ,IAAI,EAAC;IAAO,CACb,CAAC;EAAA,CACC,CAAC;AAEV,CAAC;AACD,MAAMK,gBAAgB,GAAAC,OAAA,CAAAX,QAAA,GAAG,IAAAY,WAAI,EAACZ,QAAQ,CAAC","ignoreList":[]}
+{"version":3,"file":"OktaLogo.cjs","names":["_react","require","_jsxRuntime","OktaLogo","jsxs","fill","height","viewBox","width","xmlns","children","jsx","d","MemoizedOktaLogo","exports","memo"],"sources":["../../../../src/ui-shell/SideNav/OktaLogo.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2024-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 { memo } from \"react\";\n\nconst OktaLogo = () => {\n  return (\n    <svg\n      fill=\"none\"\n      height=\"24\"\n      viewBox=\"0 0 67 24\"\n      width=\"67\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <title>Okta</title>\n      <path\n        d=\"M55.308 20.5716C52.1058 20.5716 49.8418 18.0813 49.8418 14.8145C49.8418 11.5476 52.1058 9.0574 55.308 9.0574C58.5103 9.0574 60.7097 11.5476 60.7097 14.8145C60.7097 18.0813 58.478 20.5716 55.308 20.5716ZM54.7905 24C57.3782 24 59.5777 22.9972 60.9682 20.8947C61.2267 22.9326 62.7147 23.6763 64.5905 23.6763H66.0785V20.4418H65.4317C64.3643 20.4418 64.1058 19.9242 64.1058 18.7276V5.95153H60.6774V8.57159C59.5131 6.72814 57.3136 5.62842 54.7911 5.62842C50.2952 5.62842 46.1554 9.38051 46.1554 14.8139C46.1554 20.2473 50.2947 24 54.7905 24ZM37.1309 19.5688C37.1309 22.4797 38.942 23.6763 41.1092 23.6763H45.2813V20.4418H42.2412C40.9799 20.4418 40.7209 19.9565 40.7209 18.7276V9.18608H45.2813V5.95153H40.7209V0H37.1309V19.5688ZM20.7972 23.6763H24.3872V16.0758H25.5838L31.6969 23.6763H36.225L28.4301 14.0379L34.4139 5.9521H30.371L25.4869 12.7766H24.3872V0.00113398H20.7972V23.6763ZM9.1532 5.62842C4.13983 5.62842 0 9.38051 0 14.8139C0 20.2473 4.13983 23.9994 9.1532 23.9994C14.1666 23.9994 18.3064 20.2473 18.3064 14.8139C18.3064 9.38051 14.1666 5.62842 9.1532 5.62842ZM9.1532 20.5716C5.95096 20.5716 3.68689 18.0813 3.68689 14.8145C3.68689 11.5476 5.95096 9.0574 9.1532 9.0574C12.3554 9.0574 14.6195 11.5476 14.6195 14.8145C14.6195 18.0813 12.3554 20.5716 9.1532 20.5716Z\"\n        fill=\"black\"\n      />\n    </svg>\n  );\n};\nconst MemoizedOktaLogo = memo(OktaLogo);\n\nexport { MemoizedOktaLogo as OktaLogo };\n"],"mappings":";;;;;;AAYA,IAAAA,MAAA,GAAAC,OAAA;AAA6B,IAAAC,WAAA,GAAAD,OAAA;AAZ7B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAIA,MAAME,QAAQ,GAAGA,CAAA,KAAM;EACrB,OACE,IAAAD,WAAA,CAAAE,IAAA;IACEC,IAAI,EAAC,MAAM;IACXC,MAAM,EAAC,IAAI;IACXC,OAAO,EAAC,WAAW;IACnBC,KAAK,EAAC,IAAI;IACVC,KAAK,EAAC,4BAA4B;IAAAC,QAAA,GAElC,IAAAR,WAAA,CAAAS,GAAA;MAAAD,QAAA,EAAO;IAAI,CAAO,CAAC,EACnB,IAAAR,WAAA,CAAAS,GAAA;MACEC,CAAC,EAAC,mvCAAmvC;MACrvCP,IAAI,EAAC;IAAO,CACb,CAAC;EAAA,CACC,CAAC;AAEV,CAAC;AACD,MAAMQ,gBAAgB,GAAAC,OAAA,CAAAX,QAAA,GAAG,IAAAY,WAAI,EAACZ,QAAQ,CAAC","ignoreList":[]}

package/dist/cjs/ui-shell/SideNav/SideNav.cjs

@@ -5,26 +5,26 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.SideNav = exports.SIDE_NAV_COLLAPSED_PADDING_UNHIGHLIGHTED = exports.SIDE_NAV_COLLAPSED_PADDING_HIGHLIGHTED = void 0;
 var _Skeleton2 = _interopRequireDefault(require("@mui/material/Skeleton"));
+var _sortable = require("@dnd-kit/sortable");
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _react = require("react");
-var _reactI18next = require("react-i18next");
-var _sortable = require("@dnd-kit/sortable");
 var _reactErrorBoundary = require("react-error-boundary");
-var _NavAccordion = require("./NavAccordion.cjs");
+var _reactI18next = require("react-i18next");
 var _OdysseyDesignTokensContext = require("../../OdysseyDesignTokensContext.cjs");
-var _useElementAtContainerEdge = require("../useElementAtContainerEdge.cjs");
 var _OdysseyThemeProvider = require("../../OdysseyThemeProvider.cjs");
+var _Typography = require("../../Typography.cjs");
+var _UiShellProvider = require("../../ui-shell/UiShellProvider.cjs");
+var _useMountLifecycleEffect = require("../../useMountLifecycleEffect.cjs");
+var _uiShellSharedConstants = require("../uiShellSharedConstants.cjs");
+var _useElementAtContainerEdge = require("../useElementAtContainerEdge.cjs");
+var _NavAccordion = require("./NavAccordion.cjs");
+var _SideNavFooterContent = require("./SideNavFooterContent.cjs");
 var _SideNavHeader = require("./SideNavHeader.cjs");
 var _SideNavItemContent = require("./SideNavItemContent.cjs");
-var _SideNavFooterContent = require("./SideNavFooterContent.cjs");
 var _SideNavItemContentContext = require("./SideNavItemContentContext.cjs");
 var _SideNavToggleButton = require("./SideNavToggleButton.cjs");
 var _SortableList = require("./SortableList/SortableList.cjs");
-var _Typography = require("../../Typography.cjs");
-var _UiShellProvider = require("../../ui-shell/UiShellProvider.cjs");
-var _uiShellSharedConstants = require("../uiShellSharedConstants.cjs");
 var _useIsSideNavCollapsedSessionStorage = require("./useIsSideNavCollapsedSessionStorage.cjs");
-var _useMountLifecycleEffect = require("../../useMountLifecycleEffect.cjs");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /*!
@@ -259,9 +259,9 @@ const LoadingItem = () => {
   return (0, _jsxRuntime.jsxs)(StyledLoadingItemContainer, {
     odysseyDesignTokens: odysseyDesignTokens,
     children: [(0, _jsxRuntime.jsx)(_Skeleton2.default, {
+      height: odysseyDesignTokens.Spacing4,
       variant: "circular",
-      width: odysseyDesignTokens.Spacing4,
-      height: odysseyDesignTokens.Spacing4
+      width: odysseyDesignTokens.Spacing4
     }), (0, _jsxRuntime.jsx)(_Skeleton2.default, {
       variant: "rounded",
       width: "100%"
@@ -494,8 +494,8 @@ const SideNav = ({
       isSideNavToggleHighlighted: isSideNavToggleHighlighted,
       odysseyDesignTokens: odysseyDesignTokens,
       children: (0, _jsxRuntime.jsx)(_SideNavToggleButton.SideNavToggleButton, {
-        clickAreaPadding: isSideNavCollapsed && !hasNeighbouringContentAtInlineStart ? _SideNavToggleButton.SIDE_NAV_TOGGLE_ICON_SIZE / 2 : 0,
         ariaControls: "side-nav-expandable",
+        clickAreaPadding: isSideNavCollapsed && !hasNeighbouringContentAtInlineStart ? _SideNavToggleButton.SIDE_NAV_TOGGLE_ICON_SIZE / 2 : 0,
         isSideNavCollapsed: isSideNavCollapsed,
         onClick: sideNavExpandClickHandler,
         onHighlight: onSideNavToggleButtonHighlight,
@@ -510,9 +510,9 @@ const SideNav = ({
           isSideNavCollapsed: isSideNavCollapsed,
           odysseyDesignTokens: odysseyDesignTokens,
           children: [appName || isLoading || logoProps ? (0, _jsxRuntime.jsx)(StyledSideNavHeaderContainer, {
+            borderColor: uiShellContext?.sideNavContrastColors?.fontColor,
             hasContentScrolled: hasContentScrolled,
             odysseyDesignTokens: odysseyDesignTokens,
-            borderColor: uiShellContext?.sideNavContrastColors?.fontColor,
             children: isLoading && !appName && !logoProps ? (0, _jsxRuntime.jsx)(_SideNavHeader.SideNavHeader, {
               isLoading: isLoading
             }) : (0, _jsxRuntime.jsx)(_SideNavHeader.SideNavHeader, {
@@ -521,12 +521,12 @@ const SideNav = ({
               logoProps: logoProps
             })
           }) : (0, _jsxRuntime.jsx)("div", {}), (0, _jsxRuntime.jsxs)(StyledSideNavScrollableContainer, {
-            odysseyDesignTokens: odysseyDesignTokens,
             "data-se": "scrollable-region",
             hasBlockStartPadding: !appName,
+            odysseyDesignTokens: odysseyDesignTokens,
             children: [(0, _jsxRuntime.jsx)(StyledSideNavListContainer, {
-              role: "none",
               ref: scrollableContentRef,
+              role: "none",
               children: isLoading ? Array(6).fill(null).map((_, index) => (0, _jsxRuntime.jsx)(LoadingItem, {}, index)) : processedSideNavItems?.map(item => {
                 const {
                   childNavItems,
@@ -557,9 +557,9 @@ const SideNav = ({
                   const nestedChildren = (0, _jsxRuntime.jsx)(StyledSideNavListContainer, {
                     role: "presentation",
                     children: isSortable ? (0, _jsxRuntime.jsx)(_SortableList.SortableList, {
-                      parentId: item.id,
                       items: childNavItems,
                       onChange: setSortedItems,
+                      parentId: item.id,
                       renderItem: sortableItem => (0, _jsxRuntime.jsx)(_SortableList.SortableList.Item, {
                         id: sortableItem.id,
                         isDisabled: sortableItem.isDisabled,
@@ -578,26 +578,26 @@ const SideNav = ({
                       scrollRef: getRefIfThisIsFirstNodeWithIsSelected(item.id),
                       startIcon: item.startIcon
                     }), (0, _jsxRuntime.jsx)(_SideNavItemContent.StyledSideNavListItem, {
+                      "aria-disabled": isDisabled,
+                      disabled: isDisabled,
                       id: `${id}-items`,
                       odysseyDesignTokens: odysseyDesignTokens,
-                      disabled: isDisabled,
-                      "aria-disabled": isDisabled,
                       children: nestedChildren
                     })]
                   }, id) : (0, _jsxRuntime.jsx)(_reactErrorBoundary.ErrorBoundary, {
                     fallback: blankElement,
                     children: (0, _jsxRuntime.jsx)(_SideNavItemContent.StyledSideNavListItem, {
+                      "aria-disabled": isDisabled,
+                      disabled: isDisabled,
                       id: id,
                       odysseyDesignTokens: odysseyDesignTokens,
-                      disabled: isDisabled,
-                      "aria-disabled": isDisabled,
                       children: (0, _jsxRuntime.jsx)(_NavAccordion.NavAccordion, {
-                        label: label,
                         isCompact: isCompact,
                         isDefaultExpanded: isDefaultExpanded,
+                        isDisabled: isDisabled,
                         isExpanded: isExpanded,
+                        label: label,
                         startIcon: startIcon,
-                        isDisabled: isDisabled,
                         children: nestedChildren
                       })
                     })