Accordion

tile/accordion

Organizes content into vertically stacked, expandable sections. Each section has a header and nested content.

This component has no configurable properties. Provide content through child components.

Use an accordion to organize content into vertically stacked, expandable sections to reduce visual clutter on dense screens. An accordion has no attributes of its own. To provide content in an accordion, use tile/accordionItem child components.

To draw attention to the first section, open it by default with isExpanded and add an iconName for a visual cue in the header.

For richer sections, wrap multiple pieces in a tile/column to stack them, and mix in tile/badge or tile/button.

Consider these guidelines when working with accordions.

  • Keep section titles concise and descriptive so users can scan headers to find what they need.
  • To surface the most important section immediately, set isExpanded on one item rather than leaving every section collapsed.
  • Sections expand and collapse independently, so more than one can be open at once. Use per-item isExpanded to seed which sections start open.
  • When content should always be visible or is short enough not to warrant collapsing, use a tile/column instead of hiding it behind an accordion.

Note any limitations that apply to this component.

No known limitations for tile/accordion in Slackbot.

No known limitations for tile/accordion in ChatGPT.

No known limitations for tile/accordion in Agentforce.