Accordion

From the Base UI reference for Accordion and the installed AccordionRoot, AccordionItem, AccordionTrigger and AccordionPanel. "From" says who does it.

The arrow keys, Home and End do nothing: Base UI 1.9.0 follows the APG's update to the accordion pattern, which drops the roving focus, and the component adds no keys of its own.

What axe won't catch, from the contract, each with how this component meets it:

• Everything the eye is told, the ear is told, for every shape each prop accepts: whether a panel is open, which the chevron shows, is the trigger's aria-expanded; a disabled trigger's tertiary colour is the native disabled; the chevron itself is aria-hidden.
• Every landmark and named region has an accessible name: each open panel is a region named by its trigger through Base UI's aria-labelledby, so its name is the item's title, which is required.
• Every default label can be overridden: none here; Accordion owns no strings.
• Every shape the type accepts renders, in every variant: title renders a string, an element and a list alike, as phrasing content in the button; children renders a string, an element and a list alike in the panel's <div>.
• A hidden copy kept for animation is aria-hidden, and a collapsed region is inert: a closed panel is unmounted, or with keepMounted or hiddenUntilFound kept hidden, which takes it out of the accessibility tree and the Tab order as inert would; Accordion keeps no copy for animation: a closing panel is the panel itself, shrinking for duration.switch under a trigger that already says aria-expanded="false", then unmounted or hidden by Base UI.
• Native semantics first: a native <h3> holding a native <button>, with Base UI's aria-expanded, aria-controls and the panel's region named by aria-labelledby; no ARIA from the caller.
• Focus moves in reading order and returns on close: Tab goes from a trigger into its open panel and on to the next trigger, in document order; closing a panel leaves focus on the trigger that closed it.
• Every target is at least size.target-min square: the smallest target is a trigger with a one-word title, size.button (36 px) tall and the accordion's full width.
• Loops stop when the system asks for less motion: no loop; the panel's height and the chevron's turn are transitions over duration.switch, which the tokens shorten to 0.01 ms under reduced motion, so both change at once with no query in the component (CR-10).

No owned strings: every word comes from the caller, as an item's title and its children.

For a caller using the component, with the reason. Each row is a rule: a must row's Don't is never right, a should row's needs a reason, and Checked by says what catches the Don't in a caller's code.