GalactrexAccountCards
CreativeInteractive Card
A checkbox for selection, quick actions that slide in on hover or focus, and a selected state that lifts and outlines it.
Install
Included with Creative: needs your API key. Initialize and log in once.
npx @galactrex/ui add interactive-cardUsage
import { InteractiveCard } from "@/components/galactrex/interactive-card";
<InteractiveCard title="hero.png" selected={sel} onSelectedChange={setSel} actions={[…]} />Source
Installs to components/galactrex/interactive-card.tsx, with the shared motion primitives beside it.
Source for this component comes with its plan. Install it with the command above, or open your licensed copy here.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
title | string | — | Title. |
children / media | ReactNode | — | Body and visual. |
selected | boolean | — | Selected state. |
onSelectedChange | (selected) => void | — | Shows the checkbox. |
actions | { label; icon; onSelect }[] | — | Quick actions. |
className | string | — | Extra classes for the outer element. |
Variants
- Asset library. Grid of selectable files.
Accessibility
- Real checkbox and labelled buttons; actions appear on focus too.
Motion and reduced motion
- CSS transitions and a spring lift.
- Reduced motion: no slide.