Skip to content

Commit fede3f6

Browse files
committed
fix: transition view
Signed-off-by: Innei <[email protected]>
1 parent daa50a1 commit fede3f6

File tree

1 file changed

+23
-26
lines changed

1 file changed

+23
-26
lines changed

src/components/ui/transition/factor.tsx

+23-26
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { forwardRef, memo, useState } from 'react'
44
import { m } from 'framer-motion'
55
import type {
66
HTMLMotionProps,
7+
MotionProps,
78
Spring,
89
Target,
910
TargetAndTransition,
@@ -50,36 +51,32 @@ export const createTransitionView = (params: TransitionViewParams) => {
5051
>
5152

5253
const [stableIsHydrationEnded] = useState(isHydrationEnded)
54+
55+
const motionProps: MotionProps = {
56+
initial: initial || from,
57+
animate: to,
58+
transition: {
59+
duration,
60+
...(preset || microReboundPreset),
61+
...animation.enter,
62+
delay: enter / 1000,
63+
},
64+
exit: {
65+
...from,
66+
transition: {
67+
duration,
68+
...animation.exit,
69+
delay: exit / 1000,
70+
} as TargetAndTransition['transition'],
71+
},
72+
}
5373
if (lcpOptimization && !stableIsHydrationEnded) {
54-
return <div>{props.children}</div>
74+
motionProps.initial = to
75+
delete motionProps.animate
5576
}
5677

5778
return (
58-
<MotionComponent
59-
initial={initial || from}
60-
ref={ref}
61-
animate={{
62-
...to,
63-
transition: {
64-
duration,
65-
...(preset || microReboundPreset),
66-
...animation.enter,
67-
delay: enter / 1000,
68-
},
69-
}}
70-
exit={{
71-
...from,
72-
transition: {
73-
duration,
74-
...animation.exit,
75-
delay: exit / 1000,
76-
} as TargetAndTransition['transition'],
77-
}}
78-
transition={{
79-
duration,
80-
}}
81-
{...rest}
82-
>
79+
<MotionComponent ref={ref} {...motionProps} {...rest}>
8380
{props.children}
8481
</MotionComponent>
8582
)

0 commit comments

Comments
 (0)