@midas-ds/components 16.2.2 → 16.2.4

package/CHANGELOG.md

@@ -1,3 +1,19 @@
+## 16.2.4 (2026-01-09)
+
+### 🩹 Fixes
+
+- **components, layout:** adjust forced colors for active links ([2b27898722](https://github.com/migrationsverket/midas/commit/2b27898722))
+
+## 16.2.3 (2026-01-09)
+
+### 🩹 Fixes
+
+- **components, layout:** show active menu item on sub pages ([#994](https://github.com/migrationsverket/midas/pull/994))
+
+### 🧱 Updated Dependencies
+
+- Updated theme to 3.9.3
+
 ## 16.2.2 (2026-01-09)
 
 ### 🧱 Updated Dependencies

package/assets/Layout.css

@@ -1 +1 @@
-._baseLayout_1hkrq_1{--sideBarWidth: 230px;--headerHeight: 69px}@media(min-width:1024px){._baseLayout_1hkrq_1{--headerHeight: 85px}}._mainContent_1hkrq_10{display:flex;flex-direction:row}._header_1hkrq_15{position:sticky;top:0;font-family:var(--midas-typography-font-family);padding:.5rem;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--midas-border-color-subtle);background-color:var(--midas-background-base)}._header_1hkrq_15._headerExternal_1hkrq_26{padding:1rem}@media(min-width:1024px){._header_1hkrq_15._headerExternal_1hkrq_26{padding:1.25rem 1rem;z-index:3}}@media(min-width:1024px){._header_1hkrq_15{padding:1.25rem 1rem;z-index:calc(var(--midas-z-index-sidebar) + var(--midas-z-index-above))}}._headerContent_1hkrq_41{display:flex;flex-flow:row wrap;align-items:center;gap:1rem}._headerContent_1hkrq_41>svg{display:none}@media(min-width:1024px){._headerContent_1hkrq_41{gap:2rem}._headerContent_1hkrq_41>svg{display:initial}}._logo_1hkrq_60{display:none;max-height:40px}@media(min-width:1024px){._logo_1hkrq_60{display:flex}}._headerItems_1hkrq_69{max-height:40px;display:flex;flex-direction:row}._toggleButton_1hkrq_75{display:block}@media(min-width:1024px){._toggleButton_1hkrq_75{display:none!important}}._sidebar_1hkrq_83{font-family:var(--midas-typography-font-family);background-color:var(--midas-background-base);display:flex;flex-flow:column;flex:0 0 var(--sideBarWidth);overflow-y:auto;transition:.2s;position:fixed;top:0;height:100vh;width:var(--sideBarWidth);transform:translate(calc(var(--sideBarWidth) * -1));z-index:calc(var(--midas-z-index-sidebar));border-right:1px solid var(--midas-border-color-subtle)}@media(min-width:1024px){._sidebar_1hkrq_83{position:sticky;top:var(--headerHeight);align-self:start;height:calc(100vh - var(--headerHeight));transform:none;width:var(--sideBarWidth)}}._main_1hkrq_10{font-family:var(--midas-typography-font-family);flex:0 0 auto;width:100%;min-height:100%}._app_1hkrq_116{background-clip:content-box}@media(min-width:1024px){._app_1hkrq_116{padding:2rem}}._sidebarOpened_1hkrq_124{transform:translate(0)}._sidebarHeader_1hkrq_128{padding:1rem;margin-bottom:1rem;position:sticky;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:.5rem;overflow:hidden}._appName_1hkrq_140{color:var(--midas-text-primary);font-size:.875rem;font-weight:400;margin:0}._collapseButton_1hkrq_147{display:none!important;padding:calc(.875rem - 1px)!important}@media(min-width:1024px){._collapseButton_1hkrq_147{display:flex!important}}._sidebarCollapsed_1hkrq_156{--sideBarWidth: 68px;transition:all .2s ease-out}._sidebarCollapsed_1hkrq_156 ._sidebarHeader_1hkrq_128{justify-content:center}._userName_1hkrq_166{color:var(--midas-text-primary);margin:0 0 .25rem;font-size:.875rem;font-weight:500;display:none}@media(min-width:1024px){._userName_1hkrq_166{display:block}}._abbr_1hkrq_178{font-size:.875rem;font-weight:500;align-self:center}._userTitle_1hkrq_184{color:var(--midas-text-primary);margin:0;font-size:.875rem;font-weight:400;display:none}@media(min-width:1024px){._userTitle_1hkrq_184{display:block}}._title_1hkrq_196{margin:0;font-size:1rem;font-weight:500;display:block}@media(min-width:1024px){._title_1hkrq_196{display:none}}._sidebarNav_1hkrq_207{padding:.5rem;overflow-y:auto;margin-bottom:auto}._list_1hkrq_213{list-style-type:none;padding:0;margin:0 0 1rem}._listGroupTitle_1hkrq_219{color:var(--midas-text-secondary);font-size:.875rem;padding:.5rem;margin:0}._listItem_1hkrq_226{display:flex;position:relative}._listItemCollapsed_1hkrq_231{justify-content:center}._listLink_1hkrq_235{all:unset;display:flex;align-items:center;gap:.5rem;padding:.625rem .5rem;color:var(--midas-text-primary);flex:1 0 0%;transition:.1s;text-decoration:none}._listLink_1hkrq_235 svg{stroke:var(--midas-icon-primary)}@media(forced-colors:active){._listLink_1hkrq_235 svg{stroke:currentColor}}._listLink_1hkrq_235[data-hovered],._listLink_1hkrq_235:visited{background-color:var(--midas-menu-item-background-hover);color:var(--midas-text-primary);cursor:pointer}:is(._listLink_1hkrq_235[data-hovered],._listLink_1hkrq_235:visited) svg{stroke:var(--midas-icon-primary);min-width:1.25rem}@media(forced-colors:active){:is(._listLink_1hkrq_235[data-hovered],._listLink_1hkrq_235:visited) svg{stroke:currentColor}}@media(forced-colors:active){._listLink_1hkrq_235[data-hovered],._listLink_1hkrq_235:visited{background-color:inherit;text-decoration:underline}}._listLink_1hkrq_235[data-pressed]{background-color:var(--midas-button-background-tertiary-active)}._listLink_1hkrq_235[data-focused]{box-shadow:none}._listLink_1hkrq_235:focus-visible{outline:none}._listLink_1hkrq_235[data-focus-visible]{box-shadow:var(--midas-state-focus);outline:none}@media(forced-colors:active){._listLink_1hkrq_235[data-focus-visible]{outline:var(--midas-state-focus-contrast-mode-outline) solid;outline-offset:var(--midas-state-focus-contrast-mode-offset)}}._listLinkCollapsed_1hkrq_298{padding:.625rem;flex-grow:unset}._active_1hkrq_303{background-color:var(--midas-menu-item-background-selected);color:var(--midas-text-primary);border-left:.125rem solid var(--midas-border-color-tertiary);font-weight:600}@media(forced-colors:active){._active_1hkrq_303{background-color:inherit;border-color:highlight;color:highlight;transition:none}}@media(forced-colors:active){._active_1hkrq_303[data-hovered]{color:highlight}}._linkText_1hkrq_323{opacity:1;display:block;transition:all .2s;transition-behavior:allow-discrete}._backdrop_1hkrq_330{pointer-events:none;display:none;position:fixed;inset:0;background-color:#3232327f;opacity:0;transition:all .1s;transition-behavior:allow-discrete}._backdrop_1hkrq_330._backdropOpened_1hkrq_340{pointer-events:all;opacity:1;display:block;transition:all .2s}@starting-style{._backdrop_1hkrq_330._backdropOpened_1hkrq_340,._linkText_1hkrq_323{opacity:0}}._skipToContent_1hkrq_358{position:absolute;top:0;right:100%;z-index:var(--midas-z-index-skip-to-content)}._skipToContent_1hkrq_358[data-focus-visible],._skipToContent_1hkrq_358:focus-visible{right:auto;left:5px;top:5px}._navbar_1hkrq_372{position:fixed;bottom:0;width:100%;font-family:var(--midas-typography-font-family);display:flex;align-items:center;justify-content:center;border-top:1px solid var(--midas-border-color-subtle);background-color:var(--midas-background-base)}._navbarList_1hkrq_384{flex:1;list-style-type:none;margin:0;padding:0;display:flex;flex-direction:row;align-items:stretch}._navbarList_1hkrq_384>li{flex:1;width:100%;display:flex;justify-content:center;align-items:stretch}@media(min-width:1024px){._navbarList_1hkrq_384{max-width:600px}}._navbarItem_1hkrq_406{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.25rem;padding:.5rem;color:var(--midas-text-primary);text-decoration:none;font-size:var(--midas-typography-font-size-10);line-height:var(--midas-typography-line-height-20);text-align:center;text-wrap:nowrap;text-overflow:ellipsis}._navbarItem_1hkrq_406[data-hovered],._navbarItem_1hkrq_406[data-active]{background-color:var(--midas-button-background-primary-base);color:var(--midas-text-on-color);cursor:pointer}@media(forced-colors:active){._navbarItem_1hkrq_406[data-hovered],._navbarItem_1hkrq_406[data-active]{color:selecteditem}}@media(forced-colors:active){._navbarItem_1hkrq_406[data-focus-visible]{outline:var(--midas-state-focus-contrast-mode-outline) solid;outline-offset:var(--midas-state-focus-contrast-mode-offset)}}._navbarItem_1hkrq_406 svg{flex:0 0 auto}@media(min-width:1024px){._navbarItem_1hkrq_406{gap:.5rem;flex-direction:row;padding:1rem .5rem}}@media(max-width:479px){._headerExternal_1hkrq_26{border:none}}._headerContentExternal_1hkrq_457{flex:1;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:1rem}._headerContentExternal_1hkrq_457 ._logoExternalContainer_1hkrq_465{display:flex;align-items:center;gap:2rem}@media(min-width:1024px){._headerContentExternal_1hkrq_457 ._logoExternal_1hkrq_465{display:none}}._headerContentExternal_1hkrq_457 ._logoExternalDesktop_1hkrq_477{display:none}@media(min-width:1024px){._headerContentExternal_1hkrq_457 ._logoExternalDesktop_1hkrq_477{display:block}}@media(min-width:1024px){._navbarWrapper_1hkrq_486{display:none}}@media(prefers-reduced-motion){._sidebar_1hkrq_83,._sidebarCollapsed_1hkrq_156,._listLink_1hkrq_235,._linkText_1hkrq_323,._backdrop_1hkrq_330,._backdrop_1hkrq_330._backdropOpened_1hkrq_340{transition:none}@starting-style{._backdrop_1hkrq_330._backdropOpened_1hkrq_340,._linkText_1hkrq_323{opacity:1}}}
+._baseLayout_1n71v_1{--sideBarWidth: 230px;--headerHeight: 69px}@media(min-width:1024px){._baseLayout_1n71v_1{--headerHeight: 85px}}._mainContent_1n71v_10{display:flex;flex-direction:row}._header_1n71v_15{position:sticky;top:0;font-family:var(--midas-typography-font-family);padding:.5rem;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--midas-border-color-subtle);background-color:var(--midas-background-base)}._header_1n71v_15._headerExternal_1n71v_26{padding:1rem}@media(min-width:1024px){._header_1n71v_15._headerExternal_1n71v_26{padding:1.25rem 1rem;z-index:3}}@media(min-width:1024px){._header_1n71v_15{padding:1.25rem 1rem;z-index:calc(var(--midas-z-index-sidebar) + var(--midas-z-index-above))}}._headerContent_1n71v_41{display:flex;flex-flow:row wrap;align-items:center;gap:1rem}._headerContent_1n71v_41>svg{display:none}@media(min-width:1024px){._headerContent_1n71v_41{gap:2rem}._headerContent_1n71v_41>svg{display:initial}}._logo_1n71v_60{display:none;max-height:40px}@media(min-width:1024px){._logo_1n71v_60{display:flex}}._headerItems_1n71v_69{max-height:40px;display:flex;flex-direction:row}._toggleButton_1n71v_75{display:block}@media(min-width:1024px){._toggleButton_1n71v_75{display:none!important}}._sidebar_1n71v_83{font-family:var(--midas-typography-font-family);background-color:var(--midas-background-base);display:flex;flex-flow:column;flex:0 0 var(--sideBarWidth);overflow-y:auto;transition:.2s;position:fixed;top:0;height:100vh;width:var(--sideBarWidth);transform:translate(calc(var(--sideBarWidth) * -1));z-index:calc(var(--midas-z-index-sidebar));border-right:1px solid var(--midas-border-color-subtle)}@media(min-width:1024px){._sidebar_1n71v_83{position:sticky;top:var(--headerHeight);align-self:start;height:calc(100vh - var(--headerHeight));transform:none;width:var(--sideBarWidth)}}._main_1n71v_10{font-family:var(--midas-typography-font-family);flex:0 0 auto;width:100%;min-height:100%}._app_1n71v_116{background-clip:content-box}@media(min-width:1024px){._app_1n71v_116{padding:2rem}}._sidebarOpened_1n71v_124{transform:translate(0)}._sidebarHeader_1n71v_128{padding:1rem;margin-bottom:1rem;position:sticky;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:.5rem;overflow:hidden}._appName_1n71v_140{color:var(--midas-text-primary);font-size:.875rem;font-weight:400;margin:0}._collapseButton_1n71v_147{display:none!important;padding:calc(.875rem - 1px)!important}@media(min-width:1024px){._collapseButton_1n71v_147{display:flex!important}}._sidebarCollapsed_1n71v_156{--sideBarWidth: 68px;transition:all .2s ease-out}._sidebarCollapsed_1n71v_156 ._sidebarHeader_1n71v_128{justify-content:center}._userName_1n71v_166{color:var(--midas-text-primary);margin:0 0 .25rem;font-size:.875rem;font-weight:500;display:none}@media(min-width:1024px){._userName_1n71v_166{display:block}}._abbr_1n71v_178{font-size:.875rem;font-weight:500;align-self:center}._userTitle_1n71v_184{color:var(--midas-text-primary);margin:0;font-size:.875rem;font-weight:400;display:none}@media(min-width:1024px){._userTitle_1n71v_184{display:block}}._title_1n71v_196{margin:0;font-size:1rem;font-weight:500;display:block}@media(min-width:1024px){._title_1n71v_196{display:none}}._sidebarNav_1n71v_207{padding:.5rem;overflow-y:auto;margin-bottom:auto}._list_1n71v_213{list-style-type:none;padding:0;margin:0 0 1rem}._listGroupTitle_1n71v_219{color:var(--midas-text-secondary);font-size:.875rem;padding:.5rem;margin:0}._listItem_1n71v_226{display:flex;position:relative}._listItemCollapsed_1n71v_231{justify-content:center}._listLink_1n71v_235{all:unset;display:flex;align-items:center;gap:.5rem;padding:.625rem .5rem;color:var(--midas-text-primary);flex:1 0 0%;transition:.1s;text-decoration:none}._listLink_1n71v_235 svg{stroke:var(--midas-icon-primary)}@media(forced-colors:active){._listLink_1n71v_235 svg{stroke:currentColor}}._listLink_1n71v_235[data-hovered],._listLink_1n71v_235:visited{background-color:var(--midas-menu-item-background-hover);color:var(--midas-text-primary);cursor:pointer}:is(._listLink_1n71v_235[data-hovered],._listLink_1n71v_235:visited) svg{stroke:var(--midas-icon-primary);min-width:1.25rem}@media(forced-colors:active){:is(._listLink_1n71v_235[data-hovered],._listLink_1n71v_235:visited) svg{stroke:currentColor}}@media(forced-colors:active){._listLink_1n71v_235[data-hovered],._listLink_1n71v_235:visited{background-color:inherit;text-decoration:underline}}._listLink_1n71v_235[data-pressed]{background-color:var(--midas-button-background-tertiary-active)}._listLink_1n71v_235[data-focused]{box-shadow:none}._listLink_1n71v_235:focus-visible{outline:none}._listLink_1n71v_235[data-focus-visible]{box-shadow:var(--midas-state-focus);outline:none}@media(forced-colors:active){._listLink_1n71v_235[data-focus-visible]{outline:var(--midas-state-focus-contrast-mode-outline) solid;outline-offset:var(--midas-state-focus-contrast-mode-offset)}}._listLinkCollapsed_1n71v_298{padding:.625rem;flex-grow:unset}._active_1n71v_303{background-color:var(--midas-menu-item-background-selected);color:var(--midas-text-primary);border-left:.125rem solid var(--midas-border-color-tertiary);font-weight:600}@media(forced-colors:active){._active_1n71v_303{transition:none}}._linkText_1n71v_314{opacity:1;display:block;transition:all .2s;transition-behavior:allow-discrete}._backdrop_1n71v_321{pointer-events:none;display:none;position:fixed;inset:0;background-color:#3232327f;opacity:0;transition:all .1s;transition-behavior:allow-discrete}._backdrop_1n71v_321._backdropOpened_1n71v_331{pointer-events:all;opacity:1;display:block;transition:all .2s}@starting-style{._backdrop_1n71v_321._backdropOpened_1n71v_331,._linkText_1n71v_314{opacity:0}}._skipToContent_1n71v_349{position:absolute;top:0;right:100%;z-index:var(--midas-z-index-skip-to-content)}._skipToContent_1n71v_349[data-focus-visible],._skipToContent_1n71v_349:focus-visible{right:auto;left:5px;top:5px}._navbar_1n71v_363{position:fixed;bottom:0;width:100%;font-family:var(--midas-typography-font-family);display:flex;align-items:center;justify-content:center;border-top:1px solid var(--midas-border-color-subtle);background-color:var(--midas-background-base)}._navbarList_1n71v_375{flex:1;list-style-type:none;margin:0;padding:0;display:flex;flex-direction:row;align-items:stretch}._navbarList_1n71v_375>li{flex:1;width:100%;display:flex;justify-content:center;align-items:stretch}@media(min-width:1024px){._navbarList_1n71v_375{max-width:600px}}._navbarItem_1n71v_397{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.25rem;padding:.5rem;color:var(--midas-text-primary);text-decoration:none;font-size:var(--midas-typography-font-size-10);line-height:var(--midas-typography-line-height-20);text-align:center;text-wrap:nowrap;text-overflow:ellipsis}._navbarItem_1n71v_397[data-hovered],._navbarItem_1n71v_397[data-active]{background-color:var(--midas-button-background-primary-base);color:var(--midas-text-on-color);cursor:pointer}@media(forced-colors:active){._navbarItem_1n71v_397[data-hovered],._navbarItem_1n71v_397[data-active]{text-decoration:underline}}@media(forced-colors:active){._navbarItem_1n71v_397[data-focus-visible]{outline:var(--midas-state-focus-contrast-mode-outline) solid;outline-offset:var(--midas-state-focus-contrast-mode-offset)}}._navbarItem_1n71v_397 svg{flex:0 0 auto}@media(min-width:1024px){._navbarItem_1n71v_397{gap:.5rem;flex-direction:row;padding:1rem .5rem}}@media(max-width:479px){._headerExternal_1n71v_26{border:none}}._headerContentExternal_1n71v_448{flex:1;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:1rem}._headerContentExternal_1n71v_448 ._logoExternalContainer_1n71v_456{display:flex;align-items:center;gap:2rem}@media(min-width:1024px){._headerContentExternal_1n71v_448 ._logoExternal_1n71v_456{display:none}}._headerContentExternal_1n71v_448 ._logoExternalDesktop_1n71v_468{display:none}@media(min-width:1024px){._headerContentExternal_1n71v_448 ._logoExternalDesktop_1n71v_468{display:block}}@media(min-width:1024px){._navbarWrapper_1n71v_477{display:none}}@media(prefers-reduced-motion){._sidebar_1n71v_83,._sidebarCollapsed_1n71v_156,._listLink_1n71v_235,._linkText_1n71v_314,._backdrop_1n71v_321,._backdrop_1n71v_321._backdropOpened_1n71v_331{transition:none}@starting-style{._backdrop_1n71v_321._backdropOpened_1n71v_331,._linkText_1n71v_314{opacity:1}}}

package/chunks/Layout-ClW2Lbvq.js

@@ -0,0 +1,465 @@
+import { jsx as e, jsxs as r, Fragment as H } from "react/jsx-runtime";
+import { G as S } from "./GridItem-5t1Z14sM.js";
+import * as N from "react";
+import { c as u } from "./clsx-AexbMWKp.js";
+import { Link as L, RouterProvider as O } from "react-aria-components";
+import { B as M } from "./Button-wBgWrXj3.js";
+import { a as G, T as W } from "./Tooltip-m032jGgF.js";
+import { a as y, B as I } from "./BadgeContainer-CKVsfTlF.js";
+import { c as E } from "./createLucideIcon-D4r5Phnh.js";
+import { u as C } from "./useLocalizedStringFormatter-ZgRJmvHC.js";
+import { variables as j } from "@midas-ds/theme";
+import { L as g } from "./Logo-InDSslpO.js";
+import { X as D } from "./x-BXShoIAM.js";
+import '../assets/Layout.css';const q = [
+  ["path", { d: "M4 12h16", key: "1lakjw" }],
+  ["path", { d: "M4 18h16", key: "19g7jn" }],
+  ["path", { d: "M4 6h16", key: "1o0s65" }]
+], A = E("menu", q);
+const R = [
+  ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
+  ["path", { d: "M9 3v18", key: "fh3hqa" }],
+  ["path", { d: "m16 15-3-3 3-3", key: "14y99z" }]
+], $ = E("panel-left-close", R);
+const F = [
+  ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
+  ["path", { d: "M9 3v18", key: "fh3hqa" }],
+  ["path", { d: "m14 9 3 3-3 3", key: "8010ee" }]
+], X = E("panel-left-open", F), J = "_baseLayout_1n71v_1", K = "_mainContent_1n71v_10", Q = "_header_1n71v_15", U = "_headerExternal_1n71v_26", V = "_headerContent_1n71v_41", Y = "_logo_1n71v_60", Z = "_headerItems_1n71v_69", ee = "_toggleButton_1n71v_75", ae = "_sidebar_1n71v_83", ne = "_main_1n71v_10", te = "_app_1n71v_116", se = "_sidebarOpened_1n71v_124", ie = "_sidebarHeader_1n71v_128", re = "_appName_1n71v_140", oe = "_collapseButton_1n71v_147", le = "_sidebarCollapsed_1n71v_156", de = "_userName_1n71v_166", ce = "_userTitle_1n71v_184", me = "_title_1n71v_196", pe = "_sidebarNav_1n71v_207", _e = "_list_1n71v_213", ve = "_listGroupTitle_1n71v_219", ue = "_listItem_1n71v_226", he = "_listItemCollapsed_1n71v_231", be = "_listLink_1n71v_235", Ne = "_listLinkCollapsed_1n71v_298", fe = "_active_1n71v_303", ke = "_backdrop_1n71v_321", Ce = "_backdropOpened_1n71v_331", xe = "_skipToContent_1n71v_349", ge = "_navbar_1n71v_363", Le = "_navbarList_1n71v_375", ye = "_navbarItem_1n71v_397", Ie = "_headerContentExternal_1n71v_448", Me = "_logoExternalContainer_1n71v_456", Ee = "_logoExternal_1n71v_456", Te = "_logoExternalDesktop_1n71v_468", Se = "_navbarWrapper_1n71v_477", a = {
+  baseLayout: J,
+  mainContent: K,
+  header: Q,
+  headerExternal: U,
+  headerContent: V,
+  logo: Y,
+  headerItems: Z,
+  toggleButton: ee,
+  sidebar: ae,
+  main: ne,
+  app: te,
+  sidebarOpened: se,
+  sidebarHeader: ie,
+  appName: re,
+  collapseButton: oe,
+  sidebarCollapsed: le,
+  userName: de,
+  userTitle: ce,
+  title: me,
+  sidebarNav: pe,
+  list: _e,
+  listGroupTitle: ve,
+  listItem: ue,
+  listItemCollapsed: he,
+  listLink: be,
+  listLinkCollapsed: Ne,
+  active: fe,
+  backdrop: ke,
+  backdropOpened: Ce,
+  skipToContent: xe,
+  navbar: ge,
+  navbarList: Le,
+  navbarItem: ye,
+  headerContentExternal: Ie,
+  logoExternalContainer: Me,
+  logoExternal: Ee,
+  logoExternalDesktop: Te,
+  navbarWrapper: Se
+}, w = N.createContext(
+  void 0
+), ze = ({
+  items: t,
+  title: s,
+  user: i,
+  app: n,
+  children: o,
+  clientSideRouter: m,
+  clientSideHref: d,
+  headerChildren: v,
+  isCollapsed: _,
+  setIsCollapsed: p,
+  isOpened: h,
+  setIsOpened: l,
+  variant: b,
+  id: f
+}) => /* @__PURE__ */ e(
+  w.Provider,
+  {
+    value: {
+      items: t,
+      title: s,
+      user: i,
+      app: n,
+      headerChildren: v,
+      isCollapsed: _,
+      setIsCollapsed: p,
+      isOpened: h,
+      setIsOpened: l,
+      clientSideRouter: m,
+      clientSideHref: d,
+      variant: b,
+      id: f
+    },
+    children: o
+  }
+), k = () => {
+  const t = N.useContext(w);
+  if (!t)
+    throw new Error("useLayoutContext must be used within a LayoutProvider");
+  return t;
+}, P = ({
+  title: t,
+  href: s,
+  icon: i,
+  active: n,
+  hasBadge: o
+}) => {
+  const { isCollapsed: m, setIsOpened: d, clientSideHref: v } = k(), _ = v ? v(s) : s, [p, h] = N.useState(!1);
+  return N.useEffect(() => {
+    if (typeof window < "u") {
+      const l = window.location.pathname === _ || window.location.pathname.startsWith(_ + "/");
+      h(n ?? l);
+    }
+  }, [n, _]), m ? /* @__PURE__ */ r(G, { children: [
+    /* @__PURE__ */ e(
+      L,
+      {
+        href: s,
+        "aria-label": t,
+        className: u(
+          a.listLink,
+          a.listLinkCollapsed,
+          p && a.active
+        ),
+        onPress: () => d?.(!1),
+        children: /* @__PURE__ */ r(y, { children: [
+          /* @__PURE__ */ e(
+            i,
+            {
+              size: 20,
+              "aria-label": t
+            }
+          ),
+          o && /* @__PURE__ */ e(I, {})
+        ] })
+      }
+    ),
+    /* @__PURE__ */ e(W, { placement: "right", children: t })
+  ] }) : /* @__PURE__ */ r(
+    L,
+    {
+      href: s,
+      "aria-label": t,
+      className: u(a.listLink, p && a.active),
+      onPress: () => d?.(!1),
+      children: [
+        /* @__PURE__ */ r(y, { children: [
+          /* @__PURE__ */ e(i, { size: 20 }),
+          o && /* @__PURE__ */ e(I, {})
+        ] }),
+        t
+      ]
+    }
+  );
+}, Be = { closeMenu: "Close menu", openMenu: "Open menu", maximizeMenu: "Maximize menu", minimizeMenu: "Minimize menu", sidebarMenu: "Sidebar menu", bottomMenu: "Bottom menu", skipToContent: "Skip to main content" }, Oe = { closeMenu: "Stäng meny", openMenu: "Öppna meny", maximizeMenu: "Maximera meny", minimizeMenu: "Minimera meny", sidebarMenu: "Sidomeny", bottomMenu: "Bottenmeny", skipToContent: "Hoppa till huvudinnehåll" }, x = {
+  en: Be,
+  sv: Oe
+}, we = () => {
+  const {
+    items: t,
+    app: s,
+    isOpened: i,
+    isCollapsed: n,
+    setIsCollapsed: o,
+    setIsOpened: m,
+    clientSideRouter: d,
+    clientSideHref: v,
+    id: _
+  } = k(), p = C(x), h = ({ group: l }) => /* @__PURE__ */ e("ul", { className: a.list, children: l.items.map((b, f) => /* @__PURE__ */ e(
+    "li",
+    {
+      className: u(
+        a.listItem,
+        n && a.listItemCollapsed
+      ),
+      children: /* @__PURE__ */ e(P, { ...b })
+    },
+    "link_" + f
+  )) });
+  return N.useEffect(() => {
+    const l = (b) => {
+      b.key === "Escape" && m !== void 0 && m(!1);
+    };
+    return window.addEventListener("keydown", l), () => {
+      window.removeEventListener("keydown", l);
+    };
+  }, [m]), /* @__PURE__ */ r(
+    "aside",
+    {
+      id: _,
+      className: u(
+        a.sidebar,
+        n && a.sidebarCollapsed,
+        i && a.sidebarOpened
+      ),
+      children: [
+        /* @__PURE__ */ r("div", { className: a.sidebarHeader, children: [
+          !n && /* @__PURE__ */ e("p", { className: a.appName, children: s.name }),
+          /* @__PURE__ */ e(
+            M,
+            {
+              variant: "icon",
+              "aria-label": n ? p.format("maximizeMenu") : p.format("minimizeMenu"),
+              onPress: () => o(!n),
+              className: a.collapseButton,
+              children: n ? /* @__PURE__ */ e(X, { size: 20 }) : /* @__PURE__ */ e($, { size: 20 })
+            }
+          )
+        ] }),
+        /* @__PURE__ */ e(
+          "nav",
+          {
+            className: a.sidebarNav,
+            "aria-label": p.format("sidebarMenu"),
+            children: /* @__PURE__ */ e("ul", { className: a.list, children: t.map((l, b) => /* @__PURE__ */ r("li", { children: [
+              l.title && !n && /* @__PURE__ */ e("p", { className: a.listGroupTitle, children: l.title }),
+              d ? /* @__PURE__ */ e(
+                O,
+                {
+                  navigate: d,
+                  useHref: v,
+                  children: /* @__PURE__ */ e(h, { group: l })
+                }
+              ) : /* @__PURE__ */ e(h, { group: l })
+            ] }, "list_" + b)) })
+          }
+        )
+      ]
+    }
+  );
+}, Pe = () => {
+  const {
+    title: t,
+    user: s,
+    app: i,
+    isOpened: n,
+    setIsOpened: o,
+    setIsCollapsed: m,
+    headerChildren: d,
+    variant: v,
+    id: _
+  } = k(), p = C(x);
+  return v === "external" ? /* @__PURE__ */ e("header", { className: u(a.header, a.headerExternal), children: /* @__PURE__ */ r("div", { className: a.headerContentExternal, children: [
+    /* @__PURE__ */ r("div", { className: a.logoExternalContainer, children: [
+      /* @__PURE__ */ e(
+        g,
+        {
+          size: "x-small",
+          padding: !1,
+          className: a.logoExternal
+        }
+      ),
+      /* @__PURE__ */ e(
+        g,
+        {
+          size: "small",
+          padding: !1,
+          className: a.logoExternalDesktop
+        }
+      ),
+      /* @__PURE__ */ r("div", { children: [
+        /* @__PURE__ */ e("p", { className: a.userName, children: s.name }),
+        /* @__PURE__ */ e("p", { className: a.userTitle, children: s.title })
+      ] })
+    ] }),
+    /* @__PURE__ */ e("div", { className: a.headerItems, children: d })
+  ] }) }) : /* @__PURE__ */ r(
+    "header",
+    {
+      className: a.header,
+      style: {
+        borderTop: `solid 4px ${i.color ? i.color : j.brandPrimary}`
+      },
+      children: [
+        /* @__PURE__ */ r("div", { className: a.headerContent, children: [
+          /* @__PURE__ */ e("div", { className: a.logo, children: /* @__PURE__ */ e(
+            g,
+            {
+              size: "small",
+              padding: !1
+            }
+          ) }),
+          n !== void 0 && /* @__PURE__ */ e(
+            M,
+            {
+              variant: "icon",
+              className: a.toggleButton,
+              "aria-label": n ? p.format("closeMenu") : p.format("openMenu"),
+              "aria-controls": _,
+              onPressStart: () => {
+                m(!1), o?.(!0);
+              },
+              children: n ? /* @__PURE__ */ e(
+                D,
+                {
+                  size: 20,
+                  "aria-hidden": "true"
+                }
+              ) : /* @__PURE__ */ e(
+                A,
+                {
+                  size: 20,
+                  "aria-hidden": "true"
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ r("div", { children: [
+            /* @__PURE__ */ e("p", { className: a.userName, children: s.name }),
+            /* @__PURE__ */ e("p", { className: a.userTitle, children: s.title }),
+            /* @__PURE__ */ e("p", { className: a.title, children: t })
+          ] })
+        ] }),
+        /* @__PURE__ */ e("div", { className: a.headerItems, children: d })
+      ]
+    }
+  );
+}, z = ({
+  id: t = "main:first-of-type"
+}) => {
+  const s = () => {
+    const n = document.querySelector(t);
+    n && (n.tabIndex = -1, n.focus(), setTimeout(() => n.removeAttribute("tabindex"), 1e3));
+  }, i = C(x);
+  return /* @__PURE__ */ e(
+    M,
+    {
+      onPress: s,
+      className: a.skipToContent,
+      children: i.format("skipToContent")
+    }
+  );
+}, He = () => {
+  const { isOpened: t, setIsOpened: s } = k();
+  return t ? /* @__PURE__ */ e(
+    "div",
+    {
+      className: u(a.backdrop, a.backdropOpened),
+      onClick: () => {
+        s?.(!1);
+      },
+      "aria-hidden": !0
+    }
+  ) : null;
+}, Ge = () => {
+  const { items: t, clientSideRouter: s, clientSideHref: i } = k(), n = C(x), o = t.at(0)?.items;
+  return /* @__PURE__ */ e(
+    "nav",
+    {
+      className: a.navbar,
+      "aria-label": n.format("bottomMenu"),
+      children: o && /* @__PURE__ */ e("ul", { className: u(a.navbarList), children: s ? /* @__PURE__ */ e(
+        O,
+        {
+          navigate: s,
+          useHref: i,
+          children: /* @__PURE__ */ e(B, { items: o })
+        }
+      ) : /* @__PURE__ */ e(B, { items: o }) })
+    }
+  );
+}, B = ({
+  items: t
+}) => /* @__PURE__ */ e(H, { children: t.map(({ href: s, active: i, icon: n, title: o, hasBadge: m }, d) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ r(
+  L,
+  {
+    href: s,
+    className: u(a.navbarItem),
+    "data-active": i,
+    "aria-current": i && "page",
+    children: [
+      /* @__PURE__ */ r(y, { children: [
+        /* @__PURE__ */ e(n, { size: 20 }),
+        m && /* @__PURE__ */ e(I, {})
+      ] }),
+      o
+    ]
+  }
+) }, d)) }), c = ({
+  items: t,
+  title: s,
+  user: i,
+  app: n,
+  children: o,
+  headerChildren: m,
+  clientSideRouter: d,
+  clientSideHref: v,
+  variant: _,
+  className: p
+}) => {
+  const [h, l] = N.useState(!1), [b, f] = N.useState(!1), T = N.useId();
+  return _ === "external" ? /* @__PURE__ */ e(
+    c.Provider,
+    {
+      items: t,
+      title: s,
+      user: i,
+      app: n,
+      clientSideRouter: d,
+      clientSideHref: v,
+      headerChildren: m,
+      isCollapsed: h,
+      setIsCollapsed: l,
+      variant: _,
+      id: T,
+      children: /* @__PURE__ */ r("div", { className: u(a.baseLayout, p), children: [
+        /* @__PURE__ */ e(z, {}),
+        /* @__PURE__ */ e(c.Header, {}),
+        /* @__PURE__ */ r("div", { className: a.mainContent, children: [
+          /* @__PURE__ */ e(c.Sidebar, {}),
+          /* @__PURE__ */ e(S, { children: /* @__PURE__ */ e("main", { className: a.main, children: /* @__PURE__ */ e("div", { className: a.app, children: o }) }) }),
+          /* @__PURE__ */ e(c.Backdrop, {})
+        ] }),
+        /* @__PURE__ */ e("div", { className: a.navbarWrapper, children: /* @__PURE__ */ e(c.Navbar, {}) })
+      ] })
+    }
+  ) : /* @__PURE__ */ e(
+    c.Provider,
+    {
+      items: t,
+      title: s,
+      user: i,
+      app: n,
+      clientSideRouter: d,
+      clientSideHref: v,
+      headerChildren: m,
+      isCollapsed: h,
+      setIsCollapsed: l,
+      isOpened: b,
+      setIsOpened: f,
+      variant: _,
+      id: T,
+      children: /* @__PURE__ */ r("div", { className: u(a.baseLayout, p), children: [
+        /* @__PURE__ */ e(z, {}),
+        /* @__PURE__ */ e(c.Header, {}),
+        /* @__PURE__ */ r("div", { className: a.mainContent, children: [
+          /* @__PURE__ */ e(c.Sidebar, {}),
+          /* @__PURE__ */ e(S, { children: /* @__PURE__ */ e("main", { className: a.main, children: /* @__PURE__ */ e("div", { className: a.app, children: o }) }) }),
+          /* @__PURE__ */ e(c.Backdrop, {})
+        ] })
+      ] })
+    }
+  );
+};
+c.Provider = ze;
+c.Header = Pe;
+c.Sidebar = we;
+c.SidebarLink = P;
+c.Navbar = Ge;
+c.Backdrop = He;
+export {
+  Pe as H,
+  c as L,
+  Ge as N,
+  we as S,
+  P as a
+};

package/index.js

@@ -20,7 +20,7 @@ import { G as $ } from "./chunks/GridItem-5t1Z14sM.js";
 import { H as ao } from "./chunks/Heading-D8tNNJkt.js";
 import { I as eo } from "./chunks/InfoBanner-DLiVpNON.js";
 import { L as so } from "./chunks/Label-Dup4lWaR.js";
-import { H as xo, L as mo, N as fo, S as io, a as no } from "./chunks/Layout-BFZSROTl.js";
+import { H as xo, L as mo, N as fo, S as io, a as no } from "./chunks/Layout-ClW2Lbvq.js";
 import { L as lo } from "./chunks/Link-yTNUNv3C.js";
 import { L as bo } from "./chunks/LinkButton-3nAekUJ4.js";
 import { L as uo } from "./chunks/Logo-InDSslpO.js";

package/layout/index.js

@@ -1,4 +1,4 @@
-import { H as e, L as s, N as b, S as d, a as i } from "../chunks/Layout-BFZSROTl.js";
+import { H as e, L as s, N as b, S as d, a as i } from "../chunks/Layout-ClW2Lbvq.js";
 export {
   e as Header,
   s as Layout,

package/package.json

@@ -14,7 +14,7 @@
   "description": "Midas Components",
   "homepage": "https://designsystem.migrationsverket.se/",
   "license": "CC0-1.0",
-  "version": "16.2.2",
+  "version": "16.2.4",
   "module": "./index.js",
   "type": "module",
   "main": "./index.js",
@@ -41,7 +41,7 @@
     "./*": "./*/index.js"
   },
   "dependencies": {
-    "@midas-ds/theme": "3.9.2",
+    "@midas-ds/theme": "3.9.3",
     "react-aria-components": "1.14.0"
   }
 }

package/chunks/Layout-BFZSROTl.js

@@ -1,462 +0,0 @@
-import { jsx as e, jsxs as i, Fragment as P } from "react/jsx-runtime";
-import { G as T } from "./GridItem-5t1Z14sM.js";
-import * as v from "react";
-import { c as u } from "./clsx-AexbMWKp.js";
-import { Link as q, RouterProvider as B } from "react-aria-components";
-import { B as I } from "./Button-wBgWrXj3.js";
-import { a as H, T as G } from "./Tooltip-m032jGgF.js";
-import { a as L, B as y } from "./BadgeContainer-CKVsfTlF.js";
-import { c as M } from "./createLucideIcon-D4r5Phnh.js";
-import { u as C } from "./useLocalizedStringFormatter-ZgRJmvHC.js";
-import { variables as W } from "@midas-ds/theme";
-import { L as g } from "./Logo-InDSslpO.js";
-import { X as j } from "./x-BXShoIAM.js";
-import '../assets/Layout.css';const D = [
-  ["path", { d: "M4 12h16", key: "1lakjw" }],
-  ["path", { d: "M4 18h16", key: "19g7jn" }],
-  ["path", { d: "M4 6h16", key: "1o0s65" }]
-], A = M("menu", D);
-const R = [
-  ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
-  ["path", { d: "M9 3v18", key: "fh3hqa" }],
-  ["path", { d: "m16 15-3-3 3-3", key: "14y99z" }]
-], $ = M("panel-left-close", R);
-const F = [
-  ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
-  ["path", { d: "M9 3v18", key: "fh3hqa" }],
-  ["path", { d: "m14 9 3 3-3 3", key: "8010ee" }]
-], X = M("panel-left-open", F), J = "_baseLayout_1hkrq_1", K = "_mainContent_1hkrq_10", Q = "_header_1hkrq_15", U = "_headerExternal_1hkrq_26", V = "_headerContent_1hkrq_41", Y = "_logo_1hkrq_60", Z = "_headerItems_1hkrq_69", ee = "_toggleButton_1hkrq_75", ae = "_sidebar_1hkrq_83", te = "_main_1hkrq_10", ne = "_app_1hkrq_116", se = "_sidebarOpened_1hkrq_124", re = "_sidebarHeader_1hkrq_128", ie = "_appName_1hkrq_140", oe = "_collapseButton_1hkrq_147", le = "_sidebarCollapsed_1hkrq_156", de = "_userName_1hkrq_166", ce = "_userTitle_1hkrq_184", me = "_title_1hkrq_196", pe = "_sidebarNav_1hkrq_207", he = "_list_1hkrq_213", _e = "_listGroupTitle_1hkrq_219", ue = "_listItem_1hkrq_226", ke = "_listItemCollapsed_1hkrq_231", be = "_listLink_1hkrq_235", ve = "_listLinkCollapsed_1hkrq_298", Ne = "_active_1hkrq_303", fe = "_backdrop_1hkrq_330", Ce = "_backdropOpened_1hkrq_340", xe = "_skipToContent_1hkrq_358", ge = "_navbar_1hkrq_372", qe = "_navbarList_1hkrq_384", Le = "_navbarItem_1hkrq_406", ye = "_headerContentExternal_1hkrq_457", Ie = "_logoExternalContainer_1hkrq_465", Me = "_logoExternal_1hkrq_465", Ee = "_logoExternalDesktop_1hkrq_477", Te = "_navbarWrapper_1hkrq_486", a = {
-  baseLayout: J,
-  mainContent: K,
-  header: Q,
-  headerExternal: U,
-  headerContent: V,
-  logo: Y,
-  headerItems: Z,
-  toggleButton: ee,
-  sidebar: ae,
-  main: te,
-  app: ne,
-  sidebarOpened: se,
-  sidebarHeader: re,
-  appName: ie,
-  collapseButton: oe,
-  sidebarCollapsed: le,
-  userName: de,
-  userTitle: ce,
-  title: me,
-  sidebarNav: pe,
-  list: he,
-  listGroupTitle: _e,
-  listItem: ue,
-  listItemCollapsed: ke,
-  listLink: be,
-  listLinkCollapsed: ve,
-  active: Ne,
-  backdrop: fe,
-  backdropOpened: Ce,
-  skipToContent: xe,
-  navbar: ge,
-  navbarList: qe,
-  navbarItem: Le,
-  headerContentExternal: ye,
-  logoExternalContainer: Ie,
-  logoExternal: Me,
-  logoExternalDesktop: Ee,
-  navbarWrapper: Te
-}, O = v.createContext(
-  void 0
-), Se = ({
-  items: n,
-  title: s,
-  user: r,
-  app: t,
-  children: o,
-  clientSideRouter: c,
-  clientSideHref: l,
-  headerChildren: _,
-  isCollapsed: h,
-  setIsCollapsed: m,
-  isOpened: k,
-  setIsOpened: p,
-  variant: b,
-  id: N
-}) => /* @__PURE__ */ e(
-  O.Provider,
-  {
-    value: {
-      items: n,
-      title: s,
-      user: r,
-      app: t,
-      headerChildren: _,
-      isCollapsed: h,
-      setIsCollapsed: m,
-      isOpened: k,
-      setIsOpened: p,
-      clientSideRouter: c,
-      clientSideHref: l,
-      variant: b,
-      id: N
-    },
-    children: o
-  }
-), f = () => {
-  const n = v.useContext(O);
-  if (!n)
-    throw new Error("useLayoutContext must be used within a LayoutProvider");
-  return n;
-}, w = ({
-  title: n,
-  href: s,
-  icon: r,
-  active: t,
-  hasBadge: o
-}) => {
-  const { isCollapsed: c, setIsOpened: l, clientSideHref: _ } = f(), h = _ ? _(s) : s, [m, k] = v.useState(!1);
-  return v.useEffect(() => {
-    typeof window < "u" && k(t ?? window.location.pathname === h);
-  }, [t, h]), c ? /* @__PURE__ */ i(H, { children: [
-    /* @__PURE__ */ e(
-      q,
-      {
-        href: s,
-        "aria-label": n,
-        className: u(
-          a.listLink,
-          a.listLinkCollapsed,
-          m && a.active
-        ),
-        onPress: () => l?.(!1),
-        children: /* @__PURE__ */ i(L, { children: [
-          /* @__PURE__ */ e(
-            r,
-            {
-              size: 20,
-              "aria-label": n
-            }
-          ),
-          o && /* @__PURE__ */ e(y, {})
-        ] })
-      }
-    ),
-    /* @__PURE__ */ e(G, { placement: "right", children: n })
-  ] }) : /* @__PURE__ */ i(
-    q,
-    {
-      href: s,
-      "aria-label": n,
-      className: u(a.listLink, m && a.active),
-      onPress: () => l?.(!1),
-      children: [
-        /* @__PURE__ */ i(L, { children: [
-          /* @__PURE__ */ e(r, { size: 20 }),
-          o && /* @__PURE__ */ e(y, {})
-        ] }),
-        n
-      ]
-    }
-  );
-}, ze = { closeMenu: "Close menu", openMenu: "Open menu", maximizeMenu: "Maximize menu", minimizeMenu: "Minimize menu", sidebarMenu: "Sidebar menu", bottomMenu: "Bottom menu", skipToContent: "Skip to main content" }, Be = { closeMenu: "Stäng meny", openMenu: "Öppna meny", maximizeMenu: "Maximera meny", minimizeMenu: "Minimera meny", sidebarMenu: "Sidomeny", bottomMenu: "Bottenmeny", skipToContent: "Hoppa till huvudinnehåll" }, x = {
-  en: ze,
-  sv: Be
-}, Oe = () => {
-  const {
-    items: n,
-    app: s,
-    isOpened: r,
-    isCollapsed: t,
-    setIsCollapsed: o,
-    setIsOpened: c,
-    clientSideRouter: l,
-    clientSideHref: _,
-    id: h
-  } = f(), m = C(x), k = ({ group: p }) => /* @__PURE__ */ e("ul", { className: a.list, children: p.items.map((b, N) => /* @__PURE__ */ e(
-    "li",
-    {
-      className: u(
-        a.listItem,
-        t && a.listItemCollapsed
-      ),
-      children: /* @__PURE__ */ e(w, { ...b })
-    },
-    "link_" + N
-  )) });
-  return v.useEffect(() => {
-    const p = (b) => {
-      b.key === "Escape" && c !== void 0 && c(!1);
-    };
-    return window.addEventListener("keydown", p), () => {
-      window.removeEventListener("keydown", p);
-    };
-  }, [c]), /* @__PURE__ */ i(
-    "aside",
-    {
-      id: h,
-      className: u(
-        a.sidebar,
-        t && a.sidebarCollapsed,
-        r && a.sidebarOpened
-      ),
-      children: [
-        /* @__PURE__ */ i("div", { className: a.sidebarHeader, children: [
-          !t && /* @__PURE__ */ e("p", { className: a.appName, children: s.name }),
-          /* @__PURE__ */ e(
-            I,
-            {
-              variant: "icon",
-              "aria-label": t ? m.format("maximizeMenu") : m.format("minimizeMenu"),
-              onPress: () => o(!t),
-              className: a.collapseButton,
-              children: t ? /* @__PURE__ */ e(X, { size: 20 }) : /* @__PURE__ */ e($, { size: 20 })
-            }
-          )
-        ] }),
-        /* @__PURE__ */ e(
-          "nav",
-          {
-            className: a.sidebarNav,
-            "aria-label": m.format("sidebarMenu"),
-            children: /* @__PURE__ */ e("ul", { className: a.list, children: n.map((p, b) => /* @__PURE__ */ i("li", { children: [
-              p.title && !t && /* @__PURE__ */ e("p", { className: a.listGroupTitle, children: p.title }),
-              l ? /* @__PURE__ */ e(
-                B,
-                {
-                  navigate: l,
-                  useHref: _,
-                  children: /* @__PURE__ */ e(k, { group: p })
-                }
-              ) : /* @__PURE__ */ e(k, { group: p })
-            ] }, "list_" + b)) })
-          }
-        )
-      ]
-    }
-  );
-}, we = () => {
-  const {
-    title: n,
-    user: s,
-    app: r,
-    isOpened: t,
-    setIsOpened: o,
-    setIsCollapsed: c,
-    headerChildren: l,
-    variant: _,
-    id: h
-  } = f(), m = C(x);
-  return _ === "external" ? /* @__PURE__ */ e("header", { className: u(a.header, a.headerExternal), children: /* @__PURE__ */ i("div", { className: a.headerContentExternal, children: [
-    /* @__PURE__ */ i("div", { className: a.logoExternalContainer, children: [
-      /* @__PURE__ */ e(
-        g,
-        {
-          size: "x-small",
-          padding: !1,
-          className: a.logoExternal
-        }
-      ),
-      /* @__PURE__ */ e(
-        g,
-        {
-          size: "small",
-          padding: !1,
-          className: a.logoExternalDesktop
-        }
-      ),
-      /* @__PURE__ */ i("div", { children: [
-        /* @__PURE__ */ e("p", { className: a.userName, children: s.name }),
-        /* @__PURE__ */ e("p", { className: a.userTitle, children: s.title })
-      ] })
-    ] }),
-    /* @__PURE__ */ e("div", { className: a.headerItems, children: l })
-  ] }) }) : /* @__PURE__ */ i(
-    "header",
-    {
-      className: a.header,
-      style: {
-        borderTop: `solid 4px ${r.color ? r.color : W.brandPrimary}`
-      },
-      children: [
-        /* @__PURE__ */ i("div", { className: a.headerContent, children: [
-          /* @__PURE__ */ e("div", { className: a.logo, children: /* @__PURE__ */ e(
-            g,
-            {
-              size: "small",
-              padding: !1
-            }
-          ) }),
-          t !== void 0 && /* @__PURE__ */ e(
-            I,
-            {
-              variant: "icon",
-              className: a.toggleButton,
-              "aria-label": t ? m.format("closeMenu") : m.format("openMenu"),
-              "aria-controls": h,
-              onPressStart: () => {
-                c(!1), o?.(!0);
-              },
-              children: t ? /* @__PURE__ */ e(
-                j,
-                {
-                  size: 20,
-                  "aria-hidden": "true"
-                }
-              ) : /* @__PURE__ */ e(
-                A,
-                {
-                  size: 20,
-                  "aria-hidden": "true"
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ i("div", { children: [
-            /* @__PURE__ */ e("p", { className: a.userName, children: s.name }),
-            /* @__PURE__ */ e("p", { className: a.userTitle, children: s.title }),
-            /* @__PURE__ */ e("p", { className: a.title, children: n })
-          ] })
-        ] }),
-        /* @__PURE__ */ e("div", { className: a.headerItems, children: l })
-      ]
-    }
-  );
-}, S = ({
-  id: n = "main:first-of-type"
-}) => {
-  const s = () => {
-    const t = document.querySelector(n);
-    t && (t.tabIndex = -1, t.focus(), setTimeout(() => t.removeAttribute("tabindex"), 1e3));
-  }, r = C(x);
-  return /* @__PURE__ */ e(
-    I,
-    {
-      onPress: s,
-      className: a.skipToContent,
-      children: r.format("skipToContent")
-    }
-  );
-}, Pe = () => {
-  const { isOpened: n, setIsOpened: s } = f();
-  return n ? /* @__PURE__ */ e(
-    "div",
-    {
-      className: u(a.backdrop, a.backdropOpened),
-      onClick: () => {
-        s?.(!1);
-      },
-      "aria-hidden": !0
-    }
-  ) : null;
-}, He = () => {
-  const { items: n, clientSideRouter: s, clientSideHref: r } = f(), t = C(x), o = n.at(0)?.items;
-  return /* @__PURE__ */ e(
-    "nav",
-    {
-      className: a.navbar,
-      "aria-label": t.format("bottomMenu"),
-      children: o && /* @__PURE__ */ e("ul", { className: u(a.navbarList), children: s ? /* @__PURE__ */ e(
-        B,
-        {
-          navigate: s,
-          useHref: r,
-          children: /* @__PURE__ */ e(z, { items: o })
-        }
-      ) : /* @__PURE__ */ e(z, { items: o }) })
-    }
-  );
-}, z = ({
-  items: n
-}) => /* @__PURE__ */ e(P, { children: n.map(({ href: s, active: r, icon: t, title: o, hasBadge: c }, l) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ i(
-  q,
-  {
-    href: s,
-    className: u(a.navbarItem),
-    "data-active": r,
-    "aria-current": r && "page",
-    children: [
-      /* @__PURE__ */ i(L, { children: [
-        /* @__PURE__ */ e(t, { size: 20 }),
-        c && /* @__PURE__ */ e(y, {})
-      ] }),
-      o
-    ]
-  }
-) }, l)) }), d = ({
-  items: n,
-  title: s,
-  user: r,
-  app: t,
-  children: o,
-  headerChildren: c,
-  clientSideRouter: l,
-  clientSideHref: _,
-  variant: h,
-  className: m
-}) => {
-  const [k, p] = v.useState(!1), [b, N] = v.useState(!1), E = v.useId();
-  return h === "external" ? /* @__PURE__ */ e(
-    d.Provider,
-    {
-      items: n,
-      title: s,
-      user: r,
-      app: t,
-      clientSideRouter: l,
-      clientSideHref: _,
-      headerChildren: c,
-      isCollapsed: k,
-      setIsCollapsed: p,
-      variant: h,
-      id: E,
-      children: /* @__PURE__ */ i("div", { className: u(a.baseLayout, m), children: [
-        /* @__PURE__ */ e(S, {}),
-        /* @__PURE__ */ e(d.Header, {}),
-        /* @__PURE__ */ i("div", { className: a.mainContent, children: [
-          /* @__PURE__ */ e(d.Sidebar, {}),
-          /* @__PURE__ */ e(T, { children: /* @__PURE__ */ e("main", { className: a.main, children: /* @__PURE__ */ e("div", { className: a.app, children: o }) }) }),
-          /* @__PURE__ */ e(d.Backdrop, {})
-        ] }),
-        /* @__PURE__ */ e("div", { className: a.navbarWrapper, children: /* @__PURE__ */ e(d.Navbar, {}) })
-      ] })
-    }
-  ) : /* @__PURE__ */ e(
-    d.Provider,
-    {
-      items: n,
-      title: s,
-      user: r,
-      app: t,
-      clientSideRouter: l,
-      clientSideHref: _,
-      headerChildren: c,
-      isCollapsed: k,
-      setIsCollapsed: p,
-      isOpened: b,
-      setIsOpened: N,
-      variant: h,
-      id: E,
-      children: /* @__PURE__ */ i("div", { className: u(a.baseLayout, m), children: [
-        /* @__PURE__ */ e(S, {}),
-        /* @__PURE__ */ e(d.Header, {}),
-        /* @__PURE__ */ i("div", { className: a.mainContent, children: [
-          /* @__PURE__ */ e(d.Sidebar, {}),
-          /* @__PURE__ */ e(T, { children: /* @__PURE__ */ e("main", { className: a.main, children: /* @__PURE__ */ e("div", { className: a.app, children: o }) }) }),
-          /* @__PURE__ */ e(d.Backdrop, {})
-        ] })
-      ] })
-    }
-  );
-};
-d.Provider = Se;
-d.Header = we;
-d.Sidebar = Oe;
-d.SidebarLink = w;
-d.Navbar = He;
-d.Backdrop = Pe;
-export {
-  we as H,
-  d as L,
-  He as N,
-  Oe as S,
-  w as a
-};