ErrorPage

Site error page for displaying 404/500 errors.

Installation

pnpm add @wandercom/design-system-web

Usage

import { ErrorPage } from '@wandercom/design-system-web/blocks/error-page';

export function Example() {
  return (
    <ErrorPage variant='404' />
  );
}

404 Page

Loading example...
<ErrorPage variant='404' />

500 Page

Loading example...
<ErrorPage variant='500' />

With custom props

Loading example...
<ErrorPage variant='404' title='Some custom title' description='Some custom description' />

Props

variant?:

"404" | "500"
The variant (HTTP error code) of the page to display. Affects the defaults and the background SVG.

title?:

string
The page title. Defaults differ based on variant.

description?:

string
The page description. Defaults differ based on variant.

primaryButton?:

{ asChild?: boolean; children?: ReactNode; onClick?: Function }
Props for the primary button.

secondaryButton?:

{ asChild?: boolean; children?: ReactNode; onClick?: Function }
Props for the secondary button.

className?:

string
Additional CSS classes to apply to the container.
ErrorPage