@teaui/core/.dist/components/Table.d.ts

A high-level terminal UI library for Node

import type { Viewport } from '../Viewport.js';
import { type Props as ViewProps } from '../View.js';
import { Container } from '../Container.js';
import { Size } from '../geometry.js';
import { type MouseEvent, type KeyEvent } from '../events/index.js';
import { System } from '../System.js';
export interface Column<_TData> {
    key: string;
    title: string;
    width?: number | 'auto';
    align?: 'left' | 'center' | 'right';
    /**
     * Whether clicking this column header sorts the table. Default: false.
     */
    sortable?: boolean;
}
export type SortDirection = 'asc' | 'desc';
export interface Props<TData> extends ViewProps {
    data: TData[];
    columns: Column<TData>[];
    format: (key: string, row: TData) => string;
    selectedIndex?: number;
    /**
     * Fired when the user presses Enter on a row, or clicks a data row.
     */
    onSelect?: (row: TData, index: number) => void;
    /**
     * Notification fired after the sort changes (header click on a sortable column).
     * The Table manages sort state internally — this is for external sync.
     */
    onSort?: (key: string, direction: SortDirection) => void;
    /**
     * Initial sort column key. Must match a column with `sortable: true`.
     */
    sortKey?: string;
    /**
     * Initial sort direction. Default: 'asc'.
     */
    sortDirection?: SortDirection;
    /**
     * Show a row number column (right-aligned, header '#'). Default: false.
     */
    showRowNumbers?: boolean;
    /**
     * Enable multi-selection (space bar or click to toggle). Default: false.
     */
    isSelectable?: boolean;
    /**
     * Show a checkbox column ([ ]/[⨉]) for multi-selection. Implies isSelectable. Default: false.
     */
    showSelected?: boolean;
    /**
     * Notification fired when the set of selected items changes.
     */
    onSelectionChange?: (selectedItems: Set<TData>) => void;
    /** Index in `data` represented by the first Container child row. */
    childOffset?: number;
}
/**
 * A data table with sortable headers, selectable/scrollable rows, and column layout.
 *
 * ```
 *  Name         │ Age │ Email              │ Status
 * ─────────────────────────────────────────────────
 *  Alice        │  30 │ alice@example.com  │ Active
 * ▶Bob          │  25 │ bob@example.com    │ Pending ◀
 *  Charlie      │  35 │ charlie@ex.com     │ Active
 * ```
 */
export declare class Table<TData> extends Container {
    #private;
    constructor(props: Props<TData>);
    update(props: Partial<Props<TData>>): void;
    get selectedIndex(): number;
    set selectedIndex(value: number);
    naturalSize(available: Size): Size;
    receiveKey(event: KeyEvent): void;
    receiveMouse(event: MouseEvent, system: System): void;
    render(viewport: Viewport): void;
}