@getflip/swirl-components-react 0.233.0 → 0.234.0

package/dist/{swirl-time-input.entry.9ebd02a1.js → swirl-time-input.entry.9778003a.js}

@@ -1,11 +1,11 @@
-import { r as c, c as u, h as a, H as p, g as m } from "./index.0ab635d6.js";
+import { r as c, c as u, h as a, H as p, g as m } from "./index.3ef725a9.js";
 import { c as f } from "./index-267776a4.6beb4f4b.js";
 import { p as r, i as o, f as d, m as v } from "./maska-c5119b9a.aa658697.js";
 import { g as w } from "./utils-c16952ba.529dd544.js";
 import "react";
 import "react-dom";
 import "./_commonjsHelpers-d20b9603.2d9b8855.js";
-const b = ".sc-swirl-time-input-h{display:flex;width:100%}.sc-swirl-time-input-h *.sc-swirl-time-input{box-sizing:border-box}.time-input.sc-swirl-time-input{position:relative;display:flex;width:100%;align-items:center;color:var(--s-text-default);line-height:var(--s-line-height-sm)}.time-input--inline.sc-swirl-time-input .time-input__icon.sc-swirl-time-input{top:-0.0625rem}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.time-input--inline.sc-swirl-time-input .time-input__icon.sc-swirl-time-input{top:0}}.time-input__input.sc-swirl-time-input{display:inline-flex;width:calc(100% - 1.25rem - var(--s-space-8));margin:0;padding:0;border:none;color:var(--s-text-default);background-color:transparent;font:inherit;font-size:var(--s-font-size-base);line-height:var(--s-line-height-base);caret-color:var(--s-border-highlight)}.time-input__input.sc-swirl-time-input:focus{outline:none}.time-input__input.sc-swirl-time-input:disabled{color:var(--s-text-disabled);background-color:transparent}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.time-input__input.sc-swirl-time-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.time-input__icon.sc-swirl-time-input{position:absolute;top:calc(-1 * var(--s-space-12));right:0;display:inline-flex;margin:0;padding:0;border:none;color:var(--s-icon-default);background-color:transparent}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.time-input__icon.sc-swirl-time-input{top:-0.625rem}}", g = b, l = "HH:mm:ss", k = class {
+const g = ".sc-swirl-time-input-h{display:flex;width:100%}.sc-swirl-time-input-h *.sc-swirl-time-input{box-sizing:border-box}.time-input.sc-swirl-time-input{position:relative;display:flex;width:100%;align-items:center;color:var(--s-text-default);line-height:var(--s-line-height-sm)}.time-input--inline.sc-swirl-time-input .time-input__icon.sc-swirl-time-input{top:-0.0625rem}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.time-input--inline.sc-swirl-time-input .time-input__icon.sc-swirl-time-input{top:0}}.time-input__input.sc-swirl-time-input{display:inline-flex;width:calc(100% - 1.25rem - var(--s-space-8));margin:0;padding:0;border:none;color:var(--s-text-default);background-color:transparent;font:inherit;font-size:var(--s-font-size-base);line-height:var(--s-line-height-base);caret-color:var(--s-border-highlight)}.time-input__input.sc-swirl-time-input:focus{outline:none}.time-input__input.sc-swirl-time-input:disabled{color:var(--s-text-disabled);background-color:transparent}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.time-input__input.sc-swirl-time-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.time-input__icon.sc-swirl-time-input{position:absolute;top:calc(-1 * var(--s-space-12));right:0;display:inline-flex;margin:0;padding:0;border:none;color:var(--s-icon-default);background-color:transparent}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.time-input__icon.sc-swirl-time-input{top:-0.625rem}}", b = g, l = "HH:mm:ss", k = class {
   constructor(e) {
     c(this, e), this.inputBlur = u(this, "inputBlur", 7), this.inputFocus = u(this, "inputFocus", 7), this.valueChange = u(this, "valueChange", 7), this.desktopMediaQuery = w(), this.desktopMediaQueryHandler = (i) => {
       this.updateIconSize(i.matches);
@@ -62,7 +62,7 @@ const b = ".sc-swirl-time-input-h{display:flex;width:100%}.sc-swirl-time-input-h
     const e = this.invalid === !0 || this.invalid === !1 ? String(this.invalid) : void 0, i = Boolean(this.value) ? r(this.value, l, new Date()) : void 0, t = o(i) ? d(i, this.format) : void 0, s = f("time-input", {
       "time-input--inline": this.inline
     });
-    return a(p, { key: "2bb507836032c0d1dda9204edc739bcac4e9b0ef" }, a("div", { key: "2d60afcb5846554b16098e392faf8dbe57923cc4", class: s }, a("input", { key: "6e15b219a2e5bbc16d69b319bceb12e31d738ccd", "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : void 0, "aria-invalid": e, autoFocus: this.autoFocus, class: "time-input__input", disabled: this.disabled, id: this.id, inputmode: "numeric", onBlur: this.onBlur, onClick: this.onClick, onFocus: this.onFocus, onInput: this.onInput, placeholder: this.placeholder, ref: (n) => this.inputEl = n, required: this.required, type: "text", value: t }), a("span", { key: "6a133dc058c386b00e131399be73e96e61ca20a9", class: "time-input__icon" }, a("swirl-icon-time-outlined", { key: "fa224e112781bca97588c2713ccf0df8d169adbc", size: this.iconSize }))));
+    return a(p, { key: "d586b9e1b552b1e28d8930d7e2fe1d2cccabe23a" }, a("div", { key: "f989d8cb8dd3377e866528d5252613186f747957", class: s }, a("input", { key: "8e5b3e7e6715ee7f5e14604e552c8f726f8ce39a", "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : void 0, "aria-invalid": e, autoFocus: this.autoFocus, class: "time-input__input", disabled: this.disabled, id: this.id, inputmode: "numeric", onBlur: this.onBlur, onClick: this.onClick, onFocus: this.onFocus, onInput: this.onInput, placeholder: this.placeholder, ref: (n) => this.inputEl = n, required: this.required, type: "text", value: t }), a("span", { key: "3deb73ba9a9473278e1648ad3fc5bce1fea50606", class: "time-input__icon" }, a("swirl-icon-time-outlined", { key: "e90b15d581ac69d16cb324465199df0ccb84a85f", size: this.iconSize }))));
   }
   get el() {
     return m(this);
@@ -73,7 +73,7 @@ const b = ".sc-swirl-time-input-h{display:flex;width:100%}.sc-swirl-time-input-h
     };
   }
 };
-k.style = g;
+k.style = b;
 export {
   k as swirl_time_input
 };

package/dist/{swirl-toast-provider.entry.a387a017.js → swirl-toast-provider.entry.9a8a80f1.js}

@@ -1,4 +1,4 @@
-import { r, h as i, H as e } from "./index.0ab635d6.js";
+import { r, h as i, H as e } from "./index.3ef725a9.js";
 import "react";
 import "react-dom";
 const h = class {

package/dist/{swirl-toast.entry.72e2e886.js → swirl-toast.entry.cfadc03c.js}

@@ -1,4 +1,4 @@
-import { r as o, c as n, h as e, H as r } from "./index.0ab635d6.js";
+import { r as o, c as n, h as e, H as r } from "./index.3ef725a9.js";
 import { c as d } from "./index-267776a4.6beb4f4b.js";
 import { g as c } from "./utils-c16952ba.529dd544.js";
 import "react";

package/dist/{swirl-toolbar.entry.7a3ea7f0.js → swirl-toolbar.entry.7adeae0d.js}

@@ -1,4 +1,4 @@
-import { r as n, h as s, H as i, g as r } from "./index.0ab635d6.js";
+import { r as n, h as s, H as i, g as r } from "./index.3ef725a9.js";
 import { b as a } from "./utils-c16952ba.529dd544.js";
 import "react";
 import "react-dom";

package/dist/{swirl-tooltip.entry.ab546353.js → swirl-tooltip.entry.05af2e4e.js}

@@ -1,4 +1,4 @@
-import { r as p, h as o, H as c, g as d } from "./index.0ab635d6.js";
+import { r as p, h as o, H as c, g as d } from "./index.3ef725a9.js";
 import { b as h, c as m, a as u, o as f, s as w, f as b } from "./floating-ui.dom.esm-bef21834.ec4a9cbf.js";
 import { c as y } from "./index-267776a4.6beb4f4b.js";
 import "react";

package/dist/{swirl-tree-navigation-item.entry.5e9d1bd9.js → swirl-tree-navigation-item.entry.3d089b91.js}

@@ -1,4 +1,4 @@
-import { r, h as i, H as n, g as s } from "./index.0ab635d6.js";
+import { r, h as i, H as n, g as s } from "./index.3ef725a9.js";
 import { c as o } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";
@@ -7,11 +7,11 @@ const c = ":host{display:inline-flex;width:100%}:host *{box-sizing:border-box}.t
     r(this, e), this.active = void 0, this.href = void 0, this.icon = void 0, this.label = void 0, this.target = void 0;
   }
   render() {
-    const e = Boolean(this.href), a = e ? "a" : "button", t = o("tree-navigation-item", {
+    const e = Boolean(this.href), t = e ? "a" : "button", a = o("tree-navigation-item", {
       "tree-navigation-item--active": this.active,
       "tree-navigation-item--has-icon": Boolean(this.icon)
     });
-    return i(n, { key: "bc0922a0b7ceeb01a795f1c28b88e3cdf8410a1f" }, i(a, { key: "548c4dbd78c58c22ea9710ba9bef2ff9f067f8c4", class: t, href: this.href, target: this.target, type: e ? void 0 : "button" }, this.icon && i("span", { key: "27609a0804b6d329c3baa89a86cdbfa4ab9254ca", class: "tree-navigation-item__icon", innerHTML: this.icon }), i("span", { key: "4cd57af75992b13de974b33a7be6b356dbdf5858", class: "tree-navigation-item__label" }, this.label)));
+    return i(n, { key: "16553b2a3d732df9c9f901c7a3a243650302854b" }, i(t, { key: "92bf1e424b4313951aa9dbfae7954bd388e08577", class: a, href: this.href, target: this.target, type: e ? void 0 : "button" }, this.icon && i("span", { key: "02051b8f74c2335cc5a94169bd4eb872f6a619e3", class: "tree-navigation-item__icon", innerHTML: this.icon }), i("span", { key: "384eea1f7704d9e0d6958eabe2e6d293fafc2504", class: "tree-navigation-item__label" }, this.label)));
   }
   get el() {
     return s(this);

package/dist/{swirl-tree-view-item.entry.0215f592.js → swirl-tree-view-item.entry.25672a84.js}

@@ -1,4 +1,4 @@
-import { r as n, c as r, h as e, F as a, H as d, g as c } from "./index.0ab635d6.js";
+import { r as n, c as r, h as e, F as a, H as c, g as d } from "./index.3ef725a9.js";
 import { c as o } from "./index-267776a4.6beb4f4b.js";
 import "react";
 import "react-dom";
@@ -39,14 +39,14 @@ const h = ".sc-swirl-tree-view-item-h{display:block;flex-grow:1}.sc-swirl-tree-v
       "tree-view-item--active": this.active,
       "tree-view-item--has-tags": t
     });
-    return e(d, { key: "177446baadd42d3508d8c3fead6b179e26feedde", id: this.itemId, role: "none" }, e("li", { key: "72d29bdca3bbb72f398e4d481bdce1f2ce70b0a1", class: s, role: "none" }, e("a", { key: "6eb8a17c4b7982dd3445b9c7f24ecbc80a621ec6", "aria-current": this.active ? "page" : void 0, "aria-expanded": this.hasChildren ? String(this.expanded) : void 0, "aria-level": this.level + 1, "aria-owns": this.hasChildren ? `${this.itemId}-children` : void 0, "aria-selected": String(this.selected), class: "tree-view-item__link", href: this.href, onFocus: this.onFocus, style: {
+    return e(c, { key: "3bef1ae67a6b69390a3b541303d2cb0a5b4b0572", id: this.itemId, role: "none" }, e("li", { key: "76f801f429af865e5564d1a6de6beafc8ff091fc", class: s, role: "none" }, e("a", { key: "1fddde54d88f7de5e3d940e7a8f6b6df38428de0", "aria-current": this.active ? "page" : void 0, "aria-expanded": this.hasChildren ? String(this.expanded) : void 0, "aria-level": this.level + 1, "aria-owns": this.hasChildren ? `${this.itemId}-children` : void 0, "aria-selected": String(this.selected), class: "tree-view-item__link", href: this.href, onFocus: this.onFocus, style: {
       paddingLeft: `calc(${this.level} * var(--s-space-12) + var(--s-space-4))`
-    }, ref: (l) => this.link = l, role: "treeitem", tabIndex: this.selected ? 0 : -1 }, e("span", { key: "72ab5ef8765690990f04bb76d7dc610b4ae18f3b", class: "tree-view-item__toggle-icon" }, this.hasChildren && e(a, { key: "b6809cfdd91b53eb4d37c94ce899933daeb85020" }, this.expanded ? e("swirl-icon-expand-more", { onClick: this.onClickCollapse, size: 24 }) : e("swirl-icon-chevron-right", { onClick: this.onClickExpand, size: 24 }))), Boolean(this.icon) && e(a, { key: "040fccdd39595e4988b515257cd0a7fdb62a74e1" }, e("span", { key: "9a8121ef9e3b7e5a508345259550216ed02e6337", class: "tree-view-item__icon" }, i ? this.icon : e("swirl-icon", { glyph: this.icon, size: 24 }))), e("span", { key: "113f4b3cd34284bd6c0b022f8ca3d0fc8e28a5a1", class: "tree-view-item__label" }, this.label), e("span", { key: "b3b1efebbaf2b6e254d90570fba4ce61c5bd979b", class: "tree-view-item__tags" }, e("slot", { key: "f27e893394cd489ff21a36651b5cac353fbdf78e", name: "tags" }))), e("ul", { key: "3618fcdd7471c7642ed5d1aa566d9ca7615b9a6b", "aria-label": this.label, class: "tree-view-item__children", id: `${this.itemId}-children`, role: "group", style: {
+    }, ref: (l) => this.link = l, role: "treeitem", tabIndex: this.selected ? 0 : -1 }, e("span", { key: "4dc36fa94d7831a45986440e777a6e2ee9e64558", class: "tree-view-item__toggle-icon" }, this.hasChildren && e(a, { key: "0771bc5940d86bb482e71671adef637e52f031e2" }, this.expanded ? e("swirl-icon-expand-more", { onClick: this.onClickCollapse, size: 24 }) : e("swirl-icon-chevron-right", { onClick: this.onClickExpand, size: 24 }))), Boolean(this.icon) && e(a, { key: "fdd19fe265b067318bf6447504474cbfea067a3e" }, e("span", { key: "006b75550b8a438a64b920a24cc3a65b1e710574", class: "tree-view-item__icon" }, i ? this.icon : e("swirl-icon", { glyph: this.icon, size: 24 }))), e("span", { key: "5968fe73fcaeec498a00a08dd809feafc97924dd", class: "tree-view-item__label" }, this.label), e("span", { key: "c5c12f44f3d93fc9f4ac85487454fc900de708ff", class: "tree-view-item__tags" }, e("slot", { key: "0731b78236892a2da887153fd58a6ee2386477ca", name: "tags" }))), e("ul", { key: "1198cb06161c4667c853dc14df3d5363500d72e7", "aria-label": this.label, class: "tree-view-item__children", id: `${this.itemId}-children`, role: "group", style: {
       display: !this.expanded || !this.hasChildren ? "none" : void 0
-    } }, e("slot", { key: "caa44b704e4de4d2dbd6a297830d2d3d9453038e" }))));
+    } }, e("slot", { key: "8dc659440d40bc01edd389937586d9b02c4ef04a" }))));
   }
   get el() {
-    return c(this);
+    return d(this);
   }
 };
 m.style = w;

package/dist/{swirl-tree-view.entry.1e24d953.js → swirl-tree-view.entry.6bd837d7.js}

@@ -1,9 +1,9 @@
-import { r as p, c as h, h as o, H as u, g as I } from "./index.0ab635d6.js";
+import { r as p, c as u, h as c, H as I, g as h } from "./index.3ef725a9.js";
 import "react";
 import "react-dom";
-const g = ":host{display:block}:host *{box-sizing:border-box}.tree-view{display:flex;margin:0;padding:0;flex-direction:column;gap:var(--s-space-2)}", x = g, f = class {
+const E = ":host{display:block}:host *{box-sizing:border-box}.tree-view{display:flex;margin:0;padding:0;flex-direction:column;gap:var(--s-space-2)}", f = E, w = class {
   constructor(e) {
-    p(this, e), this.expandedItemsChanged = h(this, "expandedItemsChanged", 7), this.onSlotChange = () => {
+    p(this, e), this.itemExpansionChanged = u(this, "itemExpansionChanged", 7), this.onSlotChange = () => {
       this.init();
     }, this.initiallyExpandedItemIds = void 0, this.label = void 0;
   }
@@ -11,7 +11,7 @@ const g = ":host{display:block}:host *{box-sizing:border-box}.tree-view{display:
     Boolean(this.initiallyExpandedItemIds) && this.expandItems(this.initiallyExpandedItemIds), this.init();
   }
   async expandItems(e) {
-    this.getItems().filter((s) => e.includes(s.id)).forEach((s) => s.expand());
+    this.getItems().filter((s) => e.includes(s.itemId)).forEach((s) => s.expand());
   }
   onKeyDown(e) {
     e.key === "ArrowDown" ? (e.preventDefault(), this.selectNextItem()) : e.key === "ArrowUp" ? (e.preventDefault(), this.selectPreviousItem()) : e.key === "ArrowRight" ? (e.preventDefault(), this.expandSelectedItem()) : e.key === "ArrowLeft" ? (e.preventDefault(), this.collapseSelectedItem()) : e.key === "Home" ? (e.preventDefault(), this.selectFirstItem()) : e.key === "End" && (e.preventDefault(), this.selectLastItem());
@@ -22,8 +22,11 @@ const g = ":host{display:block}:host *{box-sizing:border-box}.tree-view{display:
     });
   }
   onExpandedChange(e) {
-    const t = this.getItems().filter((l) => this.isItemExpanded(l)).map((l) => l.id);
-    !Boolean(e.target.querySelector(':scope > li > [aria-expanded="true"]')) ? t.push(e.target.id) : t.splice(t.indexOf(e.target.id), 1), this.expandedItemsChanged.emit(t);
+    const t = e.target;
+    (t == null ? void 0 : t.tagName) === "SWIRL-TREE-VIEW-ITEM" && this.itemExpansionChanged.emit({
+      itemId: t.itemId,
+      expanded: e.detail
+    });
   }
   init() {
     var s;
@@ -61,16 +64,16 @@ const g = ":host{display:block}:host *{box-sizing:border-box}.tree-view{display:
     }
   }
   selectNextItem() {
-    var c;
+    var o;
     const e = this.getSelectedItem(), t = this.isItemExpanded(e), s = this.getNextSibling(e);
     let l = e.parentElement.closest("swirl-tree-view-item"), r = this.getNextSibling(l);
     for (; Boolean(l) && !Boolean(r); )
       l = l == null ? void 0 : l.parentElement.closest("swirl-tree-view-item, swirl-tree-view"), r = this.getNextSibling(l);
     const a = e.querySelector("swirl-tree-view-item"), n = t ? a : s || r;
-    !Boolean(n) || (this.unselectAllItems(), (c = n.select) == null || c.call(n, !0));
+    !Boolean(n) || (this.unselectAllItems(), (o = n.select) == null || o.call(n, !0));
   }
   selectPreviousItem() {
-    var n, c;
+    var n, o;
     const e = this.getItems(), t = this.getSelectedItem(), s = this.getPreviousSibling(t);
     if (Boolean(s == null ? void 0 : s.querySelector('[aria-expanded="true"]'))) {
       let i = s == null ? void 0 : s.querySelector(":scope > li > ul > swirl-tree-view-item:last-child, :scope > li > ul > *:last-child > swirl-tree-view-item"), d = Boolean(i == null ? void 0 : i.querySelector('[aria-expanded="true"]'));
@@ -80,7 +83,7 @@ const g = ":host{display:block}:host *{box-sizing:border-box}.tree-view{display:
       return;
     }
     const r = t.parentElement.closest("swirl-tree-view-item"), a = s || r;
-    !Boolean(a) || (e.forEach((i) => i.unselect()), (c = a.select) == null || c.call(a, !0));
+    !Boolean(a) || (e.forEach((i) => i.unselect()), (o = a.select) == null || o.call(a, !0));
   }
   unselectAllItems() {
     this.getItems().forEach((e) => e.unselect());
@@ -112,13 +115,13 @@ const g = ":host{display:block}:host *{box-sizing:border-box}.tree-view{display:
     return t != null ? t : void 0;
   }
   render() {
-    return o(u, { key: "339267c7110db49dfa92d4e36ea7359666969819" }, o("ul", { key: "730cceb516e83f1ef72c8552fc26a510d225f069", "aria-label": this.label, class: "tree-view", role: "tree" }, o("slot", { key: "dcde56962d621cfc40a170b80f9b8137809bf59e", onSlotchange: this.onSlotChange })));
+    return c(I, { key: "1218818fafaba0a17753a29e6b95b67b9a87a091" }, c("ul", { key: "9f6b24777a04f2475c50a4f7890a5d1acabb8eef", "aria-label": this.label, class: "tree-view", role: "tree" }, c("slot", { key: "85fe36c7f2fb7f1d259fd0758a6017bc827d958b", onSlotchange: this.onSlotChange })));
   }
   get el() {
-    return I(this);
+    return h(this);
   }
 };
-f.style = x;
+w.style = f;
 export {
-  f as swirl_tree_view
+  w as swirl_tree_view
 };

package/dist/{swirl-video-thumbnail.entry.c1e869fc.js → swirl-video-thumbnail.entry.f334c529.js}

@@ -1,4 +1,4 @@
-import { r as e, h as n, H as a } from "./index.0ab635d6.js";
+import { r as e, h as n, H as a } from "./index.3ef725a9.js";
 import "react";
 import "react-dom";
 const t = `:host {
@@ -79,7 +79,7 @@ const t = `:host {
     e(this, i), this.durationLabel = "Duration", this.duration = void 0, this.label = void 0, this.src = void 0;
   }
   render() {
-    return n(a, { key: "684edd972d557cc5802faf12d68a39c840d34031" }, n("button", { key: "65eb5646d91cd405b87c932b92b00365501c4974", "aria-describedby": this.duration !== void 0 ? "duration" : void 0, "aria-label": this.label, class: "video-thumbnail", type: "button" }, n("img", { key: "08cfb230f06c5ff59e66a0a0889dfc42ebfa7173", alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && n("span", { key: "47e734e3eb8502484ff75b70b40bc898e86a5d0b", class: "video-thumbnail__duration", id: "duration" }, n("swirl-visually-hidden", { key: "072d38dae3171d13d3f3659a56bd81c68ca857db" }, this.durationLabel), this.duration), n("svg", { key: "b2101678bd8ff47ccc11cb807d863599129ff018", class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, n("path", { key: "7d4ad04198b7c65616acd6e89288cc51baa5c99c", d: "M15 14.65V25.35C15 26.1167 15.35 26.7 16.05 27.1C16.75 27.5 17.4333 27.4667 18.1 27L26.4 21.7C27.0333 21.3 27.35 20.7333 27.35 20C27.35 19.2667 27.0333 18.7 26.4 18.3L18.1 13C17.4333 12.5333 16.75 12.5 16.05 12.9C15.35 13.3 15 13.8833 15 14.65ZM20 40C17.2333 40 14.6333 39.4747 12.2 38.424C9.76667 37.3747 7.65 35.95 5.85 34.15C4.05 32.35 2.62533 30.2333 1.576 27.8C0.525334 25.3667 0 22.7667 0 20C0 17.2333 0.525334 14.6333 1.576 12.2C2.62533 9.76667 4.05 7.65 5.85 5.85C7.65 4.05 9.76667 2.62467 12.2 1.574C14.6333 0.524667 17.2333 0 20 0C22.7667 0 25.3667 0.524667 27.8 1.574C30.2333 2.62467 32.35 4.05 34.15 5.85C35.95 7.65 37.3747 9.76667 38.424 12.2C39.4747 14.6333 40 17.2333 40 20C40 22.7667 39.4747 25.3667 38.424 27.8C37.3747 30.2333 35.95 32.35 34.15 34.15C32.35 35.95 30.2333 37.3747 27.8 38.424C25.3667 39.4747 22.7667 40 20 40Z", fill: "white", "fill-opacity": "0.95" }))));
+    return n(a, { key: "774f08a914cca7fc87f34bc876f2887f5bc5fa52" }, n("button", { key: "5b84fb303196af7d8f05155e3913495a763243d7", "aria-describedby": this.duration !== void 0 ? "duration" : void 0, "aria-label": this.label, class: "video-thumbnail", type: "button" }, n("img", { key: "7a77a017c95a8c7af0690e79e226d024f550c841", alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && n("span", { key: "cfa978c28234772dd2faaa1772b44f95c7c6bdad", class: "video-thumbnail__duration", id: "duration" }, n("swirl-visually-hidden", { key: "8aa09782ba772ae66898c9a459ae8d34ae553637" }, this.durationLabel), this.duration), n("svg", { key: "d8bd012d1f7e3a1ad7b718451d03de4f20c18978", class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, n("path", { key: "bd4470ab6ee91cb0add6dc1e975157827edbb82d", d: "M15 14.65V25.35C15 26.1167 15.35 26.7 16.05 27.1C16.75 27.5 17.4333 27.4667 18.1 27L26.4 21.7C27.0333 21.3 27.35 20.7333 27.35 20C27.35 19.2667 27.0333 18.7 26.4 18.3L18.1 13C17.4333 12.5333 16.75 12.5 16.05 12.9C15.35 13.3 15 13.8833 15 14.65ZM20 40C17.2333 40 14.6333 39.4747 12.2 38.424C9.76667 37.3747 7.65 35.95 5.85 34.15C4.05 32.35 2.62533 30.2333 1.576 27.8C0.525334 25.3667 0 22.7667 0 20C0 17.2333 0.525334 14.6333 1.576 12.2C2.62533 9.76667 4.05 7.65 5.85 5.85C7.65 4.05 9.76667 2.62467 12.2 1.574C14.6333 0.524667 17.2333 0 20 0C22.7667 0 25.3667 0.524667 27.8 1.574C30.2333 2.62467 32.35 4.05 34.15 5.85C35.95 7.65 37.3747 9.76667 38.424 12.2C39.4747 14.6333 40 17.2333 40 20C40 22.7667 39.4747 25.3667 38.424 27.8C37.3747 30.2333 35.95 32.35 34.15 34.15C32.35 35.95 30.2333 37.3747 27.8 38.424C25.3667 39.4747 22.7667 40 20 40Z", fill: "white", "fill-opacity": "0.95" }))));
   }
 };
 s.style = o;

package/dist/swirl-visually-hidden.entry.42ce50a7.js

@@ -0,0 +1,15 @@
+import { r as s, h as i, H as r } from "./index.3ef725a9.js";
+import "react";
+import "react-dom";
+const l = ".sc-swirl-visually-hidden-h{position:absolute;display:inline;overflow:hidden;width:1px;height:1px;margin:-1px;padding:0;border:0;white-space:nowrap;word-wrap:normal;clip:rect(0, 0, 0, 0)}", d = l, t = class {
+  constructor(e) {
+    s(this, e);
+  }
+  render() {
+    return i(r, { key: "51416ff908d08e75ba9942bf9db62f10da8e74bc" }, i("slot", { key: "039436bdcff7bf0c1441ec2e924c82e3bf56f9cd" }));
+  }
+};
+t.style = d;
+export {
+  t as swirl_visually_hidden
+};

package/dist/{wc-datepicker.entry.4a60b902.js → wc-datepicker.entry.8f9e4fb6.js}

@@ -1,4 +1,4 @@
-import { r as R, c as S, h as n, H, g as E } from "./index.0ab635d6.js";
+import { r as R, c as S, h as n, H, g as E } from "./index.3ef725a9.js";
 import "react";
 import "react-dom";
 function F(e, t) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@getflip/swirl-components-react",
-  "version": "0.233.0",
+  "version": "0.234.0",
   "type": "module",
   "files": [
     "dist"
@@ -18,7 +18,7 @@
     "build": "tsc && vite build"
   },
   "dependencies": {
-    "@getflip/swirl-components": "^0.233.0",
+    "@getflip/swirl-components": "^0.234.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },

package/dist/swirl-symbol-roadmap.entry.6e98c0a4.js

@@ -1,17 +0,0 @@
-import { r as a, h as e, F as t } from "./index.0ab635d6.js";
-import { c as o } from "./index-267776a4.6beb4f4b.js";
-import "react";
-import "react-dom";
-const r = ":host{display:inline-flex}", l = r, m = class {
-  constructor(s) {
-    a(this, s), this.size = 24;
-  }
-  render() {
-    const s = this.size === 20 ? 24 : this.size, i = o("swirl-symbol", `swirl-symbol--size-${this.size}`);
-    return e("svg", { key: "b6afa0a8132d693e0e66f2c0b3f7ecede0371488", class: i, fill: "none", height: this.size, part: "symbol", viewBox: `0 0 ${s} ${s}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, e(t, { key: "21feb72ac76b3d41a37beaaf05a44a94d30bb169" }, e("path", { key: "978c7bfb68cb9e648b1958a7914aa60388b0fe65", d: "M13 10H18L21 7L18 4H13V2H11V4H4V10H11V12H6L3 15L6 18H11V22H13V18H20V12H13V10ZM6 6H17.17L18.17 7L17.17 8H6V6ZM18 16H6.83L5.83 15L6.83 14H18V16Z", fill: "currentColor" })));
-  }
-};
-m.style = l;
-export {
-  m as swirl_symbol_roadmap
-};

package/dist/swirl-symbol-smartphone.entry.cf4bd67a.js

@@ -1,17 +0,0 @@
-import { r as i, h as e, F as o } from "./index.0ab635d6.js";
-import { c as r } from "./index-267776a4.6beb4f4b.js";
-import "react";
-import "react-dom";
-const l = ":host{display:inline-flex}", a = l, c = class {
-  constructor(s) {
-    i(this, s), this.size = 24;
-  }
-  render() {
-    const s = this.size === 20 ? 24 : this.size, t = r("swirl-symbol", `swirl-symbol--size-${this.size}`);
-    return e("svg", { key: "029f23247c826a7ef4e2b12dced9dc0db7685bae", class: t, fill: "none", height: this.size, part: "symbol", viewBox: `0 0 ${s} ${s}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, e(o, { key: "99e8b7772f43d109941b734d281369ff25cc8e7a" }, e("path", { key: "1f1116a2dee23ee6b9fc6432c5559b0e4eb3b7c7", d: "M17 1.01L7 1C5.9 1 5 1.9 5 3V21C5 22.1 5.9 23 7 23H17C18.1 23 19 22.1 19 21V3C19 1.9 18.1 1.01 17 1.01ZM17 19H7V5H17V19Z", fill: "currentColor" })));
-  }
-};
-c.style = a;
-export {
-  c as swirl_symbol_smartphone
-};

package/dist/swirl-visually-hidden.entry.d9a86b32.js

@@ -1,15 +0,0 @@
-import { r as s, h as e, H as r } from "./index.0ab635d6.js";
-import "react";
-import "react-dom";
-const d = ".sc-swirl-visually-hidden-h{position:absolute;display:inline;overflow:hidden;width:1px;height:1px;margin:-1px;padding:0;border:0;white-space:nowrap;word-wrap:normal;clip:rect(0, 0, 0, 0)}", l = d, a = class {
-  constructor(i) {
-    s(this, i);
-  }
-  render() {
-    return e(r, { key: "85adc71e753de16a93f0110be0b49a9eb8be1ea6" }, e("slot", { key: "491582dfecab0bcf9dbb4821d346db75b9e2f8ca" }));
-  }
-};
-a.style = l;
-export {
-  a as swirl_visually_hidden
-};