An interactive status monitor with glowing radial reflections, spring-animated status transitions, and staggered character animations for pending, success, and failed states.
pnpm dlx shadcn@latest add @spaceui/interactions-status-badge-glowimport { StatusBadgeGlow, StatusBadgeGlowTable } from '@/components/interactions/status-badge-glow'<StatusBadgeGlow state="success" />
<StatusBadgeGlow state="pending" />
<StatusBadgeGlow state="failed" /><StatusBadgeGlowTable />| Prop | Type | Default | Description |
|---|---|---|---|
state | pending|success|failed | pending | Semantic execution status controlling glow color, icon and label |
labels | Partial<Record<StatusState, string>> | { pending: "Pending", success: "Success", failed: "Failed" } | Custom labels for each state |
onClick | () => void | - | Optional click handler (enables interactive cycling or drilldown) |
className | string | - | Additional class name applied to badge container |
Real-time telemetry event stream monitoring tool executions, state diffs, tokens expended, and security policy checks.
ViewInteractive card-swipe approval stack for autonomous agent actions with multi-tier risk metadata, keyboard shortcuts (A/D), and sound feedback.
ViewInteractive multi-step wizard for synthesizing agent personas, custom system directives, tool clearance grants, and model tiers.
Viewpnpm dlx shadcn@latest add @spaceui/interactions-status-badge-glow