Details
Details is a styled component to enhance the native behaviors of the <details> element.
On this page
Description
Use DetailsComponent to reveal content after clicking a button.
Arguments
| Name | Type | Default | Description |
|---|---|---|---|
overlay | Symbol |
| Dictates the type of overlay to render with. One of |
reset | Boolean |
| Defaults to false. If set to true, it will remove the default caret and remove style from the summary element |
disabled | Boolean |
| Whether or not to disable the summary button. |
system_arguments | Hash | N/A |
Examples
Slots
summary
Use the Summary slot as the target for toggling the Details content open/closed.
| Name | Type | Default | Description |
|---|---|---|---|
button | Boolean | N/A | Whether or not to render the summary element as a button. |
aria_label_open | String | N/A | Defaults to "Collapse". Value to announce when details element is open. |
aria_label_closed | String | N/A | Defaults to "Expand". Value to announce when details element is closed. |
body
Use the Body slot as the main content to be shown when triggered by the Summary.
| Name | Type | Default | Description |
|---|---|---|---|
tag | Symbol |
| One of |
kwargs | Hash | N/A | The same arguments as System arguments. |
Methods
disabled
Returns the value of attribute disabled.
disabled?
Returns the value of attribute disabled.
open
Returns the value of attribute open.
open?
Returns the value of attribute open.