@getflip/swirl-components-react 0.442.0 → 0.444.0

package/dist/swirl-app-layout_5.entry.70d0f2f1.js

@@ -0,0 +1,489 @@
+import { r as d, c as l, h as e, H as c, g as u, F as h } from "./index.f37c64b2.js";
+import { c as b } from "./index-orsBiyT_.fc4357c3.js";
+import { D as k } from "./media-query.service-BSiuFyfW.201120cc.js";
+import { d as y, i as g, t as v } from "./utils-Dn2SWlGn.dbe5b17a.js";
+import { S as D } from "./sortable.esm-CMrz6687.dac971cd.js";
+import { v as x } from "./v4-DD3477fe.2624487e.js";
+import "react";
+import "react-dom";
+const A = `:host{--header-height:3.5625rem;position:relative;z-index:1;display:flex;width:100%;height:100%}:host *{box-sizing:border-box}.app-layout{display:flex;overflow:hidden;width:100%;height:100%;margin-right:auto;margin-left:auto}.app-layout__grid{position:relative;display:grid;width:100%;height:100%;grid-template-columns:100%;grid-template-rows:var(--header-height) 1fr;grid-template-areas:"body"
+    "body"}.app-layout:not(.app-layout--has-navigation) .app-layout__header,.app-layout:not(.app-layout--has-navigation) .app-layout__navigation{display:none}.app-layout:not(.app-layout--has-sidebar) .app-layout__sidebar{display:none}@media (max-width: 767px){.app-layout:not(.app-layout--mobile-view-body) .app-layout__body{display:none}}@media (max-width: 767px){.app-layout:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar{display:none}}.app-layout:not(.app-layout--has-app-bar-mobile-menu-button) .app-layout__app-bar-mobile-menu-button{display:none}.app-layout--has-navigation .app-layout__grid{grid-template-columns:100%;grid-template-areas:"header"
+      "navigation"}@media (min-width: 768px){.app-layout--has-navigation .app-layout__grid{grid-template-columns:min(50%, 22.5rem) 1fr;grid-template-areas:"header body"
+        "navigation body"}}@media (min-width: 1440px){.app-layout--has-navigation .app-layout__grid{grid-template-columns:min(50%, 25rem) 1fr}}@media (min-width: 768px){.app-layout--has-navigation .app-layout__app-bar-mobile-menu-button{display:none}}@media (min-width: 992px){.app-layout--has-navigation.app-layout--nav-collapsible.app-layout--nav-collapsed .app-layout__grid{grid-template-columns:0 1fr}.app-layout--has-navigation.app-layout--nav-collapsible.app-layout--nav-overlayed .app-layout__grid{grid-template-columns:0 1fr}.app-layout--has-navigation.app-layout--nav-collapsible.app-layout--nav-overlayed .app-layout__header,.app-layout--has-navigation.app-layout--nav-collapsible.app-layout--nav-overlayed .app-layout__navigation{position:absolute;z-index:4;top:0;left:0;width:22.5rem;animation:app-layout-nav-overlay-slide-in-desktop 0.1s;animation-fill-mode:forwards}.app-layout--has-navigation.app-layout--nav-collapsible.app-layout--nav-overlayed .app-layout__header:after{position:absolute;z-index:1;top:0;left:calc(100% + var(--s-border-width-default));display:block;width:2rem;height:100vh;background-image:linear-gradient(
+              to right,
+              rgba(0, 0, 0, 0.05) 0,
+              rgba(0, 0, 0, 0) 80%,
+              rgba(0, 0, 0, 0) 100%
+            );content:""}.app-layout--has-navigation.app-layout--nav-collapsible.app-layout--nav-overlayed .app-layout__navigation{z-index:3;bottom:0}}@media (min-width: 1440px){.app-layout--has-navigation.app-layout--nav-collapsible.app-layout--nav-overlayed .app-layout__header,.app-layout--has-navigation.app-layout--nav-collapsible.app-layout--nav-overlayed .app-layout__navigation{width:25rem;animation:app-layout-nav-overlay-slide-in-large-desktop 0.1s}}@media (min-width: 768px){.app-layout--has-sidebar:not(.app-layout--has-navigation):not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-opening .app-layout__grid{animation:app-layout-no-nav-sidebar-slide-in 0.3s}@media (prefers-reduced-motion){.app-layout--has-sidebar:not(.app-layout--has-navigation):not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-opening .app-layout__grid{animation:none}}}@media (min-width: 768px){.app-layout--has-sidebar:not(.app-layout--has-navigation):not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-closing .app-layout__grid{animation:app-layout-no-nav-sidebar-slide-out 0.3s}@media (prefers-reduced-motion){.app-layout--has-sidebar:not(.app-layout--has-navigation):not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-closing .app-layout__grid{animation:none}}}@media (min-width: 768px){.app-layout--has-sidebar.app-layout--sidebar-active .app-layout__grid,.app-layout--has-sidebar.app-layout--sidebar-opening .app-layout__grid{grid-template-columns:1fr min(50%, 25rem);grid-template-areas:"body sidebar"
+          "body sidebar"}}.app-layout--has-sidebar .app-layout__grid{grid-template-columns:100%;grid-template-areas:"body"
+      "body"}@media (min-width: 1800px){.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay) .app-layout__sidebar{position:static;width:25rem;z-index:auto;box-shadow:none;animation:none}}@media (min-width: 1800px){.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-opening .app-layout__grid,.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-active .app-layout__grid{grid-template-columns:25rem 1fr 25rem;grid-template-areas:"header body sidebar"
+          "navigation body sidebar"}}@media (min-width: 1800px){.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-opening .app-layout__grid{animation:app-layout-sidebar-slide-in 0.3s;animation-fill-mode:forwards}@media (prefers-reduced-motion){.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-opening .app-layout__grid{animation:none}}.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-opening.app-layout--nav-collapsed .app-layout__grid,.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-opening.app-layout--nav-overlayed .app-layout__grid{animation:app-layout-sidebar-slide-in-with-collapsed-nav 0.3s}}@media (min-width: 1800px){.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-closing .app-layout__grid{animation:app-layout-sidebar-slide-out 0.3s}@media (prefers-reduced-motion){.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-closing .app-layout__grid{animation:none}}.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-closing.app-layout--nav-collapsed .app-layout__grid,.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-closing.app-layout--nav-overlayed .app-layout__grid{animation:app-layout-sidebar-slide-out-with-collapsed-nav 0.3s}}@media (min-width: 768px){.app-layout--has-navigation.app-layout--has-sidebar .app-layout__grid{grid-template-columns:min(50%, 22.5rem) 1fr;grid-template-areas:"header body"
+        "navigation body"}}@media (min-width: 992px){.app-layout--has-navigation.app-layout--has-sidebar .app-layout__grid{grid-template-columns:22.5rem 1fr}}@media (min-width: 1440px){.app-layout--has-navigation.app-layout--has-sidebar .app-layout__grid{grid-template-columns:25rem 1fr}}@media (min-width: 992px){.app-layout--has-navigation.app-layout--has-sidebar.app-layout--nav-collapsible.app-layout--nav-collapsed .app-layout__grid{grid-template-columns:0 1fr}.app-layout--has-navigation.app-layout--has-sidebar.app-layout--nav-collapsible.app-layout--nav-overlayed .app-layout__grid{grid-template-columns:0 1fr}}@media (min-width: 768px){.app-layout--has-navigation.app-layout--has-sidebar .app-layout__sidebar{position:absolute;top:0;right:0;bottom:0;width:min(40%, 25rem);z-index:3}.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--rounded-corners){border-left:var(--s-border-width-default) solid var(--s-border-default);box-shadow:var(--s-shadow-level-3)}}@media (max-width: 767px){.app-layout--mobile-view-navigation .app-layout__grid{grid-template-areas:"header"
+        "navigation"}.app-layout--mobile-view-navigation .app-layout__body,.app-layout--mobile-view-navigation .app-layout__sidebar{display:none}}@media (max-width: 767px){.app-layout--mobile-view-body .app-layout__grid{grid-template-areas:"body"
+        "body"}.app-layout--mobile-view-body .app-layout__header,.app-layout--mobile-view-body .app-layout__navigation,.app-layout--mobile-view-body .app-layout__sidebar{display:none}}@media (max-width: 767px){.app-layout--mobile-view-sidebar .app-layout__grid{grid-template-areas:"sidebar"
+        "sidebar"}.app-layout--mobile-view-sidebar .app-layout__header,.app-layout--mobile-view-sidebar .app-layout__navigation,.app-layout--mobile-view-sidebar .app-layout__body{display:none}}.app-layout--has-sidebar:not(.app-layout--sidebar-active):not(.app-layout--sidebar-opening) .app-layout__sidebar{display:none}@media (min-width: 768px){.app-layout--sidebar-closing .app-layout__sidebar{animation:app-layout-sidebar-overlay-slide-out 0.3s}@media (prefers-reduced-motion){.app-layout--sidebar-closing .app-layout__sidebar{animation:none}}}@media (min-width: 1800px){.app-layout--sidebar-closing:not(.app-layout--sidebar-positioning-overlay) .app-layout__sidebar{animation:none}}.app-layout--has-app-bar-controls .app-layout__app-bar-controls{display:block}.app-layout--has-bottom-bar .app-layout__body{grid-template-rows:minmax(var(--header-height), auto) auto 1fr auto;grid-template-areas:"app-bar"
+      "banner"
+      "content"
+      "bottom-bar"}.app-layout--has-bottom-bar .app-layout__content{border-bottom:var(--s-border-width-default) solid transparent}.app-layout--has-bottom-bar .app-layout__bottom-bar{display:block}.app-layout--has-custom-app-bar-back-button .app-layout__custom-app-bar-back-button{display:block}.app-layout--has-custom-sidebar-header .app-layout__sidebar-header{display:none}.app-layout--has-custom-sidebar-header .app-layout__custom-sidebar-header{display:block}.app-layout--has-floating-action-button .app-layout__floating-action-button{display:block}.app-layout--hide-app-bar .app-layout__body{grid-template-rows:auto 1fr;grid-template-areas:"banner"
+      "content"
+      "bottom-bar"}.app-layout--content-scrollable:not(.app-layout--content-scrolled-to-top) .app-layout__app-bar{border-bottom-color:var(--s-border-default)}.app-layout--content-scrollable.app-layout--has-bottom-bar:not(.app-layout--content-scrolled-to-bottom) .app-layout__content{border-bottom-color:var(--s-border-default)}.app-layout--nav-scrollable:not(.app-layout--nav-scrolled-to-top) .app-layout__header{border-bottom-color:var(--s-border-default)}.app-layout--sidebar-scrollable:not(.app-layout--sidebar-scrolled-to-top) .app-layout__sidebar-header,.app-layout--sidebar-scrollable:not(.app-layout--sidebar-scrolled-to-top) .app-layout__custom-sidebar-header{border-bottom-color:var(--s-border-default)}.app-layout__header{z-index:1;display:flex;min-width:0;height:var(--header-height);padding-top:var(--s-space-12);padding-right:var(--s-space-8);padding-bottom:var(--s-space-12);padding-left:var(--s-space-8);align-items:center;border-bottom:var(--s-border-width-default) solid transparent;background-color:var(--s-background-default);grid-area:header;gap:var(--s-space-8)}@media (min-width: 768px){.app-layout__header{border-right:var(--s-border-width-default) solid var(--s-border-default)}}@media (min-width: 992px){.app-layout__header{padding-right:var(--s-space-16);padding-left:var(--s-space-16)}}.app-layout__app-name{min-width:0}.app-layout__app-name .heading{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.app-layout__app-bar-mobile-menu-button,.app-layout__navigation-mobile-menu-button{flex-shrink:0}@media (min-width: 992px){.app-layout__app-bar-mobile-menu-button,.app-layout__navigation-mobile-menu-button{display:none}}.app-layout__app-bar-mobile-menu-button{padding-left:var(--s-space-8)}.app-layout__navigation-back-button{margin-left:calc(-1 * var(--s-space-4))}.app-layout__floating-action-button{position:absolute;z-index:4;right:var(--s-space-16);bottom:var(--s-space-16);display:none}.app-layout__navigation-controls{flex-shrink:0}.app-layout__navigation{overflow-y:auto;border-right:var(--s-border-width-default) solid var(--s-border-default);background-color:var(--s-background-default);grid-area:navigation}.app-layout__nav-overlay-toggle,.app-layout__nav-expansion-toggle{display:none}@media (min-width: 992px){.app-layout__nav-overlay-toggle,.app-layout__nav-expansion-toggle{display:block}}.app-layout__nav-expansion-toggle{padding-left:var(--s-space-16)}.app-layout__body{z-index:2;display:grid;width:100%;height:100%;grid-area:body;grid-template-rows:minmax(var(--header-height), auto) auto 1fr;grid-template-areas:"app-bar"
+    "banner"
+    "content";background-color:var(--s-background-default)}.app-layout__app-bar{--swirl-tab-bar-border-width:0;--swirl-tab-bar-height:3.5rem;display:flex;min-width:0;align-items:center;border-bottom:var(--s-border-width-default) solid transparent;grid-area:app-bar;gap:var(--s-space-8)}.app-layout__bottom-bar{display:none;min-width:0;align-items:center;grid-area:bottom-bar}.app-layout__back-to-navigation-button{padding-left:var(--s-space-8)}@media (min-width: 768px){.app-layout__back-to-navigation-button{display:none}}.app-layout__banner{grid-area:banner}.app-layout__app-bar-content{min-width:0;flex-grow:1}.app-layout__custom-app-bar-back-button{display:none;padding-left:var(--s-space-8)}.app-layout__app-bar-controls{display:none;padding-right:var(--s-space-8)}@media (min-width: 768px){.app-layout__app-bar-controls{padding-right:var(--s-space-16)}}.app-layout__content{overflow:auto;grid-area:content}.app-layout__sidebar{display:grid;width:100%;height:100%;border-left:var(--s-border-width-default) solid var(--s-border-default);grid-area:sidebar;grid-template-rows:var(--header-height) 1fr;grid-template-areas:"sidebar-header"
+    "sidebar-content";background-color:var(--s-background-default)}@media (min-width: 768px){.app-layout__sidebar{animation:app-layout-slide-in 0.3s}@media (prefers-reduced-motion){.app-layout__sidebar{animation:none}}}.app-layout__custom-sidebar-header{display:none;min-width:0;border-bottom:var(--s-border-width-default) solid transparent;grid-area:sidebar-header}.app-layout__sidebar-header{display:flex;min-width:0;padding-top:var(--s-space-12);padding-right:var(--s-space-8);padding-bottom:var(--s-space-12);padding-left:var(--s-space-8);align-items:center;border-bottom:var(--s-border-width-default) solid transparent;grid-area:sidebar-header;gap:var(--s-space-8)}@media (min-width: 768px){.app-layout__sidebar-header{padding-right:var(--s-space-16);padding-left:var(--s-space-16)}}.app-layout__sidebar-heading{min-width:0;flex-grow:1}.app-layout__sidebar-heading .heading{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.app-layout__sidebar-close-button{margin-left:calc(-1 * var(--s-space-4))}.app-layout__sidebar-content{overflow-y:auto;grid-area:sidebar-content}@media (min-width: 768px){.app-layout--rounded-corners .app-layout__grid{-moz-column-gap:var(--s-space-8);column-gap:var(--s-space-8)}.app-layout--rounded-corners .app-layout__header{border-right:none;border-radius:var(--s-border-radius-l) var(--s-border-radius-l) 0 0}.app-layout--rounded-corners .app-layout__navigation{border-right:none;border-radius:0 0 var(--s-border-radius-l) var(--s-border-radius-l)}.app-layout--rounded-corners .app-layout__body,.app-layout--rounded-corners .app-layout__sidebar{border-radius:var(--s-border-radius-l);overflow:hidden}.app-layout--rounded-corners .app-layout__sidebar{border-left:none;box-shadow:-12px 0 32px -10px rgba(23, 23, 23, 0.12), -8px 4px 12px -8px rgba(23, 23, 23, 0.08)}}@media (min-width: 768px){.app-layout--sidebar-positioning-overlay:not(.app-layout--has-navigation).app-layout--has-sidebar.app-layout--sidebar-active .app-layout__grid,.app-layout--sidebar-positioning-overlay:not(.app-layout--has-navigation).app-layout--has-sidebar.app-layout--sidebar-opening .app-layout__grid{grid-template-columns:100%;grid-template-areas:"body"
+          "body"}}@media (min-width: 768px){.app-layout--sidebar-positioning-overlay:not(.app-layout--has-navigation).app-layout--has-sidebar .app-layout__sidebar{position:absolute;top:0;right:0;bottom:0;width:min(50%, 25rem);z-index:3;border-left:var(--s-border-width-default) solid var(--s-border-default);box-shadow:var(--s-shadow-level-3)}}@keyframes app-layout-nav-overlay-slide-in-desktop{from{width:0}to{width:22.5rem}}@keyframes app-layout-nav-overlay-slide-in-large-desktop{from{width:0}to{width:25rem}}@media (max-width: 767px){.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__grid,.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__grid{grid-template-columns:100%;grid-template-areas:"header"
+          "navigation"}.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__body,.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{position:absolute;top:0;left:0;display:grid;width:100%;transform:translate3d(100%, 0, 0)}}@media (max-width: 767px){.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__header{display:flex}.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__navigation{display:block}}@media (max-width: 991px){.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__grid,.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__grid{grid-template-columns:100%;grid-template-areas:"body"
+          "body"}.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar,.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{position:absolute;top:0;left:0;display:grid;border-left:var(--s-border-width-default) solid var(--s-border-default)}}@media (max-width: 991px){.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__body{display:grid}.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{display:grid}}@media (max-width: 767px){.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__header,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__navigation,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__header,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__navigation{animation:app-layout-slide-out 0.4s}@media (prefers-reduced-motion){.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__header,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__navigation,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__header,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__navigation{animation:none}}.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__body,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{animation:app-layout-slide-in 0.4s}@media (prefers-reduced-motion){.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__body,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{animation:none}}.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__body:after,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body:after{position:absolute;top:0;right:100%;bottom:0;display:block;width:100%;background-color:rgba(0, 0, 0, 0.3);content:"";animation:app-layout-fade-in 0.4s}@media (prefers-reduced-motion){.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__body:after,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body:after{animation:none}}}@media (max-width: 767px){.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__header{animation-direction:reverse}.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__navigation{animation-direction:reverse}.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{animation-direction:reverse}.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body:after{animation-direction:reverse}}@media (max-width: 991px){.app-layout--transition-style-slides.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__body,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__body{animation:app-layout-slide-out 0.4s}@media (prefers-reduced-motion){.app-layout--transition-style-slides.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__body,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__body{animation:none}}.app-layout--transition-style-slides.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{animation:app-layout-slide-in 0.4s}@media (prefers-reduced-motion){.app-layout--transition-style-slides.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{animation:none}}.app-layout--transition-style-slides.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar:after,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar:after{position:absolute;top:0;right:100%;bottom:0;display:block;width:100%;background-color:rgba(0, 0, 0, 0.3);content:"";animation:app-layout-fade-in 0.4s}@media (prefers-reduced-motion){.app-layout--transition-style-slides.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar:after,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar:after{animation:none}}}@media (max-width: 991px){.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__body{animation-direction:reverse}.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{animation-direction:reverse}.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar:after{animation-direction:reverse}}@media (max-width: 767px){.app-layout--transition-style-dialog.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__body,.app-layout--transition-style-dialog.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{animation:app-layout-scale-in 0.3s}@media (prefers-reduced-motion){.app-layout--transition-style-dialog.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__body,.app-layout--transition-style-dialog.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{animation:none}}}@media (max-width: 767px){.app-layout--transition-style-dialog.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__header{animation-direction:reverse}.app-layout--transition-style-dialog.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__navigation{animation-direction:reverse}.app-layout--transition-style-dialog.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{animation-direction:reverse}}@media (max-width: 991px){.app-layout--transition-style-dialog.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar,.app-layout--transition-style-dialog.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{animation:app-layout-scale-in 0.3s}@media (prefers-reduced-motion){.app-layout--transition-style-dialog.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar,.app-layout--transition-style-dialog.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{animation:none}}}@media (max-width: 991px){.app-layout--transition-style-dialog.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__body{animation-direction:reverse}.app-layout--transition-style-dialog.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{animation-direction:reverse}}@keyframes app-layout-sidebar-overlay-slide-out{0%{transform:translate3d(0, 0, 0)}100%{transform:translate3d(100%, 0, 0)}}@keyframes app-layout-slide-in{0%{transform:translate3d(100%, 0, 0)}100%{transform:translate3d(0, 0, 0)}}@keyframes app-layout-slide-out{0%{transform:translate3d(0, 0, 0)}100%{transform:translate3d(-20%, 0, 0)}}@keyframes app-layout-fade-in{0%{opacity:0}100%{opacity:1}}@keyframes app-layout-scale-in{from{transform:scale(0);box-shadow:0 0 0 100rem rgba(0, 0, 0, 0)}to{transform:scale(1);box-shadow:0 0 0 100rem rgba(0, 0, 0, 0.25)}}@keyframes app-layout-sidebar-slide-in{from{overflow:hidden;grid-template-columns:25rem 1fr 0}to{overflow:hidden;grid-template-columns:25rem 1fr 25rem}}@keyframes app-layout-sidebar-slide-in-with-collapsed-nav{from{overflow:hidden;grid-template-columns:0 1fr 0}to{overflow:hidden;grid-template-columns:0 1fr 25rem}}@keyframes app-layout-sidebar-slide-out{from{overflow:hidden;grid-template-columns:25rem 1fr 25rem}to{overflow:hidden;grid-template-columns:25rem 1fr 0}}@keyframes app-layout-sidebar-slide-out-with-collapsed-nav{from{overflow:hidden;grid-template-columns:0 1fr 25rem}to{overflow:hidden;grid-template-columns:0 1fr 0}}@keyframes app-layout-no-nav-sidebar-slide-in{from{overflow:hidden;grid-template-columns:1fr 0}to{overflow:hidden;grid-template-columns:1fr 25rem}}@keyframes app-layout-no-nav-sidebar-slide-out{from{overflow:hidden;grid-template-columns:1fr 25rem}to{overflow:hidden;grid-template-columns:1fr 0}}`, L = "SWIRL_APP_LAYOUT_NAV_EXPANSION_STATE", N = class {
+  constructor(a) {
+    d(this, a), this.ctaClick = l(this, "ctaClick", 7), this.mobileViewChange = l(this, "mobileViewChange", 7), this.navigationBackButtonClick = l(this, "navigationBackButtonClick", 7), this.navigationExpansionStateChange = l(this, "navigationExpansionStateChange", 7), this.sidebarToggle = l(this, "sidebarToggle", 7), this.backToNavigationViewButtonLabel = "Back to navigation", this.navigationBackButtonLabel = "Go back", this.navigationExpansionStateStorageKey = L, this.navigationToggleLabel = "Toggle navigation", this.navigationOverlayLabel = "Show navigation", this.sidebarPositioning = "auto", this.sidebarCloseButtonLabel = "Close sidebar", this.transitionStyle = "slides", this.contentScrollState = {
+      scrollable: !1,
+      scrolledToTop: !1,
+      scrolledToBottom: !1
+    }, this.mobileView = "navigation", this.navScrollState = {
+      scrollable: !1,
+      scrolledToTop: !1
+    }, this.navExpansionState = "expanded", this.sidebarScrollState = {
+      scrollable: !1,
+      scrolledToTop: !1
+    }, this.mediaQueryUnsubscribe = () => {
+    }, this.onBackToNavigationViewButtonClick = () => {
+      this.changeMobileView("navigation");
+    }, this.onCtaClick = (t) => {
+      this.ctaClick.emit(t);
+    }, this.onNavigationBackButtonClick = (t) => {
+      this.navigationBackButtonClick.emit(t);
+    }, this.onSidebarCloseButtonClick = () => {
+      this.hideSidebar();
+    }, this.onContentScroll = y(() => {
+      this.updateContentScrollState();
+    }, 16), this.onNavScroll = y(() => {
+      this.updateNavScrollState();
+    }, 16), this.onSidebarScroll = y(() => {
+      this.updateSidebarScrollState();
+    }, 16), this.toggleNavigation = () => {
+      if (!this.collapsibleNavigation)
+        return;
+      const t = this.navExpansionState === "expanded" ? "collapsed" : "expanded";
+      this.setCollapsibleNavigationState(t);
+    }, this.overlayNavigation = (t) => {
+      t.stopPropagation(), this.setCollapsibleNavigationState("overlayed");
+    };
+  }
+  componentWillLoad() {
+    this.initialMobileView && (this.mobileView = this.initialMobileView), this.mutationObserver = new MutationObserver(() => {
+      this.updateCustomAppBarBackButtonStatus(), this.updateNavigationStatus(), this.updateSidebarStatus();
+    }), this.mutationObserver.observe(this.el, { childList: !0 }), queueMicrotask(() => {
+      this.updateCustomAppBarBackButtonStatus(), this.updateSidebarStatus(), this.updateNavigationStatus(), this.checkMobileView();
+    });
+  }
+  componentDidLoad() {
+    this.mediaQueryUnsubscribe = k.subscribe((a) => {
+      this.isDesktop = a;
+    }), queueMicrotask(() => {
+      this.restoreNavExpansionState(), this.updateContentScrollState(), this.updateSidebarScrollState(), this.updateNavScrollState();
+    });
+  }
+  disconnectedCallback() {
+    var a;
+    this.mediaQueryUnsubscribe(), (a = this.mutationObserver) == null || a.disconnect();
+  }
+  onDocumentClick(a) {
+    if (!this.collapsibleNavigation || this.navExpansionState !== "overlayed")
+      return;
+    a.composedPath().includes(this.navEl) || a.composedPath().includes(this.headerEl) || this.setCollapsibleNavigationState("collapsed");
+  }
+  onKeyDown(a) {
+    a.key === "Escape" && this.navExpansionState === "overlayed" && this.setCollapsibleNavigationState("collapsed");
+  }
+  watchMobileView() {
+    this.checkMobileView();
+  }
+  async showSidebar() {
+    if (this.sidebarActive || !this.hasSidebar)
+      return;
+    Boolean(this.sidebarOpeningTimeout) && clearTimeout(this.sidebarOpeningTimeout), this.sidebarOpening = !0;
+    const a = g() || v() ? 0 : 300;
+    this.sidebarOpeningTimeout = setTimeout(() => {
+      this.sidebarActive = !0, this.sidebarOpening = !1, this.changeMobileView("sidebar"), this.sidebarToggle.emit(!0);
+    }, a);
+  }
+  async hideSidebar() {
+    if (!this.sidebarActive || !this.hasSidebar)
+      return;
+    Boolean(this.sidebarClosingTimeout) && clearTimeout(this.sidebarClosingTimeout), this.sidebarClosing = !0;
+    const a = g() || v() ? 0 : 300 - 10;
+    this.sidebarClosingTimeout = setTimeout(() => {
+      this.sidebarActive = !1, this.sidebarClosing = !1, this.changeMobileView("body"), this.sidebarToggle.emit(!1);
+    }, a);
+  }
+  async toggleSidebar() {
+    !this.hasSidebar || (this.sidebarActive ? this.hideSidebar() : this.showSidebar());
+  }
+  async getCollapsibleNavigationState() {
+    return this.navExpansionState;
+  }
+  async setCollapsibleNavigationState(a) {
+    !this.collapsibleNavigation || (this.navExpansionState = a, this.navigationExpansionStateChange.emit(this.navExpansionState), localStorage.setItem(this.navigationExpansionStateStorageKey, this.navExpansionState));
+  }
+  async changeMobileView(a, t = !0) {
+    if (this.mobileView === a || a === "navigation" && !this.hasNavigation || a === "sidebar" && !this.hasSidebar)
+      return;
+    if (!g() || !t) {
+      this.mobileView = a, this.mobileViewChange.emit(this.mobileView);
+      return;
+    }
+    Boolean(this.transitionTimeout) && clearTimeout(this.transitionTimeout), this.transitioningFrom = this.mobileView, this.transitioningTo = a;
+    const r = v() ? 0 : this.transitionStyle === "slides" ? 400 : this.transitionStyle === "dialog" ? 300 : 0;
+    this.transitionTimeout = setTimeout(() => {
+      this.mobileView = a, this.transitioningFrom = void 0, this.transitioningTo = void 0, this.mobileViewChange.emit(this.mobileView);
+    }, r);
+  }
+  checkMobileView() {
+    if (this.mobileView === "navigation" && !this.hasNavigation || this.mobileView === "sidebar" && !this.hasSidebar) {
+      this.mobileView = "body";
+      return;
+    }
+    const a = this.mobileView === "sidebar" || this.sidebarActive;
+    a !== this.sidebarActive && (a ? this.showSidebar() : this.hideSidebar());
+  }
+  updateNavigationStatus() {
+    this.hasNavigation = Boolean(this.el.querySelector('[slot="navigation"]'));
+  }
+  updateCustomAppBarBackButtonStatus() {
+    this.hasCustomAppBarBackButton = Boolean(this.el.querySelector('[slot="custom-app-bar-back-button"]'));
+  }
+  updateSidebarStatus() {
+    this.hasSidebar = Boolean(this.el.querySelector('[slot="sidebar"]'));
+  }
+  updateContentScrollState() {
+    const a = {
+      scrollable: this.contentEl.scrollHeight > this.contentEl.clientHeight,
+      scrolledToTop: this.contentEl.scrollTop === 0,
+      scrolledToBottom: Math.round(this.contentEl.scrollTop + this.contentEl.clientHeight) >= this.contentEl.scrollHeight
+    };
+    Object.keys(a).some((t) => a[t] !== this.contentScrollState[t]) && (this.contentScrollState = a);
+  }
+  updateNavScrollState() {
+    const a = {
+      scrollable: this.navEl.scrollHeight > this.navEl.clientHeight,
+      scrolledToTop: this.navEl.scrollTop === 0
+    };
+    Object.keys(a).some((t) => a[t] !== this.navScrollState[t]) && (this.navScrollState = a);
+  }
+  updateSidebarScrollState() {
+    const a = {
+      scrollable: this.sidebarEl.scrollHeight > this.sidebarEl.clientHeight,
+      scrolledToTop: this.sidebarEl.scrollTop === 0
+    };
+    Object.keys(a).some((t) => a[t] !== this.sidebarScrollState[t]) && (this.sidebarScrollState = a);
+  }
+  restoreNavExpansionState() {
+    if (!this.collapsibleNavigation)
+      return;
+    const a = localStorage.getItem(this.navigationExpansionStateStorageKey);
+    Boolean(a) && this.setCollapsibleNavigationState(a);
+  }
+  render() {
+    const a = (this.mobileView === "body" || this.transitioningTo) && this.hasNavigation && !this.hasCustomAppBarBackButton, t = Boolean(this.el.querySelector('[slot="app-bar-controls"]')), i = Boolean(this.el.querySelector('[slot="bottom-bar"]')), o = Boolean(this.el.querySelector('[slot="app-bar-mobile-menu-button"]')), r = Boolean(this.el.querySelector('[slot="custom-sidebar-header"]')), n = Boolean(this.el.querySelector('[slot="floating-action-button"]')) || Boolean(this.ctaLabel), p = this.hasNavigation && (!this.collapsibleNavigation || this.navExpansionState !== "collapsed" || !this.isDesktop), m = b("app-layout", `app-layout--mobile-view-${this.mobileView}`, `app-layout--nav-${this.isDesktop ? this.navExpansionState : "expanded"}`, `app-layout--transitioning-from-${this.transitioningFrom}`, `app-layout--transitioning-to-${this.transitioningTo}`, `app-layout--transition-style-${this.transitionStyle}`, `app-layout--sidebar-positioning-${this.sidebarPositioning}`, {
+      "app-layout--content-scrollable": this.contentScrollState.scrollable,
+      "app-layout--content-scrolled-to-top": this.contentScrollState.scrolledToTop,
+      "app-layout--content-scrolled-to-bottom": this.contentScrollState.scrolledToBottom,
+      "app-layout--has-app-bar-mobile-menu-button": o,
+      "app-layout--has-app-bar-controls": t,
+      "app-layout--has-bottom-bar": i,
+      "app-layout--has-custom-app-bar-back-button": this.hasCustomAppBarBackButton,
+      "app-layout--has-custom-sidebar-header": r,
+      "app-layout--has-floating-action-button": n,
+      "app-layout--has-navigation": this.hasNavigation,
+      "app-layout--has-sidebar": this.hasSidebar,
+      "app-layout--hide-app-bar": this.hideAppBar,
+      "app-layout--nav-collapsible": this.collapsibleNavigation && this.isDesktop,
+      "app-layout--nav-scrollable": this.navScrollState.scrollable,
+      "app-layout--nav-scrolled-to-top": this.navScrollState.scrolledToTop,
+      "app-layout--rounded-corners": this.roundedCorners,
+      "app-layout--sidebar-active": this.mobileView === "sidebar" || this.sidebarActive,
+      "app-layout--sidebar-closing": this.sidebarClosing,
+      "app-layout--sidebar-opening": this.sidebarOpening,
+      "app-layout--sidebar-scrollable": this.sidebarScrollState.scrollable,
+      "app-layout--sidebar-scrolled-to-top": this.sidebarScrollState.scrolledToTop
+    });
+    return e(c, { key: "df8a5acd24320b865a9c4cf032bf2fb703ed3386" }, e("section", { key: "e7016cf44a4cfa485b08019f41c01c2005f9dfef", "aria-labelledby": "app-name", class: m }, e("div", { key: "13b615d04a0378b81bc9053dc7b65e80366f1852", class: "app-layout__grid" }, e("header", { key: "24ab8601f721a963a7f731c47a9000cadb496453", class: "app-layout__header", ref: (s) => this.headerEl = s }, e("span", { key: "8370880b409c548483eb737fe135ca1de0cbca62", class: "app-layout__navigation-mobile-menu-button" }, e("slot", { key: "a0dce39b41e162e153142bb40e1fbafd70bdc8d9", name: "navigation-mobile-menu-button" })), this.collapsibleNavigation && e("span", { key: "5da184e76a533f8621d06d8f0e6707de9712ffd3", class: "app-layout__nav-overlay-toggle" }, e("swirl-button", { key: "d99c208b7a0904f0829381fbe9711951675e2305", hideLabel: !0, icon: this.navExpansionState !== "expanded" ? "<swirl-icon-dock-left-expand></swirl-icon-dock-left-expand>" : "<swirl-icon-dock-left-collapse></swirl-icon-dock-left-collapse>", label: this.navigationToggleLabel, onClick: this.toggleNavigation })), this.showNavigationBackButton && e("span", { key: "f317b07b3c7680772a43c7e882dabdf88110a69f", class: "app-layout__navigation-back-button" }, e("swirl-button", { key: "fc7dde4d4b6401f007e2f798b39f4f4fb7144fe0", hideLabel: !0, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.navigationBackButtonLabel, onClick: this.onNavigationBackButtonClick })), e("swirl-heading", { key: "235f3529e5a479a0803985f6ed5ad8b960aeed26", as: "h1", class: "app-layout__app-name", headingId: "app-name", level: 3, text: this.appName }), p && e("span", { key: "ae1cca0ddc466f7ffb910d64cdcf1b81cb56ccdb", class: "app-layout__navigation-controls" }, e("slot", { key: "cdb33bb61253985cef2adb2800dba9c817759a76", name: "navigation-controls" }))), e("nav", { key: "8afc88add61d69ff5015f3e0cef1b9fd923df7c8", "aria-label": this.navigationLabel, class: "app-layout__navigation", onScroll: this.onNavScroll, ref: (s) => this.navEl = s, inert: this.isDesktop && this.collapsibleNavigation && this.navExpansionState === "collapsed" }, e("slot", { key: "45c7901638de02975cef711f76144c01ce569d28", name: "navigation" })), e("section", { key: "5a4be5e6f097151ab095d4580e7cd77d3fc0261e", "aria-labelledby": "app-name", class: "app-layout__body" }, !this.hideAppBar && e("header", { key: "56fb7311e24e1d556034c23a7cd69a53a55644cf", class: "app-layout__app-bar" }, e("span", { key: "dbd7ebbe69ff5c2a951f256d5ea64b3507e346d6", class: "app-layout__app-bar-mobile-menu-button" }, e("slot", { key: "e0ae20e33b99ade5e06abe18dfdcf1187bf97d1f", name: "app-bar-mobile-menu-button" })), a && e("span", { key: "908cb69f87ba63753d52edca57b248e1001e84b2", class: "app-layout__back-to-navigation-button" }, e("swirl-button", { key: "740f2d35bbe48bbe5c6f0019089beeda1d90d60e", hideLabel: !0, icon: this.transitionStyle === "dialog" ? "<swirl-icon-close></swirl-icon-close>" : "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.backToNavigationViewButtonLabel, onClick: this.onBackToNavigationViewButtonClick })), this.collapsibleNavigation && this.navExpansionState !== "expanded" && e("span", { key: "b0df382fabdb5760d873bc9fa4b7be5f2c46c90d", class: "app-layout__nav-expansion-toggle" }, e("swirl-button", { key: "969148a7a8e88f44f566172daaef506a926bd875", hideLabel: !0, icon: "<swirl-icon-hamburger-menu></swirl-icon-hamburger-menu>", label: this.navigationOverlayLabel, onClick: this.overlayNavigation })), e("span", { key: "56a4370295b8631ae6581315ef112adb91a9380c", class: "app-layout__custom-app-bar-back-button" }, e("slot", { key: "89ba2faf27b331bc70154ab4fcc5e51249436d91", name: "custom-app-bar-back-button" })), e("div", { key: "32722f7370724e615b5ecf4716b13b554c7777a9", class: "app-layout__app-bar-content" }, e("slot", { key: "78706429b99c7b9102dc325ce4b9f74b56bc0440", name: "app-bar" })), e("div", { key: "f923d55ed6f8a2972116c8d43c987128384d62db", class: "app-layout__app-bar-controls" }, e("slot", { key: "b3935748903a08089da4e667a9542431a208920e", name: "app-bar-controls" }))), e("div", { key: "669b851e195c49406c87a281d30b48449b8797ce", class: "app-layout__banner" }, e("slot", { key: "cea8e68f02a259eece9aa0b6abd04f842078f8b9", name: "banner" })), e("div", { key: "39a8168686aee0134a3e0d8ebf473b5e50d5a5c7", class: "app-layout__content", onScroll: this.onContentScroll, ref: (s) => this.contentEl = s }, e("slot", { key: "854a3787e72fb6f9a45e47b051e707b686d6dbc8", name: "content" })), e("div", { key: "1986d465287b3a74ba85556c948ae2f0840bcef8", class: "app-layout__bottom-bar" }, e("slot", { key: "b0c50199b0b75aa7b3e60a9ed6cf82465b2d499c", name: "bottom-bar" }))), e("aside", { key: "083484009691c0278cb7d5762bfb00b8557354d6", class: "app-layout__sidebar" }, e("header", { key: "d7ae4b461dbcd81ecacc7afac2c7a5d11ad9177b", class: "app-layout__custom-sidebar-header" }, e("slot", { key: "01bdd1689ed091bc0673d859b1d400f5b40ec6dd", name: "custom-sidebar-header" })), e("header", { key: "9a8d6ecc2a6bf0f8f80103cf8277861f760fc7e3", class: "app-layout__sidebar-header" }, e("swirl-button", { key: "16138381869b8fb622e75f0644721d0752f111fc", class: "app-layout__sidebar-close-button", hideLabel: !0, icon: "<swirl-icon-close></swirl-icon-close>", label: this.sidebarCloseButtonLabel, onClick: this.onSidebarCloseButtonClick }), e("swirl-heading", { key: "f500b1f029b89346d262c4cfb12c465a5e19c941", as: "h3", class: "app-layout__sidebar-heading", headingId: "sidebar-heading", level: 3, text: this.sidebarHeading })), e("div", { key: "5fc3cee15e4dc3d8c39f6a3aca0f72474297f1d6", class: "app-layout__sidebar-content", onScroll: this.onSidebarScroll, ref: (s) => this.sidebarEl = s }, e("slot", { key: "007392df47e74ff25300563853e6cf85a157a566", name: "sidebar" }))), e("span", { key: "a3f6719b121bc8103938526879b081a49e0630ff", class: "app-layout__floating-action-button" }, this.ctaLabel && e("swirl-button", { key: "afdf4c3e3adcfa4bc5daace58de67a72086939fb", hideLabel: Boolean(this.ctaIcon), icon: this.ctaIcon, intent: "primary", label: this.ctaLabel, onClick: this.onCtaClick, variant: "floating" }), e("slot", { key: "3662430e701b8c6e05c1d3f2c16fd15995cd5b94", name: "floating-action-button" })))));
+  }
+  get el() {
+    return u(this);
+  }
+  static get watchers() {
+    return {
+      mobileView: ["watchMobileView"]
+    };
+  }
+};
+N.style = A;
+const M = ":host{display:block}:host *{box-sizing:border-box}.empty-state{display:flex;max-width:28rem;align-items:center;flex-direction:column;gap:var(--s-space-16)}.empty-state--has-controls .empty-state__controls{display:block}.empty-state--has-slotted-illustration .empty-state__slotted-illustration{display:block}.empty-state__illustration{max-width:16rem}.empty-state__body{display:flex;align-items:center;flex-direction:column;gap:var(--s-space-24)}.empty-state__controls{display:none}.empty-state__slotted-illustration{display:none;max-width:16rem}", z = class {
+  constructor(a) {
+    d(this, a), this.headingLevel = 4;
+  }
+  render() {
+    const a = Boolean(this.el.querySelector('[slot="controls"]')), t = Boolean(this.el.querySelector('[slot="illustration"]')), i = b("empty-state", {
+      "empty-state--has-controls": a,
+      "empty-state--has-slotted-illustration": t
+    });
+    return e(c, { key: "4391e111c89d0f2d2fa7d69c06517582867436e0" }, e("div", { key: "b061eba04ed62093ecbff1a5a9019a17f34ff996", class: i }, this.illustration && !t && e("img", { key: "f706ddd87ce2530fdbb65e1e0cb5465830a5b809", alt: "", class: "empty-state__illustration", src: this.illustration }), e("div", { key: "74e3015d08da4defa6feea2b2e9a09a40898b370", class: "empty-state__slotted-illustration" }, e("slot", { key: "4ff7a8945c4140deb24c0e354347bf433a63aabe", name: "illustration" })), e("div", { key: "cae284674256a2890b63beb80e31ece9036d8aeb", class: "empty-state__body" }, e("swirl-stack", { key: "7673b18182989081876d6fb57dac7d764eb1cfdc", align: "stretch", spacing: "8" }, this.heading && e("swirl-heading", { key: "8e7d666b9e6bb43696e57a888aad4365f41d7de6", align: "center", as: `h${this.headingLevel}`, level: 4, text: this.heading }), e("div", { key: "a5a92916d6c1461868229fa416a39088ffa54818", class: "empty-state__content" }, e("swirl-text", { key: "3b5e49a332ab029f5e951071f05a5674711e36ad", align: "center", color: "subdued" }, e("slot", { key: "dda5cab91cc3fe4f3d7b7132f8ad722d66143dcf" })))), e("div", { key: "9f7b3581b26eae9704de991d223b06747f2b23f1", class: "empty-state__controls" }, e("slot", { key: "144499d5b56273311f2e95cf2a4277746ed82753", name: "controls" })))));
+  }
+  get el() {
+    return u(this);
+  }
+};
+z.style = M;
+const V = ":host{display:inline-flex;max-width:100%;max-height:100%}.swirl-icon{max-width:100%;max-height:100%}.icon-wrapper{display:inline-flex;justify-content:center;align-items:center;border-radius:var(--s-border-radius-full-round);background-color:var(--s-surface-raised-default)}.icon-wrapper--size-xs{width:16px;height:16px}.icon-wrapper--size-s{width:20px;height:20px}.icon-wrapper--size-m{width:24px;height:24px}.icon-wrapper--size-l{width:28px;height:28px}.icon-wrapper--size-xl{width:32px;height:32px}.icon-wrapper--size-2xl{width:40px;height:40px}.icon-wrapper--background-color-neutral{background-color:var(--s-surface-raised-default);color:var(--s-icon-default)}.icon-wrapper--background-color-banana{background-color:var(--s-decorative-banana-surface-subdued);color:var(--s-decorative-banana-text)}.icon-wrapper--background-color-blueberry{background-color:var(--s-decorative-blueberry-surface-subdued);color:var(--s-decorative-blueberry-text)}.icon-wrapper--background-color-chilli{background-color:var(--s-decorative-chilli-surface-subdued);color:var(--s-decorative-chilli-text)}.icon-wrapper--background-color-grape{background-color:var(--s-decorative-grape-surface-subdued);color:var(--s-decorative-grape-text)}.icon-wrapper--background-color-kiwi{background-color:var(--s-decorative-kiwi-surface-subdued);color:var(--s-decorative-kiwi-text)}.icon-wrapper--background-color-pumpkin{background-color:var(--s-decorative-pumpkin-surface-subdued);color:var(--s-decorative-pumpkin-text)}.icon-wrapper--background-color-radish{background-color:var(--s-decorative-radish-surface-subdued);color:var(--s-decorative-radish-text)}", H = class {
+  constructor(a) {
+    d(this, a), this.size = 24;
+  }
+  render() {
+    const a = this.size === 20 ? 24 : this.size, t = {
+      color: Boolean(this.color) ? `var(--s-icon-${this.color})` : void 0
+    }, i = b("swirl-icon", `swirl-icon--size-${this.size}`);
+    return e("svg", { key: "679d5739a4482494afa218d8159cbf5434c47adb", "aria-hidden": "true", class: i, fill: "none", height: this.size, part: "icon", style: t, viewBox: `0 0 ${a} ${a}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, this.size === 16 && e(h, { key: "a0e29dc71e3416a482f77167262eebb93d404b8a" }, e("path", { key: "6b12190a9ae18075a6b31a658dbc2bd0a9f83a5b", d: "M9.99998 8.66669C10.3666 8.66669 10.6806 8.53602 10.942 8.27469C11.2029 8.0138 11.3333 7.70002 11.3333 7.33335C11.3333 6.96669 11.2029 6.65269 10.942 6.39135C10.6806 6.13046 10.3666 6.00002 9.99998 6.00002C9.63331 6.00002 9.31953 6.13046 9.05865 6.39135C8.79731 6.65269 8.66665 6.96669 8.66665 7.33335C8.66665 7.70002 8.79731 8.0138 9.05865 8.27469C9.31953 8.53602 9.63331 8.66669 9.99998 8.66669ZM7.33331 11.3334H12.6666V10.9667C12.6666 10.4667 12.4222 10.0694 11.9333 9.77469C11.4444 9.48046 10.8 9.33335 9.99998 9.33335C9.19998 9.33335 8.55553 9.48046 8.06665 9.77469C7.57776 10.0694 7.33331 10.4667 7.33331 10.9667V11.3334ZM2.66665 13.3334C2.29998 13.3334 1.9862 13.2029 1.72531 12.942C1.46398 12.6807 1.33331 12.3667 1.33331 12V4.00002C1.33331 3.63335 1.46398 3.31958 1.72531 3.05869C1.9862 2.79735 2.29998 2.66669 2.66665 2.66669H6.11665C6.29442 2.66669 6.46398 2.70002 6.62531 2.76669C6.7862 2.83335 6.92776 2.9278 7.04998 3.05002L7.99998 4.00002H13.3333C13.7 4.00002 14.014 4.13069 14.2753 4.39202C14.5362 4.65291 14.6666 4.96669 14.6666 5.33335V12C14.6666 12.3667 14.5362 12.6807 14.2753 12.942C14.014 13.2029 13.7 13.3334 13.3333 13.3334H2.66665ZM2.66665 4.00002V12H13.3333V5.33335H7.44998L6.11665 4.00002H2.66665Z", fill: "currentColor" })), (this.size === 20 || this.size === 24) && e(h, { key: "cb37b9c6af85a1f1baaaf0a318224b4204985596" }, e("path", { key: "70c947310f9295d573b29999d6cbf79e5a2d66ab", d: "M15 13C15.55 13 16.021 12.804 16.413 12.412C16.8043 12.0207 17 11.55 17 11C17 10.45 16.8043 9.979 16.413 9.587C16.021 9.19567 15.55 9 15 9C14.45 9 13.9793 9.19567 13.588 9.587C13.196 9.979 13 10.45 13 11C13 11.55 13.196 12.0207 13.588 12.412C13.9793 12.804 14.45 13 15 13ZM11 17H19V16.45C19 15.7 18.6333 15.104 17.9 14.662C17.1667 14.2207 16.2 14 15 14C13.8 14 12.8333 14.2207 12.1 14.662C11.3667 15.104 11 15.7 11 16.45V17ZM4 20C3.45 20 2.97933 19.8043 2.588 19.413C2.196 19.021 2 18.55 2 18V6C2 5.45 2.196 4.97933 2.588 4.588C2.97933 4.196 3.45 4 4 4H9.175C9.44167 4 9.696 4.05 9.938 4.15C10.1793 4.25 10.3917 4.39167 10.575 4.575L12 6H20C20.55 6 21.021 6.196 21.413 6.588C21.8043 6.97933 22 7.45 22 8V18C22 18.55 21.8043 19.021 21.413 19.413C21.021 19.8043 20.55 20 20 20H4ZM4 6V18H20V8H11.175L9.175 6H4Z", fill: "currentColor" })), this.size === 28 && e(h, { key: "5ac3a34b8389fec99cb86ca4efccacb5ec8c44db" }, e("path", { key: "b7b046c3fbcfcdbf24900b125e21af26c6747492", d: "M17.5 15.1667C18.1416 15.1667 18.6911 14.938 19.1485 14.4807C19.605 14.0241 19.8333 13.475 19.8333 12.8334C19.8333 12.1917 19.605 11.6422 19.1485 11.1849C18.6911 10.7283 18.1416 10.5 17.5 10.5C16.8583 10.5 16.3092 10.7283 15.8526 11.1849C15.3953 11.6422 15.1666 12.1917 15.1666 12.8334C15.1666 13.475 15.3953 14.0241 15.8526 14.4807C16.3092 14.938 16.8583 15.1667 17.5 15.1667ZM12.8333 19.8334H22.1666V19.1917C22.1666 18.3167 21.7389 17.6214 20.8833 17.1057C20.0278 16.5908 18.9 16.3334 17.5 16.3334C16.1 16.3334 14.9722 16.5908 14.1166 17.1057C13.2611 17.6214 12.8333 18.3167 12.8333 19.1917V19.8334ZM4.66665 23.3334C4.02498 23.3334 3.47587 23.1051 3.01931 22.6485C2.56198 22.1912 2.33331 21.6417 2.33331 21V7.00002C2.33331 6.35835 2.56198 5.80924 3.01931 5.35269C3.47587 4.89535 4.02498 4.66669 4.66665 4.66669H10.7041C11.0153 4.66669 11.312 4.72502 11.5943 4.84169C11.8759 4.95835 12.1236 5.12363 12.3375 5.33752L14 7.00002H23.3333C23.975 7.00002 24.5245 7.22869 24.9818 7.68602C25.4384 8.14258 25.6666 8.69169 25.6666 9.33335V21C25.6666 21.6417 25.4384 22.1912 24.9818 22.6485C24.5245 23.1051 23.975 23.3334 23.3333 23.3334H4.66665ZM4.66665 7.00002V21H23.3333V9.33335H13.0375L10.7041 7.00002H4.66665Z", fill: "currentColor" })));
+  }
+};
+H.style = V;
+const O = ".sc-swirl-resource-list-h{display:block;width:100%}.sc-swirl-resource-list-h *.sc-swirl-resource-list{box-sizing:border-box}", P = class {
+  constructor(a) {
+    d(this, a), this.itemDrop = l(this, "itemDrop", 7), this.assistiveTextItemGrabbed = "Item grabbed. Use arrow keys to move item up or down. Use spacebar to save position.", this.assistiveTextItemMoving = "Current position:", this.assistiveTextItemMoved = "Item moved. New position:", this.semantics = "grid", this.spacing = "0", this.listId = x(), this.focusedIndex = 0, this.toggleDrag = (t) => {
+      const i = t.detail;
+      Boolean(this.dragging) ? this.stopDrag(i) : this.startDrag(i);
+    }, this.startDrag = (t) => {
+      this.dragging = t, this.draggingStartIndex = this.getItemIndex(this.dragging), t.setAttribute("dragging", "true");
+      const i = this.getItemIndex(this.dragging);
+      this.focusItemAtIndex(i), this.assistiveText = this.assistiveTextItemGrabbed;
+    }, this.stopDrag = (t) => {
+      const i = this.getItemIndex(this.dragging);
+      this.dragging = void 0, t.removeAttribute("dragging"), this.assistiveText = `${this.assistiveTextItemMoved} ${i + 1}`, this.itemDrop.emit({ item: t, oldIndex: this.draggingStartIndex, newIndex: i }), this.draggingStartIndex = void 0;
+    }, this.onKeyDown = (t) => {
+      if (this.semantics === "grid" && !Boolean(this.dragging))
+        if (t.code === "ArrowDown")
+          t.preventDefault(), this.focusItemAtIndex((this.focusedIndex + 1) % this.items.length);
+        else if (t.code === "ArrowUp") {
+          t.preventDefault();
+          const i = this.focusedIndex === 0 ? this.items.length - 1 : this.focusedIndex - 1;
+          this.focusItemAtIndex(i);
+        } else if (t.code === "Enter" && Boolean(this.controllingElement)) {
+          const i = this.items[this.focusedIndex];
+          if (!Boolean(i) || !i.isConnected)
+            return;
+          t.stopPropagation(), t.preventDefault(), i.click();
+        } else
+          t.code === "Home" ? (t.preventDefault(), this.focusItemAtIndex(0)) : t.code === "End" && (t.preventDefault(), this.focusItemAtIndex(this.items.length - 1));
+      if (Boolean(this.dragging)) {
+        if (t.code === "ArrowDown")
+          t.preventDefault(), this.moveDraggedItemDown();
+        else if (t.code === "ArrowUp")
+          t.preventDefault(), this.moveDraggedItemUp();
+        else if (t.code === "Space" || t.code === "Enter") {
+          const i = t.composedPath()[0];
+          i != null && i.classList.contains("resource-list-item__drag-handle") || (t.preventDefault(), this.stopDrag(this.dragging));
+        }
+      }
+    };
+  }
+  componentDidLoad() {
+    this.observeSlotChanges(), this.collectItems(), this.setupControllingElement(), this.setItemAllowDragState(), this.setupDragDrop(), this.setSectionSpacingAndSeparator();
+  }
+  componentDidRender() {
+    this.setupDragDrop();
+  }
+  disconnectedCallback() {
+    var a, t, i;
+    (a = this.sortable) == null || a.destroy(), (t = this.observer) == null || t.disconnect(), (i = this.controllingElement) == null || i.removeEventListener("keydown", this.onKeyDown);
+  }
+  observeSlotChanges() {
+    this.observer = new MutationObserver(() => {
+      this.collectItems(), this.setItemAllowDragState(), this.setSectionSpacingAndSeparator();
+    }), this.observer.observe(this.el, {
+      childList: !0,
+      characterData: !0,
+      subtree: !0
+    });
+  }
+  watchAllowDrag() {
+    this.setItemAllowDragState(), this.setupDragDrop();
+  }
+  async resetFocus() {
+    var a;
+    this.focusedIndex = 0, this.removeItemsFromTabOrder(), this.enableItemFocus(this.items[0]), Boolean(this.controllingElement) && ((a = this.items[0]) == null || a.setAttribute("aria-selected", "true"));
+  }
+  collectItems() {
+    var a;
+    this.items = Array.from(this.el.querySelectorAll("swirl-resource-list-item, swirl-resource-list-file-item, [data-resource-list-item]")).filter((t) => t.isConnected), this.sections = Array.from(this.el.querySelectorAll("swirl-resource-list-section")).filter((t) => t.isConnected), this.removeItemsFromTabOrder(), this.enableItemFocus(this.items[this.focusedIndex]), Boolean(this.controllingElement) && ((a = this.items[0]) == null || a.setAttribute("aria-selected", "true"));
+  }
+  setupControllingElement() {
+    !Boolean(this.controllingElement) || (this.controllingElement.setAttribute("aria-controls", this.listId), this.controllingElement.setAttribute("role", "combobox"), this.controllingElement.setAttribute("aria-autocomplete", "list"), this.controllingElement.addEventListener("keydown", this.onKeyDown));
+  }
+  getItemIndex(a) {
+    return this.items.map((t) => t).findIndex((t) => t === a);
+  }
+  removeItemsFromTabOrder() {
+    this.semantics === "grid" && this.items.forEach((a) => {
+      const t = a == null ? void 0 : a.querySelector(".resource-list-item__content, .resource-list-file-item, [data-resource-list-item-button]"), i = a == null ? void 0 : a.querySelector(".resource-list-item__drag-handle");
+      Boolean(this.controllingElement) && a.setAttribute("aria-selected", "false"), t == null || t.setAttribute("tabIndex", "-1"), i == null || i.setAttribute("tabIndex", "-1");
+    });
+  }
+  setItemAllowDragState() {
+    this.allowDrag ? this.items.filter((a) => this.sections.every((t) => !t.contains(a))).forEach((a) => {
+      a.setAttribute("allow-drag", "true"), a.addEventListener("toggleDrag", this.toggleDrag);
+    }) : this.items.forEach((a) => {
+      a.removeAttribute("allow-drag"), a.removeEventListener("toggleDrag", this.toggleDrag);
+    });
+  }
+  setupDragDrop() {
+    Boolean(this.sortable) && this.sortable.destroy(), this.allowDrag && (this.sortable = D.create(this.gridEl, {
+      animation: 150,
+      draggable: "swirl-resource-list-item",
+      handle: ".resource-list-item__drag-handle",
+      onEnd: (a) => {
+        this.itemDrop.emit({
+          item: a.item,
+          oldIndex: a.oldDraggableIndex,
+          newIndex: a.newDraggableIndex
+        });
+      }
+    }));
+  }
+  enableItemFocus(a, t) {
+    if (!Boolean(a) || Boolean(this.controllingElement))
+      return;
+    const i = a.querySelector(".resource-list-item__content, .resource-list-file-item, [data-resource-list-item-button]"), o = a.querySelector(".resource-list-item__drag-handle");
+    Boolean(o) && o.setAttribute("tabIndex", "0"), Boolean(i) && (i.setAttribute("tabIndex", "0"), t && !Boolean(this.controllingElement) && i.focus());
+  }
+  focusItemAtIndex(a) {
+    this.removeItemsFromTabOrder();
+    const t = this.items[a];
+    !Boolean(t) || !t.isConnected || (this.enableItemFocus(t, !Boolean(this.controllingElement)), Boolean(this.controllingElement) && (t.setAttribute("aria-selected", "true"), t.scrollIntoView({ block: "nearest" })), this.focusedIndex = a);
+  }
+  moveDraggedItemDown() {
+    const a = this.dragging.nextElementSibling;
+    !Boolean(a) || (a.after(this.dragging), this.collectItems(), this.focusItemAtIndex(this.getItemIndex(this.dragging)), this.assistiveText = `${this.assistiveTextItemMoving} ${this.getItemIndex(this.dragging) + 1}`);
+  }
+  moveDraggedItemUp() {
+    const a = this.dragging.previousElementSibling;
+    !Boolean(a) || (a.before(this.dragging), this.collectItems(), this.focusItemAtIndex(this.getItemIndex(this.dragging)), this.assistiveText = `${this.assistiveTextItemMoving} ${this.getItemIndex(this.dragging) + 1}`);
+  }
+  setSectionSpacingAndSeparator() {
+    this.sections.forEach((a, t) => {
+      var i;
+      t === 0 && ((i = a.previousElementSibling) == null ? void 0 : i.tagName) !== "SWIRL-RESOURCE-LIST-ITEM" && (a.hasSeparator = !1), a.spacing = this.spacing;
+    });
+  }
+  render() {
+    var a, t, i, o, r, n;
+    return e(c, { key: "88c0343e805be375055b872e2ab888a8fc00e3a6", onKeyDown: this.onKeyDown }, e("swirl-visually-hidden", { key: "6aebc2a2d6aef1effc072dcd33ce6d7f2e91d6f7", role: "alert" }, this.assistiveText), e("swirl-box", { key: "af90dd453f94ea6d085cc7db3ba964f7bc7a0864", paddingBlockEnd: (a = this.paddingBlockEnd) != null ? a : this.padding, paddingBlockStart: (t = this.paddingBlockStart) != null ? t : this.padding, paddingInlineEnd: (o = (i = this.paddingInlineEnd) != null ? i : this.padding) != null ? o : "8", paddingInlineStart: (n = (r = this.paddingInlineStart) != null ? r : this.padding) != null ? n : "8" }, e("swirl-stack", { key: "5f821112fe979cbf91eec5c8a24b6533964c826c", "aria-label": this.label, class: "resource-list", id: this.listId, ref: (p) => this.gridEl = p, role: this.semantics, spacing: this.spacing }, e("slot", { key: "55c652869ea63c5041b8b6981c2071a33df6879c" }))));
+  }
+  get el() {
+    return u(this);
+  }
+  static get watchers() {
+    return {
+      allowDrag: ["watchAllowDrag"]
+    };
+  }
+};
+P.style = O;
+const q = `.sc-swirl-resource-list-item-h{position:relative;display:block;width:100%}.sc-swirl-resource-list-item-h *.sc-swirl-resource-list-item{box-sizing:border-box}[aria-selected="true"].sc-swirl-resource-list-item-h .resource-list-item.sc-swirl-resource-list-item{background-color:var(--swirl-resource-list-item-background-hovered)}[aria-selected="true"].sc-swirl-resource-list-item-h .resource-list-item.sc-swirl-resource-list-item .resource-list-item__media.sc-swirl-resource-list-item,[aria-selected="true"].sc-swirl-resource-list-item-h .resource-list-item.sc-swirl-resource-list-item .resource-list-item__meta.sc-swirl-resource-list-item{--swirl-avatar-background-color:var(--s-surface-raised-hovered);--swirl-avatar-group-border-color:var(--s-background-hovered);--swirl-badge-border-color:var(--s-background-hovered)}.resource-list-item.sc-swirl-resource-list-item{position:relative;width:100%;display:flex;overflow:hidden;padding:var(--s-space-12) var(--s-space-8);gap:var(--s-space-12);border-radius:var(--s-border-radius-sm);background-color:var(--swirl-resource-list-item-background-default)}.resource-list-item.sc-swirl-resource-list-item:has(.resource-list-item__content:focus-visible){background-color:var(--s-background-hovered);outline-color:var(--s-focus-default);outline-style:solid;outline-width:0.125rem;z-index:1}.resource-list-item.sc-swirl-resource-list-item:has(.resource-list-item__content:focus-visible) .resource-list-item__media.sc-swirl-resource-list-item{--swirl-avatar-group-border-color:var(--s-background-hovered);--swirl-badge-border-color:var(--s-background-hovered)}.resource-list-item.sc-swirl-resource-list-item:not(.resource-list-item--has-control) .resource-list-item__control.sc-swirl-resource-list-item{display:none}.resource-list-item--interactive.sc-swirl-resource-list-item{cursor:pointer}.resource-list-item--interactive.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item{cursor:pointer}.resource-list-item--interactive.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item:disabled{cursor:default}.resource-list-item--interactive.resource-list-item--disabled.sc-swirl-resource-list-item{cursor:default}.resource-list-item--interactive.sc-swirl-resource-list-item:hover:not(.resource-list-item--disabled),.resource-list-item--interactive.sc-swirl-resource-list-item:focus-visible:not(.resource-list-item--disabled){background-color:var(--swirl-resource-list-item-background-hovered)}.resource-list-item--interactive.sc-swirl-resource-list-item:hover:not(.resource-list-item--disabled) .resource-list-item__media.sc-swirl-resource-list-item,.resource-list-item--interactive.sc-swirl-resource-list-item:hover:not(.resource-list-item--disabled) .resource-list-item__meta.sc-swirl-resource-list-item,.resource-list-item--interactive.sc-swirl-resource-list-item:focus-visible:not(.resource-list-item--disabled) .resource-list-item__media.sc-swirl-resource-list-item,.resource-list-item--interactive.sc-swirl-resource-list-item:focus-visible:not(.resource-list-item--disabled) .resource-list-item__meta.sc-swirl-resource-list-item{--swirl-avatar-background-color:var(--s-surface-raised-hovered);--swirl-avatar-group-border-color:var(--s-background-hovered);--swirl-badge-border-color:var(--s-background-hovered)}.resource-list-item--interactive.sc-swirl-resource-list-item:active:not(.resource-list-item--disabled){background-color:var(--swirl-resource-list-item-background-pressed)}.resource-list-item--interactive.sc-swirl-resource-list-item:active:not(.resource-list-item--disabled) .resource-list-item__media.sc-swirl-resource-list-item,.resource-list-item--interactive.sc-swirl-resource-list-item:active:not(.resource-list-item--disabled) .resource-list-item__meta.sc-swirl-resource-list-item{--swirl-avatar-group-border-color:var(--s-background-pressed);--swirl-badge-border-color:var(--s-background-pressed)}.resource-list-item--active.sc-swirl-resource-list-item{--swirl-badge-border-color:var(
+    --swirl-resource-list-item-background-hovered
+  );background-color:var(--swirl-resource-list-item-background-hovered)}.resource-list-item--checked.sc-swirl-resource-list-item .resource-list-item__checkbox.sc-swirl-resource-list-item{border-color:var(--s-icon-highlight);color:var(--s-text-on-status);background-color:var(--s-icon-highlight)}.resource-list-item--compact.sc-swirl-resource-list-item{padding:var(--s-space-8)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.resource-list-item--compact.sc-swirl-resource-list-item{padding:var(--s-space-8)}}.resource-list-item--compact.sc-swirl-resource-list-item .resource-list-item__label-container.sc-swirl-resource-list-item{min-height:2rem}@media (min-width: 768px){.resource-list-item--selectable.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item{padding-left:calc(var(--s-space-16) + 1.5rem + var(--s-space-12))}}.resource-list-item--selectable.sc-swirl-resource-list-item .resource-list-item__label-container.sc-swirl-resource-list-item{padding-right:calc(var(--s-space-16) + 1.5rem + var(--s-space-12))}@media (min-width: 768px){.resource-list-item--selectable.sc-swirl-resource-list-item .resource-list-item__label-container.sc-swirl-resource-list-item{padding-right:var(--s-space-16)}}.resource-list-item--label-weight-medium.sc-swirl-resource-list-item .resource-list-item__label.sc-swirl-resource-list-item{font-weight:var(--s-font-weight-medium)}.resource-list-item--label-weight-semibold.sc-swirl-resource-list-item .resource-list-item__label.sc-swirl-resource-list-item{font-weight:var(--s-font-weight-semibold)}.resource-list-item--label-weight-bold.sc-swirl-resource-list-item .resource-list-item__label.sc-swirl-resource-list-item{font-weight:var(--s-font-weight-bold)}.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item:hover,.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item:focus,.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item:focus-within{--swirl-flat-button-background-default:var(--s-background-default);--swirl-flat-button-background-disabled:var(--s-background-disabled);--swirl-flat-button-background-hovered:var(--s-background-hovered);--swirl-flat-button-background-pressed:var(--s-background-pressed)}.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item:hover .resource-list-item__control.sc-swirl-resource-list-item,.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item:focus .resource-list-item__control.sc-swirl-resource-list-item,.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item:focus-within .resource-list-item__control.sc-swirl-resource-list-item{pointer-events:auto;opacity:1;position:static;transform:none;margin:calc(-1 * var(--s-space-4)) 0}.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item:hover .resource-list-item__meta.sc-swirl-resource-list-item,.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item:focus .resource-list-item__meta.sc-swirl-resource-list-item,.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item:focus-within .resource-list-item__meta.sc-swirl-resource-list-item{margin-right:0;padding-right:0}.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item .resource-list-item__meta.sc-swirl-resource-list-item{margin-right:calc(-1 * var(--s-space-16));padding-right:var(--s-space-16);transition:margin 0.1s}.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item .resource-list-item__control.sc-swirl-resource-list-item{pointer-events:none;opacity:0;position:absolute;top:50%;right:var(--s-space-8);transform:translateY(-50%);transition:opacity 0.1s}.resource-list-item--draggable.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item{padding-left:calc(var(--s-space-12) * 2 + 1.5rem)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.resource-list-item--draggable.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item{padding-left:calc(var(--s-space-12) * 2 + 1rem)}}.resource-list-item--dragging.sc-swirl-resource-list-item{z-index:1;border-radius:var(--s-border-radius-s);background-color:var(--s-surface-overlay-pressed);box-shadow:0 0.0625rem 0.125rem rgba(25, 26, 28, 0.08),
+    0 0.25rem 2rem rgba(25, 26, 28, 0.16)}.resource-list-item--dragging.sc-swirl-resource-list-item:hover:not(.resource-list-item--disabled){background-color:var(--s-surface-overlay-pressed)}.resource-list-item--disabled.resource-list-item--checked.sc-swirl-resource-list-item .resource-list-item__checkbox.sc-swirl-resource-list-item{border-color:var(--s-icon-disabled);background-color:var(--s-icon-disabled)}.resource-list-item--disabled.sc-swirl-resource-list-item .resource-list-item__checkbox.sc-swirl-resource-list-item{border-color:var(--s-icon-disabled);background-color:transparent}.resource-list-item--disabled.sc-swirl-resource-list-item .resource-list-item__checkbox-icon.sc-swirl-resource-list-item{color:var(--s-text-on-status)}.resource-list-item--wrap-description.sc-swirl-resource-list-item .resource-list-item__description.sc-swirl-resource-list-item{white-space:normal}.resource-list-item--wrap-label.sc-swirl-resource-list-item .resource-list-item__label.sc-swirl-resource-list-item{white-space:normal}.resource-list-item__content.sc-swirl-resource-list-item{--swirl-avatar-group-border-color:var(--s-background-default);--swirl-badge-border-color:var(--s-background-default);display:flex;width:100%;min-width:0;margin:0;padding:0;align-items:flex-start;border:none;color:var(--s-text-default);background:none;font:inherit;line-height:var(--s-line-height-sm);text-align:left;text-decoration:none;gap:var(--s-space-12)}.resource-list-item__content.sc-swirl-resource-list-item:focus,.resource-list-item__content.sc-swirl-resource-list-item:focus-visible{outline:none}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.resource-list-item__content.sc-swirl-resource-list-item{line-height:var(--s-line-height-base)}}.resource-list-item__media.sc-swirl-resource-list-item{display:inline-flex;flex-shrink:0}.resource-list-item__label-container.sc-swirl-resource-list-item{position:relative;display:flex;height:100%;min-width:0;min-height:3rem;padding-right:var(--s-space-16);justify-content:center;flex-direction:column}.resource-list-item__label.sc-swirl-resource-list-item{overflow:hidden;font-size:var(--s-font-size-base);line-height:var(--s-line-height-base);white-space:nowrap;text-overflow:ellipsis}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.resource-list-item__label.sc-swirl-resource-list-item{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.resource-list-item__description.sc-swirl-resource-list-item{overflow:hidden;color:var(--s-text-subdued);font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);white-space:nowrap;text-overflow:ellipsis}.resource-list-item__menu-trigger.sc-swirl-resource-list-item{position:absolute;top:50%;right:var(--s-space-16);transform:translateY(-50%)}.resource-list-item__control.sc-swirl-resource-list-item{align-self:center}.resource-list-item__checkbox.sc-swirl-resource-list-item{position:absolute;top:50%;right:var(--s-space-16);display:flex;width:1.125rem;height:1.125rem;justify-content:center;align-items:center;border:0.125rem solid var(--s-icon-default);border-radius:var(--s-border-radius-s);transform:translateY(-50%);pointer-events:none}@media (min-width: 768px){.resource-list-item__checkbox.sc-swirl-resource-list-item{right:auto;left:calc(var(--s-space-16) - var(--s-space-2))}}.resource-list-item__checkbox-icon.sc-swirl-resource-list-item{display:inline-flex;width:1.0625rem;height:1.0625rem}.resource-list-item__checkbox-icon.sc-swirl-resource-list-item>*.sc-swirl-resource-list-item::part(icon){width:1.0625rem;height:1.0625rem}.resource-list-item__meta.sc-swirl-resource-list-item{display:flex;align-items:flex-end;color:var(--s-text-subdued);font-size:var(--s-font-size-sm);flex-direction:column;align-self:flex-start;gap:var(--s-space-2)}.resource-list-item__meta.sc-swirl-resource-list-item:not(:has(.resource-list-item__meta-text)){align-self:center}.resource-list-item__meta-text.sc-swirl-resource-list-item{line-height:var(--s-line-height-base);margin-top:var(--s-space-2);white-space:nowrap}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.resource-list-item__meta-text.sc-swirl-resource-list-item{line-height:var(--s-line-height-sm);margin-top:var(--s-space-4)}}.resource-list-item__badges.sc-swirl-resource-list-item{display:inline-flex;width:-webkit-max-content;width:-moz-max-content;width:max-content}.resource-list-item__drag-handle.sc-swirl-resource-list-item{position:absolute;z-index:1;top:50%;left:var(--s-space-4);display:inline-flex;margin:0;padding:var(--s-space-8);flex-shrink:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:grab;transform:translateY(-50%)}.resource-list-item__drag-handle.sc-swirl-resource-list-item:active{cursor:grabbing}.resource-list-item__drag-handle.sc-swirl-resource-list-item:focus:not(:focus-visible){outline:none}.resource-list-item__drag-handle.sc-swirl-resource-list-item:focus-visible{outline-color:var(--s-focus-default)}`, F = class {
+  constructor(a) {
+    d(this, a), this.toggleDrag = l(this, "toggleDrag", 7), this.valueChange = l(this, "valueChange", 7), this.checked = !1, this.dragHandleDescription = "Press spacebar to toggle grab", this.dragHandleLabel = "Move item", this.interactive = !0, this.labelWeight = "medium", this.labelTooltipPosition = "top", this.menuTriggerLabel = "Options", this.hasMedia = !1, this.iconSize = 24, this.elementId = x(), this.mediaQueryUnsubscribe = () => {
+    }, this.onClick = () => {
+      !this.selectable || (this.checked = !this.checked, this.valueChange.emit(this.checked));
+    }, this.onBlur = () => {
+      this.makeControlUnfocusable();
+    }, this.onFocus = () => {
+      this.makeControlFocusable();
+    }, this.onMenuTriggerClick = (t) => {
+      this.disabled && !Boolean(this.href) && t.stopPropagation();
+    }, this.onDragHandleKeyDown = (t) => {
+      (t.code === "Space" || t.code === "Enter") && (t.preventDefault(), this.toggleDrag.emit(this.el));
+    }, this.onControlClick = (t) => {
+      t.preventDefault(), t.stopPropagation();
+    };
+  }
+  componentWillLoad() {
+    this.updateMediaState();
+  }
+  componentDidLoad() {
+    var a;
+    this.parentSemantics = (a = this.el.closest("swirl-resource-list")) == null ? void 0 : a.semantics, this.mediaQueryUnsubscribe = k.subscribe((t) => {
+      this.forceIconProps(t), this.updateIconSize(t);
+    }), this.makeControlUnfocusable(), Boolean(this.menuTriggerId) && console.warn('[Swirl] The "menu-trigger-id" prop of swirl-resource-list-item is deprecated and will be removed with the next major release. Please use the "control" slot to add a menu button instead. https://swirl-storybook.flip-app.dev/?path=/docs/components-swirlresourcelistitem--docs');
+  }
+  disconnectedCallback() {
+    this.mediaQueryUnsubscribe();
+  }
+  get hasBadges() {
+    return Boolean(this.el.querySelector("[slot='badges']"));
+  }
+  get showMeta() {
+    return (Boolean(this.meta) || this.hasBadges) && !this.selectable;
+  }
+  forceIconProps(a) {
+    var i;
+    const t = (i = this.iconEl) == null ? void 0 : i.children[0];
+    t == null || t.setAttribute("size", a ? "20" : "24");
+  }
+  updateIconSize(a) {
+    this.iconSize = a ? 20 : 24;
+  }
+  updateMediaState() {
+    const a = this.el.querySelector('[slot="media"]'), t = Boolean(a);
+    t !== this.hasMedia && (this.hasMedia = t);
+  }
+  getControl() {
+    return this.el.querySelector('[slot="control"] button');
+  }
+  makeControlFocusable() {
+    if (this.parentSemantics !== "grid")
+      return;
+    const a = this.getControl();
+    !Boolean(a) || (a.tabIndex = 0);
+  }
+  makeControlUnfocusable() {
+    if (this.parentSemantics !== "grid")
+      return;
+    const a = this.getControl();
+    !Boolean(a) || (a.tabIndex = -1);
+  }
+  render() {
+    var _;
+    const a = !this.interactive && !this.selectable ? "div" : Boolean(this.href) && !this.selectable ? "a" : "button", t = this.disabled && !Boolean(this.href), i = this.hasBadges, o = this.el.querySelector("[slot='control']"), r = Boolean(this.menuTriggerId) || o, n = this.interactive && Boolean(this.href) ? this.href : void 0, p = o && (Boolean(this.meta) || i), m = Boolean(this.menuTriggerId) && !Boolean(this.meta) && !this.selectable, s = this.showMeta, S = Boolean(this.swirlAriaLabel) ? this.swirlAriaLabel : this.label, C = this.selectable ? String(this.checked) : void 0, I = this.interactive && this.selectable ? "checkbox" : void 0, f = this.el.closest('[role="grid"]') ? "row" : "listitem", B = f === "row" ? "gridcell" : void 0, T = {
+      minHeight: (_ = this.labelMinHeight) != null ? _ : void 0
+    }, w = () => e("span", { key: "560a3d9204c56600d69a71f419d1f109374a637a", class: "resource-list-item__label", id: this.elementId, innerHTML: this.allowHtml ? this.label : void 0 }, !this.allowHtml && this.label), E = b("resource-list-item", `resource-list-item--label-weight-${this.labelWeight}`, {
+      "resource-list-item--active": this.active,
+      "resource-list-item--checked": this.checked,
+      "resource-list-item--compact": this.compact,
+      "resource-list-item--disabled": this.disabled,
+      "resource-list-item--draggable": this.allowDrag,
+      "resource-list-item--dragging": this.dragging,
+      "resource-list-item--has-control": o,
+      "resource-list-item--has-menu": r,
+      "resource-list-item--hide-divider": this.hideDivider,
+      "resource-list-item--interactive": this.interactive || this.selectable,
+      "resource-list-item--selectable": this.selectable,
+      "resource-list-item--show-control-on-focus": p,
+      "resource-list-item--show-meta": s,
+      "resource-list-item--wrap-description": this.descriptionWrap,
+      "resource-list-item--wrap-label": this.labelWrap
+    });
+    return e(c, { key: "2ded63740696c7ca8a0171bad3329ffd606ed933", role: f }, e("div", { key: "784dc74ba23a1eb257b733c8c3d6ddcc307962ff", class: E, role: B, onClick: this.onClick }, e(a, { key: "55aad3e259b95582c3dd488c8bace6c63ac60723", "aria-checked": C, "aria-current": this.swirlAriaCurrent, "aria-disabled": t ? "true" : void 0, "aria-label": S, "aria-labelledby": Boolean(this.swirlAriaLabel) ? void 0 : this.elementId, class: "resource-list-item__content", style: { alignItems: this.alignItems }, href: n, disabled: t, onBlur: this.onBlur, onFocus: this.onFocus, part: "resource-list-item__content", role: I, tabIndex: 0, type: a === "button" ? "button" : void 0 }, this.hasMedia && e("span", { key: "97c0808c03e92ea86de827a347f71e92ef855434", class: "resource-list-item__media" }, e("slot", { key: "0c2a423d0759d51f730771e63478d2f4518190ac", name: "media" })), e("span", { key: "873aa374e216500e376a95ae63d7bfa694d93dc4", class: "resource-list-item__label-container", style: T }, this.labelTooltip ? e("swirl-tooltip", { content: this.labelTooltip, position: this.labelTooltipPosition }, w()) : w(), this.description && e("span", { key: "22624a6ee282aebea68f0d9fba347eeb2515425c", class: "resource-list-item__description", innerHTML: this.allowHtml ? this.description : void 0 }, !this.allowHtml && this.description))), this.selectable && e("span", { key: "fc74d0b9c87c17f4a384e2a8b6cca861f43cc827", "aria-hidden": "true", class: "resource-list-item__checkbox" }, e("span", { key: "ba999b50d68e11d2d0b8e7026d68dc4f136c9304", class: "resource-list-item__checkbox-icon" }, this.checked && e("swirl-icon-check-strong", { key: "d70dc4f2c8f7dd0de1337af186a5f228359ccfbf" }))), s && e("span", { key: "3355a9276eef331a80d288f03d2c24360bf9d089", class: "resource-list-item__meta" }, this.meta && e("span", { key: "e96723b4a1b3b1c1037d3c6eb8397acb2023015e", class: "resource-list-item__meta-text" }, this.meta), e("span", { key: "122d6790da030e59691b69c183ada52c682f0d25", class: "resource-list-item__badges" }, e("slot", { key: "702dddbcdbac3b1282f56c4f26efe7804c4f11e7", name: "badges" }))), e("span", { key: "1992a4ffa3f82ce144e1141abec5593d70ffe7e6", class: "resource-list-item__control", onClick: this.onControlClick }, e("slot", { key: "5529d3996ca9aa8714d4ce8e71fb7e11f194d2a5", name: "control" })), m && e("swirl-popover-trigger", { key: "a9dc5b346da8a3c83dc75a38bbc80fed6ff86534", swirlPopover: this.menuTriggerId }, e("swirl-button", { key: "600de64c3fbef81f937bcc70db087be6b4dd2c4c", "aria-disabled": t ? "true" : void 0, class: "resource-list-item__menu-trigger", disabled: t, hideLabel: !0, icon: "<swirl-icon-more-horizontal></swirl-icon-more-horizontal>", intent: "primary", label: this.menuTriggerLabel, onClick: this.onMenuTriggerClick }))), this.allowDrag && e("button", { key: "7144de09743aee14f1e58a9f581326a72386a735", "aria-describedby": this.dragHandleDescription, "aria-label": `${this.dragHandleLabel} "${this.label}"`, class: "resource-list-item__drag-handle", onKeyDown: this.onDragHandleKeyDown, type: "button" }, e("swirl-icon-drag-handle", { key: "15372d442900a3a6f0c7357e5bfcbe82938db0ca", size: this.iconSize })));
+  }
+  get el() {
+    return u(this);
+  }
+};
+F.style = q;
+export {
+  N as swirl_app_layout,
+  z as swirl_empty_state,
+  H as swirl_icon_folder_shared,
+  P as swirl_resource_list,
+  F as swirl_resource_list_item
+};