import "./data_grid.css";
import type * as React from "react";
import { type ReactNode } from "react";
import { useRender } from "@base-ui/react/use-render";
import { type SortState, type SortHeaderLabels } from "./sort_header";
import { type StyleProps } from "./style_props";
export interface DataGridColumn<T> {
    key: string;
    label: string;
    /** Omit for the flexible primary column. */
    width?: number;
    /** Money and counts right, so digits line up; text left (default). */
    align?: "left" | "right";
    sortable?: boolean;
    cell: (item: T) => ReactNode;
    /** A subtotal or resolved measure; the footer row renders when any column defines one. */
    footer?: (group: DataGridGroup<T>) => ReactNode;
}
export interface DataGridGroup<T> {
    key: string;
    /** Omit for a single ungrouped section. */
    header?: ReactNode;
    items: T[];
}
export interface DataGridProps<T> extends StyleProps {
    columns: DataGridColumn<T>[];
    /** The consumer owns grouping, sort and filter; one headerless group is ungrouped. */
    groups: DataGridGroup<T>[];
    getRowKey: (item: T) => string;
    /** And the gutter it reserves so the header lines up. */
    leading?: {
        width: number;
        render: (item: T) => ReactNode;
    };
    sort?: SortState | null;
    /** Pair with `cycleSort`; sorting is the consumer's (`sortBy`). */
    onSort?: (key: string) => void;
    labels?: SortHeaderLabels;
    collapsed?: Set<string>;
    onToggleCollapse?: (key: string) => void;
    /**
     * For content outside the columns, typically an add row; a column subtotal is
     * `DataGridColumn.footer`.
     */
    renderGroupFooter?: (group: DataGridGroup<T>) => ReactNode;
    testID?: string;
    ref?: React.Ref<HTMLElement>;
    render?: useRender.RenderProp;
}
/**
 * Reuse it for an aligned add row. It is the register band the sheet reads via
 * `--lotics-register-*`.
 */
export declare const gridRowStyle: {
    readonly flexDirection: "row";
    readonly alignItems: "center";
    readonly gap: 24;
    readonly minHeight: 40;
};
/**
 * The inline-managed grouped table: sortable header, collapsible sections, aligned rows; the
 * consumer owns data, state and cells. Renders every row, no virtualization.
 */
export declare function DataGrid<T>(props: DataGridProps<T>): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;