import { CactusTheme } from '@repay/cactus-theme';
import { Property } from 'csstype';
import { StyledComponentBase } from 'styled-components';
import * as SS from 'styled-system';
import { FlexBoxProps } from '../Flex/Flex';
import { FlexItemProps } from '../helpers/styled';
import { screenSizes } from '../ScreenSizeProvider/ScreenSizeProvider';
declare const COLUMN_NUMS: readonly [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
declare type ScreenSize = typeof screenSizes[number];
declare type ColumnNum = typeof COLUMN_NUMS[number];
declare type PseudoFlexProps = {
    [K in ScreenSize]?: ColumnNum;
};
interface GridBoxProps extends FlexBoxProps {
    rows?: SS.ResponsiveValue<Property.GridTemplateRows<string | number>>;
    cols?: SS.ResponsiveValue<Property.GridTemplateColumns<string | number>>;
    columns?: SS.ResponsiveValue<Property.GridTemplateColumns<string | number>>;
    justify?: SS.ResponsiveValue<Property.JustifyItems>;
    justifyItems?: SS.ResponsiveValue<Property.JustifyItems>;
    autoFlow?: SS.ResponsiveValue<Property.GridAutoFlow>;
    autoRows?: SS.ResponsiveValue<Property.GridAutoRows<string | number>>;
    autoCols?: SS.ResponsiveValue<Property.GridAutoColumns<string | number>>;
    autoColumns?: SS.ResponsiveValue<Property.GridAutoColumns<string | number>>;
    gridAreas?: {
        [key: string]: SS.ResponsiveValue<Property.GridArea>;
    };
    grid?: SS.ResponsiveValue<Property.Grid>;
    gridTemplate?: SS.ResponsiveValue<Property.GridTemplate>;
    gridTemplateAreas?: SS.ResponsiveValue<Property.GridTemplateAreas>;
}
interface GridItemProps extends FlexItemProps, PseudoFlexProps {
    row?: SS.ResponsiveValue<Property.GridRow>;
    rowStart?: SS.ResponsiveValue<Property.GridRowStart>;
    rowEnd?: SS.ResponsiveValue<Property.GridRowEnd>;
    col?: SS.ResponsiveValue<Property.GridColumn>;
    column?: SS.ResponsiveValue<Property.GridColumn>;
    colStart?: SS.ResponsiveValue<Property.GridColumnStart>;
    columnStart?: SS.ResponsiveValue<Property.GridColumnStart>;
    colEnd?: SS.ResponsiveValue<Property.GridColumnEnd>;
    columnEnd?: SS.ResponsiveValue<Property.GridColumnEnd>;
    gridArea?: SS.ResponsiveValue<Property.GridArea>;
    justifySelf?: SS.ResponsiveValue<Property.JustifySelf>;
}
interface GridComponent extends StyledComponentBase<'div', CactusTheme, GridBoxProps> {
    Item: StyledComponentBase<'div', CactusTheme, GridItemProps>;
    supportsGrid: boolean;
    supportsGap: boolean;
}
export declare const GridItem: StyledComponentBase<"div", CactusTheme, GridItemProps, never>;
export declare const Grid: GridComponent;
export default Grid;