@chainberry/ui-components 1.0.7 → 1.0.9

package/dist/index.d.ts

@@ -268,7 +268,7 @@ export declare type Column<T> = {
     /** header label — also the label shown in the Columns menu */
     header: string;
     cell: (row: T) => ReactNode;
-    align?: "start" | "end";
+    align?: 'start' | 'end';
     /** enable click-to-sort on this column (requires `sortValue`) */
     sortable?: boolean;
     /** comparable value used for sorting (number sorts numerically) */
@@ -460,43 +460,28 @@ export declare function DailyBalancesTable({ data, pageSize, }: {
     pageSize?: number;
 }): JSX.Element;
 
-export declare function DataTable<T>({ columns, data, getRowId, layout, density, pageSize, loading, skeletonRows, searchable, searchPlaceholder, searchFilter, searchScopes, defaultSearchScope, onSearchScopeChange, query: queryProp, onQueryChange, columnToggle, columnVisibility: columnVisibilityProp, onColumnVisibilityChange, onRowClick, rowLeading, emptyMessage, toolbarFilters, toolbarActions, toolbarBelow, }: DataTableProps<T>): JSX.Element;
+export declare function DataTable<T>({ columns, data, getRowId, layout, density, pageSize, totalItems, currentPage, onPageChange, loading, skeletonRows, columnVisibility: columnVisibilityProp, onRowClick, rowLeading, emptyMessage, toolbarBelow, sort, onSortChange, }: DataTableProps<T>): JSX.Element;
 
 export declare type DataTableProps<T> = {
     columns: Column<T>[];
     data: T[];
     /** stable unique key per row */
     getRowId: (row: T) => string;
-    layout?: "auto" | "fill";
+    /** Sort */
+    sort?: SortState;
+    onSortChange?: (sort: SortState) => void;
+    layout?: 'auto' | 'fill';
     /** row vertical padding: "comfortable" (default) or "compact" (shorter rows) */
-    density?: "comfortable" | "compact";
+    density?: 'comfortable' | 'compact';
     /** rows per page; omit to show all rows and hide the footer */
     pageSize?: number;
+    totalItems?: number;
+    currentPage?: number;
+    onPageChange?: (page: number) => void;
     loading?: boolean;
     /** skeleton rows to render while loading (default 10) */
     skeletonRows?: number;
-    /** render a search input in the toolbar (needs `searchFilter`) */
-    searchable?: boolean;
-    searchPlaceholder?: string;
-    searchFilter?: (row: T, query: string) => boolean;
-    /** Optional field-scope dropdown at the right of the search box. UI only:
-     picking a scope swaps the placeholder to "Search by <label>" and notifies
-     `onSearchScopeChange`; it does NOT filter (that's the backend's job). */
-    searchScopes?: {
-        value: string;
-        label: string;
-    }[];
-    defaultSearchScope?: string;
-    onSearchScopeChange?: (value: string) => void;
-    /** controlled search query — drives filtering even when the built-in search
-     input isn't rendered (e.g. when an external toolbar owns it) */
-    query?: string;
-    onQueryChange?: (value: string) => void;
-    /** render the Columns visibility menu in the toolbar */
-    columnToggle?: boolean;
-    /** controlled column visibility (else internal state) */
     columnVisibility?: Record<string, boolean>;
-    onColumnVisibilityChange?: (id: string, next: boolean) => void;
     onRowClick?: (row: T) => void;
     /** leading cell before the first column (e.g. a status dot) */
     rowLeading?: (row: T) => ReactNode;
@@ -1303,10 +1288,11 @@ export declare function PasswordGate({ children }: {
     children: ReactNode;
 }): JSX.Element;
 
-export declare function PaymentType({ type, label, }: {
-    type: "deposit" | "withdraw";
-    /** overrides the default capitalized `type` text */
-    label?: string;
+declare type PaymentDirection = "in" | "out" | "neutral";
+
+export declare function PaymentType({ direction, label, }: {
+    direction: PaymentDirection;
+    label: string;
 }): JSX.Element;
 
 export declare function PeriodPicker({ value, onChange, today, className, }: {
@@ -1668,6 +1654,11 @@ export declare function SortHeader({ label, sort, onSort, align, }: {
     align?: "start" | "end";
 }): JSX.Element;
 
+declare type SortState = {
+    id: string;
+    dir: 'asc' | 'desc';
+} | null;
+
 /** Named treasury wallets available as withdrawal sources. */
 declare const SOURCE_WALLETS: SourceWallet[];
 
@@ -1694,7 +1685,8 @@ declare const STATUS_META: Record<TxStatus, {
     tone: BadgeTone;
 }>;
 
-/** Display order (reading order) for status lists. */
+/** Display order (reading order) for status lists — grouped by lifecycle:
+ intake → in-progress/pending → success → problems. */
 declare const STATUS_ORDER: TxStatus[];
 
 export declare function StatusBadge({ children, tone, className, }: {
@@ -1937,7 +1929,7 @@ export declare namespace transactionsStatuses {
     }
 }
 
-export declare function TransactionsTable({ data, loading, onRowClick, query, columnVisibility, presets, }: TransactionsTableProps): JSX.Element;
+export declare function TransactionsTable({ data, loading, onRowClick, columnVisibility, presets, pageSize, totalTransactions, currentPage, onPageChange, }: TransactionsTableProps): JSX.Element;
 
 export declare function TransactionsTableOptions({ search, onSearchChange, searchScopes, searchScope, onSearchScopeChange, searchPlaceholder, segment, onSegmentChange, tabs, tabCounts, onFilter, filterCount, columns, columnVisibility, onColumnChange, onRefresh, refreshing, onDownload, show, className, }: {
     search: string;
@@ -1975,12 +1967,15 @@ export declare type TransactionsTableProps = {
     data: Transaction[];
     loading?: boolean;
     onRowClick?: (tx: Transaction) => void;
-    /** controlled search query (owned by the page, shared with the toolbar) */
-    query?: string;
     /** controlled column visibility (owned by the page, shared with the toolbar) */
     columnVisibility?: Record<string, boolean>;
     /** the SavedPresetsBar row, rendered just above the table */
     presets?: ReactNode;
+    /** pagination */
+    pageSize?: number;
+    totalTransactions?: number;
+    currentPage?: number;
+    onPageChange?: (page: number) => void;
 };
 
 export declare namespace transactionsTypes {
@@ -2015,9 +2010,9 @@ declare type TxFilter = {
     to?: string;
 };
 
-declare type TxStatus = "created" | "confirmed" | "rejected" | "failed" | "pending-approval" | "processing" | "expired" | "cancelled" | "refunded" | "partially-confirmed" | "under-review" | "settled" | "currency-mismatch";
+declare type TxStatus = "created" | "processing" | "kyt-in-progress" | "pending-approval" | "rejected" | "confirmed" | "failed" | "conversion-in-progress" | "refund-in-progress" | "pending-verification" | "partially-completed" | "currency-mismatch";
 
-declare type TxType = "deposit" | "withdraw";
+declare type TxType = "unknown" | "deposit" | "withdrawal" | "checkout" | "manual-deposit" | "manual-withdrawal" | "auto-conversion-deposit" | "auto-conversion-withdrawal" | "automatic-withdrawal";
 
 declare const TYPE_OPTIONS: {
     value: TxType;