@tamagui/animations-react-native 1.0.1-beta.213 → 1.0.1-beta.215

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.
@@ -116,8 +116,8 @@ function createAnimations(animations) {
116
116
  const [isPresent, sendExitComplete] = (0, import_use_presence.usePresence)();
117
117
  const presence = (0, import_react.useContext)(import_use_presence.PresenceContext);
118
118
  const isExiting = isPresent === false;
119
- const isEntering = !state.mounted;
120
- const all = getStyle({
119
+ const isEntering = state.unmounted;
120
+ const mergedStyles = getStyle({
121
121
  isExiting,
122
122
  isEntering,
123
123
  exitVariant: presence == null ? void 0 : presence.exitVariant,
@@ -125,14 +125,15 @@ function createAnimations(animations) {
125
125
  });
126
126
  const animateStyles = (0, import_core.useSafeRef)({});
127
127
  const animatedTranforms = (0, import_core.useSafeRef)([]);
128
- const interpolations = (0, import_core.useSafeRef)(
129
- /* @__PURE__ */ new WeakMap()
130
- );
128
+ const animationsState = (0, import_core.useSafeRef)(null);
129
+ if (!animationsState.current) {
130
+ animationsState.current = /* @__PURE__ */ new WeakMap();
131
+ }
131
132
  const runners = [];
132
133
  const completions = [];
133
134
  const args = [
134
- JSON.stringify(all),
135
- state.mounted,
135
+ JSON.stringify(mergedStyles),
136
+ state.unmounted,
136
137
  state.hover,
137
138
  state.press,
138
139
  state.pressIn,
@@ -145,23 +146,66 @@ function createAnimations(animations) {
145
146
  ];
146
147
  const res = (0, import_react.useMemo)(() => {
147
148
  var _a;
149
+ const nonAnimatedStyle = {};
150
+ for (const key in mergedStyles) {
151
+ const val = mergedStyles[key];
152
+ if (!animatedStyleKey[key]) {
153
+ nonAnimatedStyle[key] = val;
154
+ continue;
155
+ }
156
+ if (key !== "transform") {
157
+ animateStyles.current[key] = update(key, animateStyles.current[key], val);
158
+ continue;
159
+ }
160
+ if (!val)
161
+ continue;
162
+ for (const [index, transform] of val.entries()) {
163
+ if (!transform)
164
+ continue;
165
+ const tkey = Object.keys(transform)[0];
166
+ const currentTransform = (_a = animatedTranforms.current[index]) == null ? void 0 : _a[tkey];
167
+ animatedTranforms.current[index] = {
168
+ [tkey]: update(tkey, currentTransform, transform[tkey])
169
+ };
170
+ animatedTranforms.current = [...animatedTranforms.current];
171
+ }
172
+ }
173
+ const animatedStyle = {
174
+ ...Object.fromEntries(
175
+ Object.entries({
176
+ ...animateStyles.current
177
+ }).map(([k, v]) => {
178
+ var _a2;
179
+ return [k, ((_a2 = animationsState.current.get(v)) == null ? void 0 : _a2.interopolation) || v];
180
+ })
181
+ ),
182
+ transform: animatedTranforms.current.map((r) => {
183
+ var _a2;
184
+ const key = Object.keys(r)[0];
185
+ const val = ((_a2 = animationsState.current.get(r[key])) == null ? void 0 : _a2.interopolation) || r[key];
186
+ return { [key]: val };
187
+ })
188
+ };
189
+ return {
190
+ style: [nonAnimatedStyle, animatedStyle]
191
+ };
148
192
  function update(key, animated, valIn) {
149
193
  const [val, type] = getValue(valIn);
150
194
  const value = animated || new import_react_native.Animated.Value(val);
151
195
  let interpolateArgs;
152
196
  if (type) {
153
- const curInterpolation = interpolations.current.get(value);
197
+ const curInterpolation = animationsState.current.get(value);
154
198
  interpolateArgs = getInterpolated(
155
199
  (curInterpolation == null ? void 0 : curInterpolation.current) ?? value["_value"],
156
200
  val,
157
201
  type
158
202
  );
159
- interpolations.current.set(value, {
203
+ animationsState.current.set(value, {
160
204
  interopolation: value.interpolate(interpolateArgs),
161
205
  current: val
162
206
  });
163
207
  }
164
- if (animated) {
208
+ if (value) {
165
209
  const animationConfig = getAnimationConfig(key, animations, props.animation);
166
210
  let resolve;
167
211
  const promise = new Promise((res2) => {
@@ -169,8 +213,8 @@ function createAnimations(animations) {
169
213
  });
170
214
  completions.push(promise);
171
215
  runners.push(() => {
172
- animated.stopAnimation();
173
- import_react_native.Animated.spring(animated, {
216
+ value.stopAnimation();
217
+ import_react_native.Animated.spring(value, {
174
218
  toValue: val,
175
219
  useNativeDriver: !import_core.isWeb,
176
220
  ...animationConfig
@@ -183,64 +227,32 @@ function createAnimations(animations) {
183
227
  }
184
228
  if (process.env.NODE_ENV === "development") {
185
229
  if (props["debug"]) {
186
- console.log("AnimatedValue", key, "mapped value", valIn, "of type", type, "to", val, "interpolated", interpolateArgs, "- current Animated.Value", value["_value"]);
230
+ console.log(" \u{1F4A0} animate", key, `from ${value["_value"]} to`, valIn, `(${val})`, "type", type, "interpolate", interpolateArgs);
187
231
  }
188
232
  }
189
233
  return value;
190
234
  }
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
235
  }, args);
233
236
  (0, import_core.useIsomorphicLayoutEffect)(() => {
234
- for (const runner of runners) {
235
- runner();
236
- }
237
+ runners.forEach((r) => r());
238
+ let cancel = false;
237
239
  Promise.all(completions).then(() => {
240
+ if (cancel)
241
+ return;
238
242
  onDidAnimate == null ? void 0 : onDidAnimate();
239
243
  if (isExiting) {
240
244
  sendExitComplete == null ? void 0 : sendExitComplete();
241
245
  }
242
246
  });
247
+ return () => {
248
+ cancel = true;
249
+ };
243
250
  }, args);
251
+ if (process.env.NODE_ENV === "development") {
252
+ if (props["debug"]) {
253
+ console.log(`Returning animated`, res);
254
+ }
255
+ }
244
256
  return res;
245
257
  }
246
258
  };
@@ -295,11 +307,8 @@ function getValue(input) {
295
307
  if (typeof input !== "string") {
296
308
  return [input];
297
309
  }
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];
310
+ const [_, number, after] = input.match(/([-0-9]+)(deg|%|px)/) ?? [];
311
+ return [+number, after];
303
312
  }
304
313
  // Annotate the CommonJS export names for ESM import in node:
305
314
  0 && (module.exports = {
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/createAnimations.tsx"],
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 isReactNative: 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"]
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 isReactNative: 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.unmounted\n\n const mergedStyles = 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 animationsState = useSafeRef<\n WeakMap<\n Animated.Value,\n {\n interopolation: Animated.AnimatedInterpolation\n current?: number | undefined\n }\n >\n >(null as any)\n if (!animationsState.current) {\n animationsState.current = new WeakMap()\n }\n\n const runners: Function[] = []\n const completions: Promise<void>[] = []\n\n const args = [\n JSON.stringify(mergedStyles),\n state.unmounted,\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 const nonAnimatedStyle = {}\n for (const key in mergedStyles) {\n const val = mergedStyles[key]\n if (!animatedStyleKey[key]) {\n nonAnimatedStyle[key] = val\n continue\n }\n if (key !== 'transform') {\n animateStyles.current[key] = update(key, animateStyles.current[key], val)\n continue\n }\n // key: 'transform'\n // for now just support one transform key\n if (!val) continue\n for (const [index, transform] of val.entries()) {\n if (!transform) continue\n const tkey = Object.keys(transform)[0]\n const currentTransform = animatedTranforms.current[index]?.[tkey]\n animatedTranforms.current[index] = {\n [tkey]: update(tkey, currentTransform, transform[tkey]),\n }\n animatedTranforms.current = [...animatedTranforms.current]\n }\n }\n\n const animatedStyle = {\n ...Object.fromEntries(\n Object.entries({\n ...animateStyles.current,\n }).map(([k, v]) => [k, animationsState.current!.get(v)?.interopolation || v])\n ),\n transform: animatedTranforms.current.map((r) => {\n const key = Object.keys(r)[0]\n const val = animationsState.current!.get(r[key])?.interopolation || r[key]\n return { [key]: val }\n }),\n }\n\n return {\n style: [nonAnimatedStyle, animatedStyle],\n }\n\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 = animationsState.current.get(value)\n interpolateArgs = getInterpolated(\n curInterpolation?.current ?? value['_value'],\n val,\n type\n )\n animationsState.current!.set(value, {\n interopolation: value.interpolate(interpolateArgs),\n current: val,\n })\n }\n if (value) {\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 value.stopAnimation()\n Animated.spring(value, {\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(' \uD83D\uDCA0 animate', key, `from ${value['_value']} to`, valIn, `(${val})`, 'type', type, 'interpolate', interpolateArgs)\n }\n }\n return value\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, args)\n\n useIsomorphicLayoutEffect(() => {\n runners.forEach((r) => r())\n let cancel = false\n Promise.all(completions).then(() => {\n if (cancel) return\n onDidAnimate?.()\n if (isExiting) {\n sendExitComplete?.()\n }\n })\n return () => {\n cancel = true\n }\n }, args)\n\n if (process.env.NODE_ENV === 'development') {\n if (props['debug']) {\n // eslint-disable-next-line no-console\n console.log(`Returning animated`, res)\n }\n }\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 [_, number, after] = input.match(/([-0-9]+)(deg|%|px)/) ?? []\n return [+number, after] as const\n}\n"],
5
+ "mappings": "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",
6
+ "names": ["_a", "res"]
7
7
  }
@@ -93,8 +93,8 @@ function createAnimations(animations) {
93
93
  const [isPresent, sendExitComplete] = usePresence();
94
94
  const presence = useContext(PresenceContext);
95
95
  const isExiting = isPresent === false;
96
- const isEntering = !state.mounted;
97
- const all = getStyle({
96
+ const isEntering = state.unmounted;
97
+ const mergedStyles = getStyle({
98
98
  isExiting,
99
99
  isEntering,
100
100
  exitVariant: presence == null ? void 0 : presence.exitVariant,
@@ -102,14 +102,15 @@ function createAnimations(animations) {
102
102
  });
103
103
  const animateStyles = useSafeRef({});
104
104
  const animatedTranforms = useSafeRef([]);
105
- const interpolations = useSafeRef(
106
- /* @__PURE__ */ new WeakMap()
107
- );
105
+ const animationsState = useSafeRef(null);
106
+ if (!animationsState.current) {
107
+ animationsState.current = /* @__PURE__ */ new WeakMap();
108
+ }
108
109
  const runners = [];
109
110
  const completions = [];
110
111
  const args = [
111
- JSON.stringify(all),
112
- state.mounted,
112
+ JSON.stringify(mergedStyles),
113
+ state.unmounted,
113
114
  state.hover,
114
115
  state.press,
115
116
  state.pressIn,
@@ -122,23 +123,66 @@ function createAnimations(animations) {
122
123
  ];
123
124
  const res = useMemo(() => {
124
125
  var _a;
126
+ const nonAnimatedStyle = {};
127
+ for (const key in mergedStyles) {
128
+ const val = mergedStyles[key];
129
+ if (!animatedStyleKey[key]) {
130
+ nonAnimatedStyle[key] = val;
131
+ continue;
132
+ }
133
+ if (key !== "transform") {
134
+ animateStyles.current[key] = update(key, animateStyles.current[key], val);
135
+ continue;
136
+ }
137
+ if (!val)
138
+ continue;
139
+ for (const [index, transform] of val.entries()) {
140
+ if (!transform)
141
+ continue;
142
+ const tkey = Object.keys(transform)[0];
143
+ const currentTransform = (_a = animatedTranforms.current[index]) == null ? void 0 : _a[tkey];
144
+ animatedTranforms.current[index] = {
145
+ [tkey]: update(tkey, currentTransform, transform[tkey])
146
+ };
147
+ animatedTranforms.current = [...animatedTranforms.current];
148
+ }
149
+ }
150
+ const animatedStyle = {
151
+ ...Object.fromEntries(
152
+ Object.entries({
153
+ ...animateStyles.current
154
+ }).map(([k, v]) => {
155
+ var _a2;
156
+ return [k, ((_a2 = animationsState.current.get(v)) == null ? void 0 : _a2.interopolation) || v];
157
+ })
158
+ ),
159
+ transform: animatedTranforms.current.map((r) => {
160
+ var _a2;
161
+ const key = Object.keys(r)[0];
162
+ const val = ((_a2 = animationsState.current.get(r[key])) == null ? void 0 : _a2.interopolation) || r[key];
163
+ return { [key]: val };
164
+ })
165
+ };
166
+ return {
167
+ style: [nonAnimatedStyle, animatedStyle]
168
+ };
125
169
  function update(key, animated, valIn) {
126
170
  const [val, type] = getValue(valIn);
127
171
  const value = animated || new Animated.Value(val);
128
172
  let interpolateArgs;
129
173
  if (type) {
130
- const curInterpolation = interpolations.current.get(value);
174
+ const curInterpolation = animationsState.current.get(value);
131
175
  interpolateArgs = getInterpolated(
132
176
  (curInterpolation == null ? void 0 : curInterpolation.current) ?? value["_value"],
133
177
  val,
134
178
  type
135
179
  );
136
- interpolations.current.set(value, {
180
+ animationsState.current.set(value, {
137
181
  interopolation: value.interpolate(interpolateArgs),
138
182
  current: val
139
183
  });
140
184
  }
141
- if (animated) {
185
+ if (value) {
142
186
  const animationConfig = getAnimationConfig(key, animations, props.animation);
143
187
  let resolve;
144
188
  const promise = new Promise((res2) => {
@@ -146,8 +190,8 @@ function createAnimations(animations) {
146
190
  });
147
191
  completions.push(promise);
148
192
  runners.push(() => {
149
- animated.stopAnimation();
150
- Animated.spring(animated, {
193
+ value.stopAnimation();
194
+ Animated.spring(value, {
151
195
  toValue: val,
152
196
  useNativeDriver: !isWeb,
153
197
  ...animationConfig
@@ -160,64 +204,32 @@ function createAnimations(animations) {
160
204
  }
161
205
  if (process.env.NODE_ENV === "development") {
162
206
  if (props["debug"]) {
163
- console.log("AnimatedValue", key, "mapped value", valIn, "of type", type, "to", val, "interpolated", interpolateArgs, "- current Animated.Value", value["_value"]);
207
+ console.log(" \u{1F4A0} animate", key, `from ${value["_value"]} to`, valIn, `(${val})`, "type", type, "interpolate", interpolateArgs);
164
208
  }
165
209
  }
166
210
  return value;
167
211
  }
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
212
  }, args);
210
213
  useIsomorphicLayoutEffect(() => {
211
- for (const runner of runners) {
212
- runner();
213
- }
214
+ runners.forEach((r) => r());
215
+ let cancel = false;
214
216
  Promise.all(completions).then(() => {
217
+ if (cancel)
218
+ return;
215
219
  onDidAnimate == null ? void 0 : onDidAnimate();
216
220
  if (isExiting) {
217
221
  sendExitComplete == null ? void 0 : sendExitComplete();
218
222
  }
219
223
  });
224
+ return () => {
225
+ cancel = true;
226
+ };
220
227
  }, args);
228
+ if (process.env.NODE_ENV === "development") {
229
+ if (props["debug"]) {
230
+ console.log(`Returning animated`, res);
231
+ }
232
+ }
221
233
  return res;
222
234
  }
223
235
  };
@@ -272,11 +284,8 @@ function getValue(input) {
272
284
  if (typeof input !== "string") {
273
285
  return [input];
274
286
  }
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];
287
+ const [_, number, after] = input.match(/([-0-9]+)(deg|%|px)/) ?? [];
288
+ return [+number, after];
280
289
  }
281
290
  export {
282
291
  AnimatedText,
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/createAnimations.tsx"],
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 isReactNative: 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"]
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 isReactNative: 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.unmounted\n\n const mergedStyles = 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 animationsState = useSafeRef<\n WeakMap<\n Animated.Value,\n {\n interopolation: Animated.AnimatedInterpolation\n current?: number | undefined\n }\n >\n >(null as any)\n if (!animationsState.current) {\n animationsState.current = new WeakMap()\n }\n\n const runners: Function[] = []\n const completions: Promise<void>[] = []\n\n const args = [\n JSON.stringify(mergedStyles),\n state.unmounted,\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 const nonAnimatedStyle = {}\n for (const key in mergedStyles) {\n const val = mergedStyles[key]\n if (!animatedStyleKey[key]) {\n nonAnimatedStyle[key] = val\n continue\n }\n if (key !== 'transform') {\n animateStyles.current[key] = update(key, animateStyles.current[key], val)\n continue\n }\n // key: 'transform'\n // for now just support one transform key\n if (!val) continue\n for (const [index, transform] of val.entries()) {\n if (!transform) continue\n const tkey = Object.keys(transform)[0]\n const currentTransform = animatedTranforms.current[index]?.[tkey]\n animatedTranforms.current[index] = {\n [tkey]: update(tkey, currentTransform, transform[tkey]),\n }\n animatedTranforms.current = [...animatedTranforms.current]\n }\n }\n\n const animatedStyle = {\n ...Object.fromEntries(\n Object.entries({\n ...animateStyles.current,\n }).map(([k, v]) => [k, animationsState.current!.get(v)?.interopolation || v])\n ),\n transform: animatedTranforms.current.map((r) => {\n const key = Object.keys(r)[0]\n const val = animationsState.current!.get(r[key])?.interopolation || r[key]\n return { [key]: val }\n }),\n }\n\n return {\n style: [nonAnimatedStyle, animatedStyle],\n }\n\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 = animationsState.current.get(value)\n interpolateArgs = getInterpolated(\n curInterpolation?.current ?? value['_value'],\n val,\n type\n )\n animationsState.current!.set(value, {\n interopolation: value.interpolate(interpolateArgs),\n current: val,\n })\n }\n if (value) {\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 value.stopAnimation()\n Animated.spring(value, {\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(' \uD83D\uDCA0 animate', key, `from ${value['_value']} to`, valIn, `(${val})`, 'type', type, 'interpolate', interpolateArgs)\n }\n }\n return value\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, args)\n\n useIsomorphicLayoutEffect(() => {\n runners.forEach((r) => r())\n let cancel = false\n Promise.all(completions).then(() => {\n if (cancel) return\n onDidAnimate?.()\n if (isExiting) {\n sendExitComplete?.()\n }\n })\n return () => {\n cancel = true\n }\n }, args)\n\n if (process.env.NODE_ENV === 'development') {\n if (props['debug']) {\n // eslint-disable-next-line no-console\n console.log(`Returning animated`, res)\n }\n }\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 [_, number, after] = input.match(/([-0-9]+)(deg|%|px)/) ?? []\n return [+number, after] as const\n}\n"],
5
+ "mappings": "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",
6
+ "names": ["_a", "res"]
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tamagui/animations-react-native",
3
- "version": "1.0.1-beta.213",
3
+ "version": "1.0.1-beta.215",
4
4
  "source": "src/index.ts",
5
5
  "sideEffects": [
6
6
  "./polyfill.js"
@@ -9,18 +9,17 @@
9
9
  "types": "./types/index.d.ts",
10
10
  "main": "dist/cjs",
11
11
  "module": "dist/esm",
12
- "module:jsx": "dist/jsx",
13
12
  "files": [
14
13
  "src",
15
14
  "types",
16
15
  "dist"
17
16
  ],
18
17
  "dependencies": {
19
- "@tamagui/core": "^1.0.1-beta.213",
20
- "@tamagui/use-presence": "^1.0.1-beta.213"
18
+ "@tamagui/core": "^1.0.1-beta.215",
19
+ "@tamagui/use-presence": "^1.0.1-beta.215"
21
20
  },
22
21
  "devDependencies": {
23
- "@tamagui/build": "^1.0.1-beta.213",
22
+ "@tamagui/build": "^1.0.1-beta.215",
24
23
  "react": "*",
25
24
  "react-dom": "*",
26
25
  "react-native": "*"
@@ -139,9 +139,9 @@ export function createAnimations<A extends AnimationsConfig>(animations: A): Ani
139
139
  // : pseudos.exitStyle
140
140
 
141
141
  const isExiting = isPresent === false
142
- const isEntering = !state.mounted
142
+ const isEntering = state.unmounted
143
143
 
144
- const all = getStyle({
144
+ const mergedStyles = getStyle({
145
145
  isExiting,
146
146
  isEntering,
147
147
  exitVariant: presence?.exitVariant,
@@ -150,19 +150,25 @@ export function createAnimations<A extends AnimationsConfig>(animations: A): Ani
150
150
 
151
151
  const animateStyles = useSafeRef<Record<string, Animated.Value>>({})
152
152
  const animatedTranforms = useSafeRef<{ [key: string]: Animated.Value }[]>([])
153
- const interpolations = useSafeRef(
154
- new WeakMap<
153
+ const animationsState = useSafeRef<
154
+ WeakMap<
155
155
  Animated.Value,
156
- { interopolation: Animated.AnimatedInterpolation; current?: number }
157
- >()
158
- )
156
+ {
157
+ interopolation: Animated.AnimatedInterpolation
158
+ current?: number | undefined
159
+ }
160
+ >
161
+ >(null as any)
162
+ if (!animationsState.current) {
163
+ animationsState.current = new WeakMap()
164
+ }
159
165
 
160
166
  const runners: Function[] = []
161
167
  const completions: Promise<void>[] = []
162
168
 
163
169
  const args = [
164
- JSON.stringify(all),
165
- state.mounted,
170
+ JSON.stringify(mergedStyles),
171
+ state.unmounted,
166
172
  state.hover,
167
173
  state.press,
168
174
  state.pressIn,
@@ -175,23 +181,65 @@ export function createAnimations<A extends AnimationsConfig>(animations: A): Ani
175
181
  ]
176
182
 
177
183
  const res = useMemo(() => {
184
+ const nonAnimatedStyle = {}
185
+ for (const key in mergedStyles) {
186
+ const val = mergedStyles[key]
187
+ if (!animatedStyleKey[key]) {
188
+ nonAnimatedStyle[key] = val
189
+ continue
190
+ }
191
+ if (key !== 'transform') {
192
+ animateStyles.current[key] = update(key, animateStyles.current[key], val)
193
+ continue
194
+ }
195
+ // key: 'transform'
196
+ // for now just support one transform key
197
+ if (!val) continue
198
+ for (const [index, transform] of val.entries()) {
199
+ if (!transform) continue
200
+ const tkey = Object.keys(transform)[0]
201
+ const currentTransform = animatedTranforms.current[index]?.[tkey]
202
+ animatedTranforms.current[index] = {
203
+ [tkey]: update(tkey, currentTransform, transform[tkey]),
204
+ }
205
+ animatedTranforms.current = [...animatedTranforms.current]
206
+ }
207
+ }
208
+
209
+ const animatedStyle = {
210
+ ...Object.fromEntries(
211
+ Object.entries({
212
+ ...animateStyles.current,
213
+ }).map(([k, v]) => [k, animationsState.current!.get(v)?.interopolation || v])
214
+ ),
215
+ transform: animatedTranforms.current.map((r) => {
216
+ const key = Object.keys(r)[0]
217
+ const val = animationsState.current!.get(r[key])?.interopolation || r[key]
218
+ return { [key]: val }
219
+ }),
220
+ }
221
+
222
+ return {
223
+ style: [nonAnimatedStyle, animatedStyle],
224
+ }
225
+
178
226
  function update(key: string, animated: Animated.Value | undefined, valIn: string | number) {
179
227
  const [val, type] = getValue(valIn)
180
228
  const value = animated || new Animated.Value(val)
181
229
  let interpolateArgs: any
182
230
  if (type) {
183
- const curInterpolation = interpolations.current.get(value)
231
+ const curInterpolation = animationsState.current.get(value)
184
232
  interpolateArgs = getInterpolated(
185
233
  curInterpolation?.current ?? value['_value'],
186
234
  val,
187
235
  type
188
236
  )
189
- interpolations.current!.set(value, {
237
+ animationsState.current!.set(value, {
190
238
  interopolation: value.interpolate(interpolateArgs),
191
239
  current: val,
192
240
  })
193
241
  }
194
- if (animated) {
242
+ if (value) {
195
243
  const animationConfig = getAnimationConfig(key, animations, props.animation)
196
244
 
197
245
  let resolve
@@ -201,8 +249,8 @@ export function createAnimations<A extends AnimationsConfig>(animations: A): Ani
201
249
  completions.push(promise)
202
250
 
203
251
  runners.push(() => {
204
- animated.stopAnimation()
205
- Animated.spring(animated, {
252
+ value.stopAnimation()
253
+ Animated.spring(value, {
206
254
  toValue: val,
207
255
  useNativeDriver: !isWeb,
208
256
  ...animationConfig,
@@ -217,66 +265,36 @@ export function createAnimations<A extends AnimationsConfig>(animations: A): Ani
217
265
  if (props['debug']) {
218
266
  // prettier-ignore
219
267
  // eslint-disable-next-line no-console
220
- console.log('AnimatedValue', key, 'mapped value', valIn, 'of type', type, 'to', val, 'interpolated', interpolateArgs, '- current Animated.Value', value['_value'])
268
+ console.log(' 💠 animate', key, `from ${value['_value']} to`, valIn, `(${val})`, 'type', type, 'interpolate', interpolateArgs)
221
269
  }
222
270
  }
223
271
  return value
224
272
  }
225
-
226
- const nonAnimatedStyle = {}
227
- for (const key in all) {
228
- const val = all[key]
229
- if (animatedStyleKey[key]) {
230
- if (key === 'transform') {
231
- // for now just support one transform key
232
- if (val) {
233
- for (const [index, transform] of val.entries()) {
234
- if (!transform) continue
235
- const tkey = Object.keys(transform)[0]
236
- animatedTranforms.current[index] = {
237
- [tkey]: update(tkey, animatedTranforms.current[index]?.[tkey], transform[tkey]),
238
- }
239
- }
240
- }
241
- } else {
242
- animateStyles.current[key] = update(key, animateStyles.current[key], val)
243
- }
244
- } else {
245
- nonAnimatedStyle[key] = val
246
- }
247
- }
248
-
249
- const animatedStyle = {
250
- ...Object.fromEntries(
251
- Object.entries({
252
- ...animateStyles.current,
253
- }).map(([k, v]) => [k, interpolations.current!.get(v)?.interopolation || v])
254
- ),
255
- transform: animatedTranforms.current.map((r) => {
256
- const key = Object.keys(r)[0]
257
- const val = interpolations.current!.get(r[key])?.interopolation || r[key]
258
- return { [key]: val }
259
- }),
260
- }
261
-
262
- return {
263
- style: [nonAnimatedStyle, animatedStyle],
264
- }
265
273
  // eslint-disable-next-line react-hooks/exhaustive-deps
266
274
  }, args)
267
275
 
268
276
  useIsomorphicLayoutEffect(() => {
269
- for (const runner of runners) {
270
- runner()
271
- }
277
+ runners.forEach((r) => r())
278
+ let cancel = false
272
279
  Promise.all(completions).then(() => {
280
+ if (cancel) return
273
281
  onDidAnimate?.()
274
282
  if (isExiting) {
275
283
  sendExitComplete?.()
276
284
  }
277
285
  })
286
+ return () => {
287
+ cancel = true
288
+ }
278
289
  }, args)
279
290
 
291
+ if (process.env.NODE_ENV === 'development') {
292
+ if (props['debug']) {
293
+ // eslint-disable-next-line no-console
294
+ console.log(`Returning animated`, res)
295
+ }
296
+ }
297
+
280
298
  return res
281
299
  },
282
300
  }
@@ -334,8 +352,6 @@ function getValue(input: number | string) {
334
352
  if (typeof input !== 'string') {
335
353
  return [input] as const
336
354
  }
337
- const neg = input[0] === '-'
338
- if (neg) input = input.slice(1)
339
- const [_, number, after] = input.match(/([-0-9]+)(deg|%)/) ?? []
340
- return [+number * (neg ? -1 : 1), after] as const
355
+ const [_, number, after] = input.match(/([-0-9]+)(deg|%|px)/) ?? []
356
+ return [+number, after] as const
341
357
  }
@@ -1,282 +0,0 @@
1
- import {
2
- isWeb,
3
- useEvent,
4
- useIsomorphicLayoutEffect,
5
- useSafeRef
6
- } from "@tamagui/core";
7
- import { PresenceContext, usePresence } from "@tamagui/use-presence";
8
- import { useContext, useEffect, useMemo } from "react";
9
- import { Animated } from "react-native";
10
- const animatedStyleKey = {
11
- transform: true,
12
- opacity: true
13
- };
14
- const AnimatedView = Animated.View;
15
- const AnimatedText = Animated.Text;
16
- function useAnimatedNumber(initial) {
17
- const state = useSafeRef(
18
- null
19
- );
20
- if (!state.current) {
21
- state.current = {
22
- composite: null,
23
- val: new Animated.Value(initial),
24
- strategy: { type: "spring" }
25
- };
26
- }
27
- return {
28
- getInstance() {
29
- return state.current.val;
30
- },
31
- getValue() {
32
- return state.current.val["_value"];
33
- },
34
- stop() {
35
- state.current.composite?.stop();
36
- state.current.composite = null;
37
- },
38
- setValue(next, { type, ...config } = { type: "spring" }) {
39
- const val = state.current.val;
40
- if (type === "direct") {
41
- val.setValue(next);
42
- } else if (type === "spring") {
43
- state.current.composite?.stop();
44
- const composite = Animated.spring(val, {
45
- ...config,
46
- toValue: next,
47
- useNativeDriver: !isWeb
48
- });
49
- composite.start();
50
- state.current.composite = composite;
51
- } else {
52
- state.current.composite?.stop();
53
- const composite = Animated.timing(val, {
54
- ...config,
55
- toValue: next,
56
- useNativeDriver: !isWeb
57
- });
58
- composite.start();
59
- state.current.composite = composite;
60
- }
61
- }
62
- };
63
- }
64
- function useAnimatedNumberReaction(value, cb) {
65
- const onChange = useEvent((current) => {
66
- cb(current.value);
67
- });
68
- useEffect(() => {
69
- const id = value.getInstance().addListener(onChange);
70
- return () => {
71
- value.getInstance().removeListener(id);
72
- };
73
- }, [value, onChange]);
74
- }
75
- function useAnimatedNumberStyle(value, getStyle) {
76
- return getStyle(value.getInstance());
77
- }
78
- function createAnimations(animations) {
79
- AnimatedView["displayName"] = "AnimatedView";
80
- AnimatedText["displayName"] = "AnimatedText";
81
- return {
82
- isReactNative: true,
83
- animations,
84
- View: AnimatedView,
85
- Text: AnimatedText,
86
- useAnimatedNumber,
87
- useAnimatedNumberReaction,
88
- useAnimatedNumberStyle,
89
- useAnimations: (props, helpers) => {
90
- const { onDidAnimate, delay, getStyle, state } = helpers;
91
- const [isPresent, sendExitComplete] = usePresence();
92
- const presence = useContext(PresenceContext);
93
- const isExiting = isPresent === false;
94
- const isEntering = !state.mounted;
95
- const all = getStyle({
96
- isExiting,
97
- isEntering,
98
- exitVariant: presence?.exitVariant,
99
- enterVariant: presence?.enterVariant
100
- });
101
- const animateStyles = useSafeRef({});
102
- const animatedTranforms = useSafeRef([]);
103
- const interpolations = useSafeRef(
104
- /* @__PURE__ */ new WeakMap()
105
- );
106
- const runners = [];
107
- const completions = [];
108
- const args = [
109
- JSON.stringify(all),
110
- state.mounted,
111
- state.hover,
112
- state.press,
113
- state.pressIn,
114
- state.focus,
115
- delay,
116
- isPresent,
117
- onDidAnimate,
118
- presence?.exitVariant,
119
- presence?.enterVariant
120
- ];
121
- const res = useMemo(() => {
122
- function update(key, animated, valIn) {
123
- const [val, type] = getValue(valIn);
124
- const value = animated || new Animated.Value(val);
125
- let interpolateArgs;
126
- if (type) {
127
- const curInterpolation = interpolations.current.get(value);
128
- interpolateArgs = getInterpolated(
129
- curInterpolation?.current ?? value["_value"],
130
- val,
131
- type
132
- );
133
- interpolations.current.set(value, {
134
- interopolation: value.interpolate(interpolateArgs),
135
- current: val
136
- });
137
- }
138
- if (animated) {
139
- const animationConfig = getAnimationConfig(key, animations, props.animation);
140
- let resolve;
141
- const promise = new Promise((res2) => {
142
- resolve = res2;
143
- });
144
- completions.push(promise);
145
- runners.push(() => {
146
- animated.stopAnimation();
147
- Animated.spring(animated, {
148
- toValue: val,
149
- useNativeDriver: !isWeb,
150
- ...animationConfig
151
- }).start(({ finished }) => {
152
- if (finished) {
153
- resolve();
154
- }
155
- });
156
- });
157
- }
158
- if (process.env.NODE_ENV === "development") {
159
- if (props["debug"]) {
160
- console.log("AnimatedValue", key, "mapped value", valIn, "of type", type, "to", val, "interpolated", interpolateArgs, "- current Animated.Value", value["_value"]);
161
- }
162
- }
163
- return value;
164
- }
165
- const nonAnimatedStyle = {};
166
- for (const key in all) {
167
- const val = all[key];
168
- if (animatedStyleKey[key]) {
169
- if (key === "transform") {
170
- if (val) {
171
- for (const [index, transform] of val.entries()) {
172
- if (!transform)
173
- continue;
174
- const tkey = Object.keys(transform)[0];
175
- animatedTranforms.current[index] = {
176
- [tkey]: update(tkey, animatedTranforms.current[index]?.[tkey], transform[tkey])
177
- };
178
- }
179
- }
180
- } else {
181
- animateStyles.current[key] = update(key, animateStyles.current[key], val);
182
- }
183
- } else {
184
- nonAnimatedStyle[key] = val;
185
- }
186
- }
187
- const animatedStyle = {
188
- ...Object.fromEntries(
189
- Object.entries({
190
- ...animateStyles.current
191
- }).map(([k, v]) => [k, interpolations.current.get(v)?.interopolation || v])
192
- ),
193
- transform: animatedTranforms.current.map((r) => {
194
- const key = Object.keys(r)[0];
195
- const val = interpolations.current.get(r[key])?.interopolation || r[key];
196
- return { [key]: val };
197
- })
198
- };
199
- return {
200
- style: [nonAnimatedStyle, animatedStyle]
201
- };
202
- }, args);
203
- useIsomorphicLayoutEffect(() => {
204
- for (const runner of runners) {
205
- runner();
206
- }
207
- Promise.all(completions).then(() => {
208
- onDidAnimate?.();
209
- if (isExiting) {
210
- sendExitComplete?.();
211
- }
212
- });
213
- }, args);
214
- return res;
215
- }
216
- };
217
- }
218
- function getInterpolated(current, next, postfix = "deg") {
219
- if (next === current) {
220
- current = next - 1e-9;
221
- }
222
- const inputRange = [current, next];
223
- const outputRange = [`${current}${postfix}`, `${next}${postfix}`];
224
- if (next < current) {
225
- inputRange.reverse();
226
- outputRange.reverse();
227
- }
228
- return {
229
- inputRange,
230
- outputRange
231
- };
232
- }
233
- function getAnimationConfig(key, animations, animation) {
234
- if (typeof animation === "string") {
235
- return animations[animation];
236
- }
237
- let type = "";
238
- let extraConf;
239
- if (Array.isArray(animation)) {
240
- type = animation[0];
241
- const conf = animation[1] && animation[1][key];
242
- if (conf) {
243
- if (typeof conf === "string") {
244
- type = conf;
245
- } else {
246
- type = conf.type || type;
247
- extraConf = conf;
248
- }
249
- }
250
- } else {
251
- const val = animation?.[key];
252
- type = val?.type;
253
- extraConf = val;
254
- }
255
- const found = animations[type];
256
- if (!found) {
257
- throw new Error(`No animation of type "${type}" for key "${key}"`);
258
- }
259
- return {
260
- ...found,
261
- ...extraConf
262
- };
263
- }
264
- function getValue(input) {
265
- if (typeof input !== "string") {
266
- return [input];
267
- }
268
- const neg = input[0] === "-";
269
- if (neg)
270
- input = input.slice(1);
271
- const [_, number, after] = input.match(/([-0-9]+)(deg|%)/) ?? [];
272
- return [+number * (neg ? -1 : 1), after];
273
- }
274
- export {
275
- AnimatedText,
276
- AnimatedView,
277
- createAnimations,
278
- useAnimatedNumber,
279
- useAnimatedNumberReaction,
280
- useAnimatedNumberStyle
281
- };
282
- //# sourceMappingURL=createAnimations.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/createAnimations.tsx"],
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 isReactNative: 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"]
7
- }
package/dist/jsx/index.js DELETED
@@ -1,3 +0,0 @@
1
- import "./polyfill";
2
- export * from "./createAnimations";
3
- //# sourceMappingURL=index.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/index.tsx"],
4
- "sourcesContent": ["import './polyfill'\n\nexport * from './createAnimations'\n"],
5
- "mappings": "AAAA,OAAO;AAEP,cAAc;",
6
- "names": []
7
- }
@@ -1,4 +0,0 @@
1
- if (typeof requestAnimationFrame === "undefined") {
2
- globalThis["requestAnimationFrame"] = setImmediate;
3
- }
4
- //# sourceMappingURL=polyfill.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/polyfill.ts"],
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;",
6
- "names": []
7
- }