Docs draft
PosterCard
Component storyFigma (PosterCard set) ↗React component ↗DSDS entity ↗
When to use it
media-card MediaCard.Variants
state · rest / hover / focus / loading — Hover washes the poster; focus is the 2px text/primary ring; loading is the skeleton.
Anatomy
thumbnail — .Thumbnail Poster (2:3), same state machinery as MediaCard.
title row — Title (label-lg) + Trailing slot for kebab/actions.
meta slot — The old Metadata axis (Default/History/Rating/Upcoming) as a slot: default is meta text; drop in StarRating or a date row instead.
select — Selectable boolean composes a real Checkbox over the poster (the old Select axis: edit-history and crunchylist modes).
Design specifications
| width | 160px, poster 2:3 |
| title | type.label-lg in color.text.primary |
| meta | type.body-sm in color.text.secondary |
| gap | space.8 |
| focus-ring | 2px color.text.primary, offset 2 |
Accessibility
In select mode the card stops being a link — the checkbox is the interactive element, labeled 'Select {title}'. Brazil rating marks compose RatingMark (system brazil) in the thumbnail Label slot; the mark carries its own role=img name, so the card adds nothing.