@starasia/admin 8.17.1 → 8.18.1

package/dist/components/TableLayout/TableLayout.d.ts

@@ -1,4 +1,4 @@
 import { default as React } from 'react';
 import { TableLayoutProps } from './types';
 
-export declare const TableLayout: <T>({ columns, data, getRowKey, size, resizable, layout, widthStorageKey, columnState, onColumnStateChange, columnMenu, sort, defaultSort, onSortChange, height, mobileLayout, mobileBreakpoint, groupSeparator, summary, emptyState, loading, loadingRows, rowActions, }: TableLayoutProps<T>) => React.JSX.Element;
+export declare const TableLayout: <T>({ columns, data, getRowKey, rowBg, size, resizable, layout, widthStorageKey, columnState, onColumnStateChange, columnMenu, sort, defaultSort, onSortChange, height, mobileLayout, mobileBreakpoint, groupSeparator, summary, emptyState, loading, loadingRows, rowActions, }: TableLayoutProps<T>) => React.JSX.Element;

package/dist/components/TableLayout/index.d.ts

@@ -1,4 +1,4 @@
 export { TableLayout } from './TableLayout';
 export { ColumnMenu } from './ColumnMenu';
 export { useTableSortApiParams, type UseTableSortApiParamsOptions, type TableSortApiParams } from './hooks/useTableSortApiParams';
-export type { TableLayoutProps, TableLayoutColumn, TableLayoutAlign, TableLayoutColumnState, TableLayoutCellProps, TableLayoutSort, TableLayoutSortDirection, TableLayoutRowAction } from './types';
+export type { TableLayoutProps, TableLayoutColumn, TableLayoutColor, TableLayoutAlign, TableLayoutColumnState, TableLayoutCellProps, TableLayoutSort, TableLayoutSortDirection, TableLayoutRowAction } from './types';

package/dist/components/TableLayout/types.d.ts

@@ -28,6 +28,12 @@ export interface TableLayoutRowAction<T> {
     tone?: 'brand' | 'error' | 'success' | 'info' | 'neutral' | 'warning';
 }
 export type TableLayoutAlign = 'left' | 'center' | 'right';
+/**
+ * Warna background tint untuk row/kolom/sel TableLayout.
+ * Token semantik (otomatis adaptif dark-mode) ATAU string CSS mentah
+ * (`#hex` | `rgb(...)` | `hsl(...)` | `var(...)`) sebagai escape hatch.
+ */
+export type TableLayoutColor = 'brand-subtle' | 'brand-subtlest' | 'success-subtle' | 'success-subtlest' | 'error-subtle' | 'error-subtlest' | 'warning-subtle' | 'warning-subtlest' | 'info-subtle' | 'info-subtlest' | 'neutral' | (string & {});
 export type TableLayoutSortDirection = 'asc' | 'desc';
 export interface TableLayoutSort {
     /** key kolom yang di-sort */
@@ -60,6 +66,13 @@ export interface TableLayoutColumn<T> {
     render?: (row: T, rowIndex: number, data: T[]) => ReactNode;
     /** perataan header + cell (default 'left') */
     align?: TableLayoutAlign;
+    /**
+     * Warnai kolom ini (background tint). Token statis → SELURUH kolom bertint.
+     * Fungsi `(row, rowIndex, data) => warna | undefined` → pewarnaan kondisional
+     * per-sel. Menang atas `rowBg` (row-level). Desktop-table only — di layout
+     * mobile (cards/expand) hanya `rowBg` yang berlaku.
+     */
+    bg?: TableLayoutColor | ((row: T, rowIndex: number, data: T[]) => TableLayoutColor | undefined);
     /** lebar awal kolom, mis. '200px' | 160 */
     width?: string | number;
     /** lebar minimum saat di-resize (px) */
@@ -138,6 +151,13 @@ export interface TableLayoutProps<T> {
     rowActions?: TableLayoutRowAction<T>[];
     /** key unik per row; default pakai index */
     getRowKey?: (row: T, index: number) => string | number;
+    /**
+     * Warnai SELURUH row berdasarkan data; return token/undefined. Diterapkan
+     * sebagai background tint pada semua sel row (lewat CSS variable `--sa-tl-bg`,
+     * sehingga tint tetap terlihat saat hover & pada frozen column). Di-override
+     * per-sel oleh `column.bg`. Berlaku juga di layout mobile (cards/expand).
+     */
+    rowBg?: (row: T, index: number) => TableLayoutColor | undefined;
     /** padding scale, diteruskan ke primitif Table (default 'md') */
     size?: 'sm' | 'md' | 'lg' | 'xl';
     /** aktifkan drag-resize lebar kolom (default false) */