# MoneyBarChart

> Grouped/stacked, zero-baseline origin, hatched negatives.

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

---

- **Family:** Dashboard & charts — 
- **Status:** Implemented
- **Spec:** https://lopifi.com/docs/catalog/07-dashboard-charts

## Install

```bash
npx shadcn@latest add @lopifi/theme
npx shadcn@latest add @lopifi/money-bar-chart
```

## Specification

Grouped and stacked.

- **`transform-origin` at the zero baseline**, not the bottom. Otherwise negative bars grow upward from the floor and briefly display the wrong sign — a real correctness issue in an animation.
- Negative bars hatched.
- Stacked totals labeled at the bar end.
- Bar radius 4 on the outer corners only, and **square below 12px bar width** — a rounded 6px bar is a blob.
- Draw-in: `scaleY 0→1`, 400ms, stagger 30ms capped at 240ms. First paint only.

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