@getflip/swirl-components-react 0.278.0 → 0.280.0

package/dist/{swirl-chip.entry.bcd97e17.js → swirl-chip.entry.d6a21918.js}

@@ -1,11 +1,11 @@
-import { r as o, c as s, h as r, H as h, g as n } from "./index.8c018d64.js";
+import { r as o, c, h as e, H as h, g as n } from "./index.3004123e.js";
 import { c as p } from "./index-267776a4.6beb4f4b.js";
 import { g as l } from "./utils-fbb8b494.acf1ae9e.js";
 import "react";
 import "react-dom";
 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(e) {
-    o(this, e), this.chipClick = s(this, "chipClick", 7), this.remove = s(this, "remove", 7), this.desktopMediaQuery = l(), this.desktopMediaQueryHandler = (i) => {
+  constructor(r) {
+    o(this, r), this.chipClick = c(this, "chipClick", 7), this.remove = c(this, "remove", 7), this.desktopMediaQuery = l(), this.desktopMediaQueryHandler = (i) => {
       this.forceIconProps(i.matches);
     }, 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";
   }
@@ -13,23 +13,23 @@ const d = ".sc-swirl-chip-h{position:relative;display:inline-flex;max-width:100%
     this.forceIconProps(this.desktopMediaQuery.matches), this.desktopMediaQuery.onchange = this.desktopMediaQueryHandler;
   }
   disconnectedCallback() {
-    var e, i;
-    (i = (e = this.desktopMediaQuery).removeEventListener) == null || i.call(e, "change", this.desktopMediaQueryHandler);
+    var r, i;
+    (i = (r = this.desktopMediaQuery).removeEventListener) == null || i.call(r, "change", this.desktopMediaQueryHandler);
   }
-  forceIconProps(e) {
+  forceIconProps(r) {
     if (!Boolean(this.iconEl))
       return;
-    const i = this.iconEl.children[0], c = this.size === "s" ? "16" : e ? "20" : "24";
-    i == null || i.setAttribute("size", c);
+    const i = this.iconEl.children[0], s = this.size === "s" ? "16" : r ? "20" : "24";
+    i == null || i.setAttribute("size", s);
   }
   render() {
-    const e = this.interactive || this.pressed !== void 0 ? "button" : "span", i = Boolean(this.el.querySelector('[slot="avatar"]')), c = !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", 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}`, {
       "chip--pressed": this.pressed,
       "chip--has-progress": this.progress !== void 0,
       "chip--interactive": this.interactive || this.pressed !== void 0,
       "chip--removable": this.removable
     });
-    return r(h, { key: "b4d76c88062465e2646fa7ca7d0c7db04bb0f9f1" }, r(e, { key: "c9c9ed830168769e54d0a774486da011bdaec7b9", "aria-pressed": this.pressed !== void 0 ? String(this.pressed) : void 0, class: a, onClick: this.chipClick.emit, type: this.interactive ? "button" : void 0 }, r("span", { key: "6f5d010858eaebc7012477c6de01f5c5bde71c8c", class: "chip__inner" }, i && r("span", { key: "b6c60ccb92aaa1fe0694f4d1e183c605fb8dd8da", class: "chip__avatar" }, r("slot", { key: "0af6eed958712310f19d7f70c1310a55ab89d9e3", name: "avatar" })), c && r("span", { key: "5c91e5a998a108a086b7b100f74f649bdec07cc6", class: "chip__icon", innerHTML: this.icon, ref: (t) => this.iconEl = t }), r("span", { key: "3a08fcd1a50156ec578994a000f17bd36593a7b5", class: "chip__label" }, this.label)), this.progress !== void 0 && r("span", { key: "b3cd34ce776fd6ffb4e29f118bc5c841df2324b9", class: "chip__progress-indicator" }, r("swirl-progress-indicator", { key: "e844e5ece17f9b41b3361381fbd17baf44f79e55", label: this.progressBarLabel, value: this.progress }))), this.removable && r("button", { key: "81e67bc9a0fc5a9327b5d1d766101ea0dd5eb53b", "aria-label": this.removeButtonLabel, class: "chip__remove-button", onClick: this.remove.emit, type: "button" }, r("swirl-icon-close", { key: "6ad0709ea5e5166a96ca2cd005913cf88c2e598b", size: 20 })));
+    return e(h, { key: "be1a929a9efe4fe6a6fee27f08218063ac03a8ba" }, e(r, { key: "2c816c3c7ba603c3c403947d9e2f043ea00c4061", "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: "e570bc840be98fd23d6ff46517115e1ea6e1a111", class: "chip__inner" }, i && e("span", { key: "18e721ec9c55170f398e2b9d2df0be97a54626a4", class: "chip__avatar" }, e("slot", { key: "952ae3c808156b4a3f9d53e45d00af33d8f1d070", name: "avatar" })), s && e("span", { key: "179d91ff81b35f53469f8f5816b73b7fe324f744", class: "chip__icon", innerHTML: this.icon, ref: (t) => this.iconEl = t }), e("span", { key: "fa57586bd59ebd9c9722f3bbf64c5c37ab1ab5e6", class: "chip__label" }, this.label)), this.progress !== void 0 && e("span", { key: "4f15b8329caa1ff0de30812340c1ef6efead3797", class: "chip__progress-indicator" }, e("swirl-progress-indicator", { key: "5e349c092244b2aae8b33e485aa8794e22745a2a", label: this.progressBarLabel, value: this.progress }))), this.removable && e("button", { key: "94d8906bbef7392a08326f0e6ab6c63c98b6979d", "aria-label": this.removeButtonLabel, class: "chip__remove-button", onClick: this.remove.emit, type: "button" }, e("swirl-icon-close", { key: "d2ebf4e2cb3ad637ccd42fdefc4ce1d2e4b27950", size: 20 })));
   }
   get el() {
     return n(this);

package/dist/{swirl-color-input.entry.af7a9e84.js → swirl-color-input.entry.bcc11bfd.js}

@@ -1,4 +1,4 @@
-import { r as L, c as b, h as l, H as B } from "./index.8c018d64.js";
+import { r as L, c as b, h as l, H as B } from "./index.3004123e.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.2cbe3f32.js

@@ -0,0 +1,18 @@
+import { r as o, h as s, H as t } from "./index.3004123e.js";
+import "react";
+import "react-dom";
+const e = ":host{display:block}:host *{box-sizing:border-box}.columns{display:grid;width:100%}", i = e, r = class {
+  constructor(a) {
+    o(this, a), this.columns = "repeat(3, minmax(0, 1fr))", this.spacing = void 0;
+  }
+  render() {
+    return s(t, { key: "513552bd948ca6af6ce0514800f01150fa81aaea" }, s("div", { key: "fd74ac26cfe66fc07aaa27ba5d54ffab58e1631a", class: "columns", style: {
+      gridTemplateColumns: this.columns,
+      gap: `var(--s-space-${this.spacing})`
+    } }, s("slot", { key: "72c0008f8f6c08239659b779794455864f7f7b08" })));
+  }
+};
+r.style = i;
+export {
+  r as swirl_columns
+};