---
title: Expandable, Icon, Tooltip, Update
description: The remaining four components.
---

## `Expandable`

<ParamField name="title" type="string" required>
  The summary line.
</ParamField>

<ParamField name="defaultOpen" type="boolean" default="false">
  Renders expanded.
</ParamField>

Children: rich content.

`Expandable` is a single disclosure with no group container. Use `Accordion` inside an
`AccordionGroup` when several disclosures belong together; use `Expandable` for a lone
one — typically a nested object's fields under a `ParamField`.

## `Icon`

<ParamField name="icon" type="icon" required>
  Which icon to render. Reed's prop is `icon`, not `name`.
</ParamField>

<ParamField name="label" type="string">
  Accessible label. Supply one whenever the icon carries meaning rather than decoration.
</ParamField>

No children.

## `Tooltip`

<ParamField name="tip" type="string" required>
  The hover text.
</ParamField>

Children: inline content — the text the tooltip attaches to.

```mdx
Set <Tooltip tip="Milliseconds since the Unix epoch">`createdAt`</Tooltip> on every event.
```

Tooltip text is not reachable on touch devices and does not survive being printed or
copied. Never put information a reader needs there — only information that saves a reader
a lookup.

## `Update`

<ParamField name="label" type="string" required>
  The version or date this entry covers.
</ParamField>

<ParamField name="description" type="string">
  One-line summary of the change.
</ParamField>

Children: rich content — the entry body.

```mdx
<Update label="0.2.0" description="Offline builds">
  `reed prefetch` now populates a pinned store, and `build` runs with no network.
</Update>
```

Useful for release notes and version-stamped entries anywhere on a page.

Note that it is **not** what drives a changelog page's structure. A page whose frontmatter
sets `type: changelog` is laid out from its date-shaped `##` headings — `## 2026-08-05` —
and a date-shaped heading naming an invalid calendar date is reported as a diagnostic.
`Update` is a presentational element you may use inside such a page, not the mechanism
behind it.
