@stenajs-webui/panels 19.0.0-next.6 → 19.0.0-next.61

package/dist/index.es.js

@@ -1,894 +1,772 @@
-(function(){"use strict";try{var o=document.createElement("style");o.appendChild(document.createTextNode('._navBar_kzibd_1{--swui-navbar-background-color: var(--lhds-color-ui-50);--swui-navbar-item-background-color-hover: var(--lhds-color-blue-700);--swui-navbar-item-background-color-selected: var(--lhds-color-blue-600);--swui-navbar-item-background-color-selected-hover: var( --lhds-color-blue-700 );--swui-nav-bar-height: 48px;background-color:var(--swui-navbar-background-color);height:var(--swui-nav-bar-height);min-height:var(--swui-nav-bar-height)}._navBarButton_18iz9_1{--swui-nav-bar-button-text-color: var(--lhds-color-blue-600);--swui-nav-bar-button-background-color: transparent;--swui-nav-bar-button-background-color-hover: var(--lhds-color-ui-100);--swui-nav-bar-button-background-color-focus: var(--lhds-color-ui-200);--swui-nav-bar-button-background-color-active: var(--lhds-color-ui-200);--swui-nav-bar-button-background-color-selected: var(--lhds-color-blue-200);--swui-nav-bar-button-background-color-selected-hover: var( --lhds-color-blue-100 );--swui-nav-bar-button-background-color-selected-focus: var( --lhds-color-blue-300 );--swui-nav-bar-button-background-color-selected-active: var( --lhds-color-blue-200 );--swui-flat-button-text-color: var(--swui-nav-bar-button-text-color);--swui-flat-button-icon-color: var(--swui-nav-bar-button-text-color);--swui-flat-button-text-color-active: var(--swui-nav-bar-button-text-color);--swui-flat-button-background-color: var( --swui-nav-bar-button-background-color );--swui-flat-button-background-color-hover: var( --swui-nav-bar-button-background-color-hover );--swui-flat-button-background-color-focus: var( --swui-nav-bar-button-background-color-focus );--swui-flat-button-background-color-active: var( --swui-nav-bar-button-background-color-active )}._navBarButton_18iz9_1._selected_18iz9_36{--swui-flat-button-background-color: var( --swui-nav-bar-button-background-color-selected );--swui-flat-button-background-color-hover: var( --swui-nav-bar-button-background-color-selected-hover );--swui-flat-button-background-color-focus: var( --swui-nav-bar-button-background-color-selected-focus );--swui-flat-button-background-color-active: var( --swui-nav-bar-button-background-color-selected-active )}._navBarNotificationButton_8ej1j_1{--swui-nav-bar-notification-button-text-color: var(--lhds-color-ui-50);--swui-nav-bar-notification-button-background-color: var(--lhds-color-ui-400);--swui-nav-bar-notification-button-background-color-hover: var( --lhds-color-blue-900 );--swui-nav-bar-notification-button-background-color-focus: var( --lhds-color-blue-700 );--swui-nav-bar-notification-button-background-color-active: var( --lhds-color-blue-800 );--swui-nav-bar-notification-button-background-color-unread: var( --lhds-color-red-500 );--swui-nav-bar-notification-button-background-color-unread-hover: var( --lhds-color-red-700 );--swui-nav-bar-notification-button-background-color-unread-focus: var( --lhds-color-red-700 );--swui-nav-bar-notification-button-background-color-unread-active: var( --lhds-color-red-800 );--swui-flat-button-text-color: var( --swui-nav-bar-notification-button-text-color );--swui-flat-button-icon-color: var( --swui-nav-bar-notification-button-text-color );--swui-flat-button-text-color-active: var( --swui-nav-bar-notification-button-text-color );--swui-flat-button-background-color: var( --swui-nav-bar-notification-button-background-color );--swui-flat-button-background-color-hover: var( --swui-nav-bar-notification-button-background-color-hover );--swui-flat-button-background-color-focus: var( --swui-nav-bar-notification-button-background-color-focus );--swui-flat-button-background-color-active: var( --swui-nav-bar-notification-button-background-color-active );--swui-nav-bar-notification-shake-count: 3;transition:.5s width}._navBarNotificationButton_8ej1j_1._unread_8ej1j_54{--swui-flat-button-background-color: var( --swui-nav-bar-notification-button-background-color-unread );--swui-flat-button-background-color-hover: var( --swui-nav-bar-notification-button-background-color-unread-hover );--swui-flat-button-background-color-focus: var( --swui-nav-bar-notification-button-background-color-unread-focus );--swui-flat-button-background-color-active: var( --swui-nav-bar-notification-button-background-color-unread-active )}._navBarNotificationButton_8ej1j_1._unread_8ej1j_54._hasCount_8ej1j_68 ._icon_8ej1j_69{-webkit-transform-origin:top center;transform-origin:top center;-webkit-animation:_shake_8ej1j_1 1.5s ease-in-out var(--swui-nav-bar-notification-shake-count);animation:_shake_8ej1j_1 1.5s ease-in-out var(--swui-nav-bar-notification-shake-count)}@-webkit-keyframes _shake_8ej1j_1{0%{-webkit-transform:rotate(0);transform:rotate(0)}7%{-webkit-transform:rotate(20deg);transform:rotate(20deg)}15%{-webkit-transform:rotate(-20deg);transform:rotate(-20deg)}22%{-webkit-transform:rotate(16deg);transform:rotate(16deg)}30%{-webkit-transform:rotate(-16deg);transform:rotate(-16deg)}38%{-webkit-transform:rotate(6deg);transform:rotate(6deg)}42%{-webkit-transform:rotate(-6deg);transform:rotate(-6deg)}46%{-webkit-transform:rotate(2deg);transform:rotate(2deg)}to{-webkit-transform:rotate(0);transform:rotate(0)}}@keyframes _shake_8ej1j_1{0%{-webkit-transform:rotate(0);transform:rotate(0)}7%{-webkit-transform:rotate(20deg);transform:rotate(20deg)}15%{-webkit-transform:rotate(-20deg);transform:rotate(-20deg)}22%{-webkit-transform:rotate(16deg);transform:rotate(16deg)}30%{-webkit-transform:rotate(-16deg);transform:rotate(-16deg)}38%{-webkit-transform:rotate(6deg);transform:rotate(6deg)}42%{-webkit-transform:rotate(-6deg);transform:rotate(-6deg)}46%{-webkit-transform:rotate(2deg);transform:rotate(2deg)}to{-webkit-transform:rotate(0);transform:rotate(0)}}._navBarSearchFieldInput_rcj0j_1{--swui-textinput-line-height: 2.7rem;--swui-textinput-text-color: var(--lhds-color-ui-50)}._navBarSearchFieldInput_rcj0j_1:focus{--swui-textinput-text-color: var(--lhds-color-ui-800)}._navBarSearchField_rcj0j_1{--swui-textinput-animation-time: var(--swui-animation-time-fast);--swui-textinput-placeholder-color: var(--lhds-color-ui-500);--swui-textinput-bg-color: var(--lhds-color-blue-50);--swui-textinput-border-color: transparent;--swui-textinput-border-color-hover: transparent}._navBarSearchField_rcj0j_1:focus-within{--swui-textinput-text-color: var(--lhds-color-ui-800);--swui-field-text-color: var(--swui-field-text-color);--swui-textinput-icon-color: var(--lhds-color-ui-500);--swui-textinput-bg-color: var(--lhds-color-ui-50)}._navBarUserButton_1cwhm_1{--swui-nav-bar-user-button-text-color: var(--lhds-color-blue-600);--swui-nav-bar-user-button-background-color: var(--lhds-color-ui-50);--swui-nav-bar-user-button-background-color-hover: var(--lhds-color-ui-100);--swui-nav-bar-user-button-background-color-focus: var(--lhds-color-ui-100);--swui-nav-bar-user-button-background-color-active: var(--lhds-color-ui-200);--swui-flat-button-text-color: var(--swui-nav-bar-user-button-text-color);--swui-flat-button-icon-color: var(--swui-nav-bar-user-button-text-color);--swui-flat-button-text-color-active: var( --swui-nav-bar-user-button-text-color );--swui-flat-button-background-color: var( --swui-nav-bar-user-button-background-color );--swui-flat-button-background-color-hover: var( --swui-nav-bar-user-button-background-color-hover );--swui-flat-button-background-color-focus: var( --swui-nav-bar-user-button-background-color-focus );--swui-flat-button-background-color-active: var( --swui-nav-bar-user-button-background-color-active );--swui-button-border-radius: 16px;--swui-button-border-radius-icon-only: 16px}._navBarUserButton_1cwhm_1._initials_1cwhm_31{width:32px}._clickable_1ijxc_1{--swui-toast-border-color: transparent;--swui-toast-item-border-color-hover: var(--lhds-color-blue-500);--current-border-color: var(--swui-toast-border-color);border-width:1px;border-style:solid;border-color:var(--current-border-color);position:absolute;top:0;left:0;right:0;bottom:0;border-radius:8px;background-color:transparent;width:100%;cursor:pointer}._clickable_1ijxc_1:hover{--current-border-color: var(--swui-toast-item-border-color-hover)}._nonClickable_1ijxc_27{position:relative;z-index:1;pointer-events:none}._nonClickable_1ijxc_27 a,._nonClickable_1ijxc_27 button{pointer-events:auto}._collapsible_1nroa_1{--swui-collapsible-animation-time: var(--swui-animation-time-fast);--swui-collapsible-expanded-line-background-color: var( --swui-primary-action-color );--swui-collapsible-header-text-color: var(--lhds-color-ui-900);--swui-collapsible-header-background-color: var(--swui-white);--swui-collapsible-header-background-color-hover: var(--lhds-color-blue-100);--swui-collapsible-header-background-color-active: var(--lhds-color-blue-100);--swui-collapsible-header-border-color: var(--lhds-color-ui-300);--swui-collapsible-header-border-color-focus: var( --swui-primary-action-color );--swui-collapsible-header-focus-shadow: var(--swui-field-focus-shadow);--swui-collapsible-header-content-margin: calc( var(--swui-metrics-indent) * 2 );--swui-collapsible-header-font-weight: var(--swui-font-weight-text-bold);--swui-collapsible-header-indicator-color: var(--swui-primary-action-color);--swui-collapsible-header-indicator-color-collapsed: var(--lhds-color-ui-500);--swui-collapsible-header-indicator-color-hover: var( --swui-primary-action-color );--swui-collapsible-header-padding: 0 calc(var(--swui-metrics-indent) * 2) 0;--swui-collapsible-content-background-color: var(--lhds-color-ui-100);--swui-collapsible-content-border-color: var(--lhds-color-ui-300);--swui-collapsible-content-padding: var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 2);--swui-collapsible-groupheading-font-size: var(--swui-font-size-smaller);--swui-collapsible-groupheading-text-color: var(--lhds-color-ui-600);--swui-collapsible-min-height: 40px}._collapsible_1nroa_1 ._header_1nroa_46{background-color:var(--swui-collapsible-header-background-color);width:100%;text-align:left;min-height:var(--swui-collapsible-min-height);box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--swui-collapsible-header-border-color);padding:var(--swui-collapsible-header-padding)}._collapsible_1nroa_1 ._header_1nroa_46 ._indicator_1nroa_59{transition:all var(--swui-collapsible-animation-time) ease-in-out;margin-left:var(--swui-collapsible-header-content-margin);color:var(--swui-collapsible-header-indicator-color)}._collapsible_1nroa_1 ._header_1nroa_46:not(:disabled):hover:not(:active){background-color:var(--swui-collapsible-header-background-color-hover)}._collapsible_1nroa_1 ._header_1nroa_46:not(:disabled):hover:not(:active) ._indicator_1nroa_59{color:var(--swui-collapsible-header-indicator-color-hover)}._collapsible_1nroa_1 ._header_1nroa_46:focus-visible{outline:1px solid var(--swui-collapsible-header-border-color-focus);outline-offset:-1px;box-shadow:var(--swui-collapsible-header-focus-shadow)}._collapsible_1nroa_1 ._header_1nroa_46:active{background:var(--swui-collapsible-header-background-color-active)}._collapsible_1nroa_1 ._header_1nroa_46:disabled{cursor:not-allowed}._collapsible_1nroa_1{position:relative}._collapsible_1nroa_1:before{content:"";position:absolute;width:2px;background:var(--swui-collapsible-expanded-line-background-color);top:0;bottom:0;left:0;z-index:1}._collapsible_1nroa_1 ._headerText_1nroa_103{font-weight:var(--swui-collapsible-header-font-weight)}._collapsible_1nroa_1[aria-expanded=false]{--swui-collapsible-expanded-line-background-color: transparent}._collapsible_1nroa_1[aria-expanded=false] ._indicator_1nroa_59{color:var(--swui-collapsible-header-indicator-color-collapsed)}._collapsible_1nroa_1 ._label_1nroa_114{margin-right:auto}._collapsible_1nroa_1 ._label_1nroa_114 span{--current-line-height: 1;font-weight:var(--swui-collapsible-header-font-weight)}._collapsible_1nroa_1 ._contentLeft_1nroa_123,._collapsible_1nroa_1 ._contentRight_1nroa_124{display:flex}._collapsible_1nroa_1 ._contentLeft_1nroa_123 button,._collapsible_1nroa_1 ._contentRight_1nroa_124 button{cursor:pointer}._collapsible_1nroa_1 ._contentLeft_1nroa_123{margin-right:var(--swui-collapsible-header-content-margin)}._collapsible_1nroa_1 ._contentRight_1nroa_124{margin-left:auto}._collapsible_1nroa_1 ._content_1nroa_123{display:flex;align-items:center;justify-content:stretch;background:var(--swui-collapsible-content-background-color);padding:var(--swui-collapsible-content-padding);min-height:var(--swui-collapsible-min-height);box-sizing:border-box}._collapsible_1nroa_1 ._content_1nroa_123:last-child{border-bottom:1px solid var(--swui-collapsible-content-border-color)}._collapsible_1nroa_1 ._content_1nroa_123._groupHeading_1nroa_155{border:none;font-size:var(--swui-collapsible-groupheading-font-size);font-family:var(--swui-font-primary);color:var(--swui-collapsible-groupheading-text-color);text-transform:uppercase;font-weight:var(--swui-font-weight-text-bold);letter-spacing:.1rem}._collapsible_1nroa_1 ._content_1nroa_123 [data-hidden=true]{display:none}._collapsible_1nroa_1 ._content_1nroa_123:hover [data-hidden=true]{display:inherit}._collapsible_1nroa_1 ._content_1nroa_123:hover [data-hover=true]{color:var(--swui-collapsible-header-indicator-color-hover)}._collapsible_1nroa_1 ._contentEnter_1nroa_180{opacity:0}._collapsible_1nroa_1 ._contentEnterActive_1nroa_184{opacity:1;transition:opacity var(--swui-collapsible-animation-time) ease-in-out}._collapsible_1nroa_1 ._contentExitDone_1nroa_189{display:none}._collapsible_1nroa_1 button._content_1nroa_123{font-family:var(--swui-font-primary);font-size:inherit;width:100%;text-align:left}._collapsible_1nroa_1 button._content_1nroa_123:focus-visible{outline:1px solid var(--swui-collapsible-header-border-color-focus);outline-offset:-1px;box-shadow:var(--swui-collapsible-header-focus-shadow)}._collapsible_1nroa_1 button._content_1nroa_123:not(:disabled):hover{background-color:var(--swui-collapsible-header-background-color-hover)}._collapsible_1nroa_1 button._content_1nroa_123:disabled{cursor:not-allowed}._collapsible_1nroa_1 button._content_1nroa_123:focus-within [data-hidden=true]{display:inherit}._collapsible_1nroa_1 ._collapsible_1nroa_1{--swui-collapsible-header-background-color: var( --swui-collapsible-content-background-color );--swui-collapsible-header-font-weight: normal}._collapsible_1nroa_1 ._collapsible_1nroa_1{--swui-collapsible-content-padding: var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 2) var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 4)}._collapsible_1nroa_1 ._collapsible_1nroa_1 ._collapsible_1nroa_1{--swui-collapsible-header-padding: 0 calc(var(--swui-metrics-indent) * 2) 0 calc(var(--swui-metrics-indent) * 4);--swui-collapsible-content-padding: var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 2) var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 6)}._collapsible_1nroa_1 ._collapsible_1nroa_1 ._collapsible_1nroa_1 ._collapsible_1nroa_1{--swui-collapsible-header-padding: 0 calc(var(--swui-metrics-indent) * 2) 0 calc(var(--swui-metrics-indent) * 6);--swui-collapsible-content-padding: var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 2) var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 8)}._collapsible_1nroa_1 ._collapsible_1nroa_1 ._collapsible_1nroa_1 ._collapsible_1nroa_1 ._collapsible_1nroa_1{--swui-collapsible-header-padding: 0 calc(var(--swui-metrics-indent) * 2) 0 calc(var(--swui-metrics-indent) * 8);--swui-collapsible-content-padding: var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 2) var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 10)}._sidebarMenu_tg9i7_1{--swui-sidebar-menu-separator-color: var(--swui-white);--swui-sidebar-menu-text-color: var(--lhds-color-ui-900);--swui-sidebar-menu-icon-color: var(--lhds-color-ui-900);--swui-sidebar-menu-background-color: transparent;--swui-sidebar-menu-background-color-hover: var(--lhds-color-ui-400);--swui-sidebar-menu-background-color-focus: var(--lhds-color-ui-400);--swui-sidebar-menu-background-color-active: var(--lhds-color-ui-300);--swui-sidebar-menu-background-selected: var(--lhds-color-blue-100);--swui-sidebar-menu-background-selected-hover: var(--lhds-color-blue-200);--swui-sidebar-menu-background-selected-focus: var(--lhds-color-blue-200);--swui-sidebar-menu-background-selected-active: var(--lhds-color-blue-100);--current-separator-color: var(--swui-sidebar-menu-separator-color);--current-text-color: var(--swui-sidebar-menu-text-color);--current-icon-color: var(--swui-sidebar-menu-icon-color);--current-background-color: var(--swui-sidebar-menu-background-color);--current-background-color-hover: var( --swui-sidebar-menu-background-color-hover );--current-background-color-focus: var( --swui-sidebar-menu-background-color-focus );--current-background-color-active: var( --swui-sidebar-menu-background-color-active );--current-background-selected: var(--swui-sidebar-menu-background-selected);--current-background-selected-hover: var( --swui-sidebar-menu-background-selected-hover );--current-background-selected-focus: var( --swui-sidebar-menu-background-selected-focus );--current-background-selected-active: var( --swui-sidebar-menu-background-selected-active );background-color:var(--current-background-color);height:100vh}._sidebarMenu_tg9i7_1[data-collapsed]{width:var(--swui-sidebar-menu-item-height)}._sidebarMenu_tg9i7_1 button{--swui-button-text-color: var(--swui-white);--swui-button-background-color-hover: var( --swui-sidebar-menu-background-color-hover )}._stenaFlag_108h7_1{height:32px}')),document.head.appendChild(o)}catch(r){console.error("vite-plugin-css-injected-by-js",r)}})();
-import { ActionMenu as Y, ActionMenuContext as de, stenaAngleDown as $, PrimaryButton as ue, SecondaryButton as he, FlatButton as _, stenaHamburger as pe, stenaBellFilled as ge, Icon as F, stenaSearch as me, stenaUserCircle as fe, stenaTimes as Z, stenaMail as be, stenaAngleUp as ve, Banner as _e, Spinner as Ce, CircledIcon as xe, StenaFlag as Be, MenuButtonLink as ye, MenuButton as ke } from "@stenajs-webui/elements";
-import * as ee from "react";
-import { useRef as Ne, useMemo as Ie, forwardRef as we, useState as Se } from "react";
-import { useBoolean as D, Column as S, Box as d, Row as i, Indent as x, Heading as U, Clickable as V, Txt as J, Space as b, Text as B, SeparatorLine as ne, exhaustSwitchCaseElseThrow as te } from "@stenajs-webui/core";
-import { Popover as R } from "@stenajs-webui/tooltip";
-import { jsx as e, jsxs as o, Fragment as m } from "react/jsx-runtime";
-import { Checkbox as re, TextInput as je } from "@stenajs-webui/forms";
+(function(){"use strict";try{var r=document.createElement("style");r.appendChild(document.createTextNode("._navBar_kzibd_1{--swui-navbar-background-color: var(--lhds-color-ui-50);--swui-navbar-item-background-color-hover: var(--lhds-color-blue-700);--swui-navbar-item-background-color-selected: var(--lhds-color-blue-600);--swui-navbar-item-background-color-selected-hover: var( --lhds-color-blue-700 );--swui-nav-bar-height: 48px;background-color:var(--swui-navbar-background-color);height:var(--swui-nav-bar-height);min-height:var(--swui-nav-bar-height)}._navBarButton_b3x3w_1:hover{background:var(--lhds-color-ui-100)}._navBarButton_b3x3w_1:focus-visible{background:var(--lhds-color-ui-200)}._navBarButton_b3x3w_1:active{background:var(--lhds-color-ui-200)}._navBarButton_b3x3w_1._selected_b3x3w_14{background:var(--lhds-color-blue-200)}._navBarButton_b3x3w_1._selected_b3x3w_14:hover{background:var(--lhds-color-blue-100)}._navBarButton_b3x3w_1._selected_b3x3w_14:focus-visible{background:var(--lhds-color-blue-300)}._navBarButton_b3x3w_1._selected_b3x3w_14:active{background:var(--lhds-color-blue-200)}._navBarNotificationButton_1wt3y_1{--current-background-color: var(--lhds-color-ui-400);--current-outline-color: var(--modern-blue);background-color:var(--current-background-color);border-color:transparent;color:var(--lhds-color-ui-50);--swui-nav-bar-notification-shake-count: 3;transition:.5s width}._navBarNotificationButton_1wt3y_1:hover{--current-background-color: var(--lhds-color-red-500);--current-outline-color: var(--lhds-color-red-500)}._navBarNotificationButton_1wt3y_1:active{--current-background-color: var(--lhds-color-red-600);--current-outline-color: var(--lhds-color-red-600)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23 ._icon_1wt3y_23{-webkit-transform-origin:top center;transform-origin:top center;-webkit-animation:_shake_1wt3y_1 1.5s ease-in-out var(--swui-nav-bar-notification-shake-count);animation:_shake_1wt3y_1 1.5s ease-in-out var(--swui-nav-bar-notification-shake-count)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23{--current-background-color: var(--lhds-color-red-500);--current-outline-color: var(--lhds-color-red-500)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23:hover{--current-background-color: var(--lhds-color-red-600);--current-outline-color: var(--lhds-color-red-600)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23:active{--current-background-color: var(--lhds-color-red-700);--current-outline-color: var(--lhds-color-red-700)}._navBarNotificationButton_1wt3y_1:focus-visible{outline:var(--swui-focus-outline);outline-color:var(--current-outline-color);outline-offset:var(--swui-focus-outline-width)}@-webkit-keyframes _shake_1wt3y_1{0%{-webkit-transform:rotate(0);transform:rotate(0)}7%{-webkit-transform:rotate(20deg);transform:rotate(20deg)}15%{-webkit-transform:rotate(-20deg);transform:rotate(-20deg)}22%{-webkit-transform:rotate(16deg);transform:rotate(16deg)}30%{-webkit-transform:rotate(-16deg);transform:rotate(-16deg)}38%{-webkit-transform:rotate(6deg);transform:rotate(6deg)}42%{-webkit-transform:rotate(-6deg);transform:rotate(-6deg)}46%{-webkit-transform:rotate(2deg);transform:rotate(2deg)}to{-webkit-transform:rotate(0);transform:rotate(0)}}@keyframes _shake_1wt3y_1{0%{-webkit-transform:rotate(0);transform:rotate(0)}7%{-webkit-transform:rotate(20deg);transform:rotate(20deg)}15%{-webkit-transform:rotate(-20deg);transform:rotate(-20deg)}22%{-webkit-transform:rotate(16deg);transform:rotate(16deg)}30%{-webkit-transform:rotate(-16deg);transform:rotate(-16deg)}38%{-webkit-transform:rotate(6deg);transform:rotate(6deg)}42%{-webkit-transform:rotate(-6deg);transform:rotate(-6deg)}46%{-webkit-transform:rotate(2deg);transform:rotate(2deg)}to{-webkit-transform:rotate(0);transform:rotate(0)}}._navBarSearchFieldInput_q4zl6_1._navBarSearchFieldInput_q4zl6_1{--swui-textinput-line-height: 2.7rem;--swui-textinput-text-color: var(--lhds-color-ui-50);--swui-textinput-placeholder-color: var(--lhds-color-blue-800);padding:0 var(--swui-metrics-indent)}._navBarSearchFieldInput_q4zl6_1._navBarSearchFieldInput_q4zl6_1:focus{--swui-textinput-text-color: var(--lhds-color-ui-800)}._navBarSearchField_q4zl6_1{--swui-textinput-animation-time: var(--swui-animation-time-fast);--swui-textinput-placeholder-color: var(--lhds-color-ui-500);--swui-textinput-bg-color: var(--lhds-color-ui-200);--swui-textinput-border-color: transparent;--swui-textinput-border-color-hover: transparent;padding:0 var(--swui-metrics-indent);border-radius:var(--swui-max-border-radius)}._navBarSearchField_q4zl6_1._withButton_q4zl6_25{padding-right:1px}._navBarSearchField_q4zl6_1:focus-within{--swui-textinput-text-color: var(--lhds-color-ui-800);--swui-field-text-color: var(--swui-field-text-color);--swui-textinput-bg-color: var(--lhds-color-ui-50)}._clearButton_q4zl6_36{border-radius:var(--swui-max-border-radius)}._navBarUserButton_10f9z_1:hover{background:var(--lhds-color-ui-100)}._navBarUserButton_10f9z_1:focus-visible{background:var(--lhds-color-ui-200)}._navBarUserButton_10f9z_1:active{background:var(--lhds-color-ui-200)}._unreadDot_l8bni_1{position:relative}._unreadDot_l8bni_1 ._dot_l8bni_4{top:1px;right:1px;position:absolute;width:8px;height:8px;border-radius:var(--swui-max-border-radius);background:var(--lhds-color-blue-500)}._notification_1hao0_1{display:flex;flex-direction:column;width:100%;background:var(--lhds-color-ui-50)}._notification_1hao0_1 ._body_1hao0_7{padding-left:64px;padding-right:24px;padding-bottom:16px}._notification_1hao0_1._standard_1hao0_13._unread_1hao0_14{background:var(--lhds-color-blue-50)}._notification_1hao0_1._danger_1hao0_19{background:var(--lhds-color-red-100)}._notificationList_1rkvu_1{display:flex;flex-direction:column;gap:2px;background:var(--lhds-color-ui-200)}._clickable_1ijxc_1{--swui-toast-border-color: transparent;--swui-toast-item-border-color-hover: var(--lhds-color-blue-500);--current-border-color: var(--swui-toast-border-color);border-width:1px;border-style:solid;border-color:var(--current-border-color);position:absolute;top:0;left:0;right:0;bottom:0;border-radius:8px;background-color:transparent;width:100%;cursor:pointer}._clickable_1ijxc_1:hover{--current-border-color: var(--swui-toast-item-border-color-hover)}._nonClickable_1ijxc_27{position:relative;z-index:1;pointer-events:none}._nonClickable_1ijxc_27 a,._nonClickable_1ijxc_27 button{pointer-events:auto}._sidebarMenu_1bx5w_1{--swui-sidebar-menu-separator-color: var(--swui-white);--swui-sidebar-menu-text-color: var(--lhds-color-ui-900);--swui-sidebar-menu-icon-color: var(--lhds-color-ui-900);--swui-sidebar-menu-background-color: transparent;--swui-sidebar-menu-background-color-hover: var(--lhds-color-ui-400);--swui-sidebar-menu-background-color-focus: var(--lhds-color-ui-400);--swui-sidebar-menu-background-color-active: var(--lhds-color-ui-300);--swui-sidebar-menu-background-selected: var(--lhds-color-blue-100);--swui-sidebar-menu-background-selected-hover: var(--lhds-color-blue-200);--swui-sidebar-menu-background-selected-focus: var(--lhds-color-blue-200);--swui-sidebar-menu-background-selected-active: var(--lhds-color-blue-100);--current-background-color: var(--swui-sidebar-menu-background-color);--current-background-color-hover: var( --swui-sidebar-menu-background-color-hover );--current-background-color-focus: var( --swui-sidebar-menu-background-color-focus );--current-background-color-active: var( --swui-sidebar-menu-background-color-active );--current-background-selected: var(--swui-sidebar-menu-background-selected);--current-background-selected-hover: var( --swui-sidebar-menu-background-selected-hover );--current-background-selected-focus: var( --swui-sidebar-menu-background-selected-focus );--current-background-selected-active: var( --swui-sidebar-menu-background-selected-active )}._sidebarMenu_1bx5w_1 ._sidebarItems_1bx5w_38{--current-separator-color: var(--swui-sidebar-menu-separator-color);--current-text-color: var(--swui-sidebar-menu-text-color);--current-icon-color: var(--swui-sidebar-menu-icon-color)}._sidebarMenu_1bx5w_1{background-color:var(--current-background-color);height:100dvh}._sidebarMenu_1bx5w_1 ._scrollContainer_1bx5w_48{background:var(--current-background-color);height:100%;overflow:auto}._stenaFlag_108h7_1{height:32px}")),document.head.appendChild(r)}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
+import { jsxs as a, Fragment as b, jsx as n } from "react/jsx-runtime";
+import { ActionMenu as G, ActionMenuContext as rn, stenaAngleDown as J, PrimaryButton as an, SecondaryButton as cn, FlatButton as R, stenaHamburger as K, BaseButton as ln, stenaBellFilled as sn, TextInputButton as dn, stenaTimes as un, stenaUserCircle as hn, CircledIcon as Q, CloseButton as V, Icon as pn, stenaMail as gn, MenuButton as z, Banner as fn, Spinner as mn, StenaFlag as bn, stenaAngleLeftDouble as X, stenaPin as vn, IconMenuButton as $, IconMenuButtonLink as _n, MenuButtonLink as Bn } from "@stenajs-webui/elements";
+import * as Cn from "react";
+import { useRef as xn, useMemo as yn, forwardRef as kn, createContext as wn, useContext as In, useState as Nn } from "react";
+import { useBoolean as A, Column as g, Box as l, Row as s, Indent as C, Heading as H, Text as v, Space as _, SeparatorLine as Mn } from "@stenajs-webui/core";
+import { Popover as F, Tooltip as Y } from "@stenajs-webui/tooltip";
+import { Checkbox as Z, TextInput as Sn } from "@stenajs-webui/forms";
 import h from "classnames";
 import { cssColor as f } from "@stenajs-webui/theme";
-import { CSSTransition as Ee } from "react-transition-group";
-const W = ({
-  renderItems: n,
+const E = ({
+  renderItems: e,
   placement: t = "bottom",
-  buttonComponent: r,
-  rightIcon: a = $,
-  portalTarget: l = "parent",
+  buttonComponent: o,
+  rightIcon: r = J,
+  portalTarget: i = "parent",
   zIndex: c,
-  menuWidth: u,
-  menuTop: p,
-  onClick: v,
-  disableArrow: y = !1,
-  ...A
+  menuWidth: d,
+  menuTop: u,
+  onClick: p,
+  disableArrow: m = !1,
+  ...j
 }) => {
-  const [j, E, g, H] = D(!1), k = Ne(null), P = {
+  const [D, T, x, en] = A(!1), w = xn(null), tn = {
     name: "focusManager",
     defaultValue: !0,
-    fn({
-      popper: I
-    }) {
-      let M = !1;
-      const G = (C) => {
-        C.key === "Escape" && (M = !0, g()), (C.key === "Enter" || C.key === " ") && (M = !0);
+    fn({ popper: y }) {
+      let I = !1;
+      const O = (B) => {
+        B.key === "Escape" && (I = !0, x()), (B.key === "Enter" || B.key === " ") && (I = !0);
       };
       return {
         onCreate() {
-          I.addEventListener("keydown", G);
+          y.addEventListener("keydown", O);
         },
         onDestroy() {
-          I.removeEventListener("keydown", G);
+          y.removeEventListener("keydown", O);
         },
         onMount() {
-          var C;
-          M = !1, (C = I.querySelector("button:not([disabled]), a[href]")) == null || C.focus();
+          var B;
+          I = !1, (B = y.querySelector("button:not([disabled]), a[href]")) == null || B.focus();
         },
         onHide() {
-          k.current && M && k.current.focus();
+          w.current && I && w.current.focus();
         }
       };
     }
-  }, N = Ie(() => ({
-    open: E,
-    close: g
-  }), [E, g]), z = (I) => {
-    v == null || v(I), H();
-  };
-  return /* @__PURE__ */ e(R, {
-    disablePadding: !0,
-    visible: j,
-    onClickOutside: g,
-    placement: t,
-    content: j && /* @__PURE__ */ e(Y, {
-      width: u,
-      top: p,
-      trapFocus: !0,
-      children: /* @__PURE__ */ e(de.Provider, {
-        value: N,
-        children: n(g)
-      })
-    }),
-    arrow: !1,
-    appendTo: l,
-    zIndex: c,
-    plugins: [P],
-    lazy: !0,
-    children: /* @__PURE__ */ e(r, {
-      rightIcon: y ? void 0 : a,
-      ...A,
-      ref: k,
-      onClick: z
-    })
-  });
-}, Sn = (n) => /* @__PURE__ */ e(W, {
-  buttonComponent: ue,
-  ...n
-}), jn = (n) => /* @__PURE__ */ e(W, {
-  buttonComponent: he,
-  ...n
-}), Me = (n) => /* @__PURE__ */ e(W, {
-  buttonComponent: _,
-  ...n
-}), Fe = "1px solid var(--lhds-color-ui-300)", En = ({
-  renderMenu: n,
+  }, on = yn(() => ({ open: T, close: x }), [T, x]);
+  return /* @__PURE__ */ a(b, { children: [
+    /* @__PURE__ */ n(
+      o,
+      {
+        rightIcon: m ? void 0 : r,
+        ...j,
+        ref: w,
+        onClick: (y) => {
+          p == null || p(y), en();
+        }
+      }
+    ),
+    /* @__PURE__ */ n(
+      F,
+      {
+        disablePadding: !0,
+        visible: D,
+        onClickOutside: x,
+        placement: t,
+        content: D && /* @__PURE__ */ n(G, { width: d, top: u, trapFocus: !0, children: /* @__PURE__ */ n(rn.Provider, { value: on, children: e(x) }) }),
+        arrow: !1,
+        appendTo: i,
+        zIndex: c,
+        plugins: [tn],
+        lazy: !0,
+        reference: w
+      }
+    )
+  ] });
+}, je = (e) => /* @__PURE__ */ n(E, { buttonComponent: an, ...e }), Le = (e) => /* @__PURE__ */ n(E, { buttonComponent: cn, ...e }), Rn = (e) => /* @__PURE__ */ n(E, { buttonComponent: R, ...e }), Fn = "1px solid var(--lhds-color-ui-300)", Pe = ({
+  renderMenu: e,
   ...t
 }) => {
-  const [r, a, l] = D(!1);
-  return /* @__PURE__ */ e(R, {
-    onClickOutside: l,
-    arrow: !1,
-    visible: r,
-    disablePadding: !0,
-    content: n ? /* @__PURE__ */ e(S, {
-      children: /* @__PURE__ */ e(Y, {
-        children: n(l)
-      })
-    }) : void 0,
-    placement: "bottom-start",
-    children: /* @__PURE__ */ e(d, {
-      display: "inline-block",
-      children: /* @__PURE__ */ o(i, {
-        spacing: 0.5,
-        indent: !0,
-        alignItems: "center",
-        border: Fe,
-        borderRadius: "4px",
-        children: [/* @__PURE__ */ e(re, {
-          ...t
-        }), /* @__PURE__ */ e(x, {
-          num: 0.5
-        }), /* @__PURE__ */ e(_, {
-          size: "small",
-          onClick: a,
-          leftIcon: $
-        })]
-      })
-    })
-  });
-}, Re = "_navBar_kzibd_1", Ae = {
-  navBar: Re
-}, ae = ({
-  className: n,
-  onClick: t
-}) => /* @__PURE__ */ e(_, {
-  leftIcon: pe,
-  className: n,
+  const [o, r, i] = A(!1);
+  return /* @__PURE__ */ n(
+    F,
+    {
+      onClickOutside: i,
+      arrow: !1,
+      visible: o,
+      disablePadding: !0,
+      content: e ? /* @__PURE__ */ n(g, { children: /* @__PURE__ */ n(G, { children: e(i) }) }) : void 0,
+      placement: "bottom-start",
+      children: /* @__PURE__ */ n(l, { display: "inline-block", children: /* @__PURE__ */ a(
+        s,
+        {
+          spacing: 0.5,
+          indent: !0,
+          alignItems: "center",
+          border: Fn,
+          borderRadius: "4px",
+          children: [
+            /* @__PURE__ */ n(Z, { ...t }),
+            /* @__PURE__ */ n(C, { num: 0.5 }),
+            /* @__PURE__ */ n(R, { size: "small", onClick: r, leftIcon: J })
+          ]
+        }
+      ) })
+    }
+  );
+}, jn = "_navBar_kzibd_1", Ln = {
+  navBar: jn
+}, Pn = ({
+  className: e,
   onClick: t
-}), Mn = ({
-  left: n,
+}) => /* @__PURE__ */ n(
+  R,
+  {
+    leftIcon: K,
+    className: e,
+    onClick: t
+  }
+), ze = ({
+  left: e,
   className: t,
-  showMenuButton: r = !1,
-  children: a,
-  right: l,
+  showMenuButton: o = !1,
+  children: r,
+  right: i,
   center: c,
-  onClickMenuButton: u
+  onClickMenuButton: d
 }) => {
-  const p = c ? 1 : void 0;
-  return /* @__PURE__ */ o(i, {
-    justifyContent: "space-between",
-    className: h(Ae.navBar, t),
-    children: [/* @__PURE__ */ o(i, {
-      flex: p,
-      justifyContent: "flex-start",
-      alignItems: "center",
-      children: [/* @__PURE__ */ o(i, {
-        width: "86px",
-        alignItems: "center",
-        children: [/* @__PURE__ */ e(x, {}), r && /* @__PURE__ */ e(ae, {
-          onClick: u
-        })]
-      }), n && /* @__PURE__ */ o(m, {
-        children: [n, /* @__PURE__ */ e(x, {
-          num: 2
-        })]
-      }), a && /* @__PURE__ */ e(m, {
-        children: /* @__PURE__ */ e(i, {
-          justifyContent: "center",
-          alignItems: "center",
-          children: ee.Children.map(a, (v, y) => /* @__PURE__ */ o(m, {
-            children: [y > 0 && /* @__PURE__ */ e(x, {}), v]
-          }))
-        })
-      })]
-    }), c && /* @__PURE__ */ e(i, {
-      justifyContent: "center",
-      alignItems: "center",
-      children: c
-    }), /* @__PURE__ */ o(i, {
-      justifyContent: "flex-end",
-      alignItems: "center",
-      flex: p,
-      children: [l, /* @__PURE__ */ e(x, {
-        num: 2
-      })]
-    })]
-  });
-}, He = "_navBarButton_18iz9_1", Pe = "_selected_18iz9_36", K = {
-  navBarButton: He,
-  selected: Pe
-}, ze = ({
-  selected: n,
+  const u = c ? 1 : void 0;
+  return /* @__PURE__ */ a(
+    s,
+    {
+      justifyContent: "space-between",
+      className: h(Ln.navBar, t),
+      children: [
+        /* @__PURE__ */ a(
+          s,
+          {
+            flex: u,
+            justifyContent: "flex-start",
+            alignItems: "center",
+            children: [
+              /* @__PURE__ */ a(s, { width: "86px", alignItems: "center", children: [
+                /* @__PURE__ */ n(C, {}),
+                o && /* @__PURE__ */ n(Pn, { onClick: d })
+              ] }),
+              e && /* @__PURE__ */ a(b, { children: [
+                e,
+                /* @__PURE__ */ n(C, { num: 2 })
+              ] }),
+              r && /* @__PURE__ */ n(b, { children: /* @__PURE__ */ n(s, { justifyContent: "center", alignItems: "center", children: Cn.Children.map(r, (p, m) => /* @__PURE__ */ a(b, { children: [
+                m > 0 && /* @__PURE__ */ n(C, {}),
+                p
+              ] })) }) })
+            ]
+          }
+        ),
+        c && /* @__PURE__ */ n(s, { justifyContent: "center", alignItems: "center", children: c }),
+        /* @__PURE__ */ a(s, { justifyContent: "flex-end", alignItems: "center", flex: u, children: [
+          i,
+          /* @__PURE__ */ n(C, { num: 2 })
+        ] })
+      ]
+    }
+  );
+}, zn = "_navBarButton_b3x3w_1", $n = "_selected_b3x3w_14", q = {
+  navBarButton: zn,
+  selected: $n
+}, An = ({
+  selected: e,
   className: t,
-  ...r
-}) => /* @__PURE__ */ e(_, {
-  ...r,
-  className: h(K.navBarButton, n && K.selected, t)
-}), Fn = (n) => /* @__PURE__ */ e(U, {
-  whiteSpace: "nowrap",
-  variant: "h4",
-  as: "h1",
-  ...n
-}), Rn = ({
-  content: n,
+  ...o
+}) => /* @__PURE__ */ n(
+  R,
+  {
+    ...o,
+    className: h(
+      q.navBarButton,
+      e && q.selected,
+      t
+    )
+  }
+), $e = (e) => /* @__PURE__ */ n(H, { whiteSpace: "nowrap", variant: "h4", as: "h1", ...e }), Ae = ({
+  content: e,
   children: t,
-  ...r
+  ...o
 }) => {
-  const [a, , l, c] = D(!1);
-  return /* @__PURE__ */ e(R, {
-    onClickOutside: l,
-    triggerTarget: document.body,
-    visible: a,
-    content: /* @__PURE__ */ o(m, {
-      children: [n && n({
-        close: l
-      }), t]
-    }),
-    children: /* @__PURE__ */ e(ze, {
-      ...r,
-      onClick: c
-    })
-  });
-}, Oe = "_navBarNotificationButton_8ej1j_1", Te = "_unread_8ej1j_54", Le = "_hasCount_8ej1j_68", $e = "_icon_8ej1j_69", De = "_shake_8ej1j_1", w = {
-  navBarNotificationButton: Oe,
-  unread: Te,
-  hasCount: Le,
-  icon: $e,
-  shake: De
-}, An = ({
-  count: n,
+  const [r, , i, c] = A(!1);
+  return /* @__PURE__ */ n(
+    F,
+    {
+      onClickOutside: i,
+      triggerTarget: document.body,
+      visible: r,
+      content: /* @__PURE__ */ a(b, { children: [
+        e && e({ close: i }),
+        t
+      ] }),
+      children: /* @__PURE__ */ n(An, { ...o, onClick: c })
+    }
+  );
+}, Hn = "_navBarNotificationButton_1wt3y_1", En = "_unread_1wt3y_23", Un = "_icon_1wt3y_23", Dn = "_shake_1wt3y_1", k = {
+  navBarNotificationButton: Hn,
+  unread: En,
+  icon: Un,
+  shake: Dn
+}, He = ({
+  count: e,
   unread: t = !1,
-  className: r,
-  labelClassName: a,
-  iconClassName: l,
-  icon: c = ge,
-  ...u
+  className: o,
+  labelClassName: r,
+  iconClassName: i,
+  icon: c = sn,
+  ...d
 }) => {
-  const p = n > 0;
-  return /* @__PURE__ */ e(_, {
-    ...u,
-    leftIcon: c,
-    className: h(t && w.unread, p && w.hasCount, w.navBarNotificationButton, r),
-    label: p ? String(n) : void 0,
-    labelClassName: h(a, w.label),
-    iconClassName: h(l, w.icon)
-  });
-}, Ue = "_navBarSearchFieldInput_rcj0j_1", Ve = "_navBarSearchField_rcj0j_1", Q = {
-  navBarSearchFieldInput: Ue,
-  navBarSearchField: Ve
-}, Hn = ({
-  placeholder: n = "Search...",
+  const u = e > 1;
+  return /* @__PURE__ */ n(
+    ln,
+    {
+      ...d,
+      leftIcon: c,
+      className: h(
+        k.navBarNotificationButton,
+        t && k.unread,
+        u && k.hasCount,
+        o
+      ),
+      label: u ? String(e) : void 0,
+      labelClassName: h(r, k.label),
+      iconClassName: h(i, k.icon)
+    }
+  );
+}, Tn = "_navBarSearchFieldInput_q4zl6_1", On = "_navBarSearchField_q4zl6_1", qn = "_withButton_q4zl6_25", Wn = "_clearButton_q4zl6_36", N = {
+  navBarSearchFieldInput: Tn,
+  navBarSearchField: On,
+  withButton: qn,
+  clearButton: Wn
+}, Ee = ({
+  placeholder: e = "Search",
   className: t,
-  wrapperClassName: r,
-  ...a
-}) => /* @__PURE__ */ e(je, {
-  wrapperClassName: h(Q.navBarSearchField, r),
-  className: h(Q.navBarSearchFieldInput, t),
-  placeholder: n,
-  contentRight: /* @__PURE__ */ e(V, {
-    children: /* @__PURE__ */ e(F, {
-      icon: me
-    })
-  }),
-  ...a
-}), We = "_navBarUserButton_1cwhm_1", qe = "_initials_1cwhm_31", X = {
-  navBarUserButton: We,
-  initials: qe
-}, Pn = ({
-  className: n,
-  username: t,
-  initials: r,
-  icon: a = fe,
-  iconClassName: l,
+  wrapperClassName: o,
+  showClearButton: r,
+  onClickClearButton: i,
   ...c
-}) => /* @__PURE__ */ e(Me, {
-  ...c,
-  className: h({
-    [X.initials]: r != null
-  }, X.navBarUserButton, n),
-  leftIcon: t != null ? a : void 0,
-  label: r != null ? r : t,
-  disableArrow: !0
-}), oe = ({
-  text: n,
+}) => /* @__PURE__ */ n(
+  Sn,
+  {
+    wrapperClassName: h(
+      N.navBarSearchField,
+      r ? N.withButton : void 0,
+      o
+    ),
+    className: h(N.navBarSearchFieldInput, t),
+    placeholder: e,
+    buttonRight: r ? /* @__PURE__ */ n(
+      dn,
+      {
+        className: N.clearButton,
+        icon: un,
+        variant: "error",
+        onClick: i
+      }
+    ) : void 0,
+    ...c
+  }
+), Gn = "_navBarUserButton_10f9z_1", Jn = {
+  navBarUserButton: Gn
+}, Ue = ({
+  className: e,
+  username: t,
+  initials: o,
+  icon: r = hn,
+  iconClassName: i,
+  responsiveIconOnly: c = o == null,
+  ...d
+}) => /* @__PURE__ */ n(
+  Rn,
+  {
+    ...d,
+    className: h(Jn.navBarUserButton, e),
+    leftIcon: t != null ? r : void 0,
+    label: o != null ? o : t,
+    forceRound: o != null,
+    responsiveIconOnly: c,
+    disableArrow: !0
+  }
+), Kn = "_unreadDot_l8bni_1", Qn = "_dot_l8bni_4", W = {
+  unreadDot: Kn,
+  dot: Qn
+}, Vn = ({ children: e }) => /* @__PURE__ */ a("div", { className: W.unreadDot, children: [
+  e,
+  /* @__PURE__ */ n("div", { className: W.dot })
+] }), nn = ({
+  text: e,
   timestamp: t,
-  icon: r,
-  iconAriaLabel: a,
-  iconColor: l,
-  contentLeft: c,
-  contentRight: u,
-  onClose: p
-}) => /* @__PURE__ */ o(i, {
-  alignItems: "flex-start",
-  indent: !0,
-  spacing: !0,
-  children: [/* @__PURE__ */ o(i, {
-    indent: 2,
-    spacing: !0,
-    gap: 2,
-    flex: 1,
-    alignItems: "flex-start",
-    children: [c && /* @__PURE__ */ e(d, {
-      minHeight: 20,
-      justifyContent: "center",
-      children: c
-    }), !c && r && /* @__PURE__ */ e(F, {
-      icon: r,
-      size: 20,
-      color: l,
-      "aria-label": a
-    }), /* @__PURE__ */ o(d, {
-      minHeight: 20,
-      justifyContent: "center",
-      flex: 1,
-      gap: 0.5,
-      children: [/* @__PURE__ */ e(J, {
-        variant: "bold",
-        children: n
-      }), t && /* @__PURE__ */ e(J, {
-        size: "small",
-        color: f("--lhds-color-ui-600"),
-        children: t
-      })]
-    }), u]
-  }), p && /* @__PURE__ */ e(d, {
-    flex: "none",
-    justifyContent: "center",
-    style: {
-      height: "calc(20px + 2 * var(--swui-metrics-spacing))"
-    },
-    children: /* @__PURE__ */ e(_, {
-      leftIcon: Z,
-      onClick: p,
-      "aria-label": "Close"
-    })
-  })]
-}), zn = ({
-  children: n,
-  ...t
-}) => /* @__PURE__ */ o(S, {
-  background: "var(--lhds-color-ui-50)",
-  borderRadius: "var(--swui-border-radius)",
-  children: [/* @__PURE__ */ e(oe, {
-    ...t
-  }), n && /* @__PURE__ */ o(S, {
-    indent: 3,
-    children: [n, /* @__PURE__ */ e(b, {
-      num: 2
-    })]
-  })]
-}), Ge = "_clickable_1ijxc_1", Je = "_nonClickable_1ijxc_27", O = {
-  clickable: Ge,
-  nonClickable: Je
-}, On = ({
-  onClick: n,
+  icon: o,
+  iconAriaLabel: r,
+  contentLeft: i,
+  contentRight: c,
+  onClose: d,
+  unread: u = !1,
+  variant: p
+}) => {
+  const m = o ? /* @__PURE__ */ n(
+    Q,
+    {
+      size: "small",
+      icon: o,
+      "aria-label": r,
+      backgroundColor: Xn(u, p)
+    }
+  ) : void 0;
+  return /* @__PURE__ */ a(s, { alignItems: "flex-start", indent: 2, spacing: !0, children: [
+    /* @__PURE__ */ a(s, { spacing: !0, gap: 2, flex: 1, alignItems: "flex-start", children: [
+      i && /* @__PURE__ */ n(l, { minHeight: 20, justifyContent: "center", children: i }),
+      !i && m && (u ? /* @__PURE__ */ n(Vn, { children: m }) : m),
+      /* @__PURE__ */ a(l, { minHeight: 20, justifyContent: "center", flex: 1, gap: 0.5, children: [
+        /* @__PURE__ */ n(v, { variant: "bold", children: e }),
+        t && /* @__PURE__ */ n(
+          v,
+          {
+            size: "small",
+            color: f(
+              u ? "--lhds-color-blue-600" : "--lhds-color-ui-600"
+            ),
+            children: t
+          }
+        )
+      ] }),
+      c
+    ] }),
+    d && /* @__PURE__ */ n(
+      l,
+      {
+        flex: "none",
+        justifyContent: "center",
+        height: "calc(20px + 2 * var(--swui-metrics-spacing))",
+        children: /* @__PURE__ */ n(V, { onClick: d })
+      }
+    )
+  ] });
+}, Xn = (e, t) => {
+  if (!(!e && t === "standard"))
+    return "--lhds-color-ui-50";
+}, Yn = "_notification_1hao0_1", Zn = "_body_1hao0_7", ne = "_standard_1hao0_13", ee = "_unread_1hao0_14", te = "_danger_1hao0_19", M = {
+  notification: Yn,
+  body: Zn,
+  standard: ne,
+  unread: ee,
+  danger: te
+}, De = ({
+  variant: e = "standard",
+  children: t,
+  unread: o,
+  ...r
+}) => /* @__PURE__ */ a(
+  "div",
+  {
+    className: h(
+      M.notification,
+      M[e],
+      o && M.unread
+    ),
+    children: [
+      /* @__PURE__ */ n(nn, { ...r, unread: o, variant: e }),
+      t && /* @__PURE__ */ n(g, { className: M.body, children: t })
+    ]
+  }
+), oe = "_notificationList_1rkvu_1", re = {
+  notificationList: oe
+}, Te = ({
+  children: e
+}) => /* @__PURE__ */ a("div", { className: re.notificationList, children: [
+  e,
+  /* @__PURE__ */ n("div", {})
+] }), ae = "_clickable_1ijxc_1", ie = "_nonClickable_1ijxc_27", L = {
+  clickable: ae,
+  nonClickable: ie
+}, Oe = ({
+  onClick: e,
   onClickAriaLabel: t,
-  children: r,
-  width: a = 264,
-  maxWidth: l,
+  children: o,
+  width: r = 264,
+  maxWidth: i,
   ...c
-}) => /* @__PURE__ */ o(d, {
-  borderRadius: 8,
-  background: f("--lhds-color-ui-50"),
-  shadow: "popover",
-  width: a,
-  maxWidth: l,
-  role: "alert",
-  position: "relative",
-  children: [/* @__PURE__ */ e(d, {
-    className: h({
-      [O.nonClickable]: n
-    }),
-    children: /* @__PURE__ */ e(oe, {
-      ...c
-    })
-  }), r && /* @__PURE__ */ o(d, {
-    indent: 3,
-    className: h({
-      [O.nonClickable]: n
-    }),
-    children: [r, /* @__PURE__ */ e(b, {
-      num: 2
-    })]
-  }), n && /* @__PURE__ */ e("button", {
-    onClick: n,
-    className: O.clickable,
-    "aria-label": t
-  })]
-}), Ke = "_collapsible_1nroa_1", Qe = "_header_1nroa_46", Xe = "_indicator_1nroa_59", Ye = "_headerText_1nroa_103", Ze = "_label_1nroa_114", en = "_contentLeft_1nroa_123", nn = "_contentRight_1nroa_124", tn = "_content_1nroa_123", rn = "_groupHeading_1nroa_155", an = "_contentEnter_1nroa_180", on = "_contentEnterActive_1nroa_184", ln = "_contentExitDone_1nroa_189", s = {
-  collapsible: Ke,
-  header: Qe,
-  indicator: Xe,
-  headerText: Ye,
-  label: Ze,
-  contentLeft: en,
-  contentRight: nn,
-  content: tn,
-  groupHeading: rn,
-  contentEnter: an,
-  contentEnterActive: on,
-  contentExitDone: ln
-}, q = () => /* @__PURE__ */ o(S, {
-  indent: !0,
-  spacing: !0,
-  flex: 1,
-  alignItems: "center",
-  children: [/* @__PURE__ */ e(F, {
-    icon: be,
-    color: f("--lhds-color-ui-500")
-  }), /* @__PURE__ */ e(b, {}), /* @__PURE__ */ e(B, {
-    size: "small",
-    color: f("--lhds-color-ui-500"),
-    children: "No content"
-  })]
-}), le = ({
-  contentLeft: n,
-  contentRight: t,
-  className: r,
-  children: a,
-  ...l
-}) => /* @__PURE__ */ o("div", {
-  className: h(s.content, r),
-  ...l,
-  children: [n && /* @__PURE__ */ e("div", {
-    className: s.contentLeft,
-    children: n
-  }), a != null ? a : /* @__PURE__ */ e(q, {}), t && /* @__PURE__ */ e("div", {
-    className: s.contentRight,
-    children: t
-  })]
-}), cn = (n) => {
-  const t = parseFloat(n), r = n.match(/m?s/);
-  switch (r == null ? void 0 : r[0]) {
-    case "s":
-      return t * 1e3;
-    case "ms":
-      return t;
-    default:
-      return 0;
+}) => /* @__PURE__ */ a(
+  l,
+  {
+    borderRadius: 8,
+    background: f("--lhds-color-ui-50"),
+    shadow: "popover",
+    width: r,
+    maxWidth: i,
+    role: "alert",
+    position: "relative",
+    children: [
+      /* @__PURE__ */ n(l, { className: h({ [L.nonClickable]: e }), children: /* @__PURE__ */ n(nn, { ...c }) }),
+      o && /* @__PURE__ */ a(l, { indent: 3, className: h({ [L.nonClickable]: e }), children: [
+        o,
+        /* @__PURE__ */ n(_, { num: 2 })
+      ] }),
+      e && /* @__PURE__ */ n(
+        "button",
+        {
+          onClick: e,
+          className: L.clickable,
+          "aria-label": t
+        }
+      )
+    ]
   }
-}, sn = we(function({
-  label: t,
-  contentLeft: r,
-  contentRight: a,
-  collapsed: l = !1,
-  onClick: c,
-  className: u,
-  disabled: p = !1,
-  unmountOnCollapse: v = !1,
-  mountOnEnter: y = !0,
-  icon: A = ve,
-  iconCollapsed: j = $,
-  iconSize: E = 16,
-  children: g,
-  autoFocus: H = !1,
-  ...k
-}, P) {
-  const N = ee.useRef(null), z = N.current ? cn(getComputedStyle(N.current).getPropertyValue("--swui-collapsible-animation-time")) : void 0;
-  return /* @__PURE__ */ o("div", {
-    className: h(s.collapsible, u),
-    "aria-expanded": !l,
-    ref: N,
-    ...k,
-    children: [/* @__PURE__ */ o(V, {
-      disableFocusHighlight: !0,
-      disableOpacityOnClick: !0,
-      className: s.header,
-      onClick: c,
-      disabled: p,
-      autoFocus: H,
-      ref: P,
-      children: [r && /* @__PURE__ */ e("div", {
-        className: s.contentLeft,
-        children: r
-      }), /* @__PURE__ */ e("div", {
-        className: s.label,
-        children: /* @__PURE__ */ e(B, {
-          color: "var(--swui-collapsible-header-text-color)",
-          className: s.headerText,
-          children: t
-        })
-      }), a && /* @__PURE__ */ e("div", {
-        className: s.contentRight,
-        children: a
-      }), /* @__PURE__ */ e(F, {
-        icon: l ? j : A,
-        className: s.indicator,
-        size: E,
-        fixedWidth: !0
-      })]
-    }), /* @__PURE__ */ e(Ee, {
-      in: !l,
-      timeout: {
-        enter: z
-      },
-      classNames: {
-        enter: s.contentEnter,
-        enterActive: s.contentEnterActive,
-        exit: s.contentExit,
-        exitActive: s.contentExitActive,
-        exitDone: s.contentExitDone
-      },
-      mountOnEnter: y,
-      unmountOnExit: v,
-      children: /* @__PURE__ */ e("div", {
-        role: "region",
-        children: g != null ? g : /* @__PURE__ */ e(le, {
-          children: /* @__PURE__ */ e(q, {})
-        })
-      })
-    })]
-  });
-}), Tn = ({
-  value: n,
+), ce = () => /* @__PURE__ */ a(g, { indent: !0, spacing: !0, flex: 1, alignItems: "center", children: [
+  /* @__PURE__ */ n(pn, { icon: gn, color: f("--lhds-color-ui-500") }),
+  /* @__PURE__ */ n(_, {}),
+  /* @__PURE__ */ n(v, { size: "small", color: f("--lhds-color-ui-500"), children: "No content" })
+] }), le = kn(
+  function({
+    label: t,
+    contentLeft: o,
+    contentRight: r,
+    collapsed: i = !1,
+    onClick: c,
+    disabled: d = !1,
+    children: u,
+    autoFocus: p = !1,
+    ...m
+  }, j) {
+    return /* @__PURE__ */ n(
+      z,
+      {
+        ...m,
+        autoFocus: p,
+        ref: j,
+        label: t,
+        onClick: c,
+        disabled: d,
+        expandable: !0,
+        expanded: !i,
+        selected: !i,
+        left: o,
+        right: r,
+        children: u != null ? u : /* @__PURE__ */ n(ce, {})
+      }
+    );
+  }
+), qe = ({
+  children: e
+}) => /* @__PURE__ */ n(g, { gap: 1, children: e }), We = ({
+  value: e,
   onValueChange: t,
-  onChange: r,
-  indeterminate: a,
-  checkboxDisabled: l,
-  ...c
-}) => /* @__PURE__ */ e(sn, {
-  contentLeft: /* @__PURE__ */ e(re, {
-    value: n,
-    indeterminate: a,
-    onValueChange: t,
-    onChange: r,
-    disabled: l,
-    onClick: (u) => u.stopPropagation()
-  }),
-  ...c
-}), Ln = ({
-  contentLeft: n,
-  contentRight: t,
-  className: r,
-  onClick: a,
-  children: l,
+  onChange: o,
+  indeterminate: r,
+  checkboxDisabled: i,
   ...c
-}) => /* @__PURE__ */ o(V, {
-  disableFocusHighlight: !0,
-  disableOpacityOnClick: !0,
-  className: h(s.content, r),
-  onClick: a,
-  ...c,
-  children: [n && /* @__PURE__ */ e("div", {
-    className: s.contentLeft,
-    children: n
-  }), l != null ? l : /* @__PURE__ */ e(q, {}), t && /* @__PURE__ */ e("div", {
-    className: s.contentRight,
-    children: t
-  })]
-}), $n = ({
-  className: n,
-  ...t
-}) => /* @__PURE__ */ e(le, {
-  className: h(s.groupHeading, n),
-  ...t
-}), dn = ({
-  text: n = "Something unexpected happened."
-}) => /* @__PURE__ */ e(d, {
-  justifyContent: "center",
-  alignItems: "center",
-  children: /* @__PURE__ */ e(_e, {
-    variant: "error",
-    headerText: n
-  })
-}), Dn = (n) => /* @__PURE__ */ e(d, {
-  width: "100%",
-  height: "100%",
-  justifyContent: "center",
-  alignItems: "center",
-  children: /* @__PURE__ */ e(dn, {
-    ...n
-  })
-}), un = ({
-  text: n = "Loading..."
-}) => /* @__PURE__ */ o(d, {
-  alignItems: "center",
-  children: [/* @__PURE__ */ e(Ce, {
-    size: "small"
-  }), /* @__PURE__ */ e(b, {
-    num: 4
-  }), /* @__PURE__ */ e(U, {
-    variant: "h4",
-    children: n
-  })]
-}), Un = (n) => /* @__PURE__ */ e(d, {
-  width: "100%",
-  height: "100%",
-  justifyContent: "center",
-  alignItems: "center",
-  children: /* @__PURE__ */ e(un, {
-    ...n
-  })
-}), Vn = ({
-  renderBreadCrumbs: n,
+}) => /* @__PURE__ */ n(
+  le,
+  {
+    contentLeft: /* @__PURE__ */ n(
+      Z,
+      {
+        value: e,
+        indeterminate: r,
+        onValueChange: t,
+        onChange: o,
+        disabled: i,
+        onClick: (d) => d.stopPropagation()
+      }
+    ),
+    ...c
+  }
+), Ge = ({ children: e }) => /* @__PURE__ */ n(l, { spacing: !0, indent: !0, children: /* @__PURE__ */ n(v, { variant: "overline", size: "smaller", children: e }) }), se = ({
+  text: e = "Something unexpected happened."
+}) => /* @__PURE__ */ n(l, { justifyContent: "center", alignItems: "center", children: /* @__PURE__ */ n(fn, { variant: "error", headerText: e }) }), Je = (e) => /* @__PURE__ */ n(
+  l,
+  {
+    width: "100%",
+    height: "100%",
+    justifyContent: "center",
+    alignItems: "center",
+    children: /* @__PURE__ */ n(se, { ...e })
+  }
+), de = ({
+  text: e = "Loading..."
+}) => /* @__PURE__ */ a(l, { alignItems: "center", children: [
+  /* @__PURE__ */ n(mn, { size: "small" }),
+  /* @__PURE__ */ n(_, { num: 4 }),
+  /* @__PURE__ */ n(H, { variant: "h4", children: e })
+] }), Ke = (e) => /* @__PURE__ */ n(
+  l,
+  {
+    width: "100%",
+    height: "100%",
+    justifyContent: "center",
+    alignItems: "center",
+    children: /* @__PURE__ */ n(de, { ...e })
+  }
+), Qe = ({
+  renderBreadCrumbs: e,
   renderPageHeading: t,
-  renderTabs: r,
-  children: a
-}) => /* @__PURE__ */ o(d, {
-  shadow: "box",
-  background: f("--lhds-color-ui-50"),
-  gap: 2,
-  children: [/* @__PURE__ */ o(d, {
-    indent: 3,
-    children: [n && /* @__PURE__ */ o(i, {
-      spacing: 1,
-      alignItems: "center",
-      children: [/* @__PURE__ */ e(i, {
-        width: "64px",
-        height: "16px"
-      }), n()]
-    }), t == null ? void 0 : t(), r == null ? void 0 : r()]
-  }), a && /* @__PURE__ */ o(m, {
-    children: [!r && n && /* @__PURE__ */ e(b, {}), /* @__PURE__ */ e(ne, {}), a]
-  })]
-}), Wn = (n) => /* @__PURE__ */ e(i, {
-  indent: 3,
-  spacing: !0,
-  ...n
-}), qn = ({
-  icon: n,
+  renderTabs: o,
+  children: r
+}) => /* @__PURE__ */ a(l, { shadow: "bottom", background: f("--lhds-color-ui-50"), gap: 2, children: [
+  /* @__PURE__ */ a(l, { indent: 3, children: [
+    e && /* @__PURE__ */ a(s, { spacing: 1, alignItems: "center", children: [
+      /* @__PURE__ */ n(s, { width: "64px", height: "16px" }),
+      e()
+    ] }),
+    t == null ? void 0 : t(),
+    o && /* @__PURE__ */ n(_, {}),
+    o == null ? void 0 : o()
+  ] }),
+  r
+] }), Ve = (e) => /* @__PURE__ */ n(s, { indent: 3, spacing: !0, ...e }), Xe = ({
+  icon: e,
   heading: t,
-  headingLevel: r = "h2",
-  contentLeft: a,
-  contentRight: l
-}) => /* @__PURE__ */ o(i, {
-  alignItems: "center",
-  gap: 2,
-  height: "64px",
-  children: [/* @__PURE__ */ o(i, {
-    alignItems: "center",
-    children: [/* @__PURE__ */ e(i, {
-      width: "64px",
+  headingLevel: o = "h2",
+  contentLeft: r,
+  contentRight: i
+}) => /* @__PURE__ */ a(s, { alignItems: "center", gap: 2, height: "64px", children: [
+  /* @__PURE__ */ a(s, { alignItems: "center", children: [
+    /* @__PURE__ */ n(s, { width: "64px", alignItems: "center", children: e && /* @__PURE__ */ n(Q, { icon: e }) }),
+    /* @__PURE__ */ n(H, { variant: "h3", as: o, children: t })
+  ] }),
+  /* @__PURE__ */ n(s, { alignItems: "center", children: r }),
+  /* @__PURE__ */ n(s, { style: { marginLeft: "auto" }, alignItems: "center", children: i })
+] }), ue = "_sidebarMenu_1bx5w_1", he = "_sidebarItems_1bx5w_38", pe = "_scrollContainer_1bx5w_48", P = {
+  sidebarMenu: ue,
+  sidebarItems: he,
+  scrollContainer: pe
+}, ge = "_stenaFlag_108h7_1", fe = {
+  stenaFlag: ge
+}, me = ({ onClick: e }) => /* @__PURE__ */ a(g, { background: f("--lhds-color-ui-50"), children: [
+  /* @__PURE__ */ n(_, {}),
+  /* @__PURE__ */ a(
+    s,
+    {
+      justifyContent: "space-between",
       alignItems: "center",
-      children: n && /* @__PURE__ */ e(xe, {
-        icon: n
-      })
-    }), /* @__PURE__ */ e(U, {
-      variant: "h3",
-      as: r,
-      children: t
-    })]
-  }), /* @__PURE__ */ e(i, {
-    alignItems: "center",
-    children: a
-  }), /* @__PURE__ */ e(i, {
-    style: {
-      marginLeft: "auto"
-    },
-    alignItems: "center",
-    children: l
-  })]
-}), hn = "_sidebarMenu_tg9i7_1", T = {
-  sidebarMenu: hn
-}, pn = "_stenaFlag_108h7_1", gn = {
-  stenaFlag: pn
-}, mn = ({
-  onClick: n
-}) => /* @__PURE__ */ o(i, {
-  justifyContent: "space-between",
-  alignItems: "center",
-  flex: 1,
-  indent: 1,
-  minHeight: "48px",
-  children: [/* @__PURE__ */ e(_, {
-    leftIcon: Z,
-    onClick: n,
-    variant: "danger"
-  }), /* @__PURE__ */ e(Be, {
-    className: gn.stenaFlag
-  })]
-}), fn = ({
-  className: n,
+      flex: 1,
+      indent: 1,
+      minHeight: "48px",
+      children: [
+        /* @__PURE__ */ n(V, { onClick: e }),
+        /* @__PURE__ */ n(bn, { className: fe.stenaFlag })
+      ]
+    }
+  )
+] }), be = ({
+  isPinned: e,
+  onClick: t,
+  label: o
+}) => {
+  const r = e ? "Unpin menu" : "Pin menu", i = o != null ? o : r;
+  return /* @__PURE__ */ n(z, { onClick: t, label: i, leftIcon: e ? X : vn });
+}, Ye = ({
+  className: e,
   children: t,
-  onCloseClick: r,
-  collapsed: a = !1,
-  variant: l = "standard",
-  ...c
-}) => /* @__PURE__ */ o(d, {
-  indent: 1,
-  className: h(T.sidebarMenu, a ? T.collapsed : null, n),
-  style: {
-    ["--swui-sidebar-menu-item-height"]: "40px"
-  },
-  "data-collapsed": a || void 0,
-  ...c,
-  children: [/* @__PURE__ */ e(b, {
-    num: 1
-  }), /* @__PURE__ */ e(mn, {
-    onClick: r
-  }), /* @__PURE__ */ e(d, {
-    className: T.sidebarMenuContent,
-    height: "100%",
-    background: "var(--current-background-color)",
-    children: /* @__PURE__ */ e(S, {
+  onCloseClick: o,
+  variant: r = "standard",
+  pinButtonVisible: i,
+  onClickPinButton: c,
+  bottomItems: d,
+  isPinned: u,
+  ...p
+}) => /* @__PURE__ */ a(l, { ...p, className: h(P.sidebarMenu, e), children: [
+  /* @__PURE__ */ n(me, { onClick: o }),
+  /* @__PURE__ */ n(l, { className: P.scrollContainer, children: /* @__PURE__ */ a(
+    g,
+    {
+      className: P.sidebarItems,
+      justifyContent: "space-between",
       flex: 1,
       gap: 1,
-      children: t
-    })
-  })]
-}), Gn = ({
-  variant: n,
-  onClickMenuButton: t,
-  children: r
-}) => /* @__PURE__ */ o(fn, {
-  collapsed: !0,
-  position: "fixed",
-  left: 0,
-  top: 0,
-  variant: n,
-  children: [/* @__PURE__ */ e(ae, {
-    onClick: t
-  }), r]
-}), L = (n) => /* @__PURE__ */ e(ye, {
-  ...n
-}), ce = ({
-  label: n
-}) => /* @__PURE__ */ o(d, {
-  height: "32px",
-  justifyContent: "center",
-  indent: 1,
-  children: [/* @__PURE__ */ e(b, {}), /* @__PURE__ */ e(B, {
-    variant: "overline",
-    size: "smaller",
-    children: n
-  })]
-}), ie = (n) => /* @__PURE__ */ e(ne, {
-  color: f("--lhds-color-ui-400"),
-  ...n
-}), bn = ({
-  children: n,
-  label: t,
-  leftIcon: r,
-  className: a,
-  initialExpand: l = !1
-}) => {
-  const [c, u] = Se(l);
-  return /* @__PURE__ */ e(ke, {
-    label: t,
-    onClick: () => u(!c),
-    leftIcon: r,
-    className: a,
-    expandable: !0,
-    expanded: c,
-    selected: c,
-    children: n
-  });
-}, se = (n) => n.map((t, r) => {
-  switch (t.type) {
-    case "heading":
-      return /* @__PURE__ */ e(ce, {
-        label: t.label
-      }, r);
-    case "separator":
-      return /* @__PURE__ */ e(ie, {}, r);
-    case "link": {
-      const {
-        type: a,
-        ...l
-      } = t;
-      return /* @__PURE__ */ e(L, {
-        ...l
-      }, r);
+      indent: 1,
+      children: [
+        /* @__PURE__ */ n(g, { gap: 1, children: t }),
+        (d || i) && /* @__PURE__ */ a(g, { gap: 1, children: [
+          d,
+          i && /* @__PURE__ */ n(
+            be,
+            {
+              isPinned: u,
+              onClick: c
+            }
+          ),
+          /* @__PURE__ */ n(_, {})
+        ] })
+      ]
     }
-    case "grouped":
-      return /* @__PURE__ */ e(bn, {
-        leftIcon: t.leftIcon,
-        label: t.label,
-        initialExpand: !0,
-        children: se(t.items)
-      }, r);
-    default:
-      return te(t);
+  ) })
+] }), S = wn(!1), U = () => In(S), ve = ({
+  label: e,
+  ...t
+}) => /* @__PURE__ */ n(Y, { label: e, placement: "right", appendTo: document.body, children: /* @__PURE__ */ n($, { ...t }) }), Ze = ({
+  closeButtonVisible: e,
+  onClickCloseButton: t,
+  onClickMenuButton: o,
+  children: r,
+  bottomItems: i,
+  closeButtonTitle: c = "Unpin menu"
+}) => /* @__PURE__ */ a(
+  l,
+  {
+    position: "fixed",
+    left: 0,
+    top: 0,
+    bottom: 0,
+    indent: 0.5,
+    spacing: 1,
+    gap: 1,
+    shadow: "popover",
+    background: f("--lhds-color-ui-50"),
+    children: [
+      /* @__PURE__ */ n($, { onClick: o, icon: K }),
+      /* @__PURE__ */ a(g, { justifyContent: "space-between", flex: 1, gap: 1, children: [
+        /* @__PURE__ */ n(g, { gap: 1, children: /* @__PURE__ */ n(S.Provider, { value: !0, children: r }) }),
+        /* @__PURE__ */ n(g, { gap: 1, children: (i || e) && /* @__PURE__ */ a(S.Provider, { value: !0, children: [
+          i,
+          e && /* @__PURE__ */ n(
+            ve,
+            {
+              icon: X,
+              label: c,
+              onClick: t
+            }
+          )
+        ] }) })
+      ] })
+    ]
   }
-}), Jn = (n, {
-  popupMinWidth: t
-}) => n.map((r, a) => {
-  switch (r.type) {
-    case "heading":
-      return null;
-    case "separator":
-      return /* @__PURE__ */ e(ie, {}, a);
-    case "link": {
-      const {
-        type: l,
-        label: c,
-        ...u
-      } = r;
-      return /* @__PURE__ */ e(L, {
-        title: c,
-        label: c,
-        ...u
-      }, a);
+), _e = ({
+  label: e
+}) => U() ? null : /* @__PURE__ */ a(l, { height: "32px", justifyContent: "center", indent: 1, children: [
+  /* @__PURE__ */ n(_, {}),
+  /* @__PURE__ */ n(v, { variant: "overline", size: "smaller", children: e })
+] }), Be = ({
+  label: e,
+  leftIcon: t,
+  ...o
+}) => t == null ? null : /* @__PURE__ */ n(Y, { label: e, placement: "right", appendTo: document.body, children: /* @__PURE__ */ n(_n, { icon: t, ...o }) }), nt = (e) => U() ? /* @__PURE__ */ n(Be, { ...e }) : /* @__PURE__ */ n(Bn, { ...e }), Ce = ({
+  children: e,
+  label: t,
+  icon: o,
+  popupMinWidth: r = "200px"
+}) => /* @__PURE__ */ n(
+  F,
+  {
+    appendTo: "parent",
+    arrow: !1,
+    offset: [0, 0],
+    placement: "right-start",
+    trigger: "focusin mouseenter click",
+    disablePadding: !0,
+    lazy: !0,
+    content: /* @__PURE__ */ n(
+      l,
+      {
+        minWidth: r,
+        shadow: "popover",
+        spacing: 1,
+        indent: 1,
+        gap: 2,
+        children: /* @__PURE__ */ a(S.Provider, { value: !1, children: [
+          /* @__PURE__ */ n(_e, { label: t }),
+          e
+        ] })
+      }
+    ),
+    children: /* @__PURE__ */ n($, { icon: o })
+  }
+), et = ({
+  children: e,
+  label: t,
+  leftIcon: o,
+  className: r,
+  initialExpand: i = !1
+}) => {
+  const [c, d] = Nn(i);
+  return U() ? o == null ? null : /* @__PURE__ */ n(Ce, { label: t, icon: o, children: e }) : /* @__PURE__ */ n(
+    z,
+    {
+      label: t,
+      onClick: () => d(!c),
+      leftIcon: o,
+      className: r,
+      expandable: !0,
+      expanded: c,
+      selected: c,
+      children: e
     }
-    case "grouped":
-      return /* @__PURE__ */ e("div", {
-        children: /* @__PURE__ */ e(R, {
-          appendTo: "parent",
-          arrow: !1,
-          offset: [0, 0],
-          placement: "right-start",
-          trigger: "focusin mouseenter click",
-          disablePadding: !0,
-          lazy: !0,
-          content: /* @__PURE__ */ o(d, {
-            minWidth: t,
-            background: "var(--lhds-color-blue-500)",
-            children: [/* @__PURE__ */ e(ce, {
-              label: r.label
-            }), se(r.items)]
-          }),
-          children: /* @__PURE__ */ e(L, {
-            title: r.label,
-            label: r.label,
-            leftIcon: r.leftIcon
-          })
-        })
-      }, a);
-    default:
-      return te(r);
+  );
+}, tt = (e) => /* @__PURE__ */ n(
+  Mn,
+  {
+    color: f("--lhds-color-ui-400"),
+    ...e
   }
-}), vn = `1px solid ${f("--lhds-color-orange-400")}`, Kn = ({
-  numItemsSelected: n,
+), xe = `1px solid ${f("--lhds-color-orange-400")}`, ot = ({
+  numItemsSelected: e,
   label: t,
-  afterLabelContent: r,
-  rightContent: a
-}) => /* @__PURE__ */ o(i, {
-  indent: 3,
-  spacing: !0,
-  minHeight: "56px",
-  justifyContent: "space-between",
-  alignItems: "center",
-  borderTop: vn,
-  background: f("--lhds-color-orange-50"),
-  children: [/* @__PURE__ */ o(i, {
+  afterLabelContent: o,
+  rightContent: r
+}) => /* @__PURE__ */ a(
+  s,
+  {
+    indent: 3,
+    spacing: !0,
+    minHeight: "56px",
+    justifyContent: "space-between",
     alignItems: "center",
-    children: [n != null || t != null ? /* @__PURE__ */ e(m, {
-      children: n != null ? /* @__PURE__ */ o(m, {
-        children: [/* @__PURE__ */ e(B, {
-          variant: "bold",
-          children: n
-        }), /* @__PURE__ */ e(b, {}), /* @__PURE__ */ o(B, {
-          children: ["item", n === 1 ? "" : "s", " selected"]
-        })]
-      }) : t != null ? /* @__PURE__ */ e(m, {
-        children: typeof t == "string" ? /* @__PURE__ */ e(B, {
-          children: t
-        }) : t
-      }) : null
-    }) : null, r ? /* @__PURE__ */ o(m, {
-      children: [/* @__PURE__ */ e(x, {}), /* @__PURE__ */ e(d, {
-        children: r
-      })]
-    }) : null]
-  }), /* @__PURE__ */ e(d, {
-    children: a
-  })]
-});
+    borderTop: xe,
+    background: f("--lhds-color-orange-50"),
+    children: [
+      /* @__PURE__ */ a(s, { alignItems: "center", children: [
+        e != null || t != null ? /* @__PURE__ */ n(b, { children: e != null ? /* @__PURE__ */ a(b, { children: [
+          /* @__PURE__ */ n(v, { variant: "bold", children: e }),
+          /* @__PURE__ */ n(_, {}),
+          /* @__PURE__ */ a(v, { children: [
+            "item",
+            e === 1 ? "" : "s",
+            " selected"
+          ] })
+        ] }) : t != null ? /* @__PURE__ */ n(b, { children: typeof t == "string" ? /* @__PURE__ */ n(v, { children: t }) : t }) : null }) : null,
+        o ? /* @__PURE__ */ a(b, { children: [
+          /* @__PURE__ */ n(C, {}),
+          /* @__PURE__ */ n(l, { children: o })
+        ] }) : null
+      ] }),
+      /* @__PURE__ */ n(l, { children: r })
+    ]
+  }
+);
 export {
-  Me as ActionMenuFlatButton,
-  Sn as ActionMenuPrimaryButton,
-  jn as ActionMenuSecondaryButton,
-  En as CheckboxMenu,
-  sn as Collapsible,
-  Ln as CollapsibleClickableContent,
-  le as CollapsibleContent,
-  q as CollapsibleEmptyContent,
-  $n as CollapsibleGroupHeading,
-  Tn as CollapsibleWithCheckbox,
-  dn as ErrorPanel,
-  Dn as ErrorScreen,
-  un as LoadingPanel,
-  Un as LoadingScreen,
-  Mn as NavBar,
-  ze as NavBarButton,
-  Fn as NavBarHeading,
-  An as NavBarNotificationButton,
-  Rn as NavBarPopoverButton,
-  Hn as NavBarSearchField,
-  Pn as NavBarUserButton,
-  zn as Notification,
-  Vn as PageHeader,
-  Wn as PageHeaderRow,
-  qn as PageHeading,
-  Kn as SelectedItemsActionsPanel,
-  fn as SidebarMenu,
-  bn as SidebarMenuCollapsible,
-  ce as SidebarMenuHeading,
-  L as SidebarMenuLink,
-  ie as SidebarMenuSeparator,
-  Gn as SidebarRailMenu,
-  On as Toast,
-  cn as mapCSSTime,
-  se as renderItemsExpanded,
-  Jn as renderItemsInRail
+  Rn as ActionMenuFlatButton,
+  je as ActionMenuPrimaryButton,
+  Le as ActionMenuSecondaryButton,
+  Pe as CheckboxMenu,
+  le as Collapsible,
+  ce as CollapsibleEmptyContent,
+  Ge as CollapsibleGroupHeading,
+  qe as CollapsibleList,
+  We as CollapsibleWithCheckbox,
+  se as ErrorPanel,
+  Je as ErrorScreen,
+  de as LoadingPanel,
+  Ke as LoadingScreen,
+  ze as NavBar,
+  An as NavBarButton,
+  $e as NavBarHeading,
+  He as NavBarNotificationButton,
+  Ae as NavBarPopoverButton,
+  Ee as NavBarSearchField,
+  Ue as NavBarUserButton,
+  De as Notification,
+  nn as NotificationHeader,
+  Te as NotificationList,
+  Qe as PageHeader,
+  Ve as PageHeaderRow,
+  Xe as PageHeading,
+  ot as SelectedItemsActionsPanel,
+  Ye as SidebarMenu,
+  et as SidebarMenuCollapsible,
+  _e as SidebarMenuHeading,
+  nt as SidebarMenuLink,
+  tt as SidebarMenuSeparator,
+  Ze as SidebarRailMenu,
+  Oe as Toast,
+  Vn as UnreadDot,
+  Xn as getIconBgColor
 };
 //# sourceMappingURL=index.es.js.map