fix(coach): keep the result table's scroll area reachable from the keyboard

This commit is contained in:
Marc-André Bombeck committed 2026-09-27 15:59:42 +02:00
1 parent 98f2875f8e
commit 7d82a32fa9
1 file changed
+7 -6
@@ -173,13 +173,14 @@ export function CoachResultTable({
<div
id={regionId}
data-slot="coach-result-table-scroll"
{...(expanded
? { role: "region", tabIndex: 0, "aria-labelledby": titleId }
: {})}
// The region scrolls sideways on a narrow screen even when collapsed,
// so it is always reachable from the keyboard.
role="region"
tabIndex={0}
aria-labelledby={titleId}
className={cn(
"overflow-x-auto rounded-b-lg",
expanded &&
"focus-visible:ring-ring/50 max-h-96 overflow-y-auto overscroll-contain outline-none focus-visible:ring-2",
"focus-visible:ring-ring/50 overflow-x-auto rounded-b-lg outline-none focus-visible:ring-2",
expanded && "max-h-96 overflow-y-auto overscroll-contain",
)}
>
<table className="w-full text-sm">