@rootnative/inertia 0.0.0-alpha.2 → 0.0.0-alpha.4
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 +15 -1
- package/dist/chunk-5I3G43XA.js +8 -0
- package/dist/chunk-6EP3S2PN.js +113 -0
- package/dist/chunk-6FENLMCA.mjs +257 -0
- package/dist/chunk-6UQ4KA6V.js +1011 -0
- package/dist/chunk-I76OC6RX.mjs +1003 -0
- package/dist/chunk-IJNVUM5U.mjs +6 -0
- package/dist/chunk-K4KR5BIS.mjs +6 -0
- package/dist/chunk-L2EVRKSC.mjs +104 -0
- package/dist/chunk-NDKVHL3N.js +8 -0
- package/dist/chunk-OBE7KTMK.mjs +6 -0
- package/dist/chunk-OM5FXU4I.js +8 -0
- package/dist/chunk-Q6ZTMLTI.js +54 -0
- package/dist/chunk-QQJSBIXV.mjs +6 -0
- package/dist/chunk-SCTX5Z7I.js +8 -0
- package/dist/chunk-SFRNO6AW.js +267 -0
- package/dist/chunk-WPPLZNM4.mjs +6 -0
- package/dist/chunk-WZGMAXKC.js +8 -0
- package/dist/chunk-ZQUCQRZT.mjs +52 -0
- package/dist/gestureLayer/index.js +10 -272
- package/dist/gestureLayer/index.mjs +5 -267
- package/dist/index.js +122 -1457
- package/dist/index.mjs +19 -1400
- package/dist/motion/Image.js +8 -1173
- package/dist/motion/Image.mjs +4 -1172
- package/dist/motion/Pressable.js +8 -1173
- package/dist/motion/Pressable.mjs +4 -1172
- package/dist/motion/ScrollView.js +8 -1173
- package/dist/motion/ScrollView.mjs +4 -1172
- package/dist/motion/Text.js +8 -1173
- package/dist/motion/Text.mjs +4 -1172
- package/dist/motion/View.js +8 -1173
- package/dist/motion/View.mjs +4 -1172
- package/dist/touch/index.js +3 -45
- package/dist/touch/index.mjs +2 -44
- package/package.json +1 -1
- package/src/gestures/focusVisibility.ts +15 -4
|
@@ -1,287 +1,25 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
var chunkQ6ZTMLTI_js = require('../chunk-Q6ZTMLTI.js');
|
|
4
|
+
var chunk6EP3S2PN_js = require('../chunk-6EP3S2PN.js');
|
|
5
|
+
var chunkSFRNO6AW_js = require('../chunk-SFRNO6AW.js');
|
|
3
6
|
var react = require('react');
|
|
4
7
|
var reactNativeReanimated = require('react-native-reanimated');
|
|
5
|
-
var reactNativeWorklets = require('react-native-worklets');
|
|
6
|
-
var reactNative = require('react-native');
|
|
7
8
|
|
|
8
|
-
// src/gestureLayer/useGestureLayer.ts
|
|
9
|
-
|
|
10
|
-
// src/transitions/sig.ts
|
|
11
|
-
function stableSig(value) {
|
|
12
|
-
if (value === void 0) return "";
|
|
13
|
-
try {
|
|
14
|
-
return stableStringify(value);
|
|
15
|
-
} catch {
|
|
16
|
-
return String(value);
|
|
17
|
-
}
|
|
18
|
-
}
|
|
19
|
-
function stableStringify(v) {
|
|
20
|
-
if (v === null || typeof v !== "object") {
|
|
21
|
-
if (typeof v === "function" || v === void 0) return "null";
|
|
22
|
-
return JSON.stringify(v);
|
|
23
|
-
}
|
|
24
|
-
if (Array.isArray(v)) {
|
|
25
|
-
return "[" + v.map(stableStringify).join(",") + "]";
|
|
26
|
-
}
|
|
27
|
-
const obj = v;
|
|
28
|
-
const keys = Object.keys(obj).sort();
|
|
29
|
-
return "{" + keys.map((k) => JSON.stringify(k) + ":" + stableStringify(obj[k])).join(",") + "}";
|
|
30
|
-
}
|
|
31
|
-
var DEFAULT_MOTION_CONFIG = {
|
|
32
|
-
reducedMotion: "user",
|
|
33
|
-
transitions: {}
|
|
34
|
-
};
|
|
35
|
-
var MotionConfigContext = react.createContext(
|
|
36
|
-
DEFAULT_MOTION_CONFIG
|
|
37
|
-
);
|
|
38
|
-
function useMotionConfig() {
|
|
39
|
-
return react.useContext(MotionConfigContext);
|
|
40
|
-
}
|
|
41
|
-
function useNamedTransitions() {
|
|
42
|
-
return useMotionConfig().transitions;
|
|
43
|
-
}
|
|
44
|
-
function useShouldReduceMotion() {
|
|
45
|
-
const { reducedMotion } = useMotionConfig();
|
|
46
|
-
const osReduced = reactNativeReanimated.useReducedMotion();
|
|
47
|
-
if (reducedMotion === "never") return false;
|
|
48
|
-
if (reducedMotion === "always") return true;
|
|
49
|
-
return osReduced;
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
// src/transitions/keys.ts
|
|
53
|
-
var TRANSITION_CONFIG_KEYS = /* @__PURE__ */ new Set([
|
|
54
|
-
"type",
|
|
55
|
-
"tension",
|
|
56
|
-
"friction",
|
|
57
|
-
"mass",
|
|
58
|
-
"velocity",
|
|
59
|
-
"restSpeedThreshold",
|
|
60
|
-
"restDisplacementThreshold",
|
|
61
|
-
"duration",
|
|
62
|
-
"easing",
|
|
63
|
-
"delay",
|
|
64
|
-
"repeat",
|
|
65
|
-
"deceleration",
|
|
66
|
-
"clamp"
|
|
67
|
-
]);
|
|
68
|
-
function isTopLevelTransition(t) {
|
|
69
|
-
if (t === null || typeof t !== "object") return false;
|
|
70
|
-
const keys = Object.keys(t);
|
|
71
|
-
if (keys.length === 0) return false;
|
|
72
|
-
return keys.every((k) => TRANSITION_CONFIG_KEYS.has(k));
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
// src/config/namedTransitions.ts
|
|
76
|
-
var UNKNOWN_NAME_FALLBACK = { type: "spring" };
|
|
77
|
-
function lookupNamedTransition(name, registry) {
|
|
78
|
-
const cfg = registry[name];
|
|
79
|
-
if (cfg) return cfg;
|
|
80
|
-
if (__DEV__) {
|
|
81
|
-
console.warn(
|
|
82
|
-
`[inertia] Unknown transition name "${name}" \u2014 falling back to the default spring. Register it on a provider: <MotionConfig transitions={{ '${name}': { ... } }}>.`
|
|
83
|
-
);
|
|
84
|
-
}
|
|
85
|
-
return UNKNOWN_NAME_FALLBACK;
|
|
86
|
-
}
|
|
87
|
-
function resolveNamedTransitionProp(transition, registry) {
|
|
88
|
-
if (transition === void 0) return void 0;
|
|
89
|
-
if (typeof transition === "string") {
|
|
90
|
-
return lookupNamedTransition(transition, registry);
|
|
91
|
-
}
|
|
92
|
-
if (isTopLevelTransition(transition)) return transition;
|
|
93
|
-
const map = transition;
|
|
94
|
-
let out = null;
|
|
95
|
-
for (const key in map) {
|
|
96
|
-
const value = map[key];
|
|
97
|
-
if (typeof value === "string") {
|
|
98
|
-
if (out === null) out = { ...map };
|
|
99
|
-
out[key] = lookupNamedTransition(value, registry);
|
|
100
|
-
}
|
|
101
|
-
}
|
|
102
|
-
return out ?? transition;
|
|
103
|
-
}
|
|
104
|
-
function ensureWorkletEasing(easing) {
|
|
105
|
-
if (!easing) return void 0;
|
|
106
|
-
const fn = isEasingFactory(easing) ? easing.factory() : easing;
|
|
107
|
-
if (reactNativeWorklets.isWorkletFunction(fn)) return fn;
|
|
108
|
-
const wrapped = (t) => {
|
|
109
|
-
"worklet";
|
|
110
|
-
return fn(t);
|
|
111
|
-
};
|
|
112
|
-
return wrapped;
|
|
113
|
-
}
|
|
114
|
-
function isEasingFactory(value) {
|
|
115
|
-
return typeof value === "object" && value !== null && "factory" in value && typeof value.factory === "function";
|
|
116
|
-
}
|
|
117
|
-
|
|
118
|
-
// src/transitions/spring.ts
|
|
119
|
-
var DEFAULT_SPRING = {
|
|
120
|
-
tension: 170,
|
|
121
|
-
friction: 26,
|
|
122
|
-
mass: 1
|
|
123
|
-
};
|
|
124
|
-
function springToReanimated(t) {
|
|
125
|
-
"worklet";
|
|
126
|
-
return {
|
|
127
|
-
stiffness: t.tension ?? DEFAULT_SPRING.tension,
|
|
128
|
-
damping: t.friction ?? DEFAULT_SPRING.friction,
|
|
129
|
-
mass: t.mass ?? DEFAULT_SPRING.mass,
|
|
130
|
-
velocity: t.velocity,
|
|
131
|
-
restSpeedThreshold: t.restSpeedThreshold,
|
|
132
|
-
restDisplacementThreshold: t.restDisplacementThreshold
|
|
133
|
-
};
|
|
134
|
-
}
|
|
135
|
-
|
|
136
|
-
// src/transitions/resolve.ts
|
|
137
|
-
var DEFAULT_TIMING_DURATION = 250;
|
|
138
|
-
function buildSpring(cfg, toValue, cb) {
|
|
139
|
-
return reactNativeReanimated.withSpring(toValue, springToReanimated(cfg), cb);
|
|
140
|
-
}
|
|
141
|
-
function buildTiming(cfg, toValue, cb) {
|
|
142
|
-
return reactNativeReanimated.withTiming(
|
|
143
|
-
toValue,
|
|
144
|
-
{
|
|
145
|
-
duration: cfg.duration ?? DEFAULT_TIMING_DURATION,
|
|
146
|
-
easing: ensureWorkletEasing(cfg.easing) ?? reactNativeReanimated.Easing.inOut(reactNativeReanimated.Easing.ease)
|
|
147
|
-
},
|
|
148
|
-
cb
|
|
149
|
-
);
|
|
150
|
-
}
|
|
151
|
-
function buildDecay(cfg, cb) {
|
|
152
|
-
return reactNativeReanimated.withDecay(
|
|
153
|
-
{
|
|
154
|
-
velocity: cfg.velocity ?? 0,
|
|
155
|
-
deceleration: cfg.deceleration,
|
|
156
|
-
clamp: cfg.clamp
|
|
157
|
-
},
|
|
158
|
-
cb
|
|
159
|
-
);
|
|
160
|
-
}
|
|
161
|
-
function buildOne(cfg, toValue, cb) {
|
|
162
|
-
if (cfg.type === "no-animation") {
|
|
163
|
-
return toValue;
|
|
164
|
-
}
|
|
165
|
-
if (cfg.type === "decay") return buildDecay(cfg, cb);
|
|
166
|
-
if (cfg.type === "timing") return buildTiming(cfg, toValue, cb);
|
|
167
|
-
return buildSpring(cfg, toValue, cb);
|
|
168
|
-
}
|
|
169
|
-
function applyRepeat(animation, repeat) {
|
|
170
|
-
if (repeat === void 0) return animation;
|
|
171
|
-
if (repeat === "infinite") {
|
|
172
|
-
return reactNativeReanimated.withRepeat(animation, -1, true);
|
|
173
|
-
}
|
|
174
|
-
if (typeof repeat === "number") {
|
|
175
|
-
return reactNativeReanimated.withRepeat(animation, repeat, true);
|
|
176
|
-
}
|
|
177
|
-
const count = repeat.count === "infinite" ? -1 : repeat.count;
|
|
178
|
-
const alternate = repeat.alternate ?? true;
|
|
179
|
-
return reactNativeReanimated.withRepeat(animation, count, alternate);
|
|
180
|
-
}
|
|
181
|
-
function applyDelay(animation, delay) {
|
|
182
|
-
if (!delay || delay <= 0) return animation;
|
|
183
|
-
return reactNativeReanimated.withDelay(delay, animation);
|
|
184
|
-
}
|
|
185
|
-
function resolveTransition(config, toValue, callback) {
|
|
186
|
-
const cfg = config ?? { type: "spring" };
|
|
187
|
-
const base = buildOne(cfg, toValue, callback);
|
|
188
|
-
const repeated = applyRepeat(base, repeatOf(cfg));
|
|
189
|
-
return applyDelay(repeated, delayOf(cfg));
|
|
190
|
-
}
|
|
191
|
-
function repeatOf(cfg) {
|
|
192
|
-
if (cfg.type === "no-animation" || cfg.type === "decay") return void 0;
|
|
193
|
-
return cfg.repeat;
|
|
194
|
-
}
|
|
195
|
-
function delayOf(cfg) {
|
|
196
|
-
if (cfg.type === "no-animation") return void 0;
|
|
197
|
-
return cfg.delay;
|
|
198
|
-
}
|
|
199
|
-
var modality = "keyboard";
|
|
200
|
-
var installed = false;
|
|
201
|
-
function setKeyboard() {
|
|
202
|
-
modality = "keyboard";
|
|
203
|
-
}
|
|
204
|
-
function setPointer() {
|
|
205
|
-
modality = "pointer";
|
|
206
|
-
}
|
|
207
|
-
function ensureInstalled() {
|
|
208
|
-
if (installed) return;
|
|
209
|
-
if (reactNative.Platform.OS !== "web") return;
|
|
210
|
-
if (typeof document === "undefined") return;
|
|
211
|
-
document.addEventListener("keydown", setKeyboard, true);
|
|
212
|
-
document.addEventListener("mousedown", setPointer, true);
|
|
213
|
-
document.addEventListener("pointerdown", setPointer, true);
|
|
214
|
-
document.addEventListener("touchstart", setPointer, true);
|
|
215
|
-
installed = true;
|
|
216
|
-
}
|
|
217
|
-
function isFocusVisible() {
|
|
218
|
-
if (reactNative.Platform.OS !== "web") return true;
|
|
219
|
-
ensureInstalled();
|
|
220
|
-
return modality === "keyboard";
|
|
221
|
-
}
|
|
222
|
-
|
|
223
|
-
// src/values/useGesture.ts
|
|
224
|
-
function useGesture(transition) {
|
|
225
|
-
const pressed = reactNativeReanimated.useSharedValue(0);
|
|
226
|
-
const focused = reactNativeReanimated.useSharedValue(0);
|
|
227
|
-
const focusVisible = reactNativeReanimated.useSharedValue(0);
|
|
228
|
-
const hovered = reactNativeReanimated.useSharedValue(0);
|
|
229
|
-
const shouldReduceMotion = useShouldReduceMotion();
|
|
230
|
-
const resolved = resolveNamedTransitionProp(transition, useNamedTransitions());
|
|
231
|
-
const setLayer = react.useCallback(
|
|
232
|
-
(sv, layer, target) => {
|
|
233
|
-
const cfg = shouldReduceMotion ? { type: "no-animation" } : layerTransition(layer, resolved) ?? { type: "spring" };
|
|
234
|
-
sv.value = resolveTransition(cfg, target);
|
|
235
|
-
},
|
|
236
|
-
// The transition is intentionally read on every call rather than cooked
|
|
237
|
-
// into the dep array — a fresh literal each render would otherwise
|
|
238
|
-
// rebuild the handler bag and break composing consumers that key off
|
|
239
|
-
// handler identity. `transition` is read inside the callback closure;
|
|
240
|
-
// shared values are stable so the only dep that matters is the reduce-
|
|
241
|
-
// motion flag.
|
|
242
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
243
|
-
[shouldReduceMotion]
|
|
244
|
-
);
|
|
245
|
-
const handlers = react.useMemo(
|
|
246
|
-
() => ({
|
|
247
|
-
onPressIn: () => setLayer(pressed, "pressed", 1),
|
|
248
|
-
onPressOut: () => setLayer(pressed, "pressed", 0),
|
|
249
|
-
onHoverIn: () => setLayer(hovered, "hovered", 1),
|
|
250
|
-
onHoverOut: () => setLayer(hovered, "hovered", 0),
|
|
251
|
-
onFocus: () => {
|
|
252
|
-
setLayer(focused, "focused", 1);
|
|
253
|
-
if (isFocusVisible()) setLayer(focusVisible, "focusVisible", 1);
|
|
254
|
-
},
|
|
255
|
-
onBlur: () => {
|
|
256
|
-
setLayer(focused, "focused", 0);
|
|
257
|
-
setLayer(focusVisible, "focusVisible", 0);
|
|
258
|
-
}
|
|
259
|
-
}),
|
|
260
|
-
[setLayer, pressed, focused, focusVisible, hovered]
|
|
261
|
-
);
|
|
262
|
-
return { pressed, focused, focusVisible, hovered, handlers };
|
|
263
|
-
}
|
|
264
|
-
function layerTransition(layer, transition) {
|
|
265
|
-
if (!transition) return void 0;
|
|
266
|
-
if (isTopLevelTransition(transition)) return transition;
|
|
267
|
-
return transition[layer];
|
|
268
|
-
}
|
|
269
|
-
|
|
270
|
-
// src/gestureLayer/useGestureLayer.ts
|
|
271
9
|
function useGestureLayer(states, options = {}) {
|
|
272
10
|
const { disabled: isDisabled = false, transition: transitionInput } = options;
|
|
273
|
-
const shouldReduceMotion = useShouldReduceMotion();
|
|
274
|
-
const transition = resolveNamedTransitionProp(
|
|
11
|
+
const shouldReduceMotion = chunk6EP3S2PN_js.useShouldReduceMotion();
|
|
12
|
+
const transition = chunk6EP3S2PN_js.resolveNamedTransitionProp(
|
|
275
13
|
transitionInput,
|
|
276
|
-
useNamedTransitions()
|
|
14
|
+
chunk6EP3S2PN_js.useNamedTransitions()
|
|
277
15
|
);
|
|
278
|
-
const gesture = useGesture(transition);
|
|
16
|
+
const gesture = chunkQ6ZTMLTI_js.useGesture(transition);
|
|
279
17
|
const disabledProgress = reactNativeReanimated.useSharedValue(0);
|
|
280
|
-
const transitionSig = stableSig(transition);
|
|
18
|
+
const transitionSig = chunkSFRNO6AW_js.stableSig(transition);
|
|
281
19
|
react.useEffect(() => {
|
|
282
20
|
const target = isDisabled ? 1 : 0;
|
|
283
21
|
const cfg = shouldReduceMotion ? { type: "no-animation" } : disabledTransition(transition) ?? { type: "spring" };
|
|
284
|
-
disabledProgress.value = resolveTransition(cfg, target);
|
|
22
|
+
disabledProgress.value = chunkSFRNO6AW_js.resolveTransition(cfg, target);
|
|
285
23
|
}, [isDisabled, shouldReduceMotion, transitionSig, disabledProgress]);
|
|
286
24
|
const meta = react.useMemo(() => {
|
|
287
25
|
const layers = {
|
|
@@ -416,7 +154,7 @@ function useGestureLayer(states, options = {}) {
|
|
|
416
154
|
}
|
|
417
155
|
function disabledTransition(transition) {
|
|
418
156
|
if (!transition) return void 0;
|
|
419
|
-
if (isTopLevelTransition(transition)) return transition;
|
|
157
|
+
if (chunkSFRNO6AW_js.isTopLevelTransition(transition)) return transition;
|
|
420
158
|
return void 0;
|
|
421
159
|
}
|
|
422
160
|
|
|
@@ -1,271 +1,9 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
1
|
+
import { useGesture } from '../chunk-ZQUCQRZT.mjs';
|
|
2
|
+
import { useShouldReduceMotion, resolveNamedTransitionProp, useNamedTransitions } from '../chunk-L2EVRKSC.mjs';
|
|
3
|
+
import { stableSig, resolveTransition, isTopLevelTransition } from '../chunk-6FENLMCA.mjs';
|
|
4
|
+
import { useEffect, useMemo } from 'react';
|
|
5
|
+
import { useSharedValue, useAnimatedStyle, interpolateColor } from 'react-native-reanimated';
|
|
5
6
|
|
|
6
|
-
// src/gestureLayer/useGestureLayer.ts
|
|
7
|
-
|
|
8
|
-
// src/transitions/sig.ts
|
|
9
|
-
function stableSig(value) {
|
|
10
|
-
if (value === void 0) return "";
|
|
11
|
-
try {
|
|
12
|
-
return stableStringify(value);
|
|
13
|
-
} catch {
|
|
14
|
-
return String(value);
|
|
15
|
-
}
|
|
16
|
-
}
|
|
17
|
-
function stableStringify(v) {
|
|
18
|
-
if (v === null || typeof v !== "object") {
|
|
19
|
-
if (typeof v === "function" || v === void 0) return "null";
|
|
20
|
-
return JSON.stringify(v);
|
|
21
|
-
}
|
|
22
|
-
if (Array.isArray(v)) {
|
|
23
|
-
return "[" + v.map(stableStringify).join(",") + "]";
|
|
24
|
-
}
|
|
25
|
-
const obj = v;
|
|
26
|
-
const keys = Object.keys(obj).sort();
|
|
27
|
-
return "{" + keys.map((k) => JSON.stringify(k) + ":" + stableStringify(obj[k])).join(",") + "}";
|
|
28
|
-
}
|
|
29
|
-
var DEFAULT_MOTION_CONFIG = {
|
|
30
|
-
reducedMotion: "user",
|
|
31
|
-
transitions: {}
|
|
32
|
-
};
|
|
33
|
-
var MotionConfigContext = createContext(
|
|
34
|
-
DEFAULT_MOTION_CONFIG
|
|
35
|
-
);
|
|
36
|
-
function useMotionConfig() {
|
|
37
|
-
return useContext(MotionConfigContext);
|
|
38
|
-
}
|
|
39
|
-
function useNamedTransitions() {
|
|
40
|
-
return useMotionConfig().transitions;
|
|
41
|
-
}
|
|
42
|
-
function useShouldReduceMotion() {
|
|
43
|
-
const { reducedMotion } = useMotionConfig();
|
|
44
|
-
const osReduced = useReducedMotion();
|
|
45
|
-
if (reducedMotion === "never") return false;
|
|
46
|
-
if (reducedMotion === "always") return true;
|
|
47
|
-
return osReduced;
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
// src/transitions/keys.ts
|
|
51
|
-
var TRANSITION_CONFIG_KEYS = /* @__PURE__ */ new Set([
|
|
52
|
-
"type",
|
|
53
|
-
"tension",
|
|
54
|
-
"friction",
|
|
55
|
-
"mass",
|
|
56
|
-
"velocity",
|
|
57
|
-
"restSpeedThreshold",
|
|
58
|
-
"restDisplacementThreshold",
|
|
59
|
-
"duration",
|
|
60
|
-
"easing",
|
|
61
|
-
"delay",
|
|
62
|
-
"repeat",
|
|
63
|
-
"deceleration",
|
|
64
|
-
"clamp"
|
|
65
|
-
]);
|
|
66
|
-
function isTopLevelTransition(t) {
|
|
67
|
-
if (t === null || typeof t !== "object") return false;
|
|
68
|
-
const keys = Object.keys(t);
|
|
69
|
-
if (keys.length === 0) return false;
|
|
70
|
-
return keys.every((k) => TRANSITION_CONFIG_KEYS.has(k));
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
// src/config/namedTransitions.ts
|
|
74
|
-
var UNKNOWN_NAME_FALLBACK = { type: "spring" };
|
|
75
|
-
function lookupNamedTransition(name, registry) {
|
|
76
|
-
const cfg = registry[name];
|
|
77
|
-
if (cfg) return cfg;
|
|
78
|
-
if (__DEV__) {
|
|
79
|
-
console.warn(
|
|
80
|
-
`[inertia] Unknown transition name "${name}" \u2014 falling back to the default spring. Register it on a provider: <MotionConfig transitions={{ '${name}': { ... } }}>.`
|
|
81
|
-
);
|
|
82
|
-
}
|
|
83
|
-
return UNKNOWN_NAME_FALLBACK;
|
|
84
|
-
}
|
|
85
|
-
function resolveNamedTransitionProp(transition, registry) {
|
|
86
|
-
if (transition === void 0) return void 0;
|
|
87
|
-
if (typeof transition === "string") {
|
|
88
|
-
return lookupNamedTransition(transition, registry);
|
|
89
|
-
}
|
|
90
|
-
if (isTopLevelTransition(transition)) return transition;
|
|
91
|
-
const map = transition;
|
|
92
|
-
let out = null;
|
|
93
|
-
for (const key in map) {
|
|
94
|
-
const value = map[key];
|
|
95
|
-
if (typeof value === "string") {
|
|
96
|
-
if (out === null) out = { ...map };
|
|
97
|
-
out[key] = lookupNamedTransition(value, registry);
|
|
98
|
-
}
|
|
99
|
-
}
|
|
100
|
-
return out ?? transition;
|
|
101
|
-
}
|
|
102
|
-
function ensureWorkletEasing(easing) {
|
|
103
|
-
if (!easing) return void 0;
|
|
104
|
-
const fn = isEasingFactory(easing) ? easing.factory() : easing;
|
|
105
|
-
if (isWorkletFunction(fn)) return fn;
|
|
106
|
-
const wrapped = (t) => {
|
|
107
|
-
"worklet";
|
|
108
|
-
return fn(t);
|
|
109
|
-
};
|
|
110
|
-
return wrapped;
|
|
111
|
-
}
|
|
112
|
-
function isEasingFactory(value) {
|
|
113
|
-
return typeof value === "object" && value !== null && "factory" in value && typeof value.factory === "function";
|
|
114
|
-
}
|
|
115
|
-
|
|
116
|
-
// src/transitions/spring.ts
|
|
117
|
-
var DEFAULT_SPRING = {
|
|
118
|
-
tension: 170,
|
|
119
|
-
friction: 26,
|
|
120
|
-
mass: 1
|
|
121
|
-
};
|
|
122
|
-
function springToReanimated(t) {
|
|
123
|
-
"worklet";
|
|
124
|
-
return {
|
|
125
|
-
stiffness: t.tension ?? DEFAULT_SPRING.tension,
|
|
126
|
-
damping: t.friction ?? DEFAULT_SPRING.friction,
|
|
127
|
-
mass: t.mass ?? DEFAULT_SPRING.mass,
|
|
128
|
-
velocity: t.velocity,
|
|
129
|
-
restSpeedThreshold: t.restSpeedThreshold,
|
|
130
|
-
restDisplacementThreshold: t.restDisplacementThreshold
|
|
131
|
-
};
|
|
132
|
-
}
|
|
133
|
-
|
|
134
|
-
// src/transitions/resolve.ts
|
|
135
|
-
var DEFAULT_TIMING_DURATION = 250;
|
|
136
|
-
function buildSpring(cfg, toValue, cb) {
|
|
137
|
-
return withSpring(toValue, springToReanimated(cfg), cb);
|
|
138
|
-
}
|
|
139
|
-
function buildTiming(cfg, toValue, cb) {
|
|
140
|
-
return withTiming(
|
|
141
|
-
toValue,
|
|
142
|
-
{
|
|
143
|
-
duration: cfg.duration ?? DEFAULT_TIMING_DURATION,
|
|
144
|
-
easing: ensureWorkletEasing(cfg.easing) ?? Easing.inOut(Easing.ease)
|
|
145
|
-
},
|
|
146
|
-
cb
|
|
147
|
-
);
|
|
148
|
-
}
|
|
149
|
-
function buildDecay(cfg, cb) {
|
|
150
|
-
return withDecay(
|
|
151
|
-
{
|
|
152
|
-
velocity: cfg.velocity ?? 0,
|
|
153
|
-
deceleration: cfg.deceleration,
|
|
154
|
-
clamp: cfg.clamp
|
|
155
|
-
},
|
|
156
|
-
cb
|
|
157
|
-
);
|
|
158
|
-
}
|
|
159
|
-
function buildOne(cfg, toValue, cb) {
|
|
160
|
-
if (cfg.type === "no-animation") {
|
|
161
|
-
return toValue;
|
|
162
|
-
}
|
|
163
|
-
if (cfg.type === "decay") return buildDecay(cfg, cb);
|
|
164
|
-
if (cfg.type === "timing") return buildTiming(cfg, toValue, cb);
|
|
165
|
-
return buildSpring(cfg, toValue, cb);
|
|
166
|
-
}
|
|
167
|
-
function applyRepeat(animation, repeat) {
|
|
168
|
-
if (repeat === void 0) return animation;
|
|
169
|
-
if (repeat === "infinite") {
|
|
170
|
-
return withRepeat(animation, -1, true);
|
|
171
|
-
}
|
|
172
|
-
if (typeof repeat === "number") {
|
|
173
|
-
return withRepeat(animation, repeat, true);
|
|
174
|
-
}
|
|
175
|
-
const count = repeat.count === "infinite" ? -1 : repeat.count;
|
|
176
|
-
const alternate = repeat.alternate ?? true;
|
|
177
|
-
return withRepeat(animation, count, alternate);
|
|
178
|
-
}
|
|
179
|
-
function applyDelay(animation, delay) {
|
|
180
|
-
if (!delay || delay <= 0) return animation;
|
|
181
|
-
return withDelay(delay, animation);
|
|
182
|
-
}
|
|
183
|
-
function resolveTransition(config, toValue, callback) {
|
|
184
|
-
const cfg = config ?? { type: "spring" };
|
|
185
|
-
const base = buildOne(cfg, toValue, callback);
|
|
186
|
-
const repeated = applyRepeat(base, repeatOf(cfg));
|
|
187
|
-
return applyDelay(repeated, delayOf(cfg));
|
|
188
|
-
}
|
|
189
|
-
function repeatOf(cfg) {
|
|
190
|
-
if (cfg.type === "no-animation" || cfg.type === "decay") return void 0;
|
|
191
|
-
return cfg.repeat;
|
|
192
|
-
}
|
|
193
|
-
function delayOf(cfg) {
|
|
194
|
-
if (cfg.type === "no-animation") return void 0;
|
|
195
|
-
return cfg.delay;
|
|
196
|
-
}
|
|
197
|
-
var modality = "keyboard";
|
|
198
|
-
var installed = false;
|
|
199
|
-
function setKeyboard() {
|
|
200
|
-
modality = "keyboard";
|
|
201
|
-
}
|
|
202
|
-
function setPointer() {
|
|
203
|
-
modality = "pointer";
|
|
204
|
-
}
|
|
205
|
-
function ensureInstalled() {
|
|
206
|
-
if (installed) return;
|
|
207
|
-
if (Platform.OS !== "web") return;
|
|
208
|
-
if (typeof document === "undefined") return;
|
|
209
|
-
document.addEventListener("keydown", setKeyboard, true);
|
|
210
|
-
document.addEventListener("mousedown", setPointer, true);
|
|
211
|
-
document.addEventListener("pointerdown", setPointer, true);
|
|
212
|
-
document.addEventListener("touchstart", setPointer, true);
|
|
213
|
-
installed = true;
|
|
214
|
-
}
|
|
215
|
-
function isFocusVisible() {
|
|
216
|
-
if (Platform.OS !== "web") return true;
|
|
217
|
-
ensureInstalled();
|
|
218
|
-
return modality === "keyboard";
|
|
219
|
-
}
|
|
220
|
-
|
|
221
|
-
// src/values/useGesture.ts
|
|
222
|
-
function useGesture(transition) {
|
|
223
|
-
const pressed = useSharedValue(0);
|
|
224
|
-
const focused = useSharedValue(0);
|
|
225
|
-
const focusVisible = useSharedValue(0);
|
|
226
|
-
const hovered = useSharedValue(0);
|
|
227
|
-
const shouldReduceMotion = useShouldReduceMotion();
|
|
228
|
-
const resolved = resolveNamedTransitionProp(transition, useNamedTransitions());
|
|
229
|
-
const setLayer = useCallback(
|
|
230
|
-
(sv, layer, target) => {
|
|
231
|
-
const cfg = shouldReduceMotion ? { type: "no-animation" } : layerTransition(layer, resolved) ?? { type: "spring" };
|
|
232
|
-
sv.value = resolveTransition(cfg, target);
|
|
233
|
-
},
|
|
234
|
-
// The transition is intentionally read on every call rather than cooked
|
|
235
|
-
// into the dep array — a fresh literal each render would otherwise
|
|
236
|
-
// rebuild the handler bag and break composing consumers that key off
|
|
237
|
-
// handler identity. `transition` is read inside the callback closure;
|
|
238
|
-
// shared values are stable so the only dep that matters is the reduce-
|
|
239
|
-
// motion flag.
|
|
240
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
241
|
-
[shouldReduceMotion]
|
|
242
|
-
);
|
|
243
|
-
const handlers = useMemo(
|
|
244
|
-
() => ({
|
|
245
|
-
onPressIn: () => setLayer(pressed, "pressed", 1),
|
|
246
|
-
onPressOut: () => setLayer(pressed, "pressed", 0),
|
|
247
|
-
onHoverIn: () => setLayer(hovered, "hovered", 1),
|
|
248
|
-
onHoverOut: () => setLayer(hovered, "hovered", 0),
|
|
249
|
-
onFocus: () => {
|
|
250
|
-
setLayer(focused, "focused", 1);
|
|
251
|
-
if (isFocusVisible()) setLayer(focusVisible, "focusVisible", 1);
|
|
252
|
-
},
|
|
253
|
-
onBlur: () => {
|
|
254
|
-
setLayer(focused, "focused", 0);
|
|
255
|
-
setLayer(focusVisible, "focusVisible", 0);
|
|
256
|
-
}
|
|
257
|
-
}),
|
|
258
|
-
[setLayer, pressed, focused, focusVisible, hovered]
|
|
259
|
-
);
|
|
260
|
-
return { pressed, focused, focusVisible, hovered, handlers };
|
|
261
|
-
}
|
|
262
|
-
function layerTransition(layer, transition) {
|
|
263
|
-
if (!transition) return void 0;
|
|
264
|
-
if (isTopLevelTransition(transition)) return transition;
|
|
265
|
-
return transition[layer];
|
|
266
|
-
}
|
|
267
|
-
|
|
268
|
-
// src/gestureLayer/useGestureLayer.ts
|
|
269
7
|
function useGestureLayer(states, options = {}) {
|
|
270
8
|
const { disabled: isDisabled = false, transition: transitionInput } = options;
|
|
271
9
|
const shouldReduceMotion = useShouldReduceMotion();
|