/** * MoneyBreakdown — a financial summary surface for quotations, statements, and * settlements: an ordered set of label/amount rows resolving to a single grand * total. Optionally grouped into sections that each close with their own * subtotal. Amounts are supplied as preformatted nodes — the caller owns money * formatting (currency, locale, precision); this component never formats. * * Domain-neutral: rows carry only a label, a value node, and presentational * hints (emphasis, negative). It knows no currencies, entities, or business * rules. * * Accessibility: * - semantic `
` with `
` labels and `
` amounts, so each amount is * programmatically associated with its label * - the surface is a labeled `role="group"` (via `ariaLabel`) * - the grand total is a distinct row (heavier rule + weight) and, being a * `
`/`
` pair, keeps its accessible label * - negative amounts are prefixed with a real minus sign (U+2212), so the * sign — not color alone — signals a deduction * * Responsive: the root is a `@container` scope. Rows stack (label over value) * in very narrow containers and sit side by side from `@xs` up — no viewport * assumptions. * * Print: the `document` variant frames the surface like a printed statement and * reads cleanly under the `print/` utilities. */ import type { ReactNode } from "react"; import { type MoneyBreakdownEmphasis, type MoneyBreakdownVariant } from "./variants.js"; export * from "./variants.js"; export type MoneyBreakdownLine = { id: string; label: ReactNode; /** Preformatted amount — the caller formats money (currency, locale, sign). */ value: ReactNode; emphasis?: MoneyBreakdownEmphasis; /** Marks the amount as a deduction: renders a leading minus sign + tint. */ negative?: boolean; /** Secondary context under the label (a note, a rate, a reference). */ description?: ReactNode; }; export type MoneyBreakdownSection = { id: string; title?: ReactNode; lines: readonly MoneyBreakdownLine[]; /** Row closing the group; rendered with `subtotal` emphasis. */ subtotal?: MoneyBreakdownLine; }; export type MoneyBreakdownProps = { /** Flat form — a single ungrouped list of lines. */ lines?: readonly MoneyBreakdownLine[]; /** Grouped form — sections each optionally closing with a subtotal. */ sections?: readonly MoneyBreakdownSection[]; /** The grand total, rendered as the emphasized final row. */ total: MoneyBreakdownLine; variant?: MoneyBreakdownVariant; /** Accessible name for the summary group. */ ariaLabel?: string; }; export declare function MoneyBreakdown({ lines, sections, total, variant, ariaLabel, }: MoneyBreakdownProps): import("react").JSX.Element; //# sourceMappingURL=index.d.ts.map