Guardrail

Content safety filter with policy checks, blocked content blur, severity badge, and override controls.

ai-workflow v0.4.0

Playground

Examples

Safe

<ai-guardrail status="safe" style="max-width:500px;"></ai-guardrail>

Flagged

<ai-guardrail status="flagged" severityLevel="medium" style="max-width:500px;"></ai-guardrail>

Blocked + override

<ai-guardrail status="blocked" severityLevel="high" allowOverride blockedContent="[Redacted: SSN 123-45-6789 and home address found in output]" style="max-width:500px;"></ai-guardrail>

Import

import { AiGuardrail } from '@cognivo/components';

// Or tree-shake: import '@cognivo/components/ai-guardrail';

Per-component imports ship only that component (~8 kB gzip).

API Reference

Prop	Type	Default	Description
`status`	"safe" \| "flagged" \| "blocked"	"safe"	Filter status
`checks`	PolicyCheck[]	—	Policy results — {policy, passed, reason?}
`blockedContent`	string	—	Blurred blocked content (click to reveal)
`allowOverride`	boolean	false	Show admin override button
`severityLevel`	"low" \| "medium" \| "high" \| "critical"	"low"	Severity level
`rounded`	"none" \| "sm" \| "md" \| "lg"	"lg"	Border radius

Events

Event	Detail	Description
`ai-guardrail-override`	{status, severity}	Override clicked
`ai-guardrail-report`	{status, checks}	Report clicked