import * as React from 'react';
export interface LayoutProps {
    /** Applies a data-hook HTML attribute that can be used in the tests. */
    dataHook?: string;
    /** Accept single or multiple compound <Cell/> elements which store content items. Other nodes are accepted but not recommended. */
    children?: React.ReactNode;
    /**
     * Specifies a CSS class name to be appended to the component's root element.
     * @internal
     */
    className?: string;
    /**
     * Control both vertical and horizontal distance between layout cells.
     * @default 24px
     */
    gap?: React.CSSProperties['gap'];
    /** Set a number of grid columns to be rendered. */
    cols?: number;
    /** Align grid items on the X axis */
    justifyItems?: React.CSSProperties['justifyItems'];
    /** Aligns grid items on the Y axis */
    alignItems?: React.CSSProperties['alignItems'];
    /**
     * Set all rows to have the same height in pixels or percentage.
     * @default auto
     */
    rowHeight?: React.CSSProperties['gridAutoRows'];
    /** Set the height of the layout */
    height?: React.CSSProperties['height'];
}
export interface CellProps {
    /** hook for testing purposes */
    dataHook?: string;
    /** any node to be rendered inside */
    children?: React.ReactNode;
    /**
     * how many columns should this cell occupy. Can be any number from 1 to 12 inclusive.
     * @default 12
     */
    span?: number;
    /** whether to align children vertically to the middle */
    vertical?: boolean;
    /**
     * how many rows should this cell occupy.
     * @default 1
     */
    rows?: number;
    /**
     * Specifies a CSS class name to be appended to the component's root element.
     * @internal
     */
    className?: string;
}
//# sourceMappingURL=Layout.types.d.ts.map