KB-201 · HERO/SPLIT/LEDGER
Split Ledger Hero
An editorial split hero: the argument on the left, the product already at work on the right. The copy column arrives on the cascade; the vignette is a live day-ledger whose total carry-rolls and whose rows carry real status seals. A gradient drift held low behind everything keeps the reading line in charge.
Install
One command — the source lands in your repo. Or copy it from the Code tab.
$ pnpm dlx shadcn@latest add @kinetiq/hero-split-ledger
Props
- headline / copy / eyebrow
- string
- default —
- The copy column. Headline is two lines, one per element.
- rows / panelTitle / panelMetric
- LedgerRow[] · string · {label, value}
- default —
- The vignette's schedule and its rolling total.
- primaryCta / secondaryCta / onPrimary / onSecondary
- string · () => void
- default —
- Both actions; primary carries the arrow.
| Prop | Type | Default | Description |
|---|---|---|---|
| headline / copy / eyebrow | string | — | The copy column. Headline is two lines, one per element. |
| rows / panelTitle / panelMetric | LedgerRow[] · string · {label, value} | — | The vignette's schedule and its rolling total. |
| primaryCta / secondaryCta / onPrimary / onSecondary | string · () => void | — | Both actions; primary carries the arrow. |