@rootnative/inertia 0.0.9 → 0.0.11
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 +95 -1
- package/README.md +8 -8
- package/dist/{chunk-MFAFB4K7.mjs → chunk-2Q6JMDYZ.mjs} +8 -10
- package/dist/chunk-2UREDR4Z.js +8 -0
- package/dist/{chunk-ZBHQPVWE.js → chunk-3PB27UIE.js} +2 -2
- package/dist/{chunk-IX6SEOSK.mjs → chunk-5EYIZG72.mjs} +60 -45
- package/dist/{chunk-EN4PN7X3.mjs → chunk-7RMSLKQQ.mjs} +1 -1
- package/dist/{chunk-6YIUETBF.mjs → chunk-DT2KVAAO.mjs} +1 -1
- package/dist/{chunk-L4JFECXU.mjs → chunk-FKJLPYGY.mjs} +6 -3
- package/dist/{chunk-E3ALFSH2.js → chunk-HBURWGCZ.js} +86 -71
- package/dist/chunk-JAJHKJC5.js +8 -0
- package/dist/chunk-JBMTTICC.js +8 -0
- package/dist/{chunk-GSUC4HWP.mjs → chunk-JGQ6YRDN.mjs} +1 -1
- package/dist/chunk-KFHZMFAX.js +23 -0
- package/dist/{chunk-M4766VUV.mjs → chunk-LHW4VNWD.mjs} +1 -1
- package/dist/{chunk-MUT6BTZS.js → chunk-NTG6PSGZ.js} +10 -7
- package/dist/chunk-OH46TGEA.mjs +20 -0
- package/dist/{chunk-6AN5X3YE.js → chunk-QDMSFRQR.js} +10 -11
- package/dist/{chunk-W7NTRSPD.mjs → chunk-QIRKPDXA.mjs} +118 -68
- package/dist/{chunk-WNVHPMBI.js → chunk-QX5JHRZ2.js} +118 -66
- package/dist/{chunk-6NOCY764.js → chunk-R7YD6L3D.js} +2 -2
- package/dist/{chunk-JBK5ZLMH.mjs → chunk-RO4XFTQ6.mjs} +1 -1
- package/dist/{chunk-QNLSCOR5.mjs → chunk-UGYBFAVY.mjs} +1 -1
- package/dist/{chunk-IHVMNOS4.js → chunk-XLKI2MSD.js} +2 -2
- package/dist/gestureLayer/index.d.mts +3 -3
- package/dist/gestureLayer/index.d.ts +3 -3
- package/dist/gestureLayer/index.js +12 -18
- package/dist/gestureLayer/index.mjs +5 -11
- package/dist/index.d.mts +108 -49
- package/dist/index.d.ts +108 -49
- package/dist/index.js +114 -91
- package/dist/index.mjs +66 -59
- package/dist/motion/FlatList.d.mts +2 -1
- package/dist/motion/FlatList.d.ts +2 -1
- package/dist/motion/FlatList.js +5 -5
- package/dist/motion/FlatList.mjs +4 -4
- package/dist/motion/Image.d.mts +2 -1
- package/dist/motion/Image.d.ts +2 -1
- package/dist/motion/Image.js +5 -5
- package/dist/motion/Image.mjs +4 -4
- package/dist/motion/Pressable.d.mts +2 -1
- package/dist/motion/Pressable.d.ts +2 -1
- package/dist/motion/Pressable.js +5 -5
- package/dist/motion/Pressable.mjs +4 -4
- package/dist/motion/ScrollView.d.mts +2 -1
- package/dist/motion/ScrollView.d.ts +2 -1
- package/dist/motion/ScrollView.js +5 -5
- package/dist/motion/ScrollView.mjs +4 -4
- package/dist/motion/Text.d.mts +2 -1
- package/dist/motion/Text.d.ts +2 -1
- package/dist/motion/Text.js +5 -5
- package/dist/motion/Text.mjs +4 -4
- package/dist/motion/View.d.mts +2 -1
- package/dist/motion/View.d.ts +2 -1
- package/dist/motion/View.js +5 -5
- package/dist/motion/View.mjs +4 -4
- package/dist/touch/index.d.mts +5 -3
- package/dist/touch/index.d.ts +5 -3
- package/dist/touch/index.js +16 -31
- package/dist/touch/index.mjs +11 -29
- package/dist/{types-DyJpG64F.d.mts → types-C5Zbs9MC.d.mts} +22 -4
- package/dist/{types-DyJpG64F.d.ts → types-C5Zbs9MC.d.ts} +22 -4
- package/dist/{useGesture-DbH46EBp.d.ts → useGesture-Be0ZhCWj.d.ts} +1 -1
- package/dist/{useGesture-CnZQnYHH.d.mts → useGesture-Ve8EGjTr.d.mts} +1 -1
- package/dist/useTranslateStyle-BDrOD97O.d.mts +58 -0
- package/dist/useTranslateStyle-BDrOD97O.d.ts +58 -0
- package/jest-preset.js +31 -2
- package/llms.txt +2 -1
- package/package.json +15 -12
- package/src/config/namedTransitions.ts +7 -9
- package/src/gestureLayer/index.ts +3 -0
- package/src/gestureLayer/useGestureLayer.ts +6 -9
- package/src/gestures/focusVisibility.ts +19 -17
- package/src/gestures/index.ts +1 -1
- package/src/index.ts +12 -0
- package/src/internal/boxShadow.ts +24 -2
- package/src/layout/resolveLayout.ts +4 -1
- package/src/layout/useSharedLayout.ts +2 -1
- package/src/motion/createMotionComponent.tsx +92 -44
- package/src/presence/Presence.tsx +5 -7
- package/src/touch/applyBounds.ts +30 -0
- package/src/touch/index.ts +1 -0
- package/src/touch/useTouchDrag.ts +18 -46
- package/src/transitions/constants.ts +14 -0
- package/src/transitions/easing.ts +23 -11
- package/src/transitions/index.ts +5 -0
- package/src/transitions/keys.ts +0 -2
- package/src/transitions/resolve.ts +86 -11
- package/src/transitions/resolveSequence.ts +45 -3
- package/src/transitions/runtime.ts +4 -7
- package/src/transitions/spring.ts +7 -2
- package/src/types.ts +23 -3
- package/src/values/extrapolation.ts +21 -0
- package/src/values/index.ts +3 -0
- package/src/values/useColorCascade.ts +3 -3
- package/src/values/useColorTransition.ts +17 -2
- package/src/values/useGesture.ts +9 -2
- package/src/values/useInterpolatedStyle.ts +13 -13
- package/src/values/useShadow.ts +36 -9
- package/src/values/useSpring.ts +34 -25
- package/src/values/useTransform.ts +24 -20
- package/src/values/useTranslateStyle.ts +47 -0
- package/dist/chunk-24NUL23E.js +0 -8
- package/dist/chunk-4XBX7KOD.js +0 -8
- package/dist/chunk-Z5USXWTE.js +0 -8
package/dist/index.js
CHANGED
|
@@ -1,36 +1,37 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
4
|
-
var
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
var
|
|
8
|
-
var
|
|
9
|
-
var
|
|
10
|
-
var
|
|
11
|
-
var
|
|
12
|
-
var
|
|
3
|
+
var chunkKFHZMFAX_js = require('./chunk-KFHZMFAX.js');
|
|
4
|
+
var chunkNTG6PSGZ_js = require('./chunk-NTG6PSGZ.js');
|
|
5
|
+
var chunk2UREDR4Z_js = require('./chunk-2UREDR4Z.js');
|
|
6
|
+
var chunkJBMTTICC_js = require('./chunk-JBMTTICC.js');
|
|
7
|
+
var chunkJAJHKJC5_js = require('./chunk-JAJHKJC5.js');
|
|
8
|
+
var chunkR7YD6L3D_js = require('./chunk-R7YD6L3D.js');
|
|
9
|
+
var chunk3PB27UIE_js = require('./chunk-3PB27UIE.js');
|
|
10
|
+
var chunkXLKI2MSD_js = require('./chunk-XLKI2MSD.js');
|
|
11
|
+
var chunkHBURWGCZ_js = require('./chunk-HBURWGCZ.js');
|
|
12
|
+
var chunkQDMSFRQR_js = require('./chunk-QDMSFRQR.js');
|
|
13
|
+
var chunkQX5JHRZ2_js = require('./chunk-QX5JHRZ2.js');
|
|
13
14
|
var react = require('react');
|
|
14
15
|
var reactNativeReanimated = require('react-native-reanimated');
|
|
15
16
|
var reactNativeWorklets = require('react-native-worklets');
|
|
16
17
|
|
|
17
18
|
// src/motion/index.ts
|
|
18
19
|
var Motion = {
|
|
19
|
-
View:
|
|
20
|
-
Text:
|
|
21
|
-
Image:
|
|
22
|
-
Pressable:
|
|
23
|
-
ScrollView:
|
|
24
|
-
FlatList:
|
|
20
|
+
View: chunk2UREDR4Z_js.MotionView,
|
|
21
|
+
Text: chunkJBMTTICC_js.MotionText,
|
|
22
|
+
Image: chunkJAJHKJC5_js.MotionImage,
|
|
23
|
+
Pressable: chunkR7YD6L3D_js.MotionPressable,
|
|
24
|
+
ScrollView: chunk3PB27UIE_js.MotionScrollView,
|
|
25
|
+
FlatList: chunkXLKI2MSD_js.MotionFlatList
|
|
25
26
|
};
|
|
26
27
|
function useAnimation(target, transition) {
|
|
27
28
|
const output = reactNativeReanimated.useSharedValue(target);
|
|
28
|
-
const shouldReduceMotion =
|
|
29
|
-
const resolved =
|
|
30
|
-
const cfgSig =
|
|
29
|
+
const shouldReduceMotion = chunkQDMSFRQR_js.useShouldReduceMotion();
|
|
30
|
+
const resolved = chunkQDMSFRQR_js.resolveNamedTransition(transition, chunkQDMSFRQR_js.useNamedTransitions());
|
|
31
|
+
const cfgSig = chunkQX5JHRZ2_js.stableSig(resolved);
|
|
31
32
|
react.useEffect(() => {
|
|
32
33
|
const cfg = shouldReduceMotion ? { type: "no-animation" } : resolved ?? { type: "spring" };
|
|
33
|
-
output.value =
|
|
34
|
+
output.value = chunkQX5JHRZ2_js.resolveTransition(cfg, target);
|
|
34
35
|
}, [target, cfgSig, shouldReduceMotion]);
|
|
35
36
|
react.useEffect(
|
|
36
37
|
() => () => reactNativeReanimated.cancelAnimation(output),
|
|
@@ -41,55 +42,50 @@ function useAnimation(target, transition) {
|
|
|
41
42
|
return output;
|
|
42
43
|
}
|
|
43
44
|
function useAnimator() {
|
|
44
|
-
const registry =
|
|
45
|
-
const shouldReduceMotion =
|
|
45
|
+
const registry = chunkQDMSFRQR_js.useNamedTransitions();
|
|
46
|
+
const shouldReduceMotion = chunkQDMSFRQR_js.useShouldReduceMotion();
|
|
46
47
|
const registryRef = react.useRef(registry);
|
|
47
48
|
registryRef.current = registry;
|
|
48
49
|
const reduceMotionRef = react.useRef(shouldReduceMotion);
|
|
49
50
|
reduceMotionRef.current = shouldReduceMotion;
|
|
50
51
|
return react.useCallback((value, to, transition) => {
|
|
51
|
-
const resolved =
|
|
52
|
+
const resolved = chunkQDMSFRQR_js.resolveNamedTransition(transition, registryRef.current);
|
|
52
53
|
const cfg = reduceMotionRef.current ? { type: "no-animation" } : resolved ?? { type: "spring" };
|
|
53
|
-
value.value =
|
|
54
|
+
value.value = chunkQX5JHRZ2_js.resolveTransition(cfg, to);
|
|
54
55
|
}, []);
|
|
55
56
|
}
|
|
56
57
|
function useSpring(target, config) {
|
|
57
|
-
const spring = resolveSpringInput(config,
|
|
58
|
+
const spring = resolveSpringInput(config, chunkQDMSFRQR_js.useNamedTransitions());
|
|
59
|
+
const shouldReduceMotion = chunkQDMSFRQR_js.useShouldReduceMotion();
|
|
58
60
|
const reanimConfig = react.useMemo(
|
|
59
|
-
() =>
|
|
61
|
+
() => chunkQX5JHRZ2_js.springToReanimated(spring ?? {}),
|
|
60
62
|
// Keyed on the resolved primitive fields rather than the `config` object
|
|
61
63
|
// identity: callers routinely pass a fresh object literal each render, so
|
|
62
64
|
// depending on `config` itself would rebuild the Reanimated config on
|
|
63
65
|
// every render and defeat the memo.
|
|
64
66
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
65
|
-
[
|
|
66
|
-
spring?.tension,
|
|
67
|
-
spring?.friction,
|
|
68
|
-
spring?.mass,
|
|
69
|
-
spring?.velocity,
|
|
70
|
-
spring?.restSpeedThreshold,
|
|
71
|
-
spring?.restDisplacementThreshold
|
|
72
|
-
]
|
|
67
|
+
[spring?.tension, spring?.friction, spring?.mass, spring?.velocity]
|
|
73
68
|
);
|
|
74
69
|
const isSharedTarget = isSharedValue(target);
|
|
75
70
|
const initial = isSharedTarget ? target.value : target;
|
|
76
71
|
const output = reactNativeReanimated.useSharedValue(initial);
|
|
77
72
|
react.useEffect(() => {
|
|
78
73
|
if (isSharedTarget) return;
|
|
79
|
-
output.value = reactNativeReanimated.withSpring(target, reanimConfig);
|
|
80
|
-
}, [isSharedTarget, target, reanimConfig]);
|
|
74
|
+
output.value = shouldReduceMotion ? target : reactNativeReanimated.withSpring(target, reanimConfig);
|
|
75
|
+
}, [isSharedTarget, target, reanimConfig, shouldReduceMotion]);
|
|
76
|
+
const source = isSharedTarget ? target : null;
|
|
81
77
|
reactNativeReanimated.useAnimatedReaction(
|
|
82
78
|
() => {
|
|
83
79
|
"worklet";
|
|
84
|
-
if (
|
|
85
|
-
return
|
|
80
|
+
if (source === null) return null;
|
|
81
|
+
return source.value;
|
|
86
82
|
},
|
|
87
83
|
(next, prev) => {
|
|
88
84
|
"worklet";
|
|
89
85
|
if (next === null || next === prev) return;
|
|
90
|
-
output.value = reactNativeReanimated.withSpring(next, reanimConfig);
|
|
86
|
+
output.value = shouldReduceMotion ? next : reactNativeReanimated.withSpring(next, reanimConfig);
|
|
91
87
|
},
|
|
92
|
-
[
|
|
88
|
+
[source, reanimConfig, shouldReduceMotion]
|
|
93
89
|
);
|
|
94
90
|
react.useEffect(
|
|
95
91
|
() => () => reactNativeReanimated.cancelAnimation(output),
|
|
@@ -101,13 +97,12 @@ function useSpring(target, config) {
|
|
|
101
97
|
}
|
|
102
98
|
function resolveSpringInput(config, registry) {
|
|
103
99
|
if (typeof config !== "string") return config;
|
|
104
|
-
const cfg =
|
|
100
|
+
const cfg = chunkQDMSFRQR_js.lookupNamedTransition(config, registry);
|
|
105
101
|
if (cfg.type === void 0 || cfg.type === "spring") return cfg;
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
}
|
|
102
|
+
chunkQX5JHRZ2_js.warnOnce(
|
|
103
|
+
`spring-only:${config}`,
|
|
104
|
+
`[inertia] Named transition "${config}" resolves to type '${cfg.type}', but useSpring / useBooleanSpring are spring-only \u2014 falling back to the default spring. Use useAnimation to honor non-spring named transitions.`
|
|
105
|
+
);
|
|
111
106
|
return void 0;
|
|
112
107
|
}
|
|
113
108
|
function isSharedValue(v) {
|
|
@@ -157,6 +152,13 @@ function useColorTransition(progress, range, options) {
|
|
|
157
152
|
return { [key]: reactNativeReanimated.interpolateColor(progress.value, [0, 1], [from, to]) };
|
|
158
153
|
});
|
|
159
154
|
}
|
|
155
|
+
function mapExtrapolation(mode) {
|
|
156
|
+
if (mode === "identity") return reactNativeReanimated.Extrapolation.IDENTITY;
|
|
157
|
+
if (mode === "extend") return reactNativeReanimated.Extrapolation.EXTEND;
|
|
158
|
+
return reactNativeReanimated.Extrapolation.CLAMP;
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
// src/values/useInterpolatedStyle.ts
|
|
160
162
|
var TRANSFORM_KEYS = /* @__PURE__ */ new Set([
|
|
161
163
|
"translateX",
|
|
162
164
|
"translateY",
|
|
@@ -185,11 +187,6 @@ function evenlySpaced(count) {
|
|
|
185
187
|
for (let i = 0; i < count; i++) out.push(i / (count - 1));
|
|
186
188
|
return out;
|
|
187
189
|
}
|
|
188
|
-
function mapExtrapolation(mode) {
|
|
189
|
-
if (mode === "identity") return reactNativeReanimated.Extrapolation.IDENTITY;
|
|
190
|
-
if (mode === "extend") return reactNativeReanimated.Extrapolation.EXTEND;
|
|
191
|
-
return reactNativeReanimated.Extrapolation.CLAMP;
|
|
192
|
-
}
|
|
193
190
|
function buildSignature(map, options) {
|
|
194
191
|
let sig = "";
|
|
195
192
|
for (const key of Object.keys(map)) {
|
|
@@ -206,8 +203,9 @@ function buildEntries(map, options) {
|
|
|
206
203
|
const output = map[key];
|
|
207
204
|
if (output === void 0 || output.length === 0) continue;
|
|
208
205
|
const input = explicitInput ? explicitInput : output.length === 2 ? [0, 1] : evenlySpaced(output.length);
|
|
209
|
-
if (
|
|
210
|
-
|
|
206
|
+
if (explicitInput && explicitInput.length !== output.length) {
|
|
207
|
+
chunkQX5JHRZ2_js.warnOnce(
|
|
208
|
+
`interpolated-style-range:${String(key)}:${explicitInput.length}:${output.length}`,
|
|
211
209
|
`[inertia] useInterpolatedStyle: inputRange has ${explicitInput.length} stops but the "${String(
|
|
212
210
|
key
|
|
213
211
|
)}" output has ${output.length}. They must match \u2014 interpolation results are undefined otherwise.`
|
|
@@ -296,13 +294,22 @@ function useMotionValue(initial) {
|
|
|
296
294
|
return sv;
|
|
297
295
|
}
|
|
298
296
|
function useTransform(arg1, inputRange, outputRange, options) {
|
|
297
|
+
const rangeSig = chunkQX5JHRZ2_js.stableSig([inputRange, outputRange]);
|
|
298
|
+
const ranges = react.useMemo(
|
|
299
|
+
() => ({
|
|
300
|
+
input: inputRange ?? [],
|
|
301
|
+
output: outputRange ?? []
|
|
302
|
+
}),
|
|
303
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
304
|
+
[rangeSig]
|
|
305
|
+
);
|
|
299
306
|
let producer;
|
|
300
307
|
if (typeof arg1 === "function") {
|
|
301
308
|
const userFn = arg1;
|
|
302
309
|
if (reactNativeWorklets.isWorkletFunction(userFn)) {
|
|
303
310
|
producer = userFn;
|
|
304
311
|
} else {
|
|
305
|
-
|
|
312
|
+
chunkQX5JHRZ2_js.warnNonWorkletOnce(
|
|
306
313
|
"useTransform-transformer",
|
|
307
314
|
"[inertia] useTransform: the transformer is not a worklet, so the shared values it reads can't be tracked as dependencies \u2014 the derived value will only refresh on React re-renders, and native builds reject plain functions on the UI thread. Add the 'worklet' directive as the first statement of the transformer."
|
|
308
315
|
);
|
|
@@ -313,11 +320,11 @@ function useTransform(arg1, inputRange, outputRange, options) {
|
|
|
313
320
|
}
|
|
314
321
|
} else {
|
|
315
322
|
const source = arg1;
|
|
316
|
-
const input =
|
|
317
|
-
const output =
|
|
323
|
+
const input = ranges.input;
|
|
324
|
+
const output = ranges.output;
|
|
318
325
|
const isColor = output.length > 0 && typeof output[0] === "string";
|
|
319
|
-
const extrapolateLeft =
|
|
320
|
-
const extrapolateRight =
|
|
326
|
+
const extrapolateLeft = mapExtrapolation(options?.extrapolateLeft);
|
|
327
|
+
const extrapolateRight = mapExtrapolation(options?.extrapolateRight);
|
|
321
328
|
producer = isColor ? () => {
|
|
322
329
|
"worklet";
|
|
323
330
|
return reactNativeReanimated.interpolateColor(
|
|
@@ -337,11 +344,6 @@ function useTransform(arg1, inputRange, outputRange, options) {
|
|
|
337
344
|
}
|
|
338
345
|
return reactNativeReanimated.useDerivedValue(producer);
|
|
339
346
|
}
|
|
340
|
-
function mapExtrapolation2(mode) {
|
|
341
|
-
if (mode === "identity") return reactNativeReanimated.Extrapolation.IDENTITY;
|
|
342
|
-
if (mode === "extend") return reactNativeReanimated.Extrapolation.EXTEND;
|
|
343
|
-
return reactNativeReanimated.Extrapolation.CLAMP;
|
|
344
|
-
}
|
|
345
347
|
function useScroll() {
|
|
346
348
|
const scrollX = reactNativeReanimated.useSharedValue(0);
|
|
347
349
|
const scrollY = reactNativeReanimated.useSharedValue(0);
|
|
@@ -368,10 +370,15 @@ function useShadow({
|
|
|
368
370
|
const hasElevation = from.elevation !== void 0 || to.elevation !== void 0;
|
|
369
371
|
const hasColor = from.shadowColor !== void 0 || to.shadowColor !== void 0;
|
|
370
372
|
const hasOffset = from.shadowOffset !== void 0 || to.shadowOffset !== void 0;
|
|
371
|
-
const
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
373
|
+
const boxShadowSig = chunkQX5JHRZ2_js.stableSig([from.boxShadow, to.boxShadow]);
|
|
374
|
+
const boxShadowPairs = react.useMemo(
|
|
375
|
+
() => from.boxShadow !== void 0 || to.boxShadow !== void 0 ? chunkHBURWGCZ_js.pairBoxShadowLayers(
|
|
376
|
+
chunkHBURWGCZ_js.resolveBoxShadowInput(from.boxShadow),
|
|
377
|
+
chunkHBURWGCZ_js.resolveBoxShadowInput(to.boxShadow)
|
|
378
|
+
) : [],
|
|
379
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
380
|
+
[boxShadowSig]
|
|
381
|
+
);
|
|
375
382
|
const opacityFrom = from.shadowOpacity ?? 0;
|
|
376
383
|
const opacityTo = to.shadowOpacity ?? 0;
|
|
377
384
|
const radiusFrom = from.shadowRadius ?? 0;
|
|
@@ -467,101 +474,117 @@ function useVariants(variants, initial) {
|
|
|
467
474
|
}, []);
|
|
468
475
|
}
|
|
469
476
|
|
|
477
|
+
Object.defineProperty(exports, "applyBounds", {
|
|
478
|
+
enumerable: true,
|
|
479
|
+
get: function () { return chunkKFHZMFAX_js.applyBounds; }
|
|
480
|
+
});
|
|
481
|
+
Object.defineProperty(exports, "useTranslateStyle", {
|
|
482
|
+
enumerable: true,
|
|
483
|
+
get: function () { return chunkKFHZMFAX_js.useTranslateStyle; }
|
|
484
|
+
});
|
|
470
485
|
Object.defineProperty(exports, "useGesture", {
|
|
471
486
|
enumerable: true,
|
|
472
|
-
get: function () { return
|
|
487
|
+
get: function () { return chunkNTG6PSGZ_js.useGesture; }
|
|
473
488
|
});
|
|
474
489
|
Object.defineProperty(exports, "MotionView", {
|
|
475
490
|
enumerable: true,
|
|
476
|
-
get: function () { return
|
|
491
|
+
get: function () { return chunk2UREDR4Z_js.MotionView; }
|
|
477
492
|
});
|
|
478
493
|
Object.defineProperty(exports, "MotionText", {
|
|
479
494
|
enumerable: true,
|
|
480
|
-
get: function () { return
|
|
495
|
+
get: function () { return chunkJBMTTICC_js.MotionText; }
|
|
481
496
|
});
|
|
482
497
|
Object.defineProperty(exports, "MotionImage", {
|
|
483
498
|
enumerable: true,
|
|
484
|
-
get: function () { return
|
|
499
|
+
get: function () { return chunkJAJHKJC5_js.MotionImage; }
|
|
485
500
|
});
|
|
486
501
|
Object.defineProperty(exports, "MotionPressable", {
|
|
487
502
|
enumerable: true,
|
|
488
|
-
get: function () { return
|
|
503
|
+
get: function () { return chunkR7YD6L3D_js.MotionPressable; }
|
|
489
504
|
});
|
|
490
505
|
Object.defineProperty(exports, "MotionScrollView", {
|
|
491
506
|
enumerable: true,
|
|
492
|
-
get: function () { return
|
|
507
|
+
get: function () { return chunk3PB27UIE_js.MotionScrollView; }
|
|
493
508
|
});
|
|
494
509
|
Object.defineProperty(exports, "MotionFlatList", {
|
|
495
510
|
enumerable: true,
|
|
496
|
-
get: function () { return
|
|
511
|
+
get: function () { return chunkXLKI2MSD_js.MotionFlatList; }
|
|
497
512
|
});
|
|
498
513
|
Object.defineProperty(exports, "Presence", {
|
|
499
514
|
enumerable: true,
|
|
500
|
-
get: function () { return
|
|
515
|
+
get: function () { return chunkHBURWGCZ_js.Presence; }
|
|
501
516
|
});
|
|
502
517
|
Object.defineProperty(exports, "Stagger", {
|
|
503
518
|
enumerable: true,
|
|
504
|
-
get: function () { return
|
|
519
|
+
get: function () { return chunkHBURWGCZ_js.Stagger; }
|
|
505
520
|
});
|
|
506
521
|
Object.defineProperty(exports, "TRANSPARENT", {
|
|
507
522
|
enumerable: true,
|
|
508
|
-
get: function () { return
|
|
523
|
+
get: function () { return chunkHBURWGCZ_js.TRANSPARENT; }
|
|
509
524
|
});
|
|
510
525
|
Object.defineProperty(exports, "createMotionComponent", {
|
|
511
526
|
enumerable: true,
|
|
512
|
-
get: function () { return
|
|
527
|
+
get: function () { return chunkHBURWGCZ_js.createMotionComponent; }
|
|
513
528
|
});
|
|
514
529
|
Object.defineProperty(exports, "usePresence", {
|
|
515
530
|
enumerable: true,
|
|
516
|
-
get: function () { return
|
|
531
|
+
get: function () { return chunkHBURWGCZ_js.usePresence; }
|
|
517
532
|
});
|
|
518
533
|
Object.defineProperty(exports, "useStaggerDelay", {
|
|
519
534
|
enumerable: true,
|
|
520
|
-
get: function () { return
|
|
535
|
+
get: function () { return chunkHBURWGCZ_js.useStaggerDelay; }
|
|
521
536
|
});
|
|
522
537
|
Object.defineProperty(exports, "MotionConfig", {
|
|
523
538
|
enumerable: true,
|
|
524
|
-
get: function () { return
|
|
539
|
+
get: function () { return chunkQDMSFRQR_js.MotionConfig; }
|
|
525
540
|
});
|
|
526
541
|
Object.defineProperty(exports, "resolveNamedTransition", {
|
|
527
542
|
enumerable: true,
|
|
528
|
-
get: function () { return
|
|
543
|
+
get: function () { return chunkQDMSFRQR_js.resolveNamedTransition; }
|
|
529
544
|
});
|
|
530
545
|
Object.defineProperty(exports, "useMotionConfig", {
|
|
531
546
|
enumerable: true,
|
|
532
|
-
get: function () { return
|
|
547
|
+
get: function () { return chunkQDMSFRQR_js.useMotionConfig; }
|
|
533
548
|
});
|
|
534
549
|
Object.defineProperty(exports, "useNamedTransitions", {
|
|
535
550
|
enumerable: true,
|
|
536
|
-
get: function () { return
|
|
551
|
+
get: function () { return chunkQDMSFRQR_js.useNamedTransitions; }
|
|
537
552
|
});
|
|
538
553
|
Object.defineProperty(exports, "useShouldReduceMotion", {
|
|
539
554
|
enumerable: true,
|
|
540
|
-
get: function () { return
|
|
555
|
+
get: function () { return chunkQDMSFRQR_js.useShouldReduceMotion; }
|
|
541
556
|
});
|
|
542
557
|
Object.defineProperty(exports, "applyDelay", {
|
|
543
558
|
enumerable: true,
|
|
544
|
-
get: function () { return
|
|
559
|
+
get: function () { return chunkQX5JHRZ2_js.applyDelay; }
|
|
545
560
|
});
|
|
546
561
|
Object.defineProperty(exports, "buildReleaseAnimation", {
|
|
547
562
|
enumerable: true,
|
|
548
|
-
get: function () { return
|
|
563
|
+
get: function () { return chunkQX5JHRZ2_js.buildReleaseAnimation; }
|
|
549
564
|
});
|
|
550
565
|
Object.defineProperty(exports, "cubicBezier", {
|
|
551
566
|
enumerable: true,
|
|
552
|
-
get: function () { return
|
|
567
|
+
get: function () { return chunkQX5JHRZ2_js.cubicBezier; }
|
|
553
568
|
});
|
|
554
569
|
Object.defineProperty(exports, "ensureWorkletEasing", {
|
|
555
570
|
enumerable: true,
|
|
556
|
-
get: function () { return
|
|
571
|
+
get: function () { return chunkQX5JHRZ2_js.ensureWorkletEasing; }
|
|
572
|
+
});
|
|
573
|
+
Object.defineProperty(exports, "isTopLevelTransition", {
|
|
574
|
+
enumerable: true,
|
|
575
|
+
get: function () { return chunkQX5JHRZ2_js.isTopLevelTransition; }
|
|
557
576
|
});
|
|
558
577
|
Object.defineProperty(exports, "resolveAnimatableValue", {
|
|
559
578
|
enumerable: true,
|
|
560
|
-
get: function () { return
|
|
579
|
+
get: function () { return chunkQX5JHRZ2_js.resolveAnimatableValue; }
|
|
561
580
|
});
|
|
562
581
|
Object.defineProperty(exports, "resolveTransition", {
|
|
563
582
|
enumerable: true,
|
|
564
|
-
get: function () { return
|
|
583
|
+
get: function () { return chunkQX5JHRZ2_js.resolveTransition; }
|
|
584
|
+
});
|
|
585
|
+
Object.defineProperty(exports, "stableSig", {
|
|
586
|
+
enumerable: true,
|
|
587
|
+
get: function () { return chunkQX5JHRZ2_js.stableSig; }
|
|
565
588
|
});
|
|
566
589
|
exports.Motion = Motion;
|
|
567
590
|
exports.useAnimation = useAnimation;
|
package/dist/index.mjs
CHANGED
|
@@ -1,24 +1,25 @@
|
|
|
1
|
-
export {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
1
|
+
export { applyBounds, useTranslateStyle } from './chunk-OH46TGEA.mjs';
|
|
2
|
+
export { useGesture } from './chunk-FKJLPYGY.mjs';
|
|
3
|
+
import { MotionView } from './chunk-JGQ6YRDN.mjs';
|
|
4
|
+
export { MotionView } from './chunk-JGQ6YRDN.mjs';
|
|
5
|
+
import { MotionText } from './chunk-UGYBFAVY.mjs';
|
|
6
|
+
export { MotionText } from './chunk-UGYBFAVY.mjs';
|
|
7
|
+
import { MotionImage } from './chunk-DT2KVAAO.mjs';
|
|
8
|
+
export { MotionImage } from './chunk-DT2KVAAO.mjs';
|
|
9
|
+
import { MotionPressable } from './chunk-RO4XFTQ6.mjs';
|
|
10
|
+
export { MotionPressable } from './chunk-RO4XFTQ6.mjs';
|
|
11
|
+
import { MotionScrollView } from './chunk-LHW4VNWD.mjs';
|
|
12
|
+
export { MotionScrollView } from './chunk-LHW4VNWD.mjs';
|
|
13
|
+
import { MotionFlatList } from './chunk-7RMSLKQQ.mjs';
|
|
14
|
+
export { MotionFlatList } from './chunk-7RMSLKQQ.mjs';
|
|
15
|
+
import { pairBoxShadowLayers, resolveBoxShadowInput } from './chunk-5EYIZG72.mjs';
|
|
16
|
+
export { Presence, Stagger, TRANSPARENT, createMotionComponent, usePresence, useStaggerDelay } from './chunk-5EYIZG72.mjs';
|
|
17
|
+
import { useShouldReduceMotion, resolveNamedTransition, useNamedTransitions, lookupNamedTransition } from './chunk-2Q6JMDYZ.mjs';
|
|
18
|
+
export { MotionConfig, resolveNamedTransition, useMotionConfig, useNamedTransitions, useShouldReduceMotion } from './chunk-2Q6JMDYZ.mjs';
|
|
19
|
+
import { stableSig, resolveTransition, springToReanimated, warnOnce, warnNonWorkletOnce } from './chunk-QIRKPDXA.mjs';
|
|
20
|
+
export { applyDelay, buildReleaseAnimation, cubicBezier, ensureWorkletEasing, isTopLevelTransition, resolveAnimatableValue, resolveTransition, stableSig } from './chunk-QIRKPDXA.mjs';
|
|
20
21
|
import { useEffect, useRef, useCallback, useMemo } from 'react';
|
|
21
|
-
import { useSharedValue, cancelAnimation, withSpring, useAnimatedReaction, useAnimatedStyle, interpolateColor, interpolate, useDerivedValue,
|
|
22
|
+
import { useSharedValue, cancelAnimation, withSpring, useAnimatedReaction, useAnimatedStyle, interpolateColor, interpolate, useDerivedValue, useAnimatedScrollHandler, Extrapolation } from 'react-native-reanimated';
|
|
22
23
|
import { isWorkletFunction } from 'react-native-worklets';
|
|
23
24
|
|
|
24
25
|
// src/motion/index.ts
|
|
@@ -62,6 +63,7 @@ function useAnimator() {
|
|
|
62
63
|
}
|
|
63
64
|
function useSpring(target, config) {
|
|
64
65
|
const spring = resolveSpringInput(config, useNamedTransitions());
|
|
66
|
+
const shouldReduceMotion = useShouldReduceMotion();
|
|
65
67
|
const reanimConfig = useMemo(
|
|
66
68
|
() => springToReanimated(spring ?? {}),
|
|
67
69
|
// Keyed on the resolved primitive fields rather than the `config` object
|
|
@@ -69,34 +71,28 @@ function useSpring(target, config) {
|
|
|
69
71
|
// depending on `config` itself would rebuild the Reanimated config on
|
|
70
72
|
// every render and defeat the memo.
|
|
71
73
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
72
|
-
[
|
|
73
|
-
spring?.tension,
|
|
74
|
-
spring?.friction,
|
|
75
|
-
spring?.mass,
|
|
76
|
-
spring?.velocity,
|
|
77
|
-
spring?.restSpeedThreshold,
|
|
78
|
-
spring?.restDisplacementThreshold
|
|
79
|
-
]
|
|
74
|
+
[spring?.tension, spring?.friction, spring?.mass, spring?.velocity]
|
|
80
75
|
);
|
|
81
76
|
const isSharedTarget = isSharedValue(target);
|
|
82
77
|
const initial = isSharedTarget ? target.value : target;
|
|
83
78
|
const output = useSharedValue(initial);
|
|
84
79
|
useEffect(() => {
|
|
85
80
|
if (isSharedTarget) return;
|
|
86
|
-
output.value = withSpring(target, reanimConfig);
|
|
87
|
-
}, [isSharedTarget, target, reanimConfig]);
|
|
81
|
+
output.value = shouldReduceMotion ? target : withSpring(target, reanimConfig);
|
|
82
|
+
}, [isSharedTarget, target, reanimConfig, shouldReduceMotion]);
|
|
83
|
+
const source = isSharedTarget ? target : null;
|
|
88
84
|
useAnimatedReaction(
|
|
89
85
|
() => {
|
|
90
86
|
"worklet";
|
|
91
|
-
if (
|
|
92
|
-
return
|
|
87
|
+
if (source === null) return null;
|
|
88
|
+
return source.value;
|
|
93
89
|
},
|
|
94
90
|
(next, prev) => {
|
|
95
91
|
"worklet";
|
|
96
92
|
if (next === null || next === prev) return;
|
|
97
|
-
output.value = withSpring(next, reanimConfig);
|
|
93
|
+
output.value = shouldReduceMotion ? next : withSpring(next, reanimConfig);
|
|
98
94
|
},
|
|
99
|
-
[
|
|
95
|
+
[source, reanimConfig, shouldReduceMotion]
|
|
100
96
|
);
|
|
101
97
|
useEffect(
|
|
102
98
|
() => () => cancelAnimation(output),
|
|
@@ -110,11 +106,10 @@ function resolveSpringInput(config, registry) {
|
|
|
110
106
|
if (typeof config !== "string") return config;
|
|
111
107
|
const cfg = lookupNamedTransition(config, registry);
|
|
112
108
|
if (cfg.type === void 0 || cfg.type === "spring") return cfg;
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
}
|
|
109
|
+
warnOnce(
|
|
110
|
+
`spring-only:${config}`,
|
|
111
|
+
`[inertia] Named transition "${config}" resolves to type '${cfg.type}', but useSpring / useBooleanSpring are spring-only \u2014 falling back to the default spring. Use useAnimation to honor non-spring named transitions.`
|
|
112
|
+
);
|
|
118
113
|
return void 0;
|
|
119
114
|
}
|
|
120
115
|
function isSharedValue(v) {
|
|
@@ -164,6 +159,13 @@ function useColorTransition(progress, range, options) {
|
|
|
164
159
|
return { [key]: interpolateColor(progress.value, [0, 1], [from, to]) };
|
|
165
160
|
});
|
|
166
161
|
}
|
|
162
|
+
function mapExtrapolation(mode) {
|
|
163
|
+
if (mode === "identity") return Extrapolation.IDENTITY;
|
|
164
|
+
if (mode === "extend") return Extrapolation.EXTEND;
|
|
165
|
+
return Extrapolation.CLAMP;
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
// src/values/useInterpolatedStyle.ts
|
|
167
169
|
var TRANSFORM_KEYS = /* @__PURE__ */ new Set([
|
|
168
170
|
"translateX",
|
|
169
171
|
"translateY",
|
|
@@ -192,11 +194,6 @@ function evenlySpaced(count) {
|
|
|
192
194
|
for (let i = 0; i < count; i++) out.push(i / (count - 1));
|
|
193
195
|
return out;
|
|
194
196
|
}
|
|
195
|
-
function mapExtrapolation(mode) {
|
|
196
|
-
if (mode === "identity") return Extrapolation.IDENTITY;
|
|
197
|
-
if (mode === "extend") return Extrapolation.EXTEND;
|
|
198
|
-
return Extrapolation.CLAMP;
|
|
199
|
-
}
|
|
200
197
|
function buildSignature(map, options) {
|
|
201
198
|
let sig = "";
|
|
202
199
|
for (const key of Object.keys(map)) {
|
|
@@ -213,8 +210,9 @@ function buildEntries(map, options) {
|
|
|
213
210
|
const output = map[key];
|
|
214
211
|
if (output === void 0 || output.length === 0) continue;
|
|
215
212
|
const input = explicitInput ? explicitInput : output.length === 2 ? [0, 1] : evenlySpaced(output.length);
|
|
216
|
-
if (
|
|
217
|
-
|
|
213
|
+
if (explicitInput && explicitInput.length !== output.length) {
|
|
214
|
+
warnOnce(
|
|
215
|
+
`interpolated-style-range:${String(key)}:${explicitInput.length}:${output.length}`,
|
|
218
216
|
`[inertia] useInterpolatedStyle: inputRange has ${explicitInput.length} stops but the "${String(
|
|
219
217
|
key
|
|
220
218
|
)}" output has ${output.length}. They must match \u2014 interpolation results are undefined otherwise.`
|
|
@@ -303,6 +301,15 @@ function useMotionValue(initial) {
|
|
|
303
301
|
return sv;
|
|
304
302
|
}
|
|
305
303
|
function useTransform(arg1, inputRange, outputRange, options) {
|
|
304
|
+
const rangeSig = stableSig([inputRange, outputRange]);
|
|
305
|
+
const ranges = useMemo(
|
|
306
|
+
() => ({
|
|
307
|
+
input: inputRange ?? [],
|
|
308
|
+
output: outputRange ?? []
|
|
309
|
+
}),
|
|
310
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
311
|
+
[rangeSig]
|
|
312
|
+
);
|
|
306
313
|
let producer;
|
|
307
314
|
if (typeof arg1 === "function") {
|
|
308
315
|
const userFn = arg1;
|
|
@@ -320,11 +327,11 @@ function useTransform(arg1, inputRange, outputRange, options) {
|
|
|
320
327
|
}
|
|
321
328
|
} else {
|
|
322
329
|
const source = arg1;
|
|
323
|
-
const input =
|
|
324
|
-
const output =
|
|
330
|
+
const input = ranges.input;
|
|
331
|
+
const output = ranges.output;
|
|
325
332
|
const isColor = output.length > 0 && typeof output[0] === "string";
|
|
326
|
-
const extrapolateLeft =
|
|
327
|
-
const extrapolateRight =
|
|
333
|
+
const extrapolateLeft = mapExtrapolation(options?.extrapolateLeft);
|
|
334
|
+
const extrapolateRight = mapExtrapolation(options?.extrapolateRight);
|
|
328
335
|
producer = isColor ? () => {
|
|
329
336
|
"worklet";
|
|
330
337
|
return interpolateColor(
|
|
@@ -344,11 +351,6 @@ function useTransform(arg1, inputRange, outputRange, options) {
|
|
|
344
351
|
}
|
|
345
352
|
return useDerivedValue(producer);
|
|
346
353
|
}
|
|
347
|
-
function mapExtrapolation2(mode) {
|
|
348
|
-
if (mode === "identity") return Extrapolation.IDENTITY;
|
|
349
|
-
if (mode === "extend") return Extrapolation.EXTEND;
|
|
350
|
-
return Extrapolation.CLAMP;
|
|
351
|
-
}
|
|
352
354
|
function useScroll() {
|
|
353
355
|
const scrollX = useSharedValue(0);
|
|
354
356
|
const scrollY = useSharedValue(0);
|
|
@@ -375,10 +377,15 @@ function useShadow({
|
|
|
375
377
|
const hasElevation = from.elevation !== void 0 || to.elevation !== void 0;
|
|
376
378
|
const hasColor = from.shadowColor !== void 0 || to.shadowColor !== void 0;
|
|
377
379
|
const hasOffset = from.shadowOffset !== void 0 || to.shadowOffset !== void 0;
|
|
378
|
-
const
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
380
|
+
const boxShadowSig = stableSig([from.boxShadow, to.boxShadow]);
|
|
381
|
+
const boxShadowPairs = useMemo(
|
|
382
|
+
() => from.boxShadow !== void 0 || to.boxShadow !== void 0 ? pairBoxShadowLayers(
|
|
383
|
+
resolveBoxShadowInput(from.boxShadow),
|
|
384
|
+
resolveBoxShadowInput(to.boxShadow)
|
|
385
|
+
) : [],
|
|
386
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
387
|
+
[boxShadowSig]
|
|
388
|
+
);
|
|
382
389
|
const opacityFrom = from.shadowOpacity ?? 0;
|
|
383
390
|
const opacityTo = to.shadowOpacity ?? 0;
|
|
384
391
|
const radiusFrom = from.shadowRadius ?? 0;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { FlatListProps, FlatList } from 'react-native';
|
|
2
|
-
import { V as VariantsMap, a as MotionProps } from '../types-
|
|
2
|
+
import { V as VariantsMap, a as MotionProps } from '../types-C5Zbs9MC.mjs';
|
|
3
3
|
import 'react';
|
|
4
|
+
import 'react-native-reanimated';
|
|
4
5
|
|
|
5
6
|
/**
|
|
6
7
|
* Animatable, virtualized `FlatList`.
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { FlatListProps, FlatList } from 'react-native';
|
|
2
|
-
import { V as VariantsMap, a as MotionProps } from '../types-
|
|
2
|
+
import { V as VariantsMap, a as MotionProps } from '../types-C5Zbs9MC.js';
|
|
3
3
|
import 'react';
|
|
4
|
+
import 'react-native-reanimated';
|
|
4
5
|
|
|
5
6
|
/**
|
|
6
7
|
* Animatable, virtualized `FlatList`.
|
package/dist/motion/FlatList.js
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
4
|
-
require('../chunk-
|
|
5
|
-
require('../chunk-
|
|
6
|
-
require('../chunk-
|
|
3
|
+
var chunkXLKI2MSD_js = require('../chunk-XLKI2MSD.js');
|
|
4
|
+
require('../chunk-HBURWGCZ.js');
|
|
5
|
+
require('../chunk-QDMSFRQR.js');
|
|
6
|
+
require('../chunk-QX5JHRZ2.js');
|
|
7
7
|
|
|
8
8
|
|
|
9
9
|
|
|
10
10
|
Object.defineProperty(exports, "MotionFlatList", {
|
|
11
11
|
enumerable: true,
|
|
12
|
-
get: function () { return
|
|
12
|
+
get: function () { return chunkXLKI2MSD_js.MotionFlatList; }
|
|
13
13
|
});
|
package/dist/motion/FlatList.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { MotionFlatList } from '../chunk-
|
|
2
|
-
import '../chunk-
|
|
3
|
-
import '../chunk-
|
|
4
|
-
import '../chunk-
|
|
1
|
+
export { MotionFlatList } from '../chunk-7RMSLKQQ.mjs';
|
|
2
|
+
import '../chunk-5EYIZG72.mjs';
|
|
3
|
+
import '../chunk-2Q6JMDYZ.mjs';
|
|
4
|
+
import '../chunk-QIRKPDXA.mjs';
|