@orioncactuscorp/ui 1.14.0 → 1.15.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (131) hide show
  1. package/CHANGELOG.md +92 -0
  2. package/README.md +65 -36
  3. package/dist/components/BackgroundIconButton/BackgroundIconButton.css +1 -1
  4. package/dist/components/Button/Button.css +1 -1
  5. package/dist/components/CheckMark/CheckMark.js +19 -17
  6. package/dist/components/Checkbox/Checkbox.css +1 -1
  7. package/dist/components/Checkbox/Checkbox.js +38 -36
  8. package/dist/components/FloatingWindow/FloatingWindow.js +138 -137
  9. package/dist/components/Interaction/Interaction.css +1 -1
  10. package/dist/components/Menu/Menu.css +1 -1
  11. package/dist/components/Menu/Menu.js +95 -87
  12. package/dist/components/Modal/Modal.css +1 -1
  13. package/dist/components/Modal/Modal.js +504 -488
  14. package/dist/components/Modal/Modal.module.scss.js +69 -62
  15. package/dist/components/Modal/keyboardSession.js +104 -0
  16. package/dist/components/Modal/snapPoints.js +95 -82
  17. package/dist/components/Modal/useModalDrag.js +587 -637
  18. package/dist/components/Modal/useModalKeyboardAvoidance.js +159 -0
  19. package/dist/components/Modal/useModalViewportGeometry.js +36 -0
  20. package/dist/components/PositionSnap/PositionSnap.css +1 -0
  21. package/dist/components/PositionSnap/PositionSnap.js +330 -0
  22. package/dist/components/PositionSnap/PositionSnap.module.scss.js +9 -0
  23. package/dist/components/PositionSnap/contexts.js +12 -0
  24. package/dist/components/PositionSnap/geometry.js +75 -0
  25. package/dist/components/PositionSnap/gesture.js +7 -0
  26. package/dist/components/PositionSnap/policy.js +60 -0
  27. package/dist/components/PositionSnap.d.ts +6 -0
  28. package/dist/components/PositionSnap.js +7 -0
  29. package/dist/components/ProgressIndicator/ProgressIndicator.css +1 -0
  30. package/dist/components/ProgressIndicator/ProgressIndicator.js +45 -0
  31. package/dist/components/ProgressIndicator/ProgressIndicator.module.scss.js +13 -0
  32. package/dist/components/ProgressIndicator.d.ts +6 -0
  33. package/dist/components/ProgressIndicator.js +4 -0
  34. package/dist/components/Radio/Radio.css +1 -1
  35. package/dist/components/Radio/Radio.js +26 -24
  36. package/dist/components/Switch/Switch.css +1 -1
  37. package/dist/components/Switch/Switch.js +18 -16
  38. package/dist/components/Tabs/Tabs.css +1 -1
  39. package/dist/components/Tooltip/Tooltip.css +1 -1
  40. package/dist/components/Tooltip/Tooltip.js +59 -56
  41. package/dist/components/Tooltip/Tooltip.module.scss.js +6 -4
  42. package/dist/components/internal/ModalPresentation.js +126 -124
  43. package/dist/components/internal/OverlayPortalContext.js +20 -0
  44. package/dist/index.js +133 -126
  45. package/dist/styles.css +12 -10
  46. package/dist/ui/src/components/CheckMark/CheckMark.d.ts +1 -1
  47. package/dist/ui/src/components/CheckMark/CheckMark.d.ts.map +1 -1
  48. package/dist/ui/src/components/CheckMark/types.d.ts +2 -1
  49. package/dist/ui/src/components/CheckMark/types.d.ts.map +1 -1
  50. package/dist/ui/src/components/Checkbox/Checkbox.d.ts +1 -1
  51. package/dist/ui/src/components/Checkbox/Checkbox.d.ts.map +1 -1
  52. package/dist/ui/src/components/Checkbox/types.d.ts +2 -1
  53. package/dist/ui/src/components/Checkbox/types.d.ts.map +1 -1
  54. package/dist/ui/src/components/FloatingWindow/FloatingWindow.d.ts.map +1 -1
  55. package/dist/ui/src/components/FloatingWindow/types.d.ts +1 -1
  56. package/dist/ui/src/components/FloatingWindow/types.d.ts.map +1 -1
  57. package/dist/ui/src/components/Interaction/index.d.ts +1 -1
  58. package/dist/ui/src/components/Interaction/index.d.ts.map +1 -1
  59. package/dist/ui/src/components/Interaction/types.d.ts +9 -1
  60. package/dist/ui/src/components/Interaction/types.d.ts.map +1 -1
  61. package/dist/ui/src/components/Menu/Menu.d.ts +2 -2
  62. package/dist/ui/src/components/Menu/Menu.d.ts.map +1 -1
  63. package/dist/ui/src/components/Menu/types.d.ts +9 -2
  64. package/dist/ui/src/components/Menu/types.d.ts.map +1 -1
  65. package/dist/ui/src/components/Modal/Modal.d.ts +1 -1
  66. package/dist/ui/src/components/Modal/Modal.d.ts.map +1 -1
  67. package/dist/ui/src/components/Modal/keyboardSession.d.ts +46 -0
  68. package/dist/ui/src/components/Modal/keyboardSession.d.ts.map +1 -0
  69. package/dist/ui/src/components/Modal/snapPoints.d.ts.map +1 -1
  70. package/dist/ui/src/components/Modal/types.d.ts +8 -1
  71. package/dist/ui/src/components/Modal/types.d.ts.map +1 -1
  72. package/dist/ui/src/components/Modal/useModalDrag.d.ts.map +1 -1
  73. package/dist/ui/src/components/Modal/useModalKeyboardAvoidance.d.ts +17 -0
  74. package/dist/ui/src/components/Modal/useModalKeyboardAvoidance.d.ts.map +1 -0
  75. package/dist/ui/src/components/Modal/useModalViewportGeometry.d.ts +9 -0
  76. package/dist/ui/src/components/Modal/useModalViewportGeometry.d.ts.map +1 -0
  77. package/dist/ui/src/components/PositionSnap/PositionSnap.d.ts +11 -0
  78. package/dist/ui/src/components/PositionSnap/PositionSnap.d.ts.map +1 -0
  79. package/dist/ui/src/components/PositionSnap/contexts.d.ts +17 -0
  80. package/dist/ui/src/components/PositionSnap/contexts.d.ts.map +1 -0
  81. package/dist/ui/src/components/PositionSnap/geometry.d.ts +31 -0
  82. package/dist/ui/src/components/PositionSnap/geometry.d.ts.map +1 -0
  83. package/dist/ui/src/components/PositionSnap/gesture.d.ts +2 -0
  84. package/dist/ui/src/components/PositionSnap/gesture.d.ts.map +1 -0
  85. package/dist/ui/src/components/PositionSnap/index.d.ts +3 -0
  86. package/dist/ui/src/components/PositionSnap/index.d.ts.map +1 -0
  87. package/dist/ui/src/components/PositionSnap/policy.d.ts +24 -0
  88. package/dist/ui/src/components/PositionSnap/policy.d.ts.map +1 -0
  89. package/dist/ui/src/components/PositionSnap/types.d.ts +31 -0
  90. package/dist/ui/src/components/PositionSnap/types.d.ts.map +1 -0
  91. package/dist/ui/src/components/ProgressIndicator/ProgressIndicator.d.ts +4 -0
  92. package/dist/ui/src/components/ProgressIndicator/ProgressIndicator.d.ts.map +1 -0
  93. package/dist/ui/src/components/ProgressIndicator/index.d.ts +3 -0
  94. package/dist/ui/src/components/ProgressIndicator/index.d.ts.map +1 -0
  95. package/dist/ui/src/components/ProgressIndicator/types.d.ts +17 -0
  96. package/dist/ui/src/components/ProgressIndicator/types.d.ts.map +1 -0
  97. package/dist/ui/src/components/Radio/Radio.d.ts +1 -1
  98. package/dist/ui/src/components/Radio/Radio.d.ts.map +1 -1
  99. package/dist/ui/src/components/Radio/types.d.ts +2 -1
  100. package/dist/ui/src/components/Radio/types.d.ts.map +1 -1
  101. package/dist/ui/src/components/Switch/Switch.d.ts +1 -1
  102. package/dist/ui/src/components/Switch/Switch.d.ts.map +1 -1
  103. package/dist/ui/src/components/Switch/types.d.ts +2 -1
  104. package/dist/ui/src/components/Switch/types.d.ts.map +1 -1
  105. package/dist/ui/src/components/Tooltip/Tooltip.d.ts +1 -1
  106. package/dist/ui/src/components/Tooltip/Tooltip.d.ts.map +1 -1
  107. package/dist/ui/src/components/Tooltip/types.d.ts +6 -0
  108. package/dist/ui/src/components/Tooltip/types.d.ts.map +1 -1
  109. package/dist/ui/src/components/internal/ModalPresentation.d.ts +2 -1
  110. package/dist/ui/src/components/internal/ModalPresentation.d.ts.map +1 -1
  111. package/dist/ui/src/components/internal/OverlayPortalContext.d.ts +10 -0
  112. package/dist/ui/src/components/internal/OverlayPortalContext.d.ts.map +1 -0
  113. package/dist/ui/src/index.d.ts +5 -1
  114. package/dist/ui/src/index.d.ts.map +1 -1
  115. package/docs/api-conventions.md +4 -0
  116. package/docs/overlay-stacking.md +48 -0
  117. package/docs/responsive-foundation-profile.md +1 -1
  118. package/docs/scss-helpers.md +110 -5
  119. package/docs/selector-contract.md +77 -2
  120. package/docs/tokens.md +2 -0
  121. package/package.json +1 -1
  122. package/src/scss/foundations/atomic.scss +9 -8
  123. package/src/scss/index.scss +2 -0
  124. package/src/scss/mixins/_fluid.scss +57 -0
  125. package/src/scss/mixins/_fluid.test.ts +87 -0
  126. package/src/scss/mixins/_gradient.scss +99 -0
  127. package/src/scss/mixins/_gradient.test.ts +111 -0
  128. package/src/scss/mixins/_responsive.scss +2 -1
  129. package/src/scss/mixins/_typo.scss +2 -1
  130. package/src/scss/mixins/_units.scss +14 -0
  131. package/src/scss/mixins/_utils.scss +3 -22
@@ -0,0 +1,159 @@
1
+ import { useReducer as F, useRef as _, useLayoutEffect as h, useEffect as L, useMemo as p, useState as B, useCallback as O } from "react";
2
+ 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";
3
+ const X = 150, j = 450, z = 500, H = 1e4;
4
+ function J({
5
+ holdShrink: f,
6
+ keyboardInset: n
7
+ }) {
8
+ const [m, s] = B(0), t = O((o) => {
9
+ s((e) => Math.max(e, o));
10
+ }, []);
11
+ return L(() => {
12
+ if (n > m) {
13
+ s(n);
14
+ return;
15
+ }
16
+ if (n === m || f)
17
+ return;
18
+ const o = window.setTimeout(() => {
19
+ s(n);
20
+ }, X);
21
+ return () => {
22
+ window.clearTimeout(o);
23
+ };
24
+ }, [f, n, m]), { seedSettledKeyboardInset: t, settledKeyboardInset: m };
25
+ }
26
+ function Z({
27
+ bodyNode: f,
28
+ enabled: n,
29
+ footerHeight: m,
30
+ surfaceNode: s,
31
+ viewportGeometry: t,
32
+ viewportNode: o
33
+ }) {
34
+ const [e, E] = F(C, void 0), S = _(void 0), T = _(t);
35
+ h(() => {
36
+ T.current = t;
37
+ }, [t]);
38
+ const a = n ? D(e, t) : 0, R = y(
39
+ e,
40
+ t
41
+ ), M = !!e?.sawKeyboard && a === 0, { seedSettledKeyboardInset: A, settledKeyboardInset: v } = J({
42
+ holdShrink: !!(e && e.phase === "active" && R && !M),
43
+ keyboardInset: a
44
+ });
45
+ h(() => {
46
+ n || !e || E({ type: "release" });
47
+ }, [n, e]), h(() => {
48
+ if (!n || !s || typeof window > "u")
49
+ return;
50
+ const r = () => {
51
+ S.current !== void 0 && (window.cancelAnimationFrame(S.current), S.current = void 0);
52
+ }, c = (d) => {
53
+ r();
54
+ const l = window.visualViewport, I = T.current ?? {
55
+ height: l?.height ?? window.innerHeight,
56
+ offsetLeft: l?.offsetLeft ?? 0,
57
+ offsetTop: l?.offsetTop ?? 0,
58
+ width: l?.width ?? window.innerWidth
59
+ }, K = P(I.width);
60
+ K !== void 0 && A(K), E({ type: "focus", geometry: I, target: d });
61
+ }, i = (d) => {
62
+ const l = d.target;
63
+ g(l) && c(l);
64
+ }, u = () => {
65
+ r(), S.current = window.requestAnimationFrame(() => {
66
+ S.current = void 0;
67
+ const d = document.activeElement;
68
+ if (s.contains(d) && g(d)) {
69
+ E({ type: "retain", target: d });
70
+ return;
71
+ }
72
+ E({ type: "close" });
73
+ });
74
+ };
75
+ s.addEventListener("focusin", i), s.addEventListener("focusout", u);
76
+ const w = document.activeElement;
77
+ return s.contains(w) && g(w) && c(w), () => {
78
+ r(), s.removeEventListener("focusin", i), s.removeEventListener("focusout", u);
79
+ };
80
+ }, [n, A, s]), L(() => {
81
+ if (e?.phase !== "closing" || !t) return;
82
+ if (!y(e, t)) {
83
+ E({ type: "release" });
84
+ return;
85
+ }
86
+ if (!x(e, t))
87
+ return;
88
+ let r = !1;
89
+ const c = () => {
90
+ r || (r = !0, E({ type: "release" }));
91
+ };
92
+ if (!V(o)) {
93
+ const l = window.setTimeout(
94
+ c,
95
+ j
96
+ );
97
+ return () => {
98
+ window.clearTimeout(l);
99
+ };
100
+ }
101
+ const i = () => {
102
+ r || k(o) || c();
103
+ };
104
+ let u = window.requestAnimationFrame(
105
+ () => {
106
+ u = window.requestAnimationFrame(() => {
107
+ u = void 0, i();
108
+ });
109
+ }
110
+ );
111
+ const w = window.setInterval(
112
+ i,
113
+ z
114
+ ), d = window.setTimeout(
115
+ c,
116
+ H
117
+ );
118
+ return o.addEventListener("transitionend", i), o.addEventListener("transitioncancel", i), () => {
119
+ u !== void 0 && window.cancelAnimationFrame(u), window.clearInterval(w), window.clearTimeout(d), o.removeEventListener("transitionend", i), o.removeEventListener("transitioncancel", i);
120
+ };
121
+ }, [e, t, o]), L(() => {
122
+ a <= 0 || !t || (window.navigator.maxTouchPoints > 0 && Y(t.width, a), E({ type: "measure" }));
123
+ }, [a, t]), h(() => {
124
+ const r = e?.target, c = Math.max(a, v);
125
+ if (!f || !r || c <= 0) return;
126
+ const i = W({
127
+ bodyRect: f.getBoundingClientRect(),
128
+ clearanceInset: c,
129
+ footerHeight: m,
130
+ targetRect: r.getBoundingClientRect()
131
+ });
132
+ if (Math.abs(i) > 0.5) {
133
+ const u = a <= 0;
134
+ f.scrollTo({
135
+ behavior: u || window.matchMedia?.("(prefers-reduced-motion: reduce)").matches === !0 ? "auto" : "smooth",
136
+ top: f.scrollTop + i
137
+ });
138
+ }
139
+ }, [
140
+ f,
141
+ m,
142
+ a,
143
+ e?.target,
144
+ v
145
+ ]);
146
+ const b = p(
147
+ () => n ? q(e, t) : t,
148
+ [n, e, t]
149
+ );
150
+ return {
151
+ active: n && !!e && R,
152
+ keyboardInset: a,
153
+ settledKeyboardInset: v,
154
+ viewportGeometry: b
155
+ };
156
+ }
157
+ export {
158
+ Z as useModalKeyboardAvoidance
159
+ };
@@ -0,0 +1,36 @@
1
+ import { useState as w, useLayoutEffect as v } from "react";
2
+ function a(e, t) {
3
+ return e?.height === t.height && e.offsetLeft === t.offsetLeft && e.offsetTop === t.offsetTop && e.width === t.width;
4
+ }
5
+ function m(e) {
6
+ const t = e.visualViewport;
7
+ return {
8
+ height: t?.height ?? e.innerHeight,
9
+ offsetLeft: t?.offsetLeft ?? 0,
10
+ offsetTop: t?.offsetTop ?? 0,
11
+ width: t?.width ?? e.innerWidth
12
+ };
13
+ }
14
+ function h(e) {
15
+ const [t, d] = w();
16
+ return v(() => {
17
+ if (!e || typeof window > "u") return;
18
+ const i = window.visualViewport;
19
+ let n;
20
+ const r = () => {
21
+ const s = m(window);
22
+ d((f) => a(f, s) ? f : s);
23
+ }, o = () => {
24
+ n === void 0 && (n = window.requestAnimationFrame(() => {
25
+ n = void 0, r();
26
+ }));
27
+ };
28
+ return r(), window.addEventListener("resize", o), i?.addEventListener("resize", o), i?.addEventListener("scroll", o), i?.addEventListener("scrollend", o), () => {
29
+ window.removeEventListener("resize", o), i?.removeEventListener("resize", o), i?.removeEventListener("scroll", o), i?.removeEventListener("scrollend", o), n !== void 0 && window.cancelAnimationFrame(n);
30
+ };
31
+ }, [e]), t;
32
+ }
33
+ export {
34
+ m as getModalViewportGeometry,
35
+ h as useModalViewportGeometry
36
+ };
@@ -0,0 +1 @@
1
+ .oc-PositionSnap-module__positioner__-v2BM{--_-position-snap-x: 0px;--_-position-snap-y: 0px;--oc-position-snap-z-index: var(--oc-zindex-2);position:fixed;z-index:var(--oc-position-snap-z-index);inset-block-start:0;inset-inline-start:0;width:max-content;max-width:100%;max-height:100dvh;touch-action:none;transform:translate3d(var(--_-position-snap-x),var(--_-position-snap-y),0)}.oc-PositionSnap-module__positioner__-v2BM[data-oc-positioned=false]{visibility:hidden}.oc-PositionSnap-module__positioner__-v2BM[data-oc-dragging=true]{cursor:grabbing;-webkit-user-select:none;user-select:none}.oc-PositionSnap-module__positioner__-v2BM[data-oc-drag=handle]{touch-action:auto}.oc-PositionSnap-module__handle__iuv3c{cursor:grab;touch-action:none}
@@ -0,0 +1,330 @@
1
+ 'use client';
2
+ import { jsx as W } from "react/jsx-runtime";
3
+ import { useMemo as J, useRef as h, useState as A, useCallback as g, useLayoutEffect as U } from "react";
4
+ import { createSpringAnimator as j } from "../../utils/spring/animator.js";
5
+ import { resolveOcMotion as it } from "../../utils/motion.js";
6
+ import { mergeRefs as st } from "../../utils/mergeRefs.js";
7
+ import { resolvePositionSnapTargets as at, getPositionSnapBoundaryRect as ct, uniformPositionSnapPadding as lt } from "./geometry.js";
8
+ import { getPositionSnapPointDistance as ut, getReleasePositionSnapTarget as pt, resolvePositionSnapDragPoint as ft } from "./policy.js";
9
+ import { POSITION_SNAP_DRAG_FOLLOWER_SPRING as dt } from "./gesture.js";
10
+ import { usePositionSnapContext as Q, PositionSnapContext as Pt } from "./contexts.js";
11
+ import Z from "./PositionSnap.module.scss.js";
12
+ const mt = 2, gt = 10, tt = 90, k = 4e3, yt = 500;
13
+ function et(...r) {
14
+ return r.filter(Boolean).join(" ");
15
+ }
16
+ function V() {
17
+ return Date.now();
18
+ }
19
+ function X(r, i, s) {
20
+ return Math.min(Math.max(r, i), s);
21
+ }
22
+ function $(r, i) {
23
+ const s = V();
24
+ r.push({ ...i, time: s });
25
+ const f = s - tt;
26
+ for (; r.length > 2 && (r[1]?.time ?? s) < f; )
27
+ r.shift();
28
+ }
29
+ function wt(r) {
30
+ const i = r[r.length - 1], s = r.find(
31
+ (w) => w.time >= (i?.time ?? 0) - tt
32
+ );
33
+ if (!s || !i || s === i) return { x: 0, y: 0 };
34
+ const f = Math.max(i.time - s.time, 1);
35
+ return {
36
+ x: X(
37
+ (i.x - s.x) / f * 1e3,
38
+ -k,
39
+ k
40
+ ),
41
+ y: X(
42
+ (i.y - s.y) / f * 1e3,
43
+ -k,
44
+ k
45
+ )
46
+ };
47
+ }
48
+ function q(r) {
49
+ const i = r.getBoundingClientRect();
50
+ return { width: i.width, height: i.height };
51
+ }
52
+ function St(r) {
53
+ return r instanceof Element && !!r.closest('[data-oc-part="position-snap-handle"]');
54
+ }
55
+ function K({
56
+ children: r,
57
+ positions: i,
58
+ position: s,
59
+ defaultPosition: f,
60
+ onPositionChange: w,
61
+ boundary: y = "viewport",
62
+ boundaryPadding: I = 16,
63
+ drag: x = "content",
64
+ disabled: R = !1
65
+ }) {
66
+ const S = h(null), [a, M] = A(null), [o, nt] = A(
67
+ f ?? i[0] ?? "center"
68
+ ), [b, ot] = A(!1), C = h(!1), [B, F] = A(!1), E = s ?? o, D = h({ x: 0, y: 0 }), T = h(null), u = h(null), z = h(0), G = g((t) => {
69
+ S.current = t, M(t), t || (C.current = !1);
70
+ }, []), p = g((t) => {
71
+ const e = S.current;
72
+ e && (D.current = { x: t.x, y: t.y }, e.style.setProperty("--_-position-snap-x", `${t.x}px`), e.style.setProperty("--_-position-snap-y", `${t.y}px`));
73
+ }, []), m = g(() => {
74
+ u.current?.destroy(), u.current = null;
75
+ }, []), O = g(
76
+ (t, e = { x: 0, y: 0 }) => {
77
+ const n = S.current;
78
+ if (!n) return;
79
+ const c = u.current?.isRunning ? u.current : null, d = c?.sample(), P = d?.value ?? D.current, l = { x: t.x, y: t.y };
80
+ if (d && p(P), ut(P, l) < 0.5) {
81
+ m(), p(l);
82
+ return;
83
+ }
84
+ const L = it({
85
+ element: n,
86
+ intent: "gesture",
87
+ phase: "release",
88
+ property: "transform"
89
+ });
90
+ if (!L.animate) {
91
+ m(), p(l);
92
+ return;
93
+ }
94
+ if (c) {
95
+ c.setTarget(l, { spring: L.spring });
96
+ return;
97
+ }
98
+ m();
99
+ const H = j({
100
+ value: P,
101
+ target: l,
102
+ velocity: e,
103
+ spring: L.spring,
104
+ epsilon: 0.5,
105
+ velocityEpsilon: 50,
106
+ stabilityWindow: 0.02,
107
+ onUpdate: p,
108
+ onComplete: () => {
109
+ u.current === H && (u.current = null), p(H.target);
110
+ }
111
+ });
112
+ u.current = H;
113
+ },
114
+ [p, m]
115
+ ), Y = g(
116
+ (t) => {
117
+ let e = u.current;
118
+ if (!e) {
119
+ const n = D.current, c = j({
120
+ value: n,
121
+ target: n,
122
+ spring: dt,
123
+ autoplay: !1,
124
+ epsilon: 0.5,
125
+ velocityEpsilon: 50,
126
+ stabilityWindow: 0.02,
127
+ onUpdate: p,
128
+ onComplete: () => {
129
+ u.current === c && (u.current = null), p(c.target);
130
+ }
131
+ });
132
+ u.current = c, e = c;
133
+ }
134
+ e.setTarget(t), p(e.sample().value);
135
+ },
136
+ [p]
137
+ ), v = g(() => !a || i.length === 0 ? [] : at({
138
+ boundary: ct(y),
139
+ direction: window.getComputedStyle(a).direction === "rtl" ? "rtl" : "ltr",
140
+ padding: lt(I),
141
+ positions: i,
142
+ size: q(a)
143
+ }), [y, I, a, i]), N = g(
144
+ (t) => {
145
+ const e = v();
146
+ if (!e.length) return;
147
+ const n = e.find((c) => c.key === E) ?? e[0];
148
+ n && (t && C.current ? O(n) : p(n), C.current || (C.current = !0, ot(!0)));
149
+ },
150
+ [p, E, v, O]
151
+ );
152
+ U(() => {
153
+ N(C.current);
154
+ }, [N]), U(() => {
155
+ if (!a) return;
156
+ const t = () => {
157
+ T.current || N(!!u.current?.isRunning);
158
+ };
159
+ let e = null;
160
+ const n = () => {
161
+ e === null && (e = window.requestAnimationFrame(() => {
162
+ e = null, t();
163
+ }));
164
+ }, c = typeof ResizeObserver > "u" ? void 0 : new ResizeObserver(n);
165
+ return c?.observe(a), y !== "viewport" && c?.observe(y), window.addEventListener("resize", n), window.addEventListener("scroll", n, !0), window.visualViewport?.addEventListener("resize", n), window.visualViewport?.addEventListener("scroll", n), () => {
166
+ e !== null && window.cancelAnimationFrame(e), c?.disconnect(), window.removeEventListener("resize", n), window.removeEventListener("scroll", n, !0), window.visualViewport?.removeEventListener("resize", n), window.visualViewport?.removeEventListener("scroll", n);
167
+ };
168
+ }, [y, a, N]), U(() => () => m(), [m]);
169
+ const _ = g(
170
+ (t, e) => {
171
+ const n = T.current;
172
+ if (!n || n.pointerId !== t.pointerId || (T.current = null, t.currentTarget.hasPointerCapture(n.pointerId) && t.currentTarget.releasePointerCapture(n.pointerId), !n.started)) return;
173
+ F(!1), z.current = V() + yt, $(n.samples, n.targetPoint);
174
+ const c = wt(n.samples), d = v(), P = d.find((L) => L.key === E) ?? d[0];
175
+ if (!P) return;
176
+ const l = e ? P : pt({
177
+ currentPoint: n.targetPoint,
178
+ velocity: c,
179
+ targets: d
180
+ });
181
+ !e && l.key !== E && (s === void 0 && nt(l.key), w?.(l.key)), O(l, e ? void 0 : c);
182
+ },
183
+ [E, w, s, v, O]
184
+ ), rt = J(
185
+ () => ({
186
+ drag: x,
187
+ dragging: B,
188
+ positioned: b,
189
+ setPositionerNode: G,
190
+ onClickCapture: (t) => {
191
+ V() > z.current || (z.current = 0, t.preventDefault(), t.stopPropagation());
192
+ },
193
+ onLostPointerCapture: (t) => {
194
+ _(t, !1);
195
+ },
196
+ onPointerCancel: (t) => {
197
+ _(t, !0);
198
+ },
199
+ onPointerDown: (t) => {
200
+ if (R || !t.isPrimary || t.button !== 0 || x === "handle" && !St(t.target))
201
+ return;
202
+ m();
203
+ const e = D.current;
204
+ T.current = {
205
+ pointerId: t.pointerId,
206
+ pointerType: t.pointerType,
207
+ started: !1,
208
+ startPointer: { x: t.clientX, y: t.clientY },
209
+ startPoint: e,
210
+ targetPoint: e,
211
+ samples: []
212
+ };
213
+ },
214
+ onPointerMove: (t) => {
215
+ const e = T.current;
216
+ if (!e || e.pointerId !== t.pointerId) return;
217
+ const n = {
218
+ x: t.clientX - e.startPointer.x,
219
+ y: t.clientY - e.startPointer.y
220
+ }, c = e.pointerType === "touch" ? gt : mt;
221
+ if (!e.started && Math.hypot(n.x, n.y) < c)
222
+ return;
223
+ e.started || (e.started = !0, t.currentTarget.setPointerCapture(t.pointerId), F(!0)), t.preventDefault();
224
+ const d = v(), P = S.current;
225
+ if (!d.length || !P) return;
226
+ const l = ft({
227
+ point: {
228
+ x: e.startPoint.x + n.x,
229
+ y: e.startPoint.y + n.y
230
+ },
231
+ size: q(P),
232
+ targets: d
233
+ });
234
+ e.targetPoint = l, Y(l), $(e.samples, l);
235
+ },
236
+ onPointerUp: (t) => {
237
+ _(t, !1);
238
+ }
239
+ }),
240
+ [
241
+ R,
242
+ x,
243
+ B,
244
+ _,
245
+ Y,
246
+ b,
247
+ v,
248
+ G,
249
+ m
250
+ ]
251
+ );
252
+ return /* @__PURE__ */ W(Pt.Provider, { value: rt, children: r });
253
+ }
254
+ function vt({
255
+ children: r,
256
+ className: i = "",
257
+ onClickCapture: s,
258
+ onLostPointerCapture: f,
259
+ onPointerCancel: w,
260
+ onPointerDown: y,
261
+ onPointerMove: I,
262
+ onPointerUp: x,
263
+ ref: R,
264
+ ...S
265
+ }) {
266
+ const a = Q("PositionSnapPositioner"), M = J(
267
+ () => st(a.setPositionerNode, R),
268
+ [a.setPositionerNode, R]
269
+ );
270
+ return /* @__PURE__ */ W(
271
+ "div",
272
+ {
273
+ ...S,
274
+ ref: M,
275
+ className: et(Z.positioner, i),
276
+ "data-oc-component": "position-snap",
277
+ "data-oc-part": "positioner",
278
+ "data-oc-drag": a.drag,
279
+ "data-oc-dragging": a.dragging ? "true" : void 0,
280
+ "data-oc-positioned": a.positioned ? "true" : "false",
281
+ onClickCapture: (o) => {
282
+ s?.(o), o.defaultPrevented || a.onClickCapture(o);
283
+ },
284
+ onLostPointerCapture: (o) => {
285
+ f?.(o), o.defaultPrevented || a.onLostPointerCapture(o);
286
+ },
287
+ onPointerCancel: (o) => {
288
+ w?.(o), o.defaultPrevented || a.onPointerCancel(o);
289
+ },
290
+ onPointerDown: (o) => {
291
+ y?.(o), o.defaultPrevented || a.onPointerDown(o);
292
+ },
293
+ onPointerMove: (o) => {
294
+ I?.(o), o.defaultPrevented || a.onPointerMove(o);
295
+ },
296
+ onPointerUp: (o) => {
297
+ x?.(o), o.defaultPrevented || a.onPointerUp(o);
298
+ },
299
+ children: r
300
+ }
301
+ );
302
+ }
303
+ function ht({
304
+ children: r,
305
+ className: i = "",
306
+ ref: s,
307
+ ...f
308
+ }) {
309
+ return Q("PositionSnapHandle"), /* @__PURE__ */ W(
310
+ "div",
311
+ {
312
+ ...f,
313
+ ref: s,
314
+ className: et(Z.handle, i),
315
+ "data-oc-part": "position-snap-handle",
316
+ children: r
317
+ }
318
+ );
319
+ }
320
+ const _t = Object.assign(K, {
321
+ Root: K,
322
+ Positioner: vt,
323
+ Handle: ht
324
+ });
325
+ export {
326
+ ht as PositionSnapHandle,
327
+ vt as PositionSnapPositioner,
328
+ K as PositionSnapRoot,
329
+ _t as default
330
+ };
@@ -0,0 +1,9 @@
1
+ import './PositionSnap.css';const o = "oc-PositionSnap-module__positioner__-v2BM", n = "oc-PositionSnap-module__handle__iuv3c", e = {
2
+ positioner: o,
3
+ handle: n
4
+ };
5
+ export {
6
+ e as default,
7
+ n as handle,
8
+ o as positioner
9
+ };
@@ -0,0 +1,12 @@
1
+ import { useContext as n, createContext as e } from "react";
2
+ const i = e(null);
3
+ function s(o) {
4
+ const t = n(i);
5
+ if (!t)
6
+ throw new Error(`${o} must be used inside PositionSnapRoot.`);
7
+ return t;
8
+ }
9
+ export {
10
+ i as PositionSnapContext,
11
+ s as usePositionSnapContext
12
+ };
@@ -0,0 +1,75 @@
1
+ function g(t = "viewport") {
2
+ if (t !== "viewport") {
3
+ const n = t.getBoundingClientRect();
4
+ return {
5
+ x: n.left,
6
+ y: n.top,
7
+ width: n.width,
8
+ height: n.height
9
+ };
10
+ }
11
+ const e = window.visualViewport;
12
+ return {
13
+ x: e?.offsetLeft ?? 0,
14
+ y: e?.offsetTop ?? 0,
15
+ width: e?.width ?? document.documentElement.clientWidth,
16
+ height: e?.height ?? document.documentElement.clientHeight
17
+ };
18
+ }
19
+ function x({
20
+ boundary: t,
21
+ direction: e,
22
+ padding: n,
23
+ position: c,
24
+ size: i
25
+ }) {
26
+ const o = t.x + n.left, u = t.x + t.width - n.right - i.width, r = e === "rtl" ? u : o, s = e === "rtl" ? o : u, h = t.y + n.top, l = t.y + t.height - n.bottom - i.height, a = t.x + (t.width - i.width) / 2, f = t.y + (t.height - i.height) / 2;
27
+ switch (c) {
28
+ case "inline-start":
29
+ return { x: r, y: f };
30
+ case "inline-end":
31
+ return { x: s, y: f };
32
+ case "block-start":
33
+ return { x: a, y: h };
34
+ case "block-end":
35
+ return { x: a, y: l };
36
+ case "block-start-inline-start":
37
+ return { x: r, y: h };
38
+ case "block-start-inline-end":
39
+ return { x: s, y: h };
40
+ case "block-end-inline-start":
41
+ return { x: r, y: l };
42
+ case "block-end-inline-end":
43
+ return { x: s, y: l };
44
+ default:
45
+ return { x: a, y: f };
46
+ }
47
+ }
48
+ function w({
49
+ boundary: t,
50
+ direction: e,
51
+ padding: n,
52
+ positions: c,
53
+ size: i
54
+ }) {
55
+ return c.map((o) => ({
56
+ key: o,
57
+ ...x({
58
+ boundary: t,
59
+ direction: e,
60
+ padding: n,
61
+ position: o,
62
+ size: i
63
+ })
64
+ }));
65
+ }
66
+ function p(t) {
67
+ const e = Math.max(0, t);
68
+ return { top: e, right: e, bottom: e, left: e };
69
+ }
70
+ export {
71
+ g as getPositionSnapBoundaryRect,
72
+ x as resolvePositionSnapPoint,
73
+ w as resolvePositionSnapTargets,
74
+ p as uniformPositionSnapPadding
75
+ };
@@ -0,0 +1,7 @@
1
+ import { ocSpring as o } from "../../utils/spring.js";
2
+ const r = o.snappy({
3
+ duration: 1 / 12
4
+ });
5
+ export {
6
+ r as POSITION_SNAP_DRAG_FOLLOWER_SPRING
7
+ };
@@ -0,0 +1,60 @@
1
+ function a(n, t, _) {
2
+ return Math.min(Math.max(n, t), _);
3
+ }
4
+ function c(n, t) {
5
+ return Math.hypot(n.x - t.x, n.y - t.y);
6
+ }
7
+ function R(n, t) {
8
+ return n.reduce(
9
+ (_, S) => c(S, t) < c(_, t) ? S : _
10
+ );
11
+ }
12
+ function C({
13
+ currentPoint: n,
14
+ velocity: t,
15
+ targets: _
16
+ }) {
17
+ const S = {
18
+ x: n.x + a(
19
+ t.x * 0.16,
20
+ -24,
21
+ 24
22
+ ),
23
+ y: n.y + a(
24
+ t.y * 0.16,
25
+ -24,
26
+ 24
27
+ )
28
+ };
29
+ if (!(Math.hypot(t.x, t.y) / 1e3 > 0.55)) return R(_, n);
30
+ const o = _.filter((s) => {
31
+ const A = s.x - n.x, E = s.y - n.y;
32
+ return A * t.x + E * t.y > 0;
33
+ });
34
+ return R(
35
+ o.length ? o : _,
36
+ S
37
+ );
38
+ }
39
+ function x(n, t, _, S) {
40
+ if (n >= t && n <= _) return n;
41
+ const N = n < t ? t : _, o = Math.abs(n - N), s = o * 0.55 * S / (S + 0.55 * o);
42
+ return n < t ? N - s : N + s;
43
+ }
44
+ function O({
45
+ point: n,
46
+ size: t,
47
+ targets: _
48
+ }) {
49
+ 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);
50
+ return {
51
+ x: x(n.x, o, s, Math.max(t.width, 1)),
52
+ y: x(n.y, A, E, Math.max(t.height, 1))
53
+ };
54
+ }
55
+ export {
56
+ R as getNearestPositionSnapTarget,
57
+ c as getPositionSnapPointDistance,
58
+ C as getReleasePositionSnapTarget,
59
+ O as resolvePositionSnapDragPoint
60
+ };
@@ -0,0 +1,6 @@
1
+ export * from '../ui/src/components/PositionSnap/index'
2
+ export {}
3
+ import _default from '../ui/src/components/PositionSnap/index'
4
+ export default _default
5
+ export * from '../ui/src/components/PositionSnap/index'
6
+ export {}