Layout
Accordion
Expandable/collapsible sections. Supports multi-expand mode and smooth CSS grid animations.
LlmAccordionGroup + LlmAccordionItemDemo
A component library designed for AI-generated applications. Consistent APIs for React and Angular.
Run
npm install @atelier-ui/react and import the styles from @atelier-ui/react/styles/tokens.css.This item cannot be expanded.
<LlmAccordionGroup variant="separated">
<LlmAccordionItem>
<span llmAccordionHeader>Question 1</span>
Answer content goes here.
</LlmAccordionItem>
<LlmAccordionItem>
<span llmAccordionHeader>Question 2</span>
Another answer here.
</LlmAccordionItem>
</LlmAccordionGroup>API
| Prop | Type | Default | Description |
|---|---|---|---|
multi | boolean | false | Allow multiple items expanded simultaneously |
variant | 'default' | 'bordered' | 'separated' | 'default' | Visual style of the group |
Import
import { LlmAccordionGroup, LlmAccordionItem } from '@atelier-ui/react';