The collapsible component is used to put long sections of information under a block that merchants can expand or collapse.

Examples

<.collapsible id="collapsible-default-default" open>
  <.text as="h2" variant="bodyMd">Content inside a collapse</.text>
</.collapsible>

{:noreply, Collapsible.push_close(socket, "MyId")}

See

• https://polaris.shopify.com/components/utilities/collapsible
• https://github.com/Shopify/polaris/blob/main/polaris-react/src/components/Collapsible/Collapsible.tsx

Attributes

• id (:string) (required) - Assign a unique ID to the collapsible. For accessibility, pass this ID as the value of the triggering component’s aria-controls prop.
• expand_on_print (:boolean) - Option to show collapsible content when printing. Defaults to false.
• open (:boolean) - Toggle whether the collapsible is expanded or not. Defaults to false.
• variant (:string) - The direction the collapsible collapses in. Defaults to "block".
• phx_hook (:string) - Defaults to "OctantisInteractable".

Slots

• inner_block