# ErrorPage

`ErrorPage` displays a framed status, explanation and recovery link using built-in English or French copy.

## Usage

Load `@dg/ui/styles.css` once in the root layout.

```svelte
<script>
  import { ErrorPage } from "@dg/ui";
</script>

<ErrorPage status={404} />
```

## Notes

- Native HTML attributes, DOM callbacks, class and style are forwarded to the framed section.
- Forwarding uses native attribute types; unknown props are not supported. Pass class as a string.
- Built-in English and French copy follows the `Page` language.
- Rendering the component does not set an HTTP response status. The app or static host must send the appropriate status code.

## Parameters

| Name          | Type                         | Default     | Description                                                                                                                |
| ------------- | ---------------------------- | ----------- | -------------------------------------------------------------------------------------------------------------------------- |
| `status`      | `number`                     | `500`       | HTTP status shown in the frame. Built-in copy covers 400, 401, 403, 404, 429, 500 and 503; other values use fallback copy. |
| `title`       | `string`                     | `undefined` | Override the title selected from status and the `Page` language.                                                           |
| `description` | `string`                     | `undefined` | Override the explanatory text selected from status and the `Page` language.                                                |
| `href`        | `string`                     | `"/"`       | Recovery link destination.                                                                                                 |
| `linkLabel`   | `string`                     | `undefined` | Override the default localized recovery-link text.                                                                         |
| `level`       | `1 \| 2 \| 3 \| 4 \| 5 \| 6` | `1`         | Semantic title level; use a lower level for an embedded example.                                                           |

## Accessibility

The app supplies the main landmark and document title. Choose level when embedding this component. Rendering a 404 does not set the HTTP status: the server or static host must do that.