ns://uins-ui / not-found-postmark
docsUNDELIVERABLE MAIL
404 — page not found
Route attempted: /billing/invoices/2024-Q9/detail — failed at every hop (Edge → Origin → Router) with no such address.
ns-ui / loud
A 404 rendered as returned mail — the failed URL addressed on an envelope that slides in, its routing history stamped hop by hop (edge, origin, router) as sequential ink postmarks, the last hop knocked down with a squash-and-settle NO SUCH ADDRESS hand-stamp and a 1px shake, then a forwarding-address label (search, home, recent pages) peels on as the real recovery page.
Use when Reach for this when the 404 should read as a multi-hop routing story with the user's own bad URL as addressee — a sequence of small postmarks landing one at a time before a hand-stamp closes the case and a peeling forwarding label hands off to recovery. Pick dead-reckoning instead when the story is a navigation trail worth charting as position fixes and a corrected course (nautical framing, no stamps); pick not-found-knockout instead when you want one instant impact gag (numerals punched out of a surface) rather than a narrative with beats.
Install
npx shadcn add https://design.helpmarq.comRoute attempted: /billing/invoices/2024-Q9/detail — failed at every hop (Edge → Origin → Router) with no such address.
| Prop | Type | Default | Description |
|---|---|---|---|
| path? | string | — | The URL that 404'd. Defaults to the current location. |
| hops? | DeadLetterHop[] | — | Routing stops attempted, oldest first. Default: Edge / Origin / Router. |
| recentPages? | DeadLetterLink[] | — | Recovery destinations besides Home, in source order. |
| homeHref? | string | — | Home link destination. Default "/". |
| onSearch? | (query: string) => void | — | Called with the trimmed query on submit. Omit for a real, inert form. |
| className? | string | — | — |