mirror of
https://github.com/MBombeck/HealthLog.git
synced 2026-11-09 21:10:59 +00:00
Marc-André Bombeck
d9fe0e5487
Programmatic `scrollIntoView` / `scrollTo` calls in the settings shell, admin shell, and coach message thread ignored the user's reduced-motion preference — a WCAG 2.3.3 violation. Add a single `scrollBehaviorForUser` helper in `src/lib/motion.ts` that returns `"auto"` when SSR or when `(prefers-reduced-motion: reduce)` matches, and `"smooth"` otherwise. Wire it through the three call-sites; tests cover all three branches.
14 lines
612 B
TypeScript
14 lines
612 B
TypeScript
// v1.4.43 W5-H5 — single source of truth for `behavior` on the four
|
|
// programmatic `scrollIntoView` / `scrollTo` call-sites in the app.
|
|
// `prefers-reduced-motion: reduce` users were previously animated against
|
|
// their OS-level preference, which is a WCAG 2.3.3 violation. The helper
|
|
// returns `"auto"` whenever a window is unavailable (SSR) or when the
|
|
// reduced-motion media query matches.
|
|
|
|
export function scrollBehaviorForUser(): ScrollBehavior {
|
|
if (typeof window === "undefined") return "auto";
|
|
return window.matchMedia("(prefers-reduced-motion: reduce)").matches
|
|
? "auto"
|
|
: "smooth";
|
|
}
|