Everything the hosted portal shows is built from open-source pieces you can use in your own product: delivery history, histograms, endpoint management, the dead-letter queue, the event catalog. Pick your level:
| Level | You get | You write |
|---|---|---|
| Blocks | A working dashboard view per install, wired to live data. | A getToken callback. |
| Components | Presentational pieces (tables, charts, forms) you feed with props. | The data wiring, via the hooks. |
| Libraries | Typed hooks and a framework-agnostic client. | All of the UI. |
If you would rather not build screens at all, the portal itself embeds in your app: whole, or one bare surface per page. See Embed the portal.
Installed code is yours: the shadcn CLI copies component source into your repo, where you restyle or rewrite it freely. Components never fetch data internally: data enters as props, so every piece works with any source of the same shape.
Installation#
The installation process is the same as shadcn/ui.
Run the init command to create a new project or to set up an existing one:
pnpm dlx shadcn@latest init
Add the registry once to your components.json:
{
"registries": {
"@repost": "https://repost.sh/r/{name}.json"
}
}pnpm dlx shadcn@latest add @repost/webhook-dashboard
The command copies the source into your project and resolves everything it needs: dependent components, npm packages, and the status color tokens (injected into your CSS with light and dark values).
import { WebhookDashboard } from "@/components/webhook-dashboard";
export default function WebhooksPage() {
return <WebhookDashboard getToken={getToken} />;
}Auth model#
Blocks and hooks authenticate with portal access tokens, the same short-lived, per-customer tokens that power hosted portal links. Your backend mints them with your API key; the browser only ever sees the token. Every wired piece takes a getToken callback and handles refresh itself.
Component gallery#
repost.sh/docs/components is the component reference: one page per component with a live interactive preview, the demo source, props, and the installable source, plus a page per block.