Decision Pill

1import * as React from "react"
2import { BadgeCheck, Clock, ShieldX } from "lucide-react"
3 
4import { cn } from "@/lib/utils"
5import { StatusBadge } from "@/components/ui/status-badge"
6 
7// Decision pill — the signature Delego element. A delego Decision has exactly one
8// of three outcomes; this renders it with the canonical icon + mono label + color
9// so an outcome looks identical everywhere it appears. The default label is the
10// protocol's own token (e.g. `needs_approval`); pass children to override.
11type Decision = "allow" | "needs_approval" | "deny"
12 
13const DECISION = {
14  allow: { variant: "allow", icon: BadgeCheck, label: "allow" },
15  needs_approval: { variant: "approval", icon: Clock, label: "needs_approval" },
16  deny: { variant: "deny", icon: ShieldX, label: "deny" },
17} as const
18 
19function DecisionPill({
20  decision,
21  className,
22  children,
23  ...props
24}: Omit<React.ComponentProps<typeof StatusBadge>, "variant"> & {
25  decision: Decision
26}) {
27  const { variant, icon: Icon, label } = DECISION[decision]
28  return (
29    <StatusBadge
30      variant={variant}
31      data-decision={decision}
32      className={cn(className)}
33      {...props}
34    >
35      <Icon aria-hidden />
36      {children ?? label}
37    </StatusBadge>
38  )
39}
40 
41export { DecisionPill, type Decision }