@getflip/swirl-components-react 0.168.1 → 0.169.1

package/dist/swirl-modal.entry.2f32b2d1.js

@@ -0,0 +1,118 @@
+import { r as h, c as d, h as o, H as p, g as u } from "./index.aecee312.js";
+import { d as f, e as v } from "./bodyScrollLock.esm-ce6356d8.2c600fb9.js";
+import { c as b } from "./index-d280dafb.186cdb0e.js";
+import { c as g } from "./focus-trap.esm-37cd2d2b.724cca66.js";
+import "react";
+import "react-dom";
+const _ = `: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(
+    --s-surface-overlay-default
+  );--swirl-resource-list-item-background-hovered:var(
+    --s-surface-overlay-hovered
+  );--swirl-resource-list-item-background-pressed:var(
+    --s-surface-overlay-pressed
+  );--swirl-modal-height:auto;--swirl-modal-max-height:90vh;--swirl-modal-view-height:100vh}@supports (height: 100dvh){.modal{--swirl-modal-max-height:90dvh;--swirl-modal-view-height:100dvh}}.modal{position:fixed;z-index:var(--s-z-40);display:flex;justify-content:center;align-items:center;height:var(--swirl-modal-view-height);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:var(--swirl-modal-view-height);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)}}`, w = class {
+  constructor(a) {
+    h(this, a), this.modalClose = d(this, "modalClose", 7), this.modalOpen = d(this, "modalOpen", 7), this.primaryAction = d(this, "primaryAction", 7), this.requestModalClose = d(this, "requestModalClose", 7), this.secondaryAction = d(this, "secondaryAction", 7), this.onKeyDown = (e) => {
+      e.code === "Escape" && (e.stopImmediatePropagation(), this.close());
+    }, this.onBackdropClick = () => {
+      this.close();
+    }, this.onCloseButtonClick = () => {
+      this.close();
+    }, this.onPrimaryAction = (e) => {
+      this.primaryAction.emit(e);
+    }, this.onSecondaryAction = (e) => {
+      this.secondaryAction.emit(e);
+    }, this.determineScrollStatus = () => {
+      var r, l, i, n, c, m;
+      const e = ((r = this.scrollContainer) == null ? void 0 : r.scrollTop) > 0, t = Math.ceil(((l = this.scrollContainer) == null ? void 0 : l.scrollTop) + ((i = this.scrollContainer) == null ? void 0 : i.offsetHeight)) >= ((n = this.scrollContainer) == null ? void 0 : n.scrollHeight), s = ((c = this.scrollContainer) == null ? void 0 : c.scrollHeight) > ((m = this.scrollContainer) == null ? void 0 : m.offsetHeight);
+      e !== this.scrolled && (this.scrolled = e), t !== this.scrolledDown && (this.scrolledDown = t), s !== this.scrollable && (this.scrollable = s);
+    }, 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 = g(this.modalEl, {
+      allowOutsideClick: !0,
+      tabbableOptions: {
+        getShadowRoot: (a) => a.shadowRoot
+      }
+    }), this.determineScrollStatus(), queueMicrotask(() => {
+      this.updateCustomFooterStatus(), this.updateCustomHeaderStatus(), this.updateHeaderToolsStatus(), this.updateSecondaryContentStatus();
+    });
+  }
+  componentDidRender() {
+    var a;
+    (a = this.focusTrap) == null || a.updateContainerElements(this.modalEl);
+  }
+  disconnectedCallback() {
+    var a;
+    (a = this.focusTrap) == null || a.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() {
+    var a;
+    (a = this.modalEl.querySelector("input[autofocus]")) == null || a.focus();
+  }
+  lockBodyScroll() {
+    f(this.scrollContainer);
+  }
+  unlockBodyScroll() {
+    v(this.scrollContainer);
+  }
+  render() {
+    const a = Boolean(this.primaryActionLabel) || Boolean(this.secondaryActionLabel), e = b("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 o(p, null, o("section", { "aria-hidden": String(!this.isOpen), "aria-label": this.label, "aria-modal": "true", class: e, onKeyDown: this.onKeyDown, role: "dialog", ref: (t) => this.modalEl = t }, o("div", { class: "modal__backdrop", onClick: this.onBackdropClick }), o("div", { class: "modal__body", style: {
+      "--swirl-modal-max-height": this.maxHeight,
+      "--swirl-modal-height": this.height,
+      maxWidth: this.maxWidth
+    } }, o("header", { class: "modal__custom-header" }, o("slot", { name: "custom-header" })), (!this.hideLabel || !this.hideCloseButton) && o("header", { class: "modal__header" }, o("div", { class: "modal__header-bar" }, !this.hideCloseButton && o("swirl-button", { class: "modal__close-button", hideLabel: !0, icon: this.variant === "default" ? "<swirl-icon-close></swirl-icon-close>" : "<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>", label: this.closeButtonLabel, onClick: this.onCloseButtonClick }), !this.hideLabel && o("swirl-heading", { as: "h2", class: "modal__heading", level: 3, text: this.label }))), o("div", { class: "modal__content-container" }, o("div", { class: "modal__primary-content" }, o("div", { class: "modal__header-tools" }, o("slot", { name: "header-tools" })), o("div", { class: "modal__content", onScroll: this.determineScrollStatus, ref: (t) => this.scrollContainer = t }, o("slot", null))), o("div", { class: "modal__secondary-content" }, o("slot", { name: "secondary-content" }))), o("div", { class: "modal__custom-footer" }, o("slot", { name: "custom-footer" })), a && o("footer", { class: "modal__controls" }, o("swirl-button-group", { wrap: !0 }, this.secondaryActionLabel && o("swirl-button", { label: this.secondaryActionLabel, onClick: this.onSecondaryAction }), this.primaryActionLabel && o("swirl-button", { intent: "primary", label: this.primaryActionLabel, onClick: this.onPrimaryAction, variant: "flat" }))))));
+  }
+  get el() {
+    return u(this);
+  }
+  static get watchers() {
+    return {
+      isOpen: ["watchIsOpen"]
+    };
+  }
+};
+w.style = _;
+export {
+  w as swirl_modal
+};

package/dist/{swirl-option-list-section.entry.f2ea55c8.js → swirl-option-list-section.entry.a225783a.js}

@@ -1,4 +1,4 @@
-import { r as s, h as t, H as e } from "./index.0b541b9a.js";
+import { r as s, h as t, H as e } from "./index.aecee312.js";
 import "react";
 import "react-dom";
 const o = ":host{display:block}:host *{box-sizing:border-box}.option-list-section{background-color:var(--s-surface-overlay-default)}.option-list-section__label{display:block;width:100%;padding:var(--s-space-8) var(--s-space-16);border-bottom:var(--s-border-width-default) solid var(--s-border-default);color:var(--s-text-subdued);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-section__label{padding:var(--s-space-8) var(--s-space-12);font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}", l = class {

package/dist/{swirl-option-list_2.entry.7d51082a.js → swirl-option-list_2.entry.c1c41e69.js}

@@ -1,4 +1,4 @@
-import { r as h, c as a, h as o, H as c, g as d } from "./index.0b541b9a.js";
+import { r as h, c as a, h as o, H as c, g as d } from "./index.aecee312.js";
 import { c as l, q as n } from "./utils-c5f2f98f.af14538a.js";
 import { S as m } from "./sortable.esm-8c3d5856.57c4f048.js";
 import { c as f } from "./index-d280dafb.186cdb0e.js";

package/dist/{swirl-pagination.entry.633a8ff9.js → swirl-pagination.entry.4cdf1bb1.js}

@@ -1,4 +1,4 @@
-import { r as l, c as s, h as i, H as r } from "./index.0b541b9a.js";
+import { r as l, c as s, h as i, H as r } from "./index.aecee312.js";
 import { c as p } from "./index-d280dafb.186cdb0e.js";
 import { d as g } from "./utils-c5f2f98f.af14538a.js";
 import "react";

package/dist/{swirl-pdf-reader.entry.37f322f3.js → swirl-pdf-reader.entry.c0ffce1e.js}

@@ -1,4 +1,4 @@
-import { r as d, c as r, h as e, H as h, g as c } from "./index.0b541b9a.js";
+import { r as d, c as r, h as e, H as h, g as c } from "./index.aecee312.js";
 import { A as p } from "./a11y-dialog.esm-d7a94c8c.bd6ae411.js";
 import { d as m, e as u } from "./bodyScrollLock.esm-ce6356d8.2c600fb9.js";
 import { c as l } from "./index-d280dafb.186cdb0e.js";

package/dist/{swirl-popover_2.entry.6bf58627.js → swirl-popover_2.entry.f62ae1ef.js}

@@ -1,4 +1,4 @@
-import { r as g, c as l, h as n, H as v, g as m } from "./index.0b541b9a.js";
+import { r as g, c as l, h as n, H as v, g as m } from "./index.aecee312.js";
 import { o as c, s as d, f as w, c as y, a as x } from "./floating-ui.dom.esm-b73e243b.647a7c7e.js";
 import { d as C, e as E } from "./bodyScrollLock.esm-ce6356d8.2c600fb9.js";
 import { c as k } from "./index-d280dafb.186cdb0e.js";

package/dist/{swirl-progress-indicator.entry.0db37c93.js → swirl-progress-indicator.entry.a795ecf7.js}

@@ -1,4 +1,4 @@
-import { r as t, h as s, H as n } from "./index.0b541b9a.js";
+import { r as t, h as s, H as n } from "./index.aecee312.js";
 import { c } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-radio-group.entry.146a8650.js → swirl-radio-group.entry.efa01478.js}

@@ -1,4 +1,4 @@
-import { r as o, c as l, h as i, H as n, g as u } from "./index.0b541b9a.js";
+import { r as o, c as l, h as i, H as n, g as u } from "./index.aecee312.js";
 import "react";
 import "react-dom";
 const d = ".sc-swirl-radio-group-h{display:block}.sc-swirl-radio-group-h *.sc-swirl-radio-group{box-sizing:border-box}.radio-group.sc-swirl-radio-group{display:flex;flex-direction:column;gap:var(--s-space-12)}", h = class {

package/dist/{swirl-radio.entry.c33ecb20.js → swirl-radio.entry.98341643.js}

@@ -1,4 +1,4 @@
-import { r as e, c as l, h as i, H as c } from "./index.0b541b9a.js";
+import { r as e, c as l, h as i, H as c } from "./index.aecee312.js";
 import { c as t } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-resource-list-file-item.entry.d508a355.js → swirl-resource-list-file-item.entry.d781f262.js}

@@ -1,4 +1,4 @@
-import { r as c, c as n, h as e, H as a } from "./index.0b541b9a.js";
+import { r as c, c as n, h as e, H as a } from "./index.aecee312.js";
 import { c as m } from "./index-d280dafb.186cdb0e.js";
 import { g as h } from "./utils-c5f2f98f.af14538a.js";
 import "react";

package/dist/{swirl-search.entry.4505a79a.js → swirl-search.entry.391179a8.js}

@@ -1,4 +1,4 @@
-import { r as i, c as r, h as a, H as t } from "./index.0b541b9a.js";
+import { r as i, c as r, h as a, H as t } from "./index.aecee312.js";
 import { c } from "./index-d280dafb.186cdb0e.js";
 import { g as h } from "./utils-c5f2f98f.af14538a.js";
 import "react";

package/dist/{swirl-select.entry.fe28bd6f.js → swirl-select.entry.ff9756b4.js}

@@ -1,4 +1,4 @@
-import { r as u, c as h, h as s, H as w, g as v } from "./index.0b541b9a.js";
+import { r as u, c as h, h as s, H as w, g as v } from "./index.aecee312.js";
 import { c as m } from "./index-d280dafb.186cdb0e.js";
 import { q as _ } from "./utils-c5f2f98f.af14538a.js";
 import "react";

package/dist/{swirl-shell-layout.entry.e075fae2.js → swirl-shell-layout.entry.96e5ba4c.js}

@@ -1,4 +1,4 @@
-import { r, c as s, h as l, H as n } from "./index.0b541b9a.js";
+import { r, c as s, h as l, H as n } from "./index.aecee312.js";
 import { c as d } from "./index-d280dafb.186cdb0e.js";
 import { c as h } from "./focus-trap.esm-37cd2d2b.724cca66.js";
 import "react";
@@ -8,7 +8,7 @@ const c = `.sc-swirl-shell-layout-h{--swirl-shell-background:var(--s-surface-sun
           --swirl-shell-sidebar-width
         )}}@media (min-width: 1440px){.shell-layout--sidebar-active.sc-swirl-shell-layout .shell-layout__main.sc-swirl-shell-layout{width:100%}}.shell-layout--sidebar-active.sc-swirl-shell-layout .shell-layout__sidebar.sc-swirl-shell-layout{overflow:initial}@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(
         --swirl-shell-sidebar-width
-      )}}.sc-swirl-shell-layout:not(.shell-layout--sidebar-active) .shell-layout__sidebar.sc-swirl-shell-layout{animation:shell-layout-no-overflow-after-transition 0.2s;animation-fill-mode:forwards}.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>a{display:flex}.shell-layout__logo.sc-swirl-shell-layout-s>a img,.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;top:var(--s-space-4);right:var(--s-space-4);padding-right:var(--s-space-2);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-hamburger-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, width 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;background-color:var(--s-background-default);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;min-height:0;grid-area:sidebar}@media (min-width: 992px){.shell-layout__sidebar.sc-swirl-shell-layout{display:block}}.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}}@keyframes shell-layout-no-overflow-after-transition{0%{overflow:initial}99%{overflow:initial}100%{overflow:hidden}}`, i = "SWIRL_SHELL_NAVIGATION_COLLAPSE_STATE", o = "SWIRL_SHELL_SIDEBAR_STATE", u = class {
+      )}}.sc-swirl-shell-layout:not(.shell-layout--sidebar-active) .shell-layout__sidebar.sc-swirl-shell-layout{animation:shell-layout-no-overflow-after-transition 0.2s;animation-fill-mode:forwards}.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);--swirl-ghost-button-background-default:var(--s-surface-sunken-default);--swirl-ghost-button-background-hovered:var(--s-surface-sunken-hovered);--swirl-ghost-button-background-pressed:var(--s-surface-sunken-pressed)}.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>a{display:flex}.shell-layout__logo.sc-swirl-shell-layout-s>a img,.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;top:var(--s-space-4);right:var(--s-space-4);padding-right:var(--s-space-2);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-hamburger-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, width 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;background-color:var(--s-background-default);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;min-height:0;grid-area:sidebar}@media (min-width: 992px){.shell-layout__sidebar.sc-swirl-shell-layout{display:block}}.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}}@keyframes shell-layout-no-overflow-after-transition{0%{overflow:initial}99%{overflow:initial}100%{overflow:hidden}}`, o = "SWIRL_SHELL_NAVIGATION_COLLAPSE_STATE", i = "SWIRL_SHELL_SIDEBAR_STATE", u = class {
   constructor(e) {
     r(this, e), this.sidebarToggleClick = s(this, "sidebarToggleClick", 7), this.skipLinkClick = s(this, "skipLinkClick", 7), this.onBrowserBackClick = () => {
       history.back();
@@ -21,9 +21,9 @@ const c = `.sc-swirl-shell-layout-h{--swirl-shell-background:var(--s-surface-sun
     }, 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 e = localStorage.getItem(o) === "true";
+    const e = localStorage.getItem(i) === "true";
     this.sidebarActive = this.sidebarActive === void 0 ? e : this.sidebarActive;
-    const a = localStorage.getItem(i) === "true";
+    const a = localStorage.getItem(o) === "true";
     this.navigationCollapsed = a;
   }
   componentDidLoad() {
@@ -51,10 +51,10 @@ const c = `.sc-swirl-shell-layout-h{--swirl-shell-background:var(--s-surface-sun
     }, 200) : this.focusTrap.deactivate();
   }
   watchNavigationCollapsed() {
-    localStorage.setItem(i, String(this.navigationCollapsed));
+    localStorage.setItem(o, String(this.navigationCollapsed));
   }
   watchSidebarActive() {
-    localStorage.setItem(o, String(this.sidebarActive));
+    localStorage.setItem(i, String(this.sidebarActive));
   }
   async showMobileNavigation() {
     this.mobileNavigationActive = !0;
@@ -69,7 +69,7 @@ const c = `.sc-swirl-shell-layout-h{--swirl-shell-background:var(--s-surface-sun
       "shell-layout--navigation-collapsed": this.navigationCollapsed,
       "shell-layout--sidebar-active": this.sidebarActive
     });
-    return l(n, null, l("div", { class: a }, l("header", { class: "shell-layout__header", "data-tauri-drag-region": "true" }, l("button", { class: "shell-layout__skip-link", onClick: this.skipLinkClick.emit, type: "button" }, this.skipLinkLabel), l("div", { class: "shell-layout__header-left" }, l("button", { class: "shell-layout__header-tool shell-layout__navigation-toggle", onClick: this.onNavigationToggleClick, type: "button" }, l("swirl-icon-hamburger-menu", { size: 20 }), l("swirl-icon-double-arrow-left", { size: 20 }), l("swirl-icon-double-arrow-right", { size: 20 }), l("swirl-visually-hidden", null, this.navigationToggleLabel)), l("button", { class: "shell-layout__header-tool", onClick: this.onBrowserBackClick, type: "button" }, l("swirl-icon-arrow-back", { size: 20 }), l("swirl-visually-hidden", null, this.browserBackButtonLabel)), l("button", { class: "shell-layout__header-tool", onClick: this.onBrowserForwardClick, type: "button" }, l("swirl-icon-arrow-forward", { size: 20 }), l("swirl-visually-hidden", null, this.browserForwardButtonLabel))), l("div", { class: "shell-layout__logo" }, l("slot", { name: "logo" })), l("div", { class: "shell-layout__header-right" }, l("button", { class: "shell-layout__header-tool shell-layout__sidebar-toggle", onClick: this.sidebarToggleClick.emit, type: "button" }, l("swirl-icon", { glyph: this.sidebarToggleIcon, size: 20 }), l("swirl-visually-hidden", null, this.sidebarToggleLabel), this.sidebarToggleBadge && l("swirl-badge", { "aria-label": this.sidebarToggleBadgeAriaLabel, label: e ? String(this.sidebarToggleBadge) : this.sidebarToggleBadgeAriaLabel, size: "xs", variant: e ? "default" : "dot" })), l("slot", { name: "header-tools" }))), l("div", { class: "shell-layout__mobile-nav-backdrop", onClick: this.onNavigationClick }), l("nav", { "aria-labelledby": "main-navigation-label", class: "shell-layout__nav", onClick: this.onNavigationClick, ref: (t) => this.navElement = t }, l("div", { class: "shell-layout__mobile-header" }, l("slot", { name: "mobile-logo" }), l("div", { class: "shell-layout__mobile-header-tools" }, l("slot", { name: "mobile-header-tools" }), l("button", { class: "shell-layout__header-tool", type: "button" }, l("swirl-icon-double-arrow-left", { size: 20 }), l("swirl-visually-hidden", null, this.hideMobileNavigationButtonLabel)))), l("div", { class: "shell-layout__nav-body" }, l("swirl-visually-hidden", null, l("span", { id: "main-navigation-label" }, this.navigationLabel)), l("slot", { name: "nav" }))), l("main", { class: "shell-layout__main", id: "main-content" }, l("slot", null)), l("aside", { class: "shell-layout__sidebar", inert: this.sidebarActive ? void 0 : !0 }, l("div", { class: "shell-layout__sidebar-body" }, l("div", { class: "shell-layout__sidebar-app-bar" }, l("slot", { name: "sidebar-app-bar" })), l("div", { class: "shell-layout__sidebar-content" }, l("slot", { name: "sidebar" }))))));
+    return l(n, null, l("div", { class: a }, l("header", { class: "shell-layout__header", "data-tauri-drag-region": "true" }, l("button", { class: "shell-layout__skip-link", onClick: this.skipLinkClick.emit, type: "button" }, this.skipLinkLabel), l("div", { class: "shell-layout__header-left" }, l("button", { class: "shell-layout__header-tool shell-layout__navigation-toggle", onClick: this.onNavigationToggleClick, type: "button" }, l("swirl-icon-hamburger-menu", { size: 20 }), l("swirl-icon-double-arrow-left", { size: 20 }), l("swirl-icon-double-arrow-right", { size: 20 }), l("swirl-visually-hidden", null, this.navigationToggleLabel)), l("button", { class: "shell-layout__header-tool", onClick: this.onBrowserBackClick, type: "button" }, l("swirl-icon-arrow-back", { size: 20 }), l("swirl-visually-hidden", null, this.browserBackButtonLabel)), l("button", { class: "shell-layout__header-tool", onClick: this.onBrowserForwardClick, type: "button" }, l("swirl-icon-arrow-forward", { size: 20 }), l("swirl-visually-hidden", null, this.browserForwardButtonLabel))), l("div", { class: "shell-layout__logo" }, l("slot", { name: "logo" })), l("div", { class: "shell-layout__header-right" }, l("slot", { name: "header-tools" }), l("button", { class: "shell-layout__header-tool shell-layout__sidebar-toggle", onClick: this.sidebarToggleClick.emit, type: "button" }, l("swirl-icon", { glyph: this.sidebarToggleIcon, size: 20 }), l("swirl-visually-hidden", null, this.sidebarToggleLabel), this.sidebarToggleBadge && l("swirl-badge", { "aria-label": this.sidebarToggleBadgeAriaLabel, label: e ? String(this.sidebarToggleBadge) : this.sidebarToggleBadgeAriaLabel, size: "xs", variant: e ? "default" : "dot" })), l("slot", { name: "avatar" }))), l("div", { class: "shell-layout__mobile-nav-backdrop", onClick: this.onNavigationClick }), l("nav", { "aria-labelledby": "main-navigation-label", class: "shell-layout__nav", onClick: this.onNavigationClick, ref: (t) => this.navElement = t }, l("div", { class: "shell-layout__mobile-header" }, l("slot", { name: "mobile-logo" }), l("div", { class: "shell-layout__mobile-header-tools" }, l("slot", { name: "mobile-header-tools" }), l("button", { class: "shell-layout__header-tool", type: "button" }, l("swirl-icon-double-arrow-left", { size: 20 }), l("swirl-visually-hidden", null, this.hideMobileNavigationButtonLabel)))), l("div", { class: "shell-layout__nav-body" }, l("swirl-visually-hidden", null, l("span", { id: "main-navigation-label" }, this.navigationLabel)), l("slot", { name: "nav" }))), l("main", { class: "shell-layout__main", id: "main-content" }, l("slot", null)), l("aside", { class: "shell-layout__sidebar", inert: this.sidebarActive ? void 0 : !0 }, l("div", { class: "shell-layout__sidebar-body" }, l("div", { class: "shell-layout__sidebar-app-bar" }, l("slot", { name: "sidebar-app-bar" })), l("div", { class: "shell-layout__sidebar-content" }, l("slot", { name: "sidebar" }))))));
   }
   static get watchers() {
     return {

package/dist/{swirl-shell-navigation-item.entry.26717de9.js → swirl-shell-navigation-item.entry.fe15973a.js}

@@ -1,4 +1,4 @@
-import { r as t, h as n, H as s, g as l } from "./index.0b541b9a.js";
+import { r as t, h as n, H as s, g as l } from "./index.aecee312.js";
 import { c as a } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-skeleton-box.entry.6f847a4f.js → swirl-skeleton-box.entry.30f5cd14.js}

@@ -1,4 +1,4 @@
-import { r as t, h as s, H as i } from "./index.0b541b9a.js";
+import { r as t, h as s, H as i } from "./index.aecee312.js";
 import { c as o } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-skeleton-text.entry.e4b53949.js → swirl-skeleton-text.entry.7b29aef3.js}

@@ -1,4 +1,4 @@
-import { r as l, h as t, H as a } from "./index.0b541b9a.js";
+import { r as l, h as t, H as a } from "./index.aecee312.js";
 import { c as s } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-stack.entry.dfd94232.js → swirl-stack.entry.472d9258.js}

@@ -1,4 +1,4 @@
-import { r as i, h as s, H as a } from "./index.0b541b9a.js";
+import { r as i, h as s, H as a } from "./index.aecee312.js";
 import { c as n } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-status-indicator.entry.2a039cf3.js → swirl-status-indicator.entry.d7f56384.js}

@@ -1,4 +1,4 @@
-import { r as i, h as t, H as n } from "./index.0b541b9a.js";
+import { r as i, h as t, H as n } from "./index.aecee312.js";
 import { c as a } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-switch.entry.f9070f96.js → swirl-switch.entry.86633038.js}

@@ -1,4 +1,4 @@
-import { r as h, c as r, h as s, H as a, g as l } from "./index.0b541b9a.js";
+import { r as h, c as r, h as s, H as a, g as l } from "./index.aecee312.js";
 import { c as n } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-account-circle.entry.c0b15dc2.js → swirl-symbol-account-circle.entry.cc3761df.js}

@@ -1,4 +1,4 @@
-import { r as C, h as i, F as l } from "./index.0b541b9a.js";
+import { r as C, h as i, F as l } from "./index.aecee312.js";
 import { c as r } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-alternate-email.entry.569475a8.js → swirl-symbol-alternate-email.entry.77921feb.js}

@@ -1,4 +1,4 @@
-import { r as t, h as C, F as e } from "./index.0b541b9a.js";
+import { r as t, h as C, F as e } from "./index.aecee312.js";
 import { c as l } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-android.entry.d3588c17.js → swirl-symbol-android.entry.6744de96.js}

@@ -1,4 +1,4 @@
-import { r as t, h as C, F as r } from "./index.0b541b9a.js";
+import { r as t, h as C, F as r } from "./index.aecee312.js";
 import { c as o } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-announcement.entry.b74bf8cf.js → swirl-symbol-announcement.entry.7c82d525.js}

@@ -1,4 +1,4 @@
-import { r as e, h as i, F as o } from "./index.0b541b9a.js";
+import { r as e, h as i, F as o } from "./index.aecee312.js";
 import { c as l } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-backup.entry.ad225bea.js → swirl-symbol-backup.entry.8a6f4f35.js}

@@ -1,4 +1,4 @@
-import { r as C, h as i, F as l } from "./index.0b541b9a.js";
+import { r as C, h as i, F as l } from "./index.aecee312.js";
 import { c as r } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-beach-access.entry.bb475bd7.js → swirl-symbol-beach-access.entry.b5f780be.js}

@@ -1,4 +1,4 @@
-import { r as e, h as i, F as C } from "./index.0b541b9a.js";
+import { r as e, h as i, F as C } from "./index.aecee312.js";
 import { c as l } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-bookmark.entry.1b0d443c.js → swirl-symbol-bookmark.entry.3c863ddc.js}

@@ -1,4 +1,4 @@
-import { r as o, h as i, F as r } from "./index.0b541b9a.js";
+import { r as o, h as i, F as r } from "./index.aecee312.js";
 import { c as l } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-cloud.entry.ea96c1da.js → swirl-symbol-cloud.entry.dfd54742.js}

@@ -1,4 +1,4 @@
-import { r as l, h as i, F as o } from "./index.0b541b9a.js";
+import { r as l, h as i, F as o } from "./index.aecee312.js";
 import { c as r } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-coronavirus.entry.dc709311.js → swirl-symbol-coronavirus.entry.c34a294d.js}

@@ -1,4 +1,4 @@
-import { r, h as s, F as t } from "./index.0b541b9a.js";
+import { r, h as s, F as t } from "./index.aecee312.js";
 import { c as o } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-desktop-windows.entry.92a9f6f8.js → swirl-symbol-desktop-windows.entry.dc8f8ead.js}

@@ -1,4 +1,4 @@
-import { r as o, h as i, F as e } from "./index.0b541b9a.js";
+import { r as o, h as i, F as e } from "./index.aecee312.js";
 import { c as l } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-directions-car-filled.entry.942aa3a6.js → swirl-symbol-directions-car-filled.entry.c61632bf.js}

@@ -1,4 +1,4 @@
-import { r as t, h as i, F as l } from "./index.0b541b9a.js";
+import { r as t, h as i, F as l } from "./index.aecee312.js";
 import { c as r } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-edit-calendar.entry.65d7b7d5.js → swirl-symbol-edit-calendar.entry.acb15b69.js}

@@ -1,4 +1,4 @@
-import { r as e, h as i, F as l } from "./index.0b541b9a.js";
+import { r as e, h as i, F as l } from "./index.aecee312.js";
 import { c as r } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-email.entry.949c2d90.js → swirl-symbol-email.entry.a78a130d.js}

@@ -1,4 +1,4 @@
-import { r as l, h as i, F as C } from "./index.0b541b9a.js";
+import { r as l, h as i, F as C } from "./index.aecee312.js";
 import { c as e } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-emoji-food-beverage.entry.7876b88b.js → swirl-symbol-emoji-food-beverage.entry.54f9683a.js}

@@ -1,4 +1,4 @@
-import { r as o, h as i, F as t } from "./index.0b541b9a.js";
+import { r as o, h as i, F as t } from "./index.aecee312.js";
 import { c as r } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-event-menu.entry.85337666.js → swirl-symbol-event-menu.entry.a3f985da.js}

@@ -1,4 +1,4 @@
-import { r as C, h as i, F as e } from "./index.0b541b9a.js";
+import { r as C, h as i, F as e } from "./index.aecee312.js";
 import { c as l } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-facebook.entry.98a98dfb.js → swirl-symbol-facebook.entry.0df697d7.js}

@@ -1,4 +1,4 @@
-import { r as o, h as i, F as e } from "./index.0b541b9a.js";
+import { r as o, h as i, F as e } from "./index.aecee312.js";
 import { c as l } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-favorite.entry.5a356799.js → swirl-symbol-favorite.entry.4a768ecc.js}

@@ -1,4 +1,4 @@
-import { r, h as i, F as e } from "./index.0b541b9a.js";
+import { r, h as i, F as e } from "./index.aecee312.js";
 import { c as o } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-fitness-center.entry.182d5594.js → swirl-symbol-fitness-center.entry.3dacce1e.js}

@@ -1,4 +1,4 @@
-import { r as C, h as i, F as e } from "./index.0b541b9a.js";
+import { r as C, h as i, F as e } from "./index.aecee312.js";
 import { c as r } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-flag.entry.6bab1fa5.js → swirl-symbol-flag.entry.251718f9.js}

@@ -1,4 +1,4 @@
-import { r as l, h as i, F as r } from "./index.0b541b9a.js";
+import { r as l, h as i, F as r } from "./index.aecee312.js";
 import { c as e } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-folder.entry.42b8085c.js → swirl-symbol-folder.entry.adc32e13.js}

@@ -1,4 +1,4 @@
-import { r as l, h as i, F as r } from "./index.0b541b9a.js";
+import { r as l, h as i, F as r } from "./index.aecee312.js";
 import { c as e } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-globe.entry.769a3a35.js → swirl-symbol-globe.entry.f1e4a65d.js}

@@ -1,4 +1,4 @@
-import { r as C, h as i, F as l } from "./index.0b541b9a.js";
+import { r as C, h as i, F as l } from "./index.aecee312.js";
 import { c as e } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-groups.entry.832bee9e.js → swirl-symbol-groups.entry.4d9f6616.js}

@@ -1,4 +1,4 @@
-import { r as l, h as C, F as t } from "./index.0b541b9a.js";
+import { r as l, h as C, F as t } from "./index.aecee312.js";
 import { c as r } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-help.entry.126fd736.js → swirl-symbol-help.entry.1bea007d.js}

@@ -1,4 +1,4 @@
-import { r as t, h as C, F as l } from "./index.0b541b9a.js";
+import { r as t, h as C, F as l } from "./index.aecee312.js";
 import { c as e } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-image.entry.250737a0.js → swirl-symbol-image.entry.5d65d4c2.js}

@@ -1,4 +1,4 @@
-import { r as e, h as i, F as l } from "./index.0b541b9a.js";
+import { r as e, h as i, F as l } from "./index.aecee312.js";
 import { c as r } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-info-menu.entry.8752adc6.js → swirl-symbol-info-menu.entry.20735d61.js}

@@ -1,4 +1,4 @@
-import { r as e, h as i, F as o } from "./index.0b541b9a.js";
+import { r as e, h as i, F as o } from "./index.aecee312.js";
 import { c as l } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-instagram.entry.6ea45719.js → swirl-symbol-instagram.entry.4779ed25.js}

@@ -1,4 +1,4 @@
-import { r as t, h as s, F as r } from "./index.0b541b9a.js";
+import { r as t, h as s, F as r } from "./index.aecee312.js";
 import { c as l } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-ios.entry.a1744878.js → swirl-symbol-ios.entry.18b6a001.js}

@@ -1,4 +1,4 @@
-import { r as t, h as i, F as o } from "./index.0b541b9a.js";
+import { r as t, h as i, F as o } from "./index.aecee312.js";
 import { c as l } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-language.entry.6b0eb491.js → swirl-symbol-language.entry.955163a2.js}

@@ -1,4 +1,4 @@
-import { r as t, h as C, F as e } from "./index.0b541b9a.js";
+import { r as t, h as C, F as e } from "./index.aecee312.js";
 import { c as l } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-leaderboard.entry.5fe0d345.js → swirl-symbol-leaderboard.entry.a3f754f4.js}

@@ -1,4 +1,4 @@
-import { r as t, h as i, F as e } from "./index.0b541b9a.js";
+import { r as t, h as i, F as e } from "./index.aecee312.js";
 import { c as l } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-lightbulb.entry.c4779b69.js → swirl-symbol-lightbulb.entry.9b324eb5.js}

@@ -1,4 +1,4 @@
-import { r as l, h as s, F as r } from "./index.0b541b9a.js";
+import { r as l, h as s, F as r } from "./index.aecee312.js";
 import { c as o } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-linkedin.entry.865b1036.js → swirl-symbol-linkedin.entry.d34af0dd.js}

@@ -1,4 +1,4 @@
-import { r as e, h as i, F as l } from "./index.0b541b9a.js";
+import { r as e, h as i, F as l } from "./index.aecee312.js";
 import { c as C } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-location-on.entry.34ad5f69.js → swirl-symbol-location-on.entry.c9d6d182.js}

@@ -1,4 +1,4 @@
-import { r as o, h as i, F as l } from "./index.0b541b9a.js";
+import { r as o, h as i, F as l } from "./index.aecee312.js";
 import { c as r } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-symbol-loyalty.entry.de3b62a9.js → swirl-symbol-loyalty.entry.bcc82c27.js}

@@ -1,4 +1,4 @@
-import { r as t, h as C, F as l } from "./index.0b541b9a.js";
+import { r as t, h as C, F as l } from "./index.aecee312.js";
 import { c as o } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";