Save Button
An icon button that toggles a saved/unsaved heart with a spring-pop animation. Built on the IconButton primitive and inherits all its variants and sizes.
core/save-buttonInstallation
1 · Add registry to components.json
2 · Install component
Examples
Default
Click the button to toggle saved state.
Sizes
Three size variants inherited from IconButton.
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
saved | boolean | false | Whether the item is currently saved. |
savedClassName | string | — | Class applied to the filled heart when saved (defaults to fill-red-500). |
size | "sm" | "default" | "lg" | "default" | Inherited from IconButton. |
variant | "ghost" | "outline" | "default" | "ghost" | Inherited from IconButton. |
onClick | (e: MouseEvent) => void | — | Click handler — called on every press. |