← Inventory
IconCard
A selectable card pairing an icon over a label, for option pickers such as property-type or category choices; renders a native button and forwards its props.
Usage
import { IconCard, IconCardProps } from "@desk/ui/components/icon-card";Best practices
IconCardis itself a native<button>— wireselected/onClickand drive a single-select group in state; don't nest it in another button or anchor.Pass a Lucide component to
icon(e.g.HomeIcon), not a rendered element<HomeIcon />— it is handed to the internalIconfor consistent sizing/stroke.Use
IconCardfor compact icon-over-label option pickers (property type, category); for a content container with header/body reach forCard, and for a settings row useSettingsCard.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| icon | LucideIcon | The icon to display | |
| label | string | Label text below the icon | |
| selected | boolean | Whether the card is currently selected | |
| testId | string |
Also exports
- interface
IconCardProps
Composition
Builds on