@orangecheck/design / makeStatusPill

Function: makeStatusPill()

function makeStatusPill<S>(map: Record<S, StatusPillSpec>, options?: {
  fallbackTone?: StatusTone;
  filled?: boolean;
  variant?: StatusPillVariant;
}): (props: {
  className?: string;
  status: S;
}) => ReactNode;

Defined in: primitives/status-pill.tsx:122

makeStatusPill — build a domain-specific status pill from a status→spec map. This is the ergonomic that www (StateBadge severity), and me (compliance/severity) each hand-roll. Instead of re-deriving tone-class logic per site, declare the map once:

const AgentStatusPill = makeStatusPill({ online: { tone: 'success' }, offline: { tone: 'destructive', label: 'down' }, pending: { tone: 'warning' }, }); <AgentStatusPill status={agent.status} />

Pass { variant: 'bordered' } for the uppercase-badge form (pledge states, www state badges, me compliance/severity).

Type Parameters

Type Parameter
`S` extends `string`

Parameters

Parameter	Type
`map`	`Record`<`S`, `StatusPillSpec`>
`options?`	{ `fallbackTone?`: `StatusTone`; `filled?`: `boolean`; `variant?`: `StatusPillVariant`; }
`options.fallbackTone?`	`StatusTone`
`options.filled?`	`boolean`
`options.variant?`	`StatusPillVariant`

Returns

(props: { className?: string; status: S; }) => ReactNode