import { HTMLAttributes } from 'react';
import { AlignExtendedType, AlignType } from './types';
export declare const Grid: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
    /**
     * Supports CSS Grid template areas syntax.
     *
     * @example
     * <Grid templateAreas="header header header" />
     * <Grid templateAreas={["header header header", "sidebar main main", "footer footer footer"]} />
     */
    templateAreas?: string | string[] | undefined;
    autoFlow?: "row" | "column" | "dense" | "row dense" | "column dense" | undefined;
    autoColumns?: string | undefined;
    autoRows?: string | undefined;
    /**
     * Supports CSS Grid template columns syntax.
     *
     * If you pass a number, columns will be created using repeat(n, 1fr).
     *
     * @example
     * <Grid columns="1fr 1fr 1fr" />
     * <Grid columns={3} />
     */
    columns?: string | number | undefined;
    /**
     * Supports CSS Grid template rows syntax.
     *
     * If you pass a number, rows will be created using repeat(n, 1fr).
     *
     * @example
     * <Grid rows="1fr 1fr 1fr" />
     * <Grid rows={3} />
     */
    rows?: string | number | undefined;
    gap?: "small" | "extra-small" | "medium" | "large" | "extra-large" | undefined;
    columnGap?: "small" | "extra-small" | "medium" | "large" | "extra-large" | undefined;
    rowGap?: "small" | "extra-small" | "medium" | "large" | "extra-large" | undefined;
    justifyItems?: AlignType | undefined;
    alignItems?: AlignType | undefined;
    justifyContent?: AlignExtendedType | undefined;
    alignContent?: AlignExtendedType | undefined;
    inline?: boolean | undefined;
    asChild?: boolean | undefined;
} & import("react").RefAttributes<HTMLDivElement>>;
//# sourceMappingURL=grid.d.ts.map