@orioncactuscorp/ui 1.17.0 → 1.18.0

package/dist/components/Modal/useModalKeyboardAvoidance.js

@@ -1,159 +1,242 @@
-import { useReducer as F, useRef as _, useLayoutEffect as h, useEffect as L, useMemo as p, useState as B, useCallback as O } from "react";
-import { keyboardSessionReducer as C, getKeyboardInset as D, isSessionGeometryCompatible as y, isKeyboardEditable as g, isSessionGeometryRestored as x, supportsTransitionSettleDetection as V, recordMeasuredKeyboardInset as Y, getKeyboardRevealScrollDelta as W, getSessionStableViewportGeometry as q, getSeedKeyboardInset as P, hasRunningTransformTransition as k } from "./keyboardSession.js";
-const X = 150, j = 450, z = 500, H = 1e4;
-function J({
-  holdShrink: f,
-  keyboardInset: n
+import { useReducer as N, useRef as v, useLayoutEffect as R, useState as Q, useEffect as H, useMemo as ee, useCallback as te } from "react";
+import { isKeyboardEditable as b, hasSoftKeyboardEnvironment as F, getKeyboardClass as X, getTapEditable as ne } from "./keyboardEditable.js";
+import { recordMeasuredKeyboardInset as re, getSeedKeyboardInset as z } from "./keyboardInsetMemory.js";
+import { keyboardSessionReducer as se, getKeyboardInset as oe, isSessionGeometryCompatible as J, isSessionGeometryRestored as ie, supportsTransitionSettleDetection as ce, getSessionStableViewportGeometry as ae, hasRunningTransformTransition as le } from "./keyboardSession.js";
+import { captureTapCaret as ue, restoreTapCaret as de } from "./tapCaret.js";
+import { useFieldReveal as fe } from "./useFieldReveal.js";
+const me = 150, he = 450, Ee = 500, ve = 1e4, we = 10, Se = 500;
+function ge({
+  holdShrink: w,
+  keyboardInset: i
 }) {
-  const [m, s] = B(0), t = O((o) => {
-    s((e) => Math.max(e, o));
+  const [f, y] = Q(0), o = te((n) => {
+    y((u) => Math.max(u, n));
   }, []);
-  return L(() => {
-    if (n > m) {
-      s(n);
+  return H(() => {
+    if (i > f) {
+      y(i);
       return;
     }
-    if (n === m || f)
+    if (i === f || w)
       return;
-    const o = window.setTimeout(() => {
-      s(n);
-    }, X);
+    const n = window.setTimeout(() => {
+      y(i);
+    }, me);
     return () => {
-      window.clearTimeout(o);
+      window.clearTimeout(n);
     };
-  }, [f, n, m]), { seedSettledKeyboardInset: t, settledKeyboardInset: m };
+  }, [w, i, f]), { seedSettledKeyboardInset: o, settledKeyboardInset: f };
 }
-function Z({
-  bodyNode: f,
-  enabled: n,
-  footerHeight: m,
-  surfaceNode: s,
-  viewportGeometry: t,
-  viewportNode: o
+function Ae({
+  bodyNode: w,
+  enabled: i,
+  footerHeight: f,
+  scroller: y,
+  surfaceNode: o,
+  viewportGeometry: n,
+  viewportNode: u
 }) {
-  const [e, E] = F(C, void 0), S = _(void 0), T = _(t);
-  h(() => {
-    T.current = t;
-  }, [t]);
-  const a = n ? D(e, t) : 0, R = y(
-    e,
-    t
-  ), M = !!e?.sawKeyboard && a === 0, { seedSettledKeyboardInset: A, settledKeyboardInset: v } = J({
-    holdShrink: !!(e && e.phase === "active" && R && !M),
+  const [r, E] = N(se, void 0), L = v(void 0), S = v(null), M = v(null), p = v(!1), C = v(n);
+  R(() => {
+    C.current = n;
+  });
+  const a = i ? oe(r, n) : 0, V = J(
+    r,
+    n
+  ), Z = !!r?.sawKeyboard && a === 0, { seedSettledKeyboardInset: O, settledKeyboardInset: g } = ge({
+    holdShrink: !!(r && r.phase === "active" && V && !Z),
     keyboardInset: a
+  }), x = v(a), D = v(g);
+  R(() => {
+    x.current = a, D.current = g;
+  });
+  const P = i && !!r && V, B = P || g > 0, [W, $] = Q(f);
+  R(() => {
+    B && f !== 0 || $(f);
+  }, [f, B]);
+  const l = fe({
+    bodyNode: w,
+    footerHeight: W,
+    onReserveRendered: O,
+    scroller: y,
+    viewportNode: u
   });
-  h(() => {
-    n || !e || E({ type: "release" });
-  }, [n, e]), h(() => {
-    if (!n || !s || typeof window > "u")
+  R(() => {
+    i || !r || E({ type: "release" });
+  }, [i, r]), R(() => {
+    if (!i || !o || typeof window > "u")
       return;
-    const r = () => {
-      S.current !== void 0 && (window.cancelAnimationFrame(S.current), S.current = void 0);
-    }, c = (d) => {
-      r();
-      const l = window.visualViewport, I = T.current ?? {
-        height: l?.height ?? window.innerHeight,
-        offsetLeft: l?.offsetLeft ?? 0,
-        offsetTop: l?.offsetTop ?? 0,
-        width: l?.width ?? window.innerWidth
-      }, K = P(I.width);
-      K !== void 0 && A(K), E({ type: "focus", geometry: I, target: d });
-    }, i = (d) => {
-      const l = d.target;
-      g(l) && c(l);
-    }, u = () => {
-      r(), S.current = window.requestAnimationFrame(() => {
-        S.current = void 0;
-        const d = document.activeElement;
-        if (s.contains(d) && g(d)) {
-          E({ type: "retain", target: d });
+    const c = () => {
+      L.current !== void 0 && (window.cancelAnimationFrame(L.current), L.current = void 0);
+    }, m = (e) => {
+      c();
+      const t = window.visualViewport, s = C.current ?? {
+        height: t?.height ?? window.innerHeight,
+        offsetLeft: t?.offsetLeft ?? 0,
+        offsetTop: t?.offsetTop ?? 0,
+        width: t?.width ?? window.innerWidth
+      }, h = X(e), I = z(s.width, h);
+      I !== void 0 && O(I);
+      const j = Math.max(
+        x.current,
+        D.current,
+        I ?? 0
+      );
+      S.current = !p.current && (j > 0 || F(window)) && l.alignTarget(e, {
+        clearanceInset: j,
+        revealed: !1,
+        smooth: !1
+      }) ? e : null, E({ type: "focus", geometry: s, keyboardClass: h, target: e });
+    }, d = (e) => {
+      const t = C.current?.width ?? window.innerWidth, s = z(t, X(e)) ?? 0;
+      return Math.max(
+        x.current,
+        D.current,
+        s
+      );
+    }, T = (e) => {
+      const t = d(e);
+      l.renderReserve(t), S.current = l.alignTarget(e, {
+        clearanceInset: t,
+        revealed: !1,
+        smooth: !0
+      }) ? e : null;
+    }, A = (e) => {
+      const t = d(e);
+      l.renderReserve(t);
+      const s = l.poseTargetAtReveal(e, t);
+      p.current = !0;
+      try {
+        e.focus({ preventScroll: !0 });
+      } finally {
+        p.current = !1;
+      }
+      s(), document.activeElement === e && T(e);
+    }, _ = (e) => {
+      const t = e.target;
+      b(t) && (S.current === t && l.isRevealing() || m(t));
+    }, K = (e) => {
+      const t = e.relatedTarget;
+      !p.current && t instanceof HTMLElement && o.contains(t) && b(t) && F(window) && A(t), c(), L.current = window.requestAnimationFrame(() => {
+        L.current = void 0;
+        const s = document.activeElement;
+        if (o.contains(s) && b(s)) {
+          E({
+            type: "retain",
+            keyboardClass: X(s),
+            target: s
+          });
           return;
         }
         E({ type: "close" });
       });
+    }, q = (e) => {
+      const t = e.touches.length === 1 ? e.touches[0] : void 0;
+      l.stopReveal(), M.current = t ? {
+        target: e.target,
+        time: performance.now(),
+        x: t.clientX,
+        y: t.clientY
+      } : null;
+    }, U = (e) => {
+      const t = M.current, s = e.changedTouches.length === 1 && e.touches.length === 0 ? e.changedTouches[0] : void 0;
+      M.current = null;
+      const h = ne(e.target);
+      if (!t || !s || !h || e.defaultPrevented || t.target !== e.target || h === document.activeElement || Math.hypot(s.clientX - t.x, s.clientY - t.y) > we || performance.now() - t.time > Se || !F(window))
+        return;
+      e.preventDefault();
+      const I = ue(h, s.clientX, s.clientY);
+      A(h), de(h, I);
     };
-    s.addEventListener("focusin", i), s.addEventListener("focusout", u);
-    const w = document.activeElement;
-    return s.contains(w) && g(w) && c(w), () => {
-      r(), s.removeEventListener("focusin", i), s.removeEventListener("focusout", u);
+    o.addEventListener("focusin", _), o.addEventListener("focusout", K), o.addEventListener("touchstart", q, {
+      passive: !0
+    }), o.addEventListener("touchend", U);
+    const k = document.activeElement;
+    return o.contains(k) && b(k) && m(k), () => {
+      c(), o.removeEventListener("focusin", _), o.removeEventListener("focusout", K), o.removeEventListener("touchstart", q), o.removeEventListener("touchend", U);
     };
-  }, [n, A, s]), L(() => {
-    if (e?.phase !== "closing" || !t) return;
-    if (!y(e, t)) {
+  }, [i, l, O, o]), H(() => {
+    if (r?.phase !== "closing" || !n) return;
+    if (!J(r, n)) {
       E({ type: "release" });
       return;
     }
-    if (!x(e, t))
+    if (!ie(r, n))
       return;
-    let r = !1;
-    const c = () => {
-      r || (r = !0, E({ type: "release" }));
+    let c = !1;
+    const m = () => {
+      c || (c = !0, E({ type: "release" }));
     };
-    if (!V(o)) {
-      const l = window.setTimeout(
-        c,
-        j
+    if (!ce(u)) {
+      const K = window.setTimeout(
+        m,
+        he
       );
       return () => {
-        window.clearTimeout(l);
+        window.clearTimeout(K);
       };
     }
-    const i = () => {
-      r || k(o) || c();
+    const d = () => {
+      c || le(u) || m();
     };
-    let u = window.requestAnimationFrame(
+    let T = window.requestAnimationFrame(
       () => {
-        u = window.requestAnimationFrame(() => {
-          u = void 0, i();
+        T = window.requestAnimationFrame(() => {
+          T = void 0, d();
         });
       }
     );
-    const w = window.setInterval(
-      i,
-      z
-    ), d = window.setTimeout(
-      c,
-      H
+    const A = window.setInterval(
+      d,
+      Ee
+    ), _ = window.setTimeout(
+      m,
+      ve
     );
-    return o.addEventListener("transitionend", i), o.addEventListener("transitioncancel", i), () => {
-      u !== void 0 && window.cancelAnimationFrame(u), window.clearInterval(w), window.clearTimeout(d), o.removeEventListener("transitionend", i), o.removeEventListener("transitioncancel", i);
+    return u.addEventListener("transitionend", d), u.addEventListener("transitioncancel", d), () => {
+      T !== void 0 && window.cancelAnimationFrame(T), window.clearInterval(A), window.clearTimeout(_), u.removeEventListener("transitionend", d), u.removeEventListener("transitioncancel", d);
     };
-  }, [e, t, o]), L(() => {
-    a <= 0 || !t || (window.navigator.maxTouchPoints > 0 && Y(t.width, a), E({ type: "measure" }));
-  }, [a, t]), h(() => {
-    const r = e?.target, c = Math.max(a, v);
-    if (!f || !r || c <= 0) return;
-    const i = W({
-      bodyRect: f.getBoundingClientRect(),
-      clearanceInset: c,
-      footerHeight: m,
-      targetRect: r.getBoundingClientRect()
-    });
-    if (Math.abs(i) > 0.5) {
-      const u = a <= 0;
-      f.scrollTo({
-        behavior: u || window.matchMedia?.("(prefers-reduced-motion: reduce)").matches === !0 ? "auto" : "smooth",
-        top: f.scrollTop + i
-      });
+  }, [r, n, u]);
+  const Y = r?.keyboardClass;
+  H(() => {
+    a <= 0 || !n || !Y || (window.navigator.maxTouchPoints > 0 && re(
+      n.width,
+      Y,
+      a
+    ), E({ type: "measure" }));
+  }, [a, Y, n]), R(() => {
+    const c = r?.target;
+    if (!c) {
+      S.current = null;
+      return;
     }
-  }, [
-    f,
-    m,
-    a,
-    e?.target,
-    v
-  ]);
-  const b = p(
-    () => n ? q(e, t) : t,
-    [n, e, t]
+    const m = Math.max(a, g);
+    if (!w || m <= 0 && !F(window) || // A reveal the tap path set in motion is still gliding: reading the
+    // rects mid-flight would only cut it short with an instant jump. The
+    // next geometry change re-checks once it has landed.
+    l.isRevealing())
+      return;
+    l.alignTarget(c, {
+      clearanceInset: m,
+      revealed: S.current === c,
+      smooth: a > 0
+    }) && (S.current = c);
+  }, [w, a, l, r?.target, g]);
+  const G = ee(
+    () => i ? ae(r, n) : n,
+    [i, r, n]
   );
   return {
-    active: n && !!e && R,
+    active: P,
+    // The footer descends over the dismissal choreography from blur on.
+    closing: P && r?.phase === "closing",
+    footerHeight: W,
     keyboardInset: a,
-    settledKeyboardInset: v,
-    viewportGeometry: b
+    settledKeyboardInset: g,
+    shellHeld: B,
+    viewportGeometry: G
   };
 }
 export {
-  Z as useModalKeyboardAvoidance
+  Ae as useModalKeyboardAvoidance
 };

package/dist/components/Modal/useModalViewportGeometry.js

@@ -1,25 +1,40 @@
-import { useState as w, useLayoutEffect as v } from "react";
-function a(e, t) {
-  return e?.height === t.height && e.offsetLeft === t.offsetLeft && e.offsetTop === t.offsetTop && e.width === t.width;
+import { useState as w, useLayoutEffect as u } from "react";
+function m(t, e) {
+  return t?.height === e.height && t.offsetLeft === e.offsetLeft && t.offsetTop === e.offsetTop && t.width === e.width;
 }
-function m(e) {
-  const t = e.visualViewport;
-  return {
-    height: t?.height ?? e.innerHeight,
-    offsetLeft: t?.offsetLeft ?? 0,
-    offsetTop: t?.offsetTop ?? 0,
-    width: t?.width ?? e.innerWidth
+const c = 1e-3;
+function d(t) {
+  const e = t?.scale;
+  return typeof e == "number" && Number.isFinite(e) && Math.abs(e - 1) > c;
+}
+function v(t) {
+  const e = t.visualViewport;
+  return e ? d(e) ? {
+    height: Math.round(e.height * e.scale),
+    offsetLeft: 0,
+    offsetTop: 0,
+    width: Math.round(e.width * e.scale)
+  } : {
+    height: e.height,
+    offsetLeft: e.offsetLeft,
+    offsetTop: e.offsetTop,
+    width: e.width
+  } : {
+    height: t.innerHeight,
+    offsetLeft: 0,
+    offsetTop: 0,
+    width: t.innerWidth
   };
 }
-function h(e) {
-  const [t, d] = w();
-  return v(() => {
-    if (!e || typeof window > "u") return;
+function p(t) {
+  const [e, h] = w();
+  return u(() => {
+    if (!t || typeof window > "u") return;
     const i = window.visualViewport;
     let n;
     const r = () => {
-      const s = m(window);
-      d((f) => a(f, s) ? f : s);
+      const f = v(window), a = d(i);
+      h((s) => s && a || m(s, f) ? s : f);
     }, o = () => {
       n === void 0 && (n = window.requestAnimationFrame(() => {
         n = void 0, r();
@@ -28,9 +43,10 @@ function h(e) {
     return r(), window.addEventListener("resize", o), i?.addEventListener("resize", o), i?.addEventListener("scroll", o), i?.addEventListener("scrollend", o), () => {
       window.removeEventListener("resize", o), i?.removeEventListener("resize", o), i?.removeEventListener("scroll", o), i?.removeEventListener("scrollend", o), n !== void 0 && window.cancelAnimationFrame(n);
     };
-  }, [e]), t;
+  }, [t]), e;
 }
 export {
-  m as getModalViewportGeometry,
-  h as useModalViewportGeometry
+  v as getModalViewportGeometry,
+  d as isPinchZoomedViewport,
+  p as useModalViewportGeometry
 };

package/dist/components/PositionSnap/policy.js

@@ -1,60 +1,57 @@
-function a(n, t, _) {
-  return Math.min(Math.max(n, t), _);
+import { ocGesture as h } from "../../utils/gesture.js";
+const u = 0.16, e = 24, y = 0.55;
+function p(t, n, a) {
+  return Math.min(Math.max(t, n), a);
 }
-function c(n, t) {
-  return Math.hypot(n.x - t.x, n.y - t.y);
+function M(t, n) {
+  return Math.hypot(t.x - n.x, t.y - n.y);
 }
-function R(n, t) {
-  return n.reduce(
-    (_, S) => c(S, t) < c(_, t) ? S : _
+function S(t, n) {
+  return t.reduce(
+    (a, o) => M(o, n) < M(a, n) ? o : a
   );
 }
-function C({
-  currentPoint: n,
-  velocity: t,
-  targets: _
+function _({
+  currentPoint: t,
+  velocity: n,
+  targets: a
 }) {
-  const S = {
-    x: n.x + a(
-      t.x * 0.16,
-      -24,
-      24
+  const o = {
+    x: t.x + p(
+      n.x * u,
+      -e,
+      e
     ),
-    y: n.y + a(
-      t.y * 0.16,
-      -24,
-      24
+    y: t.y + p(
+      n.y * u,
+      -e,
+      e
     )
   };
-  if (!(Math.hypot(t.x, t.y) / 1e3 > 0.55)) return R(_, n);
-  const o = _.filter((s) => {
-    const A = s.x - n.x, E = s.y - n.y;
-    return A * t.x + E * t.y > 0;
+  if (!(Math.hypot(n.x, n.y) / 1e3 > y)) return S(a, t);
+  const x = a.filter((s) => {
+    const c = s.x - t.x, i = s.y - t.y;
+    return c * n.x + i * n.y > 0;
   });
-  return R(
-    o.length ? o : _,
-    S
+  return S(
+    x.length ? x : a,
+    o
   );
 }
-function x(n, t, _, S) {
-  if (n >= t && n <= _) return n;
-  const N = n < t ? t : _, o = Math.abs(n - N), s = o * 0.55 * S / (S + 0.55 * o);
-  return n < t ? N - s : N + s;
-}
-function O({
-  point: n,
-  size: t,
-  targets: _
+function f({
+  point: t,
+  size: n,
+  targets: a
 }) {
-  const S = _.map((P) => P.x), N = _.map((P) => P.y), o = Math.min(...S), s = Math.max(...S), A = Math.min(...N), E = Math.max(...N);
+  const o = a.map((r) => r.x), m = a.map((r) => r.y), x = Math.min(...o), s = Math.max(...o), c = Math.min(...m), i = Math.max(...m);
   return {
-    x: x(n.x, o, s, Math.max(t.width, 1)),
-    y: x(n.y, A, E, Math.max(t.height, 1))
+    x: h.rubberBandClamp(t.x, x, s, Math.max(n.width, 1)),
+    y: h.rubberBandClamp(t.y, c, i, Math.max(n.height, 1))
   };
 }
 export {
-  R as getNearestPositionSnapTarget,
-  c as getPositionSnapPointDistance,
-  C as getReleasePositionSnapTarget,
-  O as resolvePositionSnapDragPoint
+  S as getNearestPositionSnapTarget,
+  M as getPositionSnapPointDistance,
+  _ as getReleasePositionSnapTarget,
+  f as resolvePositionSnapDragPoint
 };