EntityCard
A card for one thing (a product, place, person or listing): an image, title, subtitle, description, a price or meta line, a badge, a rating and up to three buttons. href opens a page, and onClick is sent when it is bound. Use a Grid of EntityCards for several things.
Examples
Loading examples…
Props
| Prop | Type | Description |
|---|---|---|
title | string | The name |
subtitle | string | A second line, for example the brand or category |
description | string | Up to three lines |
image | string | An image URL |
imageAspectRatio | string | Default "4 / 3" |
meta | string | A short fact line, for example "$29 / month" or "Open until 22:00" |
badge | object | |
rating | number | 0 to 5, shown as stars |
ratingCount | number | The number of ratings |
href | string | Opens this URL in a new tab when the user clicks the card |
actions | object[] | Up to three buttons. A button without href sends onAction with its label |
layout | "vertical" | "horizontal" | Default "vertical". "horizontal" puts the image on the left |
width | number | string |
Events
onClick· Sent when the user clicks the card and it has no href.onAction· Sent when the user clicks a button without href. The args carry the label of the button.