@getflip/swirl-components-react 0.49.2 → 0.51.0

package/dist/{swirl-toast.entry.14b08b16.js → swirl-toast.entry.e87a03b2.js}

@@ -1,11 +1,11 @@
-import { r as o, c as n, h as i, H as r } from "./index.f0c9d31f.js";
+import { r as a, c as n, h as i, H as r } from "./index.576baf6f.js";
 import { c as d } from "./index-d280dafb.186cdb0e.js";
 import { a as c } from "./utils-61f188cc.4a43deab.js";
 import "react";
 import "react-dom";
-const l = ":host{display:flex}:host *{box-sizing:border-box}.toast{display:flex;width:100%;max-width:28rem;padding:var(--s-space-16);border-radius:var(--s-border-radius-sm);color:var(--s-text-on-status);background-color:var(--s-surface-neutral-default);box-shadow:var(--s-shadow-level-2)}.toast--intent-critical{background-color:var(--s-surface-critical-default)}.toast--intent-success{background-color:var(--s-surface-success-default)}.toast__icon{display:inline-flex;margin-top:calc(-1 * var(--s-space-2));margin-right:0.625rem;flex-shrink:0}.toast__icon ::part(icon){color:var(--s-icon-on-status)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.toast__icon{margin-top:0}}.toast__content{flex-grow:1;line-height:var(--s-line-height-base);text-align:left;align-self:flex-start}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.toast__content{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.toast__dismiss-button{display:inline-flex;min-width:1.5rem;height:1.5rem;margin-top:calc(-1 * var(--s-space-2));margin-left:var(--s-space-16);padding:0;flex-shrink:0;justify-content:center;align-items:center;border:none;color:var(--s-text-on-status);background-color:transparent;font:inherit;font-weight:var(--s-font-weight-semibold);cursor:pointer}.toast__dismiss-button ::part(icon){color:var(--s-icon-on-status)}", h = class {
+const l = ":host{display:flex}:host *{box-sizing:border-box}.toast{display:flex;width:100%;max-width:28rem;padding:var(--s-space-16);border-radius:var(--s-border-radius-sm);color:var(--s-text-on-status);background-color:var(--s-surface-neutral-default);box-shadow:var(--s-shadow-level-2)}.toast--intent-critical{background-color:var(--s-surface-critical-default)}.toast--intent-success{background-color:var(--s-surface-success-default)}.toast__icon{display:inline-flex;margin-top:calc(-1 * var(--s-space-2));margin-right:0.625rem;flex-shrink:0}.toast__icon ::part(icon){color:var(--s-icon-on-status)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.toast__icon{margin-top:0}}.toast__content{flex-grow:1;line-height:var(--s-line-height-base);text-align:left;align-self:flex-start}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.toast__content{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.toast__content ::part(link){color:var(--text-default)}.toast__dismiss-button{display:inline-flex;min-width:1.5rem;height:1.5rem;margin-top:calc(-1 * var(--s-space-2));margin-left:var(--s-space-16);padding:0;flex-shrink:0;justify-content:center;align-items:center;border:none;color:var(--s-text-on-status);background-color:transparent;font:inherit;font-weight:var(--s-font-weight-semibold);cursor:pointer}.toast__dismiss-button ::part(icon){color:var(--s-icon-on-status)}", h = class {
   constructor(s) {
-    o(this, s), this.dismiss = n(this, "dismiss", 7), this.desktopMediaQuery = c(), this.desktopMediaQueryHandler = (t) => {
+    a(this, s), this.dismiss = n(this, "dismiss", 7), this.desktopMediaQuery = c(), this.desktopMediaQueryHandler = (t) => {
       this.forceIconProps(t.matches);
     }, this.onDismiss = () => {
       this.dismiss.emit(this.toastId);
@@ -24,8 +24,8 @@ const l = ":host{display:flex}:host *{box-sizing:border-box}.toast{display:flex;
   }
   forceIconProps(s) {
     var t;
-    const e = (t = this.iconEl) === null || t === void 0 ? void 0 : t.children[0], a = this.dismissIconEl;
-    e == null || e.setAttribute("size", s ? "20" : "24"), a == null || a.setAttribute("size", s ? "20" : "24");
+    const e = (t = this.iconEl) === null || t === void 0 ? void 0 : t.children[0], o = this.dismissIconEl;
+    e == null || e.setAttribute("size", s ? "20" : "24"), o == null || o.setAttribute("size", s ? "20" : "24");
   }
   startTimer() {
     this.clearTimer(), this.duration !== void 0 && (this.timeout = setTimeout(() => {
@@ -37,7 +37,7 @@ const l = ":host{display:flex}:host *{box-sizing:border-box}.toast{display:flex;
   }
   render() {
     const s = d("toast", `toast--intent-${this.intent}`);
-    return i(r, null, i("div", { class: s }, this.icon && i("span", { class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (t) => this.iconEl = t }), i("span", { class: "toast__content", part: "toast__content" }, this.content), i("button", { "aria-label": this.dismissLabel || this.accessibleDismissLabel, class: "toast__dismiss-button", onClick: this.onDismiss, type: "button" }, this.dismissLabel, !Boolean(this.dismissLabel) && i("swirl-icon-close", { ref: (t) => this.dismissIconEl = t }))));
+    return i(r, null, i("div", { class: s }, this.icon && i("span", { class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (t) => this.iconEl = t }), i("span", { class: "toast__content", innerHTML: this.content, part: "toast__content" }, i("slot", null)), i("button", { "aria-label": this.dismissLabel || this.accessibleDismissLabel, class: "toast__dismiss-button", onClick: this.onDismiss, type: "button" }, this.dismissLabel, !Boolean(this.dismissLabel) && i("swirl-icon-close", { ref: (t) => this.dismissIconEl = t }))));
   }
   static get watchers() {
     return {

package/dist/{swirl-tooltip.entry.5284daf9.js → swirl-tooltip.entry.9c72e28c.js}

@@ -1,4 +1,4 @@
-import { r as n, h as i, H as l } from "./index.f0c9d31f.js";
+import { r as n, h as i, H as l } from "./index.576baf6f.js";
 import { c as r, o as p, s as h, f as d } from "./floating-ui.dom.esm-ac7cc24e.79b318e4.js";
 import "react";
 import "react-dom";

package/dist/{swirl-tree-navigation-item.entry.9ca316de.js → swirl-tree-navigation-item.entry.b27f4aca.js}

@@ -1,4 +1,4 @@
-import { r as t, h as i, H as s, g as r } from "./index.f0c9d31f.js";
+import { r as t, h as i, H as s, g as r } from "./index.576baf6f.js";
 import { c as o } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-video-thumbnail.entry.e83ab039.js → swirl-video-thumbnail.entry.9f3b96f4.js}

@@ -1,4 +1,4 @@
-import { r as t, h as n, H as e } from "./index.f0c9d31f.js";
+import { r as t, h as n, H as e } from "./index.576baf6f.js";
 import "react";
 import "react-dom";
 const a = `:host {

package/dist/{swirl-visually-hidden.entry.b0564329.js → swirl-visually-hidden.entry.ae2ad8fa.js}

@@ -1,4 +1,4 @@
-import { r as s, h as i, H as l } from "./index.f0c9d31f.js";
+import { r as s, h as i, H as l } from "./index.576baf6f.js";
 import "react";
 import "react-dom";
 const t = ":host{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)}", o = class {

package/dist/{wc-datepicker.entry.ec13114c.js → wc-datepicker.entry.afdff4e0.js}

@@ -1,4 +1,4 @@
-import { r as R, c as S, h as n, H, g as E } from "./index.f0c9d31f.js";
+import { r as R, c as S, h as n, H, g as E } from "./index.576baf6f.js";
 import "react";
 import "react-dom";
 function T(e, t) {

package/package.json

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

package/dist/swirl-pagination.entry.6cf37927.js

@@ -1,33 +0,0 @@
-import { r, c as s, h as e, H as p } from "./index.f0c9d31f.js";
-import { c as g } from "./index-d280dafb.186cdb0e.js";
-import "react";
-import "react-dom";
-const c = ":host{display:block;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:host *{box-sizing:border-box}.pagination{display:block;width:100%}.pagination--variant-simple .pagination__list{gap:0}.pagination__list{display:flex;margin:0;padding:0;justify-content:flex-start;align-items:center;line-height:var(--s-line-height-base);list-style:none}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.pagination__list{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.pagination__page-size-selection{display:flex;padding-right:var(--s-space-24);flex-shrink:0;align-items:center;color:var(--s-interactive-primary-default);white-space:nowrap;gap:var(--s-space-8)}.pagination__page-size-select-container{position:relative}.pagination__page-size-select{padding-right:calc(1rem + var(--s-space-4));border:none;color:var(--s-interactive-primary-default);background-color:transparent;font:inherit;font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.pagination__page-size-select:focus:not(:focus-visible){outline:none}.pagination__page-size-select:focus-visible{outline-color:var(--s-focus-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.pagination__page-size-select{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.pagination__page-size-select-icon{position:absolute;top:50%;right:0;transform:translateY(-50%);pointer-events:none}.pagination__page-label{padding-right:var(--s-space-8);padding-left:var(--s-space-8)}.pagination__advanced-label{display:flex;align-items:center;white-space:nowrap;gap:var(--s-space-8)}.pagination__page-select-container{position:relative}.pagination__page-select{display:inline-flex;padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);border:none;border-radius:var(--s-border-radius-sm);background-color:transparent;font:inherit;line-height:var(--s-line-height-base);text-align:center;cursor:pointer;box-shadow:inset 0 0 0 var(--s-border-width-default) var(--s-border-strong);-webkit-appearance:none;-moz-appearance:none;appearance:none}.pagination__page-select:focus:not(:focus-visible){outline:none}.pagination__page-select:focus-visible{outline-color:var(--s-focus-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.pagination__page-select{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}", h = class {
-  constructor(n) {
-    r(this, n), this.setPage = s(this, "setPage", 7), this.setPageSize = s(this, "setPageSize", 7), this.onFirstPageButtonClick = () => {
-      this.page !== 1 && this.setPage.emit(1);
-    }, this.onLastPageButtonClick = () => {
-      this.page !== this.pages && this.setPage.emit(this.pages);
-    }, this.onPrevButtonClick = () => {
-      const i = Math.max(this.page - 1, 1);
-      this.page !== i && this.setPage.emit(i);
-    }, this.onNextButtonClick = () => {
-      const i = Math.min(this.page + 1, this.pages);
-      this.page !== i && this.setPage.emit(i);
-    }, this.onSelect = (i) => {
-      const a = +i.target.value;
-      this.page !== a && this.setPage.emit(a);
-    }, this.onPageSizeSelect = (i) => {
-      const a = +i.target.value;
-      this.pageSize !== a && this.setPageSize.emit(a);
-    }, this.firstPageButtonLabel = "First page", this.lastPageButtonLabel = "Last page", this.label = void 0, this.nextButtonLabel = "Next page", this.page = void 0, this.pageLabel = "out of", this.pages = void 0, this.pageSelectLabel = "Select a page", this.pageSize = 10, this.pageSizeOptions = [10, 25, 50], this.pageSizeSelectLabel = "Items per page:", this.prevButtonLabel = "Previous page", this.showPageSizeSelect = void 0, this.variant = "default";
-  }
-  render() {
-    const n = this.variant !== "simple", i = this.variant === "advanced", a = `${this.page} ${this.pageLabel} ${this.pages}`, o = g("pagination", `pagination--variant-${this.variant}`);
-    return e(p, null, e("nav", { "aria-label": this.label, class: o }, e("ul", { class: "pagination__list", part: "pagination__list" }, this.showPageSizeSelect && e("li", { class: "pagination__list-item" }, e("label", { class: "pagination__page-size-selection" }, e("swirl-text", null, this.pageSizeSelectLabel), e("swirl-stack", { align: "center", class: "pagination__page-size-select-container", orientation: "horizontal" }, e("select", { class: "pagination__page-size-select", onChange: this.onPageSizeSelect }, this.pageSizeOptions.map((t) => e("option", { key: t, selected: t === this.pageSize, value: t }, t))), e("swirl-icon-expand-more", { "aria-hidden": "true", class: "pagination__page-size-select-icon", size: 16 })))), e("li", { class: "pagination__list-item" }, e("swirl-button", { class: "pagination__first-page-button", disabled: this.page <= 1, hideLabel: !0, icon: "<swirl-icon-double-arrow-left></swirl-icon-double-arrow-left>", intent: "primary", label: this.firstPageButtonLabel, onClick: this.onFirstPageButtonClick })), e("li", { class: "pagination__list-item" }, e("swirl-button", { class: "pagination__prev-button", disabled: this.page <= 1, hideLabel: !0, icon: "<swirl-icon-chevron-left></swirl-icon-chevron-left>", intent: "primary", label: this.prevButtonLabel, onClick: this.onPrevButtonClick })), n ? e("li", { class: "pagination__list-item  pagination__page-label" }, e("span", null, i ? e("span", { "aria-current": "page", class: "pagination__advanced-label" }, e("span", { class: "pagination__page-select-container" }, e("select", { "aria-label": this.pageSelectLabel, class: "pagination__page-select", onChange: this.onSelect }, new Array(this.pages).fill(void 0).map((t, l) => l + 1).map((t) => e("option", { selected: this.page === t, value: String(t) }, t)))), e("span", { "aria-hidden": "true" }, this.pageLabel, " ", this.pages)) : e("span", { "aria-current": "page" }, a))) : e("li", { class: "pagination__list-item" }, e("swirl-visually-hidden", null, e("span", { "aria-current": "page" }, a))), e("li", { class: "pagination__list-item" }, e("swirl-button", { class: "pagination__next-button", disabled: this.page >= this.pages, hideLabel: !0, icon: "<swirl-icon-chevron-right></swirl-icon-chevron-right>", iconPosition: "end", intent: "primary", label: this.nextButtonLabel, onClick: this.onNextButtonClick })), e("li", { class: "pagination__list-item" }, e("swirl-button", { class: "pagination__last-page-button", disabled: this.page >= this.pages, hideLabel: !0, icon: "<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>", intent: "primary", label: this.lastPageButtonLabel, onClick: this.onLastPageButtonClick })))));
-  }
-};
-h.style = c;
-export {
-  h as swirl_pagination
-};