Source: PRD-018 SC-2 audit, finding [Logic-C2].
template/src/widgets/timeline/ui/Timeline.svelte:151-160
The Timeline's collapse control was previously a <button> with aria-expanded={!collapsed} — disclosure semantics. Migration replaced it with <Toggle pressed={!snapshotStore.collapsed}>. Toggle communicates aria-pressed (a two-state button), which is not the same as aria-expanded (a disclosure widget that controls visibility of another region).
Screen readers will now announce "toggle button, pressed" instead of "expanded" / "collapsed".
Fix
Replace <Toggle> with <Button> plus an explicit aria-expanded={!collapsed} aria-controls="timeline-body" — OR extend shared/ui/toggle/Toggle.svelte to accept and forward an aria-expanded prop (and document on /playground that pressed-as-disclosure is a supported pattern).
Acceptance
- The collapse control announces "expanded" / "collapsed" with screen readers.
aria-controls points to the Timeline body region for navigation.
Audit traceability
- Reviewer: Logic & Correctness, score 7/10
- File:
template/src/widgets/timeline/ui/Timeline.svelte
Source: PRD-018 SC-2 audit, finding [Logic-C2].
template/src/widgets/timeline/ui/Timeline.svelte:151-160The Timeline's collapse control was previously a
<button>witharia-expanded={!collapsed}— disclosure semantics. Migration replaced it with<Toggle pressed={!snapshotStore.collapsed}>. Toggle communicatesaria-pressed(a two-state button), which is not the same asaria-expanded(a disclosure widget that controls visibility of another region).Screen readers will now announce "toggle button, pressed" instead of "expanded" / "collapsed".
Fix
Replace
<Toggle>with<Button>plus an explicitaria-expanded={!collapsed} aria-controls="timeline-body"— OR extendshared/ui/toggle/Toggle.svelteto accept and forward anaria-expandedprop (and document on/playgroundthat pressed-as-disclosure is a supported pattern).Acceptance
aria-controlspoints to the Timeline body region for navigation.Audit traceability
template/src/widgets/timeline/ui/Timeline.svelte