Docs Components
EntityCardexperimental
The grid tile for collections, layouts, and campaigns: artwork on top, status badge in the corner, title and details below. The entire card is the click target.
States
rest— Plate border, no shadow.hover— plate-sm shadow lift (interactive Card behavior).
API
| Prop | Type | Description |
|---|---|---|
title required | string | Entity name. |
status required | Status | Renders through StatusBadge — no tone escape hatch. |
imageUrl / imageAlt | string | Thumbnail; falls back to a paper monogram. |
platforms | ReactNode | Platform icons with aria-labels (Web/Mobile/TV). |
owner / timestamp required | string | Avatar + relative time in the meta row. |
onOpen required | function | Whole-card activation, keyboard included. |
thumb | ReactNode | Custom thumbnail content (overrides imageUrl) — layouts render a live module schematic here; the entity draws its own portrait. |
Guidelines
- shouldSecondary actions (duplicate, delete) live in a DropdownMenu that stops propagation — never bare icons on the card.
- shouldTimestamps are relative ('4 months ago') with the absolute date on title/tooltip.
- mustEntityCard collections lay out with the .entity-grid utility (auto-fill, min 4.5×space-10 columns) — never ad-hoc inline grids, and never the styleguide-only .sg-card-grid class.
Guidelines
- mustThe thumbnail StatusBadge automatically receives the on-media backplate; never place bare washes over covers.