import { CellRenderContext, ColumnEditorContext } from '@toolbox-web/grid';
import { ReactNode } from 'react';
/**
 * Props for the GridColumn component.
 */
export interface GridColumnProps<TRow = unknown, TValue = unknown> {
    /** Field key in the row object */
    field: keyof TRow & string;
    /** Column header text (defaults to capitalized field) */
    header?: string;
    /** Column data type */
    type?: 'string' | 'number' | 'date' | 'boolean' | 'select' | 'typeahead';
    /** Whether the column is editable */
    editable?: boolean;
    /** Whether the column is sortable */
    sortable?: boolean;
    /** Whether the column is resizable */
    resizable?: boolean;
    /** Column width (e.g., "100px", "10%") */
    width?: string | number;
    /** Minimum width for stretch mode */
    minWidth?: number;
    /** Initial column display index */
    order?: number;
    /** Whether the column is hidden */
    hidden?: boolean;
    /** Prevent column from being hidden */
    lockVisible?: boolean;
    /**
     * Custom cell renderer (render prop pattern).
     * Receives cell context and returns React node.
     *
     * @example
     * ```tsx
     * <GridColumn field="status">
     *   {(ctx) => <StatusBadge status={ctx.value} />}
     * </GridColumn>
     * ```
     */
    children?: (ctx: CellRenderContext<TRow, TValue>) => ReactNode;
    /**
     * Custom cell editor.
     * Receives editor context with commit/cancel functions.
     *
     * @example
     * ```tsx
     * <GridColumn
     *   field="name"
     *   editable
     *   editor={(ctx) => (
     *     <input
     *       defaultValue={ctx.value}
     *       onBlur={(e) => ctx.commit(e.target.value)}
     *       onKeyDown={(e) => e.key === 'Escape' && ctx.cancel()}
     *     />
     *   )}
     * />
     * ```
     */
    editor?: (ctx: ColumnEditorContext<TRow, TValue>) => ReactNode;
    /** Select/typeahead options */
    options?: Array<{
        label: string;
        value: unknown;
    }>;
    /** Allow multiple selection (for select/typeahead) */
    multi?: boolean;
    /** Custom formatter function */
    format?: (value: TValue, row: TRow) => string;
}
/**
 * Column configuration component for use with DataGrid.
 *
 * Renders a `<tbw-grid-column>` custom element in the light DOM
 * and registers React renderers/editors with the adapter.
 *
 * ## Basic Usage
 *
 * ```tsx
 * <DataGrid rows={rows}>
 *   <GridColumn field="name" header="Full Name" />
 *   <GridColumn field="age" type="number" sortable />
 * </DataGrid>
 * ```
 *
 * ## Custom Renderer
 *
 * ```tsx
 * <GridColumn field="status">
 *   {(ctx) => (
 *     <span className={`status-${ctx.value}`}>
 *       {ctx.value}
 *     </span>
 *   )}
 * </GridColumn>
 * ```
 *
 * ## Custom Editor
 *
 * ```tsx
 * <GridColumn
 *   field="price"
 *   editable
 *   editor={(ctx) => (
 *     <input
 *       type="number"
 *       defaultValue={ctx.value}
 *       onBlur={(e) => ctx.commit(Number(e.target.value))}
 *       onKeyDown={(e) => {
 *         if (e.key === 'Enter') ctx.commit(Number(e.currentTarget.value));
 *         if (e.key === 'Escape') ctx.cancel();
 *       }}
 *     />
 *   )}
 * />
 * ```
 *
 * @category Component
 */
export declare function GridColumn<TRow = unknown, TValue = unknown>(props: GridColumnProps<TRow, TValue>): React.ReactElement;
//# sourceMappingURL=grid-column.d.ts.map