Installation
Nothing to add. This component ships as source in your download, so it is already in your project.
src/vui/error-state.tsx@viliha/vui-react/error-stateThe exported names are at the top of that file. The import path is an alias the download's tsconfig.json points at src/vui/, so you can move that folder and change one line rather than every file that imports from it.
Usage
import { ErrorState } from "@viliha/vui-react/error-state";Exports
Everything this family exports. They are read from the source, so this list is what the package actually ships.
| Prop | Type | Default |
|---|---|---|
| ErrorState | component | — |
ErrorState props
Plus everything Omit<React.ComponentProps<"div">, "title"> accepts, passed straight through to the underlying element.
| Prop | Type | Default |
|---|---|---|
| title? | React.ReactNode | ERROR_STATE_COPY.title |
| description? | React.ReactNode | ERROR_STATE_COPY.description |
| icon? | React.ReactNode | — |
| retryLabel? | string | ERROR_STATE_COPY.retryLabel |
| onRetry? | () => void | — |
| headingLevel? | 2 | 3 | 4 | 2 |
Customize
Every value this component draws comes from the theme: the colours, the radius, the control height and the type scale. Change a token and this moves with everything else, which is the difference between theming the product and overriding a component. See Theming for the token contract, and Swapping defaults for replacing the markup itself.