Election Result Card

name: "Election Result Card"
short_description: A vote-tally card with candidate bars, percentages, and a projected winner.
long_visual_description: >
  A card with the race title and reporting status, and candidate rows with a check for the
  winner, name/party, percentage and votes, and a party-coloured bar.

use_cases:
  - Election results.
  - Vote tally card.
  - Race results widget.
  - Live election board.
  - Poll results.

recommended_for:
  - A race's vote tallies with a projected winner.
avoid_for:
  - A generic bar chart (use chart-card-bar).

markets:
  - Global

example_usage: >
  Provide candidates with votes and precomputed percentages; mark the winner and set party
  tones.

props:
  title: The race title.
  status: The reporting status.
  candidates: The candidates with votes, percentage, tone, and winner flag.

example_prompts:
  - "Add an election result card with a projected winner."
  - "Add a vote-tally widget with candidate bars."

lifecycle: experimental
content_model: A race's vote tallies with a winner.

theming:
  tokens_used:
    - --color-surface
    - --color-surface-raised
    - --color-on-surface
    - --color-on-surface-muted
    - --color-primary
    - --color-accent
    - --color-warning
    - --color-info
    - --color-success
    - --color-border
    - --radius-card
    - --radius-pill
    - --shadow-card
    - --font-heading
    - --space-card

editorial_guidance: >
  Show reporting status; the winner is flagged by a check and label, not colour alone.

categorization:
  category: News
  subcategory: Data
  atomic_type: organism
  usage_type: [stat]
  maturity: ai-generated
  wcag:
    level: AA
    notes: Each bar uses role="progressbar" with a label; the winner has a labelled check; votes/percentages are real text.
  keyboard_support: "none"
  seo_score: 45
  text_direction: both