# DocsNotFound

> The body of a docs 404, drawn inside the docs shell so the sidebar stays: the address that matched nothing, the app's search pre-filled from that address, and a few places to start.

```ts
import { DocsNotFound } from "@sdxc/ui/docs";
```

Renders the 404 body: eyebrow, title at the ambient heading level, a sentence, the
missing address as code that wraps on a phone, the search slot, then the start links
under a heading one level deeper.

## Examples

```tsx
<DocsNotFound
	path={url.pathname}
	search={<SearchField defaultValue={searchQueryFromPath(url.pathname)} />}
	links={[{ title: "Quickstart", href: "/docs/quickstart" }]}
	labels={{ title: "Page not found", body: "Search for it instead.", linksTitle: "Start here" }}
/>
```

## Props

| Prop | Type | Description |
| --- | --- | --- |
| `path` | `string` | The address that matched nothing, shown as code so the reader spots the typo. |
| `search?` | `RemixNode` | The app's search field, pre-filled with searchQueryFromPath of `path`. |
| `links` | `Link[]` |  |
| `labels` | `Labels` |  |

Also accepts everything in `Omit<TagProps<"div">, "title">`.


## Also exported

- `searchQueryFromPath`