Files
cadence-ui/docs/exec-plans/2026-03-25-motion-accessibility-and-selection-pass.md
T

94 lines
4.3 KiB
Markdown

# Motion Accessibility And Selection Pass
- Status: `completed`
- Owner: `codex`
- Date: `2026-03-25`
## Goal
Polish the remaining low-level interaction motion gaps called out in the motion review, with an
emphasis on reduced-motion correctness, selection-state feedback, and bringing lower-tier
components closer to the established `Command` / `Combobox` / `Tabs` motion quality bar.
## Scope
- In scope:
- add explicit reduced-motion handling for continuous loader animation surfaces
- soften `Checkbox` and `RadioGroup` selection feedback with short scale/fade indicator motion
- give `Tooltip` a light rise to match the rest of the overlay family
- reduce layout-heavy motion where it is currently doing too much work in `Accordion`,
`Sparkbar`, and `Progress`
- polish `Select` list motion so it feels closer to `Combobox` and `Command`
- update focused tests and stories when the behavior contract changes
- Out of scope:
- introducing new animation dependencies
- expanding public APIs unless a small compatibility-safe prop is justified
- broad visual restyling unrelated to motion or reduced-motion behavior
## Constraints
- Respect `DESIGN.md` and keep one calm, spatial motion language.
- Treat `packages/ui/src/components/progress*` as main-thread-owned because reduced-motion and
motion-refinement requirements both land there.
- Do not revert or overwrite unrelated in-progress repo changes.
- Preserve static-motion behavior through `data-motion="static"` and make OS-level reduced motion
behave equivalently for continuous animation surfaces.
## Ownership
- Main thread:
- `packages/ui/src/components/progress*`
- final review, integration, and validation
- Worker 1:
- `packages/ui/src/components/spinner.tsx`
- `packages/ui/src/components/skeleton.tsx`
- nearest tests/stories if needed
- Worker 2:
- `packages/ui/src/components/checkbox*`
- `packages/ui/src/components/radio-group*`
- nearest tests/stories if needed
- Worker 3:
- `packages/ui/src/components/tooltip*`
- nearest tests/stories if needed
- Worker 4:
- `packages/ui/src/components/accordion*`
- `packages/ui/src/components/sparkbar*`
- nearest tests/stories if needed
- Worker 5:
- `packages/ui/src/components/select*`
- nearest tests/stories if needed
## Plan
1. Write the execution plan and keep `Progress` under main-thread ownership.
2. Dispatch five isolated workers for loaders, selection controls, tooltip, accordion/sparkbar,
and select.
3. Implement `Progress` reduced-motion and motion refinements locally.
4. Review and integrate the worker slices, then fix any shared token or contract issues.
5. Run focused tests for the changed surfaces and a narrow typecheck/docs pass if needed.
## Validation
- `pnpm --filter @ai-ui/ui exec vitest run packages/ui/src/components/progress.test.tsx`
- `pnpm --filter @ai-ui/ui exec vitest run packages/ui/src/components/checkbox.test.tsx packages/ui/src/components/radio-group.test.tsx`
- `pnpm --filter @ai-ui/ui exec vitest run packages/ui/src/components/tooltip.test.tsx`
- `pnpm --filter @ai-ui/ui exec vitest run packages/ui/src/components/accordion.test.tsx packages/ui/src/components/sparkbar.test.tsx`
- `pnpm --filter @ai-ui/ui exec vitest run packages/ui/src/components/select.test.tsx`
- `pnpm --filter @ai-ui/ui exec tsc --noEmit`
## Status Log
- `2026-03-25 17:18` started the focused pass after motion review identified reduced-motion gaps,
low-fidelity selection feedback, and one remaining `Select` polish gap
- `2026-03-25 17:19` wrote the execution plan, kept `progress.*` under main-thread ownership, and
dispatched five isolated workers for loaders, selection controls, tooltip, accordion/sparkbar,
and select
- `2026-03-25 17:22` landed the main-thread `Progress` refactor: reduced-motion detection now
collapses indeterminate animation, the linear bar scales with `transform` instead of animating
layout width, and segmented indeterminate progress falls back to a static partial fill when
motion is reduced
- `2026-03-25 17:24` reviewed and accepted worker slices for loaders, selection controls, tooltip,
accordion/sparkbar, and select polish
- `2026-03-25 17:25` validated the combined result set with focused component tests plus
`pnpm --filter @ai-ui/ui exec tsc --noEmit` and `pnpm --dir apps/docs exec tsc --noEmit`