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 IntrinsicElements
Description
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
FlipIdent
Default
'from'
Description
The animation delay.
Type
number
Default
0
Description
If true
, the component is disabled.
Type
boolean
Default
false
Description
The animation duration.
Type
number
Default
0.4
Description
If true
, the component is disabled.
Deprecated
Use disabled
instead.
Type
boolean
Default
false
Description
If true
, the component is readonly.
Deprecated
Use readOnly
instead.
Type
boolean
Default
false
Description
This is a callback function that is called when the animation state changes.
Type
(value: FlipIdent) => void
Description
The orientation of the flip effect. Determines whether the flip occurs horizontally or vertically.
Type
FlipOrientation
Default
'horizontal'
Description
If true
, the component is readonly.
Type
boolean
Default
false
Description
The size of the Flip.
Type
string
Description
The animation transition.
Type
Transition
Description
Use this when you want to control the animation from outside the component.
Type
FlipIdent
Description
The variant of the Flip.
Type
string
Edit this page on GitHub