DisclosureGroup
Groups multiple Disclosure components together, optionally restricting to a single open item at a time.
Single Mode
By default, only one disclosure can be open at a time.
Multiple Mode
Set allowMultiple to let multiple disclosures stay open simultaneously.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
allowMultiple | boolean | false | Whether multiple disclosures can be open simultaneously. When false, opening one closes others. |
--mantle-bg | CSS variable | theme default | Override the background color via style. e.g. style={{ "--mantle-bg": "#1a1a2e" }} |
--mantle-border | CSS variable | theme default | Override the border color via style. Set to "transparent" to remove. e.g. style={{ "--mantle-border": "#e94560" }} |
--mantle-text | CSS variable | theme default | Override the text color via style. e.g. style={{ "--mantle-text": "#ffffff" }} |
--mantle-ring | CSS variable | accent | Override the focus ring color via style. e.g. style={{ "--mantle-ring": "#e94560" }} |
allowMultiplefalsebooleanWhether multiple disclosures can be open simultaneously. When false, opening one closes others.
--mantle-bgtheme defaultCSS variableOverride the background color via style. e.g. style={{ "--mantle-bg": "#1a1a2e" }}
--mantle-bordertheme defaultCSS variableOverride the border color via style. Set to "transparent" to remove. e.g. style={{ "--mantle-border": "#e94560" }}
--mantle-texttheme defaultCSS variableOverride the text color via style. e.g. style={{ "--mantle-text": "#ffffff" }}
--mantle-ringaccentCSS variableOverride the focus ring color via style. e.g. style={{ "--mantle-ring": "#e94560" }}