Expandable | NookDocs

Usage

<Expandable> is a lightweight inline disclosure — a small chevron + title that toggles a child block in and out. Use it for nested API parameters, advanced options, or any "details on demand" content that would clutter the page if shown inline.

<Expandable title="advanced options">
  <ParamField name="retryCount" type="number" default="3">
    Number of times to retry failed requests.
  </ParamField>
  <ParamField name="retryDelay" type="number" default="1000">
    Milliseconds to wait between retries.
  </ParamField>
</Expandable>

Nested API parameters

The most common use case: documenting an object-typed parameter and disclosing its properties on demand.

<ParamField name="user" type="object" required>
  The user object passed to the request body.

  <Expandable title="properties">
    <ParamField name="user.id" type="string" required>
      Unique identifier.
    </ParamField>
    <ParamField name="user.email" type="string" required>
      Valid email address.
    </ParamField>
    <ParamField name="user.role" type="enum" enum={["admin", "editor", "viewer"]}>
      Role assigned to the user.
    </ParamField>
  </Expandable>
</ParamField>

userobjectrequired

The user object passed to the request body.

Default open

Pre-open the disclosure with defaultOpen if the content is important enough that you want most readers to see it without clicking:

<Expandable title="example response" defaultOpen>
  ```json
  { "id": "abc123", "status": "ok" }
  ```
</Expandable>

Nesting

Expandables can nest inside each other for deeply hierarchical data:

<Expandable title="settings">
  <Expandable title="theme">
    <ParamField name="theme.primary" type="string">
      Primary color.
    </ParamField>
  </Expandable>
  <Expandable title="layout">
    <ParamField name="layout.maxWidth" type="number">
      Max content width in pixels.
    </ParamField>
  </Expandable>
</Expandable>

The left border indents each level visually so readers can track depth.

Differences from `<Accordion>`

	`<Expandable>`	`<Accordion>`
Visual weight	Light — small chevron + text	Heavy — full bordered card
Grouping	Single instance, no value pairing	Multiple items with shared open state
Designed for	Inline nested content	FAQs, standalone disclosure groups
Composition	Nests inside ParamField, etc.	Top-level page section

If you have a list of independent FAQ items, use <Accordion>. If you have one nested object in an API parameter, use <Expandable>.

Props

Prop	Type	Default	Description
`title`	`string`	required	Disclosure title shown next to the chevron
`defaultOpen`	`boolean`	`false`	Whether the content is visible on first render
`children`	`ReactNode`	required	Disclosure body