export type DtTableViewAlign = 'left' | 'center' | 'right';
export type DtTableViewSortDirection = 'asc' | 'desc';
export interface DtTableViewSortDetail {
    field: string;
    direction: DtTableViewSortDirection;
}
export interface DtTableViewRowClickDetail<T = unknown> {
    row: T;
    index: number;
}
export declare class DtColumn extends HTMLElement {
    static get observedAttributes(): string[];
    get field(): string;
    get header(): string;
    get width(): string;
    get minWidth(): string;
    get align(): DtTableViewAlign;
    connectedCallback(): void;
    attributeChangedCallback(): void;
}
/**
 * `<dt-table-view>` — virtualized data table for structured row/column data.
 *
 * Columns are declared with child `<dt-column>` elements. Rows are provided via
 * the JS-only `rows` property. Sorting is event-driven: the component updates
 * header state and emits `dt-sort`, while the consumer is responsible for
 * reordering and reassigning `rows`.
 *
 * ## Attributes
 * - `row-height` — fixed row height in px
 * - `sortable` — when present, enables sortable header cells
 * - `striped` — when present, alternates row backgrounds
 * - `bordered` — when present, shows cell borders
 * - `empty-text` — text shown when there are no rows or no columns
 *
 * ## Properties
 * - `rows` — array of row objects to render
 *
 * ## `<dt-column>` attributes
 * - `field` — row field key
 * - `header` — header label; defaults to `field`
 * - `width` — column width in px or `auto`
 * - `min-width` — minimum column width
 * - `align` — `left`, `center`, or `right`
 *
 * If a `<dt-column>` contains a child `<template>`, that template is cloned for
 * each cell in the column. Template bindings work the same way as in
 * `<dt-list-view>`:
 * - `data-field="status"` sets text content from `row.status`
 * - `data-field-variant="statusVariant"` sets the `variant` attribute from `row.statusVariant`
 *
 * ## Events
 * - `dt-sort` — fired with `{ field, direction }` when a header is activated
 * - `dt-row-click` — fired with `{ row, index }` when a body row is clicked
 *
 * ## Usage
 * ```html
 * <dt-table-view id="processes" row-height="40" sortable striped>
 *   <dt-column field="name" header="Process" width="220"></dt-column>
 *   <dt-column field="cpu" header="CPU %" width="100" align="right"></dt-column>
 *   <dt-column field="status" header="Status" width="140">
 *     <template>
 *       <dt-badge data-field="status" data-field-variant="statusVariant"></dt-badge>
 *     </template>
 *   </dt-column>
 * </dt-table-view>
 * <script>
 *   const table = document.getElementById('processes');
 *   const rows = [
 *     { name: 'node', cpu: '12.4', status: 'running', statusVariant: 'success' },
 *     { name: 'cron', cpu: '1.2', status: 'idle', statusVariant: 'neutral' },
 *   ];
 *   table.rows = rows;
 *   table.addEventListener('dt-sort', (event) => {
 *     const { field, direction } = event.detail;
 *     table.rows = [...rows].sort((a, b) =>
 *       direction === 'asc'
 *         ? String(a[field]).localeCompare(String(b[field]), undefined, { numeric: true })
 *         : String(b[field]).localeCompare(String(a[field]), undefined, { numeric: true }),
 *     );
 *   });
 * </script>
 * ```
 */
export declare class DtTableView extends HTMLElement {
    private _rows;
    private _columns;
    private readonly _virtualizer;
    private readonly _root;
    private readonly _scroll;
    private readonly _header;
    private readonly _body;
    private readonly _canvas;
    private readonly _emptyState;
    private _resizeObserver;
    private _mutationObserver;
    private _sortField;
    private _sortDirection;
    static get observedAttributes(): string[];
    get rows(): unknown[];
    set rows(value: unknown[]);
    get rowHeight(): number;
    set rowHeight(value: number);
    get sortable(): boolean;
    get emptyText(): string;
    constructor();
    connectedCallback(): void;
    disconnectedCallback(): void;
    attributeChangedCallback(name: string): void;
    private _onScroll;
    private _syncColumns;
    private _render;
    private _renderHeader;
    private _renderBody;
    private _renderRow;
    private _requestSort;
    private _toGridColumn;
}
//# sourceMappingURL=dt-table-view.d.ts.map