@getflip/swirl-components-react 0.385.0 → 0.387.0

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

@@ -1,144 +0,0 @@
-import { r as y, c as o, h as e, H as u, g as b } from "./index.075360e5.js";
-import { c as v } from "./index-orsBiyT_.fc4357c3.js";
-import { c as g } from "./focus-trap.esm-DIdMBZfn.c41dd5d8.js";
-import { d as p, m as t } from "./utils-DytJsmhr.20b14d35.js";
-import "react";
-import "react-dom";
-const w = `.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:4rem;--swirl-shell-extended-nav-width:18rem;--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;overflow:hidden;width:100%;min-height:100%;background-color:var(--swirl-shell-background);transition:grid-template-columns 0.1s;grid-template-columns:0 1fr 0;grid-template-rows:1fr;grid-template-areas:"nav main"}@media (prefers-reduced-motion){.shell-layout.sc-swirl-shell-layout{transition:none}}@media (min-width: 992px){.shell-layout.sc-swirl-shell-layout{padding-right:var(--s-space-8);padding-bottom:var(--s-space-8);-moz-column-gap:var(--s-space-8);column-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"
-      "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)}@media (min-width: 992px){.shell-layout--navigation-collapsed.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout{scrollbar-width:none}.shell-layout--navigation-collapsed.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout::-webkit-scrollbar{width:0;background:transparent;-webkit-appearance:none}}.shell-layout--navigation-collapsed .shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul>*,.shell-layout--navigation-collapsed .shell-layout__secondary-nav-items--grid-view .sc-swirl-shell-layout-s>ul>*{max-width:100%;max-height:3rem;flex-basis:100%}@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(
-          --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.1s;animation-fill-mode:forwards}.shell-layout--sidebar-scrollable.sc-swirl-shell-layout:not(.shell-layout--sidebar-scrolled-to-top) .shell-layout__sidebar-app-bar.sc-swirl-shell-layout{border-bottom-color:var(--s-border-default)}.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--has-secondary-nav.sc-swirl-shell-layout .shell-layout__secondary-nav.sc-swirl-shell-layout{display:block}.shell-layout--secondary-nav-collapsed.sc-swirl-shell-layout .shell-layout__secondary-nav-items.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;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);clip-path:inset(50%)}.shell-layout__header-left.sc-swirl-shell-layout{display:flex;padding-left:var(--s-space-2);flex-basis:8rem;flex-shrink:0;align-items:center;gap:var(--s-space-8)}.shell-layout__header-right.sc-swirl-shell-layout{--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);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);flex-shrink:0;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-2);right:var(--s-space-2);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__nav.sc-swirl-shell-layout{position:fixed;z-index:9;top:0;bottom:0;left:0;overflow-x:hidden;overflow-y:auto;width:100%;max-width:18.75rem;color:var(--swirl-shell-text-color);background-color:var(--s-surface-overlay-default);transition:transform 0.1s, box-shadow 0.1s, width 0.1s;transform:translate3d(-100%, 0, 0);grid-area:nav}@media (prefers-reduced-motion){.shell-layout__nav.sc-swirl-shell-layout{transition:none}}@media (min-width: 992px){.shell-layout__nav.sc-swirl-shell-layout{position:relative;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.1s;inset:0}.shell-layout__secondary-nav.sc-swirl-shell-layout{display:none}.shell-layout__secondary-nav-items.sc-swirl-shell-layout-s>ul,.shell-layout__secondary-nav-items .sc-swirl-shell-layout-s>ul{display:flex;flex-direction:column;gap:var(--s-space-2)}.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul,.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view .sc-swirl-shell-layout-s>ul{flex-wrap:wrap;flex-direction:row;gap:var(--s-space-16)}.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul,.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul>*,.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view .sc-swirl-shell-layout-s>ul>*{min-width:0;max-height:none}.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view.shell-layout__secondary-nav-items--app-icon.sc-swirl-shell-layout-s>ul,.shell-layout:not(.shell-layout--navigation-collapsed) .shell-layout__secondary-nav-items--grid-view.shell-layout__secondary-nav-items--app-icon .sc-swirl-shell-layout-s>ul{row-gap:var(--s-space-16);-moz-column-gap:0;column-gap:0}.shell-layout--navigation-collapsed .shell-layout__secondary-nav-items--tiled.sc-swirl-shell-layout-s>ul,.shell-layout--navigation-collapsed .shell-layout__secondary-nav-items--tiled .sc-swirl-shell-layout-s>ul{gap:var(--s-space-16)}.shell-layout__secondary-nav-items--tiled.sc-swirl-shell-layout-s>ul>*,.shell-layout__secondary-nav-items--tiled .sc-swirl-shell-layout-s>ul>*{flex-basis:calc(50% - var(--s-space-8))}.shell-layout__secondary-nav-items--app-icon.sc-swirl-shell-layout-s>ul>*,.shell-layout__secondary-nav-items--app-icon .sc-swirl-shell-layout-s>ul>*{flex-basis:calc(100% / 3)}.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.1s;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}}@media (prefers-reduced-motion){.shell-layout__sidebar-body.sc-swirl-shell-layout{transition:none}}.shell-layout__sidebar-app-bar.sc-swirl-shell-layout{flex-grow:0;flex-shrink:0;border-bottom:var(--s-border-width-default) solid transparent}.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_SECONDARY_NAVIGATION_COLLAPSE_STATE", r = "SWIRL_SHELL_SECONDARY_NAVIGATION_VIEW_STATE", d = "SWIRL_SHELL_NAVIGATION_COLLAPSE_STATE", n = "SWIRL_SHELL_SIDEBAR_STATE", m = class {
-  constructor(l) {
-    y(this, l), this.sidebarToggleClick = o(this, "sidebarToggleClick", 7), this.skipLinkClick = o(this, "skipLinkClick", 7), this.browserBackButtonLabel = "Navigate back", this.browserForwardButtonLabel = "Navigate forward", this.collapseNavigationButtonLabel = "Collapse navigation", this.enableSecondaryNavGridLayout = !0, this.secondaryNavGridLayoutVariant = "tiled", this.expandNavigationButtonLabel = "Expand navigation", this.gridNavLayoutToggleLabel = "Grid", this.hideMobileNavigationButtonLabel = "Close navigation", this.listNavLayoutToggleLabel = "List", this.navigationLabel = "Main", this.secondaryNavCollapseLabel = "Show less", this.secondaryNavExpandLabel = "Show more", this.sidebarToggleIcon = "notifications", this.sidebarToggleLabel = "Toggle sidebar", this.skipLinkLabel = "Skip to main content", this.isDesktopViewport = !0, this.secondaryNavView = "list", this.sidebarScrollState = {
-      scrollable: !1,
-      scrolledToTop: !1
-    }, this.collectNavItems = () => {
-      this.mainNavItems = Array.from(this.el.querySelectorAll("swirl-shell-navigation-item[slot='nav'], [slot='nav'] swirl-shell-navigation-item")), this.secondaryNavItems = Array.from(this.el.querySelectorAll("swirl-shell-navigation-item[slot='secondary-nav'], [slot='secondary-nav'] swirl-shell-navigation-item")), this.toggleNavItemLabels(), this.setSecondaryNavItemsTiled();
-    }, this.toggleSecondaryNavView = (a) => {
-      a.stopPropagation(), this.secondaryNavView === "grid" ? this.secondaryNavView = "list" : this.secondaryNavView = "grid", this.setSecondaryNavItemsTiled(), localStorage.setItem(r, String(this.secondaryNavView));
-    }, this.toggleSecondaryNavCollapse = (a) => {
-      a.stopPropagation(), this.secondaryNavCollapsed = !this.secondaryNavCollapsed, localStorage.setItem(i, String(this.secondaryNavCollapsed));
-    }, this.onNavigationToggleClick = () => {
-      this.navigationCollapsed = !this.navigationCollapsed;
-    }, this.onNavigationClick = () => {
-      this.hideMobileNavigation();
-    }, this.onSidebarScroll = p(() => {
-      this.updateSidebarScrollState();
-    }, 16);
-  }
-  componentWillLoad() {
-    this.isDesktopViewport = t(), this.collectNavItems();
-    const l = localStorage.getItem(n) === "true";
-    this.sidebarActive = this.sidebarActive === void 0 ? l : this.sidebarActive;
-    const a = localStorage.getItem(d) === "true";
-    this.navigationCollapsed = a, this.restoreSecondaryNavState();
-  }
-  componentDidLoad() {
-    this.focusTrap = g(this.navElement, {
-      allowOutsideClick: !0,
-      tabbableOptions: {
-        getShadowRoot: (l) => l.shadowRoot
-      }
-    }), this.collectNavItems(), this.navMutationObserver = new MutationObserver(() => {
-      this.collectNavItems();
-    }), this.navMutationObserver.observe(this.navElement, {
-      childList: !0,
-      subtree: !0
-    }), queueMicrotask(() => {
-      this.updateSidebarScrollState();
-    });
-  }
-  componentDidRender() {
-    var l;
-    (l = this.focusTrap) == null || l.updateContainerElements(this.navElement);
-  }
-  disconnectedCallback() {
-    var l, a;
-    (l = this.focusTrap) == null || l.deactivate(), (a = this.navMutationObserver) == null || a.disconnect();
-  }
-  onWindowKeyDown(l) {
-    l.key === "Escape" && this.mobileNavigationActive && this.hideMobileNavigation();
-  }
-  watchEnableSecondaryNavGridLayout() {
-    this.restoreSecondaryNavState();
-  }
-  watchMobileNavigationState() {
-    this.mobileNavigationActive ? setTimeout(() => {
-      this.focusTrap.activate();
-    }, 200) : this.focusTrap.deactivate();
-  }
-  watchNavigationCollapsed() {
-    localStorage.setItem(d, String(this.navigationCollapsed)), this.toggleNavItemLabels(), this.setSecondaryNavItemsTiled();
-  }
-  watchSidebarActive() {
-    localStorage.setItem(n, String(this.sidebarActive));
-  }
-  onWindowResize() {
-    this.isDesktopViewport !== t() && (this.isDesktopViewport = t(), this.collectNavItems());
-  }
-  async showMobileNavigation() {
-    this.mobileNavigationActive = !0, this.collectNavItems();
-  }
-  async hideMobileNavigation() {
-    this.mobileNavigationActive = !1, this.toggleNavItemLabels();
-  }
-  toggleNavItemLabels() {
-    [...this.secondaryNavItems, ...this.mainNavItems].forEach((l) => {
-      l.hideLabel = this.navigationCollapsed && this.isDesktopViewport;
-    });
-  }
-  setSecondaryNavItemsTiled() {
-    this.secondaryNavItems.forEach((l) => {
-      l.variant = this.enableSecondaryNavGridLayout && (this.secondaryNavView === "grid" || this.navigationCollapsed && this.isDesktopViewport) ? this.secondaryNavGridLayoutVariant : "default";
-    });
-  }
-  restoreSecondaryNavState() {
-    if (this.enableSecondaryNavGridLayout) {
-      const l = localStorage.getItem(i) === "true";
-      this.secondaryNavCollapsed = l;
-      const a = localStorage.getItem(r);
-      this.secondaryNavView = a;
-    }
-  }
-  updateSidebarScrollState() {
-    const l = {
-      scrollable: this.sidebarContentEl.scrollHeight > this.sidebarContentEl.clientHeight,
-      scrolledToTop: this.sidebarContentEl.scrollTop === 0
-    };
-    Object.keys(l).some((a) => l[a] !== this.sidebarScrollState[a]) && (this.sidebarScrollState = l);
-  }
-  render() {
-    const l = this.sidebarToggleBadge !== !0 && this.sidebarToggleBadge !== "true", a = this.navigationCollapsed && this.isDesktopViewport, c = Boolean(this.el.querySelector("[slot='secondary-nav']")), h = v("shell-layout", {
-      "shell-layout--branded-header": this.brandedHeader,
-      "shell-layout--secondary-nav-collapsed": this.secondaryNavCollapsed,
-      "shell-layout--has-secondary-nav": c,
-      "shell-layout--mobile-navigation-active": this.mobileNavigationActive,
-      "shell-layout--navigation-collapsed": a,
-      "shell-layout--sidebar-active": this.sidebarActive,
-      "shell-layout--sidebar-scrollable": this.sidebarScrollState.scrollable,
-      "shell-layout--sidebar-scrolled-to-top": this.sidebarScrollState.scrolledToTop
-    });
-    return e(u, { key: "3a0f6ce8a1b127297351a101e1ef691b6af0ec77" }, e("div", { key: "0296344477b9f037cb07ab0e2ff1b8db0a191248", class: h }, e("header", { key: "1c3d94d7a34709a7eda915a569be68f798d24df5", class: "shell-layout__header", "data-tauri-drag-region": "true" }, e("button", { key: "182dc209157ff1280b8fb6331a31480c635df3fb", class: "shell-layout__skip-link", onClick: this.skipLinkClick.emit, type: "button" }, this.skipLinkLabel), e("div", { key: "53593a10a501c9555f2a5766fcedb26c7809e981", class: "shell-layout__header-left" }, e("swirl-tooltip", { key: "227a7834f5a28962581fc01d2d3441e9a5939528", content: this.navigationCollapsed ? this.expandNavigationButtonLabel : this.collapseNavigationButtonLabel, delay: 100, position: "right" }, e("button", { key: "f7c096ff2833a40e643773a8dad9c2fe79af21f4", class: "shell-layout__header-tool", onClick: this.onNavigationToggleClick, type: "button" }, this.navigationCollapsed ? e("swirl-icon-dock-left-expand", { size: 20 }) : e("swirl-icon-dock-left-collapse", { size: 20 }), e("swirl-visually-hidden", { key: "adfe9883cf5d3438a753016f4294bc85b5af96bd" }, this.navigationCollapsed ? this.expandNavigationButtonLabel : this.collapseNavigationButtonLabel))), e("a", { key: "8e9ed703e22df6ef05b95717fe9add173471a01d", class: "shell-layout__header-tool", href: "javascript:history.back()" }, e("swirl-icon-arrow-back", { key: "bb14cfbc1a8bfcd6253d667902daea56c12ce232", size: 20 }), e("swirl-visually-hidden", { key: "5e7acdde24551ca55c70761d88c3dfcb27272615" }, this.browserBackButtonLabel)), e("a", { key: "08e932d034898df40adb267c651dbe4174a89047", class: "shell-layout__header-tool", href: "javascript:history.forward()" }, e("swirl-icon-arrow-forward", { key: "7186b61ed353c5015ab5c2f927f581ed7d9d636e", size: 20 }), e("swirl-visually-hidden", { key: "9fe7f53cd6cb2006fa846769362780127e562dfc" }, this.browserForwardButtonLabel)), e("slot", { key: "b59a94c0b8ee89e388b7284b217c377621e06609", name: "left-header-tools" })), e("div", { key: "e01e5dc0649e5c044988b7a3ceb010e8a66bc710", class: "shell-layout__logo" }, e("slot", { key: "0ba980ca01fba074c290179e7a6ee5ff36a13d23", name: "logo" })), e("div", { key: "d5964e1a69d5974efbad6de1450e6b922ce18083", class: "shell-layout__header-right" }, e("slot", { key: "9075008758766e67b4c25cae617c05bcef3751e9", name: "right-header-tools" }), e("button", { key: "349138609e132c920682142ef1816f91cbdb5c16", class: "shell-layout__header-tool shell-layout__sidebar-toggle", onClick: this.sidebarToggleClick.emit, type: "button" }, e("swirl-icon", { key: "3d53a96e3ebf487245b6352c8efaa921dac0e35d", glyph: this.sidebarToggleIcon, size: 20 }), e("swirl-visually-hidden", { key: "b0409965f10f460f701cee2cd6fff5342c377a78" }, this.sidebarToggleLabel), this.sidebarToggleBadge && e("swirl-badge", { key: "a348f18d7d02547f12d3f98559c78fd64a6fe652", "aria-label": this.sidebarToggleBadgeAriaLabel, label: l ? String(this.sidebarToggleBadge) : this.sidebarToggleBadgeAriaLabel, size: "xs", variant: l ? "default" : "dot" })), e("slot", { key: "cd3e6638ec782315ebda3455a119941ff795b43c", name: "avatar" }))), e("div", { key: "989447134920888bfd7299beaa0ec21d87196f86", class: "shell-layout__mobile-nav-backdrop", onClick: this.onNavigationClick }), e("nav", { key: "2b55ffbe511827213a2cad593a713bf31aa915ad", "aria-labelledby": "main-navigation-label", class: "shell-layout__nav", onClick: this.onNavigationClick, ref: (s) => this.navElement = s }, e("div", { key: "f13f8059ef2f19aab9ad155d67e1629621b9a216", class: "shell-layout__mobile-header" }, e("slot", { key: "29a54254a75c40f2fd233e252c64cc3657d1852a", name: "mobile-logo" }), e("div", { key: "4e3bc15c884aef2be039b0a38e9bc20cd9f1de59", class: "shell-layout__mobile-header-tools" }, e("slot", { key: "74e31a0fcab8c30c0388c32a08dcbdabc64be4b1", name: "mobile-header-tools" }), e("button", { key: "891f2159d043f1b49e1531a84a4d6a2b9a718ffe", class: "shell-layout__header-tool", type: "button" }, e("swirl-icon-double-arrow-left", { key: "c5eb62fd88670f416b56d0eee9c16ce45c23a3ba", size: 20 }), e("swirl-visually-hidden", { key: "3bddde73073ea01859f6e74d8cf3e575a218d670" }, this.hideMobileNavigationButtonLabel)))), e("div", { key: "2e28a15685a17cca7cd8e7294f5d8f16e17c2795", class: "shell-layout__nav-body" }, e("swirl-visually-hidden", { key: "1a32a0020922be9c3540844f5cf50808f16d593b" }, e("span", { key: "a5c5108cde56ac493eccce6e27d8769f8f4870d0", id: "main-navigation-label" }, this.navigationLabel)), e("slot", { key: "65874ea547d233e7ed137b5f5376e09fa23acdc4", name: "nav", onSlotchange: this.collectNavItems }), e("div", { key: "203888593549d5acb1b099ccbced66817cb45c79", class: "shell-layout__secondary-nav" }, e("swirl-separator", { key: "e293d007e4cf7bdc5cb214f7bfda0cb4eb7f5988", color: "strong", spacing: "16" }), this.enableSecondaryNavGridLayout && e("swirl-box", { key: "eacf5725ce1673c9197822efbb4edfe03a046a90", paddingBlockEnd: "16" }, e("swirl-stack", { key: "0984c4e8606be705e4ad975b3d7c70ed95cd179e", justify: a ? "center" : "space-between", orientation: "horizontal" }, e("swirl-button", { key: "4d222852f0470cad29ab21f39868ea503f3c86a2", hideLabel: a, icon: this.secondaryNavCollapsed ? "<swirl-icon-expand-more></swirl-icon-expand-more>" : "<swirl-icon-expand-less></swirl-icon-expand-less>", label: this.secondaryNavCollapsed ? this.secondaryNavExpandLabel : this.secondaryNavCollapseLabel, onClick: this.toggleSecondaryNavCollapse, variant: "plain" }), !a && !this.secondaryNavCollapsed && e("swirl-button", { key: "d0621130aaad045d2fbac0e82d53abd9e52812ed", icon: this.secondaryNavView === "grid" ? "<swirl-icon-menu></swirl-icon-menu>" : "<swirl-icon-hamburger-menu></swirl-icon-hamburger-menu>", iconPosition: "end", label: this.secondaryNavView === "grid" ? this.gridNavLayoutToggleLabel : this.listNavLayoutToggleLabel, onClick: this.toggleSecondaryNavView, variant: "plain" }))), e("div", { key: "761828a2e74485d96aa4269929ab7800cb62f4e9", class: {
-      [`shell-layout__secondary-nav-items--${this.secondaryNavGridLayoutVariant}`]: !0,
-      "shell-layout__secondary-nav-items": !0,
-      "shell-layout__secondary-nav-items--grid-view": this.enableSecondaryNavGridLayout && this.secondaryNavView === "grid"
-    } }, e("slot", { key: "1a48615b11d100991473196b56dad5a8ddc599d0", name: "secondary-nav", onSlotchange: this.collectNavItems }))))), e("main", { key: "0f32927a7a747fa107417e16aa2cd69f5ad7273e", class: "shell-layout__main", id: "main-content" }, e("slot", { key: "e735cd60cf56f80f49d6c80d6619d3aeb131f9a9" })), e("aside", { key: "0821284b9014a30ff468974f22bbc25f1769fe41", class: "shell-layout__sidebar", inert: this.sidebarActive ? void 0 : !0 }, e("div", { key: "80bbc61a3c22deed9322dd34a713062b95c19a5a", class: "shell-layout__sidebar-body" }, e("div", { key: "edc0e64a63d114116d2c3d1e681da271f4eea5d3", class: "shell-layout__sidebar-app-bar" }, e("slot", { key: "26831cbfd6781f7e038b3474ded5a61178b724e9", name: "sidebar-app-bar" })), e("div", { key: "56a217dc3d874aadfa141b67ac16ab1d37a21edb", class: "shell-layout__sidebar-content", onScroll: this.onSidebarScroll, ref: (s) => this.sidebarContentEl = s }, e("slot", { key: "e739dd8a9bf5a7a4100f4dfdb9d0f2e691215b47", name: "sidebar" }))))));
-  }
-  get el() {
-    return b(this);
-  }
-  static get watchers() {
-    return {
-      enableSecondaryNavGridLayout: ["watchEnableSecondaryNavGridLayout"],
-      mobileNavigationActive: ["watchMobileNavigationState"],
-      navigationCollapsed: ["watchNavigationCollapsed"],
-      sidebarActive: ["watchSidebarActive"]
-    };
-  }
-};
-m.style = w;
-export {
-  m as swirl_shell_layout
-};

package/dist/swirl-shell-navigation-item.entry.286c7358.js

@@ -1,399 +0,0 @@
-import { r as d, h as n, H as v, g as m } from "./index.075360e5.js";
-import { c as l } from "./index-orsBiyT_.fc4357c3.js";
-import "react";
-import "react-dom";
-const c = `/**
-* seems the container query does not work as expected
-*/
-
-:host {
-  display: inline-flex;
-  width: 100%;
-}
-
-:host * {
-    box-sizing: border-box;
-  }
-
-.shell-navigation-item {
-  --swirl-app-icon-size: 2rem;
-  --swirl-shell-navigation-item-gradient: linear-gradient(
-    rgba(0, 0, 0, 0),
-    rgba(0, 0, 0, 0.8)
-  );
-
-  position: relative;
-  display: flex;
-  width: 100%;
-  height: 3rem;
-  padding: var(--s-space-8);
-  flex-shrink: 0;
-  justify-content: flex-start;
-  align-items: center;
-  border: none;
-  border-radius: var(--s-border-radius-sm);
-  color: var(--s-text-default);
-  background-color: var(--s-surface-overlay-default);
-  font: inherit;
-  font-size: var(--s-font-size-sm);
-  font-weight: var(--s-font-weight-medium);
-  line-height: var(--s-line-height-sm);
-  text-decoration: none;
-  cursor: pointer;
-  container-type: size;
-  gap: var(--s-space-12);
-}
-
-.shell-navigation-item:hover {
-    background-color: var(--s-surface-sunken-hovered);
-  }
-
-.shell-navigation-item:hover .shell-navigation-item__badge,
-    .shell-navigation-item:hover .shell-navigation-item__is-new-badge {
-      --swirl-badge-border-color: var(--s-surface-sunken-hovered);
-    }
-
-.shell-navigation-item:active {
-    background-color: var(--s-surface-sunken-pressed);
-  }
-
-.shell-navigation-item:active .shell-navigation-item__badge,
-    .shell-navigation-item:active .shell-navigation-item__is-new-badge {
-      --swirl-badge-border-color: var(--s-surface-sunken-pressed);
-    }
-
-.shell-navigation-item:focus {
-    outline: none;
-  }
-
-.shell-navigation-item:focus-visible {
-    z-index: 1;
-    box-shadow: 0 0 0 0.125rem var(--s-focus-default);
-  }
-
-.shell-navigation-item.shell-navigation-item--boxed {
-    --swirl-app-icon-size: 2rem;
-  }
-
-.shell-navigation-item.shell-navigation-item--boxed .shell-navigation-item__icon {
-      overflow: hidden;
-      border-radius: var(--s-border-radius-sm);
-      background-color: var(--s-background-default);
-      box-shadow: 0 0 0 var(--s-border-width-default) var(--s-border-default);
-    }
-
-.shell-navigation-item.shell-navigation-item--default.shell-navigation-item--filled .shell-navigation-item__icon {
-        border-radius: var(--s-border-radius-sm);
-        width: 2rem;
-        min-width: 2rem;
-        height: 2rem;
-        min-height: 2rem;
-      }
-
-.shell-navigation-item.shell-navigation-item--filled {
-    padding: var(--s-space-8);
-  }
-
-.shell-navigation-item.shell-navigation-item--filled:not(.shell-navigation-item--has-app-icon) .shell-navigation-item__icon {
-        color: var(--s-icon-on-action-primary);
-        background-color: var(--s-action-primary-default);
-      }
-
-.shell-navigation-item.shell-navigation-item--filled ::slotted(swirl-app-icon) {
-      position: inherit;
-      width: 100%;
-      height: 100%;
-    }
-
-.shell-navigation-item.shell-navigation-item--tiled {
-    --swirl-app-icon-size: 100%;
-
-    height: auto;
-    padding: 0;
-    align-items: start;
-    border-radius: var(--s-border-radius-base);
-    flex-direction: column;
-    container-type: inline-size;
-    gap: var(--s-space-8);
-  }
-
-.shell-navigation-item.shell-navigation-item--tiled:hover {
-      background-color: transparent;
-    }
-
-.shell-navigation-item.shell-navigation-item--tiled:hover .shell-navigation-item__label {
-        text-decoration: underline;
-      }
-
-.shell-navigation-item.shell-navigation-item--tiled ::slotted(*) {
-      position: absolute;
-      top: var(--s-space-12);
-      left: var(--s-space-12);
-    }
-
-.shell-navigation-item.shell-navigation-item--tiled ::slotted(swirl-app-icon) {
-      position: inherit;
-      width: 100%;
-      height: 100%;
-    }
-
-.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__icon {
-      overflow: hidden;
-      width: 100%;
-      min-width: 100%;
-      height: auto;
-      min-height: auto;
-      border-radius: var(--s-border-radius-base);
-      background-color: var(--s-surface-sunken-hovered);
-      aspect-ratio: 1;
-    }
-
-.shell-navigation-item.shell-navigation-item--tiled.shell-navigation-item--gradient .shell-navigation-item__icon::after {
-          position: absolute;
-          display: inline-block;
-          width: 100%;
-          border-radius: var(--s-border-radius-base);
-          background-image: var(--swirl-shell-navigation-item-gradient);
-          content: "";
-          aspect-ratio: 1;
-        }
-
-.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label {
-      color: var(--s-text-default);
-      font-weight: var(--s-font-weight-semibold);
-      text-align: start;
-    }
-
-.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label--inline {
-      position: absolute;
-      bottom: var(--s-space-12);
-      left: var(--s-space-12);
-      margin-right: var(--s-space-12);
-    }
-
-.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label--inline.shell-navigation-item__label--light {
-        color: rgba(242, 242, 242, 1);
-      }
-
-.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label--inline.shell-navigation-item__label--dark {
-        color: rgb(25, 25, 25);
-      }
-
-.shell-navigation-item.shell-navigation-item--app-icon {
-    --swirl-app-icon-size: 100%;
-    font-size: var(--s-font-size-xs);
-    padding: var(--s-space-8) var(--s-space-4);
-    align-items: center;
-    height: auto;
-    border-radius: var(--s-border-radius-sm);
-    flex-direction: column;
-    container-type: inline-size;
-    gap: var(--s-space-8);
-  }
-
-.shell-navigation-item.shell-navigation-item--app-icon.shell-navigation-item--hide-label {
-      align-items: start;
-      padding: var(--s-space-8);
-      --swirl-app-icon-size: 2rem;
-    }
-
-.shell-navigation-item.shell-navigation-item--app-icon.shell-navigation-item--hide-label .shell-navigation-item__icon {
-        border-radius: var(--s-border-radius-sm);
-        max-width: 2rem;
-      }
-
-.shell-navigation-item.shell-navigation-item--app-icon.shell-navigation-item--hide-label .shell-navigation-item__badge-wrapper {
-        max-width: 2rem;
-        max-height: 2rem;
-      }
-
-.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__icon {
-      overflow: hidden;
-      width: 100%;
-      max-width: 3.5rem;
-      height: auto;
-      border-radius: var(--s-border-radius-base);
-
-      color: var(--s-icon-on-action-primary);
-      aspect-ratio: 1;
-    }
-
-.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__badge-wrapper {
-      max-width: 3.5rem;
-      max-height: 3.5rem;
-    }
-
-.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__label {
-      line-height: var(--s-line-height-xs);
-      text-align: center;
-    }
-
-.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__badge-wrapper, .shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__badge-wrapper {
-      position: absolute;
-      width: 100%;
-      height: 100%;
-    }
-
-.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__label, .shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label {
-      display: -webkit-box;
-      overflow: hidden;
-      white-space: normal;
-      text-overflow: unset;
-      overflow-wrap: anywhere;
-      -webkit-line-clamp: 2;
-      -webkit-box-orient: vertical;
-    }
-
-.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__badge, .shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__badge {
-      position: absolute;
-      top: -0.375rem;
-      right: -0.375rem;
-      padding: var(--s-space-2);
-    }
-
-.shell-navigation-item.shell-navigation-item--active {
-    background-color: var(--s-surface-sunken-hovered);
-  }
-
-.shell-navigation-item.shell-navigation-item--active .shell-navigation-item__icon {
-      color: var(--s-icon-highlight);
-    }
-
-.shell-navigation-item.shell-navigation-item--active .shell-navigation-item__label {
-      color: var(--s-text-highlight);
-    }
-
-.shell-navigation-item.shell-navigation-item--active .shell-navigation-item__badge {
-      --swirl-badge-border-color: var(--s-surface-sunken-hovered);
-    }
-
-.shell-navigation-item.shell-navigation-item--active:hover {
-    background-color: var(--s-surface-sunken-hovered);
-  }
-
-.shell-navigation-item.shell-navigation-item--active:hover .shell-navigation-item__badge {
-      --swirl-badge-border-color: var(--s-surface-sunken-hovered);
-    }
-
-.shell-navigation-item.shell-navigation-item--active:active {
-    background-color: var(--s-surface-sunken-pressed);
-  }
-
-.shell-navigation-item.shell-navigation-item--active:active .shell-navigation-item__badge {
-      --swirl-badge-border-color: var(--s-surface-sunken-pressed);
-    }
-
-@media (min-width: 992px) {
-
-.shell-navigation-item {
-    background-color: var(--s-surface-sunken-default)
-}
-  }
-
-.shell-navigation-item__icon {
-  display: inline-flex;
-  width: 2rem;
-  min-width: 2rem;
-  height: 2rem;
-  min-height: 2rem;
-  justify-content: center;
-  align-items: center;
-  overflow: hidden;
-  border-radius: var(--s-border-radius-base);
-}
-
-.shell-navigation-item__text-wrapper {
-  overflow: hidden;
-  min-width: 0;
-  flex-grow: 1;
-  text-align: start;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-}
-
-.shell-navigation-item__description {
-  margin-left: var(--s-space-8);
-  font-weight: var(--s-font-weight-normal);
-  color: var(--s-text-subdued);
-}
-
-.shell-navigation-item__badge {
-  flex-shrink: 0;
-  --swirl-badge-border-color: var(--swirl-shell-background);
-}
-
-.shell-navigation-item__is-new-tag {
-  flex-shrink: 0;
-}
-
-.shell-navigation-item__is-new-badge {
-  position: absolute;
-  top: 0.625rem;
-  right: 0.625rem;
-  flex-shrink: 0;
-  --swirl-badge-border-color: var(--swirl-shell-background);
-}
-
-@container (max-width: 4rem) {
-  .shell-navigation-item__badge {
-    position: absolute;
-    top: var(--s-space-4);
-    right: var(--s-space-4);
-    padding: var(--s-space-2);
-  }
-
-  .shell-navigation-item--gradient .shell-navigation-item__icon {
-    --swirl-shell-navigation-item-gradient: none;
-  }
-
-  .shell-navigation-item__badge--dot {
-    top: var(--s-space-8);
-    right: var(--s-space-8);
-  }
-}
-
-@container (min-width: 10rem) {
-  .shell-navigation-item__badge--dot {
-    padding-right: var(--s-space-4);
-  }
-}
-`, b = class {
-  constructor(i) {
-    d(this, i), this.hideLabel = !1, this.inlineLabelColor = "default", this.markAsNewLabel = "New", this.variant = "default";
-  }
-  componentWillLoad() {
-    this.forceIconProps();
-  }
-  componentDidRender() {
-    this.forceIconProps();
-  }
-  forceIconProps() {
-    const i = this.el.querySelector("[slot='icon']"), e = this.hideLabel && this.variant === "app-icon" || this.variant === "default";
-    i && (i.tagName.startsWith("SWIRL-ICON") || i.tagName.startsWith("SWIRL-EMOJI") || i.tagName.startsWith("SWIRL-SYMBOL")) && i.setAttribute("size", e ? "20" : "32");
-  }
-  render() {
-    const i = Boolean(this.el.querySelector("swirl-app-icon")), e = l("shell-navigation-item", `shell-navigation-item--${this.variant}`, {
-      "shell-navigation-item--active": this.active,
-      "shell-navigation-item--boxed": this.boxed,
-      "shell-navigation-item--filled": this.filled,
-      "shell-navigation-item--inline-label": this.inlineLabel,
-      "shell-navigation-item--gradient": this.withGradient,
-      "shell-navigation-item--hide-label": this.hideLabel,
-      "shell-navigation-item--has-app-icon": i
-    }), a = l("shell-navigation-item__label", {
-      "shell-navigation-item__label--light": this.inlineLabelColor === "light",
-      "shell-navigation-item__label--dark": this.inlineLabelColor === "dark",
-      "shell-navigation-item__label--inline": this.inlineLabel
-    }), t = this.badgeLabel !== void 0 && this.badgeLabel !== null, o = !t && this.markAsNew && !this.hideLabel && this.variant === "default", r = !t && this.markAsNew && this.hideLabel && this.variant === "default", s = Boolean(this.href), h = s ? "a" : "button", g = this.description ? `${this.label} ${this.description}` : this.label;
-    return n(v, { key: "eb3cc38916a4a868d447c631b65d2ebfb3c158e5" }, n("swirl-tooltip", { key: "5d38b0bf756b0a845d0ddff0aa6fe2a955da44f8", active: this.hideLabel, content: g, delay: 100, position: "right", positioning: "fixed" }, n(h, { key: "852f4913ae1c9e90f0ecccf32f14d857321c5694", class: e, href: this.href, target: this.target, type: s ? void 0 : "button", title: this.hideLabel ? void 0 : this.label }, n("span", { key: "f9de6d6dc253563b0397fbbc42d4bdb5260015fb", class: "shell-navigation-item__icon" }, n("slot", { key: "e1a0fc498c658f9094c906b8319971af9025883e", name: "icon" })), this.hideLabel ? n("swirl-visually-hidden", null, n("span", { class: a }, this.label)) : this.variant !== "default" ? n("span", { class: a }, this.label) : n("div", { class: "shell-navigation-item__text-wrapper" }, n("span", { class: a }, this.label), this.description && n("span", { class: "shell-navigation-item__description" }, this.description)), t && n("span", { key: "6697baa3fdc919e7a2b7c8595b871566a6b8eaa2", class: "shell-navigation-item__badge-wrapper" }, n("swirl-badge", { key: "feadd39faef80c53f72a77e16a5def012d77c53b", "aria-label": this.badgeLabel, class: l("shell-navigation-item__badge", {
-      "shell-navigation-item__badge--dot": this.badgeLabel === ""
-    }), label: this.badgeLabel, size: "xs", variant: this.badgeLabel === "" ? "dot" : "default" })), o && n("swirl-tag", { key: "dd8f48f9940c328b8fae2676e9a3b773a70e12d1", class: "shell-navigation-item__is-new-tag", intent: "info", label: this.markAsNewLabel.toLocaleUpperCase(), size: "s", variant: "strong" }), r && n("swirl-badge", { key: "ffbfa549236b20fc6fff35a96865386ea7b7517f", class: "shell-navigation-item__is-new-badge", intent: "info", label: this.markAsNewLabel.toLocaleUpperCase(), size: "xs", variant: "dot" }))));
-  }
-  get el() {
-    return m(this);
-  }
-};
-b.style = c;
-export {
-  b as swirl_shell_navigation_item
-};

package/dist/swirl-skeleton-box.entry.ecae5195.js

@@ -1,31 +0,0 @@
-import { r as o, h as s, H as r } from "./index.075360e5.js";
-import { c as t } from "./index-orsBiyT_.fc4357c3.js";
-import "react";
-import "react-dom";
-const i = `:host{display:block}:host *{box-sizing:border-box}.skeleton-box{position:relative;overflow:hidden;min-height:var(--s-font-size-sm);background-color:var(--s-surface-raised-hovered)}.skeleton-box:before{position:relative;z-index:1;display:block;width:100%;height:100%;background-image:linear-gradient(
-      90deg,
-      rgba(255, 255, 255, 0) 0,
-      rgba(255, 255, 255, 0) 12%,
-      var(--s-surface-raised-default) 50%,
-      rgba(255, 255, 255, 0) 88%,
-      rgba(255, 255, 255, 0) 100%
-    );content:"";transform:translateX(-100%);animation:skeleton-box-shimmer 3s infinite}@keyframes skeleton-box-shimmer{100%{transform:translateX(100%)}}.skeleton-box--static:before{display:none}.skeleton-box--border-radius-pill{border-radius:100rem}.skeleton-box--border-radius-none{border-radius:0}`, a = class {
-  constructor(e) {
-    o(this, e), this.animated = !0, this.borderRadius = "base";
-  }
-  render() {
-    const e = t("skeleton-box", `skeleton-box--border-radius-${this.borderRadius}`, { "skeleton-box--static": !this.animated });
-    return s(r, { key: "1c3b9bc5b79cb80b3cd0d459a618b3c6d5ce7d46", style: {
-      width: !Boolean(this.width) && !Boolean(this.aspectRatio) ? "100%" : void 0
-    } }, s("div", { key: "f6d0bfa0401250dca3862d834679db08999ddae2", class: e, style: {
-      aspectRatio: this.aspectRatio,
-      borderRadius: this.borderRadius !== "pill" && this.borderRadius !== "none" ? `var(--s-border-radius-${this.borderRadius})` : void 0,
-      height: this.height,
-      width: this.width
-    } }));
-  }
-};
-a.style = i;
-export {
-  a as swirl_skeleton_box
-};

package/dist/swirl-skeleton-text.entry.c555e734.js

@@ -1,38 +0,0 @@
-import { r as l, h as t, H as a } from "./index.075360e5.js";
-import { c as s } from "./index-orsBiyT_.fc4357c3.js";
-import "react";
-import "react-dom";
-const o = `:host{display:block;width:100%}:host *{box-sizing:border-box}.skeleton-text{position:relative}.skeleton-text--static .skeleton-text__line:after{display:none}.skeleton-text--size-sm{--skeleton-text-line-padding:calc(
-    (var(--s-line-height-sm) - var(--s-font-size-sm)) / 2
-  )}.skeleton-text--size-sm .skeleton-text__line{height:var(--s-line-height-sm);border-radius:calc(var(--s-font-size-sm) / 2)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.skeleton-text--size-sm .skeleton-text__line{height:var(--s-line-height-sm)}}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.skeleton-text--size-sm{--skeleton-text-line-padding:calc(
-      (var(--s-line-height-sm) - var(--s-font-size-sm)) / 2
-    )}}.skeleton-text--size-base{--skeleton-text-line-padding:calc(
-    (var(--s-line-height-base) - var(--s-font-size-base)) / 2
-  )}.skeleton-text--size-base .skeleton-text__line{height:var(--s-line-height-base);border-radius:calc(var(--s-font-size-base) / 2)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.skeleton-text--size-base .skeleton-text__line{height:var(--s-line-height-sm)}}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.skeleton-text--size-base{--skeleton-text-line-padding:calc(
-      (var(--s-line-height-sm) - var(--s-font-size-sm)) / 2
-    )}}.skeleton-text--size-lg{--skeleton-text-line-padding:calc(
-    (var(--s-line-height-lg) - var(--s-font-size-lg)) / 2
-  )}.skeleton-text--size-lg .skeleton-text__line{height:var(--s-line-height-lg);border-radius:calc(var(--s-font-size-lg) / 2)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.skeleton-text--size-lg .skeleton-text__line{height:var(--s-line-height-base)}}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.skeleton-text--size-lg{--skeleton-text-line-padding:calc(
-      (var(--s-line-height-base) - var(--s-font-size-base)) / 2
-    )}}.skeleton-text--size-xl{--skeleton-text-line-padding:calc(
-    (var(--s-line-height-xl) - var(--s-font-size-xl)) / 2
-  )}.skeleton-text--size-xl .skeleton-text__line{height:var(--s-line-height-xl);border-radius:calc(var(--s-font-size-xl) / 2)}.skeleton-text--size-2xl{--skeleton-text-line-padding:calc(
-    (var(--s-line-height-2xl) - var(--s-font-size-2xl)) / 2
-  )}.skeleton-text--size-2xl .skeleton-text__line{height:var(--s-line-height-2xl);border-radius:calc(var(--s-font-size-2xl) / 2)}.skeleton-text__line{overflow:hidden;width:100%;padding-top:var(--skeleton-text-line-padding);padding-bottom:var(--skeleton-text-line-padding)}.skeleton-text__line:before{display:block;width:100%;height:100%;border-radius:10rem;background-color:var(--s-surface-raised-hovered);content:""}.skeleton-text__line:after{position:relative;z-index:1;top:-100%;display:block;width:100%;height:100%;background-image:linear-gradient(
-      90deg,
-      rgba(255, 255, 255, 0) 0,
-      var(--s-surface-raised-default) 33%,
-      rgba(255, 255, 255, 0) 66%
-    );content:"";transform:translateX(-100%);animation:skeleton-text-shimmer 3s infinite}.skeleton-text__line:first-child:last-child{width:100%}.skeleton-text__line:last-child:not(:first-child){width:25%}@keyframes skeleton-text-shimmer{100%{transform:translateX(100%)}}`, r = class {
-  constructor(e) {
-    l(this, e), this.animated = !0, this.lines = 1, this.size = "base";
-  }
-  render() {
-    const e = s("skeleton-text", `skeleton-text--size-${this.size}`, { "skeleton-text--static": !this.animated }), i = s("skeleton-text__line", `skeleton-text__line--size-${this.size}`);
-    return t(a, { key: "eac70b3c31ab60779a03634adca0d33bce9974f3" }, t("div", { key: "ae98cb03436ad34518f24438fcf1b94df353f960", class: e, part: e }, new Array(this.lines).fill(void 0).map((d, n) => t("div", { class: i, key: n, part: i }))));
-  }
-};
-r.style = o;
-export {
-  r as swirl_skeleton_text
-};