/** * Vendor list table layout — Figma-aligned column widths, gaps, row height, and padding. * Use these tokens for `VendorListTable` and row styling; avoid duplicating magic numbers. */ /** Body row height for the desktop vendor list (48px, `sp[7]`). */ export declare const VENDOR_LIST_ROW_HEIGHT_PX: number; /** * Header band outer height — matches `HeaderRow` (`min-height` `Space.sp5` with * `box-sizing: border-box`, so the bottom border is included in this value). */ export declare const VENDOR_LIST_LIST_HEADER_OUTER_HEIGHT_PX: number; /** * When the spend column is below this width, the header label uses smaller type and wraps; picker stays * on the same row as the sort control (Bills list pattern). */ export declare const VENDOR_LIST_SPEND_HEADER_STACK_BELOW_WIDTH_PX = 200; /** * Header cell padding when the spend column is narrow (wrapped label); horizontal matches body cells * (`Space.sp4` / 24px). Vertical is 0 so the stacked header stays compact. */ export declare const VENDOR_LIST_SPEND_HEADER_STACKED_PADDING = "0px 24px"; /** Skeleton rows while the first fetch has no rows yet. */ export declare const VENDOR_LIST_LOADING_PLACEHOLDER_ROWS = 3; /** Body cell padding: 16px vertical, 24px horizontal (`Space.sp3`, `Space.sp4`). */ export declare const VENDOR_LIST_CELL_PADDING = "16px 24px"; /** Header cell padding: 8px vertical, 24px horizontal (`Space.sp2`, `Space.sp4`). */ export declare const VENDOR_LIST_HEADER_PADDING = "8px 24px"; /** * Full column order including accounting class (toggle via `isAccountingClassesEnabled` in UI). */ export declare const VENDOR_LIST_COLUMN_ORDER: readonly ["vendor_name", "owner", "account", "accounting_class", "spend"]; export type VendorListColumnKey = (typeof VENDOR_LIST_COLUMN_ORDER)[number]; /** Synthetic column key for all YTD spend sort keys in the table. */ export declare const VENDOR_LIST_SPEND_TABLE_COLUMN_KEY: "spend"; /** Horizontal space between adjacent columns (Figma). */ export declare const VENDOR_LIST_COLUMN_GAP_PX = 35; /** * Tighter inter-column gap when the viewport is below {@link VENDOR_LIST_ROW_TOTAL_WIDTH_PX} * — frees horizontal space so header labels stay fully visible (matches `Space.sp3` / 16px). */ export declare const VENDOR_LIST_COLUMN_GAP_NARROW_PX: number; /** * When the table is narrower than the full design width, use {@link VENDOR_LIST_COLUMN_GAP_NARROW_PX} * so columns gain width and headers are not forced into ellipsis. */ export declare function getVendorListColumnGapPx(viewportWidthPx: number): number; /** Figma column content widths (px). */ export declare const VENDOR_LIST_COLUMN_WIDTH_PX: Record; /** 4 × 35px between five columns. */ export declare const VENDOR_LIST_INTER_COLUMN_GAP_TOTAL_PX: number; /** Design list width: 1026 + 140 = 1166. */ export declare const VENDOR_LIST_ROW_TOTAL_WIDTH_PX: number; /** * Each column’s share of **total row width (1166px)** — columns only; gaps account for the rest. * Sums with {@link VENDOR_LIST_GAP_PERCENT_OF_ROW} to ~100. */ export declare const VENDOR_LIST_COLUMN_PERCENT_OF_ROW: Record; /** Inter-column gap area as a share of total row width (140 / 1166). */ export declare const VENDOR_LIST_GAP_PERCENT_OF_ROW: number; /** Share of **column content width only** (1026px); sums to 100. */ export declare const VENDOR_LIST_COLUMN_WIDTH_PERCENT: Record; /** Minimum width for the full table row (1166px design). */ export declare const VENDOR_LIST_PANE_MIN_WIDTH_PX: number; export declare function getVendorListVisibleColumnKeys(isAccountingClassesEnabled: boolean): VendorListColumnKey[]; /** `data-testid` segment for the name column (product copy: merchant name). */ export declare function vendorListTableDataTestIdColumnSegment(columnKey: VendorListColumnKey): string; export declare function getVendorListNaturalTableHeightPx(dataRowCount: number, isLoading: boolean): number; export declare function getVendorListTableBlockHeightPx(containerHeightPx: number, dataRowCount: number, isLoading: boolean): number; export declare function isVendorListScrollable(containerHeightPx: number, dataRowCount: number, isLoading: boolean): boolean;