Accordion

{
  "$bloktastic": {
    "version": "1.0.0"
  },
  "name": "accordion",
  "display_name": "Accordion",
  "is_root": false,
  "is_nestable": true,
  "schema": {
    "items": {
      "type": "bloks",
      "pos": 0,
      "required": true,
      "restrict_components": true,
      "component_whitelist": [
        "accordion_item"
      ],
      "description": "Accordion entries"
    },
    "allow_multiple_open": {
      "type": "boolean",
      "pos": 1,
      "default_value": false,
      "description": "Allow multiple panels open"
    },
    "first_open": {
      "type": "boolean",
      "pos": 2,
      "default_value": false,
      "description": "Open first panel by default"
    },
    "style": {
      "type": "option",
      "pos": 3,
      "default_value": "default",
      "options": [
        {
          "name": "Default",
          "value": "default"
        },
        {
          "name": "Bordered",
          "value": "bordered"
        },
        {
          "name": "Separated",
          "value": "separated"
        }
      ]
    }
  },
  "preview_field": null
}

# Accordion Component

## Purpose
Build an accessible accordion for FAQs and stacked disclosure content.

## Storyblok Schema Fields
- `items` (bloks, required)
- `allow_multiple_open` (boolean)
- `first_open` (boolean)
- `style` (option)

## Visual Requirements
- Header row with title and chevron icon.
- Smooth open/close animation.
- Support default, bordered, and separated variants.

## Accessibility
- WAI-ARIA accordion semantics.
- Keyboard toggle via Enter/Space.
- Visible focus styling.

## Edge Cases
- Empty list should not render container.
- Extremely long titles should wrap.
- Respect reduced-motion preference.

# @bloktastic/accordion

Expandable accordion with style variants for FAQ-like content.

## Install

```bash
bloktastic add @bloktastic/accordion
```