import * as React from 'react';
import { FormElement, FormComponentProps, FormComponent } from '@tomino/dynamic-form';
import { BoundProp } from '@tomino/dynamic-form';
import { ContextType } from '../context';
export declare const grid: string;
export declare type Props = {
    EditorCell?: React.ComponentType<any>;
    controls?: FormElement[];
};
export declare type GridProps = {
    rows?: BoundProp<number>;
    rowsReadOnly?: BoundProp<number>;
    templateRows?: BoundProp;
    templateRowsReadOnly?: BoundProp;
    columns?: BoundProp<number>;
    columnsReadOnly?: BoundProp<number>;
    templateColumns?: BoundProp;
    templateColumnsReadOnly?: BoundProp;
    columnSize?: BoundProp;
    rowSize?: BoundProp;
    alignItems?: BoundProp;
    justifyItems?: BoundProp;
    gap?: BoundProp;
};
export declare type GridChildProps = {
    width?: BoundProp<number>;
    height?: BoundProp<number>;
    row?: BoundProp<number>;
    column?: BoundProp<number>;
    justifySelf?: BoundProp;
    alignSelf?: BoundProp;
};
export declare function sortGrid(context: ContextType, props: FormComponentProps): (a: FormElement<GridChildProps, any>, b: FormElement<GridChildProps, any>) => 1 | -1;
export declare function createColumnStyles(props: FormComponentProps, formElement: FormElement<GridChildProps>, context: ContextType): {
    gridColumn: string;
    gridRow: string;
    justifySelf: any;
    alignSelf: any;
};
export declare function createGridStyles(props: FormComponentProps<GridProps>, context: ContextType, readOnly: boolean): {
    gridTemplateColumns: string;
    gridTemplateRows: string;
    gridAutoColumns: any;
    gridAutoRows: any;
    alignItems: any;
    justifyItems: any;
    gridGap: any;
};
export declare const Grid: React.FC<FormComponentProps<GridProps, GridChildProps> & Props>;
export declare const GridView: FormComponent<GridProps, GridChildProps>;