@caffeinebounce/ui 0.62.2 → 0.63.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (122) hide show
  1. package/README.md +1 -1
  2. package/dist/blog.js +8 -6
  3. package/dist/blog.mjs +3 -1
  4. package/dist/charts.d.cts +1 -1
  5. package/dist/charts.d.ts +1 -1
  6. package/dist/{chunk-6DVWMJ3H.mjs → chunk-2EFVMX6V.mjs} +4 -3
  7. package/dist/chunk-33JR5SYE.js +1 -0
  8. package/dist/{chunk-OZZWDIOY.js → chunk-375DECW4.js} +32 -31
  9. package/dist/chunk-3NDB4YPC.js +1 -0
  10. package/dist/{chunk-PZRI43EZ.js → chunk-46JYKBRX.js} +0 -43
  11. package/dist/chunk-5D55OVD5.js +75 -0
  12. package/dist/chunk-5RW4PYZ6.js +1 -0
  13. package/dist/chunk-5THF4YP6.mjs +1 -0
  14. package/dist/{chunk-JORVSG52.js → chunk-663CFAHS.js} +212 -269
  15. package/dist/chunk-6BUBNZPG.mjs +1 -0
  16. package/dist/chunk-6HKJDV43.mjs +48 -0
  17. package/dist/chunk-6NCRGHV3.mjs +64 -0
  18. package/dist/{chunk-OLAAXLXY.mjs → chunk-6QAKQG57.mjs} +5 -4
  19. package/dist/chunk-72JGQ7IJ.mjs +1 -0
  20. package/dist/{chunk-N6AFNFZR.mjs → chunk-7ERVZXIN.mjs} +215 -270
  21. package/dist/chunk-7IKHZKAC.js +1 -0
  22. package/dist/chunk-APFEP5B7.mjs +100 -0
  23. package/dist/chunk-C3OADNSG.js +348 -0
  24. package/dist/{chunk-RVEFPVZF.mjs → chunk-C57MX3BG.mjs} +1 -0
  25. package/dist/{chunk-CC4KUIKC.js → chunk-DH5Z3ETN.js} +67 -45
  26. package/dist/chunk-DYWZ23QT.mjs +90 -0
  27. package/dist/{chunk-KRRIRS6A.mjs → chunk-E67IR6HU.mjs} +31 -9
  28. package/dist/{chunk-D3QXPL47.mjs → chunk-EXQSWHLD.mjs} +7 -6
  29. package/dist/{chunk-ZOA7B32D.js → chunk-F35KL6TX.js} +10 -9
  30. package/dist/{chunk-YSLD2HLP.mjs → chunk-FFJC66KO.mjs} +2 -1
  31. package/dist/chunk-FRRS2YZH.mjs +1 -0
  32. package/dist/chunk-G5TQWWQA.mjs +1 -0
  33. package/dist/{chunk-MPZFPU4X.js → chunk-GMBLPQ3I.js} +4 -3
  34. package/dist/chunk-IJFPPLQW.js +50 -0
  35. package/dist/chunk-J6OLBSZR.js +1 -0
  36. package/dist/chunk-KGGQ5NZV.js +1 -0
  37. package/dist/chunk-KHCC5UKW.mjs +1 -0
  38. package/dist/{chunk-BMFQG6RA.mjs → chunk-KJIX6V32.mjs} +108 -1885
  39. package/dist/chunk-LABHD4PU.js +109 -0
  40. package/dist/chunk-LQCVRWVF.js +1 -0
  41. package/dist/{chunk-GAIQJCAZ.js → chunk-LT5VD4KR.js} +150 -1953
  42. package/dist/{chunk-7DHKQODW.mjs → chunk-LTLCIRZY.mjs} +257 -474
  43. package/dist/chunk-N5BHXWR3.mjs +34 -0
  44. package/dist/chunk-OCO3Z5YA.js +37 -0
  45. package/dist/chunk-OFQLWSUR.mjs +1 -0
  46. package/dist/chunk-OIJ7XMDV.mjs +71 -0
  47. package/dist/chunk-ORBH4IBC.mjs +316 -0
  48. package/dist/{chunk-C4UT5V3P.js → chunk-OWHI5VGJ.js} +1 -0
  49. package/dist/chunk-OWWOAYIY.js +2652 -0
  50. package/dist/chunk-PFHOXDSW.mjs +10 -0
  51. package/dist/chunk-Q52ZEL62.mjs +1 -0
  52. package/dist/chunk-QRS7DJGS.js +103 -0
  53. package/dist/chunk-R26Y7LGJ.js +1 -0
  54. package/dist/{chunk-BFWX5GJZ.mjs → chunk-R3X4B4JJ.mjs} +56 -8
  55. package/dist/chunk-RBUYW6QQ.js +1 -0
  56. package/dist/chunk-RM7ACPTM.mjs +2601 -0
  57. package/dist/chunk-RODSGPBB.mjs +75 -0
  58. package/dist/chunk-SORWLKOK.js +1 -0
  59. package/dist/{chunk-T6ZBA6VJ.js → chunk-UHAV34YX.js} +9 -8
  60. package/dist/{chunk-GUSTCU2W.mjs → chunk-ULANYJ7Y.mjs} +1 -59
  61. package/dist/chunk-ULDE7QSN.js +70 -0
  62. package/dist/chunk-UT36VNVZ.mjs +47 -0
  63. package/dist/chunk-UY3H4PKB.js +71 -0
  64. package/dist/{chunk-KB7UXIQZ.mjs → chunk-VIVWFQG5.mjs} +3 -1
  65. package/dist/{chunk-ESZ7CBA2.js → chunk-VKBJ3SGT.js} +7 -5
  66. package/dist/{chunk-UM7WMXIU.js → chunk-W3YOQ5ZD.js} +265 -505
  67. package/dist/chunk-WOITB4JL.js +1 -0
  68. package/dist/{chunk-E42B4GSB.js → chunk-XGJL6DLV.js} +58 -7
  69. package/dist/chunk-YKZEKJMZ.mjs +1 -0
  70. package/dist/chunk-YRIBFIQ5.js +116 -0
  71. package/dist/chunk-ZFLZA7UP.mjs +1 -0
  72. package/dist/chunk-ZKUIUE7W.mjs +1 -0
  73. package/dist/chunk-ZWWJ3RRA.js +15 -0
  74. package/dist/data-grid.d.cts +241 -0
  75. package/dist/data-grid.d.ts +241 -0
  76. package/dist/data-grid.js +6486 -0
  77. package/dist/data-grid.mjs +6459 -0
  78. package/dist/data-table-CDQBo-Ve.d.ts +818 -0
  79. package/dist/data-table-jLzt6plY.d.cts +818 -0
  80. package/dist/data-table.d.cts +8 -42
  81. package/dist/data-table.d.ts +8 -42
  82. package/dist/data-table.js +61 -187
  83. package/dist/data-table.mjs +11 -5
  84. package/dist/finance.d.cts +534 -0
  85. package/dist/finance.d.ts +534 -0
  86. package/dist/finance.js +188 -0
  87. package/dist/finance.mjs +15 -0
  88. package/dist/forms.js +9 -6
  89. package/dist/forms.mjs +7 -4
  90. package/dist/{hooks-B2jU1GVT.d.ts → hooks-A55E0fgf.d.ts} +3 -2
  91. package/dist/{hooks-8ORd7T1A.d.cts → hooks-Bys_AZPI.d.cts} +3 -2
  92. package/dist/hooks.d.cts +1 -1
  93. package/dist/hooks.d.ts +1 -1
  94. package/dist/hooks.js +26 -23
  95. package/dist/hooks.mjs +6 -3
  96. package/dist/index.d.cts +536 -665
  97. package/dist/index.d.ts +536 -665
  98. package/dist/index.js +3830 -3408
  99. package/dist/index.mjs +2068 -1767
  100. package/dist/layouts.js +26 -25
  101. package/dist/layouts.mjs +5 -4
  102. package/dist/marketing-3d.js +1 -0
  103. package/dist/marketing-3d.mjs +1 -0
  104. package/dist/marketing.js +75 -74
  105. package/dist/marketing.mjs +5 -4
  106. package/dist/media.js +1 -0
  107. package/dist/media.mjs +1 -0
  108. package/dist/navigation.js +29 -28
  109. package/dist/navigation.mjs +7 -6
  110. package/dist/primitives.d.cts +72 -109
  111. package/dist/primitives.d.ts +72 -109
  112. package/dist/primitives.js +78 -72
  113. package/dist/primitives.mjs +8 -6
  114. package/dist/settings.js +9 -9
  115. package/dist/settings.mjs +4 -4
  116. package/package.json +21 -4
  117. package/dist/UnifiedTableControls-CG299y9h.d.ts +0 -1233
  118. package/dist/UnifiedTableControls-CIjRpNhy.d.cts +0 -1233
  119. package/dist/chunk-GMBGWOCR.mjs +0 -48
  120. package/dist/chunk-HBLKVQIQ.mjs +0 -23
  121. package/dist/chunk-HMAMMC72.js +0 -26
  122. package/dist/chunk-MVYRNJA6.js +0 -74
@@ -1,1233 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { Column, Table, ColumnDef, Row, VisibilityState, ColumnFiltersState, SortingState } from '@tanstack/react-table';
3
- import * as React from 'react';
4
- import { ReactNode } from 'react';
5
- import { LucideIcon } from 'lucide-react';
6
- import { c as ButtonProps } from './button-BHnoRUkF.cjs';
7
- import { l as PeriodGranularity, C as ComparisonMode, c as FinancialStatementEntry, T as TimeUnit } from './FinancialStatementTable-BNUrdTU4.cjs';
8
-
9
- /** Filter type determines the UI shown */
10
- type FilterType = "text" | "select" | "boolean" | "number";
11
- /** Filter operator for conditions */
12
- type FilterOperator = "is" | "is_not" | "contains" | "does_not_contain" | "is_empty" | "is_not_empty";
13
- /** Option for select/boolean filters */
14
- interface FilterOption$1 {
15
- label: string;
16
- value: string;
17
- /** Color indicator (e.g., "green", "red", "blue", "#22c55e") */
18
- color?: string;
19
- /** Icon to display */
20
- icon?: React.ReactNode;
21
- /** Custom badge element to render (takes precedence over color/icon) */
22
- badge?: React.ReactNode;
23
- }
24
- /** Props for DataTableColumnFilter */
25
- interface DataTableColumnFilterProps<TData, TValue> {
26
- /** TanStack Table column instance */
27
- column: Column<TData, TValue>;
28
- /** Column display name */
29
- title: string;
30
- /** Type of filter UI to show */
31
- filterType?: FilterType;
32
- /** Options for select/enum filters */
33
- filterOptions?: FilterOption$1[];
34
- /** Placeholder for text input */
35
- placeholder?: string;
36
- /** Children (trigger element) */
37
- children: React.ReactNode;
38
- /** Callback when filter value changes */
39
- onFilterChange?: (columnId: string, value: unknown) => void;
40
- }
41
- /**
42
- * Filter UI content (reusable) - Notion-style
43
- */
44
- declare function DataTableColumnFilterContent({ title, value, onChange, onClear, onDelete, filterType, filterOptions, placeholder, showDeleteMenu, }: {
45
- title: string;
46
- value: string | undefined;
47
- onChange: (v: string | undefined) => void;
48
- onClear?: () => void;
49
- onDelete?: () => void;
50
- filterType?: FilterType;
51
- filterOptions?: FilterOption$1[];
52
- placeholder?: string;
53
- /** Whether to show the 3-dots delete menu (hide when creating new filter from column header) */
54
- showDeleteMenu?: boolean;
55
- }): react_jsx_runtime.JSX.Element;
56
- /**
57
- * Column filter popover component.
58
- * Shows appropriate filter UI based on filterType.
59
- */
60
- declare function DataTableColumnFilter<TData, TValue>({ column, title, filterType, filterOptions, placeholder, children, onFilterChange, }: DataTableColumnFilterProps<TData, TValue>): react_jsx_runtime.JSX.Element;
61
-
62
- /** Individual filter definition */
63
- interface DataTableFilter {
64
- /** Unique identifier for the filter */
65
- id: string;
66
- /** Column or field name */
67
- label: string;
68
- /** Display value of the filter (text) */
69
- value: string;
70
- /** Raw/underlying value for the filter */
71
- rawValue?: string;
72
- /** Optional icon to show (can be a React element or a Lucide icon component) */
73
- icon?: React.ReactNode | LucideIcon;
74
- /** Custom badge(s) to display as the value (takes precedence over value text) */
75
- valueBadge?: React.ReactNode;
76
- /** Underlying column id (optional) */
77
- columnId?: string;
78
- /** Filter UI type */
79
- filterType?: "text" | "select" | "boolean" | "number";
80
- /** Options (for select) */
81
- filterOptions?: FilterOption$1[];
82
- /** Placeholder for input */
83
- filterPlaceholder?: string;
84
- }
85
- interface DataTableFilterBadgesProps extends React.ComponentProps<"div"> {
86
- /** Array of active filters */
87
- filters: DataTableFilter[];
88
- /** Callback when a filter is removed */
89
- onRemoveFilter: (filterId: string) => void;
90
- /** Callback to change filter value (id, newValue) */
91
- onChangeFilter?: (filterId: string, value?: string) => void;
92
- /** Callback to clear all filters */
93
- onClearAll?: () => void;
94
- /** Callback to add a new filter */
95
- onAddFilter?: () => void;
96
- }
97
- /**
98
- * Notion-style filter badges displayed above the table.
99
- *
100
- * Shows active filters as removable badges with an optional "Clear all" button.
101
- */
102
- declare function DataTableFilterBadges({ filters, onRemoveFilter, onChangeFilter, onClearAll, onAddFilter, className, ...props }: DataTableFilterBadgesProps): react_jsx_runtime.JSX.Element | null;
103
-
104
- /** Context for DataTable column state */
105
- interface DataTableContextValue {
106
- /** Column wrapping state (map of column ID to wrap boolean) */
107
- columnWrapping: Record<string, boolean>;
108
- /** Toggle wrapping for a column */
109
- toggleColumnWrapping: (columnId: string) => void;
110
- /** Whether column drag is enabled */
111
- enableColumnDrag: boolean;
112
- /** Handler for column drag start */
113
- onColumnDragStart: (e: React.DragEvent, columnId: string) => void;
114
- /** Handler for column drag end */
115
- onColumnDragEnd: (e: React.DragEvent) => void;
116
- /** Current font size setting */
117
- fontSize: DataTableFontSize;
118
- /** CSS class for the font size */
119
- fontSizeClass: string;
120
- /** Display density mode */
121
- density: DataTableDensity;
122
- }
123
- declare const DataTableContext: React.Context<DataTableContextValue | null>;
124
- /** Hook to access DataTable context from column headers */
125
- declare function useDataTableContext(): DataTableContextValue | null;
126
- /** Display density mode for the data table */
127
- type DataTableDensity = "compact" | "comfy";
128
- /** Font size for data table content */
129
- type DataTableFontSize = "xs" | "sm" | "md" | "lg";
130
- /** Row selection style - controls how checkboxes appear */
131
- type RowSelectionStyle = "always" | "hover" | "none";
132
- interface DataTableProps<TData, TValue> extends React.ComponentProps<"div"> {
133
- /** TanStack Table instance */
134
- table: Table<TData>;
135
- /** Column definitions */
136
- columns: ColumnDef<TData, TValue>[];
137
- /** Optional action bar shown when rows are selected */
138
- actionBar?: React.ReactNode;
139
- /** Whether to show floating action bar for selections */
140
- floatingBar?: React.ReactNode;
141
- /** Active filters to display as badges */
142
- filters?: DataTableFilter[];
143
- /** Remove a filter by id */
144
- onRemoveFilter?: (filterId: string) => void;
145
- /** Change a filter value (from badge edit) */
146
- onChangeFilter?: (filterId: string, value?: string) => void;
147
- /** Clear all filters */
148
- onClearAllFilters?: () => void;
149
- /** Add a new filter (shows "+ Filter" button) */
150
- onAddFilter?: () => void;
151
- /** Display density mode - affects row/cell padding */
152
- density?: DataTableDensity;
153
- /** Font size for table content */
154
- fontSize?: DataTableFontSize;
155
- /** Enable column resizing by dragging */
156
- enableColumnResizing?: boolean;
157
- /** Row selection style - "hover" shows checkboxes only on hover (Notion-style) */
158
- rowSelectionStyle?: RowSelectionStyle;
159
- /** Enable row drag to reorder */
160
- enableRowDrag?: boolean;
161
- /** Callback when row order changes via drag */
162
- onRowDragEnd?: (fromIndex: number, toIndex: number) => void;
163
- /** Enable column drag to reorder */
164
- enableColumnDrag?: boolean;
165
- /** Current column order (array of column IDs) */
166
- columnOrder?: string[];
167
- /** Callback when column order changes via drag */
168
- onColumnOrderChange?: (columnOrder: string[]) => void;
169
- /** Column wrapping state (map of column ID to wrap boolean) */
170
- columnWrapping?: Record<string, boolean>;
171
- /** Callback when column wrapping changes */
172
- onColumnWrappingChange?: (columnWrapping: Record<string, boolean>) => void;
173
- /** Callback when a row is clicked */
174
- onRowClick?: (row: Row<TData>) => void;
175
- /** Optional summary component to render below the table but inside the scroll container */
176
- summary?: React.ReactNode;
177
- /** Enable tree view with expand/collapse and indentation for hierarchical data */
178
- enableTreeView?: boolean;
179
- /** Indent in pixels per depth level (default: 20) */
180
- treeIndentPx?: number;
181
- /** Optional callback to add extra CSS class(es) to a specific row */
182
- getRowClassName?: (row: Row<TData>) => string | undefined;
183
- /** Number of leading columns to freeze (sticky left). Default: 0 */
184
- stickyColumns?: number;
185
- /** Specific column IDs to freeze (sticky left). Takes precedence over stickyColumns when provided. */
186
- stickyColumnIds?: string[];
187
- }
188
- /**
189
- * A data table component built on TanStack Table.
190
- * Renders the table with headers and body rows.
191
- *
192
- * @example
193
- * const columns = [
194
- * { accessorKey: "name", header: "Name" },
195
- * { accessorKey: "email", header: "Email" },
196
- * ];
197
- *
198
- * const table = useReactTable({
199
- * data,
200
- * columns,
201
- * getCoreRowModel: getCoreRowModel(),
202
- * });
203
- *
204
- * <DataTable table={table} columns={columns} />
205
- */
206
- declare function DataTable<TData, TValue>({ table, columns, actionBar, floatingBar, filters, onRemoveFilter, onChangeFilter, onClearAllFilters, onAddFilter, density, fontSize, enableColumnResizing, rowSelectionStyle, enableRowDrag, onRowDragEnd, enableColumnDrag, columnOrder: externalColumnOrder, onColumnOrderChange, columnWrapping: externalColumnWrapping, onColumnWrappingChange, onRowClick, summary, enableTreeView, treeIndentPx, getRowClassName, stickyColumns, stickyColumnIds: explicitStickyColumnIds, className, children, ...props }: DataTableProps<TData, TValue>): react_jsx_runtime.JSX.Element;
207
-
208
- /**
209
- * Props for DataTableAddButton
210
- */
211
- interface DataTableAddButtonProps extends Omit<ButtonProps, "variant" | "size"> {
212
- /** Label text to display (defaults to "Add") */
213
- label?: string;
214
- /** Custom icon to use instead of Plus */
215
- icon?: React.ReactNode;
216
- /** Hide label on small screens (responsive) */
217
- responsiveLabel?: boolean;
218
- }
219
- /**
220
- * Standardized "Add" button for DataTable headers.
221
- *
222
- * Provides a consistent styling pattern:
223
- * - Ghost variant with muted text that highlights on hover
224
- * - Small size with compact height (h-7)
225
- * - Plus icon by default
226
- * - Optional responsive label (hidden on small screens)
227
- *
228
- * @example
229
- * ```tsx
230
- * <DataTableTopper>
231
- * <DataTableViews ... />
232
- * <DataTableSearch ... />
233
- * <DataTableAddButton onClick={() => setShowDialog(true)} />
234
- * </DataTableTopper>
235
- * ```
236
- *
237
- * @example With custom label
238
- * ```tsx
239
- * <DataTableAddButton label="New User" onClick={handleAdd} />
240
- * ```
241
- *
242
- * @example Non-responsive (always show label)
243
- * ```tsx
244
- * <DataTableAddButton label="Add" responsiveLabel={false} onClick={handleAdd} />
245
- * ```
246
- */
247
- declare function DataTableAddButton({ label, icon, responsiveLabel, className, children, ...props }: DataTableAddButtonProps): react_jsx_runtime.JSX.Element;
248
-
249
- /** Column data types for default icon mapping */
250
- type ColumnType = "text" | "number" | "date" | "boolean" | "enum" | "custom";
251
- /**
252
- * Column metadata interface for custom display names, icons, and filtering.
253
- * Use this in columnDef.meta to customize column appearance and behavior.
254
- *
255
- * @example
256
- * ```tsx
257
- * const columns = [
258
- * {
259
- * id: "status",
260
- * header: ({ column }) => <DataTableColumnHeader column={column} title="Status" />,
261
- * meta: {
262
- * displayName: "Status",
263
- * columnType: "enum",
264
- * filterable: true,
265
- * filterType: "select",
266
- * filterOptions: [
267
- * { label: "Active", value: "active" },
268
- * { label: "Pending", value: "pending" },
269
- * ],
270
- * } satisfies DataTableColumnMeta,
271
- * },
272
- * ];
273
- * ```
274
- */
275
- interface DataTableColumnMeta {
276
- /** User-friendly display name for View Options and other UI */
277
- displayName: string;
278
- /** Column data type for default icon selection */
279
- columnType?: ColumnType;
280
- /** Custom icon override (Lucide icon component) */
281
- icon?: LucideIcon;
282
- /** Whether this column should show filter option */
283
- filterable?: boolean;
284
- /** Type of filter UI to show (text, select, boolean, number) */
285
- filterType?: FilterType;
286
- /** Options for select/enum filters */
287
- filterOptions?: FilterOption$1[];
288
- /** Placeholder text for filter input */
289
- filterPlaceholder?: string;
290
- /** Text alignment for this column's cells */
291
- align?: "left" | "center" | "right";
292
- }
293
- interface DataTableColumnHeaderProps<TData, TValue> extends React.ComponentProps<"div"> {
294
- /** TanStack Table column instance */
295
- column: Column<TData, TValue>;
296
- /** Header title to display */
297
- title: string;
298
- /** Column data type for default icon (optional, can also use column.meta.columnType) */
299
- columnType?: ColumnType;
300
- /** Custom icon override (optional, can also use column.meta.icon) */
301
- icon?: LucideIcon;
302
- /** Whether to show filter option (defaults to meta.filterable) */
303
- filterable?: boolean;
304
- /** Type of filter UI (defaults to meta.filterType or 'text') */
305
- filterType?: FilterType;
306
- /** Options for select filters (defaults to meta.filterOptions) */
307
- filterOptions?: FilterOption$1[];
308
- /** Callback when filter value changes */
309
- onFilterChange?: (columnId: string, value: unknown) => void;
310
- /** Whether text wrapping is enabled for this column */
311
- isWrapped?: boolean;
312
- /** Callback when wrap toggle is clicked */
313
- onToggleWrap?: () => void;
314
- /** Extra menu items rendered at the top of the dropdown */
315
- customMenuItems?: React.ReactNode;
316
- }
317
- /**
318
- * Notion-style column header with dropdown menu.
319
- *
320
- * Features:
321
- * - Clean header without sort arrows when unsorted
322
- * - Optional column type icon in header
323
- * - Entire header is clickable to open menu
324
- * - Menu options: Filter (with intelligent UI), Sort (nested Asc/Desc), Hide
325
- * - Sort indicator only shows when column is actively sorted
326
- * - Filter shows popover with appropriate UI based on filterType
327
- */
328
- declare function DataTableColumnHeader<TData, TValue>({ column, title, className, columnType, icon, filterable, filterType, filterOptions, onFilterChange, isWrapped: isWrappedProp, onToggleWrap: onToggleWrapProp, customMenuItems, }: DataTableColumnHeaderProps<TData, TValue>): react_jsx_runtime.JSX.Element;
329
-
330
- type DisplayUnits = "actuals" | "thousands" | "millions";
331
- type CurrencySignDisplay = "none" | "summary" | "all";
332
- interface FinanceDisplayContextValue {
333
- decimals: number;
334
- displayUnits: DisplayUnits;
335
- currencySignDisplay: CurrencySignDisplay;
336
- }
337
- /**
338
- * Provider for global finance display settings (decimals + units).
339
- *
340
- * @example
341
- * ```tsx
342
- * <FinanceDisplayProvider decimals={0} displayUnits="thousands">
343
- * <IncomeStatement />
344
- * </FinanceDisplayProvider>
345
- * ```
346
- */
347
- declare function FinanceDisplayProvider({ decimals, displayUnits, currencySignDisplay, children, }: {
348
- decimals: number;
349
- displayUnits?: DisplayUnits;
350
- currencySignDisplay?: CurrencySignDisplay;
351
- children: React.ReactNode;
352
- }): react_jsx_runtime.JSX.Element;
353
- /**
354
- * @deprecated Use FinanceDisplayProvider instead
355
- */
356
- declare function FinanceDecimalsProvider({ decimals, children, }: {
357
- decimals: number;
358
- children: React.ReactNode;
359
- }): react_jsx_runtime.JSX.Element;
360
- /** Read the current finance decimal places setting (default: 0) */
361
- declare function useFinanceDecimals(): number;
362
- /** Read the full finance display context (decimals + units) */
363
- declare function useFinanceDisplay(): FinanceDisplayContextValue;
364
- /** Get the divisor for display units */
365
- declare function getUnitDivisor(units: DisplayUnits): number;
366
- /** Get the unit suffix label */
367
- declare function getUnitLabel(units: DisplayUnits): string | null;
368
- /** Get the short unit suffix */
369
- declare function getUnitSuffix(units: DisplayUnits): string | null;
370
- /**
371
- * Hook to persist finance decimal places in localStorage.
372
- * Returns [decimals, setDecimals].
373
- */
374
- declare function useFinanceDecimalsSetting(storageKey?: string, defaultValue?: number): [number, (v: number) => void];
375
- interface DataTableCurrencyCellProps {
376
- /** The numeric value to display */
377
- value: number | null | undefined;
378
- /** Currency code (default: "USD") */
379
- currency?: string;
380
- /** Locale (default: "en-US") */
381
- locale?: string;
382
- /** Show dash for zero values (default: false) */
383
- dashZero?: boolean;
384
- /** Number of decimal places (default: 2) */
385
- decimals?: number;
386
- /** Additional className */
387
- className?: string;
388
- }
389
- /**
390
- * Format a currency value for display in a DataTable cell.
391
- *
392
- * - Negative values rendered in accounting format: `($1,234.56)` in red
393
- * - Zero values optionally rendered as `—`
394
- * - Monospace tabular-nums for alignment
395
- */
396
- declare function formatCurrencyValue(value: number | null | undefined, options?: {
397
- currency?: string;
398
- locale?: string;
399
- dashZero?: boolean;
400
- decimals?: number;
401
- displayUnits?: DisplayUnits;
402
- showCurrencySign?: boolean;
403
- }): {
404
- text: string;
405
- isNegative: boolean;
406
- isZero: boolean;
407
- };
408
- /**
409
- * Currency cell component for DataTable.
410
- *
411
- * - Negative values: red text in accounting format `($1,234.56)`
412
- * - Zero values: optional dash display
413
- * - Monospace tabular-nums for column alignment
414
- */
415
- declare function DataTableCurrencyCell({ value, currency: currencyCode, locale, dashZero, decimals, className,
416
- /** Whether this cell is in a summary/total row */
417
- isSummaryRow, }: DataTableCurrencyCellProps & {
418
- isSummaryRow?: boolean;
419
- }): react_jsx_runtime.JSX.Element;
420
-
421
- /**
422
- * Options for CSV export
423
- */
424
- interface ExportToCsvOptions<TData> {
425
- /** TanStack Table instance */
426
- table: Table<TData>;
427
- /** Custom filename (without extension) */
428
- filename?: string;
429
- /** Whether to include only visible columns (default: true) */
430
- visibleColumnsOnly?: boolean;
431
- /** Whether to include only selected rows (default: false, exports all rows) */
432
- selectedRowsOnly?: boolean;
433
- /** Custom column headers mapping (columnId -> headerText) */
434
- customHeaders?: Record<string, string>;
435
- /** Column IDs to exclude from export */
436
- excludeColumns?: string[];
437
- /** Custom value formatter for specific columns */
438
- formatters?: Record<string, (value: unknown) => string>;
439
- }
440
- /**
441
- * Exports table data to CSV and triggers download
442
- */
443
- declare function exportToCsv<TData>({ table, filename, visibleColumnsOnly, selectedRowsOnly, customHeaders, excludeColumns, formatters, }: ExportToCsvOptions<TData>): void;
444
- /**
445
- * Options for Excel export
446
- */
447
- interface ExportToExcelOptions<TData> {
448
- /** TanStack Table instance */
449
- table: Table<TData>;
450
- /** Custom filename (without extension) */
451
- filename?: string;
452
- /** Whether to include only visible columns (default: true) */
453
- visibleColumnsOnly?: boolean;
454
- /** Whether to include only selected rows (default: false, exports all rows) */
455
- selectedRowsOnly?: boolean;
456
- /** Custom column headers mapping (columnId -> headerText) */
457
- customHeaders?: Record<string, string>;
458
- /** Column IDs to exclude from export */
459
- excludeColumns?: string[];
460
- /** Custom value formatter for specific columns */
461
- formatters?: Record<string, (value: unknown) => string>;
462
- }
463
- /**
464
- * Exports table data to Excel (XML Spreadsheet format) and triggers download
465
- */
466
- declare function exportToExcel<TData>({ table, filename, visibleColumnsOnly, selectedRowsOnly, customHeaders, excludeColumns, formatters, }: ExportToExcelOptions<TData>): void;
467
- type ExportFormat = "csv" | "excel";
468
- interface DataTableExportButtonProps<TData = unknown> {
469
- /**
470
- * TanStack Table instance for built-in export.
471
- * If provided, the component will handle CSV/Excel export automatically.
472
- */
473
- table?: Table<TData>;
474
- /**
475
- * Custom export callback for CSV. If provided (and table is not), this will be called instead.
476
- * Should return a Promise that resolves when export is complete.
477
- */
478
- onExportCsv?: () => Promise<void>;
479
- /**
480
- * Custom export callback for Excel. If provided (and table is not), this will be called instead.
481
- * Should return a Promise that resolves when export is complete.
482
- */
483
- onExportExcel?: () => Promise<void>;
484
- /**
485
- * @deprecated Use onExportCsv instead. Kept for backwards compatibility.
486
- */
487
- onExport?: () => Promise<void>;
488
- /** Custom filename for export (without extension) */
489
- filename?: string;
490
- /** Label for the tooltip */
491
- label?: string;
492
- /** Whether the button is disabled */
493
- disabled?: boolean;
494
- /** Whether to export only selected rows (default: false) */
495
- selectedRowsOnly?: boolean;
496
- /** Column IDs to exclude from export */
497
- excludeColumns?: string[];
498
- /** Custom column headers mapping (columnId -> headerText) */
499
- customHeaders?: Record<string, string>;
500
- /** Custom value formatters for specific columns */
501
- formatters?: Record<string, (value: unknown) => string>;
502
- }
503
- /**
504
- * Export dropdown button for DataTable with CSV and Excel options.
505
- * Styled consistently with other DataTable topper buttons.
506
- *
507
- * @example Built-in export (CSV and Excel)
508
- * ```tsx
509
- * <DataTableExportButton
510
- * table={table}
511
- * filename="my-data"
512
- * excludeColumns={["actions"]}
513
- * />
514
- * ```
515
- *
516
- * @example Custom export handlers
517
- * ```tsx
518
- * <DataTableExportButton
519
- * onExportCsv={async () => { ... }}
520
- * onExportExcel={async () => { ... }}
521
- * />
522
- * ```
523
- */
524
- declare function DataTableExportButton<TData = unknown>({ table, onExportCsv, onExportExcel, onExport, // deprecated, maps to CSV
525
- filename, label, disabled, selectedRowsOnly, excludeColumns, customHeaders, formatters, }: DataTableExportButtonProps<TData>): react_jsx_runtime.JSX.Element;
526
-
527
- interface DataTablePaginationProps extends React.ComponentProps<"div"> {
528
- /** Current page (1-indexed) */
529
- page: number;
530
- /** Number of items per page */
531
- pageSize: number;
532
- /** Total number of pages */
533
- pageCount: number;
534
- /** Total number of items */
535
- totalCount?: number;
536
- /** Number of selected rows */
537
- selectedCount?: number;
538
- /** Available page size options */
539
- pageSizeOptions?: number[];
540
- /** Callback when page changes */
541
- onPageChange: (page: number) => void;
542
- /** Callback when page size changes */
543
- onPageSizeChange: (pageSize: number) => void;
544
- }
545
- /**
546
- * Pagination controls for the data table.
547
- * Shows page navigation, page size selector, and row counts.
548
- */
549
- declare function DataTablePagination({ page, pageSize, pageCount, totalCount, selectedCount, pageSizeOptions, onPageChange, onPageSizeChange, className, ...props }: DataTablePaginationProps): react_jsx_runtime.JSX.Element;
550
-
551
- interface DataTableRowAction {
552
- /** Label for the action */
553
- label: string;
554
- /** Icon component to display */
555
- icon?: React.ReactNode;
556
- /** Callback when action is clicked */
557
- onClick: () => void;
558
- /** Whether the action is destructive (shows in red on hover) */
559
- destructive?: boolean;
560
- /** Whether the action is a success action (shows in green on hover) */
561
- success?: boolean;
562
- /** Whether the action is active/enabled (shows green, goes muted on hover) */
563
- successActive?: boolean;
564
- /** Whether to show separator before this action */
565
- separatorBefore?: boolean;
566
- /** Whether the action is disabled */
567
- disabled?: boolean;
568
- }
569
- interface DataTableRowActionsProps {
570
- /** Array of actions to display */
571
- actions: DataTableRowAction[];
572
- /**
573
- * Display mode for actions:
574
- * - "dropdown": Always show as dropdown menu (default, original behavior)
575
- * - "inline": Always show as inline icon buttons
576
- * - "responsive": Show inline buttons on larger screens, dropdown on mobile
577
- */
578
- mode?: "dropdown" | "inline" | "responsive";
579
- }
580
- /**
581
- * Row actions component with multiple display modes.
582
- *
583
- * Modes:
584
- * - "dropdown": Always shows as ellipsis dropdown menu (original behavior)
585
- * - "inline": Always shows icon buttons inline with tooltips
586
- * - "responsive": Shows inline on larger screens, collapses to dropdown on mobile
587
- *
588
- * @example Dropdown mode (default)
589
- * ```tsx
590
- * <DataTableRowActions actions={actions} />
591
- * ```
592
- *
593
- * @example Responsive mode
594
- * ```tsx
595
- * <DataTableRowActions actions={actions} mode="responsive" />
596
- * ```
597
- *
598
- * @example Inline mode
599
- * ```tsx
600
- * <DataTableRowActions actions={actions} mode="inline" />
601
- * ```
602
- */
603
- declare function DataTableRowActions({ actions, mode, }: DataTableRowActionsProps): react_jsx_runtime.JSX.Element | null;
604
-
605
- /** A single configurable setting for the data table */
606
- interface DataTableSettingDef {
607
- /** Unique identifier */
608
- id: string;
609
- /** Display label */
610
- label: string;
611
- /** Setting type */
612
- type: "boolean";
613
- /** Default value */
614
- defaultValue: boolean;
615
- }
616
- interface DataTableSettingsProps {
617
- /** Setting definitions */
618
- settings: DataTableSettingDef[];
619
- /** Current values (managed externally via useDataTableSettings) */
620
- values: Record<string, unknown>;
621
- /** Callback when a setting changes */
622
- onChange: (id: string, value: unknown) => void;
623
- /** Optional className */
624
- className?: string;
625
- }
626
- /**
627
- * Hook that manages DataTable settings with localStorage persistence.
628
- *
629
- * @param tableId - Unique table identifier for storage key
630
- * @param settings - Array of setting definitions with defaults
631
- * @returns { values, onChange, getSetting } - Current values and change handler
632
- */
633
- declare function useDataTableSettings(tableId: string, settings: DataTableSettingDef[]): {
634
- values: Record<string, unknown>;
635
- onChange: (id: string, value: unknown) => void;
636
- getSetting: <T = unknown>(id: string) => T;
637
- };
638
- /**
639
- * Settings button (cog icon) with popover for configurable DataTable settings.
640
- * Styled consistently with other DataTable topper buttons (ghost-icon).
641
- */
642
- declare function DataTableSettings({ settings, values, onChange, className, }: DataTableSettingsProps): react_jsx_runtime.JSX.Element | null;
643
-
644
- interface DataTableSkeletonProps extends React.ComponentProps<"div"> {
645
- /** Number of columns to display */
646
- columnCount: number;
647
- /** Number of rows to display */
648
- rowCount?: number;
649
- /** Number of filter skeletons to show in toolbar */
650
- filterCount?: number;
651
- /** Custom cell widths */
652
- cellWidths?: string[];
653
- /** Whether to show view options button */
654
- withViewOptions?: boolean;
655
- /** Whether to show pagination */
656
- withPagination?: boolean;
657
- /** Whether to shrink columns to zero when width is auto */
658
- shrinkZero?: boolean;
659
- }
660
- /**
661
- * Loading skeleton for the data table.
662
- * Shows placeholder rows while data is being fetched.
663
- */
664
- declare function DataTableSkeleton({ columnCount, rowCount, filterCount, cellWidths, withViewOptions, withPagination, shrinkZero, className, ...props }: DataTableSkeletonProps): react_jsx_runtime.JSX.Element;
665
-
666
- /** Summary calculation type */
667
- type SummaryType = "none" | "count" | "count_unique" | "sum" | "average" | "median" | "min" | "max" | "range" | "percent_empty" | "percent_filled";
668
- /** Column type for determining available summaries */
669
- type ColumnDataType = "text" | "number" | "boolean" | "date";
670
- /** Summary configuration for a column */
671
- interface ColumnSummaryConfig {
672
- /** Column ID */
673
- columnId: string;
674
- /** Active summary type */
675
- type: SummaryType;
676
- }
677
- interface DataTableSummaryProps<TData> {
678
- /** TanStack Table instance */
679
- table: Table<TData>;
680
- /** All data (not just current page) for accurate calculations */
681
- allData: TData[];
682
- /** Summary configuration per column */
683
- summaryConfig: Record<string, SummaryType>;
684
- /** Callback when summary type changes */
685
- onSummaryChange: (columnId: string, type: SummaryType) => void;
686
- /** Get the data type of a column (for showing appropriate options) */
687
- getColumnDataType?: (columnId: string) => ColumnDataType;
688
- /** Width of gutter column (for alignment with DataTable gutter) */
689
- gutterWidth?: number;
690
- /** Optional class name */
691
- className?: string;
692
- }
693
- /**
694
- * DataTable Summary row component.
695
- * Displays calculated statistics for each column below the table.
696
- *
697
- * Features:
698
- * - Count (with null/undefined excluded)
699
- * - Sum, Average, Median, Min, Max for numeric columns
700
- * - Unique count for text columns
701
- * - Percent empty/filled
702
- * - Click to change summary type
703
- */
704
- declare function DataTableSummary<TData>({ table, allData, summaryConfig, onSummaryChange, getColumnDataType, gutterWidth, className, }: DataTableSummaryProps<TData>): react_jsx_runtime.JSX.Element;
705
-
706
- interface DataTableToolbarProps extends React.ComponentProps<"div"> {
707
- /** Search value */
708
- searchValue?: string;
709
- /** Search placeholder */
710
- searchPlaceholder?: string;
711
- /** Callback when search value changes */
712
- onSearchChange?: (value: string) => void;
713
- }
714
- /**
715
- * Expandable search input for the data table.
716
- * Starts as a search icon and expands into a full input on click.
717
- */
718
- declare function DataTableSearch({ searchValue, searchPlaceholder, onSearchChange, className, }: {
719
- searchValue?: string;
720
- searchPlaceholder?: string;
721
- onSearchChange?: (value: string) => void;
722
- className?: string;
723
- }): react_jsx_runtime.JSX.Element;
724
- /**
725
- * Toolbar container for the data table.
726
- * Provides search input and container for filter/view controls.
727
- */
728
- declare function DataTableToolbar({ searchValue, searchPlaceholder, onSearchChange, className, children, ...props }: DataTableToolbarProps): react_jsx_runtime.JSX.Element;
729
-
730
- interface DataTableTab {
731
- /** Unique identifier for the tab */
732
- id: string;
733
- /** Display label */
734
- label: string;
735
- /** Optional count badge */
736
- count?: number;
737
- }
738
- interface DataTableTopperProps extends React.ComponentProps<"div"> {
739
- /** Tabs to display on the left side */
740
- tabs?: DataTableTab[];
741
- /** Currently active tab ID */
742
- activeTab?: string;
743
- /** Callback when tab changes */
744
- onTabChange?: (tabId: string) => void;
745
- /** Gutter width for left offset (aligns with DataTable gutter) */
746
- gutterWidth?: number;
747
- }
748
- /**
749
- * The DataTable Topper - a full-width header bar that combines:
750
- * - Tabs on the left (for filtering views)
751
- * - Actions on the right (search, view options, etc.)
752
- *
753
- * This component is decoupled from table width - it always spans
754
- * the full container width while the table can scroll independently.
755
- *
756
- * @example
757
- * ```tsx
758
- * <DataTableTopper
759
- * tabs={[
760
- * { id: "all", label: "All", count: 100 },
761
- * { id: "active", label: "Active", count: 45 },
762
- * ]}
763
- * activeTab="all"
764
- * onTabChange={setActiveTab}
765
- * >
766
- * <DataTableSearch ... />
767
- * <DataTableViewOptions ... />
768
- * </DataTableTopper>
769
- * ```
770
- */
771
- declare function DataTableTopper({ tabs, activeTab, onTabChange, gutterWidth, className, children, ...props }: DataTableTopperProps): react_jsx_runtime.JSX.Element;
772
-
773
- interface DataTableViewOptionsProps<TData> {
774
- /** TanStack Table instance */
775
- table: Table<TData>;
776
- }
777
- /**
778
- * Column visibility toggle dropdown with drag-and-drop reordering.
779
- * Allows users to show/hide columns and reorder them in the table.
780
- *
781
- * Uses column.meta.displayName for friendly names when available.
782
- *
783
- * @example
784
- * ```tsx
785
- * // In your column definition:
786
- * {
787
- * id: "createdAt",
788
- * header: ({ column }) => <DataTableColumnHeader column={column} title="Created" />,
789
- * meta: {
790
- * displayName: "Created Date",
791
- * },
792
- * }
793
- * ```
794
- */
795
- declare function DataTableViewOptions<TData>({ table, }: DataTableViewOptionsProps<TData>): react_jsx_runtime.JSX.Element;
796
-
797
- /** Represents a saved table view configuration */
798
- interface DataTableView {
799
- /** Unique identifier */
800
- id: string;
801
- /** Display name for the view */
802
- name: string;
803
- /** Column visibility state */
804
- columnVisibility?: VisibilityState;
805
- /** Column order (array of column IDs) */
806
- columnOrder?: string[];
807
- /** Column wrapping state (map of column ID to wrap boolean) */
808
- columnWrapping?: Record<string, boolean>;
809
- /** Row order (array of row IDs) - for custom row ordering */
810
- rowOrder?: string[];
811
- /** Active filters */
812
- filters?: ColumnFiltersState;
813
- /** Sorting state */
814
- sorting?: SortingState;
815
- /** Whether this is the default view */
816
- isDefault?: boolean;
817
- /** When the view was created */
818
- createdAt?: string;
819
- /** When the view was last updated */
820
- updatedAt?: string;
821
- }
822
- /** Current table state that can be compared to a view */
823
- interface DataTableViewState {
824
- columnVisibility?: VisibilityState;
825
- columnOrder?: string[];
826
- columnWrapping?: Record<string, boolean>;
827
- rowOrder?: string[];
828
- filters?: ColumnFiltersState;
829
- sorting?: SortingState;
830
- }
831
- interface DataTableViewsProps {
832
- /** List of saved views */
833
- views: DataTableView[];
834
- /** Currently active view ID */
835
- activeViewId?: string;
836
- /** Current table state */
837
- currentState: DataTableViewState;
838
- /** Callback when a view is selected */
839
- onSelectView: (view: DataTableView) => void;
840
- /** Callback to save a new view */
841
- onSaveView?: (view: Omit<DataTableView, "id" | "createdAt" | "updatedAt">) => void;
842
- /** Callback to update an existing view */
843
- onUpdateView?: (id: string, updates: Partial<DataTableView>) => void;
844
- /** Callback to delete a view */
845
- onDeleteView?: (id: string) => void;
846
- /** Callback to set default view */
847
- onSetDefaultView?: (id: string) => void;
848
- /** Optional class name */
849
- className?: string;
850
- }
851
- /**
852
- * DataTable Views component for saving and loading table configurations.
853
- *
854
- * Features:
855
- * - Save current view with a custom name
856
- * - Load saved views
857
- * - Set a default view
858
- * - Delete views
859
- * - Shows "Save" button when view has unsaved changes
860
- */
861
- declare function DataTableViews({ views, activeViewId, currentState, onSelectView, onSaveView, onUpdateView, onDeleteView, onSetDefaultView, className, }: DataTableViewsProps): react_jsx_runtime.JSX.Element;
862
-
863
- interface FilterOption {
864
- id: string;
865
- name: string;
866
- }
867
- interface FinancialStatementControlsProps {
868
- granularity: PeriodGranularity;
869
- periodStart: string;
870
- periodEnd: string;
871
- fiscalYearEndMonth?: number;
872
- comparisonMode: ComparisonMode;
873
- comparisonPeriods: number;
874
- comparisonCustomStart?: string;
875
- comparisonCustomEnd?: string;
876
- selectedClass: string;
877
- selectedDepartment: string;
878
- classes: FilterOption[];
879
- departments: FilterOption[];
880
- isLoading: boolean;
881
- mobileFiltersOpen: boolean;
882
- periodChipLabel: string;
883
- comparisonChipLabel: string;
884
- activeFilterCount: number;
885
- hideZeroRows: boolean;
886
- showRowTotals: boolean;
887
- mobilePeriodLabel: string;
888
- mobileCompareLabel?: string;
889
- hasMobilePrev: boolean;
890
- hasMobileNext: boolean;
891
- mobileCompareEnabled: boolean;
892
- hasMobileComparisonCandidate: boolean;
893
- onPeriodChange: (params: {
894
- granularity: PeriodGranularity;
895
- periodStart: string;
896
- periodEnd: string;
897
- timeUnit: "month" | "quarter" | "year";
898
- }) => void;
899
- onComparisonChange: (params: {
900
- mode: ComparisonMode;
901
- periods: number;
902
- customStart?: string;
903
- customEnd?: string;
904
- }) => void;
905
- onClassChange: (value: string) => void;
906
- onDepartmentChange: (value: string) => void;
907
- onMobileFiltersOpenChange: (open: boolean) => void;
908
- onResetFilters: () => void;
909
- onApplyFilters: () => void;
910
- onExport: (format: "csv" | "excel") => void;
911
- onHideZeroRowsChange: (checked: boolean) => void;
912
- onShowRowTotalsChange: (checked: boolean) => void;
913
- onMobilePrev: () => void;
914
- onMobileNext: () => void;
915
- onMobileCompareChange: (enabled: boolean) => void;
916
- classIcon?: ReactNode;
917
- departmentIcon?: ReactNode;
918
- exportIcon?: ReactNode;
919
- settingsIcon?: ReactNode;
920
- csvIcon?: ReactNode;
921
- excelIcon?: ReactNode;
922
- periodControl?: ReactNode;
923
- mobilePeriodControl?: ReactNode;
924
- showComparison?: boolean;
925
- showSettings?: boolean;
926
- showMobilePeriodStepper?: boolean;
927
- }
928
- declare function FinancialStatementControls({ granularity, periodStart, periodEnd, fiscalYearEndMonth, comparisonMode, comparisonPeriods, comparisonCustomStart, comparisonCustomEnd, selectedClass, selectedDepartment, classes, departments, isLoading: _isLoading, mobileFiltersOpen, periodChipLabel, comparisonChipLabel, activeFilterCount, hideZeroRows, showRowTotals, mobilePeriodLabel, mobileCompareLabel, hasMobilePrev, hasMobileNext, mobileCompareEnabled, hasMobileComparisonCandidate, onPeriodChange, onComparisonChange, onClassChange, onDepartmentChange, onMobileFiltersOpenChange, onResetFilters, onApplyFilters, onExport, onHideZeroRowsChange, onShowRowTotalsChange, onMobilePrev, onMobileNext, onMobileCompareChange, classIcon, departmentIcon, exportIcon, settingsIcon, csvIcon, excelIcon, periodControl, mobilePeriodControl, showComparison, showSettings, showMobilePeriodStepper, }: FinancialStatementControlsProps): react_jsx_runtime.JSX.Element;
929
-
930
- type MetricValueDisplayFormat = "currency" | "number" | "percent" | "multiple" | "bps";
931
- interface MetricValueDisplayOptions {
932
- /** Base format type */
933
- format?: MetricValueDisplayFormat;
934
- /** Decimal places override */
935
- decimalPlaces?: number;
936
- /** Optional post-format pipe (e.g. add unit labels like " days") */
937
- valuePipe?: (formatted: string, value: number) => string;
938
- /** Optional rich post-format pipe for card display (e.g. muted unit suffix) */
939
- valuePipeNode?: (formatted: string, value: number) => React.ReactNode;
940
- }
941
- interface FinancialMetric {
942
- /** Unique key */
943
- key: string;
944
- /** Display label */
945
- label: string;
946
- /** Which account classes to sum (e.g. ["Revenue"]) */
947
- accountClasses: string[];
948
- /** Color for the chart (CSS variable or hex) */
949
- color: string;
950
- /** Sign multiplier (default 1) — use -1 to flip sign (e.g. expenses shown positive) */
951
- sign?: number;
952
- /** Display settings for stat card values */
953
- valueDisplay?: MetricValueDisplayOptions;
954
- }
955
- interface ComputedMetric {
956
- /** Unique key */
957
- key: string;
958
- /** Display label */
959
- label: string;
960
- /** Formula: array of metric keys, prefix with "-" to subtract */
961
- formula: string[];
962
- /** Color */
963
- color: string;
964
- /** Chart type override for this metric */
965
- chartType?: "line" | "bar" | "area";
966
- /** Whether to show as dashed line */
967
- dashed?: boolean;
968
- /** Display settings for stat card values */
969
- valueDisplay?: MetricValueDisplayOptions;
970
- }
971
- type ChartVariant = "area" | "bar" | "line" | "pie";
972
- interface FinancialSummaryChartSeries {
973
- key: string;
974
- label: string;
975
- color: string;
976
- chartType?: "line" | "bar" | "area";
977
- dashed?: boolean;
978
- valueDisplay?: MetricValueDisplayOptions;
979
- }
980
- interface FinancialSummaryChartDataOptions {
981
- value: string;
982
- onChange: (value: string) => void;
983
- options: Array<{
984
- value: string;
985
- label: string;
986
- }>;
987
- }
988
- interface FinancialSummaryChartConfig {
989
- /** Chart display units independent of statement/table unit setting (default: "auto") */
990
- chartDisplayUnits?: DisplayUnits | "auto";
991
- /** Optional metric keys to include in pie slices (default: all summary cards) */
992
- pieSliceKeys?: string[];
993
- /** Optional metric keys to render as stat cards (default: all summary cards) */
994
- statCardKeys?: string[];
995
- /** Enable summary-card flip-to-sparkline interaction (default: true) */
996
- enableCardFlip?: boolean;
997
- /** Metrics derived directly from account data */
998
- metrics: FinancialMetric[];
999
- /** Computed metrics (e.g. net income = revenue - expenses) */
1000
- computedMetrics?: ComputedMetric[];
1001
- /** Chart type (default: "area") */
1002
- chartType?: ChartVariant;
1003
- /** Optional chart type choices shown in UI */
1004
- chartTypes?: ChartVariant[];
1005
- /** Height in pixels (default: 260) */
1006
- height?: number;
1007
- /** Whether to show the zero reference line */
1008
- showZeroLine?: boolean;
1009
- /** Whether chart starts expanded (default: desktop=true, mobile=false) */
1010
- defaultExpanded?: boolean;
1011
- /** Title for the chart section */
1012
- title?: string;
1013
- /** Standardized data selector shown on the right side of chart controls */
1014
- dataOptions?: FinancialSummaryChartDataOptions;
1015
- /** Extra controls rendered alongside chart controls (legacy/custom) */
1016
- chartControls?: React.ReactNode;
1017
- /** Render override for chart area; receives active chart type, chart data, derived series, and height */
1018
- renderChart?: (chartType: ChartVariant, data: Record<string, unknown>[], series: FinancialSummaryChartSeries[], height: number) => React.ReactNode;
1019
- /** How stat card values are computed: sum all periods (default) or latest period only */
1020
- statValueMode?: "sum" | "latest";
1021
- /** How period chip is shown on cards */
1022
- statPeriodMode?: "label" | "asOfLatest";
1023
- /** Optional prior-period label (e.g. 01/25) shown in summary card hover title */
1024
- priorPeriodLabel?: string;
1025
- }
1026
- declare const INCOME_STATEMENT_CHART_CONFIG: FinancialSummaryChartConfig;
1027
- declare const CASH_FLOW_CHART_CONFIG: FinancialSummaryChartConfig;
1028
- interface FinancialSummaryChartProps {
1029
- /** Raw financial data (same as table) */
1030
- data: FinancialStatementEntry[];
1031
- /** Time unit for period grouping */
1032
- timeUnit: TimeUnit;
1033
- /** Chart configuration */
1034
- config: FinancialSummaryChartConfig;
1035
- /** Prior period totals for trend comparison — keyed by metric key (e.g. { revenue: 100000, expenses: 80000, netIncome: 20000 }) */
1036
- priorTotals?: Record<string, number>;
1037
- /** Short label for the time period (e.g. "LTM", "YTD", "FY25") — shown on stat cards */
1038
- periodLabel?: string;
1039
- /** Additional class name */
1040
- className?: string;
1041
- }
1042
- declare function FinancialSummaryChart({ data, timeUnit, config, priorTotals: priorTotalsProp, periodLabel: periodLabelProp, className, }: FinancialSummaryChartProps): react_jsx_runtime.JSX.Element;
1043
-
1044
- interface MobilePeriodStepperProps {
1045
- periodLabel: string;
1046
- onPrev: () => void;
1047
- onNext: () => void;
1048
- hasPrev: boolean;
1049
- hasNext: boolean;
1050
- compareEnabled: boolean;
1051
- onCompareChange: (enabled: boolean) => void;
1052
- compareLabel?: string;
1053
- compareAvailable?: boolean;
1054
- }
1055
- declare function MobilePeriodStepper({ periodLabel, onPrev, onNext, hasPrev, hasNext, compareEnabled, onCompareChange, compareLabel, compareAvailable, }: MobilePeriodStepperProps): react_jsx_runtime.JSX.Element;
1056
-
1057
- interface MobileStatementActionExport {
1058
- label: string;
1059
- icon?: ReactNode;
1060
- onClick: () => void;
1061
- }
1062
- interface MobileStatementActionSetting {
1063
- label: string;
1064
- checked: boolean;
1065
- onCheckedChange: (checked: boolean) => void;
1066
- ariaLabel?: string;
1067
- }
1068
- interface MobileStatementActionsProps {
1069
- exports: MobileStatementActionExport[];
1070
- settings: MobileStatementActionSetting[];
1071
- }
1072
- declare function MobileStatementActions({ exports, settings, }: MobileStatementActionsProps): react_jsx_runtime.JSX.Element;
1073
-
1074
- interface MobileStatementFiltersProps {
1075
- open: boolean;
1076
- onOpenChange: (open: boolean) => void;
1077
- periodLabel: string;
1078
- comparisonLabel: string;
1079
- filterCount: number;
1080
- children: ReactNode;
1081
- onReset: () => void;
1082
- onApply: () => void;
1083
- showSummaryChips?: boolean;
1084
- }
1085
- declare function MobileStatementFilters({ open, onOpenChange, periodLabel, comparisonLabel, filterCount, children, onReset, onApply, showSummaryChips, }: MobileStatementFiltersProps): react_jsx_runtime.JSX.Element;
1086
-
1087
- interface SummaryMetric {
1088
- /** Unique key */
1089
- key: string;
1090
- /** Display label */
1091
- label: string;
1092
- /** Current total value */
1093
- value: number;
1094
- /** Color (CSS var or hex) */
1095
- color: string;
1096
- /** Trend percentage vs prior period (optional) */
1097
- trend?: number;
1098
- /** Trend description (e.g., "vs prior") */
1099
- trendLabel?: string;
1100
- /** Whether lower is better (flips trend color) */
1101
- invertTrend?: boolean;
1102
- /** Subtitle text */
1103
- subtitle?: string;
1104
- /** Custom display string (overrides default currency formatting) */
1105
- displayValue?: string;
1106
- }
1107
- interface SummaryChartDataPoint {
1108
- /** Period label (e.g., "Jan 25") */
1109
- label: string;
1110
- /** Values keyed by metric key */
1111
- [key: string]: string | number;
1112
- }
1113
- type SummaryChartType = "area" | "bar" | "line" | "pie";
1114
- interface SummaryChartSeries {
1115
- /** Metric key (matches data keys) */
1116
- key: string;
1117
- /** Display label */
1118
- label: string;
1119
- /** Color */
1120
- color: string;
1121
- /** Override chart type for this series */
1122
- chartType?: "line" | "bar" | "area";
1123
- /** Dashed line */
1124
- dashed?: boolean;
1125
- }
1126
- interface SummaryPanelProps {
1127
- /** Title for the panel header */
1128
- title?: string;
1129
- /** Summary metric cards to display */
1130
- metrics: SummaryMetric[];
1131
- /** Chart data points (optional — omit for metrics-only panel) */
1132
- chartData?: SummaryChartDataPoint[];
1133
- /** Chart series configuration */
1134
- chartSeries?: SummaryChartSeries[];
1135
- /** Default chart type */
1136
- chartType?: SummaryChartType;
1137
- /** Available chart types the user can toggle between */
1138
- chartTypes?: SummaryChartType[];
1139
- /** Chart height in px */
1140
- chartHeight?: number;
1141
- /** Show zero reference line */
1142
- showZeroLine?: boolean;
1143
- /** Start expanded */
1144
- defaultExpanded?: boolean;
1145
- /** Format function for Y axis / tooltip values */
1146
- formatValue?: (value: number) => string;
1147
- /** Additional className */
1148
- className?: string;
1149
- /** Render prop for chart — receives (activeChartType, data, series, height). Use when built-in charts don't work in your bundler. */
1150
- renderChart?: (chartType: SummaryChartType, data: SummaryChartDataPoint[], series: SummaryChartSeries[], height: number) => React.ReactNode;
1151
- /** Extra controls to render on the same line as chart type toggles (e.g., data mode dropdown) */
1152
- chartControls?: React.ReactNode;
1153
- }
1154
- declare function AreaLineChart({ data, series, height, showZeroLine, formatFn, }: {
1155
- data: SummaryChartDataPoint[];
1156
- series: SummaryChartSeries[];
1157
- height: number;
1158
- showZeroLine?: boolean;
1159
- formatFn: (v: number) => string;
1160
- }): react_jsx_runtime.JSX.Element;
1161
- declare function ColumnChart({ data, series, height, showZeroLine, formatFn, }: {
1162
- data: SummaryChartDataPoint[];
1163
- series: SummaryChartSeries[];
1164
- height: number;
1165
- showZeroLine?: boolean;
1166
- formatFn: (v: number) => string;
1167
- }): react_jsx_runtime.JSX.Element;
1168
- declare function PieChartView({ metrics, height, formatFn: _formatFn, }: {
1169
- metrics: SummaryMetric[];
1170
- height: number;
1171
- formatFn: (v: number) => string;
1172
- }): react_jsx_runtime.JSX.Element;
1173
-
1174
- declare function SummaryPanel({ title, metrics, chartData, chartSeries, chartType: defaultChartType, chartTypes, chartHeight, showZeroLine, defaultExpanded, formatValue, className, renderChart, chartControls, }: SummaryPanelProps): react_jsx_runtime.JSX.Element;
1175
-
1176
- declare const unifiedTableControlOrder: readonly ["period", "comparison", "filters", "search", "columns", "export", "settings"];
1177
- type UnifiedTableControlKind = (typeof unifiedTableControlOrder)[number];
1178
- interface UnifiedTableSettingsItem {
1179
- id: string;
1180
- label: string;
1181
- defaultValue: boolean;
1182
- description?: string;
1183
- }
1184
- interface UnifiedTableSettingsControl {
1185
- kind: "settings";
1186
- id?: string;
1187
- items: UnifiedTableSettingsItem[];
1188
- values: Record<string, unknown>;
1189
- onChange: (id: string, value: unknown) => void;
1190
- }
1191
- interface UnifiedTableNodeControlBase {
1192
- id?: string;
1193
- hidden?: boolean;
1194
- desktop: React.ReactNode;
1195
- mobile?: React.ReactNode;
1196
- }
1197
- interface UnifiedTablePeriodControl extends UnifiedTableNodeControlBase {
1198
- kind: "period";
1199
- }
1200
- interface UnifiedTableComparisonControl extends UnifiedTableNodeControlBase {
1201
- kind: "comparison";
1202
- }
1203
- interface UnifiedTableFiltersControl extends UnifiedTableNodeControlBase {
1204
- kind: "filters";
1205
- }
1206
- interface UnifiedTableSearchControl extends UnifiedTableNodeControlBase {
1207
- kind: "search";
1208
- }
1209
- interface UnifiedTableColumnsControl extends UnifiedTableNodeControlBase {
1210
- kind: "columns";
1211
- }
1212
- interface UnifiedTableExportControl extends UnifiedTableNodeControlBase {
1213
- kind: "export";
1214
- }
1215
- type UnifiedTableControl = UnifiedTablePeriodControl | UnifiedTableComparisonControl | UnifiedTableFiltersControl | UnifiedTableSearchControl | UnifiedTableColumnsControl | UnifiedTableExportControl | UnifiedTableSettingsControl;
1216
- declare function normalizeUnifiedTableControls(controls: UnifiedTableControl[]): UnifiedTableControl[];
1217
- declare function createFinanceTableSettingsItems({ hideZeroRowsDefault, showRowTotalsDefault, }?: {
1218
- hideZeroRowsDefault?: boolean;
1219
- showRowTotalsDefault?: boolean;
1220
- }): UnifiedTableSettingsItem[];
1221
- declare function useUnifiedTableSettings(tableId: string, settings: UnifiedTableSettingsItem[]): {
1222
- values: Record<string, unknown>;
1223
- onChange: (id: string, value: unknown) => void;
1224
- getSetting: <T = unknown>(id: string) => T;
1225
- };
1226
-
1227
- interface UnifiedTableControlsProps extends React.ComponentProps<"div"> {
1228
- controls: UnifiedTableControl[];
1229
- mobileLabel?: string;
1230
- }
1231
- declare function UnifiedTableControls({ controls, mobileLabel, className, ...props }: UnifiedTableControlsProps): react_jsx_runtime.JSX.Element | null;
1232
-
1233
- export { type DataTableViewsProps as $, AreaLineChart as A, DataTablePagination as B, CASH_FLOW_CHART_CONFIG as C, DataTable as D, type DataTablePaginationProps as E, type DataTableProps as F, type DataTableRowAction as G, DataTableRowActions as H, type DataTableRowActionsProps as I, DataTableSearch as J, type DataTableSettingDef as K, DataTableSettings as L, type DataTableSettingsProps as M, DataTableSkeleton as N, type DataTableSkeletonProps as O, DataTableSummary as P, type DataTableSummaryProps as Q, type DataTableTab as R, DataTableToolbar as S, type DataTableToolbarProps as T, DataTableTopper as U, type DataTableTopperProps as V, type DataTableView as W, DataTableViewOptions as X, type DataTableViewOptionsProps as Y, type DataTableViewState as Z, DataTableViews as _, type ChartVariant as a, type DisplayUnits as a0, type ExportFormat as a1, type ExportToCsvOptions as a2, type ExportToExcelOptions as a3, type FilterOperator as a4, type FilterOption$1 as a5, type FilterType as a6, FinanceDecimalsProvider as a7, FinanceDisplayProvider as a8, type FinancialMetric as a9, UnifiedTableControls as aA, type UnifiedTableControlsProps as aB, type UnifiedTableSettingsControl as aC, type UnifiedTableSettingsItem as aD, createFinanceTableSettingsItems as aE, exportToCsv as aF, exportToExcel as aG, formatCurrencyValue as aH, getUnitDivisor as aI, getUnitLabel as aJ, getUnitSuffix as aK, normalizeUnifiedTableControls as aL, unifiedTableControlOrder as aM, useDataTableContext as aN, useDataTableSettings as aO, useFinanceDecimals as aP, useFinanceDecimalsSetting as aQ, useFinanceDisplay as aR, useUnifiedTableSettings as aS, FinancialStatementControls as aa, type FinancialStatementControlsProps as ab, FinancialSummaryChart as ac, type FinancialSummaryChartConfig as ad, type FinancialSummaryChartProps as ae, type FinancialSummaryChartSeries as af, INCOME_STATEMENT_CHART_CONFIG as ag, MobilePeriodStepper as ah, type MobilePeriodStepperProps as ai, type MobileStatementActionExport as aj, type MobileStatementActionSetting as ak, MobileStatementActions as al, type MobileStatementActionsProps as am, MobileStatementFilters as an, type MobileStatementFiltersProps as ao, PieChartView as ap, type RowSelectionStyle as aq, type SummaryChartDataPoint as ar, type SummaryChartSeries as as, type SummaryChartType as at, type SummaryMetric as au, SummaryPanel as av, type SummaryPanelProps as aw, type SummaryType as ax, type UnifiedTableControl as ay, type UnifiedTableControlKind as az, ColumnChart as b, type ColumnDataType as c, type ColumnSummaryConfig as d, type ColumnType as e, type ComputedMetric as f, type CurrencySignDisplay as g, DataTableAddButton as h, type DataTableAddButtonProps as i, DataTableColumnFilter as j, DataTableColumnFilterContent as k, type DataTableColumnFilterProps as l, DataTableColumnHeader as m, type DataTableColumnHeaderProps as n, type DataTableColumnMeta as o, DataTableContext as p, type DataTableContextValue as q, DataTableCurrencyCell as r, type DataTableCurrencyCellProps as s, type DataTableDensity as t, DataTableExportButton as u, type DataTableExportButtonProps as v, type DataTableFilter as w, DataTableFilterBadges as x, type DataTableFilterBadgesProps as y, type DataTableFontSize as z };