Detail Pane List Row

Label + trailing rows for detail panes inside AccountDetailCard.

Default

Inset + compact

Budget breakdown density inside an inset card.

Deduction, total, interactive

Tax lines, net totals, and hover-only rows.

Developer

import { DetailPaneListRow } from "@financial-tracking/design-system"

API reference

PropTypeDefault
labelRequired.ReactNode—
trailingRequired.ReactNode—
onClickEditable / button row when set.() => void—
deductionPrepends − before the trailing value.booleanfalse
totalBold label + trailing for section totals.booleanfalse
insetPadding for AccountDetailCard variant inset.booleanfalse
compact40px row height; default matches master pane 50px.booleanfalse
interactiveRead-only hover affordance without onClick.booleanfalse