@getflip/swirl-components 0.116.0 → 0.117.0

package/dist/esm/swirl-shell-layout.entry.js

@@ -1,104 +1,116 @@
-import { r as registerInstance, h, H as Host } from './index-99d0060d.js';
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-99d0060d.js';
 import { c as classnames } from './index-d280dafb.js';
-import { g as getDesktopMediaQuery, a as getActiveElement } from './utils-9f141e25.js';
+import { c as createFocusTrap } from './focus-trap.esm-37cd2d2b.js';
 
-const swirlShellLayoutCss = ":host{--extended-sidebar-width:17rem;--collapsed-sidebar-width:4rem;display:flex;width:100%;height:100%}:host *{box-sizing:border-box}.shell-layout{display:grid;width:100%;min-height:100%;transition:grid-template-columns 0.2s;grid-template-columns:0 1fr;grid-template-rows:auto 1fr;grid-template-areas:\"banner banner\"\n    \"sidebar main\"}@media (min-width: 992px){.shell-layout{grid-template-columns:var(--extended-sidebar-width) 1fr}}.shell-layout--collapsed-sidebar{grid-template-columns:0 1fr}@media (min-width: 992px){.shell-layout--collapsed-sidebar:not(.shell-layout--collapsing) .shell-layout__sidebar-wrapper.shell-layout__sidebar-wrapper--hovered .shell-layout__sidebar,.shell-layout--collapsed-sidebar:not(.shell-layout--collapsing) .shell-layout__sidebar-wrapper:focus-within .shell-layout__sidebar{width:var(--extended-sidebar-width);box-shadow:0 0.75rem 2rem rgba(25, 26, 28, 0.12),\n              0 0.25rem 0.75rem rgba(25, 26, 28, 0.08)}}.shell-layout--collapsed-sidebar .shell-layout__sidebar-wrapper{transform:translate3d(-100%, 0, 0)}.shell-layout--collapsed-sidebar .shell-layout__sidebar-wrapper .shell-layout__sidebar{width:100%;box-shadow:none}@media (min-width: 992px){.shell-layout--collapsed-sidebar .shell-layout__sidebar-wrapper{max-width:var(--collapsed-sidebar-width);flex-basis:var(--collapsed-sidebar-width);transform:none}.shell-layout--collapsed-sidebar .shell-layout__sidebar-wrapper:not(.shell-layout__sidebar-wrapper--hovered):not(:focus-within) .shell-layout__sidebar{box-shadow:none}.shell-layout--collapsed-sidebar .shell-layout__sidebar-wrapper:not(.shell-layout__sidebar-wrapper--hovered):not(:focus-within) .shell-layout__collapsed-logo{display:inline-flex;justify-content:center;align-items:center}.shell-layout--collapsed-sidebar .shell-layout__sidebar-wrapper:not(.shell-layout__sidebar-wrapper--hovered):not(:focus-within) .shell-layout__expanded-logo{display:none}.shell-layout--collapsed-sidebar .shell-layout__sidebar-wrapper:not(.shell-layout__sidebar-wrapper--hovered):not(:focus-within) .shell-layout__toggle{display:none}}@media (min-width: 992px){.shell-layout--collapsed-sidebar{grid-template-columns:var(--collapsed-sidebar-width) 1fr}}.shell-layout--hide-sidebar{grid-template-columns:1fr;grid-template-areas:\"banner\"\n    \"main\"}@media (min-width: 992px){.shell-layout--hide-sidebar{grid-template-columns:1fr}}.shell-layout__banner{grid-area:banner}.shell-layout__sidebar-wrapper{position:absolute;z-index:2;top:0;bottom:0;left:0;width:100%;max-width:var(--extended-sidebar-width);min-height:0;flex-basis:var(--extended-sidebar-width);flex-shrink:0;transition:max-width 0.2s, transform 0.2s;grid-area:sidebar}@media (min-width: 992px){.shell-layout__sidebar-wrapper{position:relative;inset:auto}}.shell-layout__sidebar{display:flex;width:var(--extended-sidebar-width);height:100%;border-right:var(--s-border-width-default) solid var(--s-border-default);flex-direction:column;transition:box-shadow 0.2s, width 0.2s;box-shadow:0 0.75rem 2rem rgba(25, 26, 28, 0.12),\n    0 0.25rem 0.75rem rgba(25, 26, 28, 0.08)}@media (min-width: 992px){.shell-layout__sidebar{box-shadow:none}}.shell-layout__header{flex-shrink:0;border-bottom:var(--s-border-width-default) solid var(--s-border-default);background-color:var(--s-background-default)}.shell-layout__logo-bar{display:flex;overflow:hidden;align-items:center;height:4.5rem}.shell-layout__expanded-logo{padding-right:var(--s-space-12);padding-left:var(--s-space-12);flex-grow:1}.shell-layout__collapsed-logo{display:none;padding-right:var(--s-space-12);padding-left:var(--s-space-12);flex-grow:1}.shell-layout__toggle{padding-right:var(--s-space-16);padding-left:var(--s-space-12);flex-grow:0;flex-shrink:0}.shell-layout__mobile-toggle{position:absolute;z-index:2;top:var(--s-space-12);left:calc(100% + var(--s-space-16))}@media (min-width: 992px){.shell-layout__mobile-toggle{display:none}}.shell-layout__main-navigation{overflow:auto;flex-grow:1;background-color:var(--s-background-default)}.shell-layout__main{min-height:0;background-color:var(--s-background-default);grid-area:main}.shell-layout__main>*,.shell-layout__main ::slotted(*){height:100%}.shell-layout__backdrop{position:fixed;z-index:1;background-color:rgba(0, 0, 0, 0.4);animation:shell-layout-backdrop-fade-in 0.1s;inset:0}@media (min-width: 992px){.shell-layout__backdrop{display:none}}.shell-layout__backdrop--fading{animation:shell-layout-backdrop-fade-out 0.2s}@keyframes shell-layout-backdrop-fade-in{from{opacity:0}to{opacity:1}}@keyframes shell-layout-backdrop-fade-out{from{opacity:1}to{opacity:0}}";
+const swirlShellLayoutCss = ".sc-swirl-shell-layout-h{--swirl-shell-background:var(--s-surface-sunken-default);--swirl-shell-text-color:var(--s-text-default);--swirl-shell-header-height:3.25rem;--swirl-shell-collapsed-nav-width:3.75rem;--swirl-shell-extended-nav-width:14rem;--swirl-shell-sidebar-width:21rem;display:flex;width:100%;height:100%}.sc-swirl-shell-layout-h *.sc-swirl-shell-layout{box-sizing:border-box}.shell-layout.sc-swirl-shell-layout{display:grid;width:100%;min-height:100%;background-color:var(--swirl-shell-background);transition:grid-template-columns 0.2s;grid-template-columns:0 1fr 0;grid-template-rows:1fr;grid-template-areas:\"nav main\"}@media (min-width: 992px){.shell-layout.sc-swirl-shell-layout{padding-right:var(--s-space-8);padding-bottom:var(--s-space-8);gap:var(--s-space-8);grid-template-columns:var(--swirl-shell-extended-nav-width) 1fr 0;grid-template-rows:var(--swirl-shell-header-height) 1fr;grid-template-areas:\"header header header\"\n      \"nav main sidebar\"}}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout{border-bottom:none;color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout{color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:hover{background-color:var(--s-action-primary-hovered)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:active{background-color:var(--s-action-primary-pressed)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout swirl-badge.sc-swirl-shell-layout{--swirl-badge-border-color:var(--s-action-primary-default)}.shell-layout--navigation-collapsed.sc-swirl-shell-layout .shell-layout__navigation-toggle.sc-swirl-shell-layout:hover swirl-icon-double-arrow-left.sc-swirl-shell-layout{display:none}.shell-layout--navigation-collapsed.sc-swirl-shell-layout .shell-layout__navigation-toggle.sc-swirl-shell-layout:hover swirl-icon-double-arrow-right.sc-swirl-shell-layout{display:inline-flex}@media (min-width: 992px){.shell-layout--navigation-collapsed.sc-swirl-shell-layout{grid-template-columns:var(--swirl-shell-collapsed-nav-width) 1fr 0}}@media (min-width: 1440px){.shell-layout--sidebar-active.shell-layout--navigation-collapsed.sc-swirl-shell-layout{grid-template-columns:var(--swirl-shell-collapsed-nav-width) 1fr var(\n          --swirl-shell-sidebar-width\n        )}}@media (min-width: 1440px){.shell-layout--sidebar-active.sc-swirl-shell-layout .shell-layout__main.sc-swirl-shell-layout{width:100%}}@media (min-width: 992px){.shell-layout--sidebar-active.sc-swirl-shell-layout .shell-layout__sidebar-body.sc-swirl-shell-layout{border:0.0625rem solid var(--s-border-default);transform:translate3d(0, 0, 0)}}@media (min-width: 1440px){.shell-layout--sidebar-active.sc-swirl-shell-layout{grid-template-columns:var(--swirl-shell-extended-nav-width) 1fr var(\n        --swirl-shell-sidebar-width\n      )}}.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout{transform:translate3d(0, 0, 0);box-shadow:var(--s-shadow-level-3)}@media (min-width: 992px){.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout{transform:none;box-shadow:none}}.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__mobile-nav-backdrop.sc-swirl-shell-layout{display:block}@media (min-width: 992px){.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__mobile-nav-backdrop.sc-swirl-shell-layout{display:none}}.shell-layout__header.sc-swirl-shell-layout{position:relative;display:none;width:calc(100% + var(--s-space-8));padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);justify-content:space-between;align-items:center;border-bottom:0.0625rem solid var(--s-border-default);color:var(--swirl-shell-text-color);grid-area:header}@media (min-width: 992px){.shell-layout__header.sc-swirl-shell-layout{display:flex}}.shell-layout__skip-link.sc-swirl-shell-layout{position:absolute;z-index:9;top:0;left:0;padding:var(--s-space-4);border:none;color:var(--swirl-shell-text-color);background-color:var(--swirl-shell-background);font:inherit;cursor:pointer}.shell-layout__skip-link.sc-swirl-shell-layout:not(:focus):not(:active){position:absolute;overflow:hidden;width:1px;height:1px;white-space:nowrap;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%)}.shell-layout__header-left.sc-swirl-shell-layout{display:flex;flex-basis:8rem;flex-shrink:0;gap:var(--s-space-8)}.shell-layout__header-right.sc-swirl-shell-layout{display:flex;flex-basis:8rem;flex-shrink:0;justify-content:flex-end;align-items:center;gap:var(--s-space-8)}.shell-layout__logo.sc-swirl-shell-layout{display:flex;flex-grow:1;justify-content:center;align-items:center}.shell-layout__logo.sc-swirl-shell-layout-s>img{max-height:1.75rem}.shell-layout__header-tool.sc-swirl-shell-layout{position:relative;width:2.25rem;height:2.25rem;padding:var(--s-space-8);border:none;border-radius:var(--s-border-radius-sm);color:var(--swirl-shell-text-color);background-color:var(--s-surface-sunken-default);font:inherit;cursor:pointer}.shell-layout__header-tool.sc-swirl-shell-layout:hover{background-color:var(--s-surface-sunken-hovered)}.shell-layout__header-tool.sc-swirl-shell-layout:active{background-color:var(--s-surface-sunken-pressed)}.shell-layout__header-tool.sc-swirl-shell-layout:focus{outline:none}.shell-layout__header-tool.sc-swirl-shell-layout:focus-visible{box-shadow:0 0 0 0.125rem var(--s-focus-default)}.shell-layout__header-tool.sc-swirl-shell-layout swirl-badge.sc-swirl-shell-layout{--swirl-badge-border-color:var(--s-surface-sunken-default);position:absolute;right:0;bottom:0;transform:translate3d(0.1875rem, 0, 0)}.shell-layout__sidebar-toggle.sc-swirl-shell-layout{display:none}@media (min-width: 992px){.shell-layout__sidebar-toggle.sc-swirl-shell-layout{display:block}}.shell-layout__navigation-toggle.sc-swirl-shell-layout:hover swirl-icon-menu.sc-swirl-shell-layout{display:none}.shell-layout__navigation-toggle.sc-swirl-shell-layout:hover swirl-icon-double-arrow-left.sc-swirl-shell-layout{display:inline-flex}.shell-layout__navigation-toggle.sc-swirl-shell-layout swirl-icon-double-arrow-right.sc-swirl-shell-layout,.shell-layout__navigation-toggle.sc-swirl-shell-layout swirl-icon-double-arrow-left.sc-swirl-shell-layout{display:none}.shell-layout__nav.sc-swirl-shell-layout{position:fixed;z-index:9;top:0;bottom:0;left:0;overflow:auto;width:100%;max-width:18.75rem;color:var(--swirl-shell-text-color);background-color:var(--s-surface-overlay-default);transition:transform 0.2s, box-shadow 0.2s;transform:translate3d(-100%, 0, 0);grid-area:nav}@media (min-width: 992px){.shell-layout__nav.sc-swirl-shell-layout{position:static;max-width:none;padding-top:0;padding-right:var(--s-space-4);padding-bottom:var(--s-space-8);padding-left:var(--s-space-12);background-color:var(--swirl-shell-background);transform:none;box-shadow:none;inset:auto}}.shell-layout__mobile-header.sc-swirl-shell-layout{display:flex;min-height:3.5rem;margin-bottom:var(--s-space-8);padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);justify-content:space-between;align-items:center;border-bottom:0.0625rem solid var(--s-border-default)}.shell-layout__mobile-header.sc-swirl-shell-layout-s>img{max-height:1.75rem}.shell-layout__mobile-header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout{background-color:var(--s-surface-overlay-default)}.shell-layout__mobile-header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:hover{background-color:var(--s-surface-overlay-hovered)}.shell-layout__mobile-header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:active{background-color:var(--s-surface-overlay-pressed)}@media (min-width: 992px){.shell-layout__mobile-header.sc-swirl-shell-layout{display:none}}.shell-layout__mobile-header-tools.sc-swirl-shell-layout{display:flex;justify-content:flex-end;align-items:center;gap:var(--s-space-8)}.shell-layout__nav-body.sc-swirl-shell-layout{padding:var(--s-space-8)}.shell-layout__nav-body.sc-swirl-shell-layout-s ul{margin:0;padding:0;list-style:none}.shell-layout__nav-body.sc-swirl-shell-layout-s li{display:flex}@media (min-width: 992px){.shell-layout__nav-body.sc-swirl-shell-layout{padding:0}}.shell-layout__mobile-nav-backdrop.sc-swirl-shell-layout{position:fixed;z-index:8;display:none;background-color:rgba(0, 0, 0, 0.25);animation:shell-layout-backdrop-fade-in 0.2s;inset:0}.shell-layout__main.sc-swirl-shell-layout{overflow:hidden;grid-area:main}@media (min-width: 992px){.shell-layout__main.sc-swirl-shell-layout{width:calc(100% + var(--s-space-8));border:0.0625rem solid var(--s-border-default);border-radius:var(--s-border-radius-sm)}}.shell-layout__sidebar.sc-swirl-shell-layout{position:relative;display:none;grid-area:sidebar}@media (min-width: 992px){.shell-layout__sidebar.sc-swirl-shell-layout{display:block}}@media (min-width: 1440px){.shell-layout__sidebar.sc-swirl-shell-layout{overflow:hidden}}.shell-layout__sidebar-body.sc-swirl-shell-layout{z-index:1;display:flex;width:var(--swirl-shell-sidebar-width);height:100%;border-radius:var(--s-border-radius-sm);background-color:var(--s-background-default);flex-direction:column}@media (min-width: 992px){.shell-layout__sidebar-body.sc-swirl-shell-layout{position:absolute;top:0;right:0;bottom:0;transition:transform 0.2s;transform:translate3d(calc(100% + var(--s-space-24)), 0, 0);box-shadow:var(--s-shadow-level-3)}}@media (min-width: 1440px){.shell-layout__sidebar-body.sc-swirl-shell-layout{position:relative;transform:none;box-shadow:none;inset:auto}}.shell-layout__sidebar-app-bar.sc-swirl-shell-layout{flex-grow:0;flex-shrink:0;border-bottom:var(--s-border-width-default) solid var(--s-border-default)}.shell-layout__sidebar-content.sc-swirl-shell-layout{overflow:auto;flex-grow:1}@keyframes shell-layout-backdrop-fade-in{from{opacity:0}to{opacity:1}}";
 
+const NAVIGATION_COLLAPSE_STORAGE_KEY = "SWIRL_SHELL_NAVIGATION_COLLAPSE_STATE";
+const SIDEBAR_STORAGE_KEY = "SWIRL_SHELL_SIDEBAR_STATE";
 const SwirlShellLayout = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.desktopMediaQuery = getDesktopMediaQuery();
-    this.desktopMediaQueryHandler = (event) => {
-      if (event.matches) {
-        this.expandLeftSidebar();
-      }
-      else {
-        this.collapseLeftSidebar();
-      }
+    this.sidebarToggleClick = createEvent(this, "sidebarToggleClick", 7);
+    this.skipLinkClick = createEvent(this, "skipLinkClick", 7);
+    this.onBrowserBackClick = () => {
+      history.back();
     };
-    this.collapseLeftSidebar = () => {
-      this.collapsedSidebar = true;
-      this.collapsing = true;
-      setTimeout(() => {
-        this.collapsing = false;
-        // Some browsers don't update the hovered state of an element correctly,
-        // if the element was moved and is no longer underneath the cursor.
-        // https://bugs.chromium.org/p/chromium/issues/detail?id=276329
-        this.sidebarHovered = false;
-      }, 200);
-    };
-    this.expandLeftSidebar = () => {
-      if (this.hideSidebar) {
-        return;
-      }
-      this.collapsedSidebar = false;
-    };
-    this.toggleSidebar = () => {
-      if (this.collapsedSidebar) {
-        this.expandLeftSidebar();
-      }
-      else {
-        this.collapseLeftSidebar();
-      }
-    };
-    this.onBackdropClick = () => {
-      if (!this.collapsedSidebar) {
-        this.collapseLeftSidebar();
-      }
+    this.onBrowserForwardClick = () => {
+      history.forward();
     };
-    this.onSidebarClick = () => {
-      if (this.collapsedSidebar) {
-        document.activeElement?.blur();
-        getActiveElement()?.blur();
-      }
+    this.onNavigationToggleClick = () => {
+      this.navigationCollapsed = !this.navigationCollapsed;
     };
-    this.onSidebarMouseEnter = () => {
-      this.sidebarHovered = true;
+    this.onNavigationClick = () => {
+      this.hideMobileNavigation();
     };
-    this.onSidebarMouseLeave = () => {
-      this.sidebarHovered = false;
-    };
-    this.hideSidebar = undefined;
-    this.mainNavigationLabel = "Main";
+    this.brandedHeader = undefined;
+    this.browserBackButtonLabel = "Navigate back";
+    this.browserForwardButtonLabel = "Navigate forward";
+    this.hideMobileNavigationButtonLabel = "Close navigation";
+    this.navigationLabel = "Main";
+    this.navigationToggleLabel = "Toggle navigation";
+    this.sidebarActive = undefined;
+    this.sidebarToggleBadge = undefined;
+    this.sidebarToggleBadgeAriaLabel = undefined;
+    this.sidebarToggleIcon = "notifications";
     this.sidebarToggleLabel = "Toggle sidebar";
-    this.collapsedSidebar = undefined;
-    this.collapsing = undefined;
-    this.sidebarHovered = undefined;
+    this.skipLinkLabel = "Skip to main content";
+    this.mobileNavigationActive = undefined;
+    this.navigationCollapsed = undefined;
   }
   componentWillLoad() {
-    if (!this.desktopMediaQuery.matches) {
-      this.collapseLeftSidebar();
+    const restoredSidebarState = localStorage.getItem(SIDEBAR_STORAGE_KEY) === "true";
+    this.sidebarActive =
+      this.sidebarActive === undefined
+        ? restoredSidebarState
+        : this.sidebarActive;
+    const restoredNavigationCollapseState = localStorage.getItem(NAVIGATION_COLLAPSE_STORAGE_KEY) === "true";
+    this.navigationCollapsed = restoredNavigationCollapseState;
+  }
+  componentDidLoad() {
+    this.focusTrap = createFocusTrap(this.navElement, {
+      allowOutsideClick: true,
+      tabbableOptions: {
+        getShadowRoot: (node) => {
+          return node.shadowRoot;
+        },
+      },
+    });
+  }
+  componentDidRender() {
+    this.focusTrap?.updateContainerElements(this.navElement);
+  }
+  disconnectedCallback() {
+    this.focusTrap?.deactivate();
+  }
+  onWindowKeyDown(event) {
+    if (event.key === "Escape" && this.mobileNavigationActive) {
+      this.hideMobileNavigation();
+    }
+  }
+  watchMobileNavigationState() {
+    if (this.mobileNavigationActive) {
+      // wait for animation
+      setTimeout(() => {
+        this.focusTrap.activate();
+      }, 200);
     }
-    this.desktopMediaQuery.onchange = this.desktopMediaQueryHandler;
+    else {
+      this.focusTrap.deactivate();
+    }
+  }
+  watchNavigationCollapsed() {
+    localStorage.setItem(NAVIGATION_COLLAPSE_STORAGE_KEY, String(this.navigationCollapsed));
+  }
+  watchSidebarActive() {
+    localStorage.setItem(SIDEBAR_STORAGE_KEY, String(this.sidebarActive));
   }
   /**
-   * Collapse the left sidebar.
+   * Opens the mobile navigation.
    */
-  async collapseSidebar() {
-    this.collapseLeftSidebar();
+  async showMobileNavigation() {
+    this.mobileNavigationActive = true;
   }
   /**
-   * Extend the left sidebar.
+   * Hides the mobile navigation.
    */
-  async extendSidebar() {
-    this.expandLeftSidebar();
+  async hideMobileNavigation() {
+    this.mobileNavigationActive = false;
   }
   render() {
     const className = classnames("shell-layout", {
-      "shell-layout--collapsed-sidebar": this.collapsedSidebar,
-      "shell-layout--collapsing": this.collapsing,
-      "shell-layout--hide-sidebar": this.hideSidebar,
-    });
-    const sidebarWrapperClassName = classnames("shell-layout__sidebar-wrapper", {
-      "shell-layout__sidebar-wrapper--hovered": this.sidebarHovered,
-    });
-    const backdropClassName = classnames("shell-layout__backdrop", {
-      "shell-layout__backdrop--fading": this.collapsing,
+      "shell-layout--branded-header": this.brandedHeader,
+      "shell-layout--mobile-navigation-active": this.mobileNavigationActive,
+      "shell-layout--navigation-collapsed": this.navigationCollapsed,
+      "shell-layout--sidebar-active": this.sidebarActive,
     });
-    return (h(Host, null, h("div", { class: className }, h("div", { class: "shell-layout__banner" }, h("slot", { name: "banner" })), h("div", { class: sidebarWrapperClassName, onClick: this.onSidebarClick, onMouseEnter: this.onSidebarMouseEnter, onMouseLeave: this.onSidebarMouseLeave }, !this.hideSidebar && (h("div", { class: "shell-layout__sidebar" }, h("header", { class: "shell-layout__header" }, h("div", { class: "shell-layout__logo-bar" }, h("div", { class: "shell-layout__expanded-logo" }, h("slot", { name: "logo-expanded" })), h("div", { class: "shell-layout__collapsed-logo" }, h("slot", { name: "logo-collapsed" })), h("div", { class: "shell-layout__toggle" }, h("swirl-button", { swirlAriaExpanded: String(!this.collapsedSidebar), hideLabel: true, icon: this.collapsedSidebar
-        ? "<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>"
-        : "<swirl-icon-double-arrow-left></swirl-icon-double-arrow-left>", label: this.sidebarToggleLabel, onClick: this.toggleSidebar }))), h("div", { class: "shell-layout__tools" }, h("slot", { name: "tools" }))), h("nav", { "aria-label": this.mainNavigationLabel, class: "shell-layout__main-navigation" }, h("slot", { name: "main-navigation" }))))), h("main", { class: "shell-layout__main" }, h("slot", { name: "main" })), (!this.collapsedSidebar || this.collapsing) && (h("div", { class: backdropClassName, onClick: this.onBackdropClick })))));
+    return (h(Host, null, h("div", { class: className }, h("header", { class: "shell-layout__header", "data-tauri-drag-region": "true" }, h("button", { class: "shell-layout__skip-link", onClick: this.skipLinkClick.emit, type: "button" }, this.skipLinkLabel), h("div", { class: "shell-layout__header-left" }, h("button", { class: "shell-layout__header-tool shell-layout__navigation-toggle", onClick: this.onNavigationToggleClick, type: "button" }, h("swirl-icon-menu", { size: 20 }), h("swirl-icon-double-arrow-left", { size: 20 }), h("swirl-icon-double-arrow-right", { size: 20 }), h("swirl-visually-hidden", null, this.navigationToggleLabel)), h("button", { class: "shell-layout__header-tool", onClick: this.onBrowserBackClick, type: "button" }, h("swirl-icon-arrow-back", { size: 20 }), h("swirl-visually-hidden", null, this.browserBackButtonLabel)), h("button", { class: "shell-layout__header-tool", onClick: this.onBrowserForwardClick, type: "button" }, h("swirl-icon-arrow-forward", { size: 20 }), h("swirl-visually-hidden", null, this.browserForwardButtonLabel))), h("div", { class: "shell-layout__logo" }, h("slot", { name: "logo" })), h("div", { class: "shell-layout__header-right" }, h("button", { class: "shell-layout__header-tool shell-layout__sidebar-toggle", onClick: this.sidebarToggleClick.emit, type: "button" }, h("swirl-icon", { glyph: this.sidebarToggleIcon, size: 20 }), h("swirl-visually-hidden", null, this.sidebarToggleLabel), this.sidebarToggleBadge && (h("swirl-badge", { "aria-label": this.sidebarToggleBadgeAriaLabel, label: this.sidebarToggleBadge, size: "xs" }))), h("slot", { name: "header-tools" }))), h("div", { class: "shell-layout__mobile-nav-backdrop", onClick: this.onNavigationClick }), h("nav", { "aria-labelledby": "main-navigation-label", class: "shell-layout__nav", onClick: this.onNavigationClick, ref: (el) => (this.navElement = el) }, h("div", { class: "shell-layout__mobile-header" }, h("slot", { name: "mobile-logo" }), h("div", { class: "shell-layout__mobile-header-tools" }, h("slot", { name: "mobile-header-tools" }), h("button", { class: "shell-layout__header-tool", type: "button" }, h("swirl-icon-double-arrow-left", { size: 20 }), h("swirl-visually-hidden", null, this.hideMobileNavigationButtonLabel)))), h("div", { class: "shell-layout__nav-body" }, h("swirl-visually-hidden", null, h("span", { id: "main-navigation-label" }, this.navigationLabel)), h("slot", { name: "nav" }))), h("main", { class: "shell-layout__main", id: "main-content" }, h("slot", null)), h("aside", { class: "shell-layout__sidebar" }, h("div", { class: "shell-layout__sidebar-body" }, h("div", { class: "shell-layout__sidebar-app-bar" }, h("slot", { name: "sidebar-app-bar" })), h("div", { class: "shell-layout__sidebar-content" }, h("slot", { name: "sidebar" })))))));
   }
+  static get watchers() { return {
+    "mobileNavigationActive": ["watchMobileNavigationState"],
+    "navigationCollapsed": ["watchNavigationCollapsed"],
+    "sidebarActive": ["watchSidebarActive"]
+  }; }
 };
 SwirlShellLayout.style = swirlShellLayoutCss;
 

package/dist/esm/swirl-shell-navigation-item.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-99d0060d.js';
 import { c as classnames } from './index-d280dafb.js';
 
-const swirlShellNavigationItemCss = "/**\n* seems the container query does not work as expected\n*/\n\n:host {\n  container-type: inline-size;\n  position: relative;\n  display: inline-flex;\n  width: 100%;\n  height: 3.5rem;\n  padding-right: var(--s-space-12);\n  padding-left: var(--s-space-12);\n  flex-shrink: 0;\n  justify-content: flex-start;\n  align-items: center;\n  color: var(--s-text-default);\n  background-color: var(--s-background-default);\n  font-size: var(--s-font-size-sm);\n  font-weight: var(--s-font-weight-medium);\n  line-height: var(--s-line-height-sm);\n  cursor: pointer;\n  gap: var(--s-space-12);\n}\n\n:host(:hover) {\n    background-color: var(--s-background-hovered);\n  }\n\n:host(:active) {\n    background-color: var(--s-background-pressed);\n    color: var(--s-text-highlight);\n  }\n\n:host(:focus) {\n    outline: none;\n  }\n\n:host(:focus-visible) .shell-navigation-item__label {\n      border-radius: var(--s-border-radius-xs);\n      box-shadow: 0 0 0 0.125rem var(--s-focus-default);\n    }\n\n:host(.shell-navigation-item--active) {\n    color: var(--s-text-highlight);\n    background-color: var(--s-surface-raised-default);\n  }\n\n:host(.shell-navigation-item--active:hover) {\n    background-color: var(--s-surface-raised-hovered);\n  }\n\n:host(.shell-navigation-item--active:active) {\n    background-color: var(--s-surface-raised-pressed);\n    color: var(--s-text-highlight);\n  }\n\n:host * {\n    box-sizing: border-box;\n  }\n\n:host:before {\n  content: \"\";\n  display: none;\n  position: absolute;\n  left: 0;\n  height: 2.5rem;\n  width: 4px;\n  background-color: var(--s-icon-highlight);\n  border-top-right-radius: 4px;\n  border-bottom-right-radius: 4px;\n}\n\n:host(.shell-navigation-item--active):before {\n  display: block;\n}\n\n.shell-navigation-item__icon {\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  min-width: 2.5rem;\n  min-height: 2.5rem;\n}\n\n.shell-navigation-item__label {\n  overflow: hidden;\n  min-width: 0;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n@container (max-width: 4rem) {\n  .shell-navigation-item__label {\n    display: none;\n  }\n\n  .shell-navigation-item__badge {\n    position: absolute;\n    bottom: 0;\n    right: var(--s-space-4);\n  }\n}\n\n@container (min-width: 14rem) {\n  .shell-navigation-item__badge {\n    margin-left: auto;\n    padding-right: var(--s-space-4);\n  }\n}\n";
+const swirlShellNavigationItemCss = "/**\n* seems the container query does not work as expected\n*/\n\n:host {\n  position: relative;\n  display: inline-flex;\n  width: 100%;\n  height: 2.75rem;\n  padding: var(--s-space-12);\n  flex-shrink: 0;\n  justify-content: flex-start;\n  align-items: center;\n  border-radius: var(--s-border-radius-sm);\n  background-color: var(--s-surface-overlay-default);\n  font-size: var(--s-font-size-sm);\n  font-weight: var(--s-font-weight-medium);\n  line-height: var(--s-line-height-sm);\n  cursor: pointer;\n  container-type: inline-size;\n  gap: var(--s-space-16);\n}\n\n:host(:hover) {\n    background-color: var(--s-surface-sunken-hovered);\n  }\n\n:host(:hover) .shell-navigation-item__badge {\n      --swirl-badge-border-color: var(--s-surface-sunken-hovered);\n    }\n\n:host(:active) {\n    background-color: var(--s-surface-sunken-pressed);\n  }\n\n:host(:active) .shell-navigation-item__badge {\n      --swirl-badge-border-color: var(--s-surface-sunken-pressed);\n    }\n\n:host(:focus) {\n    outline: none;\n  }\n\n:host(:focus-visible) {\n    z-index: 1;\n    box-shadow: 0 0 0 0.125rem var(--s-focus-default);\n  }\n\n:host(.shell-navigation-item--active) {\n    background-color: var(--s-surface-sunken-hovered);\n  }\n\n:host(.shell-navigation-item--active) .shell-navigation-item__badge {\n      --swirl-badge-border-color: var(--s-surface-sunken-hovered);\n    }\n\n:host(.shell-navigation-item--active:hover) {\n    background-color: var(--s-surface-sunken-hovered);\n  }\n\n:host(.shell-navigation-item--active:hover) .shell-navigation-item__badge {\n      --swirl-badge-border-color: var(--s-surface-sunken-hovered);\n    }\n\n:host(.shell-navigation-item--active:active) {\n    background-color: var(--s-surface-sunken-pressed);\n  }\n\n:host(.shell-navigation-item--active:active) .shell-navigation-item__badge {\n      --swirl-badge-border-color: var(--s-surface-sunken-pressed);\n    }\n\n:host * {\n    box-sizing: border-box;\n  }\n\n@media (min-width: 992px) {\n\n:host {\n    background-color: var(--s-surface-sunken-default)\n}\n  }\n\n.shell-navigation-item__icon {\n  display: inline-flex;\n  min-width: 1.25rem;\n  min-height: 1.25rem;\n  justify-content: center;\n  align-items: center;\n}\n\n.shell-navigation-item__label {\n  overflow: hidden;\n  min-width: 0;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n.shell-navigation-item__badge {\n  --swirl-badge-border-color: var(--swirl-shell-background);\n}\n\n@container (max-width: 4rem) {\n  .shell-navigation-item__label {\n    display: none;\n  }\n\n  .shell-navigation-item__badge {\n    position: absolute;\n    right: var(--s-space-4);\n    bottom: 0;\n  }\n}\n\n@container (min-width: 14rem) {\n  .shell-navigation-item__badge {\n    margin-left: auto;\n    padding-right: var(--s-space-4);\n  }\n}\n";
 
 const SwirlShellNavigationItem = class {
   constructor(hostRef) {

package/dist/esm/swirl-visually-hidden.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, H as Host } from './index-99d0060d.js';
 
-const swirlVisuallyHiddenCss = ":host{position:absolute;display:inline;overflow:hidden;width:1px;height:1px;margin:-1px;padding:0;border:0;white-space:nowrap;word-wrap:normal;clip:rect(0, 0, 0, 0)}";
+const swirlVisuallyHiddenCss = ".sc-swirl-visually-hidden-h{position:absolute;display:inline;overflow:hidden;width:1px;height:1px;margin:-1px;padding:0;border:0;white-space:nowrap;word-wrap:normal;clip:rect(0, 0, 0, 0)}";
 
 const SwirlVisuallyHidden = class {
   constructor(hostRef) {

package/dist/swirl-components/p-08fd60a5.entry.js

@@ -0,0 +1 @@
+import{r as s,h as t,F as i}from"./p-3fca9a05.js";import{c as l}from"./p-b7898321.js";const C=class{constructor(t){s(this,t),this.size=24}render(){const s=20===this.size?24:this.size,C=l("swirl-icon",`swirl-icon--size-${this.size}`);return t("svg",{class:C,fill:"none",height:this.size,part:"icon",viewBox:`0 0 ${s} ${s}`,width:this.size,xmlns:"http://www.w3.org/2000/svg"},16===this.size&&t(i,null,t("path",{d:"M3.33333 14C2.96667 14 2.65278 13.8694 2.39167 13.6083C2.13056 13.3472 2 13.0333 2 12.6667V3.33333C2 2.96667 2.13056 2.65278 2.39167 2.39167C2.65278 2.13056 2.96667 2 3.33333 2H12.6667C13.0333 2 13.3472 2.13056 13.6083 2.39167C13.8694 2.65278 14 2.96667 14 3.33333V12.6667C14 13.0333 13.8694 13.3472 13.6083 13.6083C13.3472 13.8694 13.0333 14 12.6667 14H3.33333ZM5.33333 12.6667V3.33333H3.33333V12.6667H5.33333ZM6.66667 12.6667H12.6667V3.33333H6.66667V12.6667Z",fill:"currentColor"})),(20===this.size||24===this.size)&&t(i,null,t("path",{d:"M5 21C4.45 21 3.97917 20.8042 3.5875 20.4125C3.19583 20.0208 3 19.55 3 19V5C3 4.45 3.19583 3.97917 3.5875 3.5875C3.97917 3.19583 4.45 3 5 3H19C19.55 3 20.0208 3.19583 20.4125 3.5875C20.8042 3.97917 21 4.45 21 5V19C21 19.55 20.8042 20.0208 20.4125 20.4125C20.0208 20.8042 19.55 21 19 21H5ZM8 19V5H5V19H8ZM10 19H19V5H10V19Z",fill:"currentColor"})),28===this.size&&t(i,null,t("path",{d:"M5.83333 24.5C5.19167 24.5 4.64236 24.2715 4.18542 23.8146C3.72847 23.3576 3.5 22.8083 3.5 22.1667V5.83333C3.5 5.19167 3.72847 4.64236 4.18542 4.18542C4.64236 3.72847 5.19167 3.5 5.83333 3.5H22.1667C22.8083 3.5 23.3576 3.72847 23.8146 4.18542C24.2715 4.64236 24.5 5.19167 24.5 5.83333V22.1667C24.5 22.8083 24.2715 23.3576 23.8146 23.8146C23.3576 24.2715 22.8083 24.5 22.1667 24.5H5.83333ZM9.33333 22.1667V5.83333H5.83333V22.1667H9.33333ZM11.6667 22.1667H22.1667V5.83333H11.6667V22.1667Z",fill:"currentColor"})))}};C.style=":host{display:inline-flex}";export{C as swirl_icon_dock_left}

package/dist/swirl-components/p-0ac2eb84.entry.js

@@ -0,0 +1 @@
+import{r as t,c as i,h as a,H as e,g as o,F as s}from"./p-3fca9a05.js";import{c as r}from"./p-b7898321.js";import{i as l,g as n}from"./p-6e4e9ae0.js";import{S as p}from"./p-1486d7ea.js";import{v as d}from"./p-19b890a3.js";const c=class{constructor(a){t(this,a),this.ctaClick=i(this,"ctaClick",7),this.mobileViewChange=i(this,"mobileViewChange",7),this.navigationBackButtonClick=i(this,"navigationBackButtonClick",7),this.sidebarToggle=i(this,"sidebarToggle",7),this.onBackToNavigationViewButtonClick=()=>{this.changeMobileView("navigation")},this.onCtaClick=t=>{this.ctaClick.emit(t)},this.onNavigationBackButtonClick=t=>{this.navigationBackButtonClick.emit(t)},this.onSidebarCloseButtonClick=()=>{this.hideSidebar()},this.appName=void 0,this.backToNavigationViewButtonLabel="Back to navigation",this.ctaIcon=void 0,this.ctaLabel=void 0,this.hideAppBar=void 0,this.navigationBackButtonLabel="Go back",this.navigationLabel=void 0,this.showNavigationBackButton=void 0,this.sidebarCloseButtonLabel="Close sidebar",this.sidebarHeading=void 0,this.transitionStyle="slides",this.hasCustomAppBarBackButton=void 0,this.hasNavigation=void 0,this.hasSidebar=void 0,this.mobileView="navigation",this.sidebarActive=void 0,this.sidebarClosing=void 0,this.transitioningFrom=void 0,this.transitioningTo=void 0}componentWillLoad(){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()}))}disconnectedCallback(){this.mutationObserver?.disconnect()}watchMobileView(){this.checkMobileView()}async showSidebar(){!this.sidebarActive&&this.hasSidebar&&(this.sidebarActive=!0,this.changeMobileView("sidebar"),this.sidebarToggle.emit(!0))}async hideSidebar(){if(!this.sidebarActive||!this.hasSidebar)return;Boolean(this.sidebarClosingTimeout)&&clearTimeout(this.sidebarClosingTimeout),this.sidebarClosing=!0;const t=l()?0:300;this.sidebarClosingTimeout=setTimeout((()=>{this.sidebarActive=!1,this.sidebarClosing=!1,this.changeMobileView("body"),this.sidebarToggle.emit(!1)}),t)}async toggleSidebar(){this.hasSidebar&&(this.sidebarActive?this.hideSidebar():this.showSidebar())}async changeMobileView(t,i=!0){if(this.mobileView===t||"navigation"===t&&!this.hasNavigation||"sidebar"===t&&!this.hasSidebar)return;if(!l()||!i)return this.mobileView=t,void this.mobileViewChange.emit(this.mobileView);Boolean(this.transitionTimeout)&&clearTimeout(this.transitionTimeout),this.transitioningFrom=this.mobileView,this.transitioningTo=t;let a=0;"slides"===this.transitionStyle?a=400:"dialog"===this.transitionStyle&&(a=300),this.transitionTimeout=setTimeout((()=>{this.mobileView=t,this.transitioningFrom=void 0,this.transitioningTo=void 0,this.mobileViewChange.emit(this.mobileView)}),a)}checkMobileView(){if("navigation"===this.mobileView&&!this.hasNavigation||"sidebar"===this.mobileView&&!this.hasSidebar)return void(this.mobileView="body");const t="sidebar"===this.mobileView||this.sidebarActive;t!==this.sidebarActive&&(t?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"]'))}render(){const t=("body"===this.mobileView||this.transitioningTo)&&this.hasNavigation&&!this.hasCustomAppBarBackButton,i=Boolean(this.el.querySelector('[slot="app-bar-controls"]')),o=Boolean(this.el.querySelector('[slot="app-bar-mobile-menu-button"]')),s=r("app-layout",`app-layout--mobile-view-${this.mobileView}`,`app-layout--transitioning-from-${this.transitioningFrom}`,`app-layout--transitioning-to-${this.transitioningTo}`,`app-layout--transition-style-${this.transitionStyle}`,{"app-layout--has-app-bar-mobile-menu-button":o,"app-layout--has-app-bar-controls":i,"app-layout--has-custom-app-bar-back-button":this.hasCustomAppBarBackButton,"app-layout--has-navigation":this.hasNavigation,"app-layout--has-sidebar":this.hasSidebar,"app-layout--hide-app-bar":this.hideAppBar,"app-layout--sidebar-active":"sidebar"===this.mobileView||this.sidebarActive,"app-layout--sidebar-closing":this.sidebarClosing});return a(e,null,a("section",{"aria-labelledby":"app-name",class:s,role:"document",tabIndex:0},a("div",{class:"app-layout__grid"},a("header",{class:"app-layout__header"},a("span",{class:"app-layout__navigation-mobile-menu-button"},a("slot",{name:"navigation-mobile-menu-button"})),this.showNavigationBackButton&&a("span",{class:"app-layout__navigation-back-button"},a("swirl-button",{hideLabel:!0,icon:"<swirl-icon-arrow-back></swirl-icon-arrow-back>",label:this.navigationBackButtonLabel,onClick:this.onNavigationBackButtonClick})),a("swirl-heading",{as:"h1",class:"app-layout__app-name",headingId:"app-name",level:3,text:this.appName}),this.hasNavigation&&a("span",{class:"app-layout__navigation-controls"},a("slot",{name:"navigation-controls"}))),a("nav",{"aria-label":this.navigationLabel,class:"app-layout__navigation"},a("slot",{name:"navigation"})),a("section",{"aria-labelledby":"app-name",class:"app-layout__body"},!this.hideAppBar&&a("header",{class:"app-layout__app-bar"},a("span",{class:"app-layout__app-bar-mobile-menu-button"},a("slot",{name:"app-bar-mobile-menu-button"})),t&&a("span",{class:"app-layout__back-to-navigation-button"},a("swirl-button",{hideLabel:!0,icon:"dialog"===this.transitionStyle?"<swirl-icon-close></swirl-icon-close>":"<swirl-icon-arrow-back></swirl-icon-arrow-back>",label:this.backToNavigationViewButtonLabel,onClick:this.onBackToNavigationViewButtonClick})),a("span",{class:"app-layout__custom-app-bar-back-button"},a("slot",{name:"custom-app-bar-back-button"})),a("div",{class:"app-layout__app-bar-content"},a("slot",{name:"app-bar"})),a("div",{class:"app-layout__app-bar-controls"},a("slot",{name:"app-bar-controls"}))),a("div",{class:"app-layout__banner"},a("slot",{name:"banner"})),a("div",{class:"app-layout__content"},a("slot",{name:"content"}))),a("aside",{class:"app-layout__sidebar"},a("header",{class:"app-layout__sidebar-header"},a("swirl-button",{class:"app-layout__sidebar-close-button",hideLabel:!0,icon:"<swirl-icon-close></swirl-icon-close>",label:this.sidebarCloseButtonLabel,onClick:this.onSidebarCloseButtonClick}),a("swirl-heading",{as:"h3",class:"app-layout__sidebar-heading",headingId:"sidebar-heading",level:3,text:this.sidebarHeading})),a("div",{class:"app-layout__sidebar-content"},a("slot",{name:"sidebar"}))),this.ctaLabel&&a("span",{class:"app-layout__floating-cta"},a("swirl-button",{hideLabel:Boolean(this.ctaIcon),icon:this.ctaIcon,intent:"primary",label:this.ctaLabel,onClick:this.onCtaClick,variant:"floating"})))))}get el(){return o(this)}static get watchers(){return{mobileView:["watchMobileView"]}}};c.style=':host{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:3.5625rem 1fr;grid-template-areas:"body"\n    "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"\n      "navigation"}@media (min-width: 768px){.app-layout--has-navigation .app-layout__grid{grid-template-columns:min(50%, 25rem) 1fr;grid-template-areas:"header body"\n        "navigation body"}}@media (min-width: 768px){.app-layout--has-navigation .app-layout__app-bar-mobile-menu-button{display:none}}@media (min-width: 768px){.app-layout--has-sidebar:not(.app-layout--has-navigation).app-layout--sidebar-active .app-layout__grid{animation:app-layout-no-nav-sidebar-slide-in 0.3s}}@media (min-width: 768px){.app-layout--has-sidebar:not(.app-layout--has-navigation).app-layout--sidebar-closing .app-layout__grid{animation:app-layout-no-nav-sidebar-slide-out 0.3s}}@media (min-width: 768px){.app-layout--has-sidebar.app-layout--sidebar-active .app-layout__grid{grid-template-columns:1fr min(50%, 25rem);grid-template-areas:"body sidebar"\n          "body sidebar"}}.app-layout--has-sidebar .app-layout__grid{grid-template-columns:100%;grid-template-areas:"body"\n      "body"}@media (min-width: 1800px){.app-layout--has-navigation.app-layout--has-sidebar.app-layout--sidebar-active .app-layout__grid{animation:app-layout-sidebar-slide-in 0.3s;grid-template-columns:25rem 1fr 25rem;grid-template-areas:"header body sidebar"\n          "navigation body sidebar"}}@media (min-width: 1440px){.app-layout--has-navigation.app-layout--has-sidebar.app-layout--sidebar-closing .app-layout__grid{animation:app-layout-sidebar-slide-out 0.3s}}@media (min-width: 768px){.app-layout--has-navigation.app-layout--has-sidebar .app-layout__grid{grid-template-columns:min(50%, 25rem) 1fr;grid-template-areas:"header body"\n        "navigation body"}}@media (min-width: 992px){.app-layout--has-navigation.app-layout--has-sidebar .app-layout__grid{grid-template-columns:25rem 1fr;grid-template-areas:"header body"\n        "navigation body"}}@media (min-width: 768px) and (max-width: 1799px){.app-layout--has-navigation.app-layout--has-sidebar .app-layout__sidebar{position:absolute;top:0;right:0;bottom:0;width:min(40%, 25rem);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"\n        "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"\n        "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"\n        "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) .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 (min-width: 1800px){.app-layout--sidebar-closing .app-layout__sidebar{animation:none}}.app-layout--has-app-bar-controls .app-layout__app-bar-controls{display:block}.app-layout--has-custom-app-bar-back-button .app-layout__custom-app-bar-back-button{display:block}.app-layout--hide-app-bar .app-layout__body{grid-template-rows:auto 1fr;grid-template-areas:"banner"\n      "content"}.app-layout__header{z-index:1;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 var(--s-border-default);background-color:var(--s-background-default);grid-area:header;will-change:transform;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)}@media (min-width: 768px){.app-layout__app-bar-mobile-menu-button{padding-left:0}}.app-layout__navigation-back-button{margin-left:calc(-1 * var(--s-space-4))}.app-layout__floating-cta{position:absolute;z-index:4;right:var(--s-space-16);bottom:var(--s-space-16)}.app-layout__navigation-controls{flex-shrink:0}.app-layout__navigation{z-index:1;overflow-y:auto;border-right:var(--s-border-width-default) solid var(--s-border-default);background-color:var(--s-background-default);grid-area:navigation;will-change:transform}.app-layout__body{z-index:2;display:grid;width:100%;height:100%;grid-area:body;grid-template-rows:minmax(3.5rem, auto) auto 1fr;grid-template-areas:"app-bar"\n    "banner"\n    "content";will-change:transform}.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 var(--s-border-default);background-color:var(--s-background-default);grid-area:app-bar;gap:var(--s-space-8)}.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;background-color:var(--s-background-default);grid-area:content}.app-layout__sidebar{z-index:3;display:grid;width:100%;height:100%;border-left:var(--s-border-width-default) solid var(--s-border-default);will-change:transform;grid-area:sidebar;grid-template-rows:3.5625rem 1fr;grid-template-areas:"sidebar-header"\n    "sidebar-content"}@media (min-width: 768px){.app-layout__sidebar{animation:app-layout-slide-in 0.3s}}@media (min-width: 1800px){.app-layout__sidebar{width:25rem;animation:none}}.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 var(--s-border-default);background-color:var(--s-background-default);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;background-color:var(--s-background-default);grid-area:sidebar-content}@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"\n          "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"\n          "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}.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}.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 (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}.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}.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 (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 (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 (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-out{from{overflow:hidden;grid-template-columns:25rem 1fr 25rem}to{overflow:hidden;grid-template-columns:25rem 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}}';const u=class{constructor(i){t(this,i),this.heading=void 0,this.illustration=void 0}render(){return a(e,null,a("div",{class:"empty-state"},this.illustration&&a("img",{alt:"",class:"empty-state__illustration",src:this.illustration}),a("div",{class:"empty-state__body"},this.heading&&a("swirl-heading",{align:"center",as:"p",level:4,text:this.heading}),a("div",{class:"empty-state__content"},a("swirl-text",{align:"center",color:"subdued"},a("slot",null))))))}};u.style=":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__illustration{max-width:16rem}.empty-state__body{display:flex;align-items:center;flex-direction:column;gap:var(--s-space-8)}";const m=class{constructor(i){t(this,i),this.size=24}render(){const t=20===this.size?24:this.size,i=r("swirl-icon",`swirl-icon--size-${this.size}`);return a("svg",{class:i,fill:"none",height:this.size,part:"icon",viewBox:`0 0 ${t} ${t}`,width:this.size,xmlns:"http://www.w3.org/2000/svg"},16===this.size&&a(s,null,a("path",{d:"M3.99999 1.33334C3.26666 1.33334 2.67332 1.93334 2.67332 2.66668L2.66666 13.3333C2.66666 14.0667 3.25999 14.6667 3.99332 14.6667H12C12.7333 14.6667 13.3333 14.0667 13.3333 13.3333V5.88668C13.3333 5.53334 13.1933 5.19334 12.94 4.94668L9.71999 1.72668C9.47332 1.47334 9.13332 1.33334 8.77999 1.33334H3.99999ZM8.66666 5.33334V2.33334L12.3333 6.00001H9.33332C8.96666 6.00001 8.66666 5.70001 8.66666 5.33334Z",fill:"currentColor"})),(20===this.size||24===this.size)&&a(s,null,a("path",{d:"M6 2C4.9 2 4.01 2.9 4.01 4L4 20C4 21.1 4.89 22 5.99 22H18C19.1 22 20 21.1 20 20V8.83C20 8.3 19.79 7.79 19.41 7.42L14.58 2.59C14.21 2.21 13.7 2 13.17 2H6ZM13 8V3.5L18.5 9H14C13.45 9 13 8.55 13 8Z",fill:"currentColor"})),28===this.size&&a(s,null,a("path",{d:"M6.99999 2.33334C5.71666 2.33334 4.67832 3.38334 4.67832 4.66668L4.66666 23.3333C4.66666 24.6167 5.70499 25.6667 6.98832 25.6667H21C22.2833 25.6667 23.3333 24.6167 23.3333 23.3333V10.3017C23.3333 9.68334 23.0883 9.08834 22.645 8.65668L17.01 3.02168C16.5783 2.57834 15.9833 2.33334 15.365 2.33334H6.99999ZM15.1667 9.33334V4.08334L21.5833 10.5H16.3333C15.6917 10.5 15.1667 9.97501 15.1667 9.33334Z",fill:"currentColor"})))}};m.style=":host{display:inline-flex}";const h=class{constructor(i){t(this,i),this.size=24}render(){const t=20===this.size?24:this.size,i=r("swirl-icon",`swirl-icon--size-${this.size}`);return a("svg",{class:i,fill:"none",height:this.size,part:"icon",viewBox:`0 0 ${t} ${t}`,width:this.size,xmlns:"http://www.w3.org/2000/svg"},16===this.size&&a(s,null,a("path",{d:"M13.3333 3.99996H8.00001L7.06001 3.05996C6.80668 2.80663 6.46668 2.66663 6.11334 2.66663H2.66668C1.93334 2.66663 1.34001 3.26663 1.34001 3.99996L1.33334 12C1.33334 12.7333 1.93334 13.3333 2.66668 13.3333H13.3333C14.0667 13.3333 14.6667 12.7333 14.6667 12V5.33329C14.6667 4.59996 14.0667 3.99996 13.3333 3.99996ZM10 5.99996C10.7333 5.99996 11.3333 6.59996 11.3333 7.33329C11.3333 8.06663 10.7333 8.66663 10 8.66663C9.26668 8.66663 8.66668 8.06663 8.66668 7.33329C8.66668 6.59996 9.26668 5.99996 10 5.99996ZM12.6667 11.3333H7.33334V10.6666C7.33334 9.77996 9.11334 9.33329 10 9.33329C10.8867 9.33329 12.6667 9.77996 12.6667 10.6666V11.3333Z",fill:"currentColor"})),(20===this.size||24===this.size)&&a(s,null,a("path",{d:"M20 6H12L10.59 4.59C10.21 4.21 9.7 4 9.17 4H4C2.9 4 2.01 4.9 2.01 6L2 18C2 19.1 2.9 20 4 20H20C21.1 20 22 19.1 22 18V8C22 6.9 21.1 6 20 6ZM15 9C16.1 9 17 9.9 17 11C17 12.1 16.1 13 15 13C13.9 13 13 12.1 13 11C13 9.9 13.9 9 15 9ZM19 17H11V16C11 14.67 13.67 14 15 14C16.33 14 19 14.67 19 16V17Z",fill:"currentColor"})),28===this.size&&a(s,null,a("path",{d:"M23.3333 6.99996H14L12.355 5.35496C11.9117 4.91163 11.3167 4.66663 10.6983 4.66663H4.66668C3.38334 4.66663 2.34501 5.71663 2.34501 6.99996L2.33334 21C2.33334 22.2833 3.38334 23.3333 4.66668 23.3333H23.3333C24.6167 23.3333 25.6667 22.2833 25.6667 21V9.33329C25.6667 8.04996 24.6167 6.99996 23.3333 6.99996ZM17.5 10.5C18.7833 10.5 19.8333 11.55 19.8333 12.8333C19.8333 14.1166 18.7833 15.1666 17.5 15.1666C16.2167 15.1666 15.1667 14.1166 15.1667 12.8333C15.1667 11.55 16.2167 10.5 17.5 10.5ZM22.1667 19.8333H12.8333V18.6666C12.8333 17.115 15.9483 16.3333 17.5 16.3333C19.0517 16.3333 22.1667 17.115 22.1667 18.6666V19.8333Z",fill:"currentColor"})))}};h.style=":host{display:inline-flex}";const b=class{constructor(a){t(this,a),this.itemDrop=i(this,"itemDrop",7),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("ArrowDown"===t.code)t.preventDefault(),Boolean(this.dragging)?this.moveDraggedItemDown():this.focusItemAtIndex((this.focusedIndex+1)%this.items.length);else if("ArrowUp"===t.code)t.preventDefault(),Boolean(this.dragging)?this.moveDraggedItemUp():this.focusItemAtIndex(0===this.focusedIndex?this.items.length-1:this.focusedIndex-1);else if("Space"===t.code||"Enter"===t.code){const i=t.composedPath()[0];Boolean(this.dragging)&&!i?.classList.contains("resource-list-item__drag-handle")&&(t.preventDefault(),this.stopDrag(this.dragging))}else"Home"===t.code?(t.preventDefault(),this.focusItemAtIndex(0)):"End"===t.code&&(t.preventDefault(),this.focusItemAtIndex(this.items.length-1))},this.allowDrag=void 0,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.label=void 0,this.assistiveText=void 0}componentDidLoad(){this.observeSlotChanges(),this.collectItems(),this.setItemAllowDragState(),this.setupDragDrop()}componentDidRender(){this.setupDragDrop()}disconnectedCallback(){this.sortable?.destroy(),this.observer?.disconnect()}observeSlotChanges(){this.observer=new MutationObserver((()=>{this.collectItems(),this.setItemAllowDragState()})),this.observer.observe(this.el,{childList:!0,characterData:!0,subtree:!0})}watchAllowDrag(){this.setItemAllowDragState(),this.setupDragDrop()}collectItems(){this.items=Array.from(this.el.querySelectorAll("swirl-resource-list-item, swirl-resource-list-file-item")).filter((t=>t.isConnected)),this.removeItemsFromTabOrder(),this.enableItemFocus(this.items[this.focusedIndex])}getItemIndex(t){return this.items.map((t=>t)).findIndex((i=>i===t))}removeItemsFromTabOrder(){this.items.forEach((t=>{const i=t?.querySelector(".resource-list-item__content, .resource-list-file-item"),a=t?.querySelector(".resource-list-item__drag-handle");i?.setAttribute("tabIndex","-1"),a?.setAttribute("tabIndex","-1")}))}setItemAllowDragState(){this.items.forEach(this.allowDrag?t=>{t.setAttribute("allow-drag","true"),t.addEventListener("toggleDrag",this.toggleDrag)}:t=>{t.removeAttribute("allow-drag"),t.removeEventListener("toggleDrag",this.toggleDrag)})}setupDragDrop(){Boolean(this.sortable)&&this.sortable.destroy(),this.allowDrag&&(this.sortable=p.create(this.gridEl,{animation:150,draggable:"swirl-resource-list-item",handle:".resource-list-item__drag-handle",onEnd:t=>{this.itemDrop.emit({item:t.item,oldIndex:t.oldDraggableIndex,newIndex:t.newDraggableIndex})}}))}enableItemFocus(t,i){if(!Boolean(t))return;const a=t.querySelector(".resource-list-item__content, .resource-list-file-item"),e=t.querySelector(".resource-list-item__drag-handle");Boolean(e)&&e.setAttribute("tabIndex","0"),Boolean(a)&&(a.setAttribute("tabIndex","0"),i&&a.focus())}focusItemAtIndex(t){this.removeItemsFromTabOrder();const i=this.items[t];Boolean(i)&&i.isConnected&&(this.enableItemFocus(i,!0),this.focusedIndex=t)}moveDraggedItemDown(){const t=this.dragging.nextElementSibling;Boolean(t)&&(t.after(this.dragging),this.collectItems(),this.focusItemAtIndex(this.getItemIndex(this.dragging)),this.assistiveText=`${this.assistiveTextItemMoving} ${this.getItemIndex(this.dragging)+1}`)}moveDraggedItemUp(){const t=this.dragging.previousElementSibling;Boolean(t)&&(t.before(this.dragging),this.collectItems(),this.focusItemAtIndex(this.getItemIndex(this.dragging)),this.assistiveText=`${this.assistiveTextItemMoving} ${this.getItemIndex(this.dragging)+1}`)}render(){return a(e,{onKeyDown:this.onKeyDown},a("swirl-visually-hidden",{role:"alert"},this.assistiveText),a("swirl-stack",{"aria-label":this.label,class:"resource-list",ref:t=>this.gridEl=t,role:"grid"},a("slot",null)))}get el(){return o(this)}static get watchers(){return{allowDrag:["watchAllowDrag"]}}};b.style=".sc-swirl-resource-list-h{display:block;width:100%}.sc-swirl-resource-list-h *.sc-swirl-resource-list{box-sizing:border-box}";const y=class{constructor(a){t(this,a),this.toggleDrag=i(this,"toggleDrag",7),this.valueChange=i(this,"valueChange",7),this.desktopMediaQuery=n(),this.id=d(),this.desktopMediaQueryHandler=t=>{this.forceIconProps(t.matches),this.updateIconSize(t.matches)},this.onClick=()=>{this.selectable&&(this.checked=!this.checked,this.valueChange.emit(this.checked))},this.onMenuTriggerClick=t=>{this.disabled&&!Boolean(this.href)&&t.stopPropagation()},this.onDragHandleKeyDown=t=>{"Space"!==t.code&&"Enter"!==t.code||(t.preventDefault(),this.toggleDrag.emit(this.el))},this.active=void 0,this.allowDrag=void 0,this.checked=!1,this.description=void 0,this.disabled=void 0,this.dragging=void 0,this.dragHandleDescription="Press spacebar to toggle grab",this.dragHandleLabel="Move item",this.hideDivider=void 0,this.href=void 0,this.interactive=!0,this.label=void 0,this.labelWeight="medium",this.menuTriggerId=void 0,this.menuTriggerLabel="Options",this.meta=void 0,this.selectable=void 0,this.value=void 0,this.hasMedia=!1,this.iconSize=24}async componentWillLoad(){this.updateMediaState()}componentDidLoad(){this.forceIconProps(this.desktopMediaQuery.matches),this.updateIconSize(this.desktopMediaQuery.matches),this.desktopMediaQuery.onchange=this.desktopMediaQueryHandler,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.desktopMediaQuery.removeEventListener?.("change",this.desktopMediaQueryHandler)}forceIconProps(t){const i=this.iconEl?.children[0];i?.setAttribute("size",t?"20":"24")}updateIconSize(t){this.iconSize=t?20:24}updateMediaState(){const t=this.el.querySelector('[slot="media"]'),i=Boolean(t);i!==this.hasMedia&&(this.hasMedia=i)}render(){const t=this.interactive||this.selectable?Boolean(this.href)&&!this.selectable?"a":"button":"div",i=this.disabled&&!Boolean(this.href),o=Boolean(this.el.querySelector("[slot='badges']")),s=Boolean(this.menuTriggerId)||this.el.querySelector("[slot='control']"),l=this.interactive&&Boolean(this.href)?this.href:void 0,n=Boolean(this.meta)||o,p=Boolean(this.menuTriggerId)&&!Boolean(this.meta)&&!this.selectable,d=(Boolean(this.meta)||o)&&!this.selectable,c=this.selectable?String(this.checked):void 0,u=this.interactive&&this.selectable?"checkbox":void 0,m=r("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--disabled":this.disabled,"resource-list-item--draggable":this.allowDrag,"resource-list-item--dragging":this.dragging,"resource-list-item--has-menu":s,"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":n,"resource-list-item--show-meta":d});return a(e,{role:"row"},a("div",{class:m,role:"gridcell"},a(t,{"aria-checked":c,"aria-disabled":i?"true":void 0,"aria-labelledby":this.id,class:"resource-list-item__content",href:l,disabled:i,onClick:this.onClick,part:"resource-list-item__content",role:u,tabIndex:0,type:"button"===t?"button":void 0},this.hasMedia&&a("span",{class:"resource-list-item__media"},a("slot",{name:"media"})),a("span",{class:"resource-list-item__label-container"},a("span",{class:"resource-list-item__label",id:this.id,innerHTML:this.label}),this.description&&a("span",{class:"resource-list-item__description"},this.description)),d&&a("span",{class:"resource-list-item__meta"},a("span",{class:"resource-list-item__meta-text"},this.meta),a("span",{class:"resource-list-item__badges"},a("slot",{name:"badges"})))),this.selectable&&a("span",{"aria-hidden":"true",class:"resource-list-item__checkbox"},a("span",{class:"resource-list-item__checkbox-icon"},this.checked&&a("swirl-icon-check-strong",null))),a("span",{class:"resource-list-item__control"},a("slot",{name:"control"})),p&&a("swirl-popover-trigger",{popover:this.menuTriggerId},a("swirl-button",{"aria-disabled":i?"true":void 0,class:"resource-list-item__menu-trigger",disabled:i,hideLabel:!0,icon:"<swirl-icon-more-horizontal></swirl-icon-more-horizontal>",intent:"primary",label:this.menuTriggerLabel,onClick:this.onMenuTriggerClick}))),this.allowDrag&&a("button",{"aria-describedby":this.dragHandleDescription,"aria-label":`${this.dragHandleLabel} "${this.label}"`,class:"resource-list-item__drag-handle",onKeyDown:this.onDragHandleKeyDown,type:"button"},a("swirl-icon-drag-handle",{size:this.iconSize})))}get el(){return o(this)}};y.style='.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}.resource-list-item.sc-swirl-resource-list-item{position:relative;width:100%}.resource-list-item.sc-swirl-resource-list-item:not(.resource-list-item--show-meta){display:flex;align-items:center}.resource-list-item.sc-swirl-resource-list-item:not(.resource-list-item--show-meta) .resource-list-item__control.sc-swirl-resource-list-item{position:relative;top:auto;right:auto;transform:none}.resource-list-item--interactive.sc-swirl-resource-list-item:hover{--swirl-ghost-button-background-default:var(--s-background-hovered)}.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.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item:hover:not(:disabled),.resource-list-item--interactive.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item:focus:not(:disabled){background-color:var(--swirl-resource-list-item-background-hovered)}.resource-list-item--interactive.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item:hover:not(:disabled) .resource-list-item__media.sc-swirl-resource-list-item,.resource-list-item--interactive.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item:hover:not(:disabled) .resource-list-item__meta.sc-swirl-resource-list-item,.resource-list-item--interactive.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item:focus:not(:disabled) .resource-list-item__media.sc-swirl-resource-list-item,.resource-list-item--interactive.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item:focus:not(: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 .resource-list-item__content.sc-swirl-resource-list-item:active:not(:disabled){background-color:var(--swirl-resource-list-item-background-pressed)}.resource-list-item--interactive.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item:active:not(:disabled) .resource-list-item__media.sc-swirl-resource-list-item,.resource-list-item--interactive.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item:active:not(: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 .resource-list-item__content.sc-swirl-resource-list-item{--swirl-badge-border-color:var(\n      --swirl-resource-list-item-background-hovered\n    );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)}@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--hide-divider.sc-swirl-resource-list-item .resource-list-item__label-container.sc-swirl-resource-list-item:after{display:none}.resource-list-item--label-weight-medium.sc-swirl-resource-list-item{font-weight:var(--s-font-weight-medium)}.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}.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{pointer-events:none;opacity:0}.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}.resource-list-item--draggable.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item{padding-left:calc(var(--s-space-16) * 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-16) * 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),\n    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__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-top:var(--s-space-12);padding-right:0;padding-bottom:var(--s-space-12);padding-left:var(--s-space-16);align-items:center;border:none;color:var(--s-text-default);background-color:var(--swirl-resource-list-item-background-default);font:inherit;line-height:var(--s-line-height-base);text-align:left;text-decoration:none;gap:var(--s-space-12)}.resource-list-item__content.sc-swirl-resource-list-item:focus{outline:none}.resource-list-item__content.sc-swirl-resource-list-item:focus-visible{background-color:var(--s-background-hovered)}.resource-list-item__content.sc-swirl-resource-list-item: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__content.sc-swirl-resource-list-item:disabled{color:var(--s-text-disabled);cursor:default}.resource-list-item__content.sc-swirl-resource-list-item:disabled .resource-list-item__description.sc-swirl-resource-list-item{color:var(--s-text-disabled)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.resource-list-item__content.sc-swirl-resource-list-item{padding:var(--s-space-12);font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.resource-list-item__media.sc-swirl-resource-list-item{display:inline-flex}.resource-list-item__label-container.sc-swirl-resource-list-item{position:relative;display:flex;min-width:0;min-height:2.875rem;padding-right:var(--s-space-16);flex-grow:1;justify-content:center;flex-direction:column}.resource-list-item__label-container.sc-swirl-resource-list-item:after{position:absolute;right:0;bottom:calc(-1 * var(--s-space-12));left:0;height:0.0625rem;background-color:var(--s-border-default);content:""}.resource-list-item__label.sc-swirl-resource-list-item{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.resource-list-item__label.sc-swirl-resource-list-item b.sc-swirl-resource-list-item,.resource-list-item__label.sc-swirl-resource-list-item strong.sc-swirl-resource-list-item{font-weight:var(--s-font-weight-semibold)}.resource-list-item__description.sc-swirl-resource-list-item{overflow:hidden;margin-top:var(--s-space-2);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{position:absolute;top:50%;right:var(--s-space-16);transform:translateY(-50%)}.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}.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: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)}';export{c as swirl_app_layout,u as swirl_empty_state,m as swirl_icon_file,h as swirl_icon_folder_shared,b as swirl_resource_list,y as swirl_resource_list_item}

package/dist/swirl-components/p-11c6c9ba.entry.js

@@ -0,0 +1 @@
+import{r as e,h as a,H as i}from"./p-3fca9a05.js";import{c as t}from"./p-b7898321.js";const r=class{constructor(a){e(this,a),this.icon=void 0,this.intent="critical",this.label=void 0,this.size="m",this.variant="default"}render(){const e=t("badge",`badge--intent-${this.intent}`,`badge--size-${this.size}`,`badge--variant-${this.variant}`,{"badge--has-icon":this.icon});return a(i,{role:"status"},a("span",{class:e},this.icon&&a("span",{class:"badge__icon",innerHTML:this.icon}),void 0===this.icon&&a("span",{class:"badge__label"},this.label)))}};r.style=":host{display:inline-flex;min-width:0;max-width:100%;justify-content:center;align-items:center}:host *{box-sizing:border-box}.badge{display:inline-flex;max-width:100%;justify-content:center;align-items:center;border:0.125rem solid var(--swirl-badge-border-color);border-radius:2rem;color:var(--s-text-on-status);font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium)}.badge--size-xs{min-width:1.25rem;height:1.25rem;font-size:0.6875rem}.badge--size-xs .badge__label{padding-right:0.125rem;padding-left:0.125rem}.badge--size-xs .badge__icon>swirl-icon,.badge--size-xs .badge__icon>*::part(icon){width:0.75rem;height:0.75rem}.badge--size-s{min-width:1.5rem;height:1.5rem;font-size:0.75rem}.badge--size-s .badge__label{padding-right:0.1875rem;padding-left:0.1875rem}.badge--size-s .badge__icon>swirl-icon,.badge--size-s .badge__icon>*::part(icon){width:0.75rem;height:0.75rem}.badge--size-m{min-width:2rem;height:2rem}.badge--size-m .badge__label{padding-right:0.375rem;padding-left:0.375rem}.badge--has-icon{padding-right:0;padding-left:0}.badge--intent-critical{color:var(--s-text-on-status);background-color:var(--s-surface-critical-default)}.badge--intent-banana{color:var(--s-text-dark);background-color:var(--s-decorative-banana-surface)}.badge--intent-blueberry{color:var(--s-text-on-status);background-color:var(--s-decorative-blueberry-surface)}.badge--intent-chilli{color:var(--s-text-on-status);background-color:var(--s-decorative-chilli-surface)}.badge--intent-grape{color:var(--s-text-on-status);background-color:var(--s-decorative-grape-surface)}.badge--intent-kiwi{color:var(--s-text-on-status);background-color:var(--s-decorative-kiwi-surface)}.badge--intent-neutral{color:var(--s-text-default);background-color:var(--s-surface-neutral-subdued)}.badge--intent-pumpkin{color:var(--s-text-dark);background-color:var(--s-decorative-pumpkin-surface)}.badge--intent-radish{color:var(--s-text-on-status);background-color:var(--s-decorative-radish-surface)}.badge--variant-dot{width:1.25rem;min-width:0;height:1.25rem}.badge--variant-dot .badge__label{padding-right:0;padding-left:0}.badge--variant-dot .badge__label,.badge--variant-dot .badge__icon{display:none}.badge__icon{display:inline-flex}.badge__icon>swirl-icon,.badge__icon>*::part(icon){width:1rem;height:1rem}.badge__label{display:inline-flex;overflow:hidden;max-width:100%;white-space:nowrap;text-overflow:ellipsis}";export{r as swirl_badge}

package/dist/swirl-components/p-25b4973d.entry.js

@@ -0,0 +1 @@
+import{r as i,h as s,H as o}from"./p-3fca9a05.js";import{c as t}from"./p-b7898321.js";const n=class{constructor(s){i(this,s),this.setImageAvailable=()=>{this.imageAvailable=!0},this.setImageUnavailable=()=>{this.imageAvailable=!1},this.icon=void 0,this.src=void 0,this.imageAvailable=void 0}render(){const i=Boolean(this.src)&&(this.imageAvailable||void 0===this.imageAvailable),n=!i&&Boolean(this.icon),r=t("app-icon",{"app-icon--has-icon":n||!i&&!n});return s(o,null,s("span",{class:r},i&&s("img",{alt:"",height:"40",onError:this.setImageUnavailable,onLoad:this.setImageAvailable,src:this.src,width:"40"}),n&&s("span",{class:"app-icon__icon",innerHTML:this.icon})))}};n.style=":host{display:inline-flex}:host *{box-sizing:border-box}.app-icon{position:relative;overflow:hidden;width:1.25rem;height:1.25rem;border-radius:var(--s-border-radius-s)}.app-icon>img{width:100%;height:100%}.app-icon__icon{display:inline-flex;width:100%;height:100%;justify-content:center;align-items:center}";export{n as swirl_app_icon}

package/dist/swirl-components/p-262771e5.entry.js

@@ -0,0 +1 @@
+import{r as C,h as i,F as s}from"./p-3fca9a05.js";import{c as t}from"./p-b7898321.js";const l=class{constructor(i){C(this,i),this.size=24}render(){const C=20===this.size?24:this.size,l=t("swirl-icon",`swirl-icon--size-${this.size}`);return i("svg",{class:l,fill:"none",height:this.size,part:"icon",viewBox:`0 0 ${C} ${C}`,width:this.size,xmlns:"http://www.w3.org/2000/svg"},16===this.size&&i(s,null,i("path",{d:"M9.50758 13.1114L4.83311 8.45076C4.77762 8.38603 4.73601 8.31668 4.70827 8.2427C4.68053 8.16872 4.66666 8.09012 4.66666 8.00689C4.66666 7.92367 4.68053 7.84507 4.70827 7.77109C4.73601 7.69711 4.77762 7.62776 4.83311 7.56303L9.50758 2.88856C9.65553 2.7406 9.83826 2.66663 10.0558 2.66663C10.2729 2.66663 10.4554 2.74523 10.6034 2.90243C10.7606 3.05039 10.8392 3.2283 10.8392 3.43618C10.8392 3.64443 10.7606 3.82715 10.6034 3.98435L6.58083 8.00689L10.6034 12.0294C10.7513 12.1774 10.8253 12.3553 10.8253 12.5632C10.8253 12.7714 10.7467 12.9542 10.5895 13.1114C10.4415 13.2593 10.2634 13.3333 10.0552 13.3333C9.84732 13.3333 9.66478 13.2593 9.50758 13.1114V13.1114Z",fill:"currentColor"})),(20===this.size||24===this.size)&&i(s,null,i("path",{d:"M14.2614 19.6671L7.24967 12.6762C7.16645 12.5791 7.10403 12.4751 7.06242 12.3641C7.02081 12.2531 7 12.1352 7 12.0104C7 11.8856 7.02081 11.7677 7.06242 11.6567C7.10403 11.5457 7.16645 11.4417 7.24967 11.3446L14.2614 4.3329C14.4833 4.11097 14.7574 4 15.0836 4C15.4093 4 15.6831 4.1179 15.9051 4.35371C16.1409 4.57564 16.2588 4.84251 16.2588 5.15433C16.2588 5.4667 16.1409 5.74079 15.9051 5.97659L9.87126 12.0104L15.9051 18.0442C16.127 18.2661 16.238 18.533 16.238 18.8448C16.238 19.1572 16.1201 19.4313 15.8843 19.6671C15.6623 19.889 15.3952 20 15.0828 20C14.771 20 14.4972 19.889 14.2614 19.6671Z",fill:"currentColor"})),28===this.size&&i(s,null,i("path",{d:"M16.6383 22.9449L8.45794 14.7889C8.36085 14.6756 8.28803 14.5542 8.23948 14.4248C8.19093 14.2953 8.16666 14.1577 8.16666 14.0121C8.16666 13.8665 8.19093 13.7289 8.23948 13.5994C8.28803 13.47 8.36085 13.3486 8.45794 13.2353L16.6383 5.05501C16.8972 4.79609 17.217 4.66663 17.5976 4.66663C17.9775 4.66663 18.297 4.80418 18.5559 5.07928C18.831 5.33821 18.9686 5.64956 18.9686 6.01334C18.9686 6.37778 18.831 6.69755 18.5559 6.97265L11.5165 14.0121L18.5559 21.0515C18.8148 21.3105 18.9443 21.6218 18.9443 21.9856C18.9443 22.35 18.8067 22.6698 18.5316 22.9449C18.2727 23.2038 17.961 23.3333 17.5966 23.3333C17.2328 23.3333 16.9134 23.2038 16.6383 22.9449V22.9449Z",fill:"currentColor"})))}};l.style=":host{display:inline-flex}";const r=class{constructor(i){C(this,i),this.size=24}render(){const C=20===this.size?24:this.size,l=t("swirl-icon",`swirl-icon--size-${this.size}`);return i("svg",{class:l,fill:"none",height:this.size,part:"icon",viewBox:`0 0 ${C} ${C}`,width:this.size,xmlns:"http://www.w3.org/2000/svg"},16===this.size&&i(s,null,i("path",{d:"M6.4916 13.1114L11.1661 8.45076C11.2216 8.38603 11.2632 8.31668 11.2909 8.2427C11.3187 8.16872 11.3325 8.09012 11.3325 8.00689C11.3325 7.92367 11.3187 7.84507 11.2909 7.77109C11.2632 7.69711 11.2216 7.62776 11.1661 7.56303L6.4916 2.88856C6.34365 2.7406 6.16092 2.66663 5.94343 2.66663C5.7263 2.66663 5.54376 2.74523 5.39581 2.90243C5.2386 3.05039 5.16 3.2283 5.16 3.43618C5.16 3.64443 5.2386 3.82715 5.39581 3.98435L9.41835 8.00689L5.39581 12.0294C5.24785 12.1774 5.17387 12.3553 5.17387 12.5632C5.17387 12.7714 5.25248 12.9542 5.40968 13.1114C5.55763 13.2593 5.73574 13.3333 5.94398 13.3333C6.15186 13.3333 6.3344 13.2593 6.4916 13.1114Z",fill:"currentColor"})),(20===this.size||24===this.size)&&i(s,null,i("path",{d:"M9.73739 19.6671L16.7491 12.6762C16.8323 12.5791 16.8947 12.4751 16.9363 12.3641C16.978 12.2531 16.9988 12.1352 16.9988 12.0104C16.9988 11.8856 16.978 11.7677 16.9363 11.6567C16.8947 11.5457 16.8323 11.4417 16.7491 11.3446L9.73739 4.3329C9.51546 4.11097 9.24137 4 8.91513 4C8.58944 4 8.31563 4.1179 8.0937 4.35371C7.85789 4.57564 7.73999 4.84251 7.73999 5.15433C7.73999 5.4667 7.85789 5.74079 8.0937 5.97659L14.1275 12.0104L8.0937 18.0442C7.87176 18.2661 7.7608 18.533 7.7608 18.8448C7.7608 19.1572 7.8787 19.4313 8.1145 19.6671C8.33643 19.889 8.60359 20 8.91596 20C9.22778 20 9.50159 19.889 9.73739 19.6671Z",fill:"currentColor"})),28===this.size&&i(s,null,i("path",{d:"M11.3603 22.9449L19.5406 14.7889C19.6377 14.6756 19.7105 14.5542 19.7591 14.4248C19.8076 14.2953 19.8319 14.1577 19.8319 14.0121C19.8319 13.8665 19.8076 13.7289 19.7591 13.5994C19.7105 13.47 19.6377 13.3486 19.5406 13.2353L11.3603 5.05501C11.1014 4.79609 10.7816 4.66663 10.401 4.66663C10.021 4.66663 9.70158 4.80418 9.44266 5.07928C9.16755 5.33821 9.03 5.64956 9.03 6.01334C9.03 6.37778 9.16755 6.69755 9.44266 6.97265L16.4821 14.0121L9.44266 21.0515C9.18373 21.3105 9.05427 21.6218 9.05427 21.9856C9.05427 22.35 9.19182 22.6698 9.46693 22.9449C9.72585 23.2038 10.0375 23.3333 10.402 23.3333C10.7657 23.3333 11.0852 23.2038 11.3603 22.9449Z",fill:"currentColor"})))}};r.style=":host{display:inline-flex}";const o=class{constructor(i){C(this,i),this.size=24}render(){const C=20===this.size?24:this.size,l=t("swirl-icon",`swirl-icon--size-${this.size}`);return i("svg",{class:l,fill:"none",height:this.size,part:"icon",viewBox:`0 0 ${C} ${C}`,width:this.size,xmlns:"http://www.w3.org/2000/svg"},16===this.size&&i(s,null,i("path",{d:"M10.9833 11.5378L7.91667 8.47112C7.85 8.40445 7.80289 8.33223 7.77534 8.25445C7.74734 8.17667 7.73334 8.09334 7.73334 8.00445C7.73334 7.91556 7.74734 7.83223 7.77534 7.75445C7.80289 7.67667 7.85 7.60445 7.91667 7.53778L10.9833 4.47112C11.1056 4.34889 11.2582 4.28489 11.4413 4.27912C11.6249 4.27378 11.7833 4.33778 11.9167 4.47112C12.0389 4.59334 12.1 4.74889 12.1 4.93778C12.1 5.12667 12.0389 5.28223 11.9167 5.40445L9.33334 8.00445L11.9167 10.6044C12.0389 10.7267 12.1027 10.8793 12.108 11.0624C12.1138 11.246 12.05 11.4044 11.9167 11.5378C11.7944 11.66 11.6389 11.7211 11.45 11.7211C11.2611 11.7211 11.1056 11.66 10.9833 11.5378ZM6.58334 11.5378L3.51667 8.47112C3.45 8.40445 3.40289 8.33223 3.37534 8.25445C3.34734 8.17667 3.33334 8.09334 3.33334 8.00445C3.33334 7.91556 3.34734 7.83223 3.37534 7.75445C3.40289 7.67667 3.45 7.60445 3.51667 7.53778L6.58334 4.47112C6.70556 4.34889 6.85845 4.28489 7.042 4.27912C7.22511 4.27378 7.38334 4.33778 7.51667 4.47112C7.63889 4.59334 7.7 4.74889 7.7 4.93778C7.7 5.12667 7.63889 5.28223 7.51667 5.40445L4.93334 8.00445L7.51667 10.6044C7.63889 10.7267 7.70289 10.8793 7.70867 11.0624C7.714 11.246 7.65 11.4044 7.51667 11.5378C7.39445 11.66 7.23889 11.7211 7.05 11.7211C6.86111 11.7211 6.70556 11.66 6.58334 11.5378Z",fill:"currentColor"})),(20===this.size||24===this.size)&&i(s,null,i("path",{d:"M16.475 17.3067L11.875 12.7067C11.775 12.6067 11.7043 12.4983 11.663 12.3817C11.621 12.265 11.6 12.14 11.6 12.0067C11.6 11.8733 11.621 11.7483 11.663 11.6317C11.7043 11.515 11.775 11.4067 11.875 11.3067L16.475 6.70667C16.6583 6.52334 16.8873 6.42734 17.162 6.41867C17.4373 6.41067 17.675 6.50667 17.875 6.70667C18.0583 6.89001 18.15 7.12334 18.15 7.40667C18.15 7.69001 18.0583 7.92334 17.875 8.10667L14 12.0067L17.875 15.9067C18.0583 16.09 18.154 16.319 18.162 16.5937C18.1707 16.869 18.075 17.1067 17.875 17.3067C17.6917 17.49 17.4583 17.5817 17.175 17.5817C16.8917 17.5817 16.6583 17.49 16.475 17.3067ZM9.875 17.3067L5.275 12.7067C5.175 12.6067 5.10433 12.4983 5.063 12.3817C5.021 12.265 5 12.14 5 12.0067C5 11.8733 5.021 11.7483 5.063 11.6317C5.10433 11.515 5.175 11.4067 5.275 11.3067L9.875 6.70667C10.0583 6.52334 10.2877 6.42734 10.563 6.41867C10.8377 6.41067 11.075 6.50667 11.275 6.70667C11.4583 6.89001 11.55 7.12334 11.55 7.40667C11.55 7.69001 11.4583 7.92334 11.275 8.10667L7.4 12.0067L11.275 15.9067C11.4583 16.09 11.5543 16.319 11.563 16.5937C11.571 16.869 11.475 17.1067 11.275 17.3067C11.0917 17.49 10.8583 17.5817 10.575 17.5817C10.2917 17.5817 10.0583 17.49 9.875 17.3067Z",fill:"currentColor"})),28===this.size&&i(s,null,i("path",{d:"M19.2208 20.191L13.8542 14.8243C13.7375 14.7077 13.6551 14.5813 13.6068 14.4452C13.5578 14.3091 13.5333 14.1632 13.5333 14.0077C13.5333 13.8521 13.5578 13.7063 13.6068 13.5702C13.6551 13.4341 13.7375 13.3077 13.8542 13.191L19.2208 7.82433C19.4347 7.61044 19.7019 7.49844 20.0223 7.48833C20.3436 7.479 20.6208 7.591 20.8542 7.82433C21.0681 8.03822 21.175 8.31044 21.175 8.641C21.175 8.97155 21.0681 9.24378 20.8542 9.45766L16.3333 14.0077L20.8542 18.5577C21.0681 18.7716 21.1797 19.0387 21.189 19.3592C21.1991 19.6804 21.0875 19.9577 20.8542 20.191C20.6403 20.4049 20.3681 20.5118 20.0375 20.5118C19.7069 20.5118 19.4347 20.4049 19.2208 20.191ZM11.5208 20.191L6.15417 14.8243C6.0375 14.7077 5.95506 14.5813 5.90684 14.4452C5.85784 14.3091 5.83334 14.1632 5.83334 14.0077C5.83334 13.8521 5.85784 13.7063 5.90684 13.5702C5.95506 13.4341 6.0375 13.3077 6.15417 13.191L11.5208 7.82433C11.7347 7.61044 12.0023 7.49844 12.3235 7.48833C12.6439 7.479 12.9208 7.591 13.1542 7.82433C13.3681 8.03822 13.475 8.31044 13.475 8.641C13.475 8.97155 13.3681 9.24378 13.1542 9.45766L8.63334 14.0077L13.1542 18.5577C13.3681 18.7716 13.4801 19.0387 13.4902 19.3592C13.4995 19.6804 13.3875 19.9577 13.1542 20.191C12.9403 20.4049 12.6681 20.5118 12.3375 20.5118C12.0069 20.5118 11.7347 20.4049 11.5208 20.191Z",fill:"currentColor"})))}};o.style=":host{display:inline-flex}";const n=class{constructor(i){C(this,i),this.size=24}render(){const C=20===this.size?24:this.size,l=t("swirl-icon",`swirl-icon--size-${this.size}`);return i("svg",{class:l,fill:"none",height:this.size,part:"icon",viewBox:`0 0 ${C} ${C}`,width:this.size,xmlns:"http://www.w3.org/2000/svg"},16===this.size&&i(s,null,i("path",{d:"M4.08503 11.5291C3.9628 11.4068 3.90169 11.2513 3.90169 11.0624C3.90169 10.8735 3.9628 10.7179 4.08503 10.5957L6.66836 7.99572L4.08503 5.39572C3.9628 5.2735 3.89903 5.12061 3.89369 4.93705C3.88792 4.75394 3.95169 4.59572 4.08503 4.46239C4.20725 4.34016 4.3628 4.27905 4.55169 4.27905C4.74058 4.27905 4.89614 4.34016 5.01836 4.46239L8.08503 7.52905C8.15169 7.59572 8.19903 7.66794 8.22703 7.74572C8.25458 7.8235 8.26836 7.90683 8.26836 7.99572C8.26836 8.08461 8.25458 8.16794 8.22703 8.24572C8.19903 8.3235 8.15169 8.39572 8.08503 8.46239L5.01836 11.5291C4.89614 11.6513 4.74325 11.7151 4.55969 11.7204C4.37658 11.7262 4.21836 11.6624 4.08503 11.5291ZM8.48503 11.5291C8.3628 11.4068 8.30169 11.2513 8.30169 11.0624C8.30169 10.8735 8.3628 10.7179 8.48503 10.5957L11.0684 7.99572L8.48503 5.39572C8.3628 5.2735 8.2988 5.12061 8.29303 4.93705C8.28769 4.75394 8.35169 4.59572 8.48503 4.46239C8.60725 4.34016 8.7628 4.27905 8.95169 4.27905C9.14058 4.27905 9.29614 4.34016 9.41836 4.46239L12.485 7.52905C12.5517 7.59572 12.5988 7.66794 12.6264 7.74572C12.6544 7.8235 12.6684 7.90683 12.6684 7.99572C12.6684 8.08461 12.6544 8.16794 12.6264 8.24572C12.5988 8.3235 12.5517 8.39572 12.485 8.46239L9.41836 11.5291C9.29614 11.6513 9.14347 11.7151 8.96036 11.7204C8.7768 11.7262 8.61836 11.6624 8.48503 11.5291Z",fill:"currentColor"})),(20===this.size||24===this.size)&&i(s,null,i("path",{d:"M6.12754 17.2937C5.94421 17.1104 5.85254 16.877 5.85254 16.5937C5.85254 16.3104 5.94421 16.077 6.12754 15.8937L10.0025 11.9937L6.12754 8.0937C5.94421 7.91037 5.84854 7.68103 5.84054 7.4057C5.83187 7.13103 5.92754 6.8937 6.12754 6.6937C6.31087 6.51037 6.54421 6.4187 6.82754 6.4187C7.11087 6.4187 7.34421 6.51037 7.52754 6.6937L12.1275 11.2937C12.2275 11.3937 12.2985 11.502 12.3405 11.6187C12.3819 11.7354 12.4025 11.8604 12.4025 11.9937C12.4025 12.127 12.3819 12.252 12.3405 12.3687C12.2985 12.4854 12.2275 12.5937 12.1275 12.6937L7.52754 17.2937C7.34421 17.477 7.11487 17.5727 6.83954 17.5807C6.56487 17.5894 6.32754 17.4937 6.12754 17.2937ZM12.7275 17.2937C12.5442 17.1104 12.4525 16.877 12.4525 16.5937C12.4525 16.3104 12.5442 16.077 12.7275 15.8937L16.6025 11.9937L12.7275 8.0937C12.5442 7.91037 12.4482 7.68103 12.4395 7.4057C12.4315 7.13103 12.5275 6.8937 12.7275 6.6937C12.9109 6.51037 13.1442 6.4187 13.4275 6.4187C13.7109 6.4187 13.9442 6.51037 14.1275 6.6937L18.7275 11.2937C18.8275 11.3937 18.8982 11.502 18.9395 11.6187C18.9815 11.7354 19.0025 11.8604 19.0025 11.9937C19.0025 12.127 18.9815 12.252 18.9395 12.3687C18.8982 12.4854 18.8275 12.5937 18.7275 12.6937L14.1275 17.2937C13.9442 17.477 13.7152 17.5727 13.4405 17.5807C13.1652 17.5894 12.9275 17.4937 12.7275 17.2937Z",fill:"currentColor"})),28===this.size&&i(s,null,i("path",{d:"M7.14879 20.176C6.93491 19.9621 6.82796 19.6899 6.82796 19.3594C6.82796 19.0288 6.93491 18.7566 7.14879 18.5427L11.6696 13.9927L7.14879 9.44269C6.93491 9.2288 6.82329 8.96125 6.81396 8.64003C6.80385 8.31958 6.91546 8.04269 7.14879 7.80936C7.36268 7.59547 7.63491 7.48853 7.96546 7.48853C8.29602 7.48853 8.56824 7.59547 8.78213 7.80936L14.1488 13.176C14.2655 13.2927 14.3483 13.4191 14.3973 13.5552C14.4455 13.6913 14.4696 13.8371 14.4696 13.9927C14.4696 14.1482 14.4455 14.2941 14.3973 14.4302C14.3483 14.5663 14.2655 14.6927 14.1488 14.8094L8.78213 20.176C8.56824 20.3899 8.30068 20.5015 7.97946 20.5109C7.65902 20.521 7.38213 20.4094 7.14879 20.176ZM14.8488 20.176C14.6349 19.9621 14.528 19.6899 14.528 19.3594C14.528 19.0288 14.6349 18.7566 14.8488 18.5427L19.3696 13.9927L14.8488 9.44269C14.6349 9.2288 14.5229 8.96125 14.5128 8.64003C14.5035 8.31958 14.6155 8.04269 14.8488 7.80936C15.0627 7.59547 15.3349 7.48853 15.6655 7.48853C15.996 7.48853 16.2682 7.59547 16.4821 7.80936L21.8488 13.176C21.9655 13.2927 22.0479 13.4191 22.0961 13.5552C22.1451 13.6913 22.1696 13.8371 22.1696 13.9927C22.1696 14.1482 22.1451 14.2941 22.0961 14.4302C22.0479 14.5663 21.9655 14.6927 21.8488 14.8094L16.4821 20.176C16.2682 20.3899 16.0011 20.5015 15.6806 20.5109C15.3594 20.521 15.0821 20.4094 14.8488 20.176Z",fill:"currentColor"})))}};n.style=":host{display:inline-flex}";const h=class{constructor(i){C(this,i),this.size=24}render(){const C=20===this.size?24:this.size,l=t("swirl-icon",`swirl-icon--size-${this.size}`);return i("svg",{class:l,fill:"none",height:this.size,part:"icon",viewBox:`0 0 ${C} ${C}`,width:this.size,xmlns:"http://www.w3.org/2000/svg"},16===this.size&&i(s,null,i("path",{d:"M2.66667 12C2.47778 12 2.31956 11.936 2.192 11.808C2.064 11.6804 2 11.5222 2 11.3333C2 11.1444 2.064 10.9862 2.192 10.8587C2.31956 10.7307 2.47778 10.6667 2.66667 10.6667H13.3333C13.5222 10.6667 13.6804 10.7307 13.808 10.8587C13.936 10.9862 14 11.1444 14 11.3333C14 11.5222 13.936 11.6804 13.808 11.808C13.6804 11.936 13.5222 12 13.3333 12H2.66667ZM2.66667 8.66667C2.47778 8.66667 2.31956 8.60267 2.192 8.47467C2.064 8.34711 2 8.18889 2 8C2 7.81111 2.064 7.65267 2.192 7.52467C2.31956 7.39711 2.47778 7.33333 2.66667 7.33333H13.3333C13.5222 7.33333 13.6804 7.39711 13.808 7.52467C13.936 7.65267 14 7.81111 14 8C14 8.18889 13.936 8.34711 13.808 8.47467C13.6804 8.60267 13.5222 8.66667 13.3333 8.66667H2.66667ZM2.66667 5.33333C2.47778 5.33333 2.31956 5.26956 2.192 5.142C2.064 5.014 2 4.85556 2 4.66667C2 4.47778 2.064 4.31933 2.192 4.19133C2.31956 4.06378 2.47778 4 2.66667 4H13.3333C13.5222 4 13.6804 4.06378 13.808 4.19133C13.936 4.31933 14 4.47778 14 4.66667C14 4.85556 13.936 5.014 13.808 5.142C13.6804 5.26956 13.5222 5.33333 13.3333 5.33333H2.66667Z",fill:"currentColor"})),(20===this.size||24===this.size)&&i(s,null,i("path",{d:"M4 18C3.71667 18 3.47933 17.904 3.288 17.712C3.096 17.5207 3 17.2833 3 17C3 16.7167 3.096 16.4793 3.288 16.288C3.47933 16.096 3.71667 16 4 16H20C20.2833 16 20.5207 16.096 20.712 16.288C20.904 16.4793 21 16.7167 21 17C21 17.2833 20.904 17.5207 20.712 17.712C20.5207 17.904 20.2833 18 20 18H4ZM4 13C3.71667 13 3.47933 12.904 3.288 12.712C3.096 12.5207 3 12.2833 3 12C3 11.7167 3.096 11.479 3.288 11.287C3.47933 11.0957 3.71667 11 4 11H20C20.2833 11 20.5207 11.0957 20.712 11.287C20.904 11.479 21 11.7167 21 12C21 12.2833 20.904 12.5207 20.712 12.712C20.5207 12.904 20.2833 13 20 13H4ZM4 8C3.71667 8 3.47933 7.90433 3.288 7.713C3.096 7.521 3 7.28333 3 7C3 6.71667 3.096 6.479 3.288 6.287C3.47933 6.09567 3.71667 6 4 6H20C20.2833 6 20.5207 6.09567 20.712 6.287C20.904 6.479 21 6.71667 21 7C21 7.28333 20.904 7.521 20.712 7.713C20.5207 7.90433 20.2833 8 20 8H4Z",fill:"currentColor"})),28===this.size&&i(s,null,i("path",{d:"M4.66667 21C4.33611 21 4.05922 20.888 3.836 20.664C3.612 20.4408 3.5 20.1639 3.5 19.8333C3.5 19.5028 3.612 19.2259 3.836 19.0027C4.05922 18.7787 4.33611 18.6667 4.66667 18.6667H23.3333C23.6639 18.6667 23.9408 18.7787 24.164 19.0027C24.388 19.2259 24.5 19.5028 24.5 19.8333C24.5 20.1639 24.388 20.4408 24.164 20.664C23.9408 20.888 23.6639 21 23.3333 21H4.66667ZM4.66667 15.1667C4.33611 15.1667 4.05922 15.0547 3.836 14.8307C3.612 14.6074 3.5 14.3306 3.5 14C3.5 13.6694 3.612 13.3922 3.836 13.1682C4.05922 12.9449 4.33611 12.8333 4.66667 12.8333H23.3333C23.6639 12.8333 23.9408 12.9449 24.164 13.1682C24.388 13.3922 24.5 13.6694 24.5 14C24.5 14.3306 24.388 14.6074 24.164 14.8307C23.9408 15.0547 23.6639 15.1667 23.3333 15.1667H4.66667ZM4.66667 9.33333C4.33611 9.33333 4.05922 9.22172 3.836 8.9985C3.612 8.7745 3.5 8.49722 3.5 8.16667C3.5 7.83611 3.612 7.55883 3.836 7.33483C4.05922 7.11161 4.33611 7 4.66667 7H23.3333C23.6639 7 23.9408 7.11161 24.164 7.33483C24.388 7.55883 24.5 7.83611 24.5 8.16667C24.5 8.49722 24.388 8.7745 24.164 8.9985C23.9408 9.22172 23.6639 9.33333 23.3333 9.33333H4.66667Z",fill:"currentColor"})))}};h.style=":host{display:inline-flex}";export{l as swirl_icon_arrow_back,r as swirl_icon_arrow_forward,o as swirl_icon_double_arrow_left,n as swirl_icon_double_arrow_right,h as swirl_icon_menu}

package/dist/swirl-components/p-3795fbb4.entry.js

@@ -0,0 +1 @@
+import{r as l,c as s,h as a,H as e}from"./p-3fca9a05.js";import{c as o}from"./p-b7898321.js";import{c as i}from"./p-c2e1dfdb.js";const t="SWIRL_SHELL_NAVIGATION_COLLAPSE_STATE",r="SWIRL_SHELL_SIDEBAR_STATE",h=class{constructor(a){l(this,a),this.sidebarToggleClick=s(this,"sidebarToggleClick",7),this.skipLinkClick=s(this,"skipLinkClick",7),this.onBrowserBackClick=()=>{history.back()},this.onBrowserForwardClick=()=>{history.forward()},this.onNavigationToggleClick=()=>{this.navigationCollapsed=!this.navigationCollapsed},this.onNavigationClick=()=>{this.hideMobileNavigation()},this.brandedHeader=void 0,this.browserBackButtonLabel="Navigate back",this.browserForwardButtonLabel="Navigate forward",this.hideMobileNavigationButtonLabel="Close navigation",this.navigationLabel="Main",this.navigationToggleLabel="Toggle navigation",this.sidebarActive=void 0,this.sidebarToggleBadge=void 0,this.sidebarToggleBadgeAriaLabel=void 0,this.sidebarToggleIcon="notifications",this.sidebarToggleLabel="Toggle sidebar",this.skipLinkLabel="Skip to main content",this.mobileNavigationActive=void 0,this.navigationCollapsed=void 0}componentWillLoad(){const l="true"===localStorage.getItem(r);this.sidebarActive=void 0===this.sidebarActive?l:this.sidebarActive;const s="true"===localStorage.getItem(t);this.navigationCollapsed=s}componentDidLoad(){this.focusTrap=i(this.navElement,{allowOutsideClick:!0,tabbableOptions:{getShadowRoot:l=>l.shadowRoot}})}componentDidRender(){this.focusTrap?.updateContainerElements(this.navElement)}disconnectedCallback(){this.focusTrap?.deactivate()}onWindowKeyDown(l){"Escape"===l.key&&this.mobileNavigationActive&&this.hideMobileNavigation()}watchMobileNavigationState(){this.mobileNavigationActive?setTimeout((()=>{this.focusTrap.activate()}),200):this.focusTrap.deactivate()}watchNavigationCollapsed(){localStorage.setItem(t,String(this.navigationCollapsed))}watchSidebarActive(){localStorage.setItem(r,String(this.sidebarActive))}async showMobileNavigation(){this.mobileNavigationActive=!0}async hideMobileNavigation(){this.mobileNavigationActive=!1}render(){const l=o("shell-layout",{"shell-layout--branded-header":this.brandedHeader,"shell-layout--mobile-navigation-active":this.mobileNavigationActive,"shell-layout--navigation-collapsed":this.navigationCollapsed,"shell-layout--sidebar-active":this.sidebarActive});return a(e,null,a("div",{class:l},a("header",{class:"shell-layout__header","data-tauri-drag-region":"true"},a("button",{class:"shell-layout__skip-link",onClick:this.skipLinkClick.emit,type:"button"},this.skipLinkLabel),a("div",{class:"shell-layout__header-left"},a("button",{class:"shell-layout__header-tool shell-layout__navigation-toggle",onClick:this.onNavigationToggleClick,type:"button"},a("swirl-icon-menu",{size:20}),a("swirl-icon-double-arrow-left",{size:20}),a("swirl-icon-double-arrow-right",{size:20}),a("swirl-visually-hidden",null,this.navigationToggleLabel)),a("button",{class:"shell-layout__header-tool",onClick:this.onBrowserBackClick,type:"button"},a("swirl-icon-arrow-back",{size:20}),a("swirl-visually-hidden",null,this.browserBackButtonLabel)),a("button",{class:"shell-layout__header-tool",onClick:this.onBrowserForwardClick,type:"button"},a("swirl-icon-arrow-forward",{size:20}),a("swirl-visually-hidden",null,this.browserForwardButtonLabel))),a("div",{class:"shell-layout__logo"},a("slot",{name:"logo"})),a("div",{class:"shell-layout__header-right"},a("button",{class:"shell-layout__header-tool shell-layout__sidebar-toggle",onClick:this.sidebarToggleClick.emit,type:"button"},a("swirl-icon",{glyph:this.sidebarToggleIcon,size:20}),a("swirl-visually-hidden",null,this.sidebarToggleLabel),this.sidebarToggleBadge&&a("swirl-badge",{"aria-label":this.sidebarToggleBadgeAriaLabel,label:this.sidebarToggleBadge,size:"xs"})),a("slot",{name:"header-tools"}))),a("div",{class:"shell-layout__mobile-nav-backdrop",onClick:this.onNavigationClick}),a("nav",{"aria-labelledby":"main-navigation-label",class:"shell-layout__nav",onClick:this.onNavigationClick,ref:l=>this.navElement=l},a("div",{class:"shell-layout__mobile-header"},a("slot",{name:"mobile-logo"}),a("div",{class:"shell-layout__mobile-header-tools"},a("slot",{name:"mobile-header-tools"}),a("button",{class:"shell-layout__header-tool",type:"button"},a("swirl-icon-double-arrow-left",{size:20}),a("swirl-visually-hidden",null,this.hideMobileNavigationButtonLabel)))),a("div",{class:"shell-layout__nav-body"},a("swirl-visually-hidden",null,a("span",{id:"main-navigation-label"},this.navigationLabel)),a("slot",{name:"nav"}))),a("main",{class:"shell-layout__main",id:"main-content"},a("slot",null)),a("aside",{class:"shell-layout__sidebar"},a("div",{class:"shell-layout__sidebar-body"},a("div",{class:"shell-layout__sidebar-app-bar"},a("slot",{name:"sidebar-app-bar"})),a("div",{class:"shell-layout__sidebar-content"},a("slot",{name:"sidebar"}))))))}static get watchers(){return{mobileNavigationActive:["watchMobileNavigationState"],navigationCollapsed:["watchNavigationCollapsed"],sidebarActive:["watchSidebarActive"]}}};h.style='.sc-swirl-shell-layout-h{--swirl-shell-background:var(--s-surface-sunken-default);--swirl-shell-text-color:var(--s-text-default);--swirl-shell-header-height:3.25rem;--swirl-shell-collapsed-nav-width:3.75rem;--swirl-shell-extended-nav-width:14rem;--swirl-shell-sidebar-width:21rem;display:flex;width:100%;height:100%}.sc-swirl-shell-layout-h *.sc-swirl-shell-layout{box-sizing:border-box}.shell-layout.sc-swirl-shell-layout{display:grid;width:100%;min-height:100%;background-color:var(--swirl-shell-background);transition:grid-template-columns 0.2s;grid-template-columns:0 1fr 0;grid-template-rows:1fr;grid-template-areas:"nav main"}@media (min-width: 992px){.shell-layout.sc-swirl-shell-layout{padding-right:var(--s-space-8);padding-bottom:var(--s-space-8);gap:var(--s-space-8);grid-template-columns:var(--swirl-shell-extended-nav-width) 1fr 0;grid-template-rows:var(--swirl-shell-header-height) 1fr;grid-template-areas:"header header header"\n      "nav main sidebar"}}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout{border-bottom:none;color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout{color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:hover{background-color:var(--s-action-primary-hovered)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:active{background-color:var(--s-action-primary-pressed)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout swirl-badge.sc-swirl-shell-layout{--swirl-badge-border-color:var(--s-action-primary-default)}.shell-layout--navigation-collapsed.sc-swirl-shell-layout .shell-layout__navigation-toggle.sc-swirl-shell-layout:hover swirl-icon-double-arrow-left.sc-swirl-shell-layout{display:none}.shell-layout--navigation-collapsed.sc-swirl-shell-layout .shell-layout__navigation-toggle.sc-swirl-shell-layout:hover swirl-icon-double-arrow-right.sc-swirl-shell-layout{display:inline-flex}@media (min-width: 992px){.shell-layout--navigation-collapsed.sc-swirl-shell-layout{grid-template-columns:var(--swirl-shell-collapsed-nav-width) 1fr 0}}@media (min-width: 1440px){.shell-layout--sidebar-active.shell-layout--navigation-collapsed.sc-swirl-shell-layout{grid-template-columns:var(--swirl-shell-collapsed-nav-width) 1fr var(\n          --swirl-shell-sidebar-width\n        )}}@media (min-width: 1440px){.shell-layout--sidebar-active.sc-swirl-shell-layout .shell-layout__main.sc-swirl-shell-layout{width:100%}}@media (min-width: 992px){.shell-layout--sidebar-active.sc-swirl-shell-layout .shell-layout__sidebar-body.sc-swirl-shell-layout{border:0.0625rem solid var(--s-border-default);transform:translate3d(0, 0, 0)}}@media (min-width: 1440px){.shell-layout--sidebar-active.sc-swirl-shell-layout{grid-template-columns:var(--swirl-shell-extended-nav-width) 1fr var(\n        --swirl-shell-sidebar-width\n      )}}.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout{transform:translate3d(0, 0, 0);box-shadow:var(--s-shadow-level-3)}@media (min-width: 992px){.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout{transform:none;box-shadow:none}}.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__mobile-nav-backdrop.sc-swirl-shell-layout{display:block}@media (min-width: 992px){.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__mobile-nav-backdrop.sc-swirl-shell-layout{display:none}}.shell-layout__header.sc-swirl-shell-layout{position:relative;display:none;width:calc(100% + var(--s-space-8));padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);justify-content:space-between;align-items:center;border-bottom:0.0625rem solid var(--s-border-default);color:var(--swirl-shell-text-color);grid-area:header}@media (min-width: 992px){.shell-layout__header.sc-swirl-shell-layout{display:flex}}.shell-layout__skip-link.sc-swirl-shell-layout{position:absolute;z-index:9;top:0;left:0;padding:var(--s-space-4);border:none;color:var(--swirl-shell-text-color);background-color:var(--swirl-shell-background);font:inherit;cursor:pointer}.shell-layout__skip-link.sc-swirl-shell-layout:not(:focus):not(:active){position:absolute;overflow:hidden;width:1px;height:1px;white-space:nowrap;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%)}.shell-layout__header-left.sc-swirl-shell-layout{display:flex;flex-basis:8rem;flex-shrink:0;gap:var(--s-space-8)}.shell-layout__header-right.sc-swirl-shell-layout{display:flex;flex-basis:8rem;flex-shrink:0;justify-content:flex-end;align-items:center;gap:var(--s-space-8)}.shell-layout__logo.sc-swirl-shell-layout{display:flex;flex-grow:1;justify-content:center;align-items:center}.shell-layout__logo.sc-swirl-shell-layout-s>img{max-height:1.75rem}.shell-layout__header-tool.sc-swirl-shell-layout{position:relative;width:2.25rem;height:2.25rem;padding:var(--s-space-8);border:none;border-radius:var(--s-border-radius-sm);color:var(--swirl-shell-text-color);background-color:var(--s-surface-sunken-default);font:inherit;cursor:pointer}.shell-layout__header-tool.sc-swirl-shell-layout:hover{background-color:var(--s-surface-sunken-hovered)}.shell-layout__header-tool.sc-swirl-shell-layout:active{background-color:var(--s-surface-sunken-pressed)}.shell-layout__header-tool.sc-swirl-shell-layout:focus{outline:none}.shell-layout__header-tool.sc-swirl-shell-layout:focus-visible{box-shadow:0 0 0 0.125rem var(--s-focus-default)}.shell-layout__header-tool.sc-swirl-shell-layout swirl-badge.sc-swirl-shell-layout{--swirl-badge-border-color:var(--s-surface-sunken-default);position:absolute;right:0;bottom:0;transform:translate3d(0.1875rem, 0, 0)}.shell-layout__sidebar-toggle.sc-swirl-shell-layout{display:none}@media (min-width: 992px){.shell-layout__sidebar-toggle.sc-swirl-shell-layout{display:block}}.shell-layout__navigation-toggle.sc-swirl-shell-layout:hover swirl-icon-menu.sc-swirl-shell-layout{display:none}.shell-layout__navigation-toggle.sc-swirl-shell-layout:hover swirl-icon-double-arrow-left.sc-swirl-shell-layout{display:inline-flex}.shell-layout__navigation-toggle.sc-swirl-shell-layout swirl-icon-double-arrow-right.sc-swirl-shell-layout,.shell-layout__navigation-toggle.sc-swirl-shell-layout swirl-icon-double-arrow-left.sc-swirl-shell-layout{display:none}.shell-layout__nav.sc-swirl-shell-layout{position:fixed;z-index:9;top:0;bottom:0;left:0;overflow:auto;width:100%;max-width:18.75rem;color:var(--swirl-shell-text-color);background-color:var(--s-surface-overlay-default);transition:transform 0.2s, box-shadow 0.2s;transform:translate3d(-100%, 0, 0);grid-area:nav}@media (min-width: 992px){.shell-layout__nav.sc-swirl-shell-layout{position:static;max-width:none;padding-top:0;padding-right:var(--s-space-4);padding-bottom:var(--s-space-8);padding-left:var(--s-space-12);background-color:var(--swirl-shell-background);transform:none;box-shadow:none;inset:auto}}.shell-layout__mobile-header.sc-swirl-shell-layout{display:flex;min-height:3.5rem;margin-bottom:var(--s-space-8);padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);justify-content:space-between;align-items:center;border-bottom:0.0625rem solid var(--s-border-default)}.shell-layout__mobile-header.sc-swirl-shell-layout-s>img{max-height:1.75rem}.shell-layout__mobile-header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout{background-color:var(--s-surface-overlay-default)}.shell-layout__mobile-header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:hover{background-color:var(--s-surface-overlay-hovered)}.shell-layout__mobile-header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:active{background-color:var(--s-surface-overlay-pressed)}@media (min-width: 992px){.shell-layout__mobile-header.sc-swirl-shell-layout{display:none}}.shell-layout__mobile-header-tools.sc-swirl-shell-layout{display:flex;justify-content:flex-end;align-items:center;gap:var(--s-space-8)}.shell-layout__nav-body.sc-swirl-shell-layout{padding:var(--s-space-8)}.shell-layout__nav-body.sc-swirl-shell-layout-s ul{margin:0;padding:0;list-style:none}.shell-layout__nav-body.sc-swirl-shell-layout-s li{display:flex}@media (min-width: 992px){.shell-layout__nav-body.sc-swirl-shell-layout{padding:0}}.shell-layout__mobile-nav-backdrop.sc-swirl-shell-layout{position:fixed;z-index:8;display:none;background-color:rgba(0, 0, 0, 0.25);animation:shell-layout-backdrop-fade-in 0.2s;inset:0}.shell-layout__main.sc-swirl-shell-layout{overflow:hidden;grid-area:main}@media (min-width: 992px){.shell-layout__main.sc-swirl-shell-layout{width:calc(100% + var(--s-space-8));border:0.0625rem solid var(--s-border-default);border-radius:var(--s-border-radius-sm)}}.shell-layout__sidebar.sc-swirl-shell-layout{position:relative;display:none;grid-area:sidebar}@media (min-width: 992px){.shell-layout__sidebar.sc-swirl-shell-layout{display:block}}@media (min-width: 1440px){.shell-layout__sidebar.sc-swirl-shell-layout{overflow:hidden}}.shell-layout__sidebar-body.sc-swirl-shell-layout{z-index:1;display:flex;width:var(--swirl-shell-sidebar-width);height:100%;border-radius:var(--s-border-radius-sm);background-color:var(--s-background-default);flex-direction:column}@media (min-width: 992px){.shell-layout__sidebar-body.sc-swirl-shell-layout{position:absolute;top:0;right:0;bottom:0;transition:transform 0.2s;transform:translate3d(calc(100% + var(--s-space-24)), 0, 0);box-shadow:var(--s-shadow-level-3)}}@media (min-width: 1440px){.shell-layout__sidebar-body.sc-swirl-shell-layout{position:relative;transform:none;box-shadow:none;inset:auto}}.shell-layout__sidebar-app-bar.sc-swirl-shell-layout{flex-grow:0;flex-shrink:0;border-bottom:var(--s-border-width-default) solid var(--s-border-default)}.shell-layout__sidebar-content.sc-swirl-shell-layout{overflow:auto;flex-grow:1}@keyframes shell-layout-backdrop-fade-in{from{opacity:0}to{opacity:1}}';export{h as swirl_shell_layout}

package/dist/swirl-components/p-40ee5f22.entry.js

@@ -0,0 +1 @@
+import{r as n,h as e,H as i,g as s}from"./p-3fca9a05.js";import{c as a}from"./p-b7898321.js";const t=class{constructor(e){n(this,e),this.onKeyDown=n=>{"Enter"===n.code&&(n.preventDefault(),this.el.click())},this.active=void 0,this.badgeLabel=void 0,this.label=void 0}render(){const n=a("shell-navigation-item",{"shell-navigation-item--active":this.active});return e(i,{class:n,onKeyDown:this.onKeyDown,role:"link",tabIndex:0},e("span",{class:"shell-navigation-item__icon"},e("slot",{name:"icon"})),e("span",{class:"shell-navigation-item__label"},this.label),this.badgeLabel&&e("swirl-badge",{class:"shell-navigation-item__badge",size:"s","aria-label":this.badgeLabel,label:this.badgeLabel}))}get el(){return s(this)}};t.style="/**\n* seems the container query does not work as expected\n*/\n\n:host {\n  position: relative;\n  display: inline-flex;\n  width: 100%;\n  height: 2.75rem;\n  padding: var(--s-space-12);\n  flex-shrink: 0;\n  justify-content: flex-start;\n  align-items: center;\n  border-radius: var(--s-border-radius-sm);\n  background-color: var(--s-surface-overlay-default);\n  font-size: var(--s-font-size-sm);\n  font-weight: var(--s-font-weight-medium);\n  line-height: var(--s-line-height-sm);\n  cursor: pointer;\n  container-type: inline-size;\n  gap: var(--s-space-16);\n}\n\n:host(:hover) {\n    background-color: var(--s-surface-sunken-hovered);\n  }\n\n:host(:hover) .shell-navigation-item__badge {\n      --swirl-badge-border-color: var(--s-surface-sunken-hovered);\n    }\n\n:host(:active) {\n    background-color: var(--s-surface-sunken-pressed);\n  }\n\n:host(:active) .shell-navigation-item__badge {\n      --swirl-badge-border-color: var(--s-surface-sunken-pressed);\n    }\n\n:host(:focus) {\n    outline: none;\n  }\n\n:host(:focus-visible) {\n    z-index: 1;\n    box-shadow: 0 0 0 0.125rem var(--s-focus-default);\n  }\n\n:host(.shell-navigation-item--active) {\n    background-color: var(--s-surface-sunken-hovered);\n  }\n\n:host(.shell-navigation-item--active) .shell-navigation-item__badge {\n      --swirl-badge-border-color: var(--s-surface-sunken-hovered);\n    }\n\n:host(.shell-navigation-item--active:hover) {\n    background-color: var(--s-surface-sunken-hovered);\n  }\n\n:host(.shell-navigation-item--active:hover) .shell-navigation-item__badge {\n      --swirl-badge-border-color: var(--s-surface-sunken-hovered);\n    }\n\n:host(.shell-navigation-item--active:active) {\n    background-color: var(--s-surface-sunken-pressed);\n  }\n\n:host(.shell-navigation-item--active:active) .shell-navigation-item__badge {\n      --swirl-badge-border-color: var(--s-surface-sunken-pressed);\n    }\n\n:host * {\n    box-sizing: border-box;\n  }\n\n@media (min-width: 992px) {\n\n:host {\n    background-color: var(--s-surface-sunken-default)\n}\n  }\n\n.shell-navigation-item__icon {\n  display: inline-flex;\n  min-width: 1.25rem;\n  min-height: 1.25rem;\n  justify-content: center;\n  align-items: center;\n}\n\n.shell-navigation-item__label {\n  overflow: hidden;\n  min-width: 0;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n.shell-navigation-item__badge {\n  --swirl-badge-border-color: var(--swirl-shell-background);\n}\n\n@container (max-width: 4rem) {\n  .shell-navigation-item__label {\n    display: none;\n  }\n\n  .shell-navigation-item__badge {\n    position: absolute;\n    right: var(--s-space-4);\n    bottom: 0;\n  }\n}\n\n@container (min-width: 14rem) {\n  .shell-navigation-item__badge {\n    margin-left: auto;\n    padding-right: var(--s-space-4);\n  }\n}\n";export{t as swirl_shell_navigation_item}

package/dist/swirl-components/p-4a69e7f3.entry.js

@@ -0,0 +1 @@
+import{r as t,c as i,h as s,H as a,g as o}from"./p-3fca9a05.js";import{c as r}from"./p-b7898321.js";const n=class{constructor(s){t(this,s),this.backButtonClick=i(this,"backButtonClick",7),this.closeButtonClick=i(this,"closeButtonClick",7),this.stepUpButtonClick=i(this,"stepUpButtonClick",7),this.stepDownButtonClick=i(this,"stepDownButtonClick",7),this.onBackButtonClick=t=>{this.backButtonClick.emit(t)},this.onCloseButtonClick=t=>{this.closeButtonClick.emit(t)},this.onStepUpButtonClick=t=>{this.stepUpButtonClick.emit(t)},this.onStepDownButtonClick=t=>{this.stepDownButtonClick.emit(t)},this.backButtonLabel="Go back",this.closeButtonIcon="<swirl-icon-close></swirl-icon-close>",this.closeButtonLabel="Close",this.stepUpButtonLabel="Previous item",this.stepDownButtonLabel="Next item",this.showBackButton=void 0,this.showCloseButton=void 0,this.showStepperControls=void 0,this.hasCta=void 0}componentWillLoad(){this.mutationObserver=new MutationObserver((()=>{this.updateCtaStatus()})),this.mutationObserver.observe(this.el,{childList:!0}),queueMicrotask((()=>{this.updateCtaStatus()}))}disconnectedCallback(){this.mutationObserver?.disconnect()}updateCtaStatus(){this.hasCta=Boolean(this.el.querySelector('[slot="cta"]'))}render(){const t=this.showBackButton||this.showCloseButton||this.showStepperControls,i=Boolean(this.el.querySelector('[slot="right-controls"]')),o=r("app-bar",{"app-bar--has-cta":this.hasCta,"app-bar--has-right-controls":i});return s(a,null,s("div",{class:o},t&&s("div",{class:"app-bar__left-controls"},(this.showBackButton||this.showCloseButton)&&s("div",{class:"app-bar__main-navigation-control"},this.showBackButton&&s("swirl-button",{hideLabel:!0,icon:"<swirl-icon-arrow-back></swirl-icon-arrow-back>",label:this.backButtonLabel,onClick:this.onBackButtonClick}),this.showCloseButton&&s("swirl-button",{hideLabel:!0,icon:this.closeButtonIcon,label:this.closeButtonLabel,onClick:this.onCloseButtonClick})),this.showStepperControls&&s("div",{class:"app-bar__stepper-controls"},s("swirl-button",{hideLabel:!0,icon:"<swirl-icon-arrow-upward></swirl-icon-arrow-upward>",label:this.stepUpButtonLabel,onClick:this.onStepUpButtonClick}),s("swirl-button",{hideLabel:!0,icon:"<swirl-icon-arrow-downward></swirl-icon-arrow-downward>",label:this.stepDownButtonLabel,onClick:this.onStepDownButtonClick}))),s("div",{class:"app-bar__cta"},s("slot",{name:"cta"})),s("div",{class:"app-bar__heading"},s("slot",{name:"heading"})),s("div",{class:"app-bar__center-controls"},s("slot",{name:"center-controls"})),s("div",{class:"app-bar__right-controls"},s("slot",{name:"right-controls"}))))}get el(){return o(this)}};n.style=':host{display:block;overflow-x:auto;width:100%}:host *{box-sizing:border-box}.app-bar{display:flex;min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content;min-height:3.5rem;padding-right:var(--s-space-16);padding-left:var(--s-space-16);align-items:center;gap:var(--s-space-16)}.app-bar--has-cta .app-bar__cta{display:block}.app-bar:not(.app-bar--has-right-controls) .app-bar__right-controls{display:none}.app-bar__left-controls{display:flex;min-width:0;flex-shrink:0;align-items:center;gap:var(--s-space-16)}.app-bar__main-navigation-control{flex-shrink:0}.app-bar__cta{display:none}.app-bar__heading{display:flex;min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content;flex-grow:1;align-items:center}@media (min-width: 992px){.app-bar__heading{flex-grow:0}}.app-bar__stepper-controls{position:relative;display:flex;flex-shrink:0;gap:var(--s-space-4)}.app-bar__stepper-controls:not(:first-child){padding-left:var(--s-space-16)}.app-bar__stepper-controls:not(:first-child):after{position:absolute;top:50%;left:0;width:var(--s-border-width-default);height:1.25rem;background-color:var(--s-border-default);content:"";transform:translateY(-50%)}.app-bar__center-controls{display:none;flex-grow:1;justify-content:center;align-items:center}@media (min-width: 992px){.app-bar__center-controls{display:flex}}.app-bar__right-controls{display:flex;min-width:0;flex-shrink:0;justify-content:flex-end;align-items:center}';export{n as swirl_app_bar}

package/dist/swirl-components/p-76c36ee9.entry.js

@@ -0,0 +1 @@
+import{r,h as i,H as s}from"./p-3fca9a05.js";const l=class{constructor(i){r(this,i)}render(){return i(s,null,i("slot",null))}};l.style=".sc-swirl-visually-hidden-h{position:absolute;display:inline;overflow:hidden;width:1px;height:1px;margin:-1px;padding:0;border:0;white-space:nowrap;word-wrap:normal;clip:rect(0, 0, 0, 0)}";export{l as swirl_visually_hidden}

package/dist/swirl-components/p-7c4a4b66.entry.js

@@ -0,0 +1 @@
+import{r as a,c as o,h as e,H as d,g as t}from"./p-3fca9a05.js";import{d as s,e as r}from"./p-33c168b3.js";import{c as i}from"./p-c2e1dfdb.js";import{c as l}from"./p-b7898321.js";const n=class{constructor(e){a(this,e),this.modalClose=o(this,"modalClose",7),this.modalOpen=o(this,"modalOpen",7),this.primaryAction=o(this,"primaryAction",7),this.requestModalClose=o(this,"requestModalClose",7),this.secondaryAction=o(this,"secondaryAction",7),this.onKeyDown=a=>{"Escape"===a.code&&this.close()},this.onBackdropClick=()=>{this.close()},this.onCloseButtonClick=()=>{this.close()},this.onPrimaryAction=a=>{this.primaryAction.emit(a)},this.onSecondaryAction=a=>{this.secondaryAction.emit(a)},this.determineScrollStatus=()=>{const a=this.scrollContainer?.scrollTop>0,o=Math.ceil(this.scrollContainer?.scrollTop+this.scrollContainer?.offsetHeight)>=this.scrollContainer?.scrollHeight,e=this.scrollContainer?.scrollHeight>this.scrollContainer?.offsetHeight;a!==this.scrolled&&(this.scrolled=a),o!==this.scrolledDown&&(this.scrolledDown=o),e!==this.scrollable&&(this.scrollable=e)},this.closable=!0,this.closeButtonLabel="Close modal",this.height=void 0,this.hideCloseButton=void 0,this.hideLabel=void 0,this.label=void 0,this.maxHeight=void 0,this.maxWidth=void 0,this.padded=!0,this.primaryActionLabel=void 0,this.secondaryActionLabel=void 0,this.variant="default",this.isOpen=!1,this.closing=!1,this.hasCustomHeader=void 0,this.hasCustomFooter=void 0,this.hasHeaderTools=void 0,this.hasSecondaryContent=void 0,this.scrollable=!1,this.scrolled=!1,this.scrolledDown=!1}componentDidLoad(){this.focusTrap=i(this.modalEl,{allowOutsideClick:!0,tabbableOptions:{getShadowRoot:a=>a.shadowRoot}}),this.determineScrollStatus(),queueMicrotask((()=>{this.updateCustomFooterStatus(),this.updateCustomHeaderStatus(),this.updateHeaderToolsStatus(),this.updateSecondaryContentStatus()}))}componentDidRender(){this.focusTrap?.updateContainerElements(this.modalEl)}disconnectedCallback(){this.focusTrap?.deactivate(),this.unlockBodyScroll()}onWindowResize(){this.determineScrollStatus()}watchIsOpen(){this.isOpen?setTimeout((()=>{this.focusTrap.activate(),this.handleAutoFocus()}),200):this.focusTrap.deactivate()}async open(){this.isOpen=!0,this.modalOpen.emit(),this.lockBodyScroll(),this.determineScrollStatus()}async close(a){this.closing||(this.requestModalClose.emit(),(this.closable||a)&&(this.closing=!0,this.unlockBodyScroll(),setTimeout((()=>{this.isOpen=!1,this.modalClose.emit(),this.closing=!1}),150)))}updateCustomFooterStatus(){this.hasCustomFooter=Boolean(this.el.querySelector('[slot="custom-footer"]'))}updateCustomHeaderStatus(){this.hasCustomHeader=Boolean(this.el.querySelector('[slot="custom-header"]'))}updateHeaderToolsStatus(){this.hasHeaderTools=Boolean(this.el.querySelector('[slot="header-tools"]'))}updateSecondaryContentStatus(){this.hasSecondaryContent=Boolean(this.el.querySelector('[slot="secondary-content"]'))}handleAutoFocus(){this.modalEl.querySelector("input[autofocus]")?.focus()}lockBodyScroll(){s(this.scrollContainer)}unlockBodyScroll(){r(this.scrollContainer)}render(){const a=Boolean(this.primaryActionLabel)||Boolean(this.secondaryActionLabel),o=l("modal",`modal--variant-${this.variant}`,{"modal--closing":this.closing,"modal--has-custom-footer":this.hasCustomFooter,"modal--has-custom-header":this.hasCustomHeader,"modal--has-header-tools":this.hasHeaderTools,"modal--has-secondary-content":this.hasSecondaryContent,"modal--hide-label":this.hideLabel,"modal--padded":this.padded,"modal--scrollable":this.scrollable,"modal--scrolled":this.scrolled,"modal--scrolled-down":this.scrolledDown});return e(d,null,e("section",{"aria-hidden":String(!this.isOpen),"aria-label":this.label,"aria-modal":"true",class:o,onKeyDown:this.onKeyDown,role:"dialog",ref:a=>this.modalEl=a},e("div",{class:"modal__backdrop",onClick:this.onBackdropClick}),e("div",{class:"modal__body",style:{"--swirl-modal-max-height":this.maxHeight,"--swirl-modal-height":this.height,maxWidth:this.maxWidth}},e("header",{class:"modal__custom-header"},e("slot",{name:"custom-header"})),(!this.hideLabel||!this.hideCloseButton)&&e("header",{class:"modal__header"},e("div",{class:"modal__header-bar"},!this.hideCloseButton&&e("swirl-button",{class:"modal__close-button",hideLabel:!0,icon:"default"===this.variant?"<swirl-icon-close></swirl-icon-close>":"<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>",label:this.closeButtonLabel,onClick:this.onCloseButtonClick}),!this.hideLabel&&e("swirl-heading",{as:"h2",class:"modal__heading",level:3,text:this.label}))),e("div",{class:"modal__content-container"},e("div",{class:"modal__primary-content"},e("div",{class:"modal__header-tools"},e("slot",{name:"header-tools"})),e("div",{class:"modal__content",onScroll:this.determineScrollStatus,ref:a=>this.scrollContainer=a},e("slot",null))),e("div",{class:"modal__secondary-content"},e("slot",{name:"secondary-content"}))),e("div",{class:"modal__custom-footer"},e("slot",{name:"custom-footer"})),a&&e("footer",{class:"modal__controls"},e("swirl-button-group",{wrap:!0},this.secondaryActionLabel&&e("swirl-button",{label:this.secondaryActionLabel,onClick:this.onSecondaryAction}),this.primaryActionLabel&&e("swirl-button",{intent:"primary",label:this.primaryActionLabel,onClick:this.onPrimaryAction,variant:"flat"}))))))}get el(){return t(this)}static get watchers(){return{isOpen:["watchIsOpen"]}}};n.style=':host{display:block}:host *{box-sizing:border-box}.modal{--swirl-ghost-button-background-default:var(--s-surface-overlay-default);--swirl-ghost-button-background-hovered:var(--s-surface-overlay-hovered);--swirl-ghost-button-background-pressed:var(--s-surface-overlay-pressed);--swirl-resource-list-item-background-default:var(\n    --s-surface-overlay-default\n  );--swirl-resource-list-item-background-hovered:var(\n    --s-surface-overlay-hovered\n  );--swirl-resource-list-item-background-pressed:var(\n    --s-surface-overlay-pressed\n  );--swirl-modal-height:auto;--swirl-modal-max-height:90vh;position:fixed;z-index:var(--s-z-40);display:flex;justify-content:center;align-items:center;inset:0}.modal[aria-hidden="true"]{display:none}.modal--variant-default.modal--closing{animation:0.15s modal-fade-out;animation-fill-mode:forwards}@media (prefers-reduced-motion){.modal--variant-default.modal--closing{animation:none}}.modal--variant-default:not(.modal--closing) .modal__backdrop{animation:0.15s modal-backdrop-fade-in}@media (prefers-reduced-motion){.modal--variant-default:not(.modal--closing) .modal__backdrop{animation:none}}.modal--variant-default:not(.modal--closing) .modal__body{animation:0.15s modal-scale-in}@media (prefers-reduced-motion){.modal--variant-default:not(.modal--closing) .modal__body{animation:none}}.modal--variant-drawer{justify-content:end;align-items:stretch}.modal--variant-drawer.modal--closing{animation:0.15s modal-drawer-slide-out;animation-fill-mode:forwards}@media (prefers-reduced-motion){.modal--variant-drawer.modal--closing{animation:none}}@media (min-width: 768px){.modal--variant-drawer.modal--hide-label .modal__header-bar{height:auto;padding-top:var(--s-space-4);padding-bottom:var(--s-space-4)}}.modal--variant-drawer .modal__backdrop{background-color:transparent;animation:none}.modal--variant-drawer .modal__body{height:100%;max-height:none;border-radius:0;animation:0.15s modal-drawer-slide-in;box-shadow:var(--s-shadow-level-3)}@media (prefers-reduced-motion){.modal--variant-drawer .modal__body{animation:none}}.modal--variant-drawer .modal__header-bar{background-color:var(--s-surface-overlay-default)}.modal--variant-drawer .modal__header-bar .modal__close-button{margin-left:calc(-1 * var(--s-space-8))}@media (min-width: 768px){.modal--variant-drawer .modal__header-bar{flex-direction:row}}.modal--variant-drawer .modal__content{min-height:100%}@media (min-width: 768px){.modal--variant-drawer.modal--padded .modal__content{padding-top:var(--s-space-8)}}.modal--padded .modal__content{padding-top:var(--s-space-24);padding-right:var(--s-space-16);padding-bottom:var(--s-space-24);padding-left:var(--s-space-16)}@media (min-width: 768px){.modal--padded .modal__content{padding-top:0;padding-right:var(--s-space-24);padding-bottom:var(--s-space-16);padding-left:var(--s-space-24)}}@media (min-width: 768px){.modal--scrollable .modal__content{padding-bottom:0}}.modal--scrollable:not(.modal--scrolled-down).modal--has-custom-footer .modal__custom-footer{border-top:var(--s-border-width-default) solid var(--s-border-default)}.modal--scrollable:not(.modal--scrolled-down):not(.modal--has-custom-footer) .modal__controls{border-top:var(--s-border-width-default) solid var(--s-border-default)}.modal--has-custom-header .modal__custom-header{display:block}.modal--has-custom-header .modal__content{padding-top:var(--s-space-16)}.modal--has-custom-footer .modal__custom-footer{padding-top:var(--s-space-16);padding-right:var(--s-space-24);padding-bottom:var(--s-space-16);padding-left:var(--s-space-24)}.modal--has-header-tools .modal__header{border-bottom-color:transparent}.modal--has-header-tools .modal__header-tools{display:block}.modal--has-secondary-content .modal__body{max-width:64rem}.modal--has-secondary-content:not(.modal--has-header-tools) .modal__header{border-bottom-color:var(--s-border-default)}.modal--has-secondary-content.modal--has-header-tools .modal__header-tools{border-bottom-color:var(--s-border-default)}.modal--has-secondary-content.modal--has-custom-footer .modal__custom-footer{border-top:var(--s-border-width-default) solid var(--s-border-default)}.modal--has-secondary-content:not(.modal--has-custom-footer) .modal__controls{border-top:var(--s-border-width-default) solid var(--s-border-default)}@media (min-width: 992px){.modal--has-secondary-content .modal__header-tools,.modal--has-secondary-content .modal__content{padding-right:0}}.modal--has-secondary-content .modal__primary-content{overflow:visible;max-height:60%;flex-basis:auto}@media (min-width: 992px){.modal--has-secondary-content .modal__primary-content{max-width:calc(100% - 24rem);max-height:none;flex-basis:calc(100% - 24rem)}}.modal--has-secondary-content .modal__secondary-content{display:block}@media (min-width: 768px){.modal--scrolled:not(.modal--has-header-tools) .modal__header{border-bottom-color:var(--s-border-default)}.modal--scrolled.modal--has-header-tools .modal__header-tools{border-bottom-color:var(--s-border-default)}}.modal__backdrop{position:fixed;background-color:rgba(0, 0, 0, 0.2);inset:0}.modal__body{--swirl-card-background-default:var(--s-surface-overlay-default);--swirl-card-background-hovered:var(--s-surface-overlay-hovered);--swirl-card-background-pressed:var(--s-surface-overlay-pressed);--swirl-accordion-item-toggle-default:var(--s-surface-overlay-default);--swirl-accordion-item-toggle-hovered:var(--s-surface-overlay-hovered);--swirl-accordion-item-toggle-pressed:var(--s-surface-overlay-pressed);position:relative;z-index:var(--s-z-40);display:flex;overflow:hidden;width:100vw;max-width:40rem;height:100vh;background-color:var(--s-surface-overlay-default);flex-direction:column}@media (min-width: 768px){.modal__body{width:90vw;max-height:var(--swirl-modal-max-height);border-radius:var(--s-border-radius-base);box-shadow:var(--s-shadow-level-3)}}@media (min-width: 992px){.modal__body{height:var(--swirl-modal-height)}}.modal__header{border-bottom:var(--s-border-width-default) solid var(--s-border-default)}@media (min-width: 768px){.modal__header{border-bottom:var(--s-border-width-default) solid transparent}}.modal__header-bar{display:flex;height:3.5rem;padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);flex-shrink:0;align-items:center;gap:var(--s-space-8)}@media (min-width: 768px){.modal__header-bar{height:3.75rem;padding-top:var(--s-space-12);padding-right:var(--s-space-24);padding-bottom:var(--s-space-12);padding-left:var(--s-space-24);flex-direction:row-reverse;gap:var(--s-space-16)}}.modal__header-tools{display:none;padding-right:var(--s-space-16);padding-left:var(--s-space-16);border-bottom:var(--s-border-width-default) solid var(--s-border-default)}@media (min-width: 768px){.modal__header-tools{padding-right:var(--s-space-24);padding-left:var(--s-space-24);border-bottom-color:transparent}}.modal__custom-header{display:none;flex-shrink:0;border-bottom:var(--s-border-width-default) solid var(--s-border-default)}.modal__heading{overflow:hidden}.modal__heading .heading{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.modal__content-container{display:flex;overflow:hidden;flex-grow:1;flex-direction:column;gap:var(--s-space-24)}@media (min-width: 992px){.modal__content-container{flex-direction:row}}.modal__primary-content{display:flex;overflow:hidden;flex-basis:100%;flex-direction:column}.modal__content{overflow-x:hidden;overflow-y:auto;min-height:100%}.modal__content ::slotted(*){margin:0}.modal__secondary-content{display:none;overflow:visible;overflow-x:hidden;overflow-y:auto;max-width:none;max-height:40%;padding-right:var(--s-space-16);padding-left:var(--s-space-16)}@media (min-width: 768px){.modal__secondary-content{padding-left:var(--s-space-24)}}@media (min-width: 992px){.modal__secondary-content{overflow-x:hidden;overflow-y:auto;max-width:24rem;max-height:none;padding-right:var(--s-space-24);padding-bottom:var(--s-space-16);padding-left:0;flex-basis:50%}}.modal__custom-footer{flex-shrink:0}.modal__controls{display:flex;padding-top:var(--s-space-16);padding-right:var(--s-space-24);padding-bottom:var(--s-space-16);padding-left:var(--s-space-24);flex-shrink:0;justify-content:flex-end}@keyframes modal-scale-in{from{transform:scale(0)}to{transform:scale(1)}}@keyframes modal-backdrop-fade-in{from{opacity:0}to{opacity:1}}@keyframes modal-fade-out{from{opacity:1}to{opacity:0}}@keyframes modal-drawer-slide-in{from{transform:translate3d(100%, 0, 0)}to{transform:translate3d(0, 0, 0)}}@keyframes modal-drawer-slide-out{from{transform:translate3d(0, 0, 0)}to{transform:translate3d(100%, 0, 0)}}';export{n as swirl_modal}