Datasets: make preview scroll region keyboard-reachable

src/app/components/DatasetsModal.tsx

@@ -349,11 +349,15 @@ function DatasetDetail({
         <h4 className={styles.sectionTitle}>Preview</h4>
         {previewRows ? (
           <>
-            {/* TODO: a11y — this scroll container isn't keyboard-reachable; when the
+            {/* A scrollable region needs a tab stop + name so keyboard-only users can
-                preview overflows, keyboard-only users can't scroll it (WCAG 2.1.1).
+                reach and scroll it when the preview overflows (WCAG 2.1.1; WAI-ARIA APG
-                A council pass should decide the pattern (tabindex=0 + aria-label region,
+                — a focusable `region` with an accessible name). */}
-                or a different overflow treatment) before we lean on it more. */}
+            <div
-            <div className={styles.previewTableWrap}>
+              className={styles.previewTableWrap}
+              role="region"
+              aria-label={`Data preview for ${dataset.name}`}
+              tabIndex={0}
+            >
               <table className={styles.previewTable}>
                 <thead>
                   <tr>