Accessibility

For accessibility, we will follow w3org aria practices.

WAI-ARIA Roles, States, and Properties:

According to WAI/ARIA,

• for a visible accordion panel the corresponding header button should have aria-expanded=true, and for a non-visible panel, aria-expanded=false
  


• each accordion header should be contained in an element with role=button
  


• The accordion header button element should have aria-controls set to the ID of the corresponding accordion panel

There are more aria guidelines and for more please check this link.

function Accordion(..) { …

accessibility aria element false panel practices react role roles set true will