rc-disclosure
Disclosure wrapper for a native <details>/<summary> pair with controlled open state, following the WAI-ARIA Disclosure pattern.
- Package
@rcarls/rc-disclosure- Element
<rc-disclosure>- Native dependency
- Requires a native details child
- State model
- Controlled or uncontrolled open state
- Main events
rc-disclosure-toggle- Related
- Theme previews
Installation
- npm
- Yarn
npm install @rcarls/rc-disclosure
yarn add @rcarls/rc-disclosure
import '@rcarls/rc-disclosure/define';
Live demo
Open state
Use default-open when the disclosure should manage its own state after initialization. Use
the open property or attribute when the host owns the state; user interaction then emits
rc-disclosure-toggle with the requested state, and the rendered disclosure continues to
follow the controlled value. Assign undefined to the JavaScript open property to release
control and return to the current uncontrolled/default state.
The required direct child <details> remains connected and owns the native disclosure
interaction, keyboard behavior, and accessibility semantics.
Theming
The default demo mode shows the component without a package theme. Use the shared preview controls on this page to compare inherited, light, and dark color schemes or to apply the optional Material theme only inside the demo frames.
API
Properties
| Property | Markup | Type | Default | Description |
|---|---|---|---|---|
open | JS property only | boolean | Not specified | Current open state. Host writes are silent; assign `undefined` to release control. |
defaultOpen | JS property only | boolean | Not specified | Initial open state for uncontrolled usage. |
Methods
No public methods are documented in the custom elements manifest.
Events
| Event | Detail type | Description |
|---|---|---|
TOGGLE_EVENT | CustomEvent | No description provided. |
rc-disclosure-toggle | No detail type documented | Fires when the child `<details>` toggles. |
Slots
No slots are documented in the custom elements manifest.
CSS Custom Properties
No CSS custom properties are documented in the custom elements manifest.
CSS Parts
No CSS parts are documented in the custom elements manifest.