Progress accessibility

WCAG 2.1 AA — release blocker

Semantics

• Renders with role="progressbar".
• Determinate mode sets aria-valuenow, aria-valuemin (0), and aria-valuemax.
• Indeterminate mode omits aria-valuenow — screen readers announce "progress busy".
• label prop maps to aria-label for an accessible name.

Visual

• Tone colours meet 4.5:1 contrast against the track background.
• The showValue percentage text uses tabular-nums for stable width during updates.
• Indeterminate animation uses CSS only — no JavaScript timers that could stall.

Sizes

• sm (6px), md (10px), lg (16px) — all above the minimum 4px touch target for non-interactive elements.

Labelling

• Always provide a label prop for screen reader context (e.g. "Uploading file").
• When using showValue, the visible percentage supplements the label.

Audit checklist

• Screen reader announces progress role and current value.
• Indeterminate mode is announced as busy/indeterminate.
• aria-label is set when label prop is provided.
• Tone colours meet 4.5:1 contrast ratio.
• Animation respects prefers-reduced-motion (future enhancement).