@orioncactuscorp/ui 1.2.0 → 1.4.0

package/dist/react/motion.js

@@ -1,170 +1,173 @@
 'use client';
-import { jsx as N } from "react/jsx-runtime";
-import { useRef as i, useState as k, useCallback as V, useEffect as y, useLayoutEffect as rt } from "react";
-import { createSpringAnimator as ct } from "../utils/spring/animator.js";
-import { resolveOcMotion as st } from "../utils/motion.js";
-const H = "block-size";
-function it(t, n) {
+import { jsx as H } from "react/jsx-runtime";
+import { useRef as s, useState as C, useCallback as j, useEffect as y, useLayoutEffect as ct } from "react";
+import { createSpringAnimator as st } from "../utils/spring/animator.js";
+import { resolveOcMotion as it } from "../utils/motion.js";
+const T = "block-size";
+function at(t, n) {
   typeof t == "function" ? t(n) : t && (t.current = n);
 }
-function j(t) {
-  const n = i(t);
+function q(t) {
+  const n = s(t);
   return y(() => {
     n.current = t;
   }, [t]), n;
 }
-function at() {
-  const [t, n] = k(() => typeof window > "u" || !window.matchMedia ? !1 : window.matchMedia("(prefers-reduced-motion: reduce)").matches);
+function ut() {
+  const [t, n] = C(() => typeof window > "u" || !window.matchMedia ? !1 : window.matchMedia("(prefers-reduced-motion: reduce)").matches);
   return y(() => {
     if (typeof window > "u" || !window.matchMedia) return;
-    const c = window.matchMedia("(prefers-reduced-motion: reduce)"), s = () => n(c.matches);
-    return s(), c.addEventListener("change", s), () => c.removeEventListener("change", s);
+    const r = window.matchMedia("(prefers-reduced-motion: reduce)"), c = () => n(r.matches);
+    return c(), r.addEventListener("change", c), () => r.removeEventListener("change", c);
   }, []), t;
 }
-function ut(t) {
+function lt(t) {
   if (!t) return 0;
   const n = t.getBoundingClientRect().height;
   return Math.max(0, n || t.scrollHeight);
 }
-function lt(t) {
+function dt(t) {
   return t ? Math.max(0, t.getBoundingClientRect().height) : 0;
 }
-function T(t) {
+function V(t) {
   return `${Math.max(0, t).toFixed(3)}px`;
 }
-function dt(t, n) {
-  const c = j(n), [s, l] = k(t), u = i(t), d = V(
-    (r) => {
-      u.current !== r && (u.current = r, l(r), c.current?.(r));
+function ft(t, n) {
+  const r = q(n), [c, d] = C(t), u = s(t), f = j(
+    (i) => {
+      u.current !== i && (u.current = i, d(i), r.current?.(i));
     },
-    [c]
+    [r]
   );
-  return { motionState: s, setMotionState: d };
+  return { motionState: c, setMotionState: f };
 }
-function gt({
+function St({
   children: t,
   className: n = "",
-  contentProps: c,
-  disableAnimation: s = !1,
-  durationScale: l = 1,
-  enterPhase: u = "enter",
-  exitPhase: d = "exit",
-  forceMount: r = !1,
-  intent: R = "reveal",
-  onExitComplete: q,
-  onMotionStateChange: A,
+  contentProps: r,
+  disableAnimation: c = !1,
+  durationFactor: d = 1,
+  extraBounce: u,
+  enterPhase: f = "enter",
+  exitPhase: i = "exit",
+  forceMount: l = !1,
+  intent: R = "expand",
+  onExitComplete: A,
+  onMotionStateChange: U,
   open: o,
-  pace: C = "normal",
-  reduced: z = "auto",
-  ref: F,
-  scheduler: b,
-  style: U,
-  "data-oc-component": W = "motion-reveal",
-  ...Y
+  pace: z = "normal",
+  reduced: b = "auto",
+  ref: W,
+  scheduler: x,
+  style: Y,
+  "data-oc-component": _ = "motion-expand",
+  ...$
 }) {
-  const L = i(null), B = i(null), a = i(null), _ = i(o || r), x = i(!1), p = at(), [f, $] = k(() => o || r), g = i(f), E = j(q), { motionState: D, setMotionState: m } = dt(
+  const L = s(null), E = s(null), a = s(null), D = s(o || l), B = s(!1), g = ut(), [m, F] = C(() => o || l), S = s(m), I = q(A), { motionState: G, setMotionState: h } = ft(
     o ? "open" : "closed",
-    A
+    U
   ), {
-    className: G = "",
-    style: J,
-    "data-oc-part": K = "content",
-    ...Q
-  } = c ?? {}, v = o || f || r, X = {
-    ...U,
+    className: J = "",
+    style: K,
+    "data-oc-part": Q = "content",
+    ...X
+  } = r ?? {}, w = o || m || l, Z = {
+    ...Y,
     overflow: "hidden"
-  }, h = V((e) => {
-    g.current = e, $(e);
-  }, []), Z = (e) => {
-    L.current = e, it(F, e);
+  }, p = j((e) => {
+    S.current = e, F(e);
+  }, []), tt = (e) => {
+    L.current = e, at(W, e);
   };
   return y(() => {
-    g.current = f;
-  }, [f]), y(
+    S.current = m;
+  }, [m]), y(
     () => () => {
       a.current?.destroy(), a.current = null;
     },
     []
-  ), rt(() => {
-    if (!v) return;
-    const e = L.current, I = B.current;
-    if (!e || !I) return;
-    const tt = g.current, O = o ? ut(I) : 0, P = st({
+  ), ct(() => {
+    if (!w) return;
+    const e = L.current, O = E.current;
+    if (!e || !O) return;
+    const et = S.current, P = o ? lt(O) : 0, N = it({
       element: e,
       intent: R,
-      phase: o ? u : d,
-      pace: C,
-      durationScale: l,
-      reduced: z,
-      reducedMotion: p,
-      property: H
-    }), et = !x.current && _.current, nt = !s && !et && P.animate, w = () => {
+      phase: o ? f : i,
+      pace: z,
+      durationFactor: d,
+      extraBounce: u,
+      reduced: b,
+      reducedMotion: g,
+      property: T
+    }), nt = !B.current && D.current, ot = !c && !nt && N.animate, M = () => {
       if (e.style.willChange = "", o) {
-        e.style.blockSize = "auto", m("open"), h(!0);
+        e.style.blockSize = "auto", h("open"), p(!0);
         return;
       }
-      e.style.blockSize = "0px", m("closed"), r || h(!1), E.current?.();
+      e.style.blockSize = "0px", h("closed"), l || p(!1), I.current?.();
     };
-    if (a.current?.destroy(), a.current = null, o && !tt && (e.style.blockSize = "0px", h(!0)), x.current = !0, !nt) {
-      w();
+    if (a.current?.destroy(), a.current = null, o && !et && (e.style.blockSize = "0px", p(!0)), B.current = !0, !ot) {
+      M();
       return;
     }
-    const M = lt(e);
-    if (Math.abs(M - O) < 0.5) {
-      w();
+    const v = dt(e);
+    if (Math.abs(v - P) < 0.5) {
+      M();
       return;
     }
-    e.style.blockSize = T(M), e.style.willChange = H, m(o ? "opening" : "closing");
-    const S = ct({
-      value: M,
-      target: O,
-      spring: P.spring,
-      scheduler: b,
+    e.style.blockSize = V(v), e.style.willChange = T, h(o ? "opening" : "closing");
+    const k = st({
+      value: v,
+      target: P,
+      spring: N.spring,
+      scheduler: x,
       stabilityWindow: 0.02,
-      onUpdate: (ot) => {
-        e.style.blockSize = T(ot);
+      onUpdate: (rt) => {
+        e.style.blockSize = V(rt);
       },
-      onComplete: w
+      onComplete: M
     });
-    return a.current = S, () => {
-      a.current === S && (S.destroy(), a.current = null);
+    return a.current = k, () => {
+      a.current === k && (k.destroy(), a.current = null);
     };
   }, [
-    s,
-    l,
-    u,
+    c,
     d,
-    r,
+    u,
+    f,
+    i,
+    l,
     R,
-    E,
+    I,
     o,
-    C,
     z,
-    p,
     b,
+    g,
+    x,
+    p,
     h,
-    m,
-    v
-  ]), v ? /* @__PURE__ */ N(
+    w
+  ]), w ? /* @__PURE__ */ H(
     "div",
     {
-      ...Y,
-      ref: Z,
+      ...$,
+      ref: tt,
       className: n,
-      style: X,
-      "data-oc-component": W,
+      style: Z,
+      "data-oc-component": _,
       "data-oc-motion-intent": R,
-      "data-oc-motion-state": D,
-      "data-oc-reduced-motion": p ? "true" : void 0,
+      "data-oc-motion-state": G,
+      "data-oc-reduced-motion": g ? "true" : void 0,
       "data-oc-state": o ? "open" : "closed",
-      children: /* @__PURE__ */ N(
+      children: /* @__PURE__ */ H(
         "div",
         {
-          ...Q,
-          ref: B,
-          className: G,
-          style: J,
-          "data-oc-part": K,
+          ...X,
+          ref: E,
+          className: J,
+          style: K,
+          "data-oc-part": Q,
           children: t
         }
       )
@@ -172,6 +175,6 @@ function gt({
   ) : null;
 }
 export {
-  gt as MotionReveal,
-  gt as default
+  St as MotionExpand,
+  St as default
 };