import { CSSProperties } from 'react';
import { Dimensions } from "./dimensions";
import { GridTrackTemplate } from "./gridTemplates";
import { GridArea, GridTemplateAreas } from "./gridTemplateAreas";
interface Props {
    dimensionsSupplier: () => Dimensions;
    gridTemplateRows?: GridTrackTemplate;
    gridTemplateColumns?: GridTrackTemplate;
    gridTemplateAreas?: GridTemplateAreas;
    rowGap?: number;
    columnGap?: number;
    showGrid?: boolean;
    styles?: CSSProperties;
    children: JSX.Element | Array<JSX.Element>;
}
/**
 * Grid layout for use when the grid cells need to pass one their size (in pixels) to their
 * children. This is useful when the child uses a canvas or svg element that needs to have its
 * explicit size set.
 *
 * The grid expects a size (width, height) in pixels, which may be supplied by the `DimensionProvider`,
 * and the number rows and columns that comprise the grid. The children of the <Grid/> must be
 * <GridCell/> elements.
 *
 * For single elements requiring a size in pixels, use the raw `DimensionProvider`.
 *
 * Uses CSS grid underneath.
 * @param props The properties defining the grid's dimensions and children
 * @return A JSX element representing the grid
 * @constructor
 */
export declare function Grid(props: Props): JSX.Element;
interface UseGridCellValues extends GridArea {
    width: number;
    height: number;
}
interface CellProps {
    cellKey?: string;
    column?: number | string;
    columnsSpanned?: number;
    row?: number | string;
    rowsSpanned?: number;
    gridAreaName?: string;
    isVisible?: boolean;
    styles?: CSSProperties;
    children: JSX.Element;
}
/**
 * @deprecated use {@link GridItem} instead
 * A cell in the <Grid/> whose location and size are controlled by the <Grid/> parent. The parent <Grid/>
 * component provides the width and height of the entire area it manages. The <GridCell/> uses the width
 * and height from the parent, its grid location and the row and column spans, to determine the width and
 * height of the <GridCell/>. It passes the calculated width and height to it child.
 *
 * Uses CSS grid underneath.
 * @param props The properties defining the location and row and column spans and the width and height
 * managed by the parent <Grid/>
 * @return A sized <GridCell/>
 * @constructor
 */
export declare function GridCell(props: CellProps): JSX.Element;
/**
 * A cell in the <Grid/> whose location and size are controlled by the <Grid/> parent. The parent <Grid/>
 * component provides the width and height of the entire area it manages. The <GridCell/> uses the width
 * and height from the parent, its grid location and the row and column spans, to determine the width and
 * height of the <GridItem/>. It passes the calculated width and height to it child.
 *
 * Uses CSS grid underneath.
 * @param props The properties defining the location and row and column spans and the width and height
 * managed by the parent <Grid/>
 * @return A sized <GridItem/>
 * @constructor
 */
export declare function GridItem(props: CellProps): JSX.Element;
/**
 * React hook used to provide information about the grid cell.
 * @return The width and height of the grid cell and information about the cell's location and spanning
 */
export declare function useGridCell(): UseGridCellValues;
/**
 * React hook used to provide information about the grid cell.
 * @return The width and height of the grid cell and information about the cell's location and spanning
 */
export declare function useGridCellHeight(): number;
/**
 * React hook used to provide information about the grid cell.
 * @return The width and height of the grid cell and information about the cell's location and spanning
 */
export declare function useGridCellWidth(): number;
export {};
//# sourceMappingURL=Grid.d.ts.map