@serendie/ui 2.1.3 → 2.2.0

package/dist/node_modules/@zag-js/popper/dist/index.js

@@ -1,7 +1,7 @@
-import { autoUpdate as S, offset as A, flip as D, shift as H, arrow as R, size as W, hide as B, computePosition as I, limitShift as T } from "../../../@floating-ui/dom/dist/floating-ui.dom.js";
-import { raf as V, isHTMLElement as k, getWindow as C, getComputedStyle as L } from "../../dom-query/dist/index.js";
-import { noop as N, isNull as j, runIfFn as U, compact as _ } from "../../utils/dist/index.js";
-function b(e = 0, t = 0, r = 0, i = 0) {
+import { autoUpdate as T, offset as I, flip as V, shift as Y, arrow as j, size as k, hide as C, computePosition as L, limitShift as N } from "../../../@floating-ui/dom/dist/floating-ui.dom.js";
+import { raf as U, isHTMLElement as X, getWindow as _, getComputedStyle as q } from "../../dom-query/dist/index.js";
+import { noop as G, isNull as J, compact as K } from "../../utils/dist/index.js";
+function R(e = 0, t = 0, r = 0, i = 0) {
   if (typeof DOMRect == "function")
     return new DOMRect(e, t, r, i);
   const n = {
@@ -16,55 +16,57 @@ function b(e = 0, t = 0, r = 0, i = 0) {
   };
   return { ...n, toJSON: () => n };
 }
-function q(e) {
-  if (!e) return b();
+function Q(e) {
+  if (!e) return R();
   const { x: t, y: r, width: i, height: n } = e;
-  return b(t, r, i, n);
+  return R(t, r, i, n);
 }
-function E(e, t) {
+function Z(e, t) {
   return {
-    contextElement: k(e) ? e : void 0,
+    contextElement: X(e) ? e : void 0,
     getBoundingClientRect: () => {
       const r = e, i = t == null ? void 0 : t(r);
-      return i || !r ? q(i) : r.getBoundingClientRect();
+      return i || !r ? Q(i) : r.getBoundingClientRect();
     }
   };
 }
-var u = (e) => ({ variable: e, reference: `var(${e})` }), f = {
-  arrowSize: u("--arrow-size"),
-  arrowSizeHalf: u("--arrow-size-half"),
-  arrowBg: u("--arrow-background"),
-  transformOrigin: u("--transform-origin"),
-  arrowOffset: u("--arrow-offset")
-}, G = (e) => ({
-  top: "bottom center",
-  "top-start": e ? `${e.x}px bottom` : "left bottom",
-  "top-end": e ? `${e.x}px bottom` : "right bottom",
-  bottom: "top center",
-  "bottom-start": e ? `${e.x}px top` : "top left",
-  "bottom-end": e ? `${e.x}px top` : "top right",
-  left: "right center",
-  "left-start": e ? `right ${e.y}px` : "right top",
-  "left-end": e ? `right ${e.y}px` : "right bottom",
-  right: "left center",
-  "right-start": e ? `left ${e.y}px` : "left top",
-  "right-end": e ? `left ${e.y}px` : "left bottom"
-}), J = {
-  name: "transformOrigin",
-  fn({ placement: e, elements: t, middlewareData: r }) {
-    const { arrow: i } = r, n = G(i)[e], { floating: o } = t;
-    return o.style.setProperty(f.transformOrigin.variable, n), {
-      data: { transformOrigin: n }
-    };
-  }
-}, Y = {
+var m = (e) => ({ variable: e, reference: `var(${e})` }), f = {
+  arrowSize: m("--arrow-size"),
+  arrowSizeHalf: m("--arrow-size-half"),
+  arrowBg: m("--arrow-background"),
+  transformOrigin: m("--transform-origin"),
+  arrowOffset: m("--arrow-offset")
+}, F = (e) => e === "top" || e === "bottom" ? "y" : "x";
+function E(e, t) {
+  return {
+    name: "transformOrigin",
+    fn(r) {
+      var A, H, D, W;
+      const { elements: i, middlewareData: n, placement: o, rects: c, y: s } = r, d = o.split("-")[0], l = F(d), a = ((A = n.arrow) == null ? void 0 : A.x) || 0, y = ((H = n.arrow) == null ? void 0 : H.y) || 0, w = (t == null ? void 0 : t.clientWidth) || 0, v = (t == null ? void 0 : t.clientHeight) || 0, p = a + w / 2, h = y + v / 2, x = Math.abs(((D = n.shift) == null ? void 0 : D.y) || 0), P = c.reference.height / 2, b = v / 2, g = ((W = e.offset) == null ? void 0 : W.mainAxis) ?? e.gutter, u = typeof g == "number" ? g + b : g ?? b, O = x > u, M = {
+        top: `${p}px calc(100% + ${u}px)`,
+        bottom: `${p}px ${-u}px`,
+        left: `calc(100% + ${u}px) ${h}px`,
+        right: `${-u}px ${h}px`
+      }[d], S = `${p}px ${c.reference.y + P - s}px`, z = !!e.overlap && l === "y" && O;
+      return i.floating.style.setProperty(
+        f.transformOrigin.variable,
+        z ? S : M
+      ), {
+        data: {
+          transformOrigin: z ? S : M
+        }
+      };
+    }
+  };
+}
+var ee = {
   name: "rects",
   fn({ rects: e }) {
     return {
       data: e
     };
   }
-}, K = (e) => {
+}, te = (e) => {
   if (e)
     return {
       name: "shiftArrow",
@@ -79,14 +81,14 @@ var u = (e) => ({ variable: e, reference: `var(${e})` }), f = {
       }
     };
 };
-function Q(e) {
+function re(e) {
   const [t, r] = e.split("-");
   return { side: t, align: r, hasAlign: r != null };
 }
-function de(e) {
+function me(e) {
   return e.split("-")[0];
 }
-var X = {
+var ne = {
   strategy: "absolute",
   placement: "bottom",
   listeners: !0,
@@ -99,121 +101,122 @@ var X = {
   overflowPadding: 8,
   arrowPadding: 4
 };
-function P(e, t) {
+function B(e, t) {
   const r = e.devicePixelRatio || 1;
   return Math.round(t * r) / r;
 }
-function M(e) {
-  return U(e.boundary);
+function $(e) {
+  return typeof e == "function" ? e() : e === "clipping-ancestors" ? "clippingAncestors" : e;
 }
-function Z(e, t) {
-  if (e)
-    return R({
-      element: e,
-      padding: t.arrowPadding
-    });
+function ie(e, t, r) {
+  const i = e || t.createElement("div");
+  return j({ element: i, padding: r.arrowPadding });
 }
-function F(e, t) {
-  if (!j(t.offset ?? t.gutter))
-    return A(({ placement: r }) => {
-      var d, a;
-      const i = ((e == null ? void 0 : e.clientHeight) || 0) / 2, n = ((d = t.offset) == null ? void 0 : d.mainAxis) ?? t.gutter, o = typeof n == "number" ? n + i : n ?? i, { hasAlign: c } = Q(r), s = c ? void 0 : t.shift, l = ((a = t.offset) == null ? void 0 : a.crossAxis) ?? s;
-      return _({
-        crossAxis: l,
+function oe(e, t) {
+  if (!J(t.offset ?? t.gutter))
+    return I(({ placement: r }) => {
+      var l, a;
+      const i = ((e == null ? void 0 : e.clientHeight) || 0) / 2, n = ((l = t.offset) == null ? void 0 : l.mainAxis) ?? t.gutter, o = typeof n == "number" ? n + i : n ?? i, { hasAlign: c } = re(r), s = c ? void 0 : t.shift, d = ((a = t.offset) == null ? void 0 : a.crossAxis) ?? s;
+      return K({
+        crossAxis: d,
         mainAxis: o,
         alignmentAxis: t.shift
       });
     });
 }
-function ee(e) {
-  if (e.flip)
-    return D({
-      boundary: M(e),
-      padding: e.overflowPadding,
-      fallbackPlacements: e.flip === !0 ? void 0 : e.flip
-    });
+function se(e) {
+  if (!e.flip) return;
+  const t = $(e.boundary);
+  return V({
+    ...t ? { boundary: t } : void 0,
+    padding: e.overflowPadding,
+    fallbackPlacements: e.flip === !0 ? void 0 : e.flip
+  });
 }
-function te(e) {
-  if (!(!e.slide && !e.overlap))
-    return H({
-      boundary: M(e),
-      mainAxis: e.slide,
-      crossAxis: e.overlap,
-      padding: e.overflowPadding,
-      limiter: T()
-    });
+function ae(e) {
+  if (!e.slide && !e.overlap) return;
+  const t = $(e.boundary);
+  return Y({
+    ...t ? { boundary: t } : void 0,
+    mainAxis: e.slide,
+    crossAxis: e.overlap,
+    padding: e.overflowPadding,
+    limiter: N()
+  });
 }
-function re(e) {
-  return W({
+function ce(e) {
+  return k({
     padding: e.overflowPadding,
     apply({ elements: t, rects: r, availableHeight: i, availableWidth: n }) {
-      const o = t.floating, c = Math.round(r.reference.width);
-      n = Math.floor(n), i = Math.floor(i), o.style.setProperty("--reference-width", `${c}px`), o.style.setProperty("--available-width", `${n}px`), o.style.setProperty("--available-height", `${i}px`);
+      const o = t.floating, c = Math.round(r.reference.width), s = Math.round(r.reference.height);
+      n = Math.floor(n), i = Math.floor(i), o.style.setProperty("--reference-width", `${c}px`), o.style.setProperty("--reference-height", `${s}px`), o.style.setProperty("--available-width", `${n}px`), o.style.setProperty("--available-height", `${i}px`);
     }
   });
 }
-function ne(e) {
-  var t;
+function fe(e) {
   if (e.hideWhenDetached)
-    return B({ strategy: "referenceHidden", boundary: ((t = e.boundary) == null ? void 0 : t.call(e)) ?? "clippingAncestors" });
+    return C({ strategy: "referenceHidden", boundary: $(e.boundary) ?? "clippingAncestors" });
 }
-function ie(e) {
+function de(e) {
   return e ? e === !0 ? { ancestorResize: !0, ancestorScroll: !0, elementResize: !0, layoutShift: !0 } : e : {};
 }
-function oe(e, t, r = {}) {
-  const i = E(e, r.getAnchorRect);
+function le(e, t, r = {}) {
+  const i = Z(e, r.getAnchorRect);
   if (!t || !i) return;
-  const n = Object.assign({}, X, r), o = t.querySelector("[data-part=arrow]"), c = [
-    F(o, n),
-    ee(n),
-    te(n),
-    Z(o, n),
-    K(o),
-    J,
-    re(n),
-    ne(n),
-    Y
-  ], { placement: s, strategy: l, onComplete: d, onPositioned: a } = n, h = async () => {
-    var x;
+  const n = Object.assign({}, ne, r), o = t.querySelector("[data-part=arrow]"), c = [
+    oe(o, n),
+    se(n),
+    ae(n),
+    ie(o, t.ownerDocument, n),
+    te(o),
+    E(
+      { gutter: n.gutter, offset: n.offset, overlap: n.overlap },
+      o
+    ),
+    ce(n),
+    fe(n),
+    ee
+  ], { placement: s, strategy: d, onComplete: l, onPositioned: a } = n, y = async () => {
+    var u;
     if (!i || !t) return;
-    const p = await I(i, t, {
+    const h = await L(i, t, {
       placement: s,
       middleware: c,
-      strategy: l
+      strategy: d
     });
-    d == null || d(p), a == null || a({ placed: !0 });
-    const y = C(t), $ = P(y, p.x), z = P(y, p.y);
-    t.style.setProperty("--x", `${$}px`), t.style.setProperty("--y", `${z}px`), n.hideWhenDetached && (((x = p.middlewareData.hide) == null ? void 0 : x.referenceHidden) ? (t.style.setProperty("visibility", "hidden"), t.style.setProperty("pointer-events", "none")) : (t.style.removeProperty("visibility"), t.style.removeProperty("pointer-events")));
-    const v = t.firstElementChild;
-    if (v) {
-      const w = L(v);
-      t.style.setProperty("--z-index", w.zIndex);
+    l == null || l(h), a == null || a({ placed: !0 });
+    const x = _(t), P = B(x, h.x), b = B(x, h.y);
+    t.style.setProperty("--x", `${P}px`), t.style.setProperty("--y", `${b}px`), n.hideWhenDetached && (((u = h.middlewareData.hide) == null ? void 0 : u.referenceHidden) ? (t.style.setProperty("visibility", "hidden"), t.style.setProperty("pointer-events", "none")) : (t.style.removeProperty("visibility"), t.style.removeProperty("pointer-events")));
+    const g = t.firstElementChild;
+    if (g) {
+      const O = q(g);
+      t.style.setProperty("--z-index", O.zIndex);
     }
-  }, m = async () => {
-    r.updatePosition ? (await r.updatePosition({ updatePosition: h }), a == null || a({ placed: !0 })) : await h();
-  }, O = ie(n.listeners), g = n.listeners ? S(i, t, m, O) : N;
-  return m(), () => {
-    g == null || g(), a == null || a({ placed: !1 });
+  }, w = async () => {
+    r.updatePosition ? (await r.updatePosition({ updatePosition: y, floatingElement: t }), a == null || a({ placed: !0 })) : await y();
+  }, v = de(n.listeners), p = n.listeners ? T(i, t, w, v) : G;
+  return w(), () => {
+    p == null || p(), a == null || a({ placed: !1 });
   };
 }
-function le(e, t, r = {}) {
-  const { defer: i, ...n } = r, o = i ? V : (s) => s(), c = [];
+function ye(e, t, r = {}) {
+  const { defer: i, ...n } = r, o = i ? U : (s) => s(), c = [];
   return c.push(
     o(() => {
-      const s = typeof e == "function" ? e() : e, l = typeof t == "function" ? t() : t;
-      c.push(oe(s, l, n));
+      const s = typeof e == "function" ? e() : e, d = typeof t == "function" ? t() : t;
+      c.push(le(s, d, n));
     })
   ), () => {
     c.forEach((s) => s == null ? void 0 : s());
   };
 }
-var ae = {
+var ue = {
   bottom: "rotate(45deg)",
   left: "rotate(135deg)",
   top: "rotate(225deg)",
   right: "rotate(315deg)"
 };
-function ue(e = {}) {
+function we(e = {}) {
   const { placement: t, sameWidth: r, fitViewport: i, strategy: n = "absolute" } = e;
   return {
     arrow: {
@@ -225,7 +228,7 @@ function ue(e = {}) {
     },
     arrowTip: {
       // @ts-expect-error - Fix this
-      transform: t ? ae[t.split("-")[0]] : void 0,
+      transform: t ? ue[t.split("-")[0]] : void 0,
       background: f.arrowBg.reference,
       top: "0",
       left: "0",
@@ -251,7 +254,7 @@ function ue(e = {}) {
   };
 }
 export {
-  le as getPlacement,
-  de as getPlacementSide,
-  ue as getPlacementStyles
+  ye as getPlacement,
+  me as getPlacementSide,
+  we as getPlacementStyles
 };

package/dist/node_modules/@zag-js/presence/dist/index.js

@@ -1,6 +1,6 @@
-import { setStyle as N, nextTick as d, raf as p, getComputedStyle as g, getEventTarget as v } from "../../dom-query/dist/index.js";
-import { createMachine as y } from "../../core/dist/index.js";
-import { createProps as f } from "../../types/dist/index.js";
+import { setStyle as N, nextTick as d, raf as p, getComputedStyle as g, getEventTarget as E } from "../../dom-query/dist/index.js";
+import { createMachine as v } from "../../core/dist/index.js";
+import { createProps as y } from "../../types/dist/index.js";
 function S(e, t) {
   const { state: i, send: n, context: s } = e, a = i.matches("mounted", "unmountSuspended");
   return {
@@ -14,7 +14,7 @@ function S(e, t) {
     }
   };
 }
-var O = y({
+var O = v({
   props({ props: e }) {
     return { ...e, present: !!e.present };
   },
@@ -39,14 +39,17 @@ var O = y({
     };
   },
   exit: ["clearInitial", "cleanupNode"],
-  watch({ track: e, action: t, prop: i }) {
-    e([() => i("present")], () => {
-      t(["setInitial", "syncPresence"]);
+  watch({ track: e, prop: t, send: i }) {
+    e([() => t("present")], () => {
+      i({ type: "PRESENCE.CHANGED" });
     });
   },
   on: {
     "NODE.SET": {
-      actions: ["setNode", "setStyles"]
+      actions: ["setupNode"]
+    },
+    "PRESENCE.CHANGED": {
+      actions: ["setInitial", "syncPresence"]
     }
   },
   states: {
@@ -93,18 +96,15 @@ var O = y({
       clearInitial: ({ context: e }) => {
         e.set("initial", !1);
       },
-      cleanupNode: ({ refs: e }) => {
-        e.set("node", null), e.set("styles", null);
-      },
       invokeOnExitComplete: ({ prop: e }) => {
         var t;
         (t = e("onExitComplete")) == null || t();
       },
-      setNode: ({ refs: e, event: t }) => {
-        e.set("node", t.node);
+      setupNode: ({ refs: e, event: t }) => {
+        e.get("node") !== t.node && (e.set("node", t.node), e.set("styles", g(t.node)));
       },
-      setStyles: ({ refs: e, event: t }) => {
-        e.set("styles", g(t.node));
+      cleanupNode: ({ refs: e }) => {
+        e.set("node", null), e.set("styles", null);
       },
       syncPresence: ({ context: e, refs: t, send: i, prop: n }) => {
         const s = n("present");
@@ -137,7 +137,7 @@ var O = y({
           (((c = (l = o.composedPath) == null ? void 0 : l.call(o)) == null ? void 0 : c[0]) ?? o.target) === n && e.set("prevAnimationName", u(t.get("styles")));
         }, a = (o) => {
           const m = u(t.get("styles"));
-          v(o) === n && m === e.get("unmountAnimationName") && i({ type: "UNMOUNT", src: "animationend" });
+          E(o) === n && m === e.get("unmountAnimationName") && i({ type: "UNMOUNT", src: "animationend" });
         };
         n.addEventListener("animationstart", s), n.addEventListener("animationcancel", a), n.addEventListener("animationend", a);
         const r = N(n, { animationFillMode: "forwards" });
@@ -151,7 +151,7 @@ var O = y({
 function u(e) {
   return (e == null ? void 0 : e.animationName) || "none";
 }
-f()(["onExitComplete", "present", "immediate"]);
+y()(["onExitComplete", "present", "immediate"]);
 export {
   S as connect,
   O as machine