Disclosure

A collapsible section that expands to reveal its content under a title and optional caption.

Prop	Type	Default	Notes
`title`	String	`required`	Required summary headline.
`caption`	String	`nil`	Optional muted subtitle under the title.
`open`	Boolean	`false`	Initial expanded state (default false).
`**html_options`	Hash	—	Extra attrs on the root <details>.

Default

Disclosure

This is some content.

1	<%= render DisclosureComponent.new(title: "Disclosure") do %>
2	This is some content.
3	<% end %>

Open

Disclosure

This is some content.

1	<%= render DisclosureComponent.new(title: "Disclosure", open: true) do %>
2	This is some content.
3	<% end %>

Open with caption

Disclosure This is an optional caption

This is some content.

1	<%= render DisclosureComponent.new(title: "Disclosure", caption: "This is an optional caption", open: true) do %>
2	This is some content.
3	<% end %>

With caption

Disclosure This is an optional caption

This is some content.

1	<%= render DisclosureComponent.new(title: "Disclosure", caption: "This is an optional caption") do %>
2	This is some content.
3	<% end %>

With nested components

Site settings Connect your domain

https://

<%= render DisclosureComponent.new(title: "Site settings", caption: "Connect your domain", open: true) do %>
  <div class="stack col gap-12">
    <%= render TextFieldWithPrefixComponent.new(prefix: "https://", name: "url", placeholder: "your-site.com") %>
    <%= render ButtonComponent.new(label: "Save") %>
  </div>
<% end %>

1	<%= render DisclosureComponent.new(title: "Site settings", caption: "Connect your domain", open: true) do %>
2	<div class="stack col gap-12">
3	<%= render TextFieldWithPrefixComponent.new(prefix: "https://", name: "url", placeholder: "your-site.com") %>
4	<%= render ButtonComponent.new(label: "Save") %>
5	</div>
6	<% end %>