Add a crisp-ui item to a project that already uses shadcn/ui.
Requirements#
- A project set up with
npx shadcn@latest init. - Tailwind 3.4 or newer (the parts use
size-*).
Add an item#
Install any item by URL. Its dependencies come with it.
pnpm dlx shadcn@latest add https://realgood.site/r/status-notify.json
Use the @crisp namespace#
Register the registry once in components.json:
{
"registries": {
"@crisp": "https://realgood.site/r/{name}.json"
}
}Then install by name:
pnpm dlx shadcn@latest add @crisp/status-notify
Install from GitHub#
The repository is also a shadcn GitHub registry, so no hosting is involved. Use it if the site is unreachable or you want the source straight from the repository:
pnpm dlx shadcn@latest add aristidesnakos/crisp-ui/status-strip
The items are the same as the ones below, and dependencies between them resolve too. These installs follow the repository's default branch. The shadcn docs describe pinning a branch, tag or commit by adding # and its name after the item; only a branch has been tried here.
Items#
| Item | What it is |
|---|---|
status-notify | The whole pattern, wired together |
status-strip | Headline number, segmented bar, legend and an action slot |
recipient-roster | One list of people with a switch per channel |
confirm-send | Click, confirm with the count, send, "Sent to N" |
save-bar | "Unsaved changes" with Discard and Save, hidden when clean |
notify-envelope | Pure helpers: roster from lists, list comparison, One-message To/Cc |
audit-timeline | Read-only "who did what, when, and why" list, grouped by day |
audit-event | The AuditEvent type and pure helpers for building and grouping |
alert-rules | Editor for reminder cadence, escalation and quiet hours |
alert-rules-lib | Pure helpers: validate a rule, quiet-hours check, reminders due |