Collapsible
A collapsible allows users to hide or display a section of content.
Props
Name | Type | Default | Description |
---|---|---|---|
id required | string | Unique identifier for the Collapsible | |
actions | IActionOptions[] | ||
addedSelectedOption | IDropdownOption | ||
attributeToFormat | string | ||
attributeToSort | string | ||
calendarId | string | ||
children | ReactNode | ||
className | string | Additionnal CSS classes for the outer most container of the Collapsible | |
collapsibleToggleIcon | ReactNode | Set to render a custom toggle icon | |
color | string | ||
currentOption | number | ||
date | Date | ||
disabled | boolean | false | Whether the collapsible is disabled |
disabledValues | string[] | ||
expanded | boolean | ||
expandedOnMount | boolean | false | Whether the collapsible is expanded on mount |
facet | string | ||
facetRow | IFacet | ||
filterText | string | ||
headerClasses | string | Additionnal CSS classes for the header | |
headerContent | ReactNode | Custom JSX inside the header | |
ids | string[] | ||
initialPerPage | number | ||
initialTableData | ITableData | ||
isCollapsible | boolean | ||
isDirty | boolean | ||
isInError | boolean | ||
isOpen | boolean | ||
isRange | boolean | ||
isSelected | boolean | ||
item | string | ||
label | string | ||
limit | string | ||
onClick | () => void | Callback called when container is clicked | |
options | IInlinePromptOptions | ||
pageNb | number | ||
perPage | number | ||
predicates | ITablePredicate[] | ||
searching | boolean | ||
selected | string | ||
shouldResetPage | boolean | ||
tableId | string | ||
tableStateModifier | ITableStateModifier | ||
toggleIconClassName | string | Additionnal CSS classes for the toggle icon | |
totalEntries | number | ||
totalPages | number | ||
valid | boolean | ||
value | string | ||
withBorders | boolean | false | Whether the collapsible has borders |
yPosition | number |
Examples
Info box wrapper
Expanded on mount
Disabled
No guidelines exist for CollapsibleConnected yet.