Expandable Card
A card component that expands into a modal to reveal more content with smooth animations.
npx shadcn@latest add @roiui/expandable-cardnpx shadcn@latest add @roiui/expandable-card-tailwindComponent props
Prop
Type
Default
Name
itemDescription
The item data for the expandable card
Type
ExpandableCardItemDefault
-
Name
classNameDescription
Additional CSS classes to apply to the wrapper
Type
stringDefault
-
Component props
Prop
Type
Default
Name
idDescription
Unique identifier for the card (used for layout animations)
Type
string | numberDefault
-
Name
imageSrcDescription
Source URL for the card image
Type
stringDefault
-
Name
altDescription
Alt text for the card image
Type
stringDefault
-
Name
cardHeadingDescription
The heading text displayed on the card
Type
stringDefault
-
Name
contentDescription
The content to display when the card is expanded
Type
ReactNodeDefault
-