mirror of
https://github.com/olehomelchenko/astrolabe.git
synced 2026-08-08 02:02:33 +00:00
Datasets: make preview scroll region keyboard-reachable
This commit is contained in:
@@ -349,11 +349,15 @@ function DatasetDetail({
|
||||
<h4 className={styles.sectionTitle}>Preview</h4>
|
||||
{previewRows ? (
|
||||
<>
|
||||
{/* TODO: a11y — this scroll container isn't keyboard-reachable; when the
|
||||
preview overflows, keyboard-only users can't scroll it (WCAG 2.1.1).
|
||||
A council pass should decide the pattern (tabindex=0 + aria-label region,
|
||||
or a different overflow treatment) before we lean on it more. */}
|
||||
<div className={styles.previewTableWrap}>
|
||||
{/* A scrollable region needs a tab stop + name so keyboard-only users can
|
||||
reach and scroll it when the preview overflows (WCAG 2.1.1; WAI-ARIA APG
|
||||
— a focusable `region` with an accessible name). */}
|
||||
<div
|
||||
className={styles.previewTableWrap}
|
||||
role="region"
|
||||
aria-label={`Data preview for ${dataset.name}`}
|
||||
tabIndex={0}
|
||||
>
|
||||
<table className={styles.previewTable}>
|
||||
<thead>
|
||||
<tr>
|
||||
|
||||
Reference in New Issue
Block a user