Access, by design.

Native elements first. Clear labels, keyboard access, and visible states throughout.

Built-in behavior

• Button uses a native button, defaults to type="button", and disables activation while loading.
• TextField associates labels, hints, and errors with its input. An error sets aria-invalid.
• Table uses native table markup and column headers. Sorting belongs to the application, which sets aria-sort.
• AppShell uses a mobile disclosure rather than a modal. Escape closes the navigation and restores focus to its toggle.
• Skeleton is hidden from assistive technology. Place a live loading message on the surrounding container.

Your application’s responsibilities

Supply meaningful labels, error messages, headings, table captions, and link names. Never rely on badge color alone. Native attributes and refs stay available for your application’s needs.

Motion and themes

Focus remains visible in both themes. Reduced motion disables spinner and skeleton animation. Compact visual density does not remove keyboard affordances.

Verification

Automated axe checks, interaction tests, and visual inspection complement manual keyboard and screen-reader review. Passing an automated scan does not establish complete accessibility conformance.

W3C authoring guidance ↗ · Storybook accessibility testing ↗