@tamagui/animations-motion 1.132.9 → 1.132.10

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.
Files changed (14) hide show
  1. package/dist/cjs/createAnimations.cjs +42 -31
  2. package/dist/cjs/createAnimations.js +45 -30
  3. package/dist/cjs/createAnimations.js.map +1 -1
  4. package/dist/cjs/createAnimations.native.js +60 -38
  5. package/dist/cjs/createAnimations.native.js.map +2 -2
  6. package/dist/esm/createAnimations.js +53 -31
  7. package/dist/esm/createAnimations.js.map +1 -1
  8. package/dist/esm/createAnimations.mjs +43 -32
  9. package/dist/esm/createAnimations.mjs.map +1 -1
  10. package/dist/esm/createAnimations.native.js +55 -38
  11. package/dist/esm/createAnimations.native.js.map +1 -1
  12. package/package.json +4 -4
  13. package/src/createAnimations.tsx +83 -42
  14. package/types/createAnimations.d.ts.map +2 -2
package/dist/esm/createAnimations.native.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["jsx","_jsx","fixStyles","getSplitStyles","hooks","styleToCSS","Text","useComposedRefs","useIsomorphicLayoutEffect","useThemeWithState","View","ResetPresence","usePresence","useAnimate","useMotionValue","useMotionValueEvent","React","forwardRef","useEffect","useMemo","useRef","useState","MotionValueStrategy","WeakMap","createAnimations","animationsProp","animations","key","type","MotionView","MotionText","isReactNative","supportsCSS","needsWebStyles","avoidReRenders","useAnimations","animationProps","props","style","componentState","stateRef","useStyleEmitter","presence","animationKey","Array","isArray","animation","isHydrating","unmounted","disableAnimation","isExiting","sendExitComplete","isFirstRender","scope","animate","lastAnimationStyle","lastDontAnimate","controls","styleKey","JSON","stringify","shouldDebug","process","env","NODE_ENV","debug","dontAnimate","doAnimate","animationOptions","motionAnimationState","getMotionAnimatedProps","animationsQueue","lastAnimateAt","minTimeBetweenAnimations","disposed","current","runAnimation","props2","waitForNextAnimationFrame","queue","last","length","console","error","elapsed","Date","now","info","flushAnimation","requestAnimationFrame","hasQueue","shouldWait","push","param","doAnimate2","dontAnimate2","animationOptions2","node","host","HTMLElement","firstAnimation","complete","groupCollapsed","groupEnd","next","diff","getDiff","Object","assign","key2","diff1","finished","then","nextStyle","_$animationProps","initialStyle","ref","tag","useAnimatedNumber","initial","motionValue","getInstance","getValue","get","setValue","config","arguments","onFinish","set","unsubscribe","on","value","Math","abs","stop","useAnimatedNumberReaction","onValue","instance","useAnimatedNumberStyle","val","getStyleProp","getStyleRef","getStyle","cur","disable","animationPropToAnimationConfig","animateOnly","disableAnimationProps","has","includes","animationProp","defaultAnimationKey","specificAnimations","defaultConfig","default","fromEntries","entries","flatMap","propName","animationNameOrConfig","Set","createMotionView","defaultTag","isText","Component","propsIn","_hooks_usePropsTransform","forwardedRef","propsRest","hostRef","composedRefs","_","state","styles","animatedStyle","nonAnimatedStyles","find","x","filter","getProps","out","staticConfig","theme","name","isAnimated","noClass","resolveValues","viewProps","Element","transformedProps","usePropsTransform","call","animationConfig","webStyle","motionAnimationConfig","duration"],"sources":["../../src/createAnimations.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["jsx","_jsx","fixStyles","getSplitStyles","hooks","styleToCSS","Text","useComposedRefs","useIsomorphicLayoutEffect","useThemeWithState","View","ResetPresence","usePresence","useAnimate","useMotionValue","useMotionValueEvent","React","forwardRef","useEffect","useLayoutEffect","useMemo","useRef","useState","MotionValueStrategy","WeakMap","createAnimations","animationsProp","animations","key","type","MotionView","MotionText","isReactNative","supportsCSS","needsWebStyles","avoidReRenders","useAnimations","animationProps","props","style","componentState","stateRef","useStyleEmitter","presence","animationKey","Array","isArray","animation","isHydrating","unmounted","disableAnimation","isExiting","sendExitComplete","isFirstRender","scope","animate","lastAnimationStyle","controls","styleKey","JSON","stringify","shouldDebug","debug","dontAnimate","doAnimate","animationOptions","motionAnimationState","getMotionAnimatedProps","animationsQueue","lastAnimateAt","minTimeBetweenAnimations","disposed","firstRenderStyle","lastDontAnimate","current","runAnimation","props2","waitForNextAnimationFrame","queue","last","length","console","error","elapsed","Date","now","info","flushAnimation","requestAnimationFrame","hasQueue","shouldWait","push","updateFirstAnimationStyle","node","host","HTMLElement","firstAnimation","complete","groupCollapsed","groupEnd","param","doAnimate2","dontAnimate2","animationOptions2","next","curDontAnimate","key2","newDontAnimate","getDiff","Object","assign","diff","trace","finished","then","nextStyle","_$animationProps","animateKey","initialStyle","ref","tag","useAnimatedNumber","initial","motionValue","getInstance","getValue","get","setValue","config","arguments","onFinish","set","unsubscribe","on","value","Math","abs","stop","useAnimatedNumberReaction","onValue","instance","useAnimatedNumberStyle","val","getStyleProp","getStyleRef","getStyle","cur","disable","animationPropToAnimationConfig","animateOnly","disableAnimationProps","has","includes","animationProp","defaultAnimationKey","specificAnimations","defaultConfig","default","fromEntries","entries","flatMap","propName","animationNameOrConfig","Set","createMotionView","defaultTag","isText","Component","propsIn","_hooks_usePropsTransform","forwardedRef","propsRest","hostRef","composedRefs","_","state","styles","animatedStyle","nonAnimatedStyles","find","x","filter","getProps","out","staticConfig","theme","name","isAnimated","noClass","resolveValues","viewProps","Element","transformedProps","usePropsTransform","call","animationConfig","webStyle","motionAnimationConfig","duration"],"sources":["../../src/createAnimations.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tamagui/animations-motion",
3
- "version": "1.132.9",
3
+ "version": "1.132.10",
4
4
  "source": "src/index.ts",
5
5
  "license": "MIT",
6
6
  "types": "./types/index.d.ts",
@@ -29,12 +29,12 @@
29
29
  }
30
30
  },
31
31
  "dependencies": {
32
- "@tamagui/core": "1.132.9",
33
- "@tamagui/use-presence": "1.132.9",
32
+ "@tamagui/core": "1.132.10",
33
+ "@tamagui/use-presence": "1.132.10",
34
34
  "motion": "^12.23.6"
35
35
  },
36
36
  "devDependencies": {
37
- "@tamagui/build": "1.132.9",
37
+ "@tamagui/build": "1.132.10",
38
38
  "react": "*"
39
39
  },
40
40
  "scripts": {
package/src/createAnimations.tsx CHANGED
@@ -23,7 +23,14 @@ import {
23
23
  useMotionValueEvent,
24
24
  type ValueTransition,
25
25
  } from 'motion/react'
26
- import React, { forwardRef, RefObject, useEffect, useMemo, useRef, useState } from 'react'
26
+ import React, {
27
+ forwardRef,
28
+ useEffect,
29
+ useLayoutEffect,
30
+ useMemo,
31
+ useRef,
32
+ useState,
33
+ } from 'react'
27
34
 
28
35
  // TODO: useAnimatedNumber style could avoid re-rendering
29
36
 
@@ -85,14 +92,13 @@ export function createAnimations<A extends Record<string, AnimationConfig>>(
85
92
  const isFirstRender = useRef(true)
86
93
  const [scope, animate] = useAnimate()
87
94
  const lastAnimationStyle = useRef<Record<string, unknown> | null>(null)
88
- const lastDontAnimate = useRef<Record<string, unknown>>({})
89
95
  const controls = useRef<AnimationPlaybackControlsWithThen | null>(null)
90
96
  const styleKey = JSON.stringify(style)
91
97
 
98
+ // until fully stable allow debugging in prod to help debugging prod issues
92
99
  const shouldDebug =
93
- process.env.NODE_ENV === 'development' &&
94
- props['debug'] &&
95
- props['debug'] !== 'profile'
100
+ // process.env.NODE_ENV === 'development' &&
101
+ props['debug'] && props['debug'] !== 'profile'
96
102
 
97
103
  const {
98
104
  dontAnimate = {},
@@ -111,14 +117,12 @@ export function createAnimations<A extends Record<string, AnimationConfig>>(
111
117
  const lastAnimateAt = useRef(0)
112
118
  const minTimeBetweenAnimations = 16.667
113
119
  const disposed = useRef(false)
120
+ const [firstRenderStyle] = useState(style)
114
121
 
115
- useIsomorphicLayoutEffect(() => {
116
- lastDontAnimate.current = dontAnimate
117
- })
118
-
119
- useEffect(() => {
120
- isFirstRender.current = false
122
+ // avoid first render returning wrong styles - always render all, after that we can just mutate
123
+ const lastDontAnimate = useRef<Record<string, unknown>>(firstRenderStyle)
121
124
 
125
+ useLayoutEffect(() => {
122
126
  return () => {
123
127
  disposed.current = true
124
128
  }
@@ -167,7 +171,9 @@ export function createAnimations<A extends Record<string, AnimationConfig>>(
167
171
 
168
172
  const hasQueue = animationsQueue.current.length
169
173
  const shouldWait =
170
- hasQueue || Date.now() - lastAnimateAt.current > minTimeBetweenAnimations
174
+ hasQueue ||
175
+ (lastAnimateAt.current &&
176
+ Date.now() - lastAnimateAt.current > minTimeBetweenAnimations)
171
177
 
172
178
  if (isExiting || isFirstRender.current || (scope.current && !shouldWait)) {
173
179
  flushAnimation(props)
@@ -179,6 +185,32 @@ export function createAnimations<A extends Record<string, AnimationConfig>>(
179
185
  }
180
186
  }
181
187
 
188
+ const updateFirstAnimationStyle = () => {
189
+ const node = stateRef.current.host
190
+
191
+ if (!(node instanceof HTMLElement)) {
192
+ return false
193
+ }
194
+
195
+ if (!lastAnimationStyle.current) {
196
+ lastAnimationStyle.current = style
197
+ const firstAnimation = animate(scope.current, doAnimate || {}, {
198
+ type: false,
199
+ })
200
+ firstAnimation.complete()
201
+ scope.animations = []
202
+
203
+ if (shouldDebug) {
204
+ console.groupCollapsed(`[motion] 🌊 FIRST`)
205
+ console.info(doAnimate)
206
+ console.groupEnd()
207
+ }
208
+ return true
209
+ }
210
+
211
+ return false
212
+ }
213
+
182
214
  const flushAnimation = ({
183
215
  doAnimate,
184
216
  dontAnimate,
@@ -191,22 +223,6 @@ export function createAnimations<A extends Record<string, AnimationConfig>>(
191
223
  return
192
224
  }
193
225
 
194
- if (!lastAnimationStyle.current) {
195
- lastAnimationStyle.current = style
196
- const firstAnimation = animate(scope.current, doAnimate || {}, {
197
- type: false,
198
- })
199
- firstAnimation.complete()
200
- // scope.animations = []
201
-
202
- if (shouldDebug) {
203
- console.groupCollapsed(`[motion] 🌊 FIRST`)
204
- console.info(doAnimate)
205
- console.groupEnd()
206
- }
207
- return
208
- }
209
-
210
226
  if (!doAnimate && !dontAnimate) {
211
227
  return
212
228
  }
@@ -216,21 +232,27 @@ export function createAnimations<A extends Record<string, AnimationConfig>>(
216
232
  // handle case where dontAnimate changes
217
233
  // we just set it onto animate + set options to not actually animate
218
234
  if (dontAnimate) {
219
- if (node) {
220
- const diff = getDiff(lastDontAnimate.current, dontAnimate)
221
- if (diff) {
222
- lastDontAnimate.current = dontAnimate
223
- Object.assign(node.style, dontAnimate as any)
224
- }
225
- for (const key in lastDontAnimate.current) {
226
- if (!(key in dontAnimate)) {
235
+ const curDontAnimate = lastDontAnimate.current
236
+ if (node && curDontAnimate) {
237
+ for (const key in curDontAnimate) {
238
+ if (!(key in style)) {
227
239
  console.info('deleting!', key, { dontAnimate, doAnimate })
228
240
  delete node.style[key]
229
241
  }
230
242
  }
243
+ const newDontAnimate = getDiff(curDontAnimate, dontAnimate)
244
+ if (newDontAnimate) {
245
+ Object.assign(node.style, newDontAnimate as any)
246
+ }
231
247
  }
232
248
  }
233
249
 
250
+ lastDontAnimate.current = dontAnimate || {}
251
+
252
+ if (updateFirstAnimationStyle()) {
253
+ return
254
+ }
255
+
234
256
  const diff = getDiff(lastAnimationStyle.current, next)
235
257
 
236
258
  if (shouldDebug) {
@@ -245,16 +267,18 @@ export function createAnimations<A extends Record<string, AnimationConfig>>(
245
267
  lastAnimationStyle: { ...lastAnimationStyle.current },
246
268
  isExiting,
247
269
  })
270
+ console.trace()
248
271
  console.groupEnd()
249
272
  }
250
273
 
274
+ lastAnimationStyle.current = next
275
+ lastAnimateAt.current = Date.now()
276
+
251
277
  if (!diff) {
252
278
  return
253
279
  }
254
280
 
255
- lastAnimateAt.current = Date.now()
256
281
  controls.current = animate(scope.current, diff, animationOptions)
257
- lastAnimationStyle.current = next
258
282
  } finally {
259
283
  if (isExiting) {
260
284
  if (controls.current) {
@@ -287,17 +311,27 @@ export function createAnimations<A extends Record<string, AnimationConfig>>(
287
311
  }
288
312
  }, [])
289
313
 
314
+ const animateKey = JSON.stringify(doAnimate)
315
+
290
316
  useIsomorphicLayoutEffect(() => {
317
+ if (isFirstRender.current) {
318
+ updateFirstAnimationStyle()
319
+ isFirstRender.current = false
320
+ return
321
+ }
322
+
291
323
  if (!doAnimate && !isExiting) return
292
324
 
293
325
  // always clear queue if we re-render
294
326
  animationsQueue.current = []
295
327
 
296
- runAnimation({
328
+ // don't ever queue on a render
329
+ flushAnimation({
297
330
  doAnimate,
331
+ dontAnimate,
298
332
  animationOptions,
299
333
  })
300
- }, [JSON.stringify(doAnimate), isExiting, lastAnimationStyle])
334
+ }, [animateKey, isExiting, lastAnimationStyle])
301
335
 
302
336
  const [initialStyle] = useState(() => ({ ...dontAnimate, ...doAnimate }))
303
337
 
@@ -307,17 +341,19 @@ export function createAnimations<A extends Record<string, AnimationConfig>>(
307
341
  style,
308
342
  doAnimate,
309
343
  dontAnimate,
344
+ animateKey,
310
345
  scope,
311
346
  animationOptions,
312
347
  initialStyle,
313
348
  isExiting,
349
+ isFirstRender: isFirstRender.current,
314
350
  })
315
351
  console.groupEnd()
316
352
  }
317
353
 
318
354
  return {
319
- // avoid first render returning wrong styles - always render all, after that we can just mutate
320
- style: isFirstRender.current ? style : dontAnimate,
355
+ // we never change this, after first render on
356
+ style: firstRenderStyle,
321
357
  ref: scope,
322
358
  tag: 'div',
323
359
  }
@@ -500,6 +536,10 @@ const disableAnimationProps = new Set<string>([
500
536
  'flexGrow',
501
537
  'flexShrink',
502
538
  'justifyContent',
539
+ 'marginRight',
540
+ 'marginLeft',
541
+ 'marginBottom',
542
+ 'marginTop',
503
543
  'maxHeight',
504
544
  'maxWidth',
505
545
  'minHeight',
@@ -515,6 +555,7 @@ const disableAnimationProps = new Set<string>([
515
555
  'textWrap',
516
556
  'transformOrigin',
517
557
  'zIndex',
558
+ 'WebkitBackdropFilter',
518
559
  ])
519
560
 
520
561
  const MotionView = createMotionView('div')
package/types/createAnimations.d.ts.map CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "mappings": "AAAA,cAEO,uBAYA,eAAe;AAEtB,cAOO,uBACA,cAAc;KAMhB,kBAAkB;AAevB,OAAO,iBAAS,iBAAiB,UAAU,eAAe,kBACxDA,gBAAgB,IACf,gBAAgB",
2
+ "mappings": "AAAA,cAEO,uBAYA,eAAe;AAEtB,cAOO,uBACA,cAAc;KAahB,kBAAkB;AAevB,OAAO,iBAAS,iBAAiB,UAAU,eAAe,kBACxDA,gBAAgB,IACf,gBAAgB",
3
3
  "names": [
4
4
  "animationsProp: A"
5
5
  ],
@@ -7,7 +7,7 @@
7
7
  "src/createAnimations.tsx"
8
8
  ],
9
9
  "sourcesContent": [
10
- "import {\n type AnimatedNumberStrategy,\n type AnimationDriver,\n type AnimationProp,\n fixStyles,\n getSplitStyles,\n hooks,\n styleToCSS,\n Text,\n type UniversalAnimatedNumber,\n useComposedRefs,\n useIsomorphicLayoutEffect,\n useThemeWithState,\n View,\n} from '@tamagui/core'\nimport { ResetPresence, usePresence } from '@tamagui/use-presence'\nimport {\n type AnimationOptions,\n type AnimationPlaybackControlsWithThen,\n type MotionValue,\n useAnimate,\n useMotionValue,\n useMotionValueEvent,\n type ValueTransition,\n} from 'motion/react'\nimport React, { forwardRef, RefObject, useEffect, useMemo, useRef, useState } from 'react'\n\n// TODO: useAnimatedNumber style could avoid re-rendering\n\ntype MotionAnimatedNumber = MotionValue<number>\ntype AnimationConfig = ValueTransition\n\ntype MotionAnimatedNumberStyle = {\n getStyle: (cur: number) => Record<string, unknown>\n motionValue: MotionValue<number>\n}\n\nconst MotionValueStrategy = new WeakMap<MotionValue, AnimatedNumberStrategy>()\n\ntype AnimationProps = {\n doAnimate?: Record<string, unknown>\n dontAnimate?: Record<string, unknown>\n animationOptions?: AnimationOptions\n}\n\nexport function createAnimations<A extends Record<string, AnimationConfig>>(\n animationsProp: A\n): AnimationDriver<A> {\n // normalize, it doesn't assume type: 'spring' even if damping etc there so we do that\n // which also matches the moti driver\n // @ts-expect-error avoid doing a spread for no reason, sub-constraint type issue\n const animations: A = {}\n for (const key in animationsProp) {\n animations[key] = {\n type: 'spring',\n ...animationsProp[key],\n }\n }\n\n return {\n // this is only used by Sheet basically for now to pass result of useAnimatedStyle to\n View: MotionView,\n Text: MotionText,\n isReactNative: false,\n supportsCSS: true,\n needsWebStyles: true,\n avoidReRenders: true,\n animations,\n usePresence,\n ResetPresence,\n\n useAnimations: (animationProps) => {\n const { props, style, componentState, stateRef, useStyleEmitter, presence } =\n animationProps\n\n const animationKey = Array.isArray(props.animation)\n ? props.animation[0]\n : props.animation\n\n const isHydrating = componentState.unmounted === true\n const disableAnimation = isHydrating || !animationKey\n const isExiting = presence?.[0] === false\n const sendExitComplete = presence?.[1]\n\n const isFirstRender = useRef(true)\n const [scope, animate] = useAnimate()\n const lastAnimationStyle = useRef<Record<string, unknown> | null>(null)\n const lastDontAnimate = useRef<Record<string, unknown>>({})\n const controls = useRef<AnimationPlaybackControlsWithThen | null>(null)\n const styleKey = JSON.stringify(style)\n\n const shouldDebug =\n process.env.NODE_ENV === 'development' &&\n props['debug'] &&\n props['debug'] !== 'profile'\n\n const {\n dontAnimate = {},\n doAnimate,\n animationOptions,\n } = useMemo(() => {\n const motionAnimationState = getMotionAnimatedProps(\n props as any,\n style,\n disableAnimation\n )\n return motionAnimationState\n }, [isExiting, animationKey, styleKey])\n\n const animationsQueue = useRef<AnimationProps[]>([])\n const lastAnimateAt = useRef(0)\n const minTimeBetweenAnimations = 16.667\n const disposed = useRef(false)\n\n useIsomorphicLayoutEffect(() => {\n lastDontAnimate.current = dontAnimate\n })\n\n useEffect(() => {\n isFirstRender.current = false\n\n return () => {\n disposed.current = true\n }\n }, [])\n\n // useIsomorphicLayoutEffect(() => {\n // let disposed = false\n\n // // requestAnimationFrame(animationFrame)\n // // frame.postRender(animationFrame)\n\n // return () => {\n // disposed = true\n // }\n // }, [scope])\n\n const runAnimation = (props: AnimationProps) => {\n const waitForNextAnimationFrame = () => {\n // we just skip to the last one\n const queue = animationsQueue.current\n const last = queue[queue.length - 1]\n animationsQueue.current = []\n\n if (!last) {\n console.error(`Should never hit`)\n return\n }\n\n if (!props) return\n\n const elapsed = Date.now() - lastAnimateAt.current\n\n if (elapsed > minTimeBetweenAnimations && animationsQueue.current.length) {\n console.info('slow', elapsed, { props })\n }\n\n if (scope.current) {\n flushAnimation(props)\n } else {\n if (!disposed.current) {\n // frame.postRender(waitForNextAnimationFrame)\n requestAnimationFrame(waitForNextAnimationFrame)\n }\n }\n }\n\n const hasQueue = animationsQueue.current.length\n const shouldWait =\n hasQueue || Date.now() - lastAnimateAt.current > minTimeBetweenAnimations\n\n if (isExiting || isFirstRender.current || (scope.current && !shouldWait)) {\n flushAnimation(props)\n } else {\n animationsQueue.current.push(props)\n if (!hasQueue) {\n waitForNextAnimationFrame()\n }\n }\n }\n\n const flushAnimation = ({\n doAnimate,\n dontAnimate,\n animationOptions = {},\n }: AnimationProps) => {\n try {\n const node = stateRef.current.host\n\n if (!(node instanceof HTMLElement)) {\n return\n }\n\n if (!lastAnimationStyle.current) {\n lastAnimationStyle.current = style\n const firstAnimation = animate(scope.current, doAnimate || {}, {\n type: false,\n })\n firstAnimation.complete()\n // scope.animations = []\n\n if (shouldDebug) {\n console.groupCollapsed(`[motion] 🌊 FIRST`)\n console.info(doAnimate)\n console.groupEnd()\n }\n return\n }\n\n if (!doAnimate && !dontAnimate) {\n return\n }\n\n const next = doAnimate || {}\n\n // handle case where dontAnimate changes\n // we just set it onto animate + set options to not actually animate\n if (dontAnimate) {\n if (node) {\n const diff = getDiff(lastDontAnimate.current, dontAnimate)\n if (diff) {\n lastDontAnimate.current = dontAnimate\n Object.assign(node.style, dontAnimate as any)\n }\n for (const key in lastDontAnimate.current) {\n if (!(key in dontAnimate)) {\n console.info('deleting!', key, { dontAnimate, doAnimate })\n delete node.style[key]\n }\n }\n }\n }\n\n const diff = getDiff(lastAnimationStyle.current, next)\n\n if (shouldDebug) {\n console.groupCollapsed(\n `[motion] 🌊 animate (${JSON.stringify(diff, null, 2)})`\n )\n console.info({\n next,\n animationOptions,\n animationProps,\n diff,\n lastAnimationStyle: { ...lastAnimationStyle.current },\n isExiting,\n })\n console.groupEnd()\n }\n\n if (!diff) {\n return\n }\n\n lastAnimateAt.current = Date.now()\n controls.current = animate(scope.current, diff, animationOptions)\n lastAnimationStyle.current = next\n } finally {\n if (isExiting) {\n if (controls.current) {\n controls.current.finished.then(() => {\n sendExitComplete?.()\n })\n } else {\n sendExitComplete?.()\n }\n }\n }\n }\n\n useStyleEmitter?.((nextStyle) => {\n const animationProps = getMotionAnimatedProps(\n props as any,\n nextStyle,\n disableAnimation\n )\n runAnimation(animationProps)\n })\n\n // strict mode correctness fix, idk why i thought it would clear a useRef\n // before running strict? if you remove this you'll see the next\n // useLayoutEffect re-run and animate due to lastAnimationStyle.current\n // being set when in theory it should be clear\n useEffect(() => {\n return () => {\n lastAnimationStyle.current = null\n }\n }, [])\n\n useIsomorphicLayoutEffect(() => {\n if (!doAnimate && !isExiting) return\n\n // always clear queue if we re-render\n animationsQueue.current = []\n\n runAnimation({\n doAnimate,\n animationOptions,\n })\n }, [JSON.stringify(doAnimate), isExiting, lastAnimationStyle])\n\n const [initialStyle] = useState(() => ({ ...dontAnimate, ...doAnimate }))\n\n if (shouldDebug) {\n console.groupCollapsed(`[motion] 🌊 render`)\n console.info({\n style,\n doAnimate,\n dontAnimate,\n scope,\n animationOptions,\n initialStyle,\n isExiting,\n })\n console.groupEnd()\n }\n\n return {\n // avoid first render returning wrong styles - always render all, after that we can just mutate\n style: isFirstRender.current ? style : dontAnimate,\n ref: scope,\n tag: 'div',\n }\n },\n\n useAnimatedNumber(initial): UniversalAnimatedNumber<MotionAnimatedNumber> {\n const motionValue = useMotionValue(initial)\n\n return React.useMemo(\n () => ({\n getInstance() {\n return motionValue\n },\n getValue() {\n return motionValue.get()\n },\n setValue(next, config = { type: 'spring' }, onFinish) {\n if (config.type === 'direct') {\n MotionValueStrategy.set(motionValue, {\n type: 'direct',\n })\n motionValue.set(next)\n onFinish?.()\n } else {\n MotionValueStrategy.set(motionValue, config)\n\n if (onFinish) {\n const unsubscribe = motionValue.on('change', (value) => {\n if (Math.abs(value - next) < 0.01) {\n unsubscribe()\n onFinish()\n }\n })\n }\n\n motionValue.set(next)\n // Motion doesn't have a direct onFinish callback, so we simulate it\n }\n },\n stop() {\n motionValue.stop()\n },\n }),\n [motionValue]\n )\n },\n\n useAnimatedNumberReaction({ value }, onValue) {\n const instance = value.getInstance() as MotionValue<number>\n useMotionValueEvent(instance, 'change', onValue)\n },\n\n useAnimatedNumberStyle(val, getStyleProp) {\n const motionValue = val.getInstance() as MotionValue<number>\n const getStyleRef = useRef<typeof getStyleProp>(getStyleProp)\n\n // we need to change useAnimatedNumberStyle to have dep args to be concurrent safe\n getStyleRef.current = getStyleProp\n\n // never changes\n return useMemo(() => {\n return {\n getStyle: (cur) => {\n return getStyleRef.current(cur)\n },\n motionValue,\n } satisfies MotionAnimatedNumberStyle\n }, [])\n },\n }\n\n function getMotionAnimatedProps(\n props: { animation: AnimationProp | null; animateOnly?: string[] },\n style: Record<string, unknown>,\n disable: boolean\n ): AnimationProps {\n if (disable) {\n return {\n dontAnimate: style,\n }\n }\n\n const animationOptions = animationPropToAnimationConfig(props.animation)\n\n let dontAnimate: Record<string, unknown> | undefined\n let doAnimate: Record<string, unknown> | undefined\n\n const animateOnly = props.animateOnly as string[] | undefined\n for (const key in style) {\n const value = style[key]\n if (disableAnimationProps.has(key) || (animateOnly && !animateOnly.includes(key))) {\n dontAnimate ||= {}\n dontAnimate[key] = value\n } else {\n doAnimate ||= {}\n doAnimate[key] = value\n }\n }\n\n // half works in chrome but janky and stops working after first animation\n // if (\n // typeof doAnimate?.opacity !== 'undefined' &&\n // typeof dontAnimate?.backdropFilter === 'string'\n // ) {\n // if (!dontAnimate.backdropFilter.includes('opacity(')) {\n // dontAnimate.backdropFilter += ` opacity(${doAnimate.opacity})`\n // dontAnimate.WebkitBackdropFilter += ` opacity(${doAnimate.opacity})`\n // dontAnimate.transition = 'backdrop-filter ease-in 1000ms'\n // }\n // }\n\n return {\n dontAnimate,\n doAnimate,\n animationOptions,\n }\n }\n\n function animationPropToAnimationConfig(\n animationProp: AnimationProp | null\n ): AnimationOptions {\n let defaultAnimationKey = ''\n let specificAnimations = {}\n\n if (typeof animationProp === 'string') {\n defaultAnimationKey = animationProp\n } else if (Array.isArray(animationProp)) {\n if (typeof animationProp[0] === 'string') {\n defaultAnimationKey = animationProp[0]\n specificAnimations = animationProp[1]\n } else {\n specificAnimations = animationProp\n }\n }\n\n if (!defaultAnimationKey) {\n return {}\n }\n\n const defaultConfig = animations[defaultAnimationKey]\n\n return {\n default: defaultConfig,\n ...Object.fromEntries(\n Object.entries(specificAnimations).flatMap(\n ([propName, animationNameOrConfig]) => {\n if (typeof animationNameOrConfig === 'string') {\n return [[propName, animations[animationNameOrConfig]]]\n }\n if (animationNameOrConfig && typeof animationNameOrConfig === 'object') {\n return [\n [\n propName,\n {\n ...defaultConfig,\n ...animationNameOrConfig,\n },\n ],\n ]\n }\n return []\n }\n )\n ),\n }\n }\n}\n\n// sort of temporary\nconst disableAnimationProps = new Set<string>([\n 'alignContent',\n 'alignItems',\n 'aspectRatio',\n 'backdropFilter',\n 'boxSizing',\n 'contain',\n 'display',\n 'flexBasis',\n 'flexDirection',\n 'flexGrow',\n 'flexShrink',\n 'justifyContent',\n 'maxHeight',\n 'maxWidth',\n 'minHeight',\n 'minWidth',\n 'outlineColor',\n 'outlineStyle',\n 'outlineWidth',\n 'overflow',\n 'overflowX',\n 'overflowY',\n 'pointerEvents',\n 'position',\n 'textWrap',\n 'transformOrigin',\n 'zIndex',\n])\n\nconst MotionView = createMotionView('div')\nconst MotionText = createMotionView('span')\n\nfunction createMotionView(defaultTag: string) {\n // return forwardRef((props: any, ref) => {\n // console.info('rendering?', props)\n // const Element = motion[props.tag || defaultTag]\n // return <Element ref={ref} {...props} />\n // })\n const isText = defaultTag === 'span'\n\n const Component = forwardRef((propsIn: any, ref) => {\n const { forwardedRef, animation, tag = defaultTag, style, ...propsRest } = propsIn\n const [scope, animate] = useAnimate()\n const hostRef = useRef<HTMLElement>(null)\n const composedRefs = useComposedRefs(forwardedRef, ref, hostRef, scope)\n\n const stateRef = useRef<any>(null)\n if (!stateRef.current) {\n stateRef.current = {\n get host() {\n return hostRef.current\n },\n }\n }\n\n const [_, state] = useThemeWithState({})\n\n const styles = Array.isArray(style) ? style : [style]\n\n // we can assume just one animatedStyle max for now\n const [animatedStyle, nonAnimatedStyles] = (() => {\n return [\n styles.find((x) => x.getStyle) as MotionAnimatedNumberStyle | undefined,\n styles.filter((x) => !x.getStyle),\n ] as const\n })()\n\n function getProps(props: any) {\n const out = getSplitStyles(\n props,\n isText ? Text.staticConfig : View.staticConfig,\n state?.theme!,\n state?.name!,\n {\n unmounted: false,\n },\n {\n isAnimated: false,\n noClass: true,\n // noMergeStyle: true,\n resolveValues: 'auto',\n }\n )\n\n if (!out) {\n return {}\n }\n\n // we can definitely get rid of this here\n if (out.viewProps.style) {\n fixStyles(out.viewProps.style)\n styleToCSS(out.viewProps.style)\n }\n\n return out.viewProps\n }\n\n const props = getProps({ ...propsRest, style: nonAnimatedStyles })\n const Element = tag || 'div'\n const transformedProps = hooks.usePropsTransform?.(tag, props, stateRef, false)\n\n useEffect(() => {\n if (!animatedStyle) return\n\n return animatedStyle.motionValue.on('change', (value) => {\n const nextStyle = animatedStyle.getStyle(value)\n const animationConfig = MotionValueStrategy.get(animatedStyle.motionValue)\n const node = hostRef.current\n\n const webStyle = getProps({ style: nextStyle }).style\n\n if (webStyle && node instanceof HTMLElement) {\n const motionAnimationConfig =\n animationConfig?.type === 'timing'\n ? {\n type: 'tween',\n duration: (animationConfig?.duration || 0) / 1000,\n }\n : animationConfig?.type === 'direct'\n ? { type: 'tween', duration: 0 }\n : {\n type: 'spring',\n ...(animationConfig as any),\n }\n\n animate(node, webStyle as any, motionAnimationConfig)\n }\n })\n }, [animatedStyle])\n\n return <Element {...transformedProps} ref={composedRefs} />\n })\n\n Component['acceptTagProp'] = true\n\n return Component\n}\n\nfunction getDiff<T extends Record<string, unknown>>(\n previous: T | null,\n next: T\n): Record<string, unknown> | null {\n if (!previous) {\n return next\n }\n\n let diff: Record<string, unknown> | null = null\n for (const key in next) {\n if (next[key] !== previous[key]) {\n diff ||= {}\n diff[key] = next[key]\n }\n }\n return diff\n}\n"
10
+ "import {\n type AnimatedNumberStrategy,\n type AnimationDriver,\n type AnimationProp,\n fixStyles,\n getSplitStyles,\n hooks,\n styleToCSS,\n Text,\n type UniversalAnimatedNumber,\n useComposedRefs,\n useIsomorphicLayoutEffect,\n useThemeWithState,\n View,\n} from '@tamagui/core'\nimport { ResetPresence, usePresence } from '@tamagui/use-presence'\nimport {\n type AnimationOptions,\n type AnimationPlaybackControlsWithThen,\n type MotionValue,\n useAnimate,\n useMotionValue,\n useMotionValueEvent,\n type ValueTransition,\n} from 'motion/react'\nimport React, {\n forwardRef,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from 'react'\n\n// TODO: useAnimatedNumber style could avoid re-rendering\n\ntype MotionAnimatedNumber = MotionValue<number>\ntype AnimationConfig = ValueTransition\n\ntype MotionAnimatedNumberStyle = {\n getStyle: (cur: number) => Record<string, unknown>\n motionValue: MotionValue<number>\n}\n\nconst MotionValueStrategy = new WeakMap<MotionValue, AnimatedNumberStrategy>()\n\ntype AnimationProps = {\n doAnimate?: Record<string, unknown>\n dontAnimate?: Record<string, unknown>\n animationOptions?: AnimationOptions\n}\n\nexport function createAnimations<A extends Record<string, AnimationConfig>>(\n animationsProp: A\n): AnimationDriver<A> {\n // normalize, it doesn't assume type: 'spring' even if damping etc there so we do that\n // which also matches the moti driver\n // @ts-expect-error avoid doing a spread for no reason, sub-constraint type issue\n const animations: A = {}\n for (const key in animationsProp) {\n animations[key] = {\n type: 'spring',\n ...animationsProp[key],\n }\n }\n\n return {\n // this is only used by Sheet basically for now to pass result of useAnimatedStyle to\n View: MotionView,\n Text: MotionText,\n isReactNative: false,\n supportsCSS: true,\n needsWebStyles: true,\n avoidReRenders: true,\n animations,\n usePresence,\n ResetPresence,\n\n useAnimations: (animationProps) => {\n const { props, style, componentState, stateRef, useStyleEmitter, presence } =\n animationProps\n\n const animationKey = Array.isArray(props.animation)\n ? props.animation[0]\n : props.animation\n\n const isHydrating = componentState.unmounted === true\n const disableAnimation = isHydrating || !animationKey\n const isExiting = presence?.[0] === false\n const sendExitComplete = presence?.[1]\n\n const isFirstRender = useRef(true)\n const [scope, animate] = useAnimate()\n const lastAnimationStyle = useRef<Record<string, unknown> | null>(null)\n const controls = useRef<AnimationPlaybackControlsWithThen | null>(null)\n const styleKey = JSON.stringify(style)\n\n // until fully stable allow debugging in prod to help debugging prod issues\n const shouldDebug =\n // process.env.NODE_ENV === 'development' &&\n props['debug'] && props['debug'] !== 'profile'\n\n const {\n dontAnimate = {},\n doAnimate,\n animationOptions,\n } = useMemo(() => {\n const motionAnimationState = getMotionAnimatedProps(\n props as any,\n style,\n disableAnimation\n )\n return motionAnimationState\n }, [isExiting, animationKey, styleKey])\n\n const animationsQueue = useRef<AnimationProps[]>([])\n const lastAnimateAt = useRef(0)\n const minTimeBetweenAnimations = 16.667\n const disposed = useRef(false)\n const [firstRenderStyle] = useState(style)\n\n // avoid first render returning wrong styles - always render all, after that we can just mutate\n const lastDontAnimate = useRef<Record<string, unknown>>(firstRenderStyle)\n\n useLayoutEffect(() => {\n return () => {\n disposed.current = true\n }\n }, [])\n\n // useIsomorphicLayoutEffect(() => {\n // let disposed = false\n\n // // requestAnimationFrame(animationFrame)\n // // frame.postRender(animationFrame)\n\n // return () => {\n // disposed = true\n // }\n // }, [scope])\n\n const runAnimation = (props: AnimationProps) => {\n const waitForNextAnimationFrame = () => {\n // we just skip to the last one\n const queue = animationsQueue.current\n const last = queue[queue.length - 1]\n animationsQueue.current = []\n\n if (!last) {\n console.error(`Should never hit`)\n return\n }\n\n if (!props) return\n\n const elapsed = Date.now() - lastAnimateAt.current\n\n if (elapsed > minTimeBetweenAnimations && animationsQueue.current.length) {\n console.info('slow', elapsed, { props })\n }\n\n if (scope.current) {\n flushAnimation(props)\n } else {\n if (!disposed.current) {\n // frame.postRender(waitForNextAnimationFrame)\n requestAnimationFrame(waitForNextAnimationFrame)\n }\n }\n }\n\n const hasQueue = animationsQueue.current.length\n const shouldWait =\n hasQueue ||\n (lastAnimateAt.current &&\n Date.now() - lastAnimateAt.current > minTimeBetweenAnimations)\n\n if (isExiting || isFirstRender.current || (scope.current && !shouldWait)) {\n flushAnimation(props)\n } else {\n animationsQueue.current.push(props)\n if (!hasQueue) {\n waitForNextAnimationFrame()\n }\n }\n }\n\n const updateFirstAnimationStyle = () => {\n const node = stateRef.current.host\n\n if (!(node instanceof HTMLElement)) {\n return false\n }\n\n if (!lastAnimationStyle.current) {\n lastAnimationStyle.current = style\n const firstAnimation = animate(scope.current, doAnimate || {}, {\n type: false,\n })\n firstAnimation.complete()\n scope.animations = []\n\n if (shouldDebug) {\n console.groupCollapsed(`[motion] 🌊 FIRST`)\n console.info(doAnimate)\n console.groupEnd()\n }\n return true\n }\n\n return false\n }\n\n const flushAnimation = ({\n doAnimate,\n dontAnimate,\n animationOptions = {},\n }: AnimationProps) => {\n try {\n const node = stateRef.current.host\n\n if (!(node instanceof HTMLElement)) {\n return\n }\n\n if (!doAnimate && !dontAnimate) {\n return\n }\n\n const next = doAnimate || {}\n\n // handle case where dontAnimate changes\n // we just set it onto animate + set options to not actually animate\n if (dontAnimate) {\n const curDontAnimate = lastDontAnimate.current\n if (node && curDontAnimate) {\n for (const key in curDontAnimate) {\n if (!(key in style)) {\n console.info('deleting!', key, { dontAnimate, doAnimate })\n delete node.style[key]\n }\n }\n const newDontAnimate = getDiff(curDontAnimate, dontAnimate)\n if (newDontAnimate) {\n Object.assign(node.style, newDontAnimate as any)\n }\n }\n }\n\n lastDontAnimate.current = dontAnimate || {}\n\n if (updateFirstAnimationStyle()) {\n return\n }\n\n const diff = getDiff(lastAnimationStyle.current, next)\n\n if (shouldDebug) {\n console.groupCollapsed(\n `[motion] 🌊 animate (${JSON.stringify(diff, null, 2)})`\n )\n console.info({\n next,\n animationOptions,\n animationProps,\n diff,\n lastAnimationStyle: { ...lastAnimationStyle.current },\n isExiting,\n })\n console.trace()\n console.groupEnd()\n }\n\n lastAnimationStyle.current = next\n lastAnimateAt.current = Date.now()\n\n if (!diff) {\n return\n }\n\n controls.current = animate(scope.current, diff, animationOptions)\n } finally {\n if (isExiting) {\n if (controls.current) {\n controls.current.finished.then(() => {\n sendExitComplete?.()\n })\n } else {\n sendExitComplete?.()\n }\n }\n }\n }\n\n useStyleEmitter?.((nextStyle) => {\n const animationProps = getMotionAnimatedProps(\n props as any,\n nextStyle,\n disableAnimation\n )\n runAnimation(animationProps)\n })\n\n // strict mode correctness fix, idk why i thought it would clear a useRef\n // before running strict? if you remove this you'll see the next\n // useLayoutEffect re-run and animate due to lastAnimationStyle.current\n // being set when in theory it should be clear\n useEffect(() => {\n return () => {\n lastAnimationStyle.current = null\n }\n }, [])\n\n const animateKey = JSON.stringify(doAnimate)\n\n useIsomorphicLayoutEffect(() => {\n if (isFirstRender.current) {\n updateFirstAnimationStyle()\n isFirstRender.current = false\n return\n }\n\n if (!doAnimate && !isExiting) return\n\n // always clear queue if we re-render\n animationsQueue.current = []\n\n // don't ever queue on a render\n flushAnimation({\n doAnimate,\n dontAnimate,\n animationOptions,\n })\n }, [animateKey, isExiting, lastAnimationStyle])\n\n const [initialStyle] = useState(() => ({ ...dontAnimate, ...doAnimate }))\n\n if (shouldDebug) {\n console.groupCollapsed(`[motion] 🌊 render`)\n console.info({\n style,\n doAnimate,\n dontAnimate,\n animateKey,\n scope,\n animationOptions,\n initialStyle,\n isExiting,\n isFirstRender: isFirstRender.current,\n })\n console.groupEnd()\n }\n\n return {\n // we never change this, after first render on\n style: firstRenderStyle,\n ref: scope,\n tag: 'div',\n }\n },\n\n useAnimatedNumber(initial): UniversalAnimatedNumber<MotionAnimatedNumber> {\n const motionValue = useMotionValue(initial)\n\n return React.useMemo(\n () => ({\n getInstance() {\n return motionValue\n },\n getValue() {\n return motionValue.get()\n },\n setValue(next, config = { type: 'spring' }, onFinish) {\n if (config.type === 'direct') {\n MotionValueStrategy.set(motionValue, {\n type: 'direct',\n })\n motionValue.set(next)\n onFinish?.()\n } else {\n MotionValueStrategy.set(motionValue, config)\n\n if (onFinish) {\n const unsubscribe = motionValue.on('change', (value) => {\n if (Math.abs(value - next) < 0.01) {\n unsubscribe()\n onFinish()\n }\n })\n }\n\n motionValue.set(next)\n // Motion doesn't have a direct onFinish callback, so we simulate it\n }\n },\n stop() {\n motionValue.stop()\n },\n }),\n [motionValue]\n )\n },\n\n useAnimatedNumberReaction({ value }, onValue) {\n const instance = value.getInstance() as MotionValue<number>\n useMotionValueEvent(instance, 'change', onValue)\n },\n\n useAnimatedNumberStyle(val, getStyleProp) {\n const motionValue = val.getInstance() as MotionValue<number>\n const getStyleRef = useRef<typeof getStyleProp>(getStyleProp)\n\n // we need to change useAnimatedNumberStyle to have dep args to be concurrent safe\n getStyleRef.current = getStyleProp\n\n // never changes\n return useMemo(() => {\n return {\n getStyle: (cur) => {\n return getStyleRef.current(cur)\n },\n motionValue,\n } satisfies MotionAnimatedNumberStyle\n }, [])\n },\n }\n\n function getMotionAnimatedProps(\n props: { animation: AnimationProp | null; animateOnly?: string[] },\n style: Record<string, unknown>,\n disable: boolean\n ): AnimationProps {\n if (disable) {\n return {\n dontAnimate: style,\n }\n }\n\n const animationOptions = animationPropToAnimationConfig(props.animation)\n\n let dontAnimate: Record<string, unknown> | undefined\n let doAnimate: Record<string, unknown> | undefined\n\n const animateOnly = props.animateOnly as string[] | undefined\n for (const key in style) {\n const value = style[key]\n if (disableAnimationProps.has(key) || (animateOnly && !animateOnly.includes(key))) {\n dontAnimate ||= {}\n dontAnimate[key] = value\n } else {\n doAnimate ||= {}\n doAnimate[key] = value\n }\n }\n\n // half works in chrome but janky and stops working after first animation\n // if (\n // typeof doAnimate?.opacity !== 'undefined' &&\n // typeof dontAnimate?.backdropFilter === 'string'\n // ) {\n // if (!dontAnimate.backdropFilter.includes('opacity(')) {\n // dontAnimate.backdropFilter += ` opacity(${doAnimate.opacity})`\n // dontAnimate.WebkitBackdropFilter += ` opacity(${doAnimate.opacity})`\n // dontAnimate.transition = 'backdrop-filter ease-in 1000ms'\n // }\n // }\n\n return {\n dontAnimate,\n doAnimate,\n animationOptions,\n }\n }\n\n function animationPropToAnimationConfig(\n animationProp: AnimationProp | null\n ): AnimationOptions {\n let defaultAnimationKey = ''\n let specificAnimations = {}\n\n if (typeof animationProp === 'string') {\n defaultAnimationKey = animationProp\n } else if (Array.isArray(animationProp)) {\n if (typeof animationProp[0] === 'string') {\n defaultAnimationKey = animationProp[0]\n specificAnimations = animationProp[1]\n } else {\n specificAnimations = animationProp\n }\n }\n\n if (!defaultAnimationKey) {\n return {}\n }\n\n const defaultConfig = animations[defaultAnimationKey]\n\n return {\n default: defaultConfig,\n ...Object.fromEntries(\n Object.entries(specificAnimations).flatMap(\n ([propName, animationNameOrConfig]) => {\n if (typeof animationNameOrConfig === 'string') {\n return [[propName, animations[animationNameOrConfig]]]\n }\n if (animationNameOrConfig && typeof animationNameOrConfig === 'object') {\n return [\n [\n propName,\n {\n ...defaultConfig,\n ...animationNameOrConfig,\n },\n ],\n ]\n }\n return []\n }\n )\n ),\n }\n }\n}\n\n// sort of temporary\nconst disableAnimationProps = new Set<string>([\n 'alignContent',\n 'alignItems',\n 'aspectRatio',\n 'backdropFilter',\n 'boxSizing',\n 'contain',\n 'display',\n 'flexBasis',\n 'flexDirection',\n 'flexGrow',\n 'flexShrink',\n 'justifyContent',\n 'marginRight',\n 'marginLeft',\n 'marginBottom',\n 'marginTop',\n 'maxHeight',\n 'maxWidth',\n 'minHeight',\n 'minWidth',\n 'outlineColor',\n 'outlineStyle',\n 'outlineWidth',\n 'overflow',\n 'overflowX',\n 'overflowY',\n 'pointerEvents',\n 'position',\n 'textWrap',\n 'transformOrigin',\n 'zIndex',\n 'WebkitBackdropFilter',\n])\n\nconst MotionView = createMotionView('div')\nconst MotionText = createMotionView('span')\n\nfunction createMotionView(defaultTag: string) {\n // return forwardRef((props: any, ref) => {\n // console.info('rendering?', props)\n // const Element = motion[props.tag || defaultTag]\n // return <Element ref={ref} {...props} />\n // })\n const isText = defaultTag === 'span'\n\n const Component = forwardRef((propsIn: any, ref) => {\n const { forwardedRef, animation, tag = defaultTag, style, ...propsRest } = propsIn\n const [scope, animate] = useAnimate()\n const hostRef = useRef<HTMLElement>(null)\n const composedRefs = useComposedRefs(forwardedRef, ref, hostRef, scope)\n\n const stateRef = useRef<any>(null)\n if (!stateRef.current) {\n stateRef.current = {\n get host() {\n return hostRef.current\n },\n }\n }\n\n const [_, state] = useThemeWithState({})\n\n const styles = Array.isArray(style) ? style : [style]\n\n // we can assume just one animatedStyle max for now\n const [animatedStyle, nonAnimatedStyles] = (() => {\n return [\n styles.find((x) => x.getStyle) as MotionAnimatedNumberStyle | undefined,\n styles.filter((x) => !x.getStyle),\n ] as const\n })()\n\n function getProps(props: any) {\n const out = getSplitStyles(\n props,\n isText ? Text.staticConfig : View.staticConfig,\n state?.theme!,\n state?.name!,\n {\n unmounted: false,\n },\n {\n isAnimated: false,\n noClass: true,\n // noMergeStyle: true,\n resolveValues: 'auto',\n }\n )\n\n if (!out) {\n return {}\n }\n\n // we can definitely get rid of this here\n if (out.viewProps.style) {\n fixStyles(out.viewProps.style)\n styleToCSS(out.viewProps.style)\n }\n\n return out.viewProps\n }\n\n const props = getProps({ ...propsRest, style: nonAnimatedStyles })\n const Element = tag || 'div'\n const transformedProps = hooks.usePropsTransform?.(tag, props, stateRef, false)\n\n useEffect(() => {\n if (!animatedStyle) return\n\n return animatedStyle.motionValue.on('change', (value) => {\n const nextStyle = animatedStyle.getStyle(value)\n const animationConfig = MotionValueStrategy.get(animatedStyle.motionValue)\n const node = hostRef.current\n\n const webStyle = getProps({ style: nextStyle }).style\n\n if (webStyle && node instanceof HTMLElement) {\n const motionAnimationConfig =\n animationConfig?.type === 'timing'\n ? {\n type: 'tween',\n duration: (animationConfig?.duration || 0) / 1000,\n }\n : animationConfig?.type === 'direct'\n ? { type: 'tween', duration: 0 }\n : {\n type: 'spring',\n ...(animationConfig as any),\n }\n\n animate(node, webStyle as any, motionAnimationConfig)\n }\n })\n }, [animatedStyle])\n\n return <Element {...transformedProps} ref={composedRefs} />\n })\n\n Component['acceptTagProp'] = true\n\n return Component\n}\n\nfunction getDiff<T extends Record<string, unknown>>(\n previous: T | null,\n next: T\n): Record<string, unknown> | null {\n if (!previous) {\n return next\n }\n\n let diff: Record<string, unknown> | null = null\n for (const key in next) {\n if (next[key] !== previous[key]) {\n diff ||= {}\n diff[key] = next[key]\n }\n }\n return diff\n}\n"
11
11
  ],
12
12
  "version": 3
13
13
  }