# Rule

> Single / double / section accounting rule lines.

Source: https://lopifi.com/components/rule
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/rule
```

## Specification

> The accounting rule lines. Two CSS declarations, four centuries of grammar.

```tsx
<Rule variant="subtotal" />   // border-top: 1px solid --border
<Rule variant="total" />      // border-bottom: 3px double --border-strong
<Rule variant="section" />    // full-bleed 1px --border-subtle
```

**Spans the numeric column only**, not the label column. That's what makes it read as accounting rather than as a divider. In a multi-period statement it spans each period column independently, with the gutters unruled.

Never combined with a background fill on the same row.

Zero motion. Zero interactivity. Ten lines of code, and the single highest credibility-per-byte component in the library.

## 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.