@getflip/swirl-components-react 0.140.0 → 0.141.0

package/dist/{swirl-table-cell.entry.0caba048.js → swirl-table-cell.entry.85a43029.js}

@@ -1,4 +1,4 @@
-import { r as e, h as s, H as l } from "./index.6c144916.js";
+import { r as e, h as s, H as l } from "./index.0e867c19.js";
 import "react";
 import "react-dom";
 const t = ":host{display:flex;overflow:auto;padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);flex-basis:0;flex-grow:1;flex-shrink:1;align-items:center;background-color:var(--s-surface-default);word-break:break-word;-webkit-hyphens:auto;hyphens:auto;transition:box-shadow 0.15s}:host(.table-cell--has-shadow-right){box-shadow:var(--swirl-table-sticky-right-shadow)}:host(.table-cell--has-shadow-left){box-shadow:var(--swirl-table-sticky-left-shadow)}:host *{box-sizing:border-box}", o = class {

package/dist/{swirl-table-column.entry.4e5734b9.js → swirl-table-column.entry.253787ef.js}

@@ -1,4 +1,4 @@
-import { r as e, h as t, H as i, g as r } from "./index.6c144916.js";
+import { r as e, h as t, H as i, g as r } from "./index.0e867c19.js";
 import { c as o } from "./utils-9f141e25.a4ae3adc.js";
 import "react";
 import "react-dom";

package/dist/{swirl-table-row-group.entry.382e7746.js → swirl-table-row-group.entry.b60d78ab.js}

@@ -1,4 +1,4 @@
-import { r as o, h as r, H as s, g as t } from "./index.6c144916.js";
+import { r as o, h as r, H as s, g as t } from "./index.0e867c19.js";
 import "react";
 import "react-dom";
 const a = ":host{position:relative;z-index:1;display:block}:host *{box-sizing:border-box}.table-row-group__header-row{padding:var(--s-space-12) var(--s-space-16);border-bottom:var(--s-border-width-default) solid var(--s-border-default);background-color:var(--s-surface-raised-default);font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-sm)}@media (min-width: 768px){.table-row-group__label{position:sticky;left:var(--s-space-16)}}", l = class {

package/dist/{swirl-table-row.entry.86d12d08.js → swirl-table-row.entry.129a0f49.js}

@@ -1,4 +1,4 @@
-import { r as s, h as e, H as o, g as r } from "./index.6c144916.js";
+import { r as s, h as e, H as o, g as r } from "./index.0e867c19.js";
 import { c as l } from "./index-d280dafb.186cdb0e.js";
 import { c as i } from "./utils-9f141e25.a4ae3adc.js";
 import "react";

package/dist/{swirl-table.entry.36ae8de1.js → swirl-table.entry.4bdac003.js}

@@ -1,4 +1,4 @@
-import { r as g, h as r, H as _, g as v } from "./index.6c144916.js";
+import { r as g, h as r, H as _, g as v } from "./index.0e867c19.js";
 import { d as S, i as R } from "./utils-9f141e25.a4ae3adc.js";
 import "react";
 import "react-dom";

package/dist/{swirl-tabs.entry.aa292eca.js → swirl-tabs.entry.3b2be2d4.js}

@@ -1,4 +1,4 @@
-import { r as e, c as b, h as s, H as c, g as n } from "./index.6c144916.js";
+import { r as e, c as b, h as s, H as c, g as n } from "./index.0e867c19.js";
 import "react";
 import "react-dom";
 const r = ".sc-swirl-tabs-h{display:block;width:100%}.sc-swirl-tabs-h *.sc-swirl-tabs{box-sizing:border-box}.tabs.sc-swirl-tabs{width:100%}", h = class {

package/dist/{swirl-text-input.entry.8e1c3d88.js → swirl-text-input.entry.c4715762.js}

@@ -1,4 +1,4 @@
-import { r as h, c as n, h as i, H as d } from "./index.6c144916.js";
+import { r as h, c as n, h as i, H as d } from "./index.0e867c19.js";
 import { c } from "./index-d280dafb.186cdb0e.js";
 import { g as x } from "./utils-9f141e25.a4ae3adc.js";
 import "react";

package/dist/{swirl-text.entry.55301a94.js → swirl-text.entry.17d9c5cf.js}

@@ -1,4 +1,4 @@
-import { r as ot, h as Y, H as at, g as lt } from "./index.6c144916.js";
+import { r as ot, h as Y, H as at, g as lt } from "./index.0e867c19.js";
 import { a as ct, c as ht, b as dt } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-theme-provider.entry.a6f63682.js → swirl-theme-provider.entry.3acb65d0.js}

@@ -1,4 +1,4 @@
-import { r as a, c as m, h, H as d } from "./index.6c144916.js";
+import { r as a, c as m, h, H as d } from "./index.0e867c19.js";
 import "react";
 import "react-dom";
 const c = ".sc-swirl-theme-provider-h{display:block}", o = "swirl-preferred-theme", l = class {

package/dist/{swirl-time-input.entry.2dd7e5d6.js → swirl-time-input.entry.88168c41.js}

@@ -1,4 +1,4 @@
-import { r as c, c as d, h as a, H as p, g as m } from "./index.6c144916.js";
+import { r as c, c as d, h as a, H as p, g as m } from "./index.0e867c19.js";
 import { c as f } from "./index-d280dafb.186cdb0e.js";
 import { p as r, i as o, f as l, m as v } from "./maska-4866b970.5336f9cb.js";
 import { g as w } from "./utils-9f141e25.a4ae3adc.js";

package/dist/{swirl-toast-provider.entry.d0903c6a.js → swirl-toast-provider.entry.34e3a908.js}

@@ -1,4 +1,4 @@
-import { r, h as o, H as n } from "./index.6c144916.js";
+import { r, h as o, H as n } from "./index.0e867c19.js";
 import "react";
 import "react-dom";
 const h = class {

package/dist/{swirl-toast.entry.63e67341.js → swirl-toast.entry.b9124c02.js}

@@ -1,4 +1,4 @@
-import { r as o, c as n, h as i, H as r } from "./index.6c144916.js";
+import { r as o, c as n, h as i, H as r } from "./index.0e867c19.js";
 import { c } from "./index-d280dafb.186cdb0e.js";
 import { g as d } from "./utils-9f141e25.a4ae3adc.js";
 import "react";

package/dist/{swirl-toolbar.entry.6305cb10.js → swirl-toolbar.entry.c6376716.js}

@@ -1,4 +1,4 @@
-import { r as n, h as s, H as i, g as r } from "./index.6c144916.js";
+import { r as n, h as s, H as i, g as r } from "./index.0e867c19.js";
 import { a } from "./utils-9f141e25.a4ae3adc.js";
 import "react";
 import "react-dom";

package/dist/swirl-tooltip.entry.d921c44b.js

@@ -0,0 +1,92 @@
+import { r as p, h as o, H as h, g as d } from "./index.0e867c19.js";
+import { b as c, c as m, a as u, o as w, s as f, f as b } from "./floating-ui.dom.esm-b73e243b.647a7c7e.js";
+import { c as _ } from "./index-d280dafb.186cdb0e.js";
+import "react";
+import "react-dom";
+const y = ":host{display:contents}:host *{box-sizing:border-box}.tooltip{display:contents}.tooltip--visible .tooltip__popper{animation:tooltip-fade-in 0.15s;animation-delay:0.1s;animation-fill-mode:forwards;opacity:0}.tooltip--actual-placement-top .tooltip__arrow{top:calc(100% - 0.0625rem);transform:translate3d(0, -50%, 0) rotate(45deg)}.tooltip--actual-placement-bottom .tooltip__arrow{bottom:calc(100% - 0.0625rem);transform:translate3d(0, 50%, 0) rotate(45deg)}.tooltip--actual-placement-left .tooltip__arrow{left:calc(100% - 0.0625rem);transform:translate3d(-50%, 0, 0) rotate(45deg)}.tooltip--actual-placement-right .tooltip__arrow{right:calc(100% - 0.0625rem);transform:translate3d(50%, 0, 0) rotate(45deg)}.tooltip .tooltip__reference{display:contents}.tooltip__popper{position:absolute;z-index:var(--s-z-40);max-width:17.5rem;opacity:0}.tooltip__bubble{position:relative;display:block;padding-top:var(--s-space-8);padding-right:var(--s-space-12);padding-bottom:calc(var(--s-space-8) + 0.0625rem);padding-left:var(--s-space-12);border-radius:var(--s-border-radius-sm);color:var(--s-text-on-status);background-color:var(--s-surface-neutral-default);line-height:var(--s-line-height-base);box-shadow:var(--s-shadow-level-2)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.tooltip__bubble{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.tooltip__arrow{position:absolute;width:0.6875rem;height:0.6875rem;border-radius:0.125rem;background-color:var(--s-surface-neutral-default)}@keyframes tooltip-fade-in{from{opacity:0}to{opacity:1}}", g = class {
+  constructor(a) {
+    p(this, a), this.onKeydown = (t) => {
+      t.code === "Escape" && this.hide();
+    }, this.reposition = async () => {
+      var n, r;
+      const t = this.el.children[0];
+      if (!Boolean(t) || !Boolean(this.popperEl))
+        return;
+      const s = [
+        ...this.options.middleware.filter((l) => l.name !== "arrow"),
+        c({ element: this.arrowElement, padding: 12 })
+      ];
+      this.actualPosition = await m(t, this.popperEl, { ...this.options, middleware: s });
+      const e = (n = this.actualPosition.middlewareData.arrow) == null ? void 0 : n.x, i = (r = this.actualPosition.middlewareData.arrow) == null ? void 0 : r.y;
+      this.arrowStyles = {
+        left: Boolean(e) ? e + "px" : void 0,
+        top: Boolean(i) ? i + "px" : void 0
+      };
+    }, this.show = () => {
+      this.visible = !0, requestAnimationFrame(() => {
+        const t = this.el.children[0];
+        !Boolean(t) || (this.reposition(), this.disableAutoUpdate = u(t, this.popperEl, this.reposition.bind(this)));
+      });
+    }, this.showWithDelay = () => {
+      Boolean(this.showTimeout) && (clearTimeout(this.showTimeout), this.showTimeout = void 0), this.showTimeout = setTimeout(() => {
+        this.show();
+      }, this.delay);
+    }, this.hide = () => {
+      var t;
+      Boolean(this.showTimeout) && (clearTimeout(this.showTimeout), this.showTimeout = void 0), this.visible = !1, (t = this.disableAutoUpdate) == null || t.call(this);
+    }, this.updateOptions = () => {
+      const t = +getComputedStyle(document.documentElement).getPropertyValue("--s-space-12").replace("rem", "") * 16;
+      this.options = {
+        middleware: [w(t), f(), b()],
+        placement: this.position,
+        strategy: "absolute"
+      };
+    }, this.content = void 0, this.delay = 300, this.position = "top", this.actualPosition = void 0, this.arrowStyles = void 0, this.visible = !1;
+  }
+  watchPosition() {
+    this.updateOptions();
+  }
+  onMouseEnter() {
+    this.showWithDelay();
+  }
+  onMouseLeave() {
+    this.hide();
+  }
+  onWindowResize() {
+    this.reposition();
+  }
+  onWindowScroll() {
+    this.reposition();
+  }
+  componentWillLoad() {
+    this.reposition();
+  }
+  componentDidLoad() {
+    this.updateOptions();
+  }
+  render() {
+    var t, s, e;
+    const a = _("tooltip", `tooltip--actual-placement-${(t = this.actualPosition) == null ? void 0 : t.placement}`, {
+      "tooltip--visible": this.visible
+    });
+    return o(h, { onKeydown: this.onKeydown }, o("span", { class: a }, o("span", { class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.hide, onClick: this.hide, onFocusin: this.show }, o("slot", null)), o("span", { class: "tooltip__popper", ref: (i) => this.popperEl = i, style: {
+      top: Boolean(this.actualPosition) ? `${(s = this.actualPosition) == null ? void 0 : s.y}px` : "",
+      left: Boolean(this.actualPosition) ? `${(e = this.actualPosition) == null ? void 0 : e.x}px` : ""
+    } }, this.visible && o("span", { class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, o("span", { class: "tooltip__content", innerHTML: this.content })), o("span", { class: "tooltip__arrow", ref: (i) => this.arrowElement = i, style: {
+      ...this.arrowStyles,
+      visibility: this.visible ? "visible" : "hidden"
+    } }))));
+  }
+  get el() {
+    return d(this);
+  }
+  static get watchers() {
+    return {
+      position: ["watchPosition"]
+    };
+  }
+};
+g.style = y;
+export {
+  g as swirl_tooltip
+};

package/dist/{swirl-tree-navigation-item.entry.d1dd6bc8.js → swirl-tree-navigation-item.entry.a0287ec9.js}

@@ -1,4 +1,4 @@
-import { r as a, h as i, H as s, g as r } from "./index.6c144916.js";
+import { r as a, h as i, H as s, g as r } from "./index.0e867c19.js";
 import { c as o } from "./index-d280dafb.186cdb0e.js";
 import "react";
 import "react-dom";

package/dist/{swirl-video-thumbnail.entry.6993d99f.js → swirl-video-thumbnail.entry.cbfd111f.js}

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

package/dist/{swirl-visually-hidden.entry.6ec257c9.js → swirl-visually-hidden.entry.9a18c5a7.js}

@@ -1,4 +1,4 @@
-import { r, h as i, H as l } from "./index.6c144916.js";
+import { r, h as i, H as l } from "./index.0e867c19.js";
 import "react";
 import "react-dom";
 const e = ".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)}", n = class {

package/dist/{wc-datepicker.entry.8f8ae5c3.js → wc-datepicker.entry.1e1fb5a2.js}

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

package/package.json

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