@tamagui/animations-react-native 1.0.1-beta.192 → 1.0.1-beta.194
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 +117 -97
- package/dist/cjs/createAnimations.js.map +3 -3
- package/dist/esm/createAnimations.js +118 -97
- package/dist/esm/createAnimations.js.map +3 -3
- package/dist/jsx/createAnimations.js +113 -96
- package/dist/jsx/createAnimations.js.map +3 -3
- package/package.json +4 -4
- package/src/createAnimations.tsx +122 -103
|
@@ -26,8 +26,8 @@ __export(createAnimations_exports, {
|
|
|
26
26
|
useAnimatedNumberStyle: () => useAnimatedNumberStyle
|
|
27
27
|
});
|
|
28
28
|
module.exports = __toCommonJS(createAnimations_exports);
|
|
29
|
-
var import_animate_presence = require("@tamagui/animate-presence");
|
|
30
29
|
var import_core = require("@tamagui/core");
|
|
30
|
+
var import_use_presence = require("@tamagui/use-presence");
|
|
31
31
|
var import_react = require("react");
|
|
32
32
|
var import_react_native = require("react-native");
|
|
33
33
|
const animatedStyleKey = {
|
|
@@ -37,7 +37,7 @@ const animatedStyleKey = {
|
|
|
37
37
|
const AnimatedView = import_react_native.Animated.View;
|
|
38
38
|
const AnimatedText = import_react_native.Animated.Text;
|
|
39
39
|
function useAnimatedNumber(initial) {
|
|
40
|
-
const state = (0,
|
|
40
|
+
const state = (0, import_core.useSafeRef)(
|
|
41
41
|
null
|
|
42
42
|
);
|
|
43
43
|
if (!state.current) {
|
|
@@ -104,7 +104,7 @@ function createAnimations(animations) {
|
|
|
104
104
|
AnimatedView["displayName"] = "AnimatedView";
|
|
105
105
|
AnimatedText["displayName"] = "AnimatedText";
|
|
106
106
|
return {
|
|
107
|
-
|
|
107
|
+
isReactNativeWeb: true,
|
|
108
108
|
animations,
|
|
109
109
|
View: AnimatedView,
|
|
110
110
|
Text: AnimatedText,
|
|
@@ -112,10 +112,9 @@ function createAnimations(animations) {
|
|
|
112
112
|
useAnimatedNumberReaction,
|
|
113
113
|
useAnimatedNumberStyle,
|
|
114
114
|
useAnimations: (props, helpers) => {
|
|
115
|
-
var _a;
|
|
116
115
|
const { onDidAnimate, delay, getStyle, state } = helpers;
|
|
117
|
-
const [isPresent, sendExitComplete] = (0,
|
|
118
|
-
const presence = (0, import_react.useContext)(
|
|
116
|
+
const [isPresent, sendExitComplete] = (0, import_use_presence.usePresence)();
|
|
117
|
+
const presence = (0, import_react.useContext)(import_use_presence.PresenceContext);
|
|
119
118
|
const isExiting = isPresent === false;
|
|
120
119
|
const isEntering = !state.mounted;
|
|
121
120
|
const all = getStyle({
|
|
@@ -124,87 +123,13 @@ function createAnimations(animations) {
|
|
|
124
123
|
exitVariant: presence == null ? void 0 : presence.exitVariant,
|
|
125
124
|
enterVariant: presence == null ? void 0 : presence.enterVariant
|
|
126
125
|
});
|
|
127
|
-
const animateStyles = (0,
|
|
128
|
-
const animatedTranforms = (0,
|
|
129
|
-
const interpolations = (0,
|
|
126
|
+
const animateStyles = (0, import_core.useSafeRef)({});
|
|
127
|
+
const animatedTranforms = (0, import_core.useSafeRef)([]);
|
|
128
|
+
const interpolations = (0, import_core.useSafeRef)(
|
|
129
|
+
/* @__PURE__ */ new WeakMap()
|
|
130
|
+
);
|
|
130
131
|
const runners = [];
|
|
131
132
|
const completions = [];
|
|
132
|
-
function update(key, animated, valIn) {
|
|
133
|
-
const [val, type] = getValue(valIn);
|
|
134
|
-
const value = animated || new import_react_native.Animated.Value(val);
|
|
135
|
-
if (type) {
|
|
136
|
-
interpolations.current.set(value, getInterpolated(value, type, val));
|
|
137
|
-
}
|
|
138
|
-
if (animated) {
|
|
139
|
-
const animationConfig = getAnimationConfig(key, animations, props.animation);
|
|
140
|
-
let resolve;
|
|
141
|
-
const promise = new Promise((res) => {
|
|
142
|
-
resolve = res;
|
|
143
|
-
});
|
|
144
|
-
completions.push(promise);
|
|
145
|
-
runners.push(() => {
|
|
146
|
-
if (animated["_value"] === val) {
|
|
147
|
-
resolve();
|
|
148
|
-
return;
|
|
149
|
-
}
|
|
150
|
-
animated.stopAnimation();
|
|
151
|
-
import_react_native.Animated.spring(animated, {
|
|
152
|
-
toValue: val,
|
|
153
|
-
useNativeDriver: !import_core.isWeb,
|
|
154
|
-
...animationConfig
|
|
155
|
-
}).start(({ finished }) => {
|
|
156
|
-
if (finished) {
|
|
157
|
-
resolve();
|
|
158
|
-
}
|
|
159
|
-
});
|
|
160
|
-
});
|
|
161
|
-
}
|
|
162
|
-
return value;
|
|
163
|
-
}
|
|
164
|
-
function getValue(input) {
|
|
165
|
-
if (typeof input !== "string") {
|
|
166
|
-
return [input];
|
|
167
|
-
}
|
|
168
|
-
const neg = input[0] === "-";
|
|
169
|
-
if (neg)
|
|
170
|
-
input = input.slice(1);
|
|
171
|
-
const [_, number, after] = input.match(/([-0-9]+)(deg|%)/) ?? [];
|
|
172
|
-
return [+number * (neg ? -1 : 1), after];
|
|
173
|
-
}
|
|
174
|
-
const nonAnimatedStyle = {};
|
|
175
|
-
for (const key in all) {
|
|
176
|
-
const val = all[key];
|
|
177
|
-
if (animatedStyleKey[key]) {
|
|
178
|
-
if (key === "transform") {
|
|
179
|
-
if (val) {
|
|
180
|
-
for (const [index, transform] of val.entries()) {
|
|
181
|
-
if (!transform)
|
|
182
|
-
continue;
|
|
183
|
-
const tkey = Object.keys(transform)[0];
|
|
184
|
-
animatedTranforms.current[index] = {
|
|
185
|
-
[tkey]: update(tkey, (_a = animatedTranforms.current[index]) == null ? void 0 : _a[tkey], transform[tkey])
|
|
186
|
-
};
|
|
187
|
-
}
|
|
188
|
-
}
|
|
189
|
-
} else {
|
|
190
|
-
animateStyles.current[key] = update(key, animateStyles.current[key], val);
|
|
191
|
-
}
|
|
192
|
-
} else {
|
|
193
|
-
nonAnimatedStyle[key] = val;
|
|
194
|
-
}
|
|
195
|
-
}
|
|
196
|
-
const animatedStyle = {
|
|
197
|
-
...Object.fromEntries(
|
|
198
|
-
Object.entries({
|
|
199
|
-
...animateStyles.current
|
|
200
|
-
}).map(([k, v]) => [k, interpolations.current.get(v) || v])
|
|
201
|
-
),
|
|
202
|
-
transform: animatedTranforms.current.map((r) => {
|
|
203
|
-
const key = Object.keys(r)[0];
|
|
204
|
-
const val = interpolations.current.get(r[key]) || r[key];
|
|
205
|
-
return { [key]: val };
|
|
206
|
-
})
|
|
207
|
-
};
|
|
208
133
|
const args = [
|
|
209
134
|
JSON.stringify(all),
|
|
210
135
|
state.mounted,
|
|
@@ -218,6 +143,93 @@ function createAnimations(animations) {
|
|
|
218
143
|
presence == null ? void 0 : presence.exitVariant,
|
|
219
144
|
presence == null ? void 0 : presence.enterVariant
|
|
220
145
|
];
|
|
146
|
+
const res = (0, import_react.useMemo)(() => {
|
|
147
|
+
var _a;
|
|
148
|
+
function update(key, animated, valIn) {
|
|
149
|
+
const [val, type] = getValue(valIn);
|
|
150
|
+
const value = animated || new import_react_native.Animated.Value(val);
|
|
151
|
+
let interpolateArgs;
|
|
152
|
+
if (type) {
|
|
153
|
+
const curInterpolation = interpolations.current.get(value);
|
|
154
|
+
interpolateArgs = getInterpolated(
|
|
155
|
+
(curInterpolation == null ? void 0 : curInterpolation.current) ?? value["_value"],
|
|
156
|
+
val,
|
|
157
|
+
type
|
|
158
|
+
);
|
|
159
|
+
interpolations.current.set(value, {
|
|
160
|
+
interopolation: value.interpolate(interpolateArgs),
|
|
161
|
+
current: val
|
|
162
|
+
});
|
|
163
|
+
}
|
|
164
|
+
if (animated) {
|
|
165
|
+
const animationConfig = getAnimationConfig(key, animations, props.animation);
|
|
166
|
+
let resolve;
|
|
167
|
+
const promise = new Promise((res2) => {
|
|
168
|
+
resolve = res2;
|
|
169
|
+
});
|
|
170
|
+
completions.push(promise);
|
|
171
|
+
runners.push(() => {
|
|
172
|
+
animated.stopAnimation();
|
|
173
|
+
import_react_native.Animated.spring(animated, {
|
|
174
|
+
toValue: val,
|
|
175
|
+
useNativeDriver: !import_core.isWeb,
|
|
176
|
+
...animationConfig
|
|
177
|
+
}).start(({ finished }) => {
|
|
178
|
+
if (finished) {
|
|
179
|
+
resolve();
|
|
180
|
+
}
|
|
181
|
+
});
|
|
182
|
+
});
|
|
183
|
+
}
|
|
184
|
+
if (process.env.NODE_ENV === "development") {
|
|
185
|
+
if (props["debug"]) {
|
|
186
|
+
console.log("AnimatedValue", key, "mapped value", valIn, "of type", type, "to", val, "interpolated", interpolateArgs, "- current Animated.Value", value["_value"]);
|
|
187
|
+
}
|
|
188
|
+
}
|
|
189
|
+
return value;
|
|
190
|
+
}
|
|
191
|
+
const nonAnimatedStyle = {};
|
|
192
|
+
for (const key in all) {
|
|
193
|
+
const val = all[key];
|
|
194
|
+
if (animatedStyleKey[key]) {
|
|
195
|
+
if (key === "transform") {
|
|
196
|
+
if (val) {
|
|
197
|
+
for (const [index, transform] of val.entries()) {
|
|
198
|
+
if (!transform)
|
|
199
|
+
continue;
|
|
200
|
+
const tkey = Object.keys(transform)[0];
|
|
201
|
+
animatedTranforms.current[index] = {
|
|
202
|
+
[tkey]: update(tkey, (_a = animatedTranforms.current[index]) == null ? void 0 : _a[tkey], transform[tkey])
|
|
203
|
+
};
|
|
204
|
+
}
|
|
205
|
+
}
|
|
206
|
+
} else {
|
|
207
|
+
animateStyles.current[key] = update(key, animateStyles.current[key], val);
|
|
208
|
+
}
|
|
209
|
+
} else {
|
|
210
|
+
nonAnimatedStyle[key] = val;
|
|
211
|
+
}
|
|
212
|
+
}
|
|
213
|
+
const animatedStyle = {
|
|
214
|
+
...Object.fromEntries(
|
|
215
|
+
Object.entries({
|
|
216
|
+
...animateStyles.current
|
|
217
|
+
}).map(([k, v]) => {
|
|
218
|
+
var _a2;
|
|
219
|
+
return [k, ((_a2 = interpolations.current.get(v)) == null ? void 0 : _a2.interopolation) || v];
|
|
220
|
+
})
|
|
221
|
+
),
|
|
222
|
+
transform: animatedTranforms.current.map((r) => {
|
|
223
|
+
var _a2;
|
|
224
|
+
const key = Object.keys(r)[0];
|
|
225
|
+
const val = ((_a2 = interpolations.current.get(r[key])) == null ? void 0 : _a2.interopolation) || r[key];
|
|
226
|
+
return { [key]: val };
|
|
227
|
+
})
|
|
228
|
+
};
|
|
229
|
+
return {
|
|
230
|
+
style: [nonAnimatedStyle, animatedStyle]
|
|
231
|
+
};
|
|
232
|
+
}, args);
|
|
221
233
|
(0, import_core.useIsomorphicLayoutEffect)(() => {
|
|
222
234
|
for (const runner of runners) {
|
|
223
235
|
runner();
|
|
@@ -229,26 +241,24 @@ function createAnimations(animations) {
|
|
|
229
241
|
}
|
|
230
242
|
});
|
|
231
243
|
}, args);
|
|
232
|
-
return
|
|
233
|
-
return {
|
|
234
|
-
style: [nonAnimatedStyle, animatedStyle]
|
|
235
|
-
};
|
|
236
|
-
}, args);
|
|
244
|
+
return res;
|
|
237
245
|
}
|
|
238
246
|
};
|
|
239
247
|
}
|
|
240
|
-
function getInterpolated(
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
248
|
+
function getInterpolated(current, next, postfix = "deg") {
|
|
249
|
+
if (next === current) {
|
|
250
|
+
current = next - 1e-9;
|
|
251
|
+
}
|
|
252
|
+
const inputRange = [current, next];
|
|
253
|
+
const outputRange = [`${current}${postfix}`, `${next}${postfix}`];
|
|
254
|
+
if (next < current) {
|
|
245
255
|
inputRange.reverse();
|
|
246
256
|
outputRange.reverse();
|
|
247
257
|
}
|
|
248
|
-
return
|
|
258
|
+
return {
|
|
249
259
|
inputRange,
|
|
250
260
|
outputRange
|
|
251
|
-
}
|
|
261
|
+
};
|
|
252
262
|
}
|
|
253
263
|
function getAnimationConfig(key, animations, animation) {
|
|
254
264
|
if (typeof animation === "string") {
|
|
@@ -281,6 +291,16 @@ function getAnimationConfig(key, animations, animation) {
|
|
|
281
291
|
...extraConf
|
|
282
292
|
};
|
|
283
293
|
}
|
|
294
|
+
function getValue(input) {
|
|
295
|
+
if (typeof input !== "string") {
|
|
296
|
+
return [input];
|
|
297
|
+
}
|
|
298
|
+
const neg = input[0] === "-";
|
|
299
|
+
if (neg)
|
|
300
|
+
input = input.slice(1);
|
|
301
|
+
const [_, number, after] = input.match(/([-0-9]+)(deg|%)/) ?? [];
|
|
302
|
+
return [+number * (neg ? -1 : 1), after];
|
|
303
|
+
}
|
|
284
304
|
// Annotate the CommonJS export names for ESM import in node:
|
|
285
305
|
0 && (module.exports = {
|
|
286
306
|
AnimatedText,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/createAnimations.tsx"],
|
|
4
|
-
"sourcesContent": ["import {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,
|
|
6
|
-
"names": []
|
|
4
|
+
"sourcesContent": ["import {\n AnimatedNumberStrategy,\n AnimationDriver,\n AnimationProp,\n UniversalAnimatedNumber,\n isWeb,\n useEvent,\n useIsomorphicLayoutEffect,\n useSafeRef,\n} from '@tamagui/core'\nimport { PresenceContext, usePresence } from '@tamagui/use-presence'\nimport { useContext, useEffect, useMemo, useRef } from 'react'\nimport { Animated } from 'react-native'\n\ntype AnimationsConfig<A extends Object = any> = {\n [Key in keyof A]: AnimationConfig\n}\n\ntype AnimationConfig = Partial<\n Pick<\n Animated.SpringAnimationConfig,\n | 'delay'\n | 'bounciness'\n | 'damping'\n | 'friction'\n | 'mass'\n | 'overshootClamping'\n | 'speed'\n | 'stiffness'\n | 'tension'\n | 'velocity'\n >\n>\n\nconst animatedStyleKey = {\n transform: true,\n opacity: true,\n}\n\nexport const AnimatedView = Animated.View\nexport const AnimatedText = Animated.Text\n\nexport function useAnimatedNumber(initial: number): UniversalAnimatedNumber<Animated.Value> {\n const state = useSafeRef(\n null as any as {\n val: Animated.Value\n composite: Animated.CompositeAnimation | null\n strategy: AnimatedNumberStrategy\n }\n )\n if (!state.current) {\n state.current = {\n composite: null,\n val: new Animated.Value(initial),\n strategy: { type: 'spring' },\n }\n }\n\n return {\n getInstance() {\n return state.current.val\n },\n getValue() {\n return state.current.val['_value']\n },\n stop() {\n state.current.composite?.stop()\n state.current.composite = null\n },\n setValue(next: number, { type, ...config } = { type: 'spring' }) {\n const val = state.current.val\n if (type === 'direct') {\n val.setValue(next)\n } else if (type === 'spring') {\n state.current.composite?.stop()\n const composite = Animated.spring(val, {\n ...config,\n toValue: next,\n useNativeDriver: !isWeb,\n })\n composite.start()\n state.current.composite = composite\n } else {\n state.current.composite?.stop()\n const composite = Animated.timing(val, {\n ...config,\n toValue: next,\n useNativeDriver: !isWeb,\n })\n composite.start()\n state.current.composite = composite\n }\n },\n }\n}\n\nexport function useAnimatedNumberReaction(\n value: UniversalAnimatedNumber<Animated.Value>,\n cb: (current: number) => void\n) {\n const onChange = useEvent((current) => {\n cb(current.value)\n })\n\n useEffect(() => {\n const id = value.getInstance().addListener(onChange)\n return () => {\n value.getInstance().removeListener(id)\n }\n }, [value, onChange])\n}\n\nexport function useAnimatedNumberStyle<V extends UniversalAnimatedNumber<Animated.Value>>(\n value: V,\n getStyle: (value: any) => any\n) {\n return getStyle(value.getInstance())\n}\n\nexport function createAnimations<A extends AnimationsConfig>(animations: A): AnimationDriver<A> {\n AnimatedView['displayName'] = 'AnimatedView'\n AnimatedText['displayName'] = 'AnimatedText'\n\n return {\n isReactNativeWeb: true,\n animations,\n View: AnimatedView,\n Text: AnimatedText,\n useAnimatedNumber,\n useAnimatedNumberReaction,\n useAnimatedNumberStyle,\n useAnimations: (props, helpers) => {\n const { onDidAnimate, delay, getStyle, state } = 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 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 animateStyles = useSafeRef<Record<string, Animated.Value>>({})\n const animatedTranforms = useSafeRef<{ [key: string]: Animated.Value }[]>([])\n const interpolations = useSafeRef(\n new WeakMap<\n Animated.Value,\n { interopolation: Animated.AnimatedInterpolation; current?: number }\n >()\n )\n\n const runners: Function[] = []\n const completions: Promise<void>[] = []\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 presence?.exitVariant,\n presence?.enterVariant,\n ]\n\n const res = useMemo(() => {\n function update(key: string, animated: Animated.Value | undefined, valIn: string | number) {\n const [val, type] = getValue(valIn)\n const value = animated || new Animated.Value(val)\n let interpolateArgs: any\n if (type) {\n const curInterpolation = interpolations.current.get(value)\n interpolateArgs = getInterpolated(\n curInterpolation?.current ?? value['_value'],\n val,\n type\n )\n interpolations.current!.set(value, {\n interopolation: value.interpolate(interpolateArgs),\n current: val,\n })\n }\n if (animated) {\n const animationConfig = getAnimationConfig(key, animations, props.animation)\n\n let resolve\n const promise = new Promise<void>((res) => {\n resolve = res\n })\n completions.push(promise)\n\n runners.push(() => {\n animated.stopAnimation()\n Animated.spring(animated, {\n toValue: val,\n useNativeDriver: !isWeb,\n ...animationConfig,\n }).start(({ finished }) => {\n if (finished) {\n resolve()\n }\n })\n })\n }\n if (process.env.NODE_ENV === 'development') {\n if (props['debug']) {\n // prettier-ignore\n // eslint-disable-next-line no-console\n console.log('AnimatedValue', key, 'mapped value', valIn, 'of type', type, 'to', val, 'interpolated', interpolateArgs, '- current Animated.Value', value['_value'])\n }\n }\n return value\n }\n\n const nonAnimatedStyle = {}\n for (const key in all) {\n const val = all[key]\n if (animatedStyleKey[key]) {\n if (key === 'transform') {\n // for now just support one transform key\n if (val) {\n for (const [index, transform] of val.entries()) {\n if (!transform) continue\n const tkey = Object.keys(transform)[0]\n animatedTranforms.current[index] = {\n [tkey]: update(tkey, animatedTranforms.current[index]?.[tkey], transform[tkey]),\n }\n }\n }\n } else {\n animateStyles.current[key] = update(key, animateStyles.current[key], val)\n }\n } else {\n nonAnimatedStyle[key] = val\n }\n }\n\n const animatedStyle = {\n ...Object.fromEntries(\n Object.entries({\n ...animateStyles.current,\n }).map(([k, v]) => [k, interpolations.current!.get(v)?.interopolation || v])\n ),\n transform: animatedTranforms.current.map((r) => {\n const key = Object.keys(r)[0]\n const val = interpolations.current!.get(r[key])?.interopolation || r[key]\n return { [key]: val }\n }),\n }\n\n return {\n style: [nonAnimatedStyle, animatedStyle],\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, args)\n\n useIsomorphicLayoutEffect(() => {\n for (const runner of runners) {\n runner()\n }\n Promise.all(completions).then(() => {\n onDidAnimate?.()\n if (isExiting) {\n sendExitComplete?.()\n }\n })\n }, args)\n\n return res\n },\n }\n}\n\nfunction getInterpolated(current: number, next: number, postfix = 'deg') {\n if (next === current) {\n current = next - 0.000000001\n }\n const inputRange = [current, next]\n const outputRange = [`${current}${postfix}`, `${next}${postfix}`]\n if (next < current) {\n inputRange.reverse()\n outputRange.reverse()\n }\n return {\n inputRange,\n outputRange,\n }\n}\n\nfunction getAnimationConfig(key: string, animations: AnimationsConfig, animation?: AnimationProp) {\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 }\n}\n\nfunction getValue(input: number | string) {\n if (typeof input !== 'string') {\n return [input] as const\n }\n const neg = input[0] === '-'\n if (neg) input = input.slice(1)\n const [_, number, after] = input.match(/([-0-9]+)(deg|%)/) ?? []\n return [+number * (neg ? -1 : 1), after] as const\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["res", "_a"]
|
|
7
7
|
}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
|
-
import { PresenceContext, usePresence } from "@tamagui/animate-presence";
|
|
2
1
|
import {
|
|
3
2
|
isWeb,
|
|
4
3
|
useEvent,
|
|
5
|
-
useIsomorphicLayoutEffect
|
|
4
|
+
useIsomorphicLayoutEffect,
|
|
5
|
+
useSafeRef
|
|
6
6
|
} from "@tamagui/core";
|
|
7
|
-
import {
|
|
7
|
+
import { PresenceContext, usePresence } from "@tamagui/use-presence";
|
|
8
|
+
import { useContext, useEffect, useMemo } from "react";
|
|
8
9
|
import { Animated } from "react-native";
|
|
9
10
|
const animatedStyleKey = {
|
|
10
11
|
transform: true,
|
|
@@ -13,7 +14,7 @@ const animatedStyleKey = {
|
|
|
13
14
|
const AnimatedView = Animated.View;
|
|
14
15
|
const AnimatedText = Animated.Text;
|
|
15
16
|
function useAnimatedNumber(initial) {
|
|
16
|
-
const state =
|
|
17
|
+
const state = useSafeRef(
|
|
17
18
|
null
|
|
18
19
|
);
|
|
19
20
|
if (!state.current) {
|
|
@@ -80,7 +81,7 @@ function createAnimations(animations) {
|
|
|
80
81
|
AnimatedView["displayName"] = "AnimatedView";
|
|
81
82
|
AnimatedText["displayName"] = "AnimatedText";
|
|
82
83
|
return {
|
|
83
|
-
|
|
84
|
+
isReactNativeWeb: true,
|
|
84
85
|
animations,
|
|
85
86
|
View: AnimatedView,
|
|
86
87
|
Text: AnimatedText,
|
|
@@ -88,7 +89,6 @@ function createAnimations(animations) {
|
|
|
88
89
|
useAnimatedNumberReaction,
|
|
89
90
|
useAnimatedNumberStyle,
|
|
90
91
|
useAnimations: (props, helpers) => {
|
|
91
|
-
var _a;
|
|
92
92
|
const { onDidAnimate, delay, getStyle, state } = helpers;
|
|
93
93
|
const [isPresent, sendExitComplete] = usePresence();
|
|
94
94
|
const presence = useContext(PresenceContext);
|
|
@@ -100,87 +100,13 @@ function createAnimations(animations) {
|
|
|
100
100
|
exitVariant: presence == null ? void 0 : presence.exitVariant,
|
|
101
101
|
enterVariant: presence == null ? void 0 : presence.enterVariant
|
|
102
102
|
});
|
|
103
|
-
const animateStyles =
|
|
104
|
-
const animatedTranforms =
|
|
105
|
-
const interpolations =
|
|
103
|
+
const animateStyles = useSafeRef({});
|
|
104
|
+
const animatedTranforms = useSafeRef([]);
|
|
105
|
+
const interpolations = useSafeRef(
|
|
106
|
+
/* @__PURE__ */ new WeakMap()
|
|
107
|
+
);
|
|
106
108
|
const runners = [];
|
|
107
109
|
const completions = [];
|
|
108
|
-
function update(key, animated, valIn) {
|
|
109
|
-
const [val, type] = getValue(valIn);
|
|
110
|
-
const value = animated || new Animated.Value(val);
|
|
111
|
-
if (type) {
|
|
112
|
-
interpolations.current.set(value, getInterpolated(value, type, val));
|
|
113
|
-
}
|
|
114
|
-
if (animated) {
|
|
115
|
-
const animationConfig = getAnimationConfig(key, animations, props.animation);
|
|
116
|
-
let resolve;
|
|
117
|
-
const promise = new Promise((res) => {
|
|
118
|
-
resolve = res;
|
|
119
|
-
});
|
|
120
|
-
completions.push(promise);
|
|
121
|
-
runners.push(() => {
|
|
122
|
-
if (animated["_value"] === val) {
|
|
123
|
-
resolve();
|
|
124
|
-
return;
|
|
125
|
-
}
|
|
126
|
-
animated.stopAnimation();
|
|
127
|
-
Animated.spring(animated, {
|
|
128
|
-
toValue: val,
|
|
129
|
-
useNativeDriver: !isWeb,
|
|
130
|
-
...animationConfig
|
|
131
|
-
}).start(({ finished }) => {
|
|
132
|
-
if (finished) {
|
|
133
|
-
resolve();
|
|
134
|
-
}
|
|
135
|
-
});
|
|
136
|
-
});
|
|
137
|
-
}
|
|
138
|
-
return value;
|
|
139
|
-
}
|
|
140
|
-
function getValue(input) {
|
|
141
|
-
if (typeof input !== "string") {
|
|
142
|
-
return [input];
|
|
143
|
-
}
|
|
144
|
-
const neg = input[0] === "-";
|
|
145
|
-
if (neg)
|
|
146
|
-
input = input.slice(1);
|
|
147
|
-
const [_, number, after] = input.match(/([-0-9]+)(deg|%)/) ?? [];
|
|
148
|
-
return [+number * (neg ? -1 : 1), after];
|
|
149
|
-
}
|
|
150
|
-
const nonAnimatedStyle = {};
|
|
151
|
-
for (const key in all) {
|
|
152
|
-
const val = all[key];
|
|
153
|
-
if (animatedStyleKey[key]) {
|
|
154
|
-
if (key === "transform") {
|
|
155
|
-
if (val) {
|
|
156
|
-
for (const [index, transform] of val.entries()) {
|
|
157
|
-
if (!transform)
|
|
158
|
-
continue;
|
|
159
|
-
const tkey = Object.keys(transform)[0];
|
|
160
|
-
animatedTranforms.current[index] = {
|
|
161
|
-
[tkey]: update(tkey, (_a = animatedTranforms.current[index]) == null ? void 0 : _a[tkey], transform[tkey])
|
|
162
|
-
};
|
|
163
|
-
}
|
|
164
|
-
}
|
|
165
|
-
} else {
|
|
166
|
-
animateStyles.current[key] = update(key, animateStyles.current[key], val);
|
|
167
|
-
}
|
|
168
|
-
} else {
|
|
169
|
-
nonAnimatedStyle[key] = val;
|
|
170
|
-
}
|
|
171
|
-
}
|
|
172
|
-
const animatedStyle = {
|
|
173
|
-
...Object.fromEntries(
|
|
174
|
-
Object.entries({
|
|
175
|
-
...animateStyles.current
|
|
176
|
-
}).map(([k, v]) => [k, interpolations.current.get(v) || v])
|
|
177
|
-
),
|
|
178
|
-
transform: animatedTranforms.current.map((r) => {
|
|
179
|
-
const key = Object.keys(r)[0];
|
|
180
|
-
const val = interpolations.current.get(r[key]) || r[key];
|
|
181
|
-
return { [key]: val };
|
|
182
|
-
})
|
|
183
|
-
};
|
|
184
110
|
const args = [
|
|
185
111
|
JSON.stringify(all),
|
|
186
112
|
state.mounted,
|
|
@@ -194,6 +120,93 @@ function createAnimations(animations) {
|
|
|
194
120
|
presence == null ? void 0 : presence.exitVariant,
|
|
195
121
|
presence == null ? void 0 : presence.enterVariant
|
|
196
122
|
];
|
|
123
|
+
const res = useMemo(() => {
|
|
124
|
+
var _a;
|
|
125
|
+
function update(key, animated, valIn) {
|
|
126
|
+
const [val, type] = getValue(valIn);
|
|
127
|
+
const value = animated || new Animated.Value(val);
|
|
128
|
+
let interpolateArgs;
|
|
129
|
+
if (type) {
|
|
130
|
+
const curInterpolation = interpolations.current.get(value);
|
|
131
|
+
interpolateArgs = getInterpolated(
|
|
132
|
+
(curInterpolation == null ? void 0 : curInterpolation.current) ?? value["_value"],
|
|
133
|
+
val,
|
|
134
|
+
type
|
|
135
|
+
);
|
|
136
|
+
interpolations.current.set(value, {
|
|
137
|
+
interopolation: value.interpolate(interpolateArgs),
|
|
138
|
+
current: val
|
|
139
|
+
});
|
|
140
|
+
}
|
|
141
|
+
if (animated) {
|
|
142
|
+
const animationConfig = getAnimationConfig(key, animations, props.animation);
|
|
143
|
+
let resolve;
|
|
144
|
+
const promise = new Promise((res2) => {
|
|
145
|
+
resolve = res2;
|
|
146
|
+
});
|
|
147
|
+
completions.push(promise);
|
|
148
|
+
runners.push(() => {
|
|
149
|
+
animated.stopAnimation();
|
|
150
|
+
Animated.spring(animated, {
|
|
151
|
+
toValue: val,
|
|
152
|
+
useNativeDriver: !isWeb,
|
|
153
|
+
...animationConfig
|
|
154
|
+
}).start(({ finished }) => {
|
|
155
|
+
if (finished) {
|
|
156
|
+
resolve();
|
|
157
|
+
}
|
|
158
|
+
});
|
|
159
|
+
});
|
|
160
|
+
}
|
|
161
|
+
if (process.env.NODE_ENV === "development") {
|
|
162
|
+
if (props["debug"]) {
|
|
163
|
+
console.log("AnimatedValue", key, "mapped value", valIn, "of type", type, "to", val, "interpolated", interpolateArgs, "- current Animated.Value", value["_value"]);
|
|
164
|
+
}
|
|
165
|
+
}
|
|
166
|
+
return value;
|
|
167
|
+
}
|
|
168
|
+
const nonAnimatedStyle = {};
|
|
169
|
+
for (const key in all) {
|
|
170
|
+
const val = all[key];
|
|
171
|
+
if (animatedStyleKey[key]) {
|
|
172
|
+
if (key === "transform") {
|
|
173
|
+
if (val) {
|
|
174
|
+
for (const [index, transform] of val.entries()) {
|
|
175
|
+
if (!transform)
|
|
176
|
+
continue;
|
|
177
|
+
const tkey = Object.keys(transform)[0];
|
|
178
|
+
animatedTranforms.current[index] = {
|
|
179
|
+
[tkey]: update(tkey, (_a = animatedTranforms.current[index]) == null ? void 0 : _a[tkey], transform[tkey])
|
|
180
|
+
};
|
|
181
|
+
}
|
|
182
|
+
}
|
|
183
|
+
} else {
|
|
184
|
+
animateStyles.current[key] = update(key, animateStyles.current[key], val);
|
|
185
|
+
}
|
|
186
|
+
} else {
|
|
187
|
+
nonAnimatedStyle[key] = val;
|
|
188
|
+
}
|
|
189
|
+
}
|
|
190
|
+
const animatedStyle = {
|
|
191
|
+
...Object.fromEntries(
|
|
192
|
+
Object.entries({
|
|
193
|
+
...animateStyles.current
|
|
194
|
+
}).map(([k, v]) => {
|
|
195
|
+
var _a2;
|
|
196
|
+
return [k, ((_a2 = interpolations.current.get(v)) == null ? void 0 : _a2.interopolation) || v];
|
|
197
|
+
})
|
|
198
|
+
),
|
|
199
|
+
transform: animatedTranforms.current.map((r) => {
|
|
200
|
+
var _a2;
|
|
201
|
+
const key = Object.keys(r)[0];
|
|
202
|
+
const val = ((_a2 = interpolations.current.get(r[key])) == null ? void 0 : _a2.interopolation) || r[key];
|
|
203
|
+
return { [key]: val };
|
|
204
|
+
})
|
|
205
|
+
};
|
|
206
|
+
return {
|
|
207
|
+
style: [nonAnimatedStyle, animatedStyle]
|
|
208
|
+
};
|
|
209
|
+
}, args);
|
|
197
210
|
useIsomorphicLayoutEffect(() => {
|
|
198
211
|
for (const runner of runners) {
|
|
199
212
|
runner();
|
|
@@ -205,26 +218,24 @@ function createAnimations(animations) {
|
|
|
205
218
|
}
|
|
206
219
|
});
|
|
207
220
|
}, args);
|
|
208
|
-
return
|
|
209
|
-
return {
|
|
210
|
-
style: [nonAnimatedStyle, animatedStyle]
|
|
211
|
-
};
|
|
212
|
-
}, args);
|
|
221
|
+
return res;
|
|
213
222
|
}
|
|
214
223
|
};
|
|
215
224
|
}
|
|
216
|
-
function getInterpolated(
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
225
|
+
function getInterpolated(current, next, postfix = "deg") {
|
|
226
|
+
if (next === current) {
|
|
227
|
+
current = next - 1e-9;
|
|
228
|
+
}
|
|
229
|
+
const inputRange = [current, next];
|
|
230
|
+
const outputRange = [`${current}${postfix}`, `${next}${postfix}`];
|
|
231
|
+
if (next < current) {
|
|
221
232
|
inputRange.reverse();
|
|
222
233
|
outputRange.reverse();
|
|
223
234
|
}
|
|
224
|
-
return
|
|
235
|
+
return {
|
|
225
236
|
inputRange,
|
|
226
237
|
outputRange
|
|
227
|
-
}
|
|
238
|
+
};
|
|
228
239
|
}
|
|
229
240
|
function getAnimationConfig(key, animations, animation) {
|
|
230
241
|
if (typeof animation === "string") {
|
|
@@ -257,6 +268,16 @@ function getAnimationConfig(key, animations, animation) {
|
|
|
257
268
|
...extraConf
|
|
258
269
|
};
|
|
259
270
|
}
|
|
271
|
+
function getValue(input) {
|
|
272
|
+
if (typeof input !== "string") {
|
|
273
|
+
return [input];
|
|
274
|
+
}
|
|
275
|
+
const neg = input[0] === "-";
|
|
276
|
+
if (neg)
|
|
277
|
+
input = input.slice(1);
|
|
278
|
+
const [_, number, after] = input.match(/([-0-9]+)(deg|%)/) ?? [];
|
|
279
|
+
return [+number * (neg ? -1 : 1), after];
|
|
280
|
+
}
|
|
260
281
|
export {
|
|
261
282
|
AnimatedText,
|
|
262
283
|
AnimatedView,
|