from
RequiredDescription
Passing React elements to "from" is required.
Type
ReactElement<any, string | JSXElementConstructor<any>>Leave Yamada UI a star
StarFlip is a component that provides an animation to switch between two elements while flipping.
Description
Passing React elements to "from" is required.
Type
ReactElement<any, string | JSXElementConstructor<any>>Description
Passing React elements to "to" is required.
Type
ReactElement<any, string | JSXElementConstructor<any>>Description
The HTML element to render.
Type
keyof IntrinsicElementsDescription
The visual color appearance of the component.
Type
"blackAlpha" | "whiteAlpha" | "amber" | "blue" | "info" | "link" | "primary" | "cyan" | "emerald" | "flashy" | "fuchsia" | "gray" | "green" | "success" | "indigo" | "lime" | "neutral" | "orange" | "warning" | "pink" | "purple" | "red" | "danger" | "rose" | "sky" | "teal" | "violet" | "secondary" | "yellow"Description
You can set the initial state.
Type
FlipIdentDefault
'from'Description
The animation delay.
Type
numberDefault
0Description
If true, the component is disabled.
Type
booleanDefault
falseDescription
The animation duration.
Type
numberDefault
0.4Description
If true, the component is disabled.
Deprecated
Use disabled instead.
Type
booleanDefault
falseDescription
If true, the component is readonly.
Deprecated
Use readOnly instead.
Type
booleanDefault
falseDescription
This is a callback function that is called when the animation state changes.
Type
(value: FlipIdent) => voidDescription
The orientation of the flip effect. Determines whether the flip occurs horizontally or vertically.
Type
FlipOrientationDefault
'horizontal'Description
If true, the component is readonly.
Type
booleanDefault
falseDescription
The size of the Flip.
Type
stringDescription
The animation transition.
Type
TransitionDescription
Use this when you want to control the animation from outside the component.
Type
FlipIdentDescription
The variant of the Flip.
Type
stringEdit this page on GitHub