Accordion
The Accordion
component can be used to group information, reveal and hide
content.
AccordionProps
Signature:
export declare type AccordionProps< extends > = <> & (<> | <>);
AccordionOwnProps
extends
, , ,
Name | Type | Default | Description |
---|---|---|---|
multiple? | false | Determines whether multiple sections can be open at the same time. | |
triggerPosition? | | | 'end' | The position of the trigger that expands and collapses a section. |
onExpandChange? | (value: <>) => | - | Callback fired when a section is expanded/collapsed. |
interactive? | true | If the accordion is interactive, the whole header is interactive and can open or close the accordion. Otherwise, only the button is interactive | |
color? | | | | | | 'neutral' | The color of the accordion. Setting the color affects the button, label, content and divider color. |
size? | | | 'default' | The size of the accordion. |
showDividers? | true | Whether a divider is shown between the sections. |
AccordionControlledProps
Name | Type | Default | Description |
---|---|---|---|
expanded | extends true ? : | - | Determines which sections are expanded in a controlled scenario. |
AccordionUncontrolledProps
Name | Type | Default | Description |
---|---|---|---|
defaultExpanded? | extends true ? : | false | Determines which sections are initially expanded in an uncontrolled scenario. |
Accordion.Section
AccordionSectionProps
Signature:
export declare type AccordionSectionProps<E extends > = <E, >;
Still have questions?
Find answers in the Dynatrace Community