Guardrail notice

Pro

One line saying a guardrail stopped something: what was stopped, and which rule stopped it. Optionally the one thing the person can do about it.

Markdown

Preview

Install

With the Candor CLI

First time? Get started sets up the registry and theme. Or with shadcn directly: npx shadcn@latest add @candor/guardrail-notice

Brings in: locale, utils · npm: lucide-react@^1.67.0

Usage

TSX · The example above

"use client"

import { GuardrailNotice } from "@/components/guardrail-notice"

export default function Example() {
  return (
    <div className="flex max-w-xl flex-col gap-3">
      <GuardrailNotice stopped="Dropping customers.partner_tier_old" rule="Destructive migrations in Production need an approver" action={{ label: "Request approval", onClick: () => {} }} />
      <GuardrailNotice stopped="Reading users.email" rule="Acme's data policy keeps personal data out of agent context" />
    </div>
  )
}

<GuardrailNotice>

Prop	Type	Default	Description
stoppedrequired	`string`	—	What didn't happen, e.g. "Deleting a field from a record". A full stop is added unless it already ends with punctuation.
rulerequired	`string`	—	Why, e.g. "Deletes in production need a second person's sign-off". A full stop is added unless it already ends with punctuation.
action	`{ label: string; onClick: () => void } \| undefined`	—	The one thing the person can do about it, e.g. "Ask an Admin", as a button.
className	`string \| undefined`	—	Extra classes for the outer element.

Strings

The fixed words, in English by default. Change any of them under guardrailNotice in <LocaleProvider strings={{ … }}>; the table is exported as guardrailNoticeStrings.

Key	English
stopped	Stopped: