import * as React from "react";
import { Sorter } from "./Util";
export type Column<A, B = string> = {
    /**
     * An id given to that column. Needed for persistence.
     */
    id: B;
    /**
     * Renderer for the cells of that column.
     */
    render: (a: A) => React.ReactNode;
    /**
     * Render a header cell
     */
    header?: React.ReactNode;
    /**
     * A function to sort the entries of the table.
     * It first needs to handle a direction and then has to compare two elements.
     * e.g. (dir: "asc" | "desc", dirAsNum: 1 | -1) => (a: number, b: number ) => dirAsNum * (a - b)
     */
    sorter?: Sorter<A>;
    /**
     * The initial width of that column. Will be interpolated to a grid-template:
     * https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-columns
     * Fine:
     * - `"20px"`
     * - `"10%"`
     * - `"1fr"`
     * - `"mixmax(100px, 1fr)"`
     * - ...
     * Note that each row calculates its own grid, so using e.g max-content might not be a good idea.
     */
    initialWidth?: string;
    /**
     * Text alignment for cells in the column
     */
    textAlign?: React.CSSProperties["textAlign"];
    /**
     * The contentNoWrap prop sets the `whitespace` to `nowrap` which prevents content from wrapping within the cell. The default is set to true to preserve truncation backwards compatibility.
     */
    contentNoWrap?: boolean;
};
type TableProps<A, B = string, C extends B = B> = {
    /**
     * Table columns
     */
    columns: Array<Column<A, B>>;
    /**
     * The ID and direction to initially sort by.
     */
    initialSorter?: {
        by: C;
        order?: "asc" | "desc";
    };
    /**
     * A callback invoked whenever the internal state of the table is changed.
     * Have a look at the State type to see what's in there.
     */
    onStateChange?: (a: State) => void;
    /**
     * Whether the first column shall be sticky. Defaults to true.
     */
    stickyFirstCol?: boolean;
    /**
     * A function that provides a stable and unique ID for entries in the table.
     */
    toId: (a: A) => string;
};
type State = {
    sortBy: string | null;
    order: "asc" | "desc";
    columns: Array<{
        id: string;
        width: string | null;
    }>;
};
type DivProps = React.HTMLAttributes<HTMLDivElement>;
export declare function Table<Entry, ColIDs extends string, Sort extends ColIDs>({ data, columns, initialSorter, onStateChange, stickyFirstCol, toId, children, ...divProps }: {
    data: readonly Entry[];
} & DivProps & TableProps<Entry, ColIDs, Sort>): React.JSX.Element;
export {};