@getflip/swirl-components-react 0.208.3 → 0.210.0

package/dist/{swirl-box.entry.6fbeaad4.js → swirl-box.entry.a30ff1a8.js}

@@ -1,4 +1,4 @@
-import { r as t, h as d, H as n } from "./index.552aa8bc.js";
+import { r as t, h as d, H as n } from "./index.72c526c1.js";
 import { c as s } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";

package/dist/{swirl-button-group.entry.2bd3dc36.js → swirl-button-group.entry.a79439f0.js}

@@ -1,4 +1,4 @@
-import { r as s, h as r, H as e } from "./index.552aa8bc.js";
+import { r as s, h as r, H as e } from "./index.72c526c1.js";
 import { c as i } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";

package/dist/{swirl-button.entry.278d50da.js → swirl-button.entry.7e4d4ee8.js}

@@ -1,4 +1,4 @@
-import { r as b, h as n, H as u, g as c } from "./index.552aa8bc.js";
+import { r as b, h as n, H as u, g as c } from "./index.72c526c1.js";
 import { c as d } from "./index-267776a4.6beb4f4b.js";
 import { g as v } from "./utils-9b747dd7.4c4c7dc0.js";
 import "react";

package/dist/{swirl-card.entry.624a9035.js → swirl-card.entry.a9aa2630.js}

@@ -1,4 +1,4 @@
-import { r as t, h as e, H as n, g as o } from "./index.552aa8bc.js";
+import { r as t, h as e, H as n, g as o } from "./index.72c526c1.js";
 import { c } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";

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

@@ -0,0 +1,19 @@
+import { r as i, h as e, H as t } from "./index.72c526c1.js";
+import { c as l } from "./index-267776a4.6beb4f4b.js";
+import "react";
+import "react-dom";
+const o = ":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%}", a = o, 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: "d9e38fd7834a5a035e8a2a24c5c898eb77271560", "aria-roledescription": "slide", "aria-label": this.label, class: s, role: "group", style: { flexBasis: this.width, minHeight: this.minHeight }, tabIndex: 0 }, e("slot", { key: "aa8dc3486577d542ffbf648ee7f24206fe61734c" }));
+  }
+};
+r.style = a;
+export {
+  r as swirl_carousel_slide
+};

package/dist/{swirl-carousel.entry.a417ee97.js → swirl-carousel.entry.9148a6a0.js}

@@ -1,11 +1,11 @@
-import { r as a, c as n, h as l, H as r, g as c } from "./index.552aa8bc.js";
+import { r as n, c as a, h as l, H as r, g as c } from "./index.72c526c1.js";
 import { d } from "./utils-9b747dd7.4c4c7dc0.js";
 import "react";
 import "react-dom";
 const h = `:host{position:relative;display:block;overflow:hidden;width:100%;margin-top:calc(-1 * var(--s-space-24));margin-bottom:calc(-1 * var(--s-space-24))}:host(:hover) .carousel__previous-slide-button{pointer-events:auto;opacity:1}:host(:hover) .carousel__next-slide-button{pointer-events:auto;opacity:1}:host *{box-sizing:border-box}.carousel{position:relative;overflow:hidden;width:100%}.carousel__slides{position:relative;display:flex;overflow-x:auto;overflow-y:hidden;width:100%;padding:var(--s-space-24) var(--s-space-16) var(--s-space-24)
     var(--s-space-16);scroll-padding:var(--s-space-16);scrollbar-width:none;scroll-snap-type:x mandatory;scroll-behavior:smooth}.carousel__slides::-webkit-scrollbar{display:none}.carousel__slides ::slotted(*){margin-left:var(--s-space-16);flex-grow:0;flex-shrink:0;scroll-snap-align:start}@media (min-width: 768px){.carousel__slides ::slotted(*){margin-left:var(--s-space-24)}}@media (min-width: 768px){.carousel__slides{padding-right:var(--s-space-24);padding-left:var(--s-space-24);scroll-padding:var(--s-space-24)}}.carousel__previous-slide-button{position:absolute;z-index:1;top:calc(50% - var(--s-space-12));left:var(--s-space-4);visibility:hidden;transition:opacity 0.2s;transform:translateY(-50%) scale(0.72);pointer-events:none;opacity:0}@media (min-width: 768px){.carousel__previous-slide-button{visibility:visible}}.carousel__next-slide-button{position:absolute;z-index:1;top:calc(50% - var(--s-space-12));right:var(--s-space-4);visibility:hidden;transition:opacity 0.2s;transform:translateY(-50%) scale(0.72);pointer-events:none;opacity:0}@media (min-width: 768px){.carousel__next-slide-button{visibility:visible}}`, u = h, v = class {
   constructor(i) {
-    a(this, i), this.activeSlidesChange = n(this, "activeSlidesChange", 7), this.activeSlides = [], this.updateActiveSlideReferences = d(() => {
+    n(this, i), this.activeSlidesChange = a(this, "activeSlidesChange", 7), this.activeSlides = [], this.updateActiveSlideReferences = d(() => {
       const e = this.getActiveSlides();
       e.some((s, o) => this.activeSlides[o] !== s) && (this.activeSlides = e, this.activeSlidesChange.emit(this.activeSlides));
     }, 100), this.onPreviousSlideButtonClick = () => {
@@ -57,7 +57,7 @@ const h = `:host{position:relative;display:block;overflow:hidden;width:100%;marg
     return s >= e && o <= t;
   }
   render() {
-    return l(r, { key: "aab30bbdf49103123c0cacf6707662830517a5dd", "aria-label": this.label, "aria-roledescription": "carousel", role: "group" }, l("div", { key: "51abe6639be84f6da7908edcb7c7204ae381c6c9", class: "carousel" }, this.isScrollable && !this.isAtStart && l("swirl-button", { key: "843a9edbbe1f4d50e3c9a109046777b9dc98c3d0", class: "carousel__previous-slide-button", hideLabel: !0, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.previousSlideButtonLabel, onClick: this.onPreviousSlideButtonClick, pill: !0, variant: "floating" }), this.isScrollable && !this.isAtEnd && l("swirl-button", { key: "fce0df1eb6eee6fba16792a8a5e2330fdd254880", class: "carousel__next-slide-button", hideLabel: !0, icon: "<swirl-icon-arrow-forward></swirl-icon-arrow-forward>", label: this.nextSlideButtonLabel, onClick: this.onNextSlideButtonClick, pill: !0, variant: "floating" }), l("div", { key: "d2a750724ff71b3457b424ce798e908787d3c18c", "aria-live": "polite", class: "carousel__slides", onScroll: this.onScroll, ref: (i) => this.slidesContainer = i }, l("slot", { key: "be830ac885a7dd1a74e44a60d4f6a5a2d41f6b62", onSlotchange: this.onSlotChange }))));
+    return l(r, { key: "ab6284673ed9d3701d6a41297cf54dfe8fa4b21f", "aria-label": this.label, "aria-roledescription": "carousel", role: "group" }, l("div", { key: "b0af1b5346e22a468cc588938a7498c5b76ff143", class: "carousel" }, this.isScrollable && !this.isAtStart && l("swirl-button", { key: "247f7eee414bc41eaa316d510fed19970f139971", class: "carousel__previous-slide-button", hideLabel: !0, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.previousSlideButtonLabel, onClick: this.onPreviousSlideButtonClick, pill: !0, variant: "floating" }), this.isScrollable && !this.isAtEnd && l("swirl-button", { key: "9450d0b04266a0fb4dab253d2851a5477496c926", class: "carousel__next-slide-button", hideLabel: !0, icon: "<swirl-icon-arrow-forward></swirl-icon-arrow-forward>", label: this.nextSlideButtonLabel, onClick: this.onNextSlideButtonClick, pill: !0, variant: "floating" }), l("div", { key: "f4a2817f13c37fdd8230fbdb31d69e6fd5139b8c", "aria-live": "polite", class: "carousel__slides", onScroll: this.onScroll, ref: (i) => this.slidesContainer = i }, l("slot", { key: "3fd00348633157685456a8db9ecdecf2f06c01db", onSlotchange: this.onSlotChange }))));
   }
   get el() {
     return c(this);

package/dist/{swirl-checkbox.entry.e0bb870a.js → swirl-checkbox.entry.a068a7e4.js}

@@ -1,4 +1,4 @@
-import { r as b, c as d, h as c, H as t } from "./index.552aa8bc.js";
+import { r as b, c as d, h as c, H as t } from "./index.72c526c1.js";
 import { c as l } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";

package/dist/{swirl-chip.entry.e60560d0.js → swirl-chip.entry.6df752c3.js}

@@ -1,4 +1,4 @@
-import { r as t, c as o, h as r, H as h, g as n } from "./index.552aa8bc.js";
+import { r as t, c as o, h as r, H as h, g as n } from "./index.72c526c1.js";
 import { c as p } from "./index-267776a4.6beb4f4b.js";
 import { g as l } from "./utils-9b747dd7.4c4c7dc0.js";
 import "react";

package/dist/{swirl-color-input.entry.e3c3d96f.js → swirl-color-input.entry.02398965.js}

@@ -1,9 +1,9 @@
-import { r as L, c as f, h as l, H as B } from "./index.552aa8bc.js";
+import { r as L, c as f, h as l, H as B } from "./index.72c526c1.js";
 import { c as T } from "./index-267776a4.6beb4f4b.js";
 import { v as z } from "./v4-23648a96.77c7c20f.js";
 import "react";
 import "react-dom";
-const u = (e, t = 0, o = 1) => e > o ? o : e < t ? t : e, s = (e, t = 0, o = Math.pow(10, t)) => Math.round(o * e) / o, F = (e) => O(v(e)), v = (e) => (e[0] === "#" && (e = e.substring(1)), e.length < 6 ? {
+const d = (e, t = 0, o = 1) => e > o ? o : e < t ? t : e, s = (e, t = 0, o = Math.pow(10, t)) => Math.round(o * e) / o, F = (e) => O(v(e)), v = (e) => (e[0] === "#" && (e = e.substring(1)), e.length < 6 ? {
   r: parseInt(e[0] + e[0], 16),
   g: parseInt(e[1] + e[1], 16),
   b: parseInt(e[2] + e[2], 16),
@@ -33,12 +33,12 @@ const u = (e, t = 0, o = 1) => e > o ? o : e < t ? t : e, s = (e, t = 0, o = Mat
     b: s([n, n, p, o, o, a][b] * 255),
     a: s(i, 2)
   };
-}, d = (e) => {
+}, u = (e) => {
   const t = e.toString(16);
   return t.length < 2 ? "0" + t : t;
 }, D = ({ r: e, g: t, b: o, a: i }) => {
-  const r = i < 1 ? d(s(i * 255)) : "";
-  return "#" + d(e) + d(t) + d(o) + r;
+  const r = i < 1 ? u(s(i * 255)) : "";
+  return "#" + u(e) + u(t) + u(o) + r;
 }, O = ({ r: e, g: t, b: o, a: i }) => {
   const r = Math.max(e, t, o), n = r - Math.min(e, t, o), a = n ? r === e ? (t - o) / n : r === t ? 2 + (o - e) / n : 4 + (e - t) / n : 0;
   return {
@@ -67,8 +67,8 @@ let c = !1;
 const k = (e) => "touches" in e, R = (e) => c && !k(e) ? !1 : (c || (c = k(e)), !0), C = (e, t) => {
   const o = k(t) ? t.touches[0] : t, i = e.el.getBoundingClientRect();
   x(e.el, "move", e.getMove({
-    x: u((o.pageX - (i.left + window.pageXOffset)) / i.width),
-    y: u((o.pageY - (i.top + window.pageYOffset)) / i.height)
+    x: d((o.pageX - (i.left + window.pageXOffset)) / i.width),
+    y: d((o.pageY - (i.top + window.pageYOffset)) / i.height)
   }));
 }, V = (e, t) => {
   const o = t.keyCode;
@@ -129,7 +129,7 @@ class j extends _ {
     ]), this.el.setAttribute("aria-valuenow", `${s(t)}`);
   }
   getMove(t, o) {
-    return { h: o ? u(this.h + t.x * 360, 0, 360) : 360 * t.x };
+    return { h: o ? d(this.h + t.x * 360, 0, 360) : 360 * t.x };
   }
 }
 class X extends _ {
@@ -150,8 +150,8 @@ class X extends _ {
   }
   getMove(t, o) {
     return {
-      s: o ? u(this.hsva.s + t.x * 100, 0, 100) : t.x * 100,
-      v: o ? u(this.hsva.v - t.y * 100, 0, 100) : Math.round(100 - t.y * 100)
+      s: o ? d(this.hsva.s + t.x * 100, 0, 100) : t.x * 100,
+      v: o ? d(this.hsva.v - t.y * 100, 0, 100) : Math.round(100 - t.y * 100)
     };
   }
 }
@@ -253,9 +253,9 @@ const Z = ".sc-swirl-color-input-h{display:block;width:100%}.sc-swirl-color-inpu
     const e = this.invalid === !0 || this.invalid === !1 ? String(this.invalid) : void 0, t = T("color-input", {
       "color-input--inline": this.inline
     });
-    return l(B, { key: "8352e72b998968fc06ed04fae79859de65e356a0" }, l("div", { key: "47ea07d25b769067f820c0ffd40c2a2a0b01cb3c", class: t }, l("input", { key: "4df693430012a05e6ebf6cf9003260cb9638889e", "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : void 0, "aria-invalid": e, autoFocus: this.autoFocus, class: "color-input__input", disabled: this.disabled, maxLength: 7, onBlur: this.onBlur, onFocus: this.onFocus, onInput: this.onInput, placeholder: this.placeholder, ref: (o) => this.inputEl = o, required: this.required, spellcheck: "false", type: "text", value: this.value }), l("swirl-popover-trigger", { key: "c7bb0d269b99f311431ead2d595b32906959642d", swirlPopover: this.pickerId }, l("button", { key: "ce546a6fa398dfb87e2394424ecf4776f2421097", "aria-label": this.pickerButtonLabel, class: "color-input__preview-button", style: {
+    return l(B, { key: "213b89441241c7d48a4d7ff97361719c0795f51d" }, l("div", { key: "69c73c16eef0406f9bda5e7755befb2436d25ea5", class: t }, l("input", { key: "52bef5a281b565e4f3ab4db1b0cff4325cfd9686", "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : void 0, "aria-invalid": e, autoFocus: this.autoFocus, class: "color-input__input", disabled: this.disabled, maxLength: 7, onBlur: this.onBlur, onFocus: this.onFocus, onInput: this.onInput, placeholder: this.placeholder, ref: (o) => this.inputEl = o, required: this.required, spellcheck: "false", type: "text", value: this.value }), l("swirl-popover-trigger", { key: "99d651102293d8f2cab5fc0e7c21b21c3152d4dc", swirlPopover: this.pickerId }, l("button", { key: "1d2155711ae5715be03cab8aa596edad59721279", "aria-label": this.pickerButtonLabel, class: "color-input__preview-button", style: {
       backgroundColor: this.disabled ? "var(--s-border-subdued)" : this.value
-    }, type: "button" })), l("swirl-popover", { key: "c60b54773d946bed2421914cf18e074065f62e9e", animation: "scale-in-y", id: this.pickerId, label: this.pickerLabel, placement: "bottom-end" }, l("swirl-box", { key: "63ce435b1e85f527ce2d030b7014901043989cb0", centerInline: !0, paddingBlockEnd: "8", paddingBlockStart: "8", paddingInlineEnd: "16", paddingInlineStart: "16" }, l("hex-color-picker", { key: "50d27fb9cb3185a2a460de66042d3754e7e6cebb", color: this.value, ref: (o) => this.picker = o })))));
+    }, type: "button" })), l("swirl-popover", { key: "dc83a20f750d85490e461127be048a085e7ebba8", animation: "scale-in-y", id: this.pickerId, label: this.pickerLabel, placement: "bottom-end" }, l("swirl-box", { key: "04f1a6ca6369efb970d7bd28b515d78729a253ca", centerInline: !0, paddingBlockEnd: "8", paddingBlockStart: "8", paddingInlineEnd: "16", paddingInlineStart: "16" }, l("hex-color-picker", { key: "bb33db580d6046a7804d79e9b927fc666cc47e8e", color: this.value, ref: (o) => this.picker = o })))));
   }
   static get watchers() {
     return {

package/dist/{swirl-columns.entry.14203bca.js → swirl-columns.entry.67bc0373.js}

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