The Accordion rendering creates a vertically collapsing panel group using Bootstrap’s Collapse JavaScript plugin. Each child Accordion Item can be independently expanded or collapsed, providing a compact way to present grouped content.
The accordion supports multiple visual styles via the AccordionStyle parameter (Droplink to dictionary phrases that map to CSS theme classes). The Flush parameter removes default background-color and rounded borders, rendering accordion items edge-to-edge with their parent container. The Always open parameter disables the mutual-exclusion behavior, allowing multiple panels to remain expanded simultaneously.
Content inside each Accordion Item is placed via a nested bs-section placeholder, supporting any renderings (Paragraph, Rich Text, Cards, etc.) as child content.
Accordion
Style 2 (light-gray) — Default
Uses the default AccordionStyle. Panels collapse exclusively (clicking one closes the others). No flush.
Style 1 (dark-gray) — Flush
Sets Flush = 1 to remove borders and rounded corners. Uses the dark-gray style for a high-contrast appearance.
Style 3 (off-white) — Always Open
Sets Always open = 1 so multiple panels can remain expanded simultaneously. Uses the off-white style for a lighter background.
Usage Notes
Accordion
Control Properties
Standard Values / Defaults
| Parameter | Default Value |
|---|---|
| AccordionStyle | {15CB83F5-CF16-444C-B1F7-97670ECCDB15} (default style dictionary entry) |
| Flush | Unchecked (0) |
| Always open | Unchecked (0) |
Parameters Template: {2CF26F1A-7186-4A65-AE57-B7FCEF97F9F7}
Accordion Rendering Parameters
| Parameter | Type | Description |
|---|---|---|
| AccordionStyle | Droplink | Selects the visual style/color theme for the accordion header buttons. References a dictionary phrase whose value is applied as a CSS class. |
| Flush | Checkbox | Removes the default background-color and borders to render accordions edge-to-edge with their parent container. |
| Always open | Checkbox | When checked, all accordion items stay open independently (no auto-collapse behavior). |
Accordion Item Rendering Parameters
| Parameter | Type | Description |
|---|---|---|
| Title | Single-Line Text | The heading text displayed on the accordion button. |
| Always open | Checkbox | Overrides parent behavior; this specific item stays open regardless of siblings. |
Template Properties
Placeholders:
- bs-accordion – Holds Accordion Item renderings inside an Accordion container.
- bs-section – Inside each Accordion Item; holds content renderings (Paragraph, Rich Text, etc.).