@orioncactuscorp/ui 1.17.0 → 1.18.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.
- package/CHANGELOG.md +91 -0
- package/README.md +16 -14
- package/dist/components/BackgroundIconButton/BackgroundIconButton.css +1 -1
- package/dist/components/Modal/Modal.css +1 -1
- package/dist/components/Modal/Modal.js +514 -471
- package/dist/components/Modal/Modal.module.scss.js +59 -57
- package/dist/components/Modal/fieldReveal.js +57 -0
- package/dist/components/Modal/headerTapScroll.js +10 -0
- package/dist/components/Modal/keyboardEditable.js +31 -0
- package/dist/components/Modal/keyboardInsetMemory.js +24 -0
- package/dist/components/Modal/keyboardSession.js +46 -73
- package/dist/components/Modal/scrollportScroller.js +43 -0
- package/dist/components/Modal/tapCaret.js +32 -0
- package/dist/components/Modal/useBottomSheetIntrinsicHeight.js +26 -23
- package/dist/components/Modal/useFieldReveal.js +81 -0
- package/dist/components/Modal/useModalDrag.js +1025 -977
- package/dist/components/Modal/useModalKeyboardAvoidance.js +200 -117
- package/dist/components/Modal/useModalViewportGeometry.js +35 -19
- package/dist/components/PositionSnap/policy.js +40 -43
- package/dist/styles.css +2 -2
- package/dist/ui/src/components/Modal/Modal.d.ts +1 -1
- package/dist/ui/src/components/Modal/Modal.d.ts.map +1 -1
- package/dist/ui/src/components/Modal/Modal.test.utils.d.ts +12 -0
- package/dist/ui/src/components/Modal/Modal.test.utils.d.ts.map +1 -0
- package/dist/ui/src/components/Modal/contexts.d.ts +5 -0
- package/dist/ui/src/components/Modal/contexts.d.ts.map +1 -1
- package/dist/ui/src/components/Modal/fieldReveal.d.ts +18 -0
- package/dist/ui/src/components/Modal/fieldReveal.d.ts.map +1 -0
- package/dist/ui/src/components/Modal/headerTapScroll.d.ts +5 -0
- package/dist/ui/src/components/Modal/headerTapScroll.d.ts.map +1 -0
- package/dist/ui/src/components/Modal/keyboardEditable.d.ts +6 -0
- package/dist/ui/src/components/Modal/keyboardEditable.d.ts.map +1 -0
- package/dist/ui/src/components/Modal/keyboardInsetMemory.d.ts +5 -0
- package/dist/ui/src/components/Modal/keyboardInsetMemory.d.ts.map +1 -0
- package/dist/ui/src/components/Modal/keyboardSession.d.ts +4 -11
- package/dist/ui/src/components/Modal/keyboardSession.d.ts.map +1 -1
- package/dist/ui/src/components/Modal/scrollportScroller.d.ts +20 -0
- package/dist/ui/src/components/Modal/scrollportScroller.d.ts.map +1 -0
- package/dist/ui/src/components/Modal/tapCaret.d.ts +10 -0
- package/dist/ui/src/components/Modal/tapCaret.d.ts.map +1 -0
- package/dist/ui/src/components/Modal/useBottomSheetIntrinsicHeight.d.ts +8 -1
- package/dist/ui/src/components/Modal/useBottomSheetIntrinsicHeight.d.ts.map +1 -1
- package/dist/ui/src/components/Modal/useFieldReveal.d.ts +28 -0
- package/dist/ui/src/components/Modal/useFieldReveal.d.ts.map +1 -0
- package/dist/ui/src/components/Modal/useModalDrag.d.ts.map +1 -1
- package/dist/ui/src/components/Modal/useModalKeyboardAvoidance.d.ts +6 -1
- package/dist/ui/src/components/Modal/useModalKeyboardAvoidance.d.ts.map +1 -1
- package/dist/ui/src/components/Modal/useModalViewportGeometry.d.ts +1 -0
- package/dist/ui/src/components/Modal/useModalViewportGeometry.d.ts.map +1 -1
- package/dist/ui/src/components/PositionSnap/policy.d.ts.map +1 -1
- package/dist/ui/src/utils/gesture.d.ts +58 -0
- package/dist/ui/src/utils/gesture.d.ts.map +1 -0
- package/dist/utils/gesture.d.ts +2 -0
- package/dist/utils/gesture.js +103 -0
- package/docs/gesture.md +64 -0
- package/docs/selector-contract.md +5 -1
- package/docs/spring.md +4 -0
- package/package.json +5 -1
|
@@ -1,76 +1,78 @@
|
|
|
1
|
-
import './Modal.css';const o = "oc-Modal-module__trigger__B-N3y", a = "oc-Modal-module__backdrop__jYpTA", e = "oc-Modal-module__viewport__8dW9u", n = "oc-Modal-module__surfaceMotion__fJnTQ", _ = "oc-Modal-module__initialFocusTitle__eIZKr", l = "oc-Modal-
|
|
1
|
+
import './Modal.css';const o = "oc-Modal-module__trigger__B-N3y", a = "oc-Modal-module__backdrop__jYpTA", e = "oc-Modal-module__viewport__8dW9u", n = "oc-Modal-module__surfaceMotion__fJnTQ", _ = "oc-Modal-module__initialFocusTitle__eIZKr", l = "oc-Modal-module__bodyContainer__t57Y6", d = "oc-Modal-module__bottomFill__wKrvv", t = "oc-Modal-module__surface__FnAX8", i = "oc-Modal-module__feedbackOdd__auvRQ", c = "oc-Modal-module__feedbackEven__xT95f", r = "oc-Modal-module__header__NS30G", m = "oc-Modal-module__footer__Oyz-R", s = "oc-Modal-module__small__qdBEU", u = "oc-Modal-module__medium__JRDXg", g = "oc-Modal-module__large__O42Af", v = "oc-Modal-module__fixed__Gj1Dv", M = "oc-Modal-module__navigationSection__oHkbv", h = "oc-Modal-module__handleArea__cLoTW", f = "oc-Modal-module__handle__Fan4V", b = "oc-Modal-module__headerInner__F5nxn", T = "oc-Modal-module__headerLeading__v735-", k = "oc-Modal-module__headerTrailing__hQamr", y = "oc-Modal-module__headerTitle__tJ2Qv", F = "oc-Modal-module__headerBottom__g-Jta", P = "oc-Modal-module__close__058gy", I = "oc-Modal-module__navigationDialogTitle__vkGhC", p = "oc-Modal-module__navigationHeading__XioS6", j = "oc-Modal-module__navigation__ldQt-", S = "oc-Modal-module__navigationTitle__ncfjD", C = "oc-Modal-module__navigationIndicator__swRE1", D = "oc-Modal-module__navigationPanel__conuU", R = "oc-Modal-module__navigationPanelScroll__UO-ue", x = "oc-Modal-module__navigationPanelFrame__RljMi", A = "oc-Modal-module__navigationPanelInner__k0D4f", O = "oc-Modal-module__body__3zIj9", w = "oc-Modal-module__bodyContent__fRK23", B = {
|
|
2
2
|
trigger: o,
|
|
3
3
|
backdrop: a,
|
|
4
4
|
viewport: e,
|
|
5
5
|
surfaceMotion: n,
|
|
6
6
|
initialFocusTitle: _,
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
7
|
+
bodyContainer: l,
|
|
8
|
+
bottomFill: d,
|
|
9
|
+
surface: t,
|
|
10
|
+
feedbackOdd: i,
|
|
10
11
|
"oc-modal-reject-shake": "oc-Modal-module__oc-modal-reject-shake__RJrNe",
|
|
11
|
-
feedbackEven:
|
|
12
|
+
feedbackEven: c,
|
|
12
13
|
"oc-modal-reject-shake-replay": "oc-Modal-module__oc-modal-reject-shake-replay__cbWGX",
|
|
13
|
-
header:
|
|
14
|
-
footer:
|
|
15
|
-
small:
|
|
16
|
-
medium:
|
|
14
|
+
header: r,
|
|
15
|
+
footer: m,
|
|
16
|
+
small: s,
|
|
17
|
+
medium: u,
|
|
17
18
|
large: g,
|
|
18
|
-
fixed:
|
|
19
|
-
navigationSection:
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
19
|
+
fixed: v,
|
|
20
|
+
navigationSection: M,
|
|
21
|
+
handleArea: h,
|
|
22
|
+
handle: f,
|
|
23
|
+
headerInner: b,
|
|
24
|
+
headerLeading: T,
|
|
25
|
+
headerTrailing: k,
|
|
26
|
+
headerTitle: y,
|
|
27
|
+
headerBottom: F,
|
|
28
|
+
close: P,
|
|
29
|
+
navigationDialogTitle: I,
|
|
30
|
+
navigationHeading: p,
|
|
31
|
+
navigation: j,
|
|
32
|
+
navigationTitle: S,
|
|
33
|
+
navigationIndicator: C,
|
|
34
|
+
navigationPanel: D,
|
|
35
|
+
navigationPanelScroll: R,
|
|
36
|
+
navigationPanelFrame: x,
|
|
37
|
+
navigationPanelInner: A,
|
|
38
|
+
body: O,
|
|
38
39
|
bodyContent: w
|
|
39
40
|
};
|
|
40
41
|
export {
|
|
41
42
|
a as backdrop,
|
|
42
|
-
|
|
43
|
-
|
|
43
|
+
O as body,
|
|
44
|
+
l as bodyContainer,
|
|
44
45
|
w as bodyContent,
|
|
45
|
-
|
|
46
|
-
|
|
46
|
+
d as bottomFill,
|
|
47
|
+
P as close,
|
|
47
48
|
B as default,
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
T as
|
|
58
|
-
|
|
49
|
+
c as feedbackEven,
|
|
50
|
+
i as feedbackOdd,
|
|
51
|
+
v as fixed,
|
|
52
|
+
m as footer,
|
|
53
|
+
f as handle,
|
|
54
|
+
h as handleArea,
|
|
55
|
+
r as header,
|
|
56
|
+
F as headerBottom,
|
|
57
|
+
b as headerInner,
|
|
58
|
+
T as headerLeading,
|
|
59
|
+
y as headerTitle,
|
|
60
|
+
k as headerTrailing,
|
|
59
61
|
_ as initialFocusTitle,
|
|
60
62
|
g as large,
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
63
|
+
u as medium,
|
|
64
|
+
j as navigation,
|
|
65
|
+
I as navigationDialogTitle,
|
|
66
|
+
p as navigationHeading,
|
|
67
|
+
C as navigationIndicator,
|
|
68
|
+
D as navigationPanel,
|
|
69
|
+
x as navigationPanelFrame,
|
|
70
|
+
A as navigationPanelInner,
|
|
71
|
+
R as navigationPanelScroll,
|
|
72
|
+
M as navigationSection,
|
|
73
|
+
S as navigationTitle,
|
|
74
|
+
s as small,
|
|
75
|
+
t as surface,
|
|
74
76
|
n as surfaceMotion,
|
|
75
77
|
o as trigger,
|
|
76
78
|
e as viewport
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
const E = 16, d = 48;
|
|
2
|
+
function i({
|
|
3
|
+
labelRects: e,
|
|
4
|
+
targetRect: t
|
|
5
|
+
}) {
|
|
6
|
+
let n = t.top;
|
|
7
|
+
for (const o of e) {
|
|
8
|
+
const l = t.top - o.bottom;
|
|
9
|
+
o.top < n && l >= 0 && l <= 48 && (n = o.top);
|
|
10
|
+
}
|
|
11
|
+
return { bottom: t.bottom, top: n };
|
|
12
|
+
}
|
|
13
|
+
function b(e) {
|
|
14
|
+
const t = /* @__PURE__ */ new Set();
|
|
15
|
+
(e instanceof HTMLInputElement || e instanceof HTMLTextAreaElement) && e.labels && e.labels.forEach((o) => t.add(o));
|
|
16
|
+
const n = e.getAttribute("aria-labelledby");
|
|
17
|
+
if (n)
|
|
18
|
+
for (const o of n.split(/\s+/)) {
|
|
19
|
+
const l = o ? e.ownerDocument.getElementById(o) : null;
|
|
20
|
+
l instanceof HTMLElement && t.add(l);
|
|
21
|
+
}
|
|
22
|
+
return Array.from(t);
|
|
23
|
+
}
|
|
24
|
+
function f(e) {
|
|
25
|
+
return i({
|
|
26
|
+
labelRects: b(e).map(
|
|
27
|
+
(t) => t.getBoundingClientRect()
|
|
28
|
+
),
|
|
29
|
+
targetRect: e.getBoundingClientRect()
|
|
30
|
+
});
|
|
31
|
+
}
|
|
32
|
+
function A(e) {
|
|
33
|
+
const t = Number.parseFloat(e ?? "");
|
|
34
|
+
return Number.isFinite(t) && t > 0 ? t : 0;
|
|
35
|
+
}
|
|
36
|
+
function m({
|
|
37
|
+
bodyRect: e,
|
|
38
|
+
clearanceInset: t,
|
|
39
|
+
footerHeight: n,
|
|
40
|
+
revealed: o,
|
|
41
|
+
scrollPaddingStart: l,
|
|
42
|
+
targetRect: s
|
|
43
|
+
}) {
|
|
44
|
+
const r = e.top + l, a = s.top - r;
|
|
45
|
+
if (!o) return a;
|
|
46
|
+
const c = e.bottom - t - n;
|
|
47
|
+
return s.bottom > c - 16 || s.top < r ? a : 0;
|
|
48
|
+
}
|
|
49
|
+
export {
|
|
50
|
+
d as KEYBOARD_REVEAL_LABEL_MAX_GAP,
|
|
51
|
+
E as KEYBOARD_REVEAL_SCROLL_PADDING,
|
|
52
|
+
b as getKeyboardRevealLabels,
|
|
53
|
+
i as getKeyboardRevealRect,
|
|
54
|
+
m as getKeyboardRevealScrollDelta,
|
|
55
|
+
f as getKeyboardRevealTargetRect,
|
|
56
|
+
A as parseScrollPadding
|
|
57
|
+
};
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
const o = /* @__PURE__ */ new Set([
|
|
2
|
+
"email",
|
|
3
|
+
"number",
|
|
4
|
+
"password",
|
|
5
|
+
"search",
|
|
6
|
+
"tel",
|
|
7
|
+
"text",
|
|
8
|
+
"url"
|
|
9
|
+
]), i = /* @__PURE__ */ new Set(["decimal", "numeric", "tel"]), r = /* @__PURE__ */ new Set(["number", "tel"]);
|
|
10
|
+
function t(e) {
|
|
11
|
+
return !(e instanceof HTMLElement) || e.hasAttribute("disabled") || e.getAttribute("inputmode")?.toLowerCase() === "none" ? !1 : e.isContentEditable ? !0 : !(e instanceof HTMLInputElement) && !(e instanceof HTMLTextAreaElement) || e.readOnly ? !1 : e instanceof HTMLTextAreaElement ? !0 : o.has(e.type.toLowerCase());
|
|
12
|
+
}
|
|
13
|
+
function u(e) {
|
|
14
|
+
if (t(e)) return e;
|
|
15
|
+
if (!(e instanceof HTMLElement)) return null;
|
|
16
|
+
const n = e.closest("label")?.control ?? null;
|
|
17
|
+
return t(n) ? n : null;
|
|
18
|
+
}
|
|
19
|
+
function s(e) {
|
|
20
|
+
const n = e.getAttribute("inputmode")?.toLowerCase();
|
|
21
|
+
return n !== void 0 && n !== "" ? i.has(n) ? "numeric" : "text" : e instanceof HTMLInputElement && r.has(e.type.toLowerCase()) ? "numeric" : "text";
|
|
22
|
+
}
|
|
23
|
+
function l(e) {
|
|
24
|
+
return e.navigator.maxTouchPoints > 0 && typeof e.matchMedia == "function" && e.matchMedia("(pointer: coarse)").matches;
|
|
25
|
+
}
|
|
26
|
+
export {
|
|
27
|
+
s as getKeyboardClass,
|
|
28
|
+
u as getTapEditable,
|
|
29
|
+
l as hasSoftKeyboardEnvironment,
|
|
30
|
+
t as isKeyboardEditable
|
|
31
|
+
};
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
const r = /* @__PURE__ */ new Map();
|
|
2
|
+
function d(o, s, e) {
|
|
3
|
+
const t = Math.round(o), n = r.get(t) ?? {};
|
|
4
|
+
r.set(t, {
|
|
5
|
+
...n,
|
|
6
|
+
[s]: e
|
|
7
|
+
});
|
|
8
|
+
}
|
|
9
|
+
function c(o, s) {
|
|
10
|
+
const e = r.get(
|
|
11
|
+
Math.round(o)
|
|
12
|
+
);
|
|
13
|
+
if (!e) return;
|
|
14
|
+
const t = e[s];
|
|
15
|
+
if (t !== void 0) return t;
|
|
16
|
+
const n = Object.values(e).filter(
|
|
17
|
+
(a) => a !== void 0
|
|
18
|
+
);
|
|
19
|
+
return n.length > 0 ? Math.max(...n) : void 0;
|
|
20
|
+
}
|
|
21
|
+
export {
|
|
22
|
+
c as getSeedKeyboardInset,
|
|
23
|
+
d as recordMeasuredKeyboardInset
|
|
24
|
+
};
|
|
@@ -1,34 +1,33 @@
|
|
|
1
|
-
const
|
|
2
|
-
|
|
3
|
-
"number",
|
|
4
|
-
"password",
|
|
5
|
-
"search",
|
|
6
|
-
"tel",
|
|
7
|
-
"text",
|
|
8
|
-
"url"
|
|
9
|
-
]), i = /* @__PURE__ */ new Map();
|
|
10
|
-
function l(t, e) {
|
|
11
|
-
i.set(Math.round(t), e);
|
|
12
|
-
}
|
|
13
|
-
function b(t) {
|
|
14
|
-
return i.get(Math.round(t));
|
|
15
|
-
}
|
|
16
|
-
function c(t, e) {
|
|
1
|
+
const h = 80, u = 2;
|
|
2
|
+
function f(t, e) {
|
|
17
3
|
switch (e.type) {
|
|
18
4
|
case "focus": {
|
|
19
|
-
const { geometry:
|
|
20
|
-
return t &&
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
5
|
+
const { geometry: a, keyboardClass: r, target: i } = e;
|
|
6
|
+
return t && Math.abs(t.baselineWidth - a.width) < 80 ? {
|
|
7
|
+
...t,
|
|
8
|
+
baselineHeight: Math.max(t.baselineHeight, a.height),
|
|
9
|
+
baselineWidth: a.width,
|
|
10
|
+
keyboardClass: r,
|
|
11
|
+
phase: "active",
|
|
12
|
+
target: i
|
|
13
|
+
} : {
|
|
14
|
+
baselineHeight: a.height,
|
|
15
|
+
baselineOffsetLeft: a.offsetLeft,
|
|
16
|
+
baselineOffsetTop: a.offsetTop,
|
|
17
|
+
baselineWidth: a.width,
|
|
18
|
+
keyboardClass: r,
|
|
25
19
|
phase: "active",
|
|
26
20
|
sawKeyboard: !1,
|
|
27
|
-
target:
|
|
21
|
+
target: i
|
|
28
22
|
};
|
|
29
23
|
}
|
|
30
24
|
case "retain":
|
|
31
|
-
return t && {
|
|
25
|
+
return t && {
|
|
26
|
+
...t,
|
|
27
|
+
keyboardClass: e.keyboardClass,
|
|
28
|
+
phase: "active",
|
|
29
|
+
target: e.target
|
|
30
|
+
};
|
|
32
31
|
case "close":
|
|
33
32
|
return t && { ...t, phase: "closing", target: null };
|
|
34
33
|
case "measure":
|
|
@@ -37,68 +36,42 @@ function c(t, e) {
|
|
|
37
36
|
return;
|
|
38
37
|
}
|
|
39
38
|
}
|
|
40
|
-
function
|
|
41
|
-
return !(t instanceof HTMLElement) || t.hasAttribute("disabled") ? !1 : t.isContentEditable || t.tagName === "TEXTAREA" ? !0 : t.tagName !== "INPUT" ? !1 : u.has(
|
|
42
|
-
(t.getAttribute("type") ?? "text").toLowerCase()
|
|
43
|
-
);
|
|
44
|
-
}
|
|
45
|
-
function o(t, e) {
|
|
39
|
+
function n(t, e) {
|
|
46
40
|
return !t || !e || Math.abs(t.baselineWidth - e.width) < 80;
|
|
47
41
|
}
|
|
48
|
-
function
|
|
42
|
+
function l(t, e) {
|
|
49
43
|
return Math.abs(t.baselineHeight - e.height) <= 2;
|
|
50
44
|
}
|
|
51
|
-
function
|
|
52
|
-
return !t || //
|
|
53
|
-
//
|
|
54
|
-
//
|
|
55
|
-
|
|
45
|
+
function c(t, e) {
|
|
46
|
+
return !t || // Blur is the only "keyboard will hide" signal the page gets: iOS reports
|
|
47
|
+
// the restored geometry in one sample only after its whole dismissal
|
|
48
|
+
// choreography (~0.5s). A closing session targets the resting inset at
|
|
49
|
+
// once and the footer glides down over that span (see the closing
|
|
50
|
+
// transition in Modal.module.scss) instead of waiting for the sample.
|
|
51
|
+
t.phase === "closing" || !e || !n(t, e) ? 0 : Math.max(0, t.baselineHeight - e.height);
|
|
56
52
|
}
|
|
57
|
-
function
|
|
58
|
-
|
|
59
|
-
return e;
|
|
60
|
-
const n = Math.max(t.baselineHeight, e.height);
|
|
61
|
-
return t.phase !== "closing" ? { ...e, height: n } : {
|
|
53
|
+
function o(t, e) {
|
|
54
|
+
return !t || !e || !n(t, e) ? e : {
|
|
62
55
|
...e,
|
|
63
|
-
height:
|
|
64
|
-
// A closing session targets the resting pan at once so the container
|
|
65
|
-
// glides back in step with the keyboard and the inset drop, instead of
|
|
66
|
-
// chasing WebKit's late restore samples and stranding the sheet offset
|
|
67
|
-
// until a terminal snap.
|
|
68
|
-
offsetLeft: t.baselineOffsetLeft,
|
|
69
|
-
offsetTop: t.baselineOffsetTop
|
|
56
|
+
height: Math.max(t.baselineHeight, e.height)
|
|
70
57
|
};
|
|
71
58
|
}
|
|
72
|
-
function
|
|
73
|
-
bodyRect: t,
|
|
74
|
-
clearanceInset: e,
|
|
75
|
-
footerHeight: n,
|
|
76
|
-
targetRect: r
|
|
77
|
-
}) {
|
|
78
|
-
const a = t.bottom - e - n;
|
|
79
|
-
return r.bottom > a - 16 ? r.bottom - a + 16 : r.top < t.top + 16 ? r.top - t.top - 16 : 0;
|
|
80
|
-
}
|
|
81
|
-
function A(t) {
|
|
59
|
+
function b(t) {
|
|
82
60
|
return t !== null && typeof t.getAnimations == "function" && typeof CSSTransition < "u";
|
|
83
61
|
}
|
|
84
|
-
function
|
|
62
|
+
function E(t) {
|
|
85
63
|
return t.getAnimations({ subtree: !0 }).some(
|
|
86
64
|
(e) => e instanceof CSSTransition && e.transitionProperty === "transform" && e.playState === "running"
|
|
87
65
|
);
|
|
88
66
|
}
|
|
89
67
|
export {
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
o as isSessionGeometryCompatible,
|
|
100
|
-
_ as isSessionGeometryRestored,
|
|
101
|
-
c as keyboardSessionReducer,
|
|
102
|
-
l as recordMeasuredKeyboardInset,
|
|
103
|
-
A as supportsTransitionSettleDetection
|
|
68
|
+
u as KEYBOARD_VIEWPORT_RESTORE_EPSILON,
|
|
69
|
+
h as KEYBOARD_VIEWPORT_WIDTH_CHANGE_THRESHOLD,
|
|
70
|
+
c as getKeyboardInset,
|
|
71
|
+
o as getSessionStableViewportGeometry,
|
|
72
|
+
E as hasRunningTransformTransition,
|
|
73
|
+
n as isSessionGeometryCompatible,
|
|
74
|
+
l as isSessionGeometryRestored,
|
|
75
|
+
f as keyboardSessionReducer,
|
|
76
|
+
b as supportsTransitionSettleDetection
|
|
104
77
|
};
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import { resolveOcMotion as s } from "../../utils/motion.js";
|
|
2
|
+
import { createSpringAnimator as u } from "../../utils/spring/animator.js";
|
|
3
|
+
function m() {
|
|
4
|
+
let e = null;
|
|
5
|
+
const t = () => {
|
|
6
|
+
e?.destroy(), e = null;
|
|
7
|
+
};
|
|
8
|
+
return {
|
|
9
|
+
scrollTo(n, o, { smooth: i = !0 } = {}) {
|
|
10
|
+
t();
|
|
11
|
+
const r = i ? s({
|
|
12
|
+
element: n,
|
|
13
|
+
intent: "sheet",
|
|
14
|
+
reducedMotion: window.matchMedia?.("(prefers-reduced-motion: reduce)").matches === !0
|
|
15
|
+
}) : void 0;
|
|
16
|
+
if (!r?.animate) {
|
|
17
|
+
n.scrollTo({ behavior: "instant", top: o });
|
|
18
|
+
return;
|
|
19
|
+
}
|
|
20
|
+
e = u({
|
|
21
|
+
value: n.scrollTop,
|
|
22
|
+
target: o,
|
|
23
|
+
spring: r.spring,
|
|
24
|
+
epsilon: 0.5,
|
|
25
|
+
velocityEpsilon: 20,
|
|
26
|
+
onUpdate: (l) => {
|
|
27
|
+
n.scrollTop = Math.round(l);
|
|
28
|
+
},
|
|
29
|
+
onComplete: () => {
|
|
30
|
+
n.scrollTop = o, e = null;
|
|
31
|
+
}
|
|
32
|
+
});
|
|
33
|
+
},
|
|
34
|
+
isRunning: () => e?.isRunning === !0,
|
|
35
|
+
stop() {
|
|
36
|
+
e?.stop(), e = null;
|
|
37
|
+
},
|
|
38
|
+
destroy: t
|
|
39
|
+
};
|
|
40
|
+
}
|
|
41
|
+
export {
|
|
42
|
+
m as createScrollportScroller
|
|
43
|
+
};
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
function i(n, e, o) {
|
|
2
|
+
const r = n.ownerDocument;
|
|
3
|
+
if (typeof r.caretRangeFromPoint != "function") return null;
|
|
4
|
+
let t = null;
|
|
5
|
+
try {
|
|
6
|
+
t = r.caretRangeFromPoint(e, o);
|
|
7
|
+
} catch {
|
|
8
|
+
return null;
|
|
9
|
+
}
|
|
10
|
+
if (!t) return null;
|
|
11
|
+
if (n instanceof HTMLInputElement || n instanceof HTMLTextAreaElement) {
|
|
12
|
+
const f = t.startContainer;
|
|
13
|
+
return f.nodeType === Node.TEXT_NODE && f.textContent === n.value ? { kind: "offset", offset: t.startOffset } : null;
|
|
14
|
+
}
|
|
15
|
+
return n.contains(t.startContainer) ? { kind: "range", range: t } : null;
|
|
16
|
+
}
|
|
17
|
+
function l(n, e) {
|
|
18
|
+
if (e)
|
|
19
|
+
try {
|
|
20
|
+
if (e.kind === "offset") {
|
|
21
|
+
(n instanceof HTMLInputElement || n instanceof HTMLTextAreaElement) && n.setSelectionRange(e.offset, e.offset);
|
|
22
|
+
return;
|
|
23
|
+
}
|
|
24
|
+
const o = n.ownerDocument.getSelection();
|
|
25
|
+
o?.removeAllRanges(), o?.addRange(e.range);
|
|
26
|
+
} catch {
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
export {
|
|
30
|
+
i as captureTapCaret,
|
|
31
|
+
l as restoreTapCaret
|
|
32
|
+
};
|
|
@@ -1,55 +1,58 @@
|
|
|
1
|
-
import { useState as
|
|
2
|
-
import { resolveContentSizedBottomSheetHeight as
|
|
3
|
-
import { useModalContentSizeSignal as
|
|
4
|
-
function
|
|
1
|
+
import { useState as S, useRef as C, useCallback as f, useLayoutEffect as H } from "react";
|
|
2
|
+
import { resolveContentSizedBottomSheetHeight as x } from "./bottomSheetGeometry.js";
|
|
3
|
+
import { useModalContentSizeSignal as v } from "./useModalContentSizeSignal.js";
|
|
4
|
+
function w(t) {
|
|
5
5
|
const e = t.trim();
|
|
6
6
|
if (!e.endsWith("px")) return;
|
|
7
7
|
const n = Number.parseFloat(e);
|
|
8
8
|
return Number.isFinite(n) && n > 0 ? n : void 0;
|
|
9
9
|
}
|
|
10
|
-
function
|
|
10
|
+
function B(t) {
|
|
11
11
|
if (!(!t || typeof window > "u"))
|
|
12
|
-
return
|
|
12
|
+
return w(window.getComputedStyle(t).maxHeight);
|
|
13
13
|
}
|
|
14
|
-
function
|
|
14
|
+
function D({
|
|
15
15
|
enabled: t,
|
|
16
16
|
bodyNode: e,
|
|
17
17
|
surfaceMotionNode: n,
|
|
18
18
|
snapSheetHeight: u,
|
|
19
|
-
viewportHeight:
|
|
20
|
-
discreteKey:
|
|
19
|
+
viewportHeight: g,
|
|
20
|
+
discreteKey: l,
|
|
21
|
+
frozen: c = !1
|
|
21
22
|
}) {
|
|
22
|
-
const [
|
|
23
|
+
const [r, m] = S(0), o = C(!1), i = f(() => {
|
|
23
24
|
const s = e?.firstElementChild;
|
|
24
25
|
if (!t || !s) {
|
|
25
|
-
|
|
26
|
+
o.current = !1;
|
|
26
27
|
return;
|
|
27
28
|
}
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
29
|
+
if (c) return;
|
|
30
|
+
const p = s.getBoundingClientRect().height, a = x({
|
|
31
|
+
contentHeight: p,
|
|
32
|
+
maxHeight: B(n),
|
|
31
33
|
snapHeight: u
|
|
32
|
-
}),
|
|
33
|
-
|
|
34
|
+
}), h = Math.abs(r - a) > 0.5;
|
|
35
|
+
o.current = h, h && m(a);
|
|
34
36
|
}, [
|
|
35
37
|
e,
|
|
36
38
|
t,
|
|
37
|
-
|
|
39
|
+
c,
|
|
40
|
+
r,
|
|
38
41
|
u,
|
|
39
42
|
n
|
|
40
43
|
]);
|
|
41
|
-
|
|
44
|
+
H(() => {
|
|
42
45
|
i();
|
|
43
|
-
}, [i,
|
|
46
|
+
}, [i, g]), v({
|
|
44
47
|
enabled: t,
|
|
45
48
|
bodyNode: e,
|
|
46
|
-
discreteKey:
|
|
49
|
+
discreteKey: l,
|
|
47
50
|
onDiscreteChange: i,
|
|
48
51
|
onObservedChange: i
|
|
49
52
|
});
|
|
50
|
-
const
|
|
51
|
-
return { intrinsicSheetHeight:
|
|
53
|
+
const d = f(() => o.current, []);
|
|
54
|
+
return { intrinsicSheetHeight: r, shouldDeferSettle: d };
|
|
52
55
|
}
|
|
53
56
|
export {
|
|
54
|
-
|
|
57
|
+
D as useBottomSheetIntrinsicHeight
|
|
55
58
|
};
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
import { useRef as a, useLayoutEffect as B, useCallback as i, useMemo as C } from "react";
|
|
2
|
+
import { getKeyboardRevealScrollDelta as h, getKeyboardRevealTargetRect as E, parseScrollPadding as u } from "./fieldReveal.js";
|
|
3
|
+
const w = "--_-modal-keyboard-inset-settled";
|
|
4
|
+
function _({
|
|
5
|
+
bodyNode: g,
|
|
6
|
+
footerHeight: R,
|
|
7
|
+
onReserveRendered: p,
|
|
8
|
+
scroller: n,
|
|
9
|
+
viewportNode: f
|
|
10
|
+
}) {
|
|
11
|
+
const s = a(g), d = a(R), y = a(f), T = a(p);
|
|
12
|
+
B(() => {
|
|
13
|
+
s.current = g, d.current = R, y.current = f, T.current = p;
|
|
14
|
+
});
|
|
15
|
+
const b = i(
|
|
16
|
+
(o, {
|
|
17
|
+
clearanceInset: r,
|
|
18
|
+
revealed: t,
|
|
19
|
+
smooth: c
|
|
20
|
+
}) => {
|
|
21
|
+
const e = s.current;
|
|
22
|
+
if (!e) return !1;
|
|
23
|
+
const l = window.getComputedStyle(e), P = h({
|
|
24
|
+
bodyRect: e.getBoundingClientRect(),
|
|
25
|
+
clearanceInset: r,
|
|
26
|
+
footerHeight: d.current,
|
|
27
|
+
revealed: t,
|
|
28
|
+
// jsdom resolves only the physical alias.
|
|
29
|
+
scrollPaddingStart: u(
|
|
30
|
+
l.scrollPaddingBlockStart || l.scrollPaddingTop
|
|
31
|
+
),
|
|
32
|
+
targetRect: E(o)
|
|
33
|
+
});
|
|
34
|
+
if (Math.abs(P) <= 0.5) return !0;
|
|
35
|
+
const m = e.scrollTop + P;
|
|
36
|
+
return n.scrollTo(e, m, { smooth: c }), c || Math.abs(e.scrollTop - m) <= 0.5;
|
|
37
|
+
},
|
|
38
|
+
[n]
|
|
39
|
+
), S = i((o) => {
|
|
40
|
+
const r = y.current;
|
|
41
|
+
if (!r) return;
|
|
42
|
+
const t = u(
|
|
43
|
+
r.style.getPropertyValue(w)
|
|
44
|
+
);
|
|
45
|
+
o <= t || (r.style.setProperty(w, `${o}px`), T.current(o));
|
|
46
|
+
}, []), v = i(
|
|
47
|
+
(o, r) => {
|
|
48
|
+
const t = s.current;
|
|
49
|
+
if (!t) return () => {
|
|
50
|
+
};
|
|
51
|
+
const c = t.scrollTop, e = window.getComputedStyle(t), l = h({
|
|
52
|
+
bodyRect: t.getBoundingClientRect(),
|
|
53
|
+
clearanceInset: r,
|
|
54
|
+
footerHeight: d.current,
|
|
55
|
+
revealed: !1,
|
|
56
|
+
scrollPaddingStart: u(
|
|
57
|
+
e.scrollPaddingBlockStart || e.scrollPaddingTop
|
|
58
|
+
),
|
|
59
|
+
targetRect: E(o)
|
|
60
|
+
});
|
|
61
|
+
return Math.abs(l) > 0.5 && t.scrollTo({ behavior: "instant", top: c + l }), () => {
|
|
62
|
+
t.scrollTo({ behavior: "instant", top: c });
|
|
63
|
+
};
|
|
64
|
+
},
|
|
65
|
+
[]
|
|
66
|
+
);
|
|
67
|
+
return C(
|
|
68
|
+
() => ({
|
|
69
|
+
alignTarget: b,
|
|
70
|
+
isRevealing: n.isRunning,
|
|
71
|
+
poseTargetAtReveal: v,
|
|
72
|
+
renderReserve: S,
|
|
73
|
+
stopReveal: n.stop
|
|
74
|
+
}),
|
|
75
|
+
[b, v, S, n]
|
|
76
|
+
);
|
|
77
|
+
}
|
|
78
|
+
export {
|
|
79
|
+
w as KEYBOARD_INSET_SETTLED_PROPERTY,
|
|
80
|
+
_ as useFieldReveal
|
|
81
|
+
};
|