@tamagui/animations-reanimated 1.0.1-beta.99 → 1.0.1-rc.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/dist/cjs/createAnimations.js +95 -95
- package/dist/cjs/createAnimations.js.map +3 -3
- package/dist/cjs/index.js +2 -0
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/polyfill.js +1 -0
- package/dist/cjs/polyfill.js.map +1 -1
- package/dist/cjs/useAnimatedNumber.js +33 -0
- package/dist/cjs/useAnimatedNumber.js.map +7 -0
- package/dist/esm/createAnimations.js +95 -97
- package/dist/esm/createAnimations.js.map +3 -3
- package/dist/esm/index.js +1 -0
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/polyfill.js +0 -0
- package/dist/esm/polyfill.js.map +0 -0
- package/dist/esm/useAnimatedNumber.js +11 -0
- package/dist/esm/useAnimatedNumber.js.map +7 -0
- package/dist/jsx/createAnimations.js +93 -79
- package/dist/jsx/createAnimations.js.map +3 -3
- package/dist/jsx/index.js +1 -0
- package/dist/jsx/index.js.map +2 -2
- package/dist/jsx/polyfill.js +0 -0
- package/dist/jsx/polyfill.js.map +0 -0
- package/dist/jsx/useAnimatedNumber.js +11 -0
- package/dist/jsx/useAnimatedNumber.js.map +7 -0
- package/package.json +6 -6
- package/src/createAnimations.tsx +79 -60
- package/src/index.tsx +1 -0
- package/src/useAnimatedNumber.tsx +73 -0
- package/types/createAnimations.d.ts +0 -0
- package/types/index.d.ts +1 -0
- package/types/polyfill.d.ts +1 -0
- package/types/useAnimatedNumber.d.ts +2 -0
- package/types/createAnimations.d.ts.map +0 -1
- package/types/index.d.ts.map +0 -1
|
@@ -1,26 +1,10 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
var __create = Object.create;
|
|
2
3
|
var __defProp = Object.defineProperty;
|
|
3
|
-
var __defProps = Object.defineProperties;
|
|
4
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
6
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
8
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
9
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
11
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
12
|
-
var __spreadValues = (a, b) => {
|
|
13
|
-
for (var prop in b || (b = {}))
|
|
14
|
-
if (__hasOwnProp.call(b, prop))
|
|
15
|
-
__defNormalProp(a, prop, b[prop]);
|
|
16
|
-
if (__getOwnPropSymbols)
|
|
17
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
18
|
-
if (__propIsEnum.call(b, prop))
|
|
19
|
-
__defNormalProp(a, prop, b[prop]);
|
|
20
|
-
}
|
|
21
|
-
return a;
|
|
22
|
-
};
|
|
23
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
24
8
|
var __export = (target, all) => {
|
|
25
9
|
for (var name in all)
|
|
26
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -33,78 +17,75 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
33
17
|
}
|
|
34
18
|
return to;
|
|
35
19
|
};
|
|
36
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
37
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
38
25
|
var createAnimations_exports = {};
|
|
39
26
|
__export(createAnimations_exports, {
|
|
40
27
|
createAnimations: () => createAnimations
|
|
41
28
|
});
|
|
42
29
|
module.exports = __toCommonJS(createAnimations_exports);
|
|
43
|
-
var
|
|
30
|
+
var import_core = require("@tamagui/core");
|
|
31
|
+
var import_use_presence = require("@tamagui/use-presence");
|
|
44
32
|
var import_react = require("react");
|
|
33
|
+
var import_react_native = require("react-native");
|
|
45
34
|
var import_react_native_reanimated = __toESM(require("react-native-reanimated"));
|
|
35
|
+
var import_useAnimatedNumber = require("./useAnimatedNumber");
|
|
36
|
+
var _a;
|
|
37
|
+
if (process.env.NODE_ENV === "development") {
|
|
38
|
+
if ((_a = import_react_native.FlatList) == null ? void 0 : _a["_isProxyWorm"]) {
|
|
39
|
+
console.warn(
|
|
40
|
+
`Using reanimated with excludeReactNativeWebExports including FlatList, adjust your next.config.js, reanimated currently doesn't support tree-shaking and needs *List components around.`
|
|
41
|
+
);
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
const animatedStyleKey = {
|
|
45
|
+
transform: true,
|
|
46
|
+
opacity: true
|
|
47
|
+
};
|
|
46
48
|
function createAnimations(animations) {
|
|
47
49
|
const AnimatedView = import_react_native_reanimated.default.View;
|
|
48
50
|
const AnimatedText = import_react_native_reanimated.default.Text;
|
|
49
51
|
AnimatedView["displayName"] = "AnimatedView";
|
|
50
52
|
AnimatedText["displayName"] = "AnimatedText";
|
|
51
53
|
return {
|
|
52
|
-
|
|
54
|
+
isReactNative: true,
|
|
53
55
|
animations,
|
|
54
56
|
View: AnimatedView,
|
|
55
57
|
Text: AnimatedText,
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
const
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
const isEntering = !state.mounted;
|
|
67
|
-
const all = getStyle({
|
|
68
|
-
isExiting,
|
|
69
|
-
isEntering,
|
|
70
|
-
exitVariant: presence == null ? void 0 : presence.exitVariant,
|
|
71
|
-
enterVariant: presence == null ? void 0 : presence.enterVariant
|
|
58
|
+
NumberView: import_react_native.Animated.View,
|
|
59
|
+
useAnimatedNumber: import_useAnimatedNumber.useAnimatedNumber,
|
|
60
|
+
useAnimatedNumberReaction: import_useAnimatedNumber.useAnimatedNumberReaction,
|
|
61
|
+
useAnimatedNumberStyle: import_useAnimatedNumber.useAnimatedNumberStyle,
|
|
62
|
+
usePresence: import_use_presence.usePresence,
|
|
63
|
+
useAnimations: ({ props, style, presence, pseudos, onDidAnimate, delay }) => {
|
|
64
|
+
const isExiting = (presence == null ? void 0 : presence[0]) === false;
|
|
65
|
+
const sendExitComplete = presence == null ? void 0 : presence[1];
|
|
66
|
+
const reanimatedOnDidAnimated = (0, import_core.useEvent)((...args) => {
|
|
67
|
+
onDidAnimate == null ? void 0 : onDidAnimate(...args);
|
|
72
68
|
});
|
|
69
|
+
const all = style;
|
|
73
70
|
const [animatedStyles, nonAnimatedStyle] = [{}, {}];
|
|
74
|
-
const
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
};
|
|
78
|
-
for (const key of Object.keys(all)) {
|
|
79
|
-
if (animatedStyleKey[key]) {
|
|
80
|
-
animatedStyles[key] = all[key];
|
|
71
|
+
for (const key2 of Object.keys(all)) {
|
|
72
|
+
if (animatedStyleKey[key2]) {
|
|
73
|
+
animatedStyles[key2] = all[key2];
|
|
81
74
|
} else {
|
|
82
|
-
nonAnimatedStyle[
|
|
75
|
+
nonAnimatedStyle[key2] = all[key2];
|
|
83
76
|
}
|
|
84
77
|
}
|
|
85
|
-
const
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
state.hover,
|
|
89
|
-
state.press,
|
|
90
|
-
state.pressIn,
|
|
91
|
-
state.focus,
|
|
92
|
-
delay,
|
|
93
|
-
isPresent,
|
|
94
|
-
onDidAnimate,
|
|
95
|
-
reanimatedOnDidAnimated,
|
|
96
|
-
presence == null ? void 0 : presence.exitVariant,
|
|
97
|
-
presence == null ? void 0 : presence.enterVariant
|
|
98
|
-
];
|
|
99
|
-
const callback = (isExiting2, exitingStyleProps, key, value) => {
|
|
78
|
+
const animatedString = JSON.stringify(animatedStyles);
|
|
79
|
+
const key = animatedString;
|
|
80
|
+
const callback = (isExiting2, exitingStyleProps, key2, value) => {
|
|
100
81
|
"worklet";
|
|
101
82
|
return (completed, current) => {
|
|
102
83
|
"worklet";
|
|
103
|
-
(0, import_react_native_reanimated.runOnJS)(reanimatedOnDidAnimated)(
|
|
84
|
+
(0, import_react_native_reanimated.runOnJS)(reanimatedOnDidAnimated)(key2, completed, current, {
|
|
104
85
|
attemptedValue: value
|
|
105
86
|
});
|
|
106
87
|
if (isExiting2) {
|
|
107
|
-
exitingStyleProps[
|
|
88
|
+
exitingStyleProps[key2] = false;
|
|
108
89
|
const areStylesExiting = Object.values(exitingStyleProps).some(Boolean);
|
|
109
90
|
if (!areStylesExiting) {
|
|
110
91
|
if (sendExitComplete) {
|
|
@@ -116,87 +97,105 @@ function createAnimations(animations) {
|
|
|
116
97
|
};
|
|
117
98
|
const animatedStyle = (0, import_react_native_reanimated.useAnimatedStyle)(() => {
|
|
118
99
|
"worklet";
|
|
119
|
-
const
|
|
100
|
+
const style2 = JSON.parse(animatedString);
|
|
120
101
|
const final = {
|
|
121
102
|
transform: []
|
|
122
103
|
};
|
|
123
|
-
const isExiting2 = isPresent === false;
|
|
124
104
|
const exitingStyleProps = {};
|
|
125
|
-
if (exitStyle) {
|
|
126
|
-
for (const
|
|
127
|
-
if (
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
105
|
+
if (pseudos.exitStyle) {
|
|
106
|
+
for (const key2 in pseudos.exitStyle) {
|
|
107
|
+
if (key2 === "transform") {
|
|
108
|
+
const val = pseudos.exitStyle[key2];
|
|
109
|
+
if (val) {
|
|
110
|
+
for (const attr of val) {
|
|
111
|
+
const tkey = Object.keys(attr)[0];
|
|
112
|
+
exitingStyleProps[tkey] = true;
|
|
113
|
+
}
|
|
131
114
|
}
|
|
132
115
|
} else {
|
|
133
|
-
exitingStyleProps[
|
|
116
|
+
exitingStyleProps[key2] = true;
|
|
134
117
|
}
|
|
135
118
|
}
|
|
136
119
|
}
|
|
137
|
-
for (const
|
|
138
|
-
const value =
|
|
139
|
-
const animationConfig = getAnimationConfig(
|
|
140
|
-
const { animation, config, shouldRepeat, repeatCount, repeatReverse } = getAnimation(
|
|
141
|
-
|
|
120
|
+
for (const key2 in style2) {
|
|
121
|
+
const value = style2[key2];
|
|
122
|
+
const animationConfig = getAnimationConfig(key2, animations, props.animation);
|
|
123
|
+
const { animation, config, shouldRepeat, repeatCount, repeatReverse } = getAnimation(
|
|
124
|
+
key2,
|
|
125
|
+
animationConfig,
|
|
126
|
+
props.animateOnly
|
|
127
|
+
);
|
|
128
|
+
const { delayMs = null } = animationDelay(key2, animationConfig, delay);
|
|
142
129
|
if (!animation) {
|
|
143
|
-
console.warn("No animation for",
|
|
130
|
+
console.warn("No animation for", key2, "in", style2);
|
|
144
131
|
continue;
|
|
145
132
|
}
|
|
146
133
|
if (!config) {
|
|
147
|
-
console.warn("No animation config for",
|
|
134
|
+
console.warn("No animation config for", key2, "in", style2);
|
|
148
135
|
continue;
|
|
149
136
|
}
|
|
150
|
-
if (
|
|
137
|
+
if (key2 === "transform") {
|
|
151
138
|
if (!Array.isArray(value)) {
|
|
152
139
|
console.error(`Invalid transform value. Needs to be an array.`);
|
|
153
140
|
continue;
|
|
154
141
|
}
|
|
155
142
|
for (const transformObject of value) {
|
|
156
|
-
const
|
|
157
|
-
const transformValue = transformObject[
|
|
158
|
-
let finalValue2 = animation(
|
|
143
|
+
const key3 = Object.keys(transformObject)[0];
|
|
144
|
+
const transformValue = transformObject[key3];
|
|
145
|
+
let finalValue2 = animation(
|
|
146
|
+
transformValue,
|
|
147
|
+
config,
|
|
148
|
+
callback(isExiting, exitingStyleProps, key3, value)
|
|
149
|
+
);
|
|
159
150
|
if (shouldRepeat) {
|
|
160
151
|
finalValue2 = (0, import_react_native_reanimated.withRepeat)(finalValue2, repeatCount, repeatReverse);
|
|
161
152
|
}
|
|
162
153
|
final["transform"].push({
|
|
163
|
-
[
|
|
154
|
+
[key3]: finalValue2
|
|
164
155
|
});
|
|
165
156
|
}
|
|
166
157
|
continue;
|
|
167
158
|
}
|
|
168
159
|
if (typeof value === "object") {
|
|
169
|
-
final[
|
|
160
|
+
final[key2] = {};
|
|
170
161
|
for (const innerStyleKey of Object.keys(value || {})) {
|
|
171
|
-
let finalValue2 = animation(
|
|
162
|
+
let finalValue2 = animation(
|
|
163
|
+
value,
|
|
164
|
+
config,
|
|
165
|
+
callback(isExiting, exitingStyleProps, key2, value)
|
|
166
|
+
);
|
|
172
167
|
if (shouldRepeat) {
|
|
173
168
|
finalValue2 = (0, import_react_native_reanimated.withRepeat)(finalValue2, repeatCount, repeatReverse);
|
|
174
169
|
}
|
|
175
170
|
if (delayMs != null) {
|
|
176
|
-
final[
|
|
171
|
+
final[key2][innerStyleKey] = (0, import_react_native_reanimated.withDelay)(delayMs, finalValue2);
|
|
177
172
|
} else {
|
|
178
|
-
final[
|
|
173
|
+
final[key2][innerStyleKey] = finalValue2;
|
|
179
174
|
}
|
|
180
175
|
}
|
|
181
176
|
continue;
|
|
182
177
|
}
|
|
183
|
-
let finalValue = animation(
|
|
178
|
+
let finalValue = animation(
|
|
179
|
+
value,
|
|
180
|
+
config,
|
|
181
|
+
callback(isExiting, exitingStyleProps, key2, value)
|
|
182
|
+
);
|
|
184
183
|
if (shouldRepeat) {
|
|
185
184
|
finalValue = (0, import_react_native_reanimated.withRepeat)(finalValue, repeatCount, repeatReverse);
|
|
186
185
|
}
|
|
187
186
|
if (delayMs != null && typeof delayMs === "number") {
|
|
188
|
-
final[
|
|
187
|
+
final[key2] = (0, import_react_native_reanimated.withDelay)(delayMs, finalValue);
|
|
189
188
|
} else {
|
|
190
|
-
final[
|
|
189
|
+
final[key2] = finalValue;
|
|
191
190
|
}
|
|
192
191
|
}
|
|
193
192
|
return final;
|
|
194
|
-
},
|
|
193
|
+
}, [key]);
|
|
195
194
|
return (0, import_react.useMemo)(() => {
|
|
196
195
|
return {
|
|
197
196
|
style: [nonAnimatedStyle, animatedStyle]
|
|
198
197
|
};
|
|
199
|
-
},
|
|
198
|
+
}, [key]);
|
|
200
199
|
}
|
|
201
200
|
};
|
|
202
201
|
}
|
|
@@ -227,9 +226,11 @@ function getAnimationConfig(key, animations, animation) {
|
|
|
227
226
|
if (!found) {
|
|
228
227
|
throw new Error(`No animation of type "${type}" for key "${key}"`);
|
|
229
228
|
}
|
|
230
|
-
return
|
|
229
|
+
return {
|
|
230
|
+
...found,
|
|
231
|
+
...extraConf,
|
|
231
232
|
type: found.type
|
|
232
|
-
}
|
|
233
|
+
};
|
|
233
234
|
}
|
|
234
235
|
function animationDelay(key, animation, defaultDelay) {
|
|
235
236
|
"worklet";
|
|
@@ -262,7 +263,7 @@ function getAnimation(key, animationConfig, animateOnly) {
|
|
|
262
263
|
return {};
|
|
263
264
|
}
|
|
264
265
|
let repeatCount = 0;
|
|
265
|
-
|
|
266
|
+
const repeatReverse = animationConfig.repeatReverse || false;
|
|
266
267
|
let animationType = (animationConfig == null ? void 0 : animationConfig.type) || "spring";
|
|
267
268
|
if (isColor(key) || key === "opacity") {
|
|
268
269
|
animationType = "timing";
|
|
@@ -287,7 +288,6 @@ function getAnimation(key, animationConfig, animateOnly) {
|
|
|
287
288
|
deceleration: 2
|
|
288
289
|
};
|
|
289
290
|
} else {
|
|
290
|
-
console.warn("no type of animation?", animationType);
|
|
291
291
|
animation = import_react_native_reanimated.withSpring;
|
|
292
292
|
}
|
|
293
293
|
return {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/createAnimations.tsx"],
|
|
4
|
-
"sourcesContent": ["import { PresenceContext, usePresence } from '@tamagui/animate-presence'\nimport { AnimationDriver, AnimationProp } from '@tamagui/core'\nimport { useCallback, useContext, useMemo } from 'react'\nimport Animated, {\n WithDecayConfig,\n WithSpringConfig,\n WithTimingConfig,\n runOnJS,\n useAnimatedStyle,\n withDecay,\n withDelay,\n withRepeat,\n withSpring,\n withTiming,\n} from 'react-native-reanimated'\n\ntype AnimationsConfig<A extends Object = any> = {\n [Key in keyof A]: AnimationConfig\n}\n\ntype AnimationConfig =\n | ({ type: 'timing'; loop?: number; repeat?: number; repeatReverse?: boolean } & WithTimingConfig)\n | ({ type: 'spring'; loop?: number; repeat?: number; repeatReverse?: boolean } & WithSpringConfig)\n | ({ type: 'decay'; loop?: number; repeat?: number; repeatReverse?: boolean } & WithDecayConfig)\n\nexport function createAnimations<A extends AnimationsConfig>(animations: A): AnimationDriver<A> {\n const AnimatedView = Animated.View\n const AnimatedText = Animated.Text\n\n AnimatedView['displayName'] = 'AnimatedView'\n AnimatedText['displayName'] = 'AnimatedText'\n\n return {\n avoidClasses: true,\n animations,\n View: AnimatedView,\n Text: AnimatedText,\n useAnimations: (props, helpers) => {\n const { pseudos, onDidAnimate, delay, getStyle, state, staticConfig } = helpers\n const [isPresent, sendExitComplete] = usePresence()\n const presence = useContext(PresenceContext)\n\n const exitStyle = presence?.exitVariant\n ? staticConfig.variantsParsed?.[presence.exitVariant]?.true || pseudos.exitStyle\n : pseudos.exitStyle\n\n const reanimatedOnDidAnimated = useCallback<NonNullable<typeof onDidAnimate>>(\n (...args) => {\n onDidAnimate?.(...args)\n },\n [onDidAnimate]\n )\n\n const isExiting = isPresent === false\n const isEntering = !state.mounted\n\n const all = getStyle({\n isExiting,\n isEntering,\n exitVariant: presence?.exitVariant,\n enterVariant: presence?.enterVariant,\n })\n\n const [animatedStyles, nonAnimatedStyle] = [{}, {}]\n const animatedStyleKey = {\n transform: true,\n opacity: true,\n }\n for (const key of Object.keys(all)) {\n if (animatedStyleKey[key]) {\n animatedStyles[key] = all[key]\n } else {\n nonAnimatedStyle[key] = all[key]\n }\n }\n\n const args = [\n JSON.stringify(all),\n state.mounted,\n state.hover,\n state.press,\n state.pressIn,\n state.focus,\n delay,\n isPresent,\n onDidAnimate,\n reanimatedOnDidAnimated,\n presence?.exitVariant,\n presence?.enterVariant,\n ]\n\n const callback = (\n isExiting: boolean,\n exitingStyleProps: Record<string, boolean>,\n key: string,\n value: any\n ) => {\n 'worklet'\n return (completed, current) => {\n 'worklet'\n runOnJS(reanimatedOnDidAnimated)(key, completed, current, {\n attemptedValue: value,\n })\n if (isExiting) {\n exitingStyleProps[key] = false\n const areStylesExiting = Object.values(exitingStyleProps).some(Boolean)\n // if this is true, then we've finished our exit animations\n if (!areStylesExiting) {\n if (sendExitComplete) {\n runOnJS(sendExitComplete)()\n }\n }\n }\n }\n }\n\n const animatedStyle = useAnimatedStyle(() => {\n 'worklet'\n const style = animatedStyles\n\n const final = {\n transform: [] as any[],\n }\n\n const isExiting = isPresent === false\n\n const exitingStyleProps: Record<string, boolean> = {}\n if (exitStyle) {\n for (const key in exitStyle) {\n if (key === 'transform') {\n for (const attr of exitStyle[key]) {\n const tkey = Object.keys(attr)[0]\n exitingStyleProps[tkey] = true\n }\n } else {\n exitingStyleProps[key] = true\n }\n }\n }\n\n for (const key in style) {\n const value = style[key]\n const animationConfig = getAnimationConfig(key, animations, props.animation)\n const { animation, config, shouldRepeat, repeatCount, repeatReverse } = getAnimation(\n key,\n animationConfig,\n props.animateOnly\n )\n\n let { delayMs = null } = animationDelay(key, animationConfig, delay)\n\n if (!animation) {\n console.warn('No animation for', key, 'in', style)\n continue\n }\n if (!config) {\n console.warn('No animation config for', key, 'in', style)\n continue\n }\n\n if (key === 'transform') {\n if (!Array.isArray(value)) {\n console.error(`Invalid transform value. Needs to be an array.`)\n continue\n }\n\n for (const transformObject of value) {\n const key = Object.keys(transformObject)[0]\n const transformValue = transformObject[key]\n let finalValue = animation(\n transformValue,\n config as any,\n callback(isExiting, exitingStyleProps, key, value)\n )\n if (shouldRepeat) {\n finalValue = withRepeat(finalValue, repeatCount, repeatReverse)\n }\n final['transform'].push({\n [key]: finalValue,\n })\n }\n continue\n }\n\n if (typeof value === 'object') {\n // shadows\n final[key] = {}\n for (const innerStyleKey of Object.keys(value || {})) {\n let finalValue = animation(\n value,\n config as any,\n callback(isExiting, exitingStyleProps, key, value)\n )\n if (shouldRepeat) {\n finalValue = withRepeat(finalValue, repeatCount, repeatReverse)\n }\n if (delayMs != null) {\n final[key][innerStyleKey] = withDelay(delayMs, finalValue)\n } else {\n final[key][innerStyleKey] = finalValue\n }\n }\n continue\n }\n\n let finalValue = animation(\n value,\n config as any,\n callback(isExiting, exitingStyleProps, key, value)\n )\n if (shouldRepeat) {\n finalValue = withRepeat(finalValue, repeatCount, repeatReverse)\n }\n if (delayMs != null && typeof delayMs === 'number') {\n final[key] = withDelay(delayMs, finalValue)\n } else {\n final[key] = finalValue\n }\n\n // end for (key in mergedStyles)\n }\n\n return final\n }, args)\n\n return useMemo(() => {\n return {\n style: [nonAnimatedStyle, animatedStyle],\n }\n }, args)\n },\n }\n}\n\nfunction getAnimationConfig(key: string, animations: AnimationsConfig, animation?: AnimationProp) {\n 'worklet'\n if (typeof animation === 'string') {\n return animations[animation]\n }\n let type = ''\n let extraConf: any\n if (Array.isArray(animation)) {\n type = animation[0] as string\n const conf = animation[1] && animation[1][key]\n if (conf) {\n if (typeof conf === 'string') {\n type = conf\n } else {\n type = (conf as any).type || type\n extraConf = conf\n }\n }\n } else {\n const val = animation?.[key]\n type = val?.type\n extraConf = val\n }\n const found = animations[type]\n if (!found) {\n throw new Error(`No animation of type \"${type}\" for key \"${key}\"`)\n }\n return {\n ...found,\n ...extraConf,\n type: found.type,\n }\n}\n\nfunction animationDelay(\n key: string,\n animation: AnimationConfig | undefined,\n defaultDelay?: number\n) {\n 'worklet'\n if (\n !animation ||\n !animation[key] ||\n animation[key].delayMs === undefined ||\n animation[key].delayMs === null\n ) {\n return {\n delayMs: null,\n }\n }\n return {\n delayMs: animation[key].delayMs as TransitionConfig['delay'],\n }\n}\n\ntype TransitionConfigWithoutRepeats = (\n | ({ type?: 'spring' } & WithSpringConfig)\n | ({ type: 'timing' } & WithTimingConfig)\n | ({ type: 'decay' } & WithDecayConfig)\n) & {\n delay?: number\n}\n\ntype TransitionConfig = TransitionConfigWithoutRepeats & {\n /**\n * Number of times this animation should repeat. To make it infinite, use the `loop` boolean.\n *\n * Default: `0`\n *\n * It's worth noting that this value isn't *exactly* a `repeat`. Instead, it uses Reanimated's `withRepeat` function under the hood, which repeats back to the **previous value**. If you want a repeated animation, I recommend setting it to `true` from the start, and make sure you have a `from` value.\n *\n * As a result, this value cannot be reliably changed on the fly. If you would like animations to repeat based on the `from` value, `repeat` must be a number when the component initializes. You can set it to `0` to stop it, but you won't be able to start it again. You might be better off using the sequence array API if you need to update its repetitiveness on the fly.\n */\n repeat?: number\n /**\n * Setting this to `true` is the same as `repeat: Infinity`\n *\n * Default: `false`\n *\n * Note: this value cannot be set on the fly. If you would like animations to repeat based on the `from` value, it must be `true` when the component initializes. You can set it to `false` to stop it, but you won't be able to start it again. You might be better off using the sequence array API if you need to update its repetitiveness on the fly.\n */\n loop?: boolean\n /**\n * Whether or not the animation repetition should alternate in direction.\n *\n * By default, this is `true`.\n *\n * If `false`, any animations with `loop` or `repeat` will not go back and forth. Instead, they will go from 0 -> 1, and again from 0 -> 1.\n *\n * If `true`, then animations will go 0 -> 1 -> 0.\n *\n * Setting this to `true` is like setting `animationDirection: alternate` in CSS.\n */\n repeatReverse?: boolean\n}\n\nconst isColor = (styleKey: string) => {\n 'worklet'\n return [\n 'backgroundColor',\n 'borderBottomColor',\n 'borderColor',\n 'borderEndColor',\n 'borderLeftColor',\n 'borderRightColor',\n 'borderStartColor',\n 'borderTopColor',\n 'color',\n ].includes(styleKey)\n}\n\nfunction getAnimation(\n key: string,\n animationConfig: AnimationConfig | undefined,\n animateOnly?: string[]\n) {\n 'worklet'\n if (!animationConfig || (animateOnly && !animateOnly.includes(key))) {\n return {}\n }\n\n let repeatCount = 0\n let repeatReverse = animationConfig.repeatReverse || false\n let animationType: Required<TransitionConfig>['type'] = animationConfig?.type || 'spring'\n\n if (isColor(key) || key === 'opacity') {\n animationType = 'timing'\n }\n\n if ('repeat' in animationConfig) {\n repeatCount = animationConfig.repeat || 0\n } else {\n if (animationConfig.loop) {\n repeatCount = animationConfig.loop ? -1 : 0\n }\n }\n\n let config = animationConfig\n let animation: typeof withTiming | typeof withSpring | typeof withDecay\n\n if (animationType === 'timing') {\n animation = withTiming\n } else if (animationType === 'spring') {\n animation = withSpring\n } else if (animationType === 'decay') {\n animation = withDecay\n config = config || {\n velocity: 2,\n deceleration: 2,\n }\n } else {\n console.warn('no type of animation?', animationType)\n animation = withSpring\n }\n\n return {\n animation,\n config,\n repeatReverse,\n repeatCount,\n shouldRepeat: !!repeatCount,\n }\n}\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
4
|
+
"sourcesContent": ["import { AnimationDriver, AnimationProp, useEvent } from '@tamagui/core'\nimport { PresenceContext, usePresence } from '@tamagui/use-presence'\nimport { useContext, useMemo } from 'react'\n// until we fix Sheet\nimport { FlatList, Animated as RNAnimated } from 'react-native'\nimport Animated, {\n WithDecayConfig,\n WithSpringConfig,\n WithTimingConfig,\n runOnJS,\n useAnimatedStyle,\n withDecay,\n withDelay,\n withRepeat,\n withSpring,\n withTiming,\n} from 'react-native-reanimated'\n\nimport {\n useAnimatedNumber,\n useAnimatedNumberReaction,\n useAnimatedNumberStyle,\n} from './useAnimatedNumber'\n\n// add nice warning for if mis-configured next config:\nif (process.env.NODE_ENV === 'development') {\n if (FlatList?.['_isProxyWorm']) {\n // eslint-disable-next-line no-console\n console.warn(\n `Using reanimated with excludeReactNativeWebExports including FlatList, adjust your next.config.js, reanimated currently doesn't support tree-shaking and needs *List components around.`\n )\n }\n}\n\ntype AnimationsConfig<A extends Object = any> = {\n [Key in keyof A]: AnimationConfig\n}\n\ntype AnimationConfig =\n | ({ type: 'timing'; loop?: number; repeat?: number; repeatReverse?: boolean } & WithTimingConfig)\n | ({ type: 'spring'; loop?: number; repeat?: number; repeatReverse?: boolean } & WithSpringConfig)\n | ({ type: 'decay'; loop?: number; repeat?: number; repeatReverse?: boolean } & WithDecayConfig)\n\nconst animatedStyleKey = {\n transform: true,\n opacity: true,\n // backgroundColor: true,\n // color: true,\n}\n\nexport function createAnimations<A extends AnimationsConfig>(animations: A): AnimationDriver<A> {\n const AnimatedView = Animated.View\n const AnimatedText = Animated.Text\n\n AnimatedView['displayName'] = 'AnimatedView'\n AnimatedText['displayName'] = 'AnimatedText'\n\n return {\n isReactNative: true,\n animations,\n View: AnimatedView,\n Text: AnimatedText,\n\n // temp\n // @ts-ignore\n NumberView: RNAnimated.View,\n\n useAnimatedNumber,\n useAnimatedNumberReaction,\n useAnimatedNumberStyle,\n usePresence,\n useAnimations: ({ props, style, presence, pseudos, onDidAnimate, delay }) => {\n const isExiting = presence?.[0] === false\n const sendExitComplete = presence?.[1]\n const reanimatedOnDidAnimated = useEvent<NonNullable<typeof onDidAnimate>>((...args) => {\n onDidAnimate?.(...args)\n })\n\n const all = style\n\n const [animatedStyles, nonAnimatedStyle] = [{}, {}]\n for (const key of Object.keys(all)) {\n if (animatedStyleKey[key]) {\n animatedStyles[key] = all[key]\n } else {\n nonAnimatedStyle[key] = all[key]\n }\n }\n\n const animatedString = JSON.stringify(animatedStyles)\n const key = animatedString // +\n // JSON.stringify([\n // state.unmounted,\n // state.hover,\n // state.press,\n // state.pressIn,\n // state.focus,\n // delay,\n // isPresent,\n // ])\n\n const callback = (\n isExiting: boolean,\n exitingStyleProps: Record<string, boolean>,\n key: string,\n value: any\n ) => {\n 'worklet'\n return (completed: boolean | undefined, current: any) => {\n 'worklet'\n runOnJS(reanimatedOnDidAnimated)(key, completed, current, {\n attemptedValue: value,\n })\n if (isExiting) {\n exitingStyleProps[key] = false\n const areStylesExiting = Object.values(exitingStyleProps).some(Boolean)\n // if this is true, then we've finished our exit animations\n if (!areStylesExiting) {\n if (sendExitComplete) {\n runOnJS(sendExitComplete)()\n }\n }\n }\n }\n }\n\n const animatedStyle = useAnimatedStyle(() => {\n 'worklet'\n\n // getting issues with native unless this :/\n const style = JSON.parse(animatedString)\n\n const final = {\n transform: [] as any[],\n }\n\n const exitingStyleProps: Record<string, boolean> = {}\n\n // TODO this needs various manual checks, untested\n // psuedos.exitStyle wont have the exitVariant on it unless we add that\n if (pseudos.exitStyle) {\n for (const key in pseudos.exitStyle) {\n if (key === 'transform') {\n const val = pseudos.exitStyle[key]\n if (val) {\n for (const attr of val) {\n const tkey = Object.keys(attr)[0]\n exitingStyleProps[tkey] = true\n }\n }\n } else {\n exitingStyleProps[key] = true\n }\n }\n }\n\n for (const key in style) {\n const value = style[key]\n const animationConfig = getAnimationConfig(key, animations, props.animation)\n const { animation, config, shouldRepeat, repeatCount, repeatReverse } = getAnimation(\n key,\n animationConfig,\n props.animateOnly\n )\n\n const { delayMs = null } = animationDelay(key, animationConfig, delay)\n\n if (!animation) {\n // eslint-disable-next-line no-console\n console.warn('No animation for', key, 'in', style)\n continue\n }\n if (!config) {\n // eslint-disable-next-line no-console\n console.warn('No animation config for', key, 'in', style)\n continue\n }\n\n if (key === 'transform') {\n if (!Array.isArray(value)) {\n // eslint-disable-next-line no-console\n console.error(`Invalid transform value. Needs to be an array.`)\n continue\n }\n\n for (const transformObject of value) {\n const key = Object.keys(transformObject)[0]\n const transformValue = transformObject[key]\n let finalValue = animation(\n transformValue,\n config as any,\n callback(isExiting, exitingStyleProps, key, value)\n )\n if (shouldRepeat) {\n finalValue = withRepeat(finalValue, repeatCount, repeatReverse)\n }\n final['transform'].push({\n [key]: finalValue,\n })\n }\n continue\n }\n\n if (typeof value === 'object') {\n // shadows\n final[key] = {}\n for (const innerStyleKey of Object.keys(value || {})) {\n let finalValue = animation(\n value,\n config as any,\n callback(isExiting, exitingStyleProps, key, value)\n )\n if (shouldRepeat) {\n finalValue = withRepeat(finalValue, repeatCount, repeatReverse)\n }\n if (delayMs != null) {\n final[key][innerStyleKey] = withDelay(delayMs, finalValue)\n } else {\n final[key][innerStyleKey] = finalValue\n }\n }\n continue\n }\n\n let finalValue = animation(\n value,\n config as any,\n callback(isExiting, exitingStyleProps, key, value)\n )\n if (shouldRepeat) {\n finalValue = withRepeat(finalValue, repeatCount, repeatReverse)\n }\n if (delayMs != null && typeof delayMs === 'number') {\n final[key] = withDelay(delayMs, finalValue)\n } else {\n final[key] = finalValue\n }\n\n // end for (key in mergedStyles)\n }\n\n return final\n }, [key])\n\n return useMemo(() => {\n return {\n style: [nonAnimatedStyle, animatedStyle],\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [key])\n },\n }\n}\n\nfunction getAnimationConfig(key: string, animations: AnimationsConfig, animation?: AnimationProp) {\n 'worklet'\n if (typeof animation === 'string') {\n return animations[animation]\n }\n let type = ''\n let extraConf: any\n if (Array.isArray(animation)) {\n type = animation[0] as string\n const conf = animation[1] && animation[1][key]\n if (conf) {\n if (typeof conf === 'string') {\n type = conf\n } else {\n type = (conf as any).type || type\n extraConf = conf\n }\n }\n } else {\n const val = animation?.[key]\n type = val?.type\n extraConf = val\n }\n const found = animations[type]\n if (!found) {\n throw new Error(`No animation of type \"${type}\" for key \"${key}\"`)\n }\n return {\n ...found,\n ...extraConf,\n type: found.type,\n }\n}\n\nfunction animationDelay(\n key: string,\n animation: AnimationConfig | undefined,\n defaultDelay?: number\n) {\n 'worklet'\n if (\n !animation ||\n !animation[key] ||\n animation[key].delayMs === undefined ||\n animation[key].delayMs === null\n ) {\n return {\n delayMs: null,\n }\n }\n return {\n delayMs: animation[key].delayMs as TransitionConfig['delay'],\n }\n}\n\ntype TransitionConfigWithoutRepeats = (\n | ({ type?: 'spring' } & WithSpringConfig)\n | ({ type: 'timing' } & WithTimingConfig)\n | ({ type: 'decay' } & WithDecayConfig)\n) & {\n delay?: number\n}\n\ntype TransitionConfig = TransitionConfigWithoutRepeats & {\n /**\n * Number of times this animation should repeat. To make it infinite, use the `loop` boolean.\n *\n * Default: `0`\n *\n * It's worth noting that this value isn't *exactly* a `repeat`. Instead, it uses Reanimated's `withRepeat` function under the hood, which repeats back to the **previous value**. If you want a repeated animation, I recommend setting it to `true` from the start, and make sure you have a `from` value.\n *\n * As a result, this value cannot be reliably changed on the fly. If you would like animations to repeat based on the `from` value, `repeat` must be a number when the component initializes. You can set it to `0` to stop it, but you won't be able to start it again. You might be better off using the sequence array API if you need to update its repetitiveness on the fly.\n */\n repeat?: number\n /**\n * Setting this to `true` is the same as `repeat: Infinity`\n *\n * Default: `false`\n *\n * Note: this value cannot be set on the fly. If you would like animations to repeat based on the `from` value, it must be `true` when the component initializes. You can set it to `false` to stop it, but you won't be able to start it again. You might be better off using the sequence array API if you need to update its repetitiveness on the fly.\n */\n loop?: boolean\n /**\n * Whether or not the animation repetition should alternate in direction.\n *\n * By default, this is `true`.\n *\n * If `false`, any animations with `loop` or `repeat` will not go back and forth. Instead, they will go from 0 -> 1, and again from 0 -> 1.\n *\n * If `true`, then animations will go 0 -> 1 -> 0.\n *\n * Setting this to `true` is like setting `animationDirection: alternate` in CSS.\n */\n repeatReverse?: boolean\n}\n\nconst isColor = (styleKey: string) => {\n 'worklet'\n return [\n 'backgroundColor',\n 'borderBottomColor',\n 'borderColor',\n 'borderEndColor',\n 'borderLeftColor',\n 'borderRightColor',\n 'borderStartColor',\n 'borderTopColor',\n 'color',\n ].includes(styleKey)\n}\n\nfunction getAnimation(\n key: string,\n animationConfig: AnimationConfig | undefined,\n animateOnly?: string[]\n) {\n 'worklet'\n if (!animationConfig || (animateOnly && !animateOnly.includes(key))) {\n return {}\n }\n\n let repeatCount = 0\n const repeatReverse = animationConfig.repeatReverse || false\n let animationType: Required<TransitionConfig>['type'] = animationConfig?.type || 'spring'\n\n if (isColor(key) || key === 'opacity') {\n animationType = 'timing'\n }\n\n if ('repeat' in animationConfig) {\n repeatCount = animationConfig.repeat || 0\n } else {\n if (animationConfig.loop) {\n repeatCount = animationConfig.loop ? -1 : 0\n }\n }\n\n let config = animationConfig\n let animation: typeof withTiming | typeof withSpring | typeof withDecay\n\n if (animationType === 'timing') {\n animation = withTiming\n } else if (animationType === 'spring') {\n animation = withSpring\n } else if (animationType === 'decay') {\n animation = withDecay\n config = config || {\n velocity: 2,\n deceleration: 2,\n }\n } else {\n animation = withSpring\n }\n\n return {\n animation,\n config,\n repeatReverse,\n repeatCount,\n shouldRepeat: !!repeatCount,\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["Animated", "RNAnimated", "key", "isExiting", "style", "finalValue"]
|
|
7
7
|
}
|
package/dist/cjs/index.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
var __defProp = Object.defineProperty;
|
|
2
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
4
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
@@ -16,4 +17,5 @@ var src_exports = {};
|
|
|
16
17
|
module.exports = __toCommonJS(src_exports);
|
|
17
18
|
var import_polyfill = require("./polyfill");
|
|
18
19
|
__reExport(src_exports, require("./createAnimations"), module.exports);
|
|
20
|
+
__reExport(src_exports, require("./useAnimatedNumber"), module.exports);
|
|
19
21
|
//# sourceMappingURL=index.js.map
|
package/dist/cjs/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import './polyfill'\n\nexport * from './createAnimations'\n"],
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import './polyfill'\n\nexport * from './createAnimations'\nexport * from './useAnimatedNumber'\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,sBAAO;AAEP,wBAAc,+BAFd;AAGA,wBAAc,gCAHd;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/polyfill.js
CHANGED
package/dist/cjs/polyfill.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/polyfill.ts"],
|
|
4
4
|
"sourcesContent": ["// for SSR\nif (typeof requestAnimationFrame === 'undefined') {\n globalThis['requestAnimationFrame'] = setImmediate\n}\n"],
|
|
5
|
-
"mappings": "AACA,IAAI,OAAO,0BAA0B,aAAa;AAChD,aAAW,2BAA2B;AACxC;",
|
|
5
|
+
"mappings": ";AACA,IAAI,OAAO,0BAA0B,aAAa;AAChD,aAAW,2BAA2B;AACxC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
var useAnimatedNumber_exports = {};
|
|
20
|
+
__export(useAnimatedNumber_exports, {
|
|
21
|
+
useAnimatedNumber: () => import_animations_react_native.useAnimatedNumber,
|
|
22
|
+
useAnimatedNumberReaction: () => import_animations_react_native.useAnimatedNumberReaction,
|
|
23
|
+
useAnimatedNumberStyle: () => import_animations_react_native.useAnimatedNumberStyle
|
|
24
|
+
});
|
|
25
|
+
module.exports = __toCommonJS(useAnimatedNumber_exports);
|
|
26
|
+
var import_animations_react_native = require("@tamagui/animations-react-native");
|
|
27
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
28
|
+
0 && (module.exports = {
|
|
29
|
+
useAnimatedNumber,
|
|
30
|
+
useAnimatedNumberReaction,
|
|
31
|
+
useAnimatedNumberStyle
|
|
32
|
+
});
|
|
33
|
+
//# sourceMappingURL=useAnimatedNumber.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/useAnimatedNumber.tsx"],
|
|
4
|
+
"sourcesContent": ["// there's some bug with reanimated likely related to worklets\n// for now to not regress, we require react-native Animated alongside\nexport {\n useAnimatedNumber,\n useAnimatedNumberStyle,\n useAnimatedNumberReaction,\n} from '@tamagui/animations-react-native'\n\n// import { UniversalAnimatedNumber } from '@tamagui/core'\n// import {\n// SharedValue,\n// cancelAnimation,\n// useAnimatedReaction,\n// useAnimatedStyle,\n// useSharedValue,\n// withSpring,\n// withTiming,\n// } from 'react-native-reanimated'\n\n// type ReanimatedAnimatedNumber = SharedValue<number>\n\n// export function useAnimatedNumber(\n// initial: number\n// ): UniversalAnimatedNumber<ReanimatedAnimatedNumber> {\n// const val = useSharedValue(initial)\n// return {\n// getInstance() {\n// return val\n// },\n// getValue() {\n// return val.value\n// },\n// stop() {\n// cancelAnimation(val)\n// },\n// setValue(next: number, config = { type: 'spring' }) {\n// if (config.type === 'direct') {\n// val.value = next\n// } else if (config.type === 'spring') {\n// val.value = withSpring(next, config)\n// } else {\n// val.value = withTiming(next, config)\n// }\n// },\n// }\n// }\n\n// export function useAnimatedNumberReaction(\n// value: UniversalAnimatedNumber<ReanimatedAnimatedNumber>,\n// cb: (current: number) => void\n// ) {\n// useAnimatedReaction(\n// () => {\n// 'worklet'\n// return value.getValue()\n// },\n// (result, prev) => {\n// 'worklet'\n// if (result !== prev) cb(result)\n// },\n// [value]\n// )\n// }\n\n// export function useAnimatedNumberStyle<V extends UniversalAnimatedNumber<ReanimatedAnimatedNumber>>(\n// value: V,\n// getStyle: (value: number) => any\n// ) {\n// return useAnimatedStyle(() => {\n// 'worklet'\n// return getStyle(value.getValue())\n// })\n// }\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,qCAIO;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|