@getflip/swirl-components-react 0.197.1 → 0.199.0

package/dist/swirl-autocomplete.entry.8ae10ce4.js

@@ -0,0 +1,115 @@
+import { r as p, c as m, h as o, H as f, g as b } from "./index.9d32bf5e.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-aab10c80.240adddc.js";
+import "react";
+import "react-dom";
+const x = ".sc-swirl-autocomplete-h{display:block}.sc-swirl-autocomplete-h *.sc-swirl-autocomplete{box-sizing:border-box}.autocomplete--inactive.sc-swirl-autocomplete .autocomplete__listbox-container.sc-swirl-autocomplete{display:none}.autocomplete__listbox-container.sc-swirl-autocomplete{position:fixed;z-index:var(--s-z-40);overflow-x:hidden;overflow-y:auto;max-height:18rem;padding-top:var(--s-space-8);padding-bottom:var(--s-space-8);border-radius:var(--s-border-radius-sm);background-color:var(--s-surface-overlay-default);animation:autocomplete-enter 0.1s;box-shadow:var(--s-shadow-level-1)}.autocomplete__listbox-container.sc-swirl-autocomplete:empty{display:none}.autocomplete__spinner.sc-swirl-autocomplete{display:flex;padding:var(--s-space-16);justify-content:center;align-items:center}.autocomplete__multi-select-tags.sc-swirl-autocomplete{margin-top:var(--swirl-autocomplete-tags-margin-top);margin-bottom:var(--s-space-4)}@keyframes autocomplete-enter{from{opacity:0}to{opacity:1}}", A = x, C = class {
+  constructor(i) {
+    p(this, i), this.valueChange = m(this, "valueChange", 7), this.onChange = (e) => {
+      e.stopPropagation(), this.updateTerm(e);
+    }, this.updateTerm = S(async (e) => {
+      this.updateSuggestions(e.detail), this.open(), !this.multiSelect && (!Boolean(e.detail) || e.detail === "") && (this.value = void 0, this.valueChange.emit(this.value));
+    }, 250, !1), this.onSelect = async (e) => {
+      if (e.stopPropagation(), this.multiSelect) {
+        const s = e.detail, n = this.suggestions.filter((l) => !s.includes(l.id)).map((l) => l.id);
+        this.value = [
+          ...this.value.filter((l) => !n.includes(l.id)),
+          ...this.suggestions.filter((l) => s.includes(l.id) && !this.value.some((u) => u.id === l.id))
+        ], this.valueChange.emit(this.value), this.inputEl.value = "";
+        const a = this.inputEl.querySelector("input");
+        Boolean(a) && (a.value = "", queueMicrotask(() => {
+          a.focus(), this.close();
+        }), this.updateSuggestions(a.value));
+      } else if (Boolean(e.detail[0])) {
+        const s = e.detail[0], n = this.suggestions.find((a) => a.id === s);
+        if (!Boolean(n))
+          return;
+        this.value = n, this.valueChange.emit(this.value), queueMicrotask(() => {
+          var a;
+          (a = this.inputEl.querySelector("input")) == null || a.focus(), this.close();
+        });
+      }
+    }, this.onRemoveValue = (e) => {
+      !Array.isArray(this.value) || (this.value = this.value.filter((s) => s.id !== e), this.valueChange.emit(this.value));
+    }, this.onFocusOut = (e) => {
+      const s = e.relatedTarget;
+      Boolean(s) && !this.el.contains(s) && this.close();
+    }, this.onFocus = () => {
+      this.updateSuggestions(), this.open();
+    }, this.onKeyDown = (e) => {
+      e.code === "Escape" && (e.preventDefault(), e.stopPropagation(), this.inputEl.querySelector("input").focus(), this.close());
+    }, this.onInputKeyDown = (e) => {
+      var s, n;
+      e.code === "ArrowDown" && (e.preventDefault(), (n = (s = this.listboxEl.querySelector('[role="listbox"]')) == null ? void 0 : s.querySelector('[tabIndex="0"]')) == null || n.focus());
+    }, this.autoSelect = void 0, this.clearable = !0, this.clearButtonLabel = "Clear input", this.disabled = void 0, this.generateSuggestions = async () => [], this.inline = void 0, this.invalid = void 0, this.maxLength = void 0, this.menuLabel = "Suggestions", this.mode = void 0, this.multiSelect = void 0, this.placeholder = void 0, this.required = void 0, this.spellCheck = void 0, this.swirlAriaDescribedby = void 0, this.value = void 0, this.active = !1, this.loading = !1, this.position = void 0, this.suggestions = [];
+  }
+  componentWillLoad() {
+    const i = document.querySelectorAll("swirl-datepicker").length;
+    this.id = `autocomplete-${i}`, this.handleInitialValue();
+  }
+  onWindowClick(i) {
+    const e = i.target;
+    this.el.contains(e) || this.close();
+  }
+  watchMultiSelect() {
+    this.handleInitialValue();
+  }
+  async close() {
+    var e;
+    if (!this.active)
+      return;
+    this.disableAutoUpdate && this.disableAutoUpdate();
+    const i = this.inputEl.querySelector("input");
+    Boolean(i) && (this.multiSelect ? i.value = "" : i.value = ((e = this.value) == null ? void 0 : e.label) || ""), this.active = !1;
+  }
+  async open() {
+    this.active || (this.active = !0, requestAnimationFrame(async () => {
+      await this.reposition(), this.disableAutoUpdate && this.disableAutoUpdate(), this.disableAutoUpdate = g(this.inputEl, this.listboxContainerEl, this.reposition.bind(this), { animationFrame: !0 }), this.listboxContainerEl.scrollTop = 0, this.updateSuggestions(this.inputEl.querySelector("input").value);
+    }));
+  }
+  async reposition() {
+    !Boolean(this.listboxContainerEl) || (this.position = await v(this.inputEl, this.listboxContainerEl, {
+      middleware: [y({ crossAxis: -16, mainAxis: 16 })],
+      placement: "bottom-start",
+      strategy: "fixed"
+    }));
+  }
+  async updateSuggestions(i) {
+    this.loading = !0, this.suggestions = [], this.suggestions = await this.generateSuggestions(i), this.loading = !1;
+  }
+  handleInitialValue() {
+    this.multiSelect && !Array.isArray(this.value) && (this.value = []), !this.multiSelect && Array.isArray(this.value) && (this.value = void 0);
+  }
+  render() {
+    var l, u, c, r;
+    const i = `${this.id}-suggestions`, e = this.clearable && !this.multiSelect, s = this.multiSelect ? this.value.map((t) => t.id) : Boolean(this.value) ? [this.value.id] : [], n = this.multiSelect ? void 0 : ((l = this.value) == null ? void 0 : l.label) || "", a = w("autocomplete", {
+      "autocomplete--inactive": !this.active
+    });
+    return o(f, { key: "a6b1864a1d1022a24c22a1b37e9953a3c232c2bc" }, o("div", { key: "57be24dac5a4c174bf7941c07a05b3431487dec3", class: a, onKeyDown: this.onKeyDown }, this.multiSelect && Array.isArray(this.value) && this.value.length > 0 && o("div", { key: "6b8b6268c1b208b7cc378ee4a22f05fd4b30df51", class: "autocomplete__multi-select-tags" }, o("swirl-stack", { key: "0b82d5899891d8ba4d07fe012cc1a8c501fdf62c", orientation: "horizontal", spacing: "8", wrap: !0 }, this.value.map((t) => o("swirl-tag", {
+      key: t.id,
+      label: t.label,
+      onRemove: () => this.onRemoveValue(t.id),
+      removable: !this.disabled
+    })))), o("swirl-text-input", { key: "929f9be8b336bdae9c31e9bc2e98936cf9a3ff86", autoSelect: this.autoSelect, class: "autocomplete__input", clearable: e, clearButtonLabel: this.clearButtonLabel, disabled: this.disabled, disableDynamicWidth: !0, id: this.id, inline: this.inline, invalid: this.invalid, onInputFocus: this.onFocus, onKeyDown: this.onInputKeyDown, onValueChange: this.onChange, maxLength: this.maxLength, mode: this.mode, placeholder: this.placeholder, ref: (t) => this.inputEl = t, required: this.required, spellCheck: this.spellCheck, swirlAriaAutocomplete: "list", swirlAriaControls: i, swirlAriaDescribedby: this.swirlAriaDescribedby, swirlAriaExpanded: String(this.active), swirlRole: "combobox", value: n }), o("div", { key: "a53953db455c7f3515cf394390c2c0089ed7155f", class: "autocomplete__listbox-container", onFocusout: this.onFocusOut, ref: (t) => this.listboxContainerEl = t, style: {
+      top: Boolean(this.position) ? `${(u = this.position) == null ? void 0 : u.y}px` : "",
+      left: Boolean(this.position) ? `${(c = this.position) == null ? void 0 : c.x}px` : "",
+      width: `${((r = this.inputEl) == null ? void 0 : r.getBoundingClientRect().width) + 32}px`
+    } }, this.loading && o("div", { key: "44ce277c6dc3571ae5fb22f31eb28dce7c54f0d7", class: "autocomplete__spinner" }, o("swirl-spinner", { key: "4fdbda089dd91a9aab0f1559d753a239fbfaeb9c" })), this.suggestions.length > 0 && o("swirl-option-list", { key: "7be30b1c4ba99ceda255c507be07917d19e965ef", allowDeselect: this.multiSelect === !0, label: this.menuLabel, multiSelect: this.multiSelect, onValueChange: this.onSelect, optionListId: i, ref: (t) => this.listboxEl = t, value: s }, this.suggestions.map((t) => {
+      var h;
+      return o("swirl-option-list-item", { selected: Array.isArray(this.value) ? this.value.some((d) => d.id === t.id) : ((h = this.value) == null ? void 0 : h.id) === t.id, key: t.id, disabled: t.disabled, label: t.label, value: t.id });
+    })))));
+  }
+  get el() {
+    return b(this);
+  }
+  static get watchers() {
+    return {
+      multiSelect: ["watchMultiSelect"]
+    };
+  }
+};
+C.style = A;
+export {
+  C as swirl_autocomplete
+};

package/dist/{swirl-avatar-group.entry.bf8bacf2.js → swirl-avatar-group.entry.c8022fb7.js}

@@ -1,10 +1,10 @@
-import { r as s, h as a, H as i } from "./index.a5290183.js";
-import { c as e } from "./index-d280dafb.186cdb0e.js";
+import { r as s, h as r, H as i } from "./index.9d32bf5e.js";
+import { c as e } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";
-const d = ":host{display:inline-flex}:host *{box-sizing:border-box}.avatar-group{position:relative;display:inline-grid;grid-template-rows:repeat(9, 1fr);grid-template-columns:repeat(9, 1fr)}.avatar-group ::slotted(*:first-of-type){z-index:1;display:inline-flex;box-shadow:0 0 0 0.25rem var(--swirl-avatar-group-border-color);border-radius:50%;grid-column-start:1;grid-column-end:7;grid-row-start:4;grid-row-end:10}.avatar-group ::slotted(*:nth-of-type(2)){z-index:0;display:inline-flex;border-radius:50%;grid-column-start:4;grid-column-end:10;grid-row-start:1;grid-row-end:7}.avatar-group__badge{position:absolute;z-index:2;right:calc(-1 * var(--s-space-4));bottom:calc(-1 * var(--s-space-4));display:inline-flex;width:1.5rem;height:1.5rem}.avatar-group__badge ::part(badge){box-shadow:0 0 0 0.25rem var(--swirl-badge-border-color)}", l = class {
-  constructor(r) {
-    s(this, r), this.badge = void 0;
+const d = ":host{display:inline-flex}:host *{box-sizing:border-box}.avatar-group{position:relative;display:inline-grid;grid-template-rows:repeat(9, 1fr);grid-template-columns:repeat(9, 1fr)}.avatar-group ::slotted(*:first-of-type){z-index:1;display:inline-flex;box-shadow:0 0 0 0.25rem var(--swirl-avatar-group-border-color);border-radius:50%;grid-column-start:1;grid-column-end:7;grid-row-start:4;grid-row-end:10}.avatar-group ::slotted(*:nth-of-type(2)){z-index:0;display:inline-flex;border-radius:50%;grid-column-start:4;grid-column-end:10;grid-row-start:1;grid-row-end:7}.avatar-group__badge{position:absolute;z-index:2;right:calc(-1 * var(--s-space-4));bottom:calc(-1 * var(--s-space-4));display:inline-flex;width:1.5rem;height:1.5rem}.avatar-group__badge ::part(badge){box-shadow:0 0 0 0.25rem var(--swirl-badge-border-color)}", l = d, n = class {
+  constructor(a) {
+    s(this, a), this.badge = void 0;
   }
   componentDidLoad() {
     this.forceBadgeProps();
@@ -12,17 +12,17 @@ const d = ":host{display:inline-flex}:host *{box-sizing:border-box}.avatar-group
   forceBadgeProps() {
     if (!Boolean(this.badge))
       return;
-    const r = this.badgeEl.querySelector("swirl-badge");
-    r == null || r.setAttribute("size", "s");
+    const a = this.badgeEl.querySelector("swirl-badge");
+    a == null || a.setAttribute("size", "s");
   }
   render() {
-    const r = e("avatar-group", {
+    const a = e("avatar-group", {
       "avatar-group--has-badge": Boolean(this.badge)
-    }), o = e("avatar-group__badge");
-    return a(i, null, a("div", { class: r, role: "group" }, a("slot", null), this.badge && a("span", { class: o, innerHTML: this.badge, ref: (t) => this.badgeEl = t })));
+    }), t = e("avatar-group__badge");
+    return r(i, { key: "7b7027db948044855a7379a55e58739323c229d8" }, r("div", { key: "eae14e9f4d5c76c3f2a33ebabfb64407b60e8cca", class: a, role: "group" }, r("slot", { key: "ba4790ffe879fca5d77c498b9f6a16d02515d98a" }), this.badge && r("span", { key: "fdf63a67db87eae4bfb924074052e1fba57e53f0", class: t, innerHTML: this.badge, ref: (o) => this.badgeEl = o })));
   }
 };
-l.style = d;
+n.style = l;
 export {
-  l as swirl_avatar_group
+  n as swirl_avatar_group
 };

package/dist/{swirl-avatar.entry.ae7e7eab.js → swirl-avatar.entry.5a8a2c9b.js}

@@ -1,8 +1,8 @@
-import { r as g, c as n, h as i, H as m, g as u } from "./index.a5290183.js";
-import { c as r } from "./index-d280dafb.186cdb0e.js";
+import { r as g, c as n, h as i, H as f, g as b } from "./index.9d32bf5e.js";
+import { c as r } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";
-const p = ":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)}", o = {
+const m = ":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 = m, o = {
   "3xs": 20,
   "2xs": 24,
   xs: 28,
@@ -11,7 +11,7 @@ const p = ":host{display:inline-flex;flex-shrink:0;align-items:center;flex-direc
   l: 48,
   xl: 64,
   "2xl": 144
-}, b = class {
+}, p = class {
   constructor(t) {
     g(this, t), this.imageError = n(this, "imageError", 7), this.imageLoad = n(this, "imageLoad", 7), this.setImageAvailable = () => {
       this.imageAvailable = !0, this.loadingError = !1, this.loaded = !0, this.imageLoad.emit();
@@ -42,15 +42,15 @@ const p = ":host{display:inline-flex;flex-shrink:0;align-items:center;flex-direc
     this.inViewport = t.some((a) => a.isIntersecting);
   }
   render() {
-    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), e = !t && !a && Boolean(this.icon), s = !t && !a && !e, l = Boolean(this.badge) && this.size === "m", v = this.interactive ? "button" : void 0, d = r("avatar", `avatar--color-${this.color}`, `avatar--size-${this.size}`, `avatar--variant-${this.variant}`, {
+    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), e = !t && !a && Boolean(this.icon), s = !t && !a && !e, d = Boolean(this.badge) && this.size === "m", v = this.interactive ? "button" : void 0, l = r("avatar", `avatar--color-${this.color}`, `avatar--size-${this.size}`, `avatar--variant-${this.variant}`, {
       "avatar--has-icon": e || s,
       "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 i(m, { "aria-label": this.label, onKeydown: this.interactive ? this.onKeydown : void 0, onKeyup: this.interactive ? this.onKeyup : void 0, role: v, tabIndex: this.interactive ? 0 : void 0 }, i("span", { class: d, part: "avatar" }, t && i("span", { class: "avatar__image" }, i("img", { 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 && i("span", { class: "avatar__initials" }, i("span", null, this.initials)), e && i("span", { class: "avatar__icon", innerHTML: this.icon }), s && i("span", { class: "avatar__icon" }, i("swirl-icon-person", null)), l && i("span", { class: c, innerHTML: this.badge }), i("span", { class: h }, i("slot", { name: "tool" }))), this.showLabel && i("span", { "aria-hidden": !0, class: "avatar__label" }, this.label));
+    return i(f, { key: "38e7fdc01d2cecd4d17a2fa040c61ffe1c8a8592", "aria-label": this.label, onKeydown: this.interactive ? this.onKeydown : void 0, onKeyup: this.interactive ? this.onKeyup : void 0, role: v, tabIndex: this.interactive ? 0 : void 0 }, i("span", { key: "d3b5aff230c79d4b77fb68d7ba8627c9f1f457db", class: l, part: "avatar" }, t && i("span", { key: "f849bd9c9fb03744706fd2359d32e97f96331bbd", class: "avatar__image" }, i("img", { key: "af33045f4385a047dbba8eb5336f1608552bb947", 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 && i("span", { key: "6d1bad70e7a6afa0d74780fc730d18b196193924", class: "avatar__initials" }, i("span", { key: "b65c566aa22a4a208511967969aad5b8d9665f79" }, this.initials)), e && i("span", { key: "bc0f43846240cb026d6762814e1d8d0719e10577", class: "avatar__icon", innerHTML: this.icon }), s && i("span", { key: "046588d4ddc12fca345e48c691691f6404d0fd29", class: "avatar__icon" }, i("swirl-icon-person", { key: "67d6eedba866483ed582a06a6e6e3292cf3970c0" })), d && i("span", { key: "682c1ab0a83634fedf76a5188992a5a7a55d68d8", class: c, innerHTML: this.badge }), i("span", { key: "815f38e18f11e8938f1483fee33a7cd51dba23a4", class: h }, i("slot", { key: "c83f80bd8a67386bf75c7d7182e22f87352be94d", name: "tool" }))), this.showLabel && i("span", { key: "e71fb04bfb8f8a9dca53a13eb510d2c037bd07ca", "aria-hidden": !0, class: "avatar__label" }, this.label));
   }
   get element() {
-    return u(this);
+    return b(this);
   }
   static get watchers() {
     return {
@@ -58,7 +58,7 @@ const p = ":host{display:inline-flex;flex-shrink:0;align-items:center;flex-direc
     };
   }
 };
-b.style = p;
+p.style = u;
 export {
-  b as swirl_avatar
+  p as swirl_avatar
 };

package/dist/{swirl-badge.entry.b81abbe0.js → swirl-badge.entry.c4492a4e.js}

@@ -1,8 +1,8 @@
-import { r as i, h as e, F as t, H as r } from "./index.a5290183.js";
-import { c as s } from "./index-d280dafb.186cdb0e.js";
+import { r as i, h as e, F as t, H as r } from "./index.9d32bf5e.js";
+import { c as s } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";
-const n = ":host{display:inline-flex;min-width:0;max-width:100%;justify-content:center;align-items:center}:host *{box-sizing:border-box}.badge{display:inline-flex;max-width:100%;justify-content:center;align-items:center;border-radius:2rem;color:var(--s-text-on-status);font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);box-shadow:0 0 0 0.125rem var(--swirl-badge-border-color)}.badge--size-xs{min-width:1rem;height:1rem;font-size:0.6875rem}.badge--size-xs .badge__label{padding-right:0.25rem;padding-left:0.25rem}.badge--size-xs .badge__icon>swirl-icon,.badge--size-xs .badge__icon>*::part(icon){width:0.75rem;height:0.75rem}.badge--size-s{min-width:1.25rem;height:1.25rem;font-size:0.75rem}.badge--size-s .badge__label{padding-right:0.375rem;padding-left:0.375rem}.badge--size-s .badge__icon>swirl-icon,.badge--size-s .badge__icon>*::part(icon){width:1rem;height:1rem}.badge--size-m{min-width:1.5rem;height:1.5rem}.badge--size-m .badge__label{padding-right:0.4375rem;padding-left:0.4375rem}.badge--has-icon{padding-right:0;padding-left:0}.badge--intent-critical{color:var(--s-text-on-status);background-color:var(--s-surface-critical-default)}.badge--intent-banana{color:var(--s-text-dark);background-color:var(--s-decorative-banana-surface)}.badge--intent-blueberry{color:var(--s-text-on-status);background-color:var(--s-decorative-blueberry-surface)}.badge--intent-chilli{color:var(--s-text-on-status);background-color:var(--s-decorative-chilli-surface)}.badge--intent-grape{color:var(--s-text-on-status);background-color:var(--s-decorative-grape-surface)}.badge--intent-kiwi{color:var(--s-text-on-status);background-color:var(--s-decorative-kiwi-surface)}.badge--intent-neutral{color:var(--s-text-default);background-color:var(--s-surface-neutral-subdued)}.badge--intent-pumpkin{color:var(--s-text-dark);background-color:var(--s-decorative-pumpkin-surface)}.badge--intent-radish{color:var(--s-text-on-status);background-color:var(--s-decorative-radish-surface)}.badge--variant-dot{width:1.5rem;min-width:0;height:1.5rem}.badge--variant-dot.badge--size-xs{width:0.5rem;height:0.5rem}.badge--variant-dot.badge--size-s{width:0.75rem;height:0.75rem}.badge--variant-dot.badge--size-m{width:1rem;height:1rem}.badge--variant-dot .badge__label{padding-right:0;padding-left:0}.badge--variant-dot .badge__icon{display:none}.badge__icon{display:inline-flex}.badge__icon>swirl-icon,.badge__icon>*::part(icon){width:1rem;height:1rem}.badge__label{display:inline-flex;overflow:hidden;max-width:100%;white-space:nowrap;text-overflow:ellipsis}", d = class {
+const d = ":host{display:inline-flex;min-width:0;max-width:100%;justify-content:center;align-items:center}:host *{box-sizing:border-box}.badge{display:inline-flex;max-width:100%;justify-content:center;align-items:center;border-radius:2rem;color:var(--s-text-on-status);font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);box-shadow:0 0 0 0.125rem var(--swirl-badge-border-color)}.badge--size-xs{min-width:1rem;height:1rem;font-size:0.6875rem}.badge--size-xs .badge__label{padding-right:0.25rem;padding-left:0.25rem}.badge--size-xs .badge__icon>swirl-icon,.badge--size-xs .badge__icon>*::part(icon){width:0.75rem;height:0.75rem}.badge--size-s{min-width:1.25rem;height:1.25rem;font-size:0.75rem}.badge--size-s .badge__label{padding-right:0.375rem;padding-left:0.375rem}.badge--size-s .badge__icon>swirl-icon,.badge--size-s .badge__icon>*::part(icon){width:1rem;height:1rem}.badge--size-m{min-width:1.5rem;height:1.5rem}.badge--size-m .badge__label{padding-right:0.4375rem;padding-left:0.4375rem}.badge--has-icon{padding-right:0;padding-left:0}.badge--intent-critical{color:var(--s-text-on-status);background-color:var(--s-surface-critical-default)}.badge--intent-banana{color:var(--s-text-dark);background-color:var(--s-decorative-banana-surface)}.badge--intent-blueberry{color:var(--s-text-on-status);background-color:var(--s-decorative-blueberry-surface)}.badge--intent-chilli{color:var(--s-text-on-status);background-color:var(--s-decorative-chilli-surface)}.badge--intent-grape{color:var(--s-text-on-status);background-color:var(--s-decorative-grape-surface)}.badge--intent-kiwi{color:var(--s-text-on-status);background-color:var(--s-decorative-kiwi-surface)}.badge--intent-neutral{color:var(--s-text-default);background-color:var(--s-surface-neutral-subdued)}.badge--intent-pumpkin{color:var(--s-text-dark);background-color:var(--s-decorative-pumpkin-surface)}.badge--intent-radish{color:var(--s-text-on-status);background-color:var(--s-decorative-radish-surface)}.badge--variant-dot{width:1.5rem;min-width:0;height:1.5rem}.badge--variant-dot.badge--size-xs{width:0.5rem;height:0.5rem}.badge--variant-dot.badge--size-s{width:0.75rem;height:0.75rem}.badge--variant-dot.badge--size-m{width:1rem;height:1rem}.badge--variant-dot .badge__label{padding-right:0;padding-left:0}.badge--variant-dot .badge__icon{display:none}.badge__icon{display:inline-flex}.badge__icon>swirl-icon,.badge__icon>*::part(icon){width:1rem;height:1rem}.badge__label{display:inline-flex;overflow:hidden;max-width:100%;white-space:nowrap;text-overflow:ellipsis}", n = d, o = class {
   constructor(a) {
     i(this, a), this.icon = void 0, this.intent = "critical", this.label = void 0, this.size = "m", this.variant = "default";
   }
@@ -10,10 +10,10 @@ const n = ":host{display:inline-flex;min-width:0;max-width:100%;justify-content:
     const a = s("badge", `badge--intent-${this.intent}`, `badge--size-${this.size}`, `badge--variant-${this.variant}`, {
       "badge--has-icon": this.icon
     });
-    return e(r, { role: "status" }, e("span", { class: a, part: "badge" }, this.icon && e("span", { class: "badge__icon", innerHTML: this.icon }), this.icon === void 0 && this.variant !== "dot" ? e("span", { class: "badge__label" }, this.label) : e(t, null, this.icon === void 0 && e("span", { class: "badge__label" }, "\xA0"), e("swirl-visually-hidden", null, this.label))));
+    return e(r, { key: "2a45ce5f53ccce7f5f9adfbb89b0ccb2eeb8f32b", role: "status" }, e("span", { key: "0867e1cb3bcb784ac62b398b507b0fdde199980a", class: a, part: "badge" }, this.icon && e("span", { key: "4925c5a12325a6b138efc8111bf4a84291ad808d", class: "badge__icon", innerHTML: this.icon }), this.icon === void 0 && this.variant !== "dot" ? e("span", { class: "badge__label" }, this.label) : e(t, null, this.icon === void 0 && e("span", { class: "badge__label" }, "\xA0"), e("swirl-visually-hidden", null, this.label))));
   }
 };
-d.style = n;
+o.style = n;
 export {
-  d as swirl_badge
+  o as swirl_badge
 };

package/dist/{swirl-banner.entry.3b6f8acb.js → swirl-banner.entry.98bc99ca.js}

@@ -1,17 +1,17 @@
-import { r as o, c as r, h as t, H as c, g as l } from "./index.a5290183.js";
-import { c as d } from "./index-d280dafb.186cdb0e.js";
-import { g as h } from "./utils-c5f2f98f.af14538a.js";
+import { r as o, c as r, h as t, H as c, g as d } from "./index.9d32bf5e.js";
+import { c as b } from "./index-267776a4.6beb4f4b.js";
+import { g as l } from "./utils-aab10c80.240adddc.js";
 import "react";
 import "react-dom";
-const b = ":host{display:block}:host *{box-sizing:border-box}.banner{display:flex;align-items:flex-start;gap:var(--s-space-16);max-width:100%;min-height:3.5rem;padding:var(--s-space-16)}.banner:focus:not(:focus-visible){outline:none}.banner:focus-visible{outline-color:var(--s-focus-default);outline-offset:var(--s-space-4)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.banner{padding:var(--s-space-16);min-height:3.25rem}}.banner--size-s{padding:var(--s-space-8);justify-content:center}.banner--size-s .banner__content{flex-grow:0;text-align:center}.banner--size-s .banner__controls{margin-left:0}.banner--intent-default .banner__icon,.banner--intent-default .banner__content,.banner--intent-default .banner__action-button,.banner--intent-default .banner__dismiss-button,.banner--intent-critical .banner__icon,.banner--intent-critical .banner__content,.banner--intent-critical .banner__action-button,.banner--intent-critical .banner__dismiss-button,.banner--intent-success .banner__icon,.banner--intent-success .banner__content,.banner--intent-success .banner__action-button,.banner--intent-success .banner__dismiss-button,.banner--intent-info .banner__icon,.banner--intent-info .banner__content,.banner--intent-info .banner__action-button,.banner--intent-info .banner__dismiss-button{color:var(--s-text-on-status)}.banner--intent-default{background-color:var(--s-surface-neutral-default)}.banner--intent-critical{background-color:var(--s-surface-critical-default)}.banner--intent-success{background-color:var(--s-surface-success-default)}.banner--intent-info{background-color:var(--s-surface-info-default)}.banner--intent-warning{background-color:var(--s-surface-warning-default)}.banner--intent-warning .banner__icon{color:var(--s-icon-strong)}.banner--intent-warning .banner__content,.banner--intent-warning .banner__action-button,.banner--intent-warning .banner__dismiss-button{color:var(--s-text-default)}.banner__content{display:flex;align-items:flex-start;min-height:1.5rem;flex-grow:1;line-height:var(--s-line-height-base)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.banner__content{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);min-height:1.25rem}}.banner__icon{display:none;width:1.5rem;height:1.5rem;margin-right:var(--s-space-8);flex-shrink:0;color:var(--s-icon-on-status)}@media (min-width: 375px){.banner__icon{display:inline-flex}}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.banner__icon{width:1.25rem;height:1.25rem}}.banner__text{min-height:1.5rem}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.banner__text{min-height:1.25rem}}.banner__controls{display:inline-flex;flex-shrink:0;align-items:flex-start;line-height:var(--s-line-height-base);gap:var(--s-space-16)}@media (min-width: 768px){.banner__controls{gap:var(--s-space-24)}}.banner__action-button,.banner__dismiss-button{display:inline-flex;overflow:hidden;max-width:7rem;height:1.5rem;padding:0;flex-shrink:0;align-items:center;border:none;background-color:transparent;font:inherit;font-weight:var(--s-font-weight-semibold);white-space:nowrap;text-overflow:ellipsis;cursor:pointer}.banner__action-button:focus,.banner__dismiss-button:focus{outline-color:var(--s-focus-default)}@media (min-width: 768px){.banner__action-button,.banner__dismiss-button{max-width:12rem}}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.banner__action-button,.banner__dismiss-button{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);height:1.25rem}}", m = {
+const h = ":host{display:block}:host *{box-sizing:border-box}.banner{display:flex;align-items:flex-start;gap:var(--s-space-16);max-width:100%;min-height:3.5rem;padding:var(--s-space-16)}.banner:focus:not(:focus-visible){outline:none}.banner:focus-visible{outline-color:var(--s-focus-default);outline-offset:var(--s-space-4)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.banner{padding:var(--s-space-16);min-height:3.25rem}}.banner--size-s{padding:var(--s-space-8);justify-content:center}.banner--size-s .banner__content{flex-grow:0;text-align:center}.banner--size-s .banner__controls{margin-left:0}.banner--intent-default .banner__icon,.banner--intent-default .banner__content,.banner--intent-default .banner__action-button,.banner--intent-default .banner__dismiss-button,.banner--intent-critical .banner__icon,.banner--intent-critical .banner__content,.banner--intent-critical .banner__action-button,.banner--intent-critical .banner__dismiss-button,.banner--intent-success .banner__icon,.banner--intent-success .banner__content,.banner--intent-success .banner__action-button,.banner--intent-success .banner__dismiss-button,.banner--intent-info .banner__icon,.banner--intent-info .banner__content,.banner--intent-info .banner__action-button,.banner--intent-info .banner__dismiss-button{color:var(--s-text-on-status)}.banner--intent-default{background-color:var(--s-surface-neutral-default)}.banner--intent-critical{background-color:var(--s-surface-critical-default)}.banner--intent-success{background-color:var(--s-surface-success-default)}.banner--intent-info{background-color:var(--s-surface-info-default)}.banner--intent-warning{background-color:var(--s-surface-warning-default)}.banner--intent-warning .banner__icon{color:var(--s-icon-strong)}.banner--intent-warning .banner__content,.banner--intent-warning .banner__action-button,.banner--intent-warning .banner__dismiss-button{color:var(--s-text-default)}.banner__content{display:flex;align-items:flex-start;min-height:1.5rem;flex-grow:1;line-height:var(--s-line-height-base)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.banner__content{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);min-height:1.25rem}}.banner__icon{display:none;width:1.5rem;height:1.5rem;margin-right:var(--s-space-8);flex-shrink:0;color:var(--s-icon-on-status)}@media (min-width: 375px){.banner__icon{display:inline-flex}}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.banner__icon{width:1.25rem;height:1.25rem}}.banner__text{min-height:1.5rem}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.banner__text{min-height:1.25rem}}.banner__controls{display:inline-flex;flex-shrink:0;align-items:flex-start;line-height:var(--s-line-height-base);gap:var(--s-space-16)}@media (min-width: 768px){.banner__controls{gap:var(--s-space-24)}}.banner__action-button,.banner__dismiss-button{display:inline-flex;overflow:hidden;max-width:7rem;height:1.5rem;padding:0;flex-shrink:0;align-items:center;border:none;background-color:transparent;font:inherit;font-weight:var(--s-font-weight-semibold);white-space:nowrap;text-overflow:ellipsis;cursor:pointer}.banner__action-button:focus,.banner__dismiss-button:focus{outline-color:var(--s-focus-default)}@media (min-width: 768px){.banner__action-button,.banner__dismiss-button{max-width:12rem}}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.banner__action-button,.banner__dismiss-button{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);height:1.25rem}}", m = h, f = {
   default: void 0,
   critical: "<swirl-icon-error></swirl-icon-error>",
   success: "<swirl-icon-check-circle></swirl-icon-check-circle>",
   warning: "<swirl-icon-warning></swirl-icon-warning>",
   info: "<swirl-icon-info></swirl-icon-info>"
-}, u = class {
+}, _ = class {
   constructor(e) {
-    o(this, e), this.action = r(this, "action", 7), this.dismiss = r(this, "dismiss", 7), this.desktopMediaQuery = h(), this.desktopMediaQueryHandler = (n) => {
+    o(this, e), this.action = r(this, "action", 7), this.dismiss = r(this, "dismiss", 7), this.desktopMediaQuery = l(), this.desktopMediaQueryHandler = (n) => {
       this.forceIconProps(n.matches);
     }, this.onAction = (n) => {
       this.action.emit(n);
@@ -27,24 +27,24 @@ const b = ":host{display:block}:host *{box-sizing:border-box}.banner{display:fle
     (n = (e = this.desktopMediaQuery).removeEventListener) == null || n.call(e, "change", this.desktopMediaQueryHandler);
   }
   forceIconProps(e) {
-    var a, s;
-    const n = (a = this.iconEl) == null ? void 0 : a.children[0], i = (s = this.dismissButtonEl) == null ? void 0 : s.children[0];
+    var s, a;
+    const n = (s = this.iconEl) == null ? void 0 : s.children[0], i = (a = this.dismissButtonEl) == null ? void 0 : a.children[0];
     n == null || n.setAttribute("size", e ? "20" : "24"), i == null || i.setAttribute("size", e ? "20" : "24");
   }
   determineIcon() {
-    return this.icon ? this.icon : m[this.intent];
+    return this.icon ? this.icon : f[this.intent];
   }
   render() {
-    const e = this.determineIcon(), n = Boolean(this.actionLabel) || this.dismissable, i = this.icon || this.showIcon && Boolean(e), a = d("banner", `banner--intent-${this.intent}`, `banner--size-${this.size}`, {
+    const e = this.determineIcon(), n = Boolean(this.actionLabel) || this.dismissable, i = this.icon || this.showIcon && Boolean(e), s = b("banner", `banner--intent-${this.intent}`, `banner--size-${this.size}`, {
       "banner--has-icon": i
     });
-    return t(c, null, t("div", { "aria-describedby": "content", class: a, role: this.importance, tabIndex: 0 }, t("div", { class: "banner__content", id: "content", part: "banner__content" }, i && t("span", { "aria-hidden": "true", class: "banner__icon", innerHTML: e, ref: (s) => this.iconEl = s }), t("span", { class: "banner__text" }, this.content)), n && t("div", { class: "banner__controls" }, this.actionLabel && t("button", { class: "banner__action-button", onClick: this.onAction, part: "banner__action-button", type: "button" }, this.actionLabel), this.dismissable && t("button", { "aria-label": this.dismissLabel, class: "banner__dismiss-button", onClick: this.onDismiss, part: "banner__dismiss-button", ref: (s) => this.dismissButtonEl = s, type: "button" }, t("swirl-icon-close", null)))));
+    return t(c, { key: "907969cc89868087c70da427ad854e339fb36b5b" }, t("div", { key: "a59f652cc95d0bc1d54a2386776f66d8f9024631", "aria-describedby": "content", class: s, role: this.importance, tabIndex: 0 }, t("div", { key: "e5ff90cda82b6391958b5a2abb5d41bbeefc84dd", class: "banner__content", id: "content", part: "banner__content" }, i && t("span", { key: "fc2645f499ff1722a87d66ec5ffcf8df6699583d", "aria-hidden": "true", class: "banner__icon", innerHTML: e, ref: (a) => this.iconEl = a }), t("span", { key: "dafd92c3180fa570063d9daa5eccea6ec95a33d0", class: "banner__text" }, this.content)), n && t("div", { key: "027794d1f08c9724c83fdfc492f00a2292c4d32c", class: "banner__controls" }, this.actionLabel && t("button", { key: "bea6ee6c86124ea90a7a031b3e27c2fd2aa3209c", class: "banner__action-button", onClick: this.onAction, part: "banner__action-button", type: "button" }, this.actionLabel), this.dismissable && t("button", { key: "b9450a6f407698029b4ad6c9596f6a70266c824f", "aria-label": this.dismissLabel, class: "banner__dismiss-button", onClick: this.onDismiss, part: "banner__dismiss-button", ref: (a) => this.dismissButtonEl = a, type: "button" }, t("swirl-icon-close", { key: "e8c3bd11a64f88886a8849e05eaa14e3d01ca79d" })))));
   }
   get element() {
-    return l(this);
+    return d(this);
   }
 };
-u.style = b;
+_.style = m;
 export {
-  u as swirl_banner
+  _ as swirl_banner
 };

package/dist/{swirl-box.entry.6a7d4dd7.js → swirl-box.entry.89cbee8e.js}

@@ -1,12 +1,12 @@
-import { r as t, h as i, H as n } from "./index.a5290183.js";
-import { c as s } from "./index-d280dafb.186cdb0e.js";
+import { r as t, h as d, H as n } from "./index.9d32bf5e.js";
+import { c as s } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";
 const r = `:host{display:block;width:100%}:host(.box--bordered){border:var(--s-border-width-default) solid var(--s-border-default)}:host(.box--bordered-block-end){border-block-end:var(--s-border-width-default) solid
       var(--s-border-default)}:host(.box--bordered-block-start){border-block-start:var(--s-border-width-default) solid
       var(--s-border-default)}:host(.box--bordered-inline-end){border-inline-end:var(--s-border-width-default) solid
       var(--s-border-default)}:host(.box--bordered-inline-start){border-inline-start:var(--s-border-width-default) solid
-      var(--s-border-default)}:host(.box--cover){width:100%;height:100%}:host *{box-sizing:border-box}`, o = class {
+      var(--s-border-default)}:host(.box--cover){width:100%;height:100%}:host *{box-sizing:border-box}`, o = r, h = class {
   constructor(e) {
     t(this, e), this.bordered = void 0, this.borderedBlockEnd = void 0, this.borderedBlockStart = void 0, this.borderedInlineEnd = void 0, this.borderedInlineStart = void 0, this.bottom = void 0, this.centerBlock = void 0, this.centerInline = void 0, this.cover = void 0, this.height = void 0, this.left = void 0, this.maxHeight = void 0, this.minHeight = void 0, this.maxWidth = void 0, this.minWidth = void 0, this.overflow = "visible", this.padding = "0", this.paddingBlockEnd = void 0, this.paddingBlockStart = void 0, this.paddingInlineEnd = void 0, this.paddingInlineStart = void 0, this.position = void 0, this.right = void 0, this.basis = void 0, this.shrink = void 0, this.grow = void 0, this.top = void 0, this.width = void 0, this.zIndex = void 0;
   }
@@ -36,7 +36,7 @@ const r = `:host{display:block;width:100%}:host(.box--bordered){border:var(--s-b
       top: this.top,
       width: this.cover ? "100%" : this.width,
       zIndex: this.zIndex
-    }, d = s("box", {
+    }, i = s("box", {
       "box--bordered": this.bordered,
       "box--bordered-block-end": this.borderedBlockEnd,
       "box--bordered-block-start": this.borderedBlockStart,
@@ -44,10 +44,10 @@ const r = `:host{display:block;width:100%}:host(.box--bordered){border:var(--s-b
       "box--bordered-inline-start": this.borderedInlineStart,
       "box--cover": this.cover
     });
-    return i(n, { class: d, style: e }, i("slot", null));
+    return d(n, { key: "5036d24e9dabdf3d88144d74dc39ee57f8352062", class: i, style: e }, d("slot", { key: "3d329ed23fdb6e82854c03894410c27f9de6f668" }));
   }
 };
-o.style = r;
+h.style = o;
 export {
-  o as swirl_box
+  h as swirl_box
 };

package/dist/{swirl-button-group.entry.1a980301.js → swirl-button-group.entry.a6db0795.js}

@@ -1,19 +1,19 @@
-import { r as s, h as r, H as i } from "./index.a5290183.js";
-import { c as e } from "./index-d280dafb.186cdb0e.js";
+import { r as s, h as r, H as e } from "./index.9d32bf5e.js";
+import { c as i } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";
-const n = ':host{display:block}:host *{box-sizing:border-box}.button-group--segmented ::slotted(*:not(:last-child)){position:relative}.button-group--segmented ::slotted(*:not(:last-child)):after{position:absolute;z-index:1;top:50%;left:100%;width:var(--s-border-width-default);height:calc(100% - var(--s-space-16));background-color:var(--s-border-strong);content:"";transform:translate3d(-50%, -50%, 0);pointer-events:none}.button-group--segmented ::slotted(*:not(:last-child):not([disabled])[intent="primary"]):after{background-color:var(--s-text-on-action-primary)}.button-group--segmented ::slotted(*:not(:last-child)[disabled="false"][intent="primary"]):after{background-color:var(--s-text-on-action-primary)}.button-group--segmented ::slotted(*:not(:first-child):not(:last-child)){--swirl-button-border-top-right-radius:0;--swirl-button-border-top-left-radius:0;--swirl-button-border-bottom-right-radius:0;--swirl-button-border-bottom-left-radius:0;--swirl-icon-button-border-top-right-radius:0;--swirl-icon-button-border-top-left-radius:0;--swirl-icon-button-border-bottom-right-radius:0;--swirl-icon-button-border-bottom-left-radius:0}.button-group--segmented ::slotted(*:first-child){--swirl-button-border-top-right-radius:0;--swirl-button-border-bottom-right-radius:0;--swirl-icon-button-border-top-right-radius:0;--swirl-icon-button-border-bottom-right-radius:0;--swirl-icon-button-border-top-left-radius:var(--s-border-radius-base);--swirl-icon-button-border-bottom-left-radius:var(--s-border-radius-base)}.button-group--segmented ::slotted(*:last-child){--swirl-button-border-top-left-radius:0;--swirl-button-border-bottom-left-radius:0;--swirl-icon-button-border-top-right-radius:var(--s-border-radius-base);--swirl-icon-button-border-bottom-right-radius:var(--s-border-radius-base);--swirl-icon-button-border-top-left-radius:0;--swirl-icon-button-border-bottom-left-radius:0}', d = class {
+const n = ':host{display:block}:host *{box-sizing:border-box}.button-group--segmented ::slotted(*:not(:last-child)){position:relative}.button-group--segmented ::slotted(*:not(:last-child)):after{position:absolute;z-index:1;top:50%;left:100%;width:var(--s-border-width-default);height:calc(100% - var(--s-space-16));background-color:var(--s-border-strong);content:"";transform:translate3d(-50%, -50%, 0);pointer-events:none}.button-group--segmented ::slotted(*:not(:last-child):not([disabled])[intent="primary"]):after{background-color:var(--s-text-on-action-primary)}.button-group--segmented ::slotted(*:not(:last-child)[disabled="false"][intent="primary"]):after{background-color:var(--s-text-on-action-primary)}.button-group--segmented ::slotted(*:not(:first-child):not(:last-child)){--swirl-button-border-top-right-radius:0;--swirl-button-border-top-left-radius:0;--swirl-button-border-bottom-right-radius:0;--swirl-button-border-bottom-left-radius:0;--swirl-icon-button-border-top-right-radius:0;--swirl-icon-button-border-top-left-radius:0;--swirl-icon-button-border-bottom-right-radius:0;--swirl-icon-button-border-bottom-left-radius:0}.button-group--segmented ::slotted(*:first-child){--swirl-button-border-top-right-radius:0;--swirl-button-border-bottom-right-radius:0;--swirl-icon-button-border-top-right-radius:0;--swirl-icon-button-border-bottom-right-radius:0;--swirl-icon-button-border-top-left-radius:var(--s-border-radius-base);--swirl-icon-button-border-bottom-left-radius:var(--s-border-radius-base)}.button-group--segmented ::slotted(*:last-child){--swirl-button-border-top-left-radius:0;--swirl-button-border-bottom-left-radius:0;--swirl-icon-button-border-top-right-radius:var(--s-border-radius-base);--swirl-icon-button-border-bottom-right-radius:var(--s-border-radius-base);--swirl-icon-button-border-top-left-radius:0;--swirl-icon-button-border-bottom-left-radius:0}', a = n, d = class {
   constructor(t) {
     s(this, t), this.orientation = "horizontal", this.segmented = void 0, this.stretch = void 0, this.wrap = void 0;
   }
   render() {
-    const t = this.segmented ? "0" : "8", o = e("button-group", {
+    const t = this.segmented ? "0" : "8", o = i("button-group", {
       "button-group--segmented": this.segmented
     });
-    return r(i, null, r("swirl-stack", { align: this.orientation === "vertical" && this.stretch ? "stretch" : "start", class: o, justify: this.orientation === "horizontal" && this.stretch ? "stretch" : "start", orientation: this.orientation, role: "group", spacing: t, wrap: this.wrap }, r("slot", null)));
+    return r(e, { key: "681f8a5713e3df77d224a8a67f8d0faf9324a8b5" }, r("swirl-stack", { key: "23f4129e4aae721d7253864faad544e3e4a4f41e", align: this.orientation === "vertical" && this.stretch ? "stretch" : "start", class: o, justify: this.orientation === "horizontal" && this.stretch ? "stretch" : "start", orientation: this.orientation, role: "group", spacing: t, wrap: this.wrap }, r("slot", { key: "95ed9769652cb763410f69cc181291cbc79ab677" })));
   }
 };
-d.style = n;
+d.style = a;
 export {
   d as swirl_button_group
 };

package/dist/{swirl-button.entry.57ce96b2.js → swirl-button.entry.ac49771a.js}

@@ -1,6 +1,6 @@
-import { r as l, h as n, H as u, g as b } from "./index.a5290183.js";
-import { c } from "./index-d280dafb.186cdb0e.js";
-import { g as d } from "./utils-c5f2f98f.af14538a.js";
+import { r as l, h as n, H as u, g as b } from "./index.9d32bf5e.js";
+import { c } from "./index-267776a4.6beb4f4b.js";
+import { g as d } from "./utils-aab10c80.240adddc.js";
 import "react";
 import "react-dom";
 const v = `.sc-swirl-button-h{display:inline-block;max-width:100%;flex-shrink:0}.sc-swirl-button-h *.sc-swirl-button{box-sizing:border-box}.button.sc-swirl-button{display:inline-flex;width:100%;padding:var(--s-space-8) var(--s-space-16);justify-content:center;align-items:center;border:none;border-top-left-radius:var(--swirl-button-border-top-left-radius);border-top-right-radius:var(--swirl-button-border-top-right-radius);border-bottom-right-radius:var(--swirl-button-border-bottom-right-radius);border-bottom-left-radius:var(--swirl-button-border-bottom-left-radius);color:var(--s-text-subdued);background-color:var(--swirl-ghost-button-background-default);font:inherit;font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-lg);text-decoration:none;cursor:pointer;gap:var(--s-space-8)}.button.sc-swirl-button:hover{background-color:var(--swirl-ghost-button-background-hovered)}.button.sc-swirl-button:active{background-color:var(--swirl-ghost-button-background-pressed)}.button.sc-swirl-button:disabled{color:var(--s-text-disabled);background-color:var(--swirl-ghost-button-background-disabled);cursor:default}.button.sc-swirl-button:disabled .button__icon.sc-swirl-button{color:var(--s-icon-disabled)}.button.sc-swirl-button:focus:not(:focus-visible){outline:none}.button.sc-swirl-button:focus-visible{outline-color:var(--s-focus-default);outline-offset:var(--s-space-2)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.button.sc-swirl-button{padding:var(--s-space-8) var(--s-space-12);font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);gap:var(--s-space-4)}}.button--text-align-start.sc-swirl-button{justify-content:flex-start}.button--text-align-center.sc-swirl-button{justify-content:center}.button--text-align-end.sc-swirl-button{justify-content:flex-end}.button--variant-ghost.button--intent-strong.sc-swirl-button:not(:disabled){color:var(--s-text-default)}.button--variant-ghost.button--intent-strong.sc-swirl-button:not(:disabled) .button__icon.sc-swirl-button{color:var(--s-icon-strong)}.button--variant-ghost.button--intent-primary.sc-swirl-button:not(:disabled){color:var(--s-text-highlight)}.button--variant-ghost.button--intent-primary.sc-swirl-button:not(:disabled) .button__icon.sc-swirl-button{color:var(--s-icon-highlight)}.button--variant-ghost.button--intent-critical.sc-swirl-button:not(:disabled){color:var(--s-text-critical)}.button--variant-ghost.button--intent-critical.sc-swirl-button:not(:disabled) .button__icon.sc-swirl-button{color:var(--s-icon-critical)}.button--variant-ghost.button--pressed.sc-swirl-button{color:var(--s-text-highlight)}.button--variant-ghost.button--pressed.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-highlight)}.button--variant-ghost.button--size-l.sc-swirl-button{padding:var(--s-space-12) var(--s-space-20)}.button--variant-ghost.button--size-l.button--icon-only.sc-swirl-button{padding:var(--s-space-12)}.button--variant-flat.sc-swirl-button{color:var(--s-text-default);background-color:var(--swirl-flat-button-background-default)}.button--variant-flat.sc-swirl-button:hover{background-color:var(--swirl-flat-button-background-hovered)}.button--variant-flat.sc-swirl-button:active{background-color:var(--swirl-flat-button-background-pressed)}.button--variant-flat.sc-swirl-button:disabled{background-color:var(--swirl-flat-button-background-disabled)}.button--variant-flat.button--intent-primary.sc-swirl-button:not(:disabled){color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.button--variant-flat.button--intent-primary.sc-swirl-button:not(:disabled):hover{background-color:var(--s-action-primary-hovered)}.button--variant-flat.button--intent-primary.sc-swirl-button:not(:disabled):active{background-color:var(--s-action-primary-pressed)}.button--variant-flat.button--intent-primary.sc-swirl-button:not(:disabled) .button__icon.sc-swirl-button{color:var(--s-icon-on-action-primary)}.button--variant-flat.button--intent-critical.sc-swirl-button:not(:disabled){color:var(--s-text-on-status);background-color:var(--s-action-critical-default)}.button--variant-flat.button--intent-critical.sc-swirl-button:not(:disabled):hover{background-color:var(--s-action-critical-hovered)}.button--variant-flat.button--intent-critical.sc-swirl-button:not(:disabled):active{background-color:var(--s-action-critical-pressed)}.button--variant-flat.button--intent-critical.sc-swirl-button:not(:disabled) .button__icon.sc-swirl-button{color:var(--s-icon-on-status)}.button--variant-flat.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-strong)}.button--variant-outline.sc-swirl-button{color:var(--s-text-default);box-shadow:inset 0 0 0 var(--s-border-width-default) var(--s-border-strong)}.button--variant-outline.sc-swirl-button:disabled{box-shadow:inset 0 0 0 var(--s-border-width-default)
@@ -10,7 +10,7 @@ const v = `.sc-swirl-button-h{display:inline-block;max-width:100%;flex-shrink:0}
       --swirl-icon-button-border-bottom-right-radius
     );border-bottom-left-radius:var(
       --swirl-icon-button-border-bottom-left-radius
-    )}.button--icon-only.sc-swirl-button .button__icon.sc-swirl-button{margin-right:0;margin-left:0}.button--has-icon.sc-swirl-button .button__icon.sc-swirl-button{display:inline-flex}.button__icon.sc-swirl-button{display:none;width:1.5rem;height:1.5rem;margin-left:calc(-1 * var(--s-space-4));color:var(--s-icon-default);order:0}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.button__icon.sc-swirl-button{width:1.25rem;height:1.25rem}}.button__label.sc-swirl-button{overflow:hidden;max-width:100%;white-space:nowrap;text-overflow:ellipsis;order:1}`, h = class {
+    )}.button--icon-only.sc-swirl-button .button__icon.sc-swirl-button{margin-right:0;margin-left:0}.button--has-icon.sc-swirl-button .button__icon.sc-swirl-button{display:inline-flex}.button__icon.sc-swirl-button{display:none;width:1.5rem;height:1.5rem;margin-left:calc(-1 * var(--s-space-4));color:var(--s-icon-default);order:0}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.button__icon.sc-swirl-button{width:1.25rem;height:1.25rem}}.button__label.sc-swirl-button{overflow:hidden;max-width:100%;white-space:nowrap;text-overflow:ellipsis;order:1}`, h = v, p = class {
   constructor(o) {
     l(this, o), this.desktopMediaQuery = d(), this.desktopMediaQueryHandler = (t) => {
       this.forceIconProps(t.matches);
@@ -49,13 +49,13 @@ const v = `.sc-swirl-button-h{display:inline-block;max-width:100%;flex-shrink:0}
       "button--pill": this.pill,
       "button--pressed": this.pressed
     }), e = t ? "a" : "button";
-    return n(u, { style: { pointerEvents: this.disabled ? "none" : "" } }, n(e, { "aria-controls": this.swirlAriaControls, "aria-current": this.swirlAriaCurrent, "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled && !t ? "true" : void 0, "aria-expanded": this.swirlAriaExpanded, "aria-haspopup": this.swirlAriaHaspopup, "aria-label": r, "aria-pressed": this.pressed ? "true" : void 0, class: s, disabled: t ? void 0 : this.disabled, download: t ? void 0 : this.download, form: t ? void 0 : this.form, href: this.href, name: t ? void 0 : this.name, ref: (i) => this.buttonEl = i, target: t ? this.target : void 0, type: t ? void 0 : this.type, value: t ? void 0 : this.value }, Boolean(this.icon) && n("span", { class: "button__icon", innerHTML: this.icon, ref: (i) => this.iconEl = i }), !Boolean(this.icon) && n("span", { class: "button__icon", ref: (i) => this.iconEl = i }, n("slot", { name: "icon" })), !o && n("span", { class: "button__label" }, this.label)));
+    return n(u, { key: "ae93bfc51d8a1a45e982a1a64ea26953a4ac3315", style: { pointerEvents: this.disabled ? "none" : "" } }, n(e, { key: "aab4311c3b7031e209546880fb5d86dd5d2cbfda", "aria-controls": this.swirlAriaControls, "aria-current": this.swirlAriaCurrent, "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled && !t ? "true" : void 0, "aria-expanded": this.swirlAriaExpanded, "aria-haspopup": this.swirlAriaHaspopup, "aria-label": r, "aria-pressed": this.pressed ? "true" : void 0, class: s, disabled: t ? void 0 : this.disabled, download: t ? void 0 : this.download, form: t ? void 0 : this.form, href: this.href, name: t ? void 0 : this.name, ref: (i) => this.buttonEl = i, target: t ? this.target : void 0, type: t ? void 0 : this.type, value: t ? void 0 : this.value }, Boolean(this.icon) && n("span", { key: "d3d0797df3044b4c9044a77978531b89dd5109c5", class: "button__icon", innerHTML: this.icon, ref: (i) => this.iconEl = i }), !Boolean(this.icon) && n("span", { key: "ced043185f9922cd7ea93e95b1a5dbbb857be804", class: "button__icon", ref: (i) => this.iconEl = i }, n("slot", { key: "d062178e7e317848025c0ff6391a9eb0641280ab", name: "icon" })), !o && n("span", { key: "c6b641ef7ad985a2f0aeeea05fdc8818155e43a4", class: "button__label" }, this.label)));
   }
   get el() {
     return b(this);
   }
 };
-h.style = v;
+p.style = h;
 export {
-  h as swirl_button
+  p as swirl_button
 };

package/dist/{swirl-card.entry.a7ff44c0.js → swirl-card.entry.2f2c085f.js}

@@ -1,5 +1,5 @@
-import { r as t, h as e, H as n, g as o } from "./index.a5290183.js";
-import { c } from "./index-d280dafb.186cdb0e.js";
+import { r as t, h as e, H as n, g as o } from "./index.9d32bf5e.js";
+import { c } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";
 const l = `:host{display:contents}:host *{box-sizing:border-box}.card{--swirl-ghost-button-background-default:var(--s-surface-default);--swirl-ghost-button-background-hovered:var(--s-surface-hovered);--swirl-ghost-button-background-pressed:var(--s-surface-pressed);--swirl-resource-list-item-background-default:var(--s-surface-default);--swirl-resource-list-item-background-hovered:var(--s-surface-hovered);--swirl-resource-list-item-background-pressed:var(--s-surface-pressed);display:flex;overflow:hidden;width:100%;margin:0;padding:0;border:var(--s-border-width-default) solid var(--s-border-default);border-radius:var(--s-border-radius-base);color:var(--s-text-default);background-color:var(--swirl-card-background-default);font:inherit;text-decoration:none;flex-direction:column;transition:background-color 0.2s}a.card,button.card,.card--interactive{cursor:pointer}a.card:hover,button.card:hover,.card--interactive:hover{background-color:var(--swirl-card-background-hovered)}a.card:active,button.card:active,.card--interactive:active{background-color:var(--swirl-card-background-pressed)}a.card:focus:not(:focus-visible),button.card:focus:not(:focus-visible),.card--interactive:focus:not(:focus-visible){outline:none}a.card:focus-visible,button.card:focus-visible,.card--interactive:focus-visible{outline-color:var(--s-focus-default);outline-offset:var(--s-space-4)}.card--is--borderless{border:0}.card--elevated.card--elevation-level-1{box-shadow:var(--s-shadow-level-1)}.card--elevated.card--elevation-level-2{box-shadow:var(--s-shadow-level-2)}.card--elevated.card--elevation-level-3{box-shadow:var(--s-shadow-level-3)}.card--flashing{background-color:var(--swirl-card-background-pressed)}.card--flashing.card--intent-default-subdued{background-color:var(--s-surface-raised-pressed)}.card--flashing.card--intent-highlight{background-color:var(--s-surface-highlight-pressed)}.card--highlighted{border-width:0.1875rem;border-color:var(--s-border-highlight)}.card--justify-content-start .card__body{justify-content:flex-start}.card--justify-content-center .card__body{justify-content:center}.card--justify-content-end .card__body{justify-content:flex-end}:not(.card--has-image) .card__image{overflow:hidden;height:0}.card--intent-critical-subdued{background-color:var(--s-surface-critical-subdued)}.card--intent-default-subdued{--swirl-resource-list-item-background-default:var(
@@ -8,42 +8,42 @@ const l = `:host{display:contents}:host *{box-sizing:border-box}.card{--swirl-gh
     --s-surface-raised-hovered
   );--swirl-resource-list-item-background-pressed:var(
     --s-surface-raised-pressed
-  );--swirl-ghost-button-background-default:var(--s-surface-raised-default);--swirl-ghost-button-background-hovered:var(--s-surface-raised-hovered);--swirl-ghost-button-background-pressed:var(--s-surface-raised-pressed);background-color:var(--s-surface-raised-default)}.card--intent-info-subdued{background-color:var(--s-surface-info-subdued)}.card--intent-success-subdued{background-color:var(--s-surface-success-subdued)}.card--intent-warning-subdued{background-color:var(--s-surface-warning-subdued)}.card--intent-highlight{color:var(--s-text-on-surface-highlight);background-color:var(--s-surface-highlight-default)}.content-section{padding:0 var(--s-space-16)}.card__image{overflow:hidden;min-height:0}.card__image ::slotted(img){display:inline-flex;width:100%;max-height:100%;-o-object-fit:cover;object-fit:cover}.card__body{display:flex;min-height:0;padding:var(--s-space-12) var(--s-space-16) var(--s-space-16);flex-grow:1;flex-direction:column;gap:var(--s-space-16)}`, u = ["xs", "sm", "base", "l", "xl"], h = class {
-  constructor(r) {
-    t(this, r), this.as = "div", this.borderRadius = "base", this.customBackgroundColor = void 0, this.elevated = void 0, this.elevationLevel = 3, this.height = void 0, this.highlighted = void 0, this.href = void 0, this.imageAspectRatio = void 0, this.intent = "default", this.isBorderless = void 0, this.interactive = void 0, this.justifyContent = "start", this.linkTarget = void 0, this.overflow = void 0, this.padding = void 0, this.paddingBlockEnd = void 0, this.paddingBlockStart = void 0, this.paddingInlineEnd = void 0, this.paddingInlineStart = void 0, this.swirlAriaLabel = void 0, this.swirlAriaLabelledby = void 0, this.flashing = !1;
+  );--swirl-ghost-button-background-default:var(--s-surface-raised-default);--swirl-ghost-button-background-hovered:var(--s-surface-raised-hovered);--swirl-ghost-button-background-pressed:var(--s-surface-raised-pressed);background-color:var(--s-surface-raised-default)}.card--intent-info-subdued{background-color:var(--s-surface-info-subdued)}.card--intent-success-subdued{background-color:var(--s-surface-success-subdued)}.card--intent-warning-subdued{background-color:var(--s-surface-warning-subdued)}.card--intent-highlight{color:var(--s-text-on-surface-highlight);background-color:var(--s-surface-highlight-default)}.content-section{padding:0 var(--s-space-16)}.card__image{overflow:hidden;min-height:0}.card__image ::slotted(img){display:inline-flex;width:100%;max-height:100%;-o-object-fit:cover;object-fit:cover}.card__body{display:flex;min-height:0;padding:var(--s-space-12) var(--s-space-16) var(--s-space-16);flex-grow:1;flex-direction:column;gap:var(--s-space-16)}`, u = l, h = ["xs", "sm", "base", "l", "xl"], f = class {
+  constructor(a) {
+    t(this, a), this.as = "div", this.borderRadius = "base", this.customBackgroundColor = void 0, this.elevated = void 0, this.elevationLevel = 3, this.height = void 0, this.highlighted = void 0, this.href = void 0, this.imageAspectRatio = void 0, this.intent = "default", this.isBorderless = void 0, this.interactive = void 0, this.justifyContent = "start", this.linkTarget = void 0, this.overflow = void 0, this.padding = void 0, this.paddingBlockEnd = void 0, this.paddingBlockStart = void 0, this.paddingInlineEnd = void 0, this.paddingInlineStart = void 0, this.swirlAriaLabel = void 0, this.swirlAriaLabelledby = void 0, this.flashing = !1;
   }
-  async flash(r = 5e3) {
+  async flash(a = 5e3) {
     Boolean(this.flashingTimeout) && (clearTimeout(this.flashingTimeout), this.flashingTimeout = void 0), this.flashing = !0, this.flashingTimeout = setTimeout(() => {
       this.flashing = !1;
-    }, r);
+    }, a);
   }
   render() {
-    const r = Boolean(this.href) ? "a" : this.as, a = Boolean(this.el.querySelector('[slot="image"]')), s = {
-      borderRadius: u.includes(this.borderRadius) ? `var(--s-border-radius-${this.borderRadius})` : this.borderRadius,
+    const a = Boolean(this.href) ? "a" : this.as, r = Boolean(this.el.querySelector('[slot="image"]')), s = {
+      borderRadius: h.includes(this.borderRadius) ? `var(--s-border-radius-${this.borderRadius})` : this.borderRadius,
       height: this.height,
       overflow: this.overflow
-    }, i = {
+    }, d = {
       backgroundColor: this.customBackgroundColor,
       padding: Boolean(this.padding) ? `var(--s-space-${this.padding})` : void 0,
       paddingBlockEnd: Boolean(this.paddingBlockEnd) ? `var(--s-space-${this.paddingBlockEnd})` : void 0,
       paddingBlockStart: Boolean(this.paddingBlockStart) ? `var(--s-space-${this.paddingBlockStart})` : void 0,
       paddingInlineEnd: Boolean(this.paddingInlineEnd) ? `var(--s-space-${this.paddingInlineEnd})` : void 0,
       paddingInlineStart: Boolean(this.paddingInlineStart) ? `var(--s-space-${this.paddingInlineStart})` : void 0
-    }, d = c("card", `card--elevation-level-${this.elevationLevel}`, `card--intent-${this.intent}`, `card--justify-content-${this.justifyContent}`, {
+    }, i = c("card", `card--elevation-level-${this.elevationLevel}`, `card--intent-${this.intent}`, `card--justify-content-${this.justifyContent}`, {
       "card--elevated": this.elevated,
       "card--flashing": this.flashing,
-      "card--has-image": a,
+      "card--has-image": r,
       "card--highlighted": this.highlighted,
       "card--interactive": this.interactive || this.href,
       "card--is--borderless": this.isBorderless
     });
-    return e(n, { styles: { height: this.height } }, e(r, { "aria-label": this.swirlAriaLabel, "aria-labelledby": this.swirlAriaLabelledby, class: d, href: this.href, rel: Boolean(this.href) && this.linkTarget === "_blank" ? "noreferrer" : void 0, style: s, target: this.linkTarget }, e("div", { class: "card__image", style: { aspectRatio: this.imageAspectRatio } }, e("slot", { name: "image" })), e("div", { class: "card__body", style: i }, e("div", { class: "card__content" }, e("slot", { name: "content" })))));
+    return e(n, { key: "7e813203295a4404476560ceb2fd9be0f65baab1", styles: { height: this.height } }, e(a, { key: "0e5ff6445bd88fbd0f036381f2ba263d39bd4b6f", "aria-label": this.swirlAriaLabel, "aria-labelledby": this.swirlAriaLabelledby, class: i, href: this.href, rel: Boolean(this.href) && this.linkTarget === "_blank" ? "noreferrer" : void 0, style: s, target: this.linkTarget }, e("div", { key: "46dddf46a39268eb0880f818cf75ad5d9c3dfbe4", class: "card__image", style: { aspectRatio: this.imageAspectRatio } }, e("slot", { key: "387c7d9561b756c33723808d438a54ffe1132daf", name: "image" })), e("div", { key: "d3125429757d21b599e2ade0d1577cb20dcd0743", class: "card__body", style: d }, e("div", { key: "d83ae81a23eaf7156e82f11de409272f8d112b3e", class: "card__content" }, e("slot", { key: "2e56f7bca41409d568358c61763b0264cb966f5b", name: "content" })))));
   }
   get el() {
     return o(this);
   }
 };
-h.style = l;
+f.style = u;
 export {
-  h as swirl_card
+  f as swirl_card
 };

package/dist/swirl-carousel-slide.entry.ab4ebbd5.js

@@ -0,0 +1,19 @@
+import { r as i, h as e, H as t } from "./index.9d32bf5e.js";
+import { c as l } from "./index-267776a4.6beb4f4b.js";
+import "react";
+import "react-dom";
+const a = ":host{display:block;min-width:0}:host(.carousel-slide--has-min-height) ::slotted(*){height:100%}:host *{box-sizing:border-box}:host ::slotted(*){width:100%;min-height:100%}", o = a, r = class {
+  constructor(s) {
+    i(this, s), this.label = void 0, this.minHeight = void 0, this.width = "15.5rem";
+  }
+  render() {
+    const s = l("carousel-slide", {
+      "carousel-slide--has-min-height": Boolean(this.minHeight)
+    });
+    return e(t, { key: "249671e012edbca85aaf9e1a10dadfa153d7a64b", "aria-roledescription": "slide", "aria-label": this.label, class: s, role: "group", style: { flexBasis: this.width, minHeight: this.minHeight }, tabIndex: 0 }, e("slot", { key: "c45497793125e527ec05c42bc3ffa953279e934d" }));
+  }
+};
+r.style = o;
+export {
+  r as swirl_carousel_slide
+};