Frontile's components handle a substantial amount of accessibility work for you: focus management, keyboard navigation, and the ARIA attributes each component's role requires are built in and covered by the test suite. This section documents the mechanisms that are shared across components. For the exact ARIA attributes and keyboard bindings a specific component uses, see that component's own Accessibility section — for example Table's , Modal's , or Dropdown's .
Frontile owns:
aria-modal,
aria-invalid).:focus-visible behavior that shows a focus ring for keyboard users without showing
one for mouse users.You own:
aria-label
or aria-labelledby to a Modal, or wrapping icon-only buttons in VisuallyHidden text.Modal.Header.Every component's .md file has its own ## Accessibility section documenting the exact
ARIA attributes it sets and the exact keys it responds to. This section (docs/accessibility/)
covers the shared mechanisms behind those components — read both when you need the full
picture for a specific component.
Frontile's integration test suite asserts ARIA attributes and keyboard behavior across the
component set — concentrated in roving-focus-test.gts, listbox-test.gts, table-test.gts,
command-test.gts, dropdown-test.gts, select-test.gts, autocomplete-test.gts, and
segmented-control-test.gts, plus the forms and overlays suites. That gives strong regression
coverage for the behavior these docs describe, but it is not the same as a formal accessibility
audit or a tested matrix of screen readers and browsers. If you're shipping something
compliance-critical, test it yourself with a real screen reader (VoiceOver, NVDA, or JAWS) —
don't rely on Frontile's test suite as a substitute.