Accordion

[Willienn]

Accordion

An accordion allows users to toggle the display of content by expanding or collapsing sections.

Tasks:

• [ ] Accordion
  • [x] multiple: supports multiple panels expanded simultaneously
  • [x] defaultOpenItems: default value for the uncontrolled state of the panel.
  • [x] collapsible: indicates if Accordion support multiple Panels closed at the same time.
  • [ ] navigation: indicates if keyboard navigation is available and gives two options, linear or circular navigation.
  • [x] circular
  • [ ] linear
  • [x] onToggle: Callback to be called when the opened items change.
  • [x] openItems: Controls the state of the panel.
• [x] AccordionItem
  • [x] disabled: disables opening/closing of panel.
  • [x] expand icon: accordion item can have a custom expand icon.
• [x] AccordionHeader
  • [x] button: the component to be used as button in heading.
  • [x] expandIcon: expand icon slot rendered before (or after) children content in heading.
  • [x] icon: expand icon slot rendered before (or after) children content in heading.
  • [x] as: "div" "h1" "h2" "h3" "h4" "h5" "h6".
  • [x] expandIconPosition: the position of the expand icon slot in heading.
  • [x] inline: indicates if the AccordionHeader should be rendered inline.
  • [x] size: size of spacing in the heading. "small" "medium" "large" "extra-large".
• [x] AccordionPanel
  • [x] as: "div"
• [x] behavior: follow behavior specified here

[Willienn]

The navigation > linear need further search about how implement it.