@getflip/swirl-components-react 0.300.1 → 0.300.3

package/dist/{swirl-accordion-item.entry.5dcab4c8.js → swirl-accordion-item.entry.72e502ee.js}

@@ -1,4 +1,4 @@
-import { r as t, c as d, h as e, H as n, g as s } from "./index.9a9fa403.js";
+import { r as t, c as d, h as e, H as n, g as s } from "./index.125b00c7.js";
 import { c as r } from "./index-267776a4.6beb4f4b.js";
 import { v as o } from "./v4-23648a96.77c7c20f.js";
 import "react";

package/dist/{swirl-accordion.entry.853e152d.js → swirl-accordion.entry.eb4466ec.js}

@@ -1,4 +1,4 @@
-import { r as s, c as i, h as o, H as a, g as c } from "./index.9a9fa403.js";
+import { r as s, c as i, h as o, H as a, g as c } from "./index.125b00c7.js";
 import "react";
 import "react-dom";
 const l = ":host{display:block}:host *{box-sizing:border-box}::slotted(*:last-child){border-bottom:0.0625rem solid var(--s-border-default)}", n = l, d = class {

package/dist/{swirl-action-list-section.entry.a06eb606.js → swirl-action-list-section.entry.73cceb7b.js}

@@ -1,4 +1,4 @@
-import { r as s, h as a, H as i } from "./index.9a9fa403.js";
+import { r as s, h as a, H as i } from "./index.125b00c7.js";
 import "react";
 import "react-dom";
 const t = ":host{display:block;width:100%}:host *{box-sizing:border-box}.action-list-section{background-color:var(--s-surface-overlay-default)}.action-list-section__label{display:block;width:100%;padding:var(--s-space-8) var(--s-space-16);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){.action-list-section__label{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);padding:var(--s-space-8) var(--s-space-12)}}", o = t, c = class {

package/dist/{swirl-action-list_2.entry.4c67eb27.js → swirl-action-list_2.entry.537fc6cc.js}

@@ -1,4 +1,4 @@
-import { r as c, h as o, H as l, g as d } from "./index.9a9fa403.js";
+import { r as c, h as o, H as l, g as d } from "./index.125b00c7.js";
 import { q as h, b as f, g as u } from "./utils-877a768f.c277f897.js";
 import { c as m } from "./index-267776a4.6beb4f4b.js";
 import "react";

package/dist/{swirl-app-bar.entry.49c0be00.js → swirl-app-bar.entry.4884279a.js}

@@ -1,4 +1,4 @@
-import { r as n, c as s, h as t, H as c, g as r } from "./index.9a9fa403.js";
+import { r as n, c as s, h as t, H as c, g as r } from "./index.125b00c7.js";
 import { c as l } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";

package/dist/swirl-app-icon.entry.02eee298.js

@@ -0,0 +1,30 @@
+import { r as n, h as s, H as o } from "./index.125b00c7.js";
+import { c as l } from "./index-267776a4.6beb4f4b.js";
+import "react";
+import "react-dom";
+const r = ":host{display:inline-flex}:host *{box-sizing:border-box}.app-icon{position:relative;overflow:hidden;width:var(--swirl-app-icon-size);height:var(--swirl-app-icon-size);border-radius:var(--s-border-radius-sm)}.app-icon>img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.app-icon__icon{display:inline-flex;width:100%;height:100%;justify-content:center;align-items:center}", c = r, h = class {
+  constructor(e) {
+    n(this, e), this.setImageAvailable = () => {
+      this.imageAvailable = !0;
+    }, this.setImageUnavailable = () => {
+      this.imageAvailable = !1;
+    }, this.onImageElementUpdate = (i) => {
+      var t, a;
+      (t = this.imgEl) == null || t.removeEventListener("load", this.setImageAvailable), (a = this.imgEl) == null || a.removeEventListener("error", this.setImageUnavailable), this.imgEl = i, this.imgEl && (this.imgEl.addEventListener("load", this.setImageAvailable), this.imgEl.addEventListener("error", this.setImageUnavailable));
+    }, this.icon = void 0, this.src = void 0, this.imageAvailable = void 0;
+  }
+  disconnectedCallback() {
+    var e, i;
+    (e = this.imgEl) == null || e.removeEventListener("load", this.setImageAvailable), (i = this.imgEl) == null || i.removeEventListener("error", this.setImageUnavailable);
+  }
+  render() {
+    const e = Boolean(this.src) && (this.imageAvailable || this.imageAvailable === void 0), i = !e && Boolean(this.icon), a = l("app-icon", {
+      "app-icon--has-icon": i || !e && !i
+    });
+    return s(o, { key: "4c903c83af417365577fa87cf0aa4311c5a88b4d" }, s("span", { key: "fe288c3715c20fa504329100d08faa2027723204", class: a }, e && s("img", { key: "7e6ed8864f1551bcfed28911010f952b67659e74", alt: "", height: "256", ref: this.onImageElementUpdate, src: this.src, width: "256" }), i && s("span", { key: "ac54a7dbb1b26d035a9b24c63667c21d9b37fec7", class: "app-icon__icon", innerHTML: this.icon })));
+  }
+};
+h.style = c;
+export {
+  h as swirl_app_icon
+};

package/dist/{swirl-app-layout_5.entry.79846f37.js → swirl-app-layout_5.entry.096ab881.js}

@@ -1,4 +1,4 @@
-import { r as n, c as r, h as a, H as d, g as p, F as h } from "./index.9a9fa403.js";
+import { r as n, c as r, h as a, H as d, g as p, F as h } from "./index.125b00c7.js";
 import { c } from "./index-267776a4.6beb4f4b.js";
 import { g as _, d as y, i as g, h as f } from "./utils-877a768f.c277f897.js";
 import { S as E } from "./sortable.esm-0bfddf0c.953ca6a6.js";

package/dist/{swirl-autocomplete.entry.e26394c6.js → swirl-autocomplete.entry.47930445.js}

@@ -1,4 +1,4 @@
-import { r as p, c as m, h as o, H as f, g as b } from "./index.9a9fa403.js";
+import { r as p, c as m, h as o, H as f, g as b } from "./index.125b00c7.js";
 import { a as g, c as v, o as y } from "./floating-ui.dom.esm-bef21834.ec4a9cbf.js";
 import { c as w } from "./index-267776a4.6beb4f4b.js";
 import { d as S } from "./utils-877a768f.c277f897.js";

package/dist/{swirl-avatar-group.entry.2b440840.js → swirl-avatar-group.entry.2458af98.js}

@@ -1,4 +1,4 @@
-import { r as s, h as a, H as i } from "./index.9a9fa403.js";
+import { r as s, h as a, H as i } from "./index.125b00c7.js";
 import { c as t } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";

package/dist/{swirl-avatar.entry.1b89074c.js → swirl-avatar.entry.cf2611a1.js}

@@ -1,8 +1,8 @@
-import { r as f, c as n, h as t, H as g, g as m } from "./index.9a9fa403.js";
-import { c as r } from "./index-267776a4.6beb4f4b.js";
+import { r as m, c as n, h as e, H as g, g as f } from "./index.125b00c7.js";
+import { c as s } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";
-const u = ":host{display:inline-flex;flex-shrink:0;align-items:center;flex-direction:column}:host *{box-sizing:border-box}.avatar{position:relative;display:inline-flex;justify-content:center;align-items:center;border-radius:50%}.avatar--has-icon{color:var(--s-icon-default);background-color:var(--swirl-avatar-background-color)}.avatar--has-initials{padding-right:0;padding-left:0;color:#fff}.avatar--interactive{cursor:pointer}.avatar--interactive:focus:not(:focus-visible){outline:none}.avatar--interactive:focus-visible{outline-color:var(--s-focus-default)}.avatar--size-3xs{width:1.25rem;height:1.25rem;font-size:0.625rem}.avatar--size-3xs.avatar--has-icon{padding-right:0.125rem;padding-left:0.125rem}.avatar--size-3xs.avatar--variant-square,.avatar--size-3xs.avatar--variant-square .avatar__image,.avatar--size-3xs.avatar--variant-square .avatar__initials{border-radius:0.25rem}.avatar--size-2xs{width:1.5rem;height:1.5rem;font-size:0.625rem}.avatar--size-2xs.avatar--has-icon{padding-right:0.125rem;padding-left:0.125rem}.avatar--size-2xs.avatar--variant-square,.avatar--size-2xs.avatar--variant-square .avatar__image,.avatar--size-2xs.avatar--variant-square .avatar__initials{border-radius:0.25rem}.avatar--size-xs{width:1.75rem;height:1.75rem;font-size:0.75rem}.avatar--size-xs.avatar--has-icon{padding-right:0.4375rem;padding-left:0.4375rem}.avatar--size-xs.avatar--variant-square,.avatar--size-xs.avatar--variant-square .avatar__image,.avatar--size-xs.avatar--variant-square .avatar__initials{border-radius:0.5rem}.avatar--size-s{width:2rem;height:2rem;font-size:0.75rem}.avatar--size-s.avatar--has-icon{padding-right:var(--s-space-8);padding-left:var(--s-space-8)}.avatar--size-s.avatar--variant-square,.avatar--size-s.avatar--variant-square .avatar__image,.avatar--size-s.avatar--variant-square .avatar__initials{border-radius:0.5rem}.avatar--size-m{width:2.5rem;height:2.5rem;font-size:var(--s-font-size-base)}.avatar--size-m.avatar--has-icon{padding-right:0.625rem;padding-left:0.625rem}.avatar--size-m.avatar--variant-square,.avatar--size-m.avatar--variant-square .avatar__image,.avatar--size-m.avatar--variant-square .avatar__initials{border-radius:0.625rem}.avatar--size-l{width:3rem;height:3rem;font-size:var(--s-font-size-lg)}.avatar--size-l.avatar--has-icon{padding-right:var(--s-space-12);padding-left:var(--s-space-12)}.avatar--size-l.avatar--variant-square,.avatar--size-l.avatar--variant-square .avatar__image,.avatar--size-l.avatar--variant-square .avatar__initials{border-radius:0.75rem}.avatar--size-xl{width:4rem;height:4rem;font-size:var(--s-font-size-xl)}.avatar--size-xl.avatar--has-icon{padding-right:var(--s-space-16);padding-left:var(--s-space-16)}.avatar--size-xl.avatar--variant-square,.avatar--size-xl.avatar--variant-square .avatar__image,.avatar--size-xl.avatar--variant-square .avatar__initials{border-radius:1rem}.avatar--size-2xl{width:9rem;height:9rem;font-size:3.375rem}.avatar--size-2xl.avatar--has-icon{padding-right:var(--s-space-32);padding-left:var(--s-space-32)}.avatar--size-2xl.avatar--variant-square,.avatar--size-2xl.avatar--variant-square .avatar__image,.avatar--size-2xl.avatar--variant-square .avatar__initials{border-radius:2.25rem}.avatar--size-2xl .avatar__tool{transform:none}.avatar--size-2xl .avatar__tool--position-top{transform:none}.avatar--color-banana .avatar__initials{color:var(--s-decorative-banana-text);background-color:var(--s-decorative-banana-surface-subdued)}.avatar--color-blueberry .avatar__initials{color:var(--s-decorative-blueberry-text);background-color:var(--s-decorative-blueberry-surface-subdued)}.avatar--color-chilli .avatar__initials{color:var(--s-decorative-chilli-text);background-color:var(--s-decorative-chilli-surface-subdued)}.avatar--color-grape .avatar__initials{color:var(--s-decorative-grape-text);background-color:var(--s-decorative-grape-surface-subdued)}.avatar--color-kiwi .avatar__initials{color:var(--s-decorative-kiwi-text);background-color:var(--s-decorative-kiwi-surface-subdued)}.avatar--color-pumpkin .avatar__initials{color:var(--s-decorative-pumpkin-text);background-color:var(--s-decorative-pumpkin-surface-subdued)}.avatar--color-radish .avatar__initials{color:var(--s-decorative-radish-text);background-color:var(--s-decorative-radish-surface-subdued)}.avatar__image{overflow:hidden;width:100%;height:100%;border-radius:50%}.avatar__image>img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center}.avatar__icon{display:inline-flex}.avatar__icon>*{width:100%;height:100%}.avatar__icon>*::part(icon){width:100%;height:100%}.avatar__initials{position:absolute;display:inline-flex;min-width:0;padding-right:0.0625rem;padding-left:0.0625rem;justify-content:center;align-items:center;border-radius:50%;font-weight:var(--s-font-weight-medium);inset:0}.avatar__initials>span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.avatar__badge{position:absolute;bottom:0;left:55%;display:inline-flex;min-width:1.5rem;height:1.5rem;transform:translate3d(0, 25%, 0)}.avatar__badge--position-top{top:0;bottom:auto;transform:translate3d(0, -25%, 0)}.avatar__label{margin-top:var(--s-space-4);color:var(--s-icon-default);font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-sm);text-align:center}.avatar__tool{position:absolute;right:0;bottom:0;display:inline-flex;transform:translate3d(25%, 25%, 0)}.avatar__tool--position-top{top:0;bottom:auto;transform:translate3d(25%, -25%, 0)}", b = u, o = {
+const b = ":host{display:inline-flex;flex-shrink:0;align-items:center;flex-direction:column}:host *{box-sizing:border-box}.avatar{position:relative;display:inline-flex;justify-content:center;align-items:center;border-radius:50%}.avatar--has-icon{color:var(--s-icon-default);background-color:var(--swirl-avatar-background-color)}.avatar--has-initials{padding-right:0;padding-left:0;color:#fff}.avatar--interactive{cursor:pointer}.avatar--interactive:focus:not(:focus-visible){outline:none}.avatar--interactive:focus-visible{outline-color:var(--s-focus-default)}.avatar--size-3xs{width:1.25rem;height:1.25rem;font-size:0.625rem}.avatar--size-3xs.avatar--has-icon{padding-right:0.125rem;padding-left:0.125rem}.avatar--size-3xs.avatar--variant-square,.avatar--size-3xs.avatar--variant-square .avatar__image,.avatar--size-3xs.avatar--variant-square .avatar__initials{border-radius:0.25rem}.avatar--size-2xs{width:1.5rem;height:1.5rem;font-size:0.625rem}.avatar--size-2xs.avatar--has-icon{padding-right:0.125rem;padding-left:0.125rem}.avatar--size-2xs.avatar--variant-square,.avatar--size-2xs.avatar--variant-square .avatar__image,.avatar--size-2xs.avatar--variant-square .avatar__initials{border-radius:0.25rem}.avatar--size-xs{width:1.75rem;height:1.75rem;font-size:0.75rem}.avatar--size-xs.avatar--has-icon{padding-right:0.4375rem;padding-left:0.4375rem}.avatar--size-xs.avatar--variant-square,.avatar--size-xs.avatar--variant-square .avatar__image,.avatar--size-xs.avatar--variant-square .avatar__initials{border-radius:0.5rem}.avatar--size-s{width:2rem;height:2rem;font-size:0.75rem}.avatar--size-s.avatar--has-icon{padding-right:var(--s-space-8);padding-left:var(--s-space-8)}.avatar--size-s.avatar--variant-square,.avatar--size-s.avatar--variant-square .avatar__image,.avatar--size-s.avatar--variant-square .avatar__initials{border-radius:0.5rem}.avatar--size-m{width:2.5rem;height:2.5rem;font-size:var(--s-font-size-base)}.avatar--size-m.avatar--has-icon{padding-right:0.625rem;padding-left:0.625rem}.avatar--size-m.avatar--variant-square,.avatar--size-m.avatar--variant-square .avatar__image,.avatar--size-m.avatar--variant-square .avatar__initials{border-radius:0.625rem}.avatar--size-l{width:3rem;height:3rem;font-size:var(--s-font-size-lg)}.avatar--size-l.avatar--has-icon{padding-right:var(--s-space-12);padding-left:var(--s-space-12)}.avatar--size-l.avatar--variant-square,.avatar--size-l.avatar--variant-square .avatar__image,.avatar--size-l.avatar--variant-square .avatar__initials{border-radius:0.75rem}.avatar--size-xl{width:4rem;height:4rem;font-size:var(--s-font-size-xl)}.avatar--size-xl.avatar--has-icon{padding-right:var(--s-space-16);padding-left:var(--s-space-16)}.avatar--size-xl.avatar--variant-square,.avatar--size-xl.avatar--variant-square .avatar__image,.avatar--size-xl.avatar--variant-square .avatar__initials{border-radius:1rem}.avatar--size-2xl{width:9rem;height:9rem;font-size:3.375rem}.avatar--size-2xl.avatar--has-icon{padding-right:var(--s-space-32);padding-left:var(--s-space-32)}.avatar--size-2xl.avatar--variant-square,.avatar--size-2xl.avatar--variant-square .avatar__image,.avatar--size-2xl.avatar--variant-square .avatar__initials{border-radius:2.25rem}.avatar--size-2xl .avatar__tool{transform:none}.avatar--size-2xl .avatar__tool--position-top{transform:none}.avatar--color-banana .avatar__initials{color:var(--s-decorative-banana-text);background-color:var(--s-decorative-banana-surface-subdued)}.avatar--color-blueberry .avatar__initials{color:var(--s-decorative-blueberry-text);background-color:var(--s-decorative-blueberry-surface-subdued)}.avatar--color-chilli .avatar__initials{color:var(--s-decorative-chilli-text);background-color:var(--s-decorative-chilli-surface-subdued)}.avatar--color-grape .avatar__initials{color:var(--s-decorative-grape-text);background-color:var(--s-decorative-grape-surface-subdued)}.avatar--color-kiwi .avatar__initials{color:var(--s-decorative-kiwi-text);background-color:var(--s-decorative-kiwi-surface-subdued)}.avatar--color-pumpkin .avatar__initials{color:var(--s-decorative-pumpkin-text);background-color:var(--s-decorative-pumpkin-surface-subdued)}.avatar--color-radish .avatar__initials{color:var(--s-decorative-radish-text);background-color:var(--s-decorative-radish-surface-subdued)}.avatar__image{overflow:hidden;width:100%;height:100%;border-radius:50%}.avatar__image>img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center}.avatar__icon{display:inline-flex}.avatar__icon>*{width:100%;height:100%}.avatar__icon>*::part(icon){width:100%;height:100%}.avatar__initials{position:absolute;display:inline-flex;min-width:0;padding-right:0.0625rem;padding-left:0.0625rem;justify-content:center;align-items:center;border-radius:50%;font-weight:var(--s-font-weight-medium);inset:0}.avatar__initials>span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.avatar__badge{position:absolute;bottom:0;left:55%;display:inline-flex;min-width:1.5rem;height:1.5rem;transform:translate3d(0, 25%, 0)}.avatar__badge--position-top{top:0;bottom:auto;transform:translate3d(0, -25%, 0)}.avatar__label{margin-top:var(--s-space-4);color:var(--s-icon-default);font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-sm);text-align:center}.avatar__tool{position:absolute;right:0;bottom:0;display:inline-flex;transform:translate3d(25%, 25%, 0)}.avatar__tool--position-top{top:0;bottom:auto;transform:translate3d(25%, -25%, 0)}", u = b, o = {
   "3xs": 20,
   "2xs": 24,
   xs: 28,
@@ -12,8 +12,11 @@ const u = ":host{display:inline-flex;flex-shrink:0;align-items:center;flex-direc
   xl: 64,
   "2xl": 144
 }, p = class {
-  constructor(i) {
-    f(this, i), this.imageError = n(this, "imageError", 7), this.imageLoad = n(this, "imageLoad", 7), this.componentLoaded = !1, this.setImageAvailable = () => {
+  constructor(t) {
+    m(this, t), this.imageError = n(this, "imageError", 7), this.imageLoad = n(this, "imageLoad", 7), this.componentLoaded = !1, this.onImageElementUpdate = (a) => {
+      var i, r;
+      (i = this.imgEl) == null || i.removeEventListener("load", this.setImageAvailable), (r = this.imgEl) == null || r.removeEventListener("error", this.setImageUnavailable), this.imgEl = a, this.imgEl && (this.imgEl.addEventListener("load", this.setImageAvailable), this.imgEl.addEventListener("error", this.setImageUnavailable));
+    }, this.setImageAvailable = () => {
       this.imageAvailable = !0, this.loadingError = !1, this.loaded = !0, this.imageLoad.emit();
     }, this.setImageUnavailable = () => {
       this.imageAvailable = !1, this.loaded = !0, this.loadingError = !0, this.imageError.emit();
@@ -30,8 +33,8 @@ const u = ":host{display:inline-flex;flex-shrink:0;align-items:center;flex-direc
     this.componentLoaded && this.setupIntersectionObserver();
   }
   disconnectedCallback() {
-    var i;
-    (i = this.intersectionObserver) == null || i.disconnect();
+    var t, a, i;
+    (t = this.intersectionObserver) == null || t.disconnect(), (a = this.imgEl) == null || a.removeEventListener("load", this.setImageAvailable), (i = this.imgEl) == null || i.removeEventListener("error", this.setImageUnavailable);
   }
   watchSrcProp() {
     this.imageAvailable = void 0;
@@ -41,19 +44,19 @@ const u = ":host{display:inline-flex;flex-shrink:0;align-items:center;flex-direc
       threshold: 0
     }), this.intersectionObserver.observe(this.element));
   }
-  onVisibilityChange(i) {
-    this.inViewport = i.some((a) => a.isIntersecting);
+  onVisibilityChange(t) {
+    this.inViewport = t.some((a) => a.isIntersecting);
   }
   render() {
-    const i = Boolean(this.src) && (this.imageAvailable || this.imageAvailable === void 0) && (this.loading !== "intersecting" || this.inViewport), a = (!i || !this.loaded && !this.loadingError) && Boolean(this.initials), e = !i && !a && Boolean(this.icon), s = !i && !a && !e, d = Boolean(this.badge) && this.size === "m", l = this.interactive ? "button" : void 0, v = r("avatar", `avatar--color-${this.color}`, `avatar--size-${this.size}`, `avatar--variant-${this.variant}`, {
-      "avatar--has-icon": e || s,
+    const t = Boolean(this.src) && (this.imageAvailable || this.imageAvailable === void 0) && (this.loading !== "intersecting" || this.inViewport), a = (!t || !this.loaded && !this.loadingError) && Boolean(this.initials), i = !t && !a && Boolean(this.icon), r = !t && !a && !i, l = Boolean(this.badge) && this.size === "m", v = this.interactive ? "button" : void 0, d = s("avatar", `avatar--color-${this.color}`, `avatar--size-${this.size}`, `avatar--variant-${this.variant}`, {
+      "avatar--has-icon": i || r,
       "avatar--has-initials": a,
       "avatar--interactive": this.interactive
-    }), c = r("avatar__badge", `avatar__badge--position-${this.badgePosition}`), h = r("avatar__tool", `avatar__tool--position-${this.toolPosition}`);
-    return t(g, { key: "becfbfb9693b176b1e6be03c122cf3ddd4609840", "aria-label": this.interactive ? this.label : void 0, onKeydown: this.interactive ? this.onKeydown : void 0, onKeyup: this.interactive ? this.onKeyup : void 0, role: l, tabIndex: this.interactive ? 0 : void 0 }, t("span", { key: "1a0051b784fd8dfdf5525f1ce48f7f74c2bb58e7", class: v, part: "avatar" }, i && t("span", { key: "769de8fa602605db0ccc5c58e6e09a663f251979", class: "avatar__image" }, t("img", { key: "5b4783c977baaf651a94a3a4caa4af3c4d6cf6fd", alt: "", height: o[this.size], loading: this.loading !== "intersecting" ? this.loading : void 0, onError: this.setImageUnavailable, onLoad: this.setImageAvailable, src: this.src, width: o[this.size] })), a && t("span", { key: "cf1e708953509b507596cadb704ac5b774b5cf7b", class: "avatar__initials" }, t("span", { key: "1d6f21f44558e9ca21e9ae29aa9d3f98740223fe" }, this.initials)), e && t("span", { key: "5bc91e4e1df66d1c819b8ecbf5a017e524aaf341", class: "avatar__icon", innerHTML: this.icon }), s && t("span", { key: "300de7ac623bf38a1a205dff569565870fc8215a", class: "avatar__icon" }, t("swirl-icon-person", { key: "d7700f0448bcf64627d0393e4699d54e20542faf" })), d && t("span", { key: "faa23bd878ceea8d5acfcc82d0e1a9789a77daf4", class: c, innerHTML: this.badge }), t("span", { key: "7fc037341adc07602d4d5f28165413c00419f29b", class: h }, t("slot", { key: "c2958b5d8b63c81c5d8cb9fd7aa5306f6a19647a", name: "tool" }))), this.showLabel && t("span", { key: "51d55082e90412c28a40d013dd0725172db0e121", "aria-hidden": !0, class: "avatar__label" }, this.label));
+    }), c = s("avatar__badge", `avatar__badge--position-${this.badgePosition}`), h = s("avatar__tool", `avatar__tool--position-${this.toolPosition}`);
+    return e(g, { key: "3c36f09dcdb6b1f6f56e3dbfb7a673e77b3ef6f9", "aria-label": this.interactive ? this.label : void 0, onKeydown: this.interactive ? this.onKeydown : void 0, onKeyup: this.interactive ? this.onKeyup : void 0, role: v, tabIndex: this.interactive ? 0 : void 0 }, e("span", { key: "21057a05d374a8803a8c28b9a5ff133146a5806f", class: d, part: "avatar" }, t && e("span", { key: "99c45973ba401b828bb140a5d61bfd9929340033", class: "avatar__image" }, e("img", { key: "95ad28f353923ceb60205f36086784c733ef461b", alt: "", height: o[this.size], loading: this.loading !== "intersecting" ? this.loading : void 0, ref: this.onImageElementUpdate, src: this.src, width: o[this.size] })), a && e("span", { key: "66de0845df06e63d53d6dc86223aff7da3a46bb7", class: "avatar__initials" }, e("span", { key: "28ca37f08266223e3ecfa461eb4c100a4b3adc41" }, this.initials)), i && e("span", { key: "404230c35d5a1272ef94ae82a56391832904183f", class: "avatar__icon", innerHTML: this.icon }), r && e("span", { key: "90677bfa3d90d817357ced9087ccadf18644ff10", class: "avatar__icon" }, e("swirl-icon-person", { key: "ddc8abcba3e8679aa16786cde144ce1fc2238460" })), l && e("span", { key: "49a10edded6458c1eba7590e355a77e9d35e921f", class: c, innerHTML: this.badge }), e("span", { key: "267f7ed319a57f571bf0d5d9b26877ce8ac69e9c", class: h }, e("slot", { key: "07f809b1dd6d911428daaddb626f75b7cf6ec40a", name: "tool" }))), this.showLabel && e("span", { key: "5bfdcf03b6afedc2778009c898a3cde10c1959b3", "aria-hidden": !0, class: "avatar__label" }, this.label));
   }
   get element() {
-    return m(this);
+    return f(this);
   }
   static get watchers() {
     return {
@@ -61,7 +64,7 @@ const u = ":host{display:inline-flex;flex-shrink:0;align-items:center;flex-direc
     };
   }
 };
-p.style = b;
+p.style = u;
 export {
   p as swirl_avatar
 };

package/dist/{swirl-badge.entry.67536723.js → swirl-badge.entry.30ac2984.js}

@@ -1,4 +1,4 @@
-import { r as i, h as e, F as t, H as r } from "./index.9a9fa403.js";
+import { r as i, h as e, F as t, H as r } from "./index.125b00c7.js";
 import { c as s } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";

package/dist/{swirl-banner.entry.86988597.js → swirl-banner.entry.3c4bd2ee.js}

@@ -1,4 +1,4 @@
-import { r as o, c as r, h as t, H as c, g as b } from "./index.9a9fa403.js";
+import { r as o, c as r, h as t, H as c, g as b } from "./index.125b00c7.js";
 import { c as d } from "./index-267776a4.6beb4f4b.js";
 import { g as l } from "./utils-877a768f.c277f897.js";
 import "react";

package/dist/{swirl-box.entry.62b63a0d.js → swirl-box.entry.2ea40c97.js}

@@ -1,8 +1,8 @@
-import { r as d, c as r, h as t, H as i, g as s } from "./index.9a9fa403.js";
-import { c as l } from "./index-267776a4.6beb4f4b.js";
+import { r as d, c as r, h as t, H as i, g as s } from "./index.125b00c7.js";
+import { c as n } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";
-const n = ":host{display:block;width:100%}:host(.box--bordered){border:var(--s-border-width-default) solid var(--s-border-default)}:host(.box--border-color-default){border-color:var(--s-border-default)}:host(.box--border-color-strong){border-color:var(--s-border-strong)}:host(.box--bordered-block-end){border-block-end-width:var(--s-border-width-default);border-block-end-style:solid}:host(.box--bordered-block-start){border-block-start-width:var(--s-border-width-default);border-block-start-style:solid}:host(.box--bordered-inline-end){border-inline-end-width:var(--s-border-width-default);border-inline-end-style:solid}:host(.box--bordered-inline-start){border-inline-start-width:var(--s-border-width-default);border-inline-start-style:solid}:host(.box--bordered-block-start-when-scrolled.box--scrollable){border-block-start-width:var(--s-border-width-default);border-block-start-style:solid;border-block-start-color:transparent}:host(.box--bordered-block-start-when-scrolled.box--scrollable:not(.box--scrolled-to-top)){border-block-start-color:var(--s-border-default)}:host(.box--bordered-block-end-when-scrolled.box--scrollable){border-block-end-width:var(--s-border-width-default);border-block-end-style:solid;border-block-end-color:transparent}:host(.box--bordered-block-end-when-scrolled.box--scrollable:not(.box--scrolled-to-bottom)){border-block-end-color:var(--s-border-default)}:host(.box--cover){width:100%;height:100%}:host *{box-sizing:border-box}", h = n, a = class {
+const l = ":host{display:block;width:100%}:host(.box--bordered){border:var(--s-border-width-default) solid var(--s-border-default)}:host(.box--border-color-default){border-color:var(--s-border-default)}:host(.box--border-color-strong){border-color:var(--s-border-strong)}:host(.box--bordered-block-end){border-block-end-width:var(--s-border-width-default);border-block-end-style:solid}:host(.box--bordered-block-start){border-block-start-width:var(--s-border-width-default);border-block-start-style:solid}:host(.box--bordered-inline-end){border-inline-end-width:var(--s-border-width-default);border-inline-end-style:solid}:host(.box--bordered-inline-start){border-inline-start-width:var(--s-border-width-default);border-inline-start-style:solid}:host(.box--bordered-block-start-when-scrolled.box--scrollable){border-block-start-width:var(--s-border-width-default);border-block-start-style:solid;border-block-start-color:transparent}:host(.box--bordered-block-start-when-scrolled.box--scrollable:not(.box--scrolled-to-top)){border-block-start-color:var(--s-border-default)}:host(.box--bordered-block-end-when-scrolled.box--scrollable){border-block-end-width:var(--s-border-width-default);border-block-end-style:solid;border-block-end-color:transparent}:host(.box--bordered-block-end-when-scrolled.box--scrollable:not(.box--scrolled-to-bottom)){border-block-end-color:var(--s-border-default)}:host(.box--cover){width:100%;height:100%}:host *{box-sizing:border-box}", h = l, a = class {
   constructor(e) {
     d(this, e), this.componentLoad = r(this, "componentLoad", 7), this.onScroll = () => {
       this.updateScrollState();
@@ -18,6 +18,8 @@ const n = ":host{display:block;width:100%}:host(.box--bordered){border:var(--s-b
     });
   }
   updateScrollState() {
+    if (!this.el.isConnected)
+      return;
     const e = {
       scrollable: this.el.scrollHeight > this.el.clientHeight,
       scrolledToTop: this.el.scrollTop === 0,
@@ -51,7 +53,7 @@ const n = ":host{display:block;width:100%}:host(.box--bordered){border:var(--s-b
       top: this.top,
       width: this.cover ? "100%" : this.width,
       zIndex: this.zIndex
-    }, o = l("box", `box--border-color-${this.borderColor}`, {
+    }, o = n("box", `box--border-color-${this.borderColor}`, {
       "box--bordered": this.bordered,
       "box--bordered-block-end": this.borderedBlockEnd,
       "box--bordered-block-end-when-scrolled": this.borderedBlockEndWhenScrolled,
@@ -64,7 +66,7 @@ const n = ":host{display:block;width:100%}:host(.box--bordered){border:var(--s-b
       "box--scrolled-to-top": this.scrollState.scrolledToTop,
       "box--scrolled-to-bottom": this.scrollState.scrolledToBottom
     });
-    return t(i, { key: "c8296ade3ea2dcaa4e14897557c343b433de562c", class: o, onScroll: this.onScroll, style: e }, t("slot", { key: "a0029e22b4fc9b60cb679af27f7ae66d366c0ef4" }));
+    return t(i, { key: "3fe66bb155b98d59e332ccc874be031a02f75ca4", class: o, onScroll: this.onScroll, style: e }, t("slot", { key: "48f27e0dd192e68a9605d97e3a685a2c89ec5cb0" }));
   }
   get el() {
     return s(this);

package/dist/{swirl-button-group.entry.5a77c5e5.js → swirl-button-group.entry.70d94069.js}

@@ -1,4 +1,4 @@
-import { r as s, h as r, H as i } from "./index.9a9fa403.js";
+import { r as s, h as r, H as i } from "./index.125b00c7.js";
 import { c as e } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";

package/dist/{swirl-button.entry.c016a24b.js → swirl-button.entry.806f9f67.js}

@@ -1,4 +1,4 @@
-import { r as l, h as o, H as u, g as d } from "./index.9a9fa403.js";
+import { r as l, h as o, H as u, g as d } from "./index.125b00c7.js";
 import { c } from "./index-267776a4.6beb4f4b.js";
 import { g as v } from "./utils-877a768f.c277f897.js";
 import "react";

package/dist/{swirl-card.entry.e44051d9.js → swirl-card.entry.8cb50ea4.js}

@@ -1,4 +1,4 @@
-import { r as t, c as n, h as e, H as o, g as c } from "./index.9a9fa403.js";
+import { r as t, c as n, h as e, H as o, g as c } from "./index.125b00c7.js";
 import { c as l } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";

package/dist/{swirl-carousel-slide.entry.984f0efc.js → swirl-carousel-slide.entry.4c848b66.js}

@@ -1,4 +1,4 @@
-import { r as i, h as s, H as t } from "./index.9a9fa403.js";
+import { r as i, h as s, H as t } from "./index.125b00c7.js";
 import { c as a } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";

package/dist/{swirl-carousel.entry.e3c8c2df.js → swirl-carousel.entry.e67e14fa.js}

@@ -1,4 +1,4 @@
-import { r as o, c as a, h as l, H as r, g as d } from "./index.9a9fa403.js";
+import { r as o, c as a, h as l, H as r, g as d } from "./index.125b00c7.js";
 import { d as c } from "./utils-877a768f.c277f897.js";
 import { c as h } from "./index-267776a4.6beb4f4b.js";
 import "react";

package/dist/{swirl-checkbox.entry.396094bd.js → swirl-checkbox.entry.51efe86d.js}

@@ -1,4 +1,4 @@
-import { r as b, c as t, h as c, H as d } from "./index.9a9fa403.js";
+import { r as b, c as t, h as c, H as d } from "./index.125b00c7.js";
 import { c as l } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";

package/dist/{swirl-chip.entry.5e0bc688.js → swirl-chip.entry.9616a142.js}

@@ -1,4 +1,4 @@
-import { r as o, c as s, h as r, H as h, g as n } from "./index.9a9fa403.js";
+import { r as o, c as s, h as r, H as h, g as n } from "./index.125b00c7.js";
 import { c as p } from "./index-267776a4.6beb4f4b.js";
 import { g as l } from "./utils-877a768f.c277f897.js";
 import "react";

package/dist/{swirl-color-input.entry.2b9f432e.js → swirl-color-input.entry.6c183bf0.js}

@@ -1,4 +1,4 @@
-import { r as L, c as f, h as l, H as B } from "./index.9a9fa403.js";
+import { r as L, c as f, h as l, H as B } from "./index.125b00c7.js";
 import { c as T } from "./index-267776a4.6beb4f4b.js";
 import { v as z } from "./v4-23648a96.77c7c20f.js";
 import "react";

package/dist/{swirl-columns.entry.27070d05.js → swirl-columns.entry.7cd7d597.js}

@@ -1,4 +1,4 @@
-import { r as c, h as s, H as e } from "./index.9a9fa403.js";
+import { r as c, h as s, H as e } from "./index.125b00c7.js";
 import "react";
 import "react-dom";
 const o = ":host{display:block}:host *{box-sizing:border-box}.columns{display:grid;width:100%}", t = o, i = class {

package/dist/swirl-components-react.js

@@ -1,4 +1,4 @@
-import { a as o, S as s, b as S, d as e, e as w, i as n, j as c, k as I, l as t, m as d, n as b, o as m, p as y, q as p, s as u, t as g, u as T, v as h, w as C, x as A, y as k, z as L, A as f, B as F, C as R, D as P, E as v, G as M, I as D, J as B, K as E, L as O, M as V, N as x, O as G, P as N, Q as H, R as j, T as U, U as W, V as K, W as q, X as z, Y as X, Z as Y, _ as J, $ as Q, a0 as Z, a1 as _, a2 as $, a3 as aa, a4 as ia, a5 as ra, a6 as la, a7 as oa, a8 as sa, a9 as Sa, aa as ea, ab as wa, ac as na, ad as ca, ae as Ia, af as ta, ag as da, ah as ba, ai as ma, aj as ya, ak as pa, al as ua, am as ga, an as Ta, ao as ha, ap as Ca, aq as Aa, ar as ka, as as La, at as fa, au as Fa, av as Ra, aw as Pa, ax as va, ay as Ma, az as Da, aA as Ba, aB as Ea, aC as Oa, aD as Va, aE as xa, aF as Ga, aG as Na, aH as Ha, aI as ja, aJ as Ua, aK as Wa, aL as Ka, aM as qa, aN as za, aO as Xa, aP as Ya, aQ as Ja, aR as Qa, aS as Za, aT as _a, aU as $a, aV as ai, aW as ii, aX as ri, aY as li, aZ as oi, a_ as si, a$ as Si, b0 as ei, b1 as wi, b2 as ni, b3 as ci, b4 as Ii, b5 as ti, b6 as di, b7 as bi, b8 as mi, b9 as yi, ba as pi, bb as ui, bc as gi, bd as Ti, be as hi, bf as Ci, bg as Ai, bh as ki, bi as Li, bj as fi, bk as Fi, bl as Ri, bm as Pi, bn as vi, bo as Mi, bp as Di, bq as Bi, br as Ei, bs as Oi, bt as Vi, bu as xi, bv as Gi, bw as Ni, bx as Hi, by as ji, bz as Ui, bA as Wi, bB as Ki, bC as qi, bD as zi, bE as Xi, bF as Yi, bG as Ji, bH as Qi, bI as Zi, bJ as _i, bK as $i, bL as ar, bM as ir, bN as rr, bO as lr, bP as or, bQ as sr, bR as Sr, bS as er, bT as wr, bU as nr, bV as cr, bW as Ir, bX as tr, bY as dr, bZ as br, b_ as mr, b$ as yr, c0 as pr, c1 as ur, c2 as gr, c3 as Tr, c4 as hr, c5 as Cr, c6 as Ar, c7 as kr, c8 as Lr, c9 as fr, ca as Fr, cb as Rr, cc as Pr, cd as vr, ce as Mr, cf as Dr, cg as Br, ch as Er, ci as Or, cj as Vr, ck as xr, cl as Gr, cm as Nr, cn as Hr, co as jr, cp as Ur, cq as Wr, cr as Kr, cs as qr, ct as zr, cu as Xr, cv as Yr, cw as Jr, cx as Qr, cy as Zr, cz as _r, cA as $r, cB as al, cC as il, cD as rl, cE as ll, cF as ol, cG as sl, cH as Sl, cI as el, cJ as wl, cK as nl, cL as cl, cM as Il, cN as tl, cO as dl, cP as bl, cQ as ml, cR as yl, cS as pl, cT as ul, cU as gl, cV as Tl, cW as hl, cX as Cl, cY as Al, cZ as kl, c_ as Ll, c$ as fl, d0 as Fl, d1 as Rl, d2 as Pl, d3 as vl, d4 as Ml, d5 as Dl, d6 as Bl, d7 as El, d8 as Ol, d9 as Vl, da as xl, db as Gl, dc as Nl, dd as Hl, de as jl, df as Ul, dg as Wl, dh as Kl, di as ql, dj as zl, dk as Xl, dl as Yl, dm as Jl, dn as Ql, dp as Zl, dq as _l, dr as $l, ds as ao, dt as io, du as ro, dv as lo, dw as oo, dx as so, dy as So, dz as eo, dA as wo, dB as no, dC as co, dD as Io, dE as to, dF as bo, dG as mo, dH as yo, dI as po, dJ as uo, dK as go, dL as To, dM as ho, dN as Co, dO as Ao, dP as ko, dQ as Lo, dR as fo, dS as Fo, dT as Ro, dU as Po, dV as vo, dW as Mo, dX as Do, dY as Bo, dZ as Eo, d_ as Oo, d$ as Vo, e0 as xo, e1 as Go, e2 as No, e3 as Ho, e4 as jo, e5 as Uo, e6 as Wo, e7 as Ko, e8 as qo, e9 as zo, ea as Xo, eb as Yo, ec as Jo, ed as Qo, ee as Zo, ef as _o, eg as $o, eh as as, ei as is, ej as rs, ek as ls, el as os, em as ss, en as Ss, eo as es, ep as ws, eq as ns, er as cs, es as Is, et as ts, eu as ds, ev as bs, ew as ms, ex as ys, ey as ps, ez as us, eA as gs, eB as Ts, eC as hs, eD as Cs, eE as As, eF as ks, eG as Ls, eH as fs, eI as Fs, eJ as Rs, eK as Ps, eL as vs, eM as Ms, eN as Ds, eO as Bs, eP as Es, eQ as Os, eR as Vs, eS as xs, eT as Gs, eU as Ns, eV as Hs, eW as js, eX as Us, eY as Ws, eZ as Ks, e_ as qs, e$ as zs, f0 as Xs, f1 as Ys } from "./index.9a9fa403.js";
+import { a as o, S as s, b as S, d as e, e as w, i as n, j as c, k as I, l as t, m as d, n as b, o as m, p as y, q as p, s as u, t as g, u as T, v as h, w as C, x as A, y as k, z as L, A as f, B as F, C as R, D as P, E as v, G as M, I as D, J as B, K as E, L as O, M as V, N as x, O as G, P as N, Q as H, R as j, T as U, U as W, V as K, W as q, X as z, Y as X, Z as Y, _ as J, $ as Q, a0 as Z, a1 as _, a2 as $, a3 as aa, a4 as ia, a5 as ra, a6 as la, a7 as oa, a8 as sa, a9 as Sa, aa as ea, ab as wa, ac as na, ad as ca, ae as Ia, af as ta, ag as da, ah as ba, ai as ma, aj as ya, ak as pa, al as ua, am as ga, an as Ta, ao as ha, ap as Ca, aq as Aa, ar as ka, as as La, at as fa, au as Fa, av as Ra, aw as Pa, ax as va, ay as Ma, az as Da, aA as Ba, aB as Ea, aC as Oa, aD as Va, aE as xa, aF as Ga, aG as Na, aH as Ha, aI as ja, aJ as Ua, aK as Wa, aL as Ka, aM as qa, aN as za, aO as Xa, aP as Ya, aQ as Ja, aR as Qa, aS as Za, aT as _a, aU as $a, aV as ai, aW as ii, aX as ri, aY as li, aZ as oi, a_ as si, a$ as Si, b0 as ei, b1 as wi, b2 as ni, b3 as ci, b4 as Ii, b5 as ti, b6 as di, b7 as bi, b8 as mi, b9 as yi, ba as pi, bb as ui, bc as gi, bd as Ti, be as hi, bf as Ci, bg as Ai, bh as ki, bi as Li, bj as fi, bk as Fi, bl as Ri, bm as Pi, bn as vi, bo as Mi, bp as Di, bq as Bi, br as Ei, bs as Oi, bt as Vi, bu as xi, bv as Gi, bw as Ni, bx as Hi, by as ji, bz as Ui, bA as Wi, bB as Ki, bC as qi, bD as zi, bE as Xi, bF as Yi, bG as Ji, bH as Qi, bI as Zi, bJ as _i, bK as $i, bL as ar, bM as ir, bN as rr, bO as lr, bP as or, bQ as sr, bR as Sr, bS as er, bT as wr, bU as nr, bV as cr, bW as Ir, bX as tr, bY as dr, bZ as br, b_ as mr, b$ as yr, c0 as pr, c1 as ur, c2 as gr, c3 as Tr, c4 as hr, c5 as Cr, c6 as Ar, c7 as kr, c8 as Lr, c9 as fr, ca as Fr, cb as Rr, cc as Pr, cd as vr, ce as Mr, cf as Dr, cg as Br, ch as Er, ci as Or, cj as Vr, ck as xr, cl as Gr, cm as Nr, cn as Hr, co as jr, cp as Ur, cq as Wr, cr as Kr, cs as qr, ct as zr, cu as Xr, cv as Yr, cw as Jr, cx as Qr, cy as Zr, cz as _r, cA as $r, cB as al, cC as il, cD as rl, cE as ll, cF as ol, cG as sl, cH as Sl, cI as el, cJ as wl, cK as nl, cL as cl, cM as Il, cN as tl, cO as dl, cP as bl, cQ as ml, cR as yl, cS as pl, cT as ul, cU as gl, cV as Tl, cW as hl, cX as Cl, cY as Al, cZ as kl, c_ as Ll, c$ as fl, d0 as Fl, d1 as Rl, d2 as Pl, d3 as vl, d4 as Ml, d5 as Dl, d6 as Bl, d7 as El, d8 as Ol, d9 as Vl, da as xl, db as Gl, dc as Nl, dd as Hl, de as jl, df as Ul, dg as Wl, dh as Kl, di as ql, dj as zl, dk as Xl, dl as Yl, dm as Jl, dn as Ql, dp as Zl, dq as _l, dr as $l, ds as ao, dt as io, du as ro, dv as lo, dw as oo, dx as so, dy as So, dz as eo, dA as wo, dB as no, dC as co, dD as Io, dE as to, dF as bo, dG as mo, dH as yo, dI as po, dJ as uo, dK as go, dL as To, dM as ho, dN as Co, dO as Ao, dP as ko, dQ as Lo, dR as fo, dS as Fo, dT as Ro, dU as Po, dV as vo, dW as Mo, dX as Do, dY as Bo, dZ as Eo, d_ as Oo, d$ as Vo, e0 as xo, e1 as Go, e2 as No, e3 as Ho, e4 as jo, e5 as Uo, e6 as Wo, e7 as Ko, e8 as qo, e9 as zo, ea as Xo, eb as Yo, ec as Jo, ed as Qo, ee as Zo, ef as _o, eg as $o, eh as as, ei as is, ej as rs, ek as ls, el as os, em as ss, en as Ss, eo as es, ep as ws, eq as ns, er as cs, es as Is, et as ts, eu as ds, ev as bs, ew as ms, ex as ys, ey as ps, ez as us, eA as gs, eB as Ts, eC as hs, eD as Cs, eE as As, eF as ks, eG as Ls, eH as fs, eI as Fs, eJ as Rs, eK as Ps, eL as vs, eM as Ms, eN as Ds, eO as Bs, eP as Es, eQ as Os, eR as Vs, eS as xs, eT as Gs, eU as Ns, eV as Hs, eW as js, eX as Us, eY as Ws, eZ as Ks, e_ as qs, e$ as zs, f0 as Xs, f1 as Ys } from "./index.125b00c7.js";
 import "react";
 import "react-dom";
 export {