# StatusPill

> Payment and reconciliation states.

Source: https://lopifi.com/components/status-pill
Part of: Lopifi — US GAAP books on autopilot, reviewed by a CPA (https://lopifi.com)

---

- **Family:** Primitives — The layer everything else composes. Build these first; nothing above them is right until they are.
- **Status:** Implemented
- **Spec:** https://lopifi.com/docs/catalog/01-primitives

## Install

```bash
npx shadcn@latest add @lopifi/theme
npx shadcn@latest add @lopifi/status-pill
```

## Specification

```tsx
<StatusPill status="pending" />       // ◷ Pending    amber, subtle bg
<StatusPill status="settled" />       // ✓ Settled    positive
<StatusPill status="failed" />        // ✕ Failed     negative
<StatusPill status="reconciled" />
<StatusPill status="needs-review" />
```

`*-subtle` background, `*` text, never a saturated fill. Icon + text always — the icon alone is not a status. Accessible name includes the entity: `"Payment pending"`.

**State change:** 140ms crossfade with a 2px blur mask, so the pill morphs rather than swapping. One of the small places the blur trick earns its keep.

## Rules this component obeys

Money is minor units, never floats. `null` is not `0` and neither is redacted. Negatives render in accounting parentheses with the parenthesis column reserved on both sides. Debit and credit are two columns. Per-currency decimal places. Polarity is explicit — up is not always good. Every figure states its period, entity, currency, basis and as-of.