Concert Card

name: "Concert Card"
short_description: A tour date row with a date block, venue/city, and a tickets action.
long_visual_description: >
  A row with a date block (month/day), the venue and city, and a tickets button (or a disabled
  sold-out state).

use_cases:
  - Tour date listing.
  - Concert row.
  - Live dates list.
  - Event tour schedule.
  - Tickets prompt.

recommended_for:
  - A single tour date with a tickets action.
avoid_for:
  - A full event hero (use event-hero).

markets:
  - Global

example_usage: >
  Show the date block, venue, and city; the tickets button is disabled when sold out.

props:
  month: The month abbreviation.
  day: The day.
  venue: The venue.
  city: The city.
  status: The sale status.
  soldout: Whether it's sold out.

example_prompts:
  - "Add a concert tour date card with tickets."
  - "Add a sold-out concert row."

lifecycle: experimental
content_model: A tour date with a tickets action.

theming:
  tokens_used:
    - --color-surface
    - --color-surface-raised
    - --color-on-surface
    - --color-on-surface-muted
    - --color-primary
    - --color-primary-contrast
    - --color-border
    - --radius-card
    - --radius-button
    - --shadow-card
    - --font-heading
    - --space-card
    - --duration-token

editorial_guidance: >
  Show the date prominently; sold-out is a labelled, disabled state.

categorization:
  category: Music
  subcategory: Live
  atomic_type: molecule
  usage_type: [card, list-item]
  maturity: ai-generated
  wcag:
    level: AA
    notes: Sold-out shows a "Sold out" label (not colour alone) and is non-interactive; venue/date are real text.
  keyboard_support: The tickets button is focusable and activates on Enter/Space.
  seo_score: 40
  text_direction: both