ErrorState
A regional error presentation with app-owned retry and safe rejection feedback.@gemologic/sheen-patterns · applicationPlayground
This example has no scalar controls. Its validated source remains interactive below.
Permission denied
Ask your workspace administrator for access.
<ErrorState kind="permission-denied" description="Ask your workspace administrator for access." />Variant matrix
Permission boundary
Permission denied
Ask your workspace administrator for access.
Anatomy
- Package
@gemologic/sheen-patterns- Source
packages/patterns/src/ErrorState.tsx- Tokens
--sheen-color-border--sheen-color-fg-muted--sheen-space-block-sm
Accessibility
Role: region, statusKeyboard: Tab, Shift+Tab, Enter, SpaceDo
- Keep authorized existing content mounted beside a refresh error.
- Let the app own retry requests and region dismissal.
Do not
- Do not retain unauthorized content after a permission change.
- Do not expose raw exception messages.
- Do not offer retry when the app has no meaningful retry action.
Generated props
| Name | Type | Default | Description |
|---|---|---|---|
kind | "not-found" | "server" | "permission-denied" | — | Not-found, server, or permission-denied presentation; defaults to server. |
title | string | — | Nonempty visible region name; defaults to the scoped message for the error kind. |
headingLevel | 1 | 2 | 3 | 4 | 5 | 6 | — | Semantic heading level, default 2; visual heading size stays compact. |
description | string | — | App-localized safe explanation. Do not pass secrets or raw transport errors. |
onRetry | () => void | Promise<void> | — | Optional app-owned retry callback. Concurrent attempts are suppressed; rejection shows a scoped generic message. Success does not remove the region. |