import "./running_ledger.css"; import type * as React from "react"; import { useRender } from "@base-ui/react/use-render"; import { type StyleProps } from "./style_props"; export interface RunningLedgerOpening { /** What the anchor IS ("Tồn đầu kỳ", "Số dư đầu kỳ"). */ label: string; /** ISO date, when the anchor has one — a stock count date, a statement's * period start. Omit for a balance with no dated origin. */ date?: string; /** The balance BEFORE the first row. */ balance: number; } export interface RunningLedgerRow { id: string; /** ISO date. Rows render in the order given — this component does not sort * them, so the caller's own query order IS the chronology on screen. */ date: string; /** What happened ("Nhập kho theo PO-2026-0001", "Thu tiền hóa đơn HD-014"). */ label: string; /** The movement. Signed: positive is IN/debit, negative is OUT/credit — ONE * field rather than paired in/out columns, so the same row shape serves a * stock quantity and a money statement without either caller picking the * other's vocabulary. */ amount: number; /** A trailing reference link (the source PO, the invoice this receipt was * matched against). */ reference?: { label: string; onPress: () => void; }; } export interface RunningLedgerProps extends StyleProps { opening: RunningLedgerOpening; /** Chronological rows — oldest first. Each row's running balance is this * component's own DERIVED value (`opening.balance` plus every `amount` up * to and including that row), never a value the caller supplies: a running * balance is exactly the row that MUST equal what it accumulates, and a * caller-supplied figure is the one shape of drift no reader can catch by * looking. */ rows: RunningLedgerRow[]; /** Formats every figure on the balance/amount column — `formatMoney` for a * statement, or a quantity formatter (`(n) => \`${n.toLocaleString()} kg\` * `) for a stock ledger. ONE formatter for the whole ledger: every row here * shares one unit, which is what lets the column state it once instead of * per row. */ format: (n: number) => string; /** A row whose running balance lands AT OR BELOW this reads in danger tone * — a stock-out, an account gone negative. Omit for a ledger with no * critical floor (most money statements; a stock ledger typically passes * 0). */ criticalAtOrBelow?: number; /** * The closing line's label. Default resolves from the locale pack * ("Current balance"), which fits a money statement but not every domain * this serves both of on day one — a stock kardex wants "Tồn kho hiện * tại", specific vocabulary the locale pack cannot own for every future * caller. Override per instance the same way `Sources.label` does. */ closingLabel?: string; testID?: string; ref?: React.Ref; render?: useRender.RenderProp; } /** * A chronological, self-totalling ledger — a stock kardex, a statement of * account — where every row carries the balance AS OF that row. NOT `Ledger`: * that component closes a fixed set of charge/receipt GROUPS into one total * and has no chronological concept at all; reaching for it here would mean * inventing a "group" for what is actually a time series and losing the * running balance a kardex or a statement is FOR. Composes a `Divider`-closed * current-balance line the same way `Ledger`'s own `LedgerTotal` does, so a * page mixing this with a `Ledger` elsewhere still reads as one design * language. * * The balance column is DERIVED — see `rows`' own doc. A platform whose * rollup engine cannot produce an ordered cumulative aggregate (no per-row * stored balance exists for a stock movement today) is exactly the case this * is for: opening balance + a plain list of signed deltas needs no schema * change on either side to render correctly. */ export declare function RunningLedger({ opening, rows, format, criticalAtOrBelow, closingLabel, testID, render, ref, ...props }: RunningLedgerProps): React.ReactElement>;