a12s-1.0.0-beta7/modules/patterns/templates/patterns/accordion/accordion.ui_patterns.yml

accordion:
  label: Accordion
  description: >
    Implementation of accordion pattern, following the specifications in
    https://www.w3.org/WAI/ARIA/apg/patterns/accordion/
  fields:
    sections:
      type: array
      label: Sections
      preview:
        - label: Section 1
          content: >
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ut ante vestibulum, aliquet purus non,
            eleifend mauris. Donec vel odio non felis lobortis interdum eu a mauris.
        - label: Section 2
          content: >
            Aenean ornare, nisl nec tincidunt lobortis, lacus enim facilisis orci, nec eleifend lorem orci quis ex. Orci
            varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
        - label: Section 3
          content: >
            Proin tincidunt, neque a fermentum luctus, est risus porttitor urna, et posuere dolor nisi non nunc. Nulla
            mollis pharetra varius. Aenean id lacinia elit. Sed fringilla felis ac elit finibus sodales.
    active_sections:
      type: array
      label: Active sections
      description: >
        [optional] The indexes of the active sections. This takes precedence on the active flag which may be defined for
        each section.
      preview:
        - 1
    namespace:
      type: string
      label: Accordion namespace
      description: >
        [optional] The namespace is a unique identifier for the group of sections, and should be unique par page. If not
        provided, a random string is generated as namespace.
      preview: preview
  settings:
    wrap_header:
      type: select
      label: Wrap headers
      description: Wrap the headers with an HTML tag.
      options:
        div: DIV
        heading: Heading
      default: null
    title-level:
      type: select
      label: Title Level
      description: The heading level for the title.
      options:
        h1: Heading 1
        h2: Heading 2
        h3: Heading 3
        h4: Heading 4
      states:
        visible:
          ':input[name=wrap_header]':
            value: heading
      default: h2
  libraries:
    - a12s_theme_builder/disclosure-accordion
    - accordion:
        css:
          component:
            css/accordion.css: {}