Components
financial-table
A styled financial table with summary subtotals, currency formatting and positive/negative coloring.
The flagship component: a themed financial table with a =SUM summary row,
currency formatting and green/red conditional coloring on a delta column.
import { financialTable } from "@liasse/components";
import { render } from "@liasse/core";
import "@liasse/xlsx";
const doc = financialTable({
title: "Q3 2026 Results",
subtitle: "Revenue by line — quarterly summary",
columns: [
{ key: "item", header: "Item" },
{ key: "q2", header: "Q2", format: "currency", align: "right" },
{ key: "q3", header: "Q3", format: "currency", align: "right" },
{ key: "delta", header: "Δ", format: "percent", align: "right" },
],
rows: [
{ item: "Subscriptions", q2: 418200, q3: 472900, delta: 0.131 },
{ item: "Pro services", q2: 96400, q3: 88150, delta: -0.086 },
{ item: "Licenses", q2: 52700, q3: 61300, delta: 0.163 },
],
totals: ["q2", "q3"],
deltaColumn: "delta",
});
const bytes = await render(doc, { format: "xlsx" });Input
| Field | Type | Description |
|---|---|---|
title | string | Document + sheet title. |
subtitle? | string | Optional intro line under the title. |
columns | FinancialColumn[] | key, header, format?, align?, width?. |
rows | Record<string,...>[] | The data rows. |
totals? | string[] | Column keys to total with a =SUM summary row. |
deltaColumn? | string | Column to color by sign (green/red). |
freezeHeader? | boolean | Keep the header visible. Defaults to true. |
format accepts text, number, currency, percent or date. Currency
renders with the #,##0.00 € number format.