@getflip/swirl-components-react 0.332.0 → 0.333.0

package/dist/{swirl-banner.entry.aa686554.js → swirl-banner.entry.ded1ce1b.js}

@@ -1,50 +1,51 @@
-import { r as o, c as r, h as t, H as c, g as d } from "./index.15a5fc44.js";
-import { c as b } from "./index-267776a4.6beb4f4b.js";
-import { g as l } from "./utils-28df99ee.9fb223f6.js";
+import { r as o, c as r, h as i, H as c, g as b } from "./index.67f1f4e7.js";
+import { c as d } from "./index-267776a4.6beb4f4b.js";
+import { D as l } from "./media-query.service-9a0ff1cb.1b0964d0.js";
 import "react";
 import "react-dom";
-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, _ = {
+import "./utils-28df99ee.9fb223f6.js";
+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}}", f = h, m = {
   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 {
-  constructor(e) {
-    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);
-    }, this.onDismiss = (n) => {
-      this.dismiss.emit(n);
+}, _ = class {
+  constructor(n) {
+    o(this, n), this.action = r(this, "action", 7), this.dismiss = r(this, "dismiss", 7), this.mediaQueryUnsubscribe = () => {
+    }, this.onAction = (e) => {
+      this.action.emit(e);
+    }, this.onDismiss = (e) => {
+      this.dismiss.emit(e);
     }, this.actionLabel = void 0, this.content = void 0, this.dismissable = !1, this.dismissLabel = "Dismiss", this.importance = "status", this.intent = "default", this.showIcon = !1, this.icon = void 0, this.size = "m";
   }
   componentDidLoad() {
-    this.forceIconProps(this.desktopMediaQuery.matches), this.desktopMediaQuery.addEventListener("change", this.desktopMediaQueryHandler);
+    this.mediaQueryUnsubscribe = l.subscribe((n) => {
+      this.forceIconProps(n);
+    });
   }
   disconnectedCallback() {
-    var e, n;
-    (n = (e = this.desktopMediaQuery).removeEventListener) == null || n.call(e, "change", this.desktopMediaQueryHandler);
+    this.mediaQueryUnsubscribe();
   }
-  forceIconProps(e) {
-    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");
+  forceIconProps(n) {
+    var a, s;
+    const e = (a = this.iconEl) == null ? void 0 : a.children[0], t = (s = this.dismissButtonEl) == null ? void 0 : s.children[0];
+    e == null || e.setAttribute("size", n ? "20" : "24"), t == null || t.setAttribute("size", n ? "20" : "24");
   }
   determineIcon() {
-    return this.icon ? this.icon : _[this.intent];
+    return this.icon ? this.icon : m[this.intent];
   }
   render() {
-    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
+    const n = this.determineIcon(), e = Boolean(this.actionLabel) || this.dismissable, t = this.icon || this.showIcon && Boolean(n), a = d("banner", `banner--intent-${this.intent}`, `banner--size-${this.size}`, {
+      "banner--has-icon": t
     });
-    return t(c, { key: "99250db7c15c3766f334835f30ffd56f0324a376" }, t("div", { key: "d375cfcf81f60a07d9c2fea7723ba39485a53606", "aria-describedby": "content", class: s, role: this.importance, tabIndex: 0 }, t("div", { key: "19d3d110506ed8937b427bc33345b33a07ba9947", class: "banner__content", id: "content", part: "banner__content" }, i && t("span", { key: "b5e388649193c97484dc10454e42996eaf4ac8e5", "aria-hidden": "true", class: "banner__icon", innerHTML: e, ref: (a) => this.iconEl = a }), t("span", { key: "0a4471d71e533825f9f4956342a0e0e0e551db60", class: "banner__text" }, this.content)), n && t("div", { key: "0065a44d9a2cc0eebd09c69a410c8eaa13a43c6c", class: "banner__controls" }, this.actionLabel && t("button", { key: "9ddd441512126904853025979a7128ec1a8de0be", class: "banner__action-button", onClick: this.onAction, part: "banner__action-button", type: "button" }, this.actionLabel), this.dismissable && t("button", { key: "7bcafc0d0a32b34c00e012bad3dcfcbb01254cab", "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: "3d21dac0ac18b5f99c9426233d46664dda149f72" })))));
+    return i(c, { key: "52901533a924083e7080527d05c024dfeca4cfd8" }, i("div", { key: "3f9b2e12dae3fd6ac3320f1f207c3f80163b4895", "aria-describedby": "content", class: a, role: this.importance, tabIndex: 0 }, i("div", { key: "210dfff43e7867341485e8a08ca9f646d8f788f6", class: "banner__content", id: "content", part: "banner__content" }, t && i("span", { key: "4f52c17e778ad0a097b15df1bb957c00108f5f40", "aria-hidden": "true", class: "banner__icon", innerHTML: n, ref: (s) => this.iconEl = s }), i("span", { key: "388cac66f35b9d5230e83edfa6b4ee1f83343c95", class: "banner__text" }, this.content)), e && i("div", { key: "dd2c85861e304e20b7413d8543b7d44b2403e2ce", class: "banner__controls" }, this.actionLabel && i("button", { key: "60020c45f5b232742c5dfae378fac62bb1b552a0", class: "banner__action-button", onClick: this.onAction, part: "banner__action-button", type: "button" }, this.actionLabel), this.dismissable && i("button", { key: "0fd55fb8949212dcb7e21a3c47806acdfa00fa6b", "aria-label": this.dismissLabel, class: "banner__dismiss-button", onClick: this.onDismiss, part: "banner__dismiss-button", ref: (s) => this.dismissButtonEl = s, type: "button" }, i("swirl-icon-close", { key: "a1f408e4beaef07ff7379ea7625f590dd943a87f" })))));
   }
   get element() {
-    return d(this);
+    return b(this);
   }
 };
-u.style = m;
+_.style = f;
 export {
-  u as swirl_banner
+  _ as swirl_banner
 };

package/dist/{swirl-box.entry.da17abaf.js → swirl-box.entry.bdf7337a.js}

@@ -1,4 +1,4 @@
-import { r as d, c as r, h as t, H as i, g as s } from "./index.15a5fc44.js";
+import { r as d, c as r, h as t, H as i, g as s } from "./index.67f1f4e7.js";
 import { c as n } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";

package/dist/{swirl-button-group.entry.5897657d.js → swirl-button-group.entry.2f2b85bd.js}

@@ -1,4 +1,4 @@
-import { r as s, h as r, H as i } from "./index.15a5fc44.js";
+import { r as s, h as r, H as i } from "./index.67f1f4e7.js";
 import { c as e } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";

package/dist/{swirl-button.entry.ee74dd48.js → swirl-button.entry.ca855376.js}

@@ -1,27 +1,28 @@
-import { r as b, h as o, H as u, g as d } from "./index.15a5fc44.js";
-import { c } from "./index-267776a4.6beb4f4b.js";
-import { g as v } from "./utils-28df99ee.9fb223f6.js";
+import { r as b, h as o, H as u, g as c } from "./index.67f1f4e7.js";
+import { c as d } from "./index-267776a4.6beb4f4b.js";
+import { D as v } from "./media-query.service-9a0ff1cb.1b0964d0.js";
 import "react";
 import "react-dom";
+import "./utils-28df99ee.9fb223f6.js";
 const h = `.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);transition:box-shadow 0.3s}.button.sc-swirl-button:hover{background-color:var(--swirl-ghost-button-background-hovered);--swirl-tag-background-default:var(--s-surface-sunken-pressed)}.button.sc-swirl-button:active{background-color:var(--swirl-ghost-button-background-pressed)}.button--elevated.sc-swirl-button{box-shadow:var(--s-shadow-level-2)}.button.sc-swirl-button:disabled,.button.button--disabled.sc-swirl-button{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,.button.button--disabled.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-disabled)}.button.sc-swirl-button:focus:where(: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:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-default)}.button--variant-ghost.button--intent-strong.sc-swirl-button:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--s-icon-strong)}.button--variant-ghost.button--intent-primary.sc-swirl-button:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-highlight)}.button--variant-ghost.button--intent-primary.sc-swirl-button:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--s-icon-highlight)}.button--variant-ghost.button--intent-critical.sc-swirl-button:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-critical)}.button--variant-ghost.button--intent-critical.sc-swirl-button:where(:not(:disabled):not(.button--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);--swirl-tag-background-default:var(--s-surface-sunken-pressed)}.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,.button--variant-flat.button--disabled.sc-swirl-button{background-color:var(--swirl-flat-button-background-disabled)}.button--variant-flat.button--intent-primary.sc-swirl-button:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.button--variant-flat.button--intent-primary.sc-swirl-button:where(:not(:disabled):not(.button--disabled)):hover{background-color:var(--s-action-primary-hovered)}.button--variant-flat.button--intent-primary.sc-swirl-button:where(:not(:disabled):not(.button--disabled)):active{background-color:var(--s-action-primary-pressed)}.button--variant-flat.button--intent-primary.sc-swirl-button:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--s-icon-on-action-primary)}.button--variant-flat.button--intent-critical.sc-swirl-button:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-on-status);background-color:var(--s-action-critical-default)}.button--variant-flat.button--intent-critical.sc-swirl-button:where(:not(:disabled):not(.button--disabled)):hover{background-color:var(--s-action-critical-hovered)}.button--variant-flat.button--intent-critical.sc-swirl-button:where(:not(:disabled):not(.button--disabled)):active{background-color:var(--s-action-critical-pressed)}.button--variant-flat.button--intent-critical.sc-swirl-button:where(:not(:disabled):not(.button--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-flat.button--size-l.sc-swirl-button{padding:var(--s-space-12) var(--s-space-20)}.button--variant-flat.button--size-l.button--icon-only.sc-swirl-button{padding:var(--s-space-12)}.button--variant-outline.sc-swirl-button{color:var(--s-text-default);outline:var(--s-border-width-default) solid var(--s-border-strong);outline-offset:calc(var(--s-border-width-default) * -1)}.button--variant-outline.sc-swirl-button:disabled,.button--variant-outline.button--disabled.sc-swirl-button{outline-color:var(--s-border-default)}.button--variant-outline.button--intent-critical.sc-swirl-button:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-critical);outline-color:var(--s-border-critical)}.button--variant-outline.button--intent-critical.sc-swirl-button:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--s-icon-critical)}.button--variant-outline.button--intent-primary.sc-swirl-button:where(:not(:disabled):not(.button--disabled)),.button--variant-outline.button--pressed.sc-swirl-button{color:var(--s-text-highlight);outline-color:var(--s-border-highlight)}.button--variant-outline.button--intent-primary.sc-swirl-button:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button,.button--variant-outline.button--pressed.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-highlight)}.button--variant-outline.button--size-l.sc-swirl-button{padding:var(--s-space-12) var(--s-space-20)}.button--variant-outline.button--size-l.button--icon-only.sc-swirl-button{padding:var(--s-space-12)}.button--variant-outline.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-strong)}.button--variant-plain.sc-swirl-button{padding:0;border-radius:0;color:var(--swirl-plain-button-text-color-default);background-color:transparent}.button--variant-plain.sc-swirl-button:hover:where(:not(:disabled):not(.button--disabled)){color:var(--swirl-plain-button-text-color-hovered);background-color:transparent;text-decoration:underline;text-underline-offset:var(--s-space-4)}.button--variant-plain.sc-swirl-button:hover:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--swirl-plain-button-text-color-hovered)}.button--variant-plain.sc-swirl-button:active:where(:not(:disabled):not(.button--disabled)){color:var(--swirl-plain-button-text-color-pressed);background-color:transparent}.button--variant-plain.sc-swirl-button:active:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--swirl-plain-button-text-color-pressed)}.button--variant-plain.sc-swirl-button:disabled,.button--variant-plain.button--disabled.sc-swirl-button{color:var(--swirl-plain-button-text-color-disabled);background-color:transparent}.button--variant-plain.sc-swirl-button:disabled .button__icon.sc-swirl-button,.button--variant-plain.button--disabled.sc-swirl-button .button__icon.sc-swirl-button{color:var(--swirl-plain-button-text-color-disabled)}.button--variant-plain.button--icon-only.sc-swirl-button{padding:0}.button--variant-plain.button--intent-strong.sc-swirl-button:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-default)}.button--variant-plain.button--intent-strong.sc-swirl-button:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--s-icon-strong)}.button--variant-plain.button--intent-primary.sc-swirl-button{color:var(--s-interactive-primary-default)}.button--variant-plain.button--intent-primary.sc-swirl-button:hover:where(:not(:disabled):not(.button--disabled)){color:var(--s-interactive-primary-hovered)}.button--variant-plain.button--intent-primary.sc-swirl-button:hover:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--s-interactive-primary-hovered)}.button--variant-plain.button--intent-primary.sc-swirl-button:active:where(:not(:disabled):not(.button--disabled)){color:var(--s-interactive-primary-pressed)}.button--variant-plain.button--intent-primary.sc-swirl-button:active:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--s-interactive-primary-pressed)}.button--variant-plain.button--intent-primary.sc-swirl-button:disabled,.button--variant-plain.button--intent-primary.button--disabled.sc-swirl-button{color:var(--s-interactive-primary-disabled)}.button--variant-plain.button--intent-primary.sc-swirl-button:disabled .button__icon.sc-swirl-button,.button--variant-plain.button--intent-primary.button--disabled.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-interactive-primary-disabled)}.button--variant-plain.button--intent-primary.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-interactive-primary-default)}.button--variant-plain.sc-swirl-button .button__icon.sc-swirl-button{margin-left:0;color:var(--swirl-plain-button-text-color-default)}.button--variant-plain.button--size-l.sc-swirl-button{padding:var(--s-space-12) var(--s-space-20)}.button--variant-plain.button--size-l.button--icon-only.sc-swirl-button{padding:var(--s-space-12)}.button--variant-on-image.sc-swirl-button{color:var(--s-text-on-image);background:rgba(0, 0, 0, 0.6)}.button--variant-on-image.sc-swirl-button:hover{background:rgba(0, 0, 0, 0.5)}.button--variant-on-image.sc-swirl-button:active{background:rgba(0, 0, 0, 0.4)}.button--variant-on-image.sc-swirl-button:disabled,.button--variant-on-image.button--disabled.sc-swirl-button{color:var(--s-text-on-image);background:rgba(0, 0, 0, 0.3)}.button--variant-on-image.sc-swirl-button:disabled .button__icon.sc-swirl-button,.button--variant-on-image.button--disabled.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-on-image)}.button--variant-on-image.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-on-image)}.button--variant-on-image.button--size-l.sc-swirl-button{padding:var(--s-space-12) var(--s-space-20)}.button--variant-on-image.button--size-l.button--icon-only.sc-swirl-button{padding:var(--s-space-12)}.button--variant-floating.sc-swirl-button{color:var(--s-text-default);background-color:var(--s-surface-overlay-default)}.button--variant-floating.sc-swirl-button:not(.button--elevated){box-shadow:var(--s-shadow-level-1)}.button--variant-floating.sc-swirl-button:hover{color:var(--s-text-on-action-primary);background-color:var(--s-surface-overlay-hovered)}.button--variant-floating.sc-swirl-button:active{color:var(--s-text-on-action-primary);background-color:var(--s-surface-overlay-pressed)}.button--variant-floating.button--icon-only.sc-swirl-button{padding:var(--s-space-12)}.button--variant-floating.button--intent-primary.sc-swirl-button{padding:var(--s-space-12) var(--s-space-20);border-radius:1.5rem;color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.button--variant-floating.button--intent-primary.sc-swirl-button:hover:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-hovered)}.button--variant-floating.button--intent-primary.sc-swirl-button:active:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-pressed)}.button--variant-floating.button--intent-primary.sc-swirl-button:disabled,.button--variant-floating.button--intent-primary.button--disabled.sc-swirl-button{color:var(--s-text-on-action-primary)}.button--variant-floating.button--intent-primary.sc-swirl-button:disabled .button__icon.sc-swirl-button,.button--variant-floating.button--intent-primary.button--disabled.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-on-action-primary)}.button--variant-floating.button--intent-primary.button--icon-only.sc-swirl-button{padding:var(--s-space-12)}.button--variant-floating.button--intent-primary.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-on-action-primary)}.button--variant-floating.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-strong)}.button--icon-position-end.sc-swirl-button .button__icon.sc-swirl-button{margin-right:calc(-1 * var(--s-space-4));margin-left:0;order:2}.button--pill.sc-swirl-button{border-radius:1.25rem}.button--pill.button--size-l.sc-swirl-button{border-radius:1.5rem}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.button--pill.button--size-l.sc-swirl-button{border-radius:1.375rem}}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.button--pill.sc-swirl-button{border-radius:1.125rem}}.button--icon-only.sc-swirl-button{padding:var(--s-space-8)}.button--icon-only.button--pill.sc-swirl-button{border-top-left-radius:var(--swirl-icon-button-border-top-left-radius);border-top-right-radius:var(--swirl-icon-button-border-top-right-radius);border-bottom-right-radius:var(
       --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__tag.sc-swirl-button{padding-left:var(--s-space-8);order:3}.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}`, w = h, p = class {
   constructor(n) {
-    b(this, n), this.desktopMediaQuery = v(), this.desktopMediaQueryHandler = (t) => {
-      this.forceIconProps(t.matches);
+    b(this, n), this.mediaQueryUnsubscribe = () => {
     }, this.elevated = void 0, this.disabled = void 0, this.download = void 0, this.swirlAriaControls = void 0, this.swirlAriaCurrent = void 0, this.swirlAriaDescribedby = void 0, this.swirlAriaExpanded = void 0, this.swirlAriaHaspopup = void 0, this.swirlAriaLabel = void 0, this.form = void 0, this.hideLabel = void 0, this.href = void 0, this.icon = void 0, this.iconPosition = "start", this.intent = "default", this.label = void 0, this.name = void 0, this.pill = void 0, this.pressed = void 0, this.size = "m", this.target = void 0, this.textAlign = "center", this.type = "button", this.value = void 0, this.variant = "ghost", this.inheritFontSize = void 0;
   }
   componentDidLoad() {
-    this.forceIconProps(this.desktopMediaQuery.matches), this.updateFormAttribute(), this.desktopMediaQuery.addEventListener("change", this.desktopMediaQueryHandler);
+    this.updateFormAttribute(), this.mediaQueryUnsubscribe = v.subscribe((n) => {
+      this.forceIconProps(n);
+    });
   }
   componentDidRender() {
-    this.forceIconProps(this.desktopMediaQuery.matches), this.updateFormAttribute();
+    this.updateFormAttribute();
   }
   disconnectedCallback() {
-    var n, t;
-    (t = (n = this.desktopMediaQuery).removeEventListener) == null || t.call(n, "change", this.desktopMediaQueryHandler);
+    this.mediaQueryUnsubscribe();
   }
   forceIconProps(n) {
     if (!Boolean(this.iconEl))
@@ -40,7 +41,7 @@ const h = `.sc-swirl-button-h{display:inline-block;max-width:100%;flex-shrink:0}
     Boolean(this.href) || !Boolean(this.form) ? (t = this.buttonEl) == null || t.removeAttribute("form") : (r = this.buttonEl) == null || r.setAttribute("form", this.form);
   }
   render() {
-    const n = this.hideLabel && Boolean(this.icon) || this.variant === "floating" && this.intent === "default", t = Boolean(this.href), r = this.getAriaLabel(n), a = this.icon || Boolean(this.el.querySelector("[slot='icon']")), s = Boolean(this.el.querySelector("[slot='tag']")), e = c("button", `button--icon-position-${this.iconPosition}`, `button--intent-${this.intent}`, `button--size-${this.size}`, `button--text-align-${this.textAlign}`, `button--variant-${this.variant}`, {
+    const n = this.hideLabel && Boolean(this.icon) || this.variant === "floating" && this.intent === "default", t = Boolean(this.href), r = this.getAriaLabel(n), a = this.icon || Boolean(this.el.querySelector("[slot='icon']")), s = Boolean(this.el.querySelector("[slot='tag']")), e = d("button", `button--icon-position-${this.iconPosition}`, `button--intent-${this.intent}`, `button--size-${this.size}`, `button--text-align-${this.textAlign}`, `button--variant-${this.variant}`, {
       "button--elevated": this.elevated,
       "button--disabled": this.disabled,
       "button--has-icon": a,
@@ -48,10 +49,10 @@ const h = `.sc-swirl-button-h{display:inline-block;max-width:100%;flex-shrink:0}
       "button--pill": this.pill,
       "button--pressed": this.pressed
     }), l = t ? "a" : "button";
-    return o(u, { key: "d6d3ce3dc37e1baae931a9889310d2b95d1e2a1c", style: { pointerEvents: this.disabled ? "none" : "" } }, o(l, { key: "ddf5437dfcd007cd797e8c02b1755faaca0af7cb", "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: e, 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, style: this.inheritFontSize ? { fontSize: "inherit", lineHeight: "inherit" } : {} }, Boolean(this.icon) && o("span", { key: "db012c0296c21362c90ba800a16f96292b745717", class: "button__icon", innerHTML: this.icon, ref: (i) => this.iconEl = i }), !Boolean(this.icon) && o("span", { key: "f62b2479f0a236cc3bd49e636436c9b8ac86d59f", class: "button__icon", ref: (i) => this.iconEl = i }, o("slot", { key: "c0e02250891e12f1f61fe6838da9d398f1d51119", name: "icon" })), !n && o("span", { key: "6d08f04545e0227873c57731bfe5c62726a28ee2", class: "button__label" }, this.label), s && o("span", { key: "dba345465a93e5bba27c72878db5830316ddb84b", class: "button__tag" }, o("slot", { key: "267c787320f98ffc06a1393660c0a6dd4bc75c74", name: "tag" }))));
+    return o(u, { key: "dec5cc1badcf88a9b3f57a647c59fea4388a0e00", style: { pointerEvents: this.disabled ? "none" : "" } }, o(l, { key: "7b4a851e0c7f3699002095cf777c040a5c97194e", "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: e, 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, style: this.inheritFontSize ? { fontSize: "inherit", lineHeight: "inherit" } : {} }, Boolean(this.icon) && o("span", { key: "371fbdd6575181f62250eef491b6e4ed56b5b0e1", class: "button__icon", innerHTML: this.icon, ref: (i) => this.iconEl = i }), !Boolean(this.icon) && o("span", { key: "e3af04a049701785eddba2142ca9c3d9f376eda8", class: "button__icon", ref: (i) => this.iconEl = i }, o("slot", { key: "e9a101f204201023c4c62539578cb408adccde85", name: "icon" })), !n && o("span", { key: "e08c03769f2981aac46e02c8519d06bb1b88c801", class: "button__label" }, this.label), s && o("span", { key: "5fa04e35b9980d2f6684ba3bf40006053d204949", class: "button__tag" }, o("slot", { key: "b9cab88a1ab1e53f3f1240d1bd32cb0175cc261f", name: "tag" }))));
   }
   get el() {
-    return d(this);
+    return c(this);
   }
 };
 p.style = w;

package/dist/{swirl-card.entry.acfc631a.js → swirl-card.entry.56209400.js}

@@ -1,4 +1,4 @@
-import { r as n, c as o, h as e, H as c, g as l } from "./index.15a5fc44.js";
+import { r as n, c as o, h as e, H as c, g as l } from "./index.67f1f4e7.js";
 import { c as h } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";

package/dist/{swirl-carousel-slide.entry.d562d3f4.js → swirl-carousel-slide.entry.7983d539.js}

@@ -1,4 +1,4 @@
-import { r as i, h as s, H as t } from "./index.15a5fc44.js";
+import { r as i, h as s, H as t } from "./index.67f1f4e7.js";
 import { c as l } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";

package/dist/{swirl-carousel.entry.b80c7e91.js → swirl-carousel.entry.68653cc6.js}

@@ -1,4 +1,4 @@
-import { r as n, c as a, h as l, H as r, g as d } from "./index.15a5fc44.js";
+import { r as n, c as a, h as l, H as r, g as d } from "./index.67f1f4e7.js";
 import { c } from "./index-267776a4.6beb4f4b.js";
 import { d as h } from "./utils-28df99ee.9fb223f6.js";
 import "react";

package/dist/{swirl-checkbox.entry.ee7b3978.js → swirl-checkbox.entry.fbb26fa0.js}

@@ -1,4 +1,4 @@
-import { r as b, c as d, h as c, H as t } from "./index.15a5fc44.js";
+import { r as b, c as d, h as c, H as t } from "./index.67f1f4e7.js";
 import { c as l } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";

package/dist/{swirl-chip.entry.46aaf343.js → swirl-chip.entry.31ba38f5.js}

@@ -1,35 +1,36 @@
-import { r as o, c, h as e, H as h, g as n } from "./index.15a5fc44.js";
+import { r as o, c as s, h as i, H as h, g as n } from "./index.67f1f4e7.js";
 import { c as p } from "./index-267776a4.6beb4f4b.js";
-import { g as l } from "./utils-28df99ee.9fb223f6.js";
+import { D as l } from "./media-query.service-9a0ff1cb.1b0964d0.js";
 import "react";
 import "react-dom";
+import "./utils-28df99ee.9fb223f6.js";
 const d = ".sc-swirl-chip-h{position:relative;display:inline-flex;max-width:100%}.sc-swirl-chip-h *.sc-swirl-chip{box-sizing:border-box}.chip.sc-swirl-chip{display:inline-flex;overflow:hidden;max-width:100%;height:2.5rem;padding:0;border:0.0625rem solid var(--s-border-default);border-radius:1.25rem;color:var(--s-text-subdued);background-color:var(--s-surface-overlay-default);font:inherit;font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-sm);flex-direction:column}.chip--size-s.sc-swirl-chip{height:2rem}.chip--size-s.chip--removable.sc-swirl-chip .chip__inner.sc-swirl-chip{padding-right:calc(1.5rem + var(--s-space-12))}.chip--size-s.sc-swirl-chip .chip__inner.sc-swirl-chip{padding-right:var(--s-space-12);padding-left:var(--s-space-12)}.chip--size-s.sc-swirl-chip+.chip__remove-button.sc-swirl-chip{top:var(--s-space-4);width:1.5rem;height:1.5rem}.chip--interactive.sc-swirl-chip{cursor:pointer}.chip--interactive.sc-swirl-chip:hover{background-color:var(--s-surface-overlay-hovered)}.chip--interactive.sc-swirl-chip:hover .sc-swirl-chip::part(avatar){background-color:var(--s-surface-raised-hovered)}.chip--interactive.sc-swirl-chip:hover+.chip__remove-button.sc-swirl-chip{background-color:var(--s-surface-raised-default)}.chip--interactive.sc-swirl-chip:hover+.chip__remove-button.sc-swirl-chip:hover{background-color:var(--s-surface-raised-hovered)}.chip--interactive.sc-swirl-chip:hover+.chip__remove-button.sc-swirl-chip:active{background-color:var(--s-surface-overlay-pressed)}.chip--interactive.sc-swirl-chip:active{background-color:var(--s-surface-overlay-pressed)}.chip--interactive.sc-swirl-chip:active .sc-swirl-chip::part(avatar){background-color:var(--s-surface-raised-pressed)}.chip--interactive.sc-swirl-chip:active+.chip__remove-button.sc-swirl-chip{background-color:var(--s-surface-overlay-pressed)}.chip--icon-color-highlight.sc-swirl-chip .chip__icon.sc-swirl-chip{color:var(--s-icon-highlight)}.chip--removable.sc-swirl-chip .chip__inner.sc-swirl-chip{padding-right:calc(1.875rem + var(--s-space-12))}.chip--intent-critical.sc-swirl-chip{border-color:var(--s-border-critical);color:var(--s-text-critical)}.chip--intent-critical.sc-swirl-chip .chip__icon.sc-swirl-chip{color:var(--s-icon-critical)}.chip--border-radius-sm.sc-swirl-chip{border-radius:var(--s-border-radius-sm)}.chip--intent-success.sc-swirl-chip{border-color:var(--s-border-success);color:var(--s-text-success)}.chip--intent-success.sc-swirl-chip .chip__icon.sc-swirl-chip{color:var(--s-icon-success)}.chip--variant-outline.chip--pressed.sc-swirl-chip{color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.chip--variant-outline.chip--pressed.sc-swirl-chip:hover{background-color:var(--s-action-primary-hovered)}.chip--variant-outline.chip--pressed.sc-swirl-chip:hover+.chip__remove-button.sc-swirl-chip{background-color:var(--s-action-primary-hovered)}.chip--variant-outline.chip--pressed.sc-swirl-chip:active{background-color:var(--s-action-primary-pressed)}.chip--variant-outline.chip--pressed.sc-swirl-chip:active+.chip__remove-button.sc-swirl-chip{background-color:var(--s-action-primary-pressed)}.chip--variant-outline.chip--pressed.sc-swirl-chip+.chip__remove-button.sc-swirl-chip{color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.chip--variant-outline.chip--pressed.sc-swirl-chip+.chip__remove-button.sc-swirl-chip:hover{background-color:var(--s-action-primary-hovered)}.chip--variant-outline.chip--pressed.sc-swirl-chip+.chip__remove-button.sc-swirl-chip:active{background-color:var(--s-action-primary-pressed)}.chip--variant-plain.sc-swirl-chip{height:auto;border:none;border-radius:0;background-color:transparent}.chip--variant-plain.chip--interactive.sc-swirl-chip:hover{background-color:transparent;text-decoration:underline;text-underline-offset:var(--s-space-4)}.chip--variant-plain.chip--interactive.sc-swirl-chip:hover .sc-swirl-chip::part(avatar){background-color:var(--s-surface-raised-hovered)}.chip--variant-plain.chip--interactive.sc-swirl-chip:active{background-color:transparent}.chip--variant-plain.chip--interactive.sc-swirl-chip:active .sc-swirl-chip::part(avatar){background-color:var(--s-surface-raised-pressed)}.chip--variant-plain.chip--removable.sc-swirl-chip .chip__inner.sc-swirl-chip{padding-right:var(--s-space-12)}.chip--variant-plain.sc-swirl-chip+.chip__remove-button.sc-swirl-chip{position:relative;top:0;right:auto}.chip--variant-plain.sc-swirl-chip .chip__inner.sc-swirl-chip{padding-right:0;padding-left:0}.chip--has-progress.sc-swirl-chip+.chip__remove-button.sc-swirl-chip{top:0.1875rem}.chip__inner.sc-swirl-chip{display:inline-flex;max-width:100%;height:100%;padding-right:var(--s-space-16);padding-left:var(--s-space-16);align-items:center}.chip__avatar.sc-swirl-chip,.chip__icon.sc-swirl-chip{display:inline-flex;margin-right:var(--s-space-8);flex-shrink:0}.chip__avatar.sc-swirl-chip{overflow:hidden;width:1.75rem;height:1.75rem;margin-left:-0.625rem}.chip__icon.sc-swirl-chip{margin-left:-0.25rem;color:var(--s-icon-default)}.chip__label.sc-swirl-chip{overflow:hidden;flex-grow:1;white-space:nowrap;text-overflow:ellipsis}.chip__progress-indicator.sc-swirl-chip{width:100%}.chip__remove-button.sc-swirl-chip{position:absolute;top:0.3125rem;right:var(--s-space-4);display:inline-flex;width:1.875rem;height:1.875rem;padding:0;justify-content:center;align-items:center;border:none;border-radius:50%;color:var(--s-icon-default);background-color:var(--s-surface-overlay-default);cursor:pointer}.chip__remove-button.sc-swirl-chip:hover{background-color:var(--s-surface-overlay-hovered)}.chip__remove-button.sc-swirl-chip:active{background-color:var(--s-surface-overlay-pressed)}", v = d, u = class {
   constructor(r) {
-    o(this, r), this.chipClick = c(this, "chipClick", 7), this.removeChip = c(this, "remove", 7), this.desktopMediaQuery = l(), this.desktopMediaQueryHandler = (i) => {
-      this.forceIconProps(i.matches);
+    o(this, r), this.chipClick = s(this, "chipClick", 7), this.removeChip = s(this, "remove", 7), this.mediaQueryUnsubscribe = () => {
     }, this.borderRadius = "pill", this.icon = void 0, this.iconColor = "default", this.intent = "default", this.interactive = !1, this.label = void 0, this.progress = void 0, this.pressed = void 0, this.progressBarLabel = "Loading progress", this.removable = void 0, this.removeButtonLabel = "Remove", this.size = "m", this.variant = "outline";
   }
   componentDidLoad() {
-    this.forceIconProps(this.desktopMediaQuery.matches), this.desktopMediaQuery.addEventListener("change", this.desktopMediaQueryHandler);
+    this.mediaQueryUnsubscribe = l.subscribe((r) => {
+      this.forceIconProps(r);
+    });
   }
   disconnectedCallback() {
-    var r, i;
-    (i = (r = this.desktopMediaQuery).removeEventListener) == null || i.call(r, "change", this.desktopMediaQueryHandler);
+    this.mediaQueryUnsubscribe();
   }
   forceIconProps(r) {
     if (!Boolean(this.iconEl))
       return;
-    const i = this.iconEl.children[0], s = this.size === "s" ? "16" : r ? "20" : "24";
-    i == null || i.setAttribute("size", s);
+    const e = this.iconEl.children[0], c = this.size === "s" ? "16" : r ? "20" : "24";
+    e == null || e.setAttribute("size", c);
   }
   render() {
-    const r = this.interactive || this.pressed !== void 0 ? "button" : "span", i = Boolean(this.el.querySelector('[slot="avatar"]')), s = !i && Boolean(this.icon), a = p("chip", `chip--border-radius-${this.borderRadius}`, `chip--icon-color-${this.iconColor}`, `chip--intent-${this.intent}`, `chip--size-${this.size}`, `chip--variant-${this.variant}`, {
+    const r = this.interactive || this.pressed !== void 0 ? "button" : "span", e = Boolean(this.el.querySelector('[slot="avatar"]')), c = !e && Boolean(this.icon), a = p("chip", `chip--border-radius-${this.borderRadius}`, `chip--icon-color-${this.iconColor}`, `chip--intent-${this.intent}`, `chip--size-${this.size}`, `chip--variant-${this.variant}`, {
       "chip--pressed": this.pressed,
       "chip--has-progress": this.progress !== void 0,
       "chip--interactive": this.interactive || this.pressed !== void 0,
       "chip--removable": this.removable
     });
-    return e(h, { key: "67ed7962107673d2b27886cbc6b22c451335ba4b" }, e(r, { key: "ee65c5950ec0eb61037282966e60c47d113ecd4f", "aria-pressed": this.pressed !== void 0 ? String(this.pressed) : void 0, class: a, onClick: this.chipClick.emit, type: this.interactive ? "button" : void 0 }, e("span", { key: "7a2fea34626f32eb01f09424ee77e663e03a4815", class: "chip__inner" }, i && e("span", { key: "ceacda3a0a82ab42a0eeb9016eef8d50fed975d5", class: "chip__avatar" }, e("slot", { key: "f16326da71143e85dd6601038f6c22eaefab8e8b", name: "avatar" })), s && e("span", { key: "9e2b3f42b74c210d2a6a4485f7ea2e4e81b9b442", class: "chip__icon", innerHTML: this.icon, ref: (t) => this.iconEl = t }), e("span", { key: "7c51f843fabc323d4564f1af9baf978c262fec5d", class: "chip__label" }, this.label)), this.progress !== void 0 && e("span", { key: "c1a1eb80d19f17af33532025e5130d624defba32", class: "chip__progress-indicator" }, e("swirl-progress-indicator", { key: "aac475d0b313f0844511d6eb0b718e135013450e", label: this.progressBarLabel, value: this.progress }))), this.removable && e("button", { key: "f5da3e24bdc9b3c05ad2385250dea4472125765c", "aria-label": this.removeButtonLabel, class: "chip__remove-button", onClick: this.removeChip.emit, type: "button" }, e("swirl-icon-close", { key: "ed9878871eb6aa8755ee47fe7a44d06a55e39929", size: 20 })));
+    return i(h, { key: "aacfe2b81480beb943d294ac98858014b53e7d9c" }, i(r, { key: "fe3ed0c535267aaf8d5add2ba73b1ab017202a5a", "aria-pressed": this.pressed !== void 0 ? String(this.pressed) : void 0, class: a, onClick: this.chipClick.emit, type: this.interactive ? "button" : void 0 }, i("span", { key: "0e55458a8c3841ed02994ba7c105036424923018", class: "chip__inner" }, e && i("span", { key: "6065e1ebed3ec0f236195b682ba12e85684de876", class: "chip__avatar" }, i("slot", { key: "950dd5ad2213171c4eae631c1e95c75647ec5ee2", name: "avatar" })), c && i("span", { key: "118532298ad5ada83f2cfb15f571cc2ee857d3bd", class: "chip__icon", innerHTML: this.icon, ref: (t) => this.iconEl = t }), i("span", { key: "22fa5011815883c566d59b59008a8af87077fc30", class: "chip__label" }, this.label)), this.progress !== void 0 && i("span", { key: "623b2f0fcc739776ef0eb46ac0cf91a3912a24f3", class: "chip__progress-indicator" }, i("swirl-progress-indicator", { key: "dcb29d9a57a76190704b63917d443c23f3892224", label: this.progressBarLabel, value: this.progress }))), this.removable && i("button", { key: "722397ffd1828842a1f5848d65c2c6c18a9b7893", "aria-label": this.removeButtonLabel, class: "chip__remove-button", onClick: this.removeChip.emit, type: "button" }, i("swirl-icon-close", { key: "d96fea1d3acd2b549197808c6563d574836a278b", size: 20 })));
   }
   get el() {
     return n(this);

package/dist/{swirl-color-input.entry.4849d4eb.js → swirl-color-input.entry.a737cd6d.js}

@@ -1,4 +1,4 @@
-import { r as L, c as f, h as l, H as B } from "./index.15a5fc44.js";
+import { r as L, c as f, h as l, H as B } from "./index.67f1f4e7.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.4a74aeca.js → swirl-columns.entry.de11a191.js}

@@ -1,4 +1,4 @@
-import { r as c, h as s, H as a } from "./index.15a5fc44.js";
+import { r as c, h as s, H as a } from "./index.67f1f4e7.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 f, u as h, v as g, w as C, x as A, y as T, z as F, A as k, B as L, C as P, D as R, 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 N, P as G, Q as H, R as U, T as j, 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 la, a6 as ra, 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 fa, an as ha, ao as ga, ap as Ca, aq as Aa, ar as Ta, as as Fa, at as ka, au as La, av as Pa, aw as Ra, 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 Na, aG as Ga, aH as Ha, aI as Ua, aJ as ja, 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 li, aY as ri, 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 fi, bd as hi, be as gi, bf as Ci, bg as Ai, bh as Ti, bi as Fi, bj as ki, bk as Li, bl as Pi, bm as Ri, 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 Ni, bw as Gi, bx as Hi, by as Ui, bz as ji, 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 al, bM as il, bN as ll, bO as rl, bP as ol, bQ as sl, bR as Sl, bS as el, bT as wl, bU as nl, bV as cl, bW as Il, bX as tl, bY as dl, bZ as bl, b_ as ml, b$ as yl, c0 as pl, c1 as ul, c2 as fl, c3 as hl, c4 as gl, c5 as Cl, c6 as Al, c7 as Tl, c8 as Fl, c9 as kl, ca as Ll, cb as Pl, cc as Rl, cd as vl, ce as Ml, cf as Dl, cg as Bl, ch as El, ci as Ol, cj as Vl, ck as xl, cl as Nl, cm as Gl, cn as Hl, co as Ul, cp as jl, cq as Wl, cr as Kl, cs as ql, ct as zl, cu as Xl, cv as Yl, cw as Jl, cx as Ql, cy as Zl, cz as _l, cA as $l, cB as ar, cC as ir, cD as lr, cE as rr, cF as or, cG as sr, cH as Sr, cI as er, cJ as wr, cK as nr, cL as cr, cM as Ir, cN as tr, cO as dr, cP as br, cQ as mr, cR as yr, cS as pr, cT as ur, cU as fr, cV as hr, cW as gr, cX as Cr, cY as Ar, cZ as Tr, c_ as Fr, c$ as kr, d0 as Lr, d1 as Pr, d2 as Rr, d3 as vr, d4 as Mr, d5 as Dr, d6 as Br, d7 as Er, d8 as Or, d9 as Vr, da as xr, db as Nr, dc as Gr, dd as Hr, de as Ur, df as jr, dg as Wr, dh as Kr, di as qr, dj as zr, dk as Xr, dl as Yr, dm as Jr, dn as Qr, dp as Zr, dq as _r, dr as $r, ds as ao, dt as io, du as lo, dv as ro, 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 fo, dL as ho, dM as go, dN as Co, dO as Ao, dP as To, dQ as Fo, dR as ko, dS as Lo, dT as Po, dU as Ro, 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 No, e2 as Go, e3 as Ho, e4 as Uo, e5 as jo, 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 ls, ek as rs, 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 fs, eB as hs, eC as gs, eD as Cs, eE as As, eF as Ts, eG as Fs, eH as ks, eI as Ls, eJ as Ps, eK as Rs, 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 Ns, eU as Gs, eV as Hs, eW as Us, eX as js, eY as Ws, eZ as Ks, e_ as qs, e$ as zs, f0 as Xs, f1 as Ys, f2 as Js, f3 as Qs, f4 as Zs, f5 as _s, f6 as $s, f7 as aS, f8 as iS, f9 as lS, fa as rS, fb as oS, fc as sS, fd as SS, fe as eS, ff as wS, fg as nS, fh as cS, fi as IS, fj as tS, fk as dS, fl as bS, fm as mS, fn as yS, fo as pS, fp as uS } from "./index.15a5fc44.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 f, u as h, v as g, w as C, x as A, y as T, z as F, A as k, B as L, C as P, D as R, 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 N, P as G, Q as H, R as U, T as j, 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 la, a6 as ra, 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 fa, an as ha, ao as ga, ap as Ca, aq as Aa, ar as Ta, as as Fa, at as ka, au as La, av as Pa, aw as Ra, 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 Na, aG as Ga, aH as Ha, aI as Ua, aJ as ja, 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 li, aY as ri, 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 fi, bd as hi, be as gi, bf as Ci, bg as Ai, bh as Ti, bi as Fi, bj as ki, bk as Li, bl as Pi, bm as Ri, 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 Ni, bw as Gi, bx as Hi, by as Ui, bz as ji, 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 al, bM as il, bN as ll, bO as rl, bP as ol, bQ as sl, bR as Sl, bS as el, bT as wl, bU as nl, bV as cl, bW as Il, bX as tl, bY as dl, bZ as bl, b_ as ml, b$ as yl, c0 as pl, c1 as ul, c2 as fl, c3 as hl, c4 as gl, c5 as Cl, c6 as Al, c7 as Tl, c8 as Fl, c9 as kl, ca as Ll, cb as Pl, cc as Rl, cd as vl, ce as Ml, cf as Dl, cg as Bl, ch as El, ci as Ol, cj as Vl, ck as xl, cl as Nl, cm as Gl, cn as Hl, co as Ul, cp as jl, cq as Wl, cr as Kl, cs as ql, ct as zl, cu as Xl, cv as Yl, cw as Jl, cx as Ql, cy as Zl, cz as _l, cA as $l, cB as ar, cC as ir, cD as lr, cE as rr, cF as or, cG as sr, cH as Sr, cI as er, cJ as wr, cK as nr, cL as cr, cM as Ir, cN as tr, cO as dr, cP as br, cQ as mr, cR as yr, cS as pr, cT as ur, cU as fr, cV as hr, cW as gr, cX as Cr, cY as Ar, cZ as Tr, c_ as Fr, c$ as kr, d0 as Lr, d1 as Pr, d2 as Rr, d3 as vr, d4 as Mr, d5 as Dr, d6 as Br, d7 as Er, d8 as Or, d9 as Vr, da as xr, db as Nr, dc as Gr, dd as Hr, de as Ur, df as jr, dg as Wr, dh as Kr, di as qr, dj as zr, dk as Xr, dl as Yr, dm as Jr, dn as Qr, dp as Zr, dq as _r, dr as $r, ds as ao, dt as io, du as lo, dv as ro, 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 fo, dL as ho, dM as go, dN as Co, dO as Ao, dP as To, dQ as Fo, dR as ko, dS as Lo, dT as Po, dU as Ro, 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 No, e2 as Go, e3 as Ho, e4 as Uo, e5 as jo, 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 ls, ek as rs, 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 fs, eB as hs, eC as gs, eD as Cs, eE as As, eF as Ts, eG as Fs, eH as ks, eI as Ls, eJ as Ps, eK as Rs, 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 Ns, eU as Gs, eV as Hs, eW as Us, eX as js, eY as Ws, eZ as Ks, e_ as qs, e$ as zs, f0 as Xs, f1 as Ys, f2 as Js, f3 as Qs, f4 as Zs, f5 as _s, f6 as $s, f7 as aS, f8 as iS, f9 as lS, fa as rS, fb as oS, fc as sS, fd as SS, fe as eS, ff as wS, fg as nS, fh as cS, fi as IS, fj as tS, fk as dS, fl as bS, fm as mS, fn as yS, fo as pS, fp as uS } from "./index.67f1f4e7.js";
 import "react";
 import "react-dom";
 export {