import { ElementType, HTMLAttributes } from 'react';
import { ResponsiveStyleValue } from 'theme-ui';
import { CSSLength } from '../theme';
export declare const CONTAINER_MAX_WIDTH_DEFAULT = 1288;
export declare const CONTAINER_PADDING_MOBILE = 16;
export declare const CONTAINER_PADDING_DESKTOP = 32;
/**
 * Centered container to wrap page content in, with a default but adjustable `maxWidth` as well as left and right `padding`.
 * Containers can be nested and will automatically break out of their parent container as needed (e.g. if a nested container
 * has a larger `maxWidth` than its parent).
 */
export declare const Container: import('react').ForwardRefExoticComponent<{
    /** Element type to render. Defaults to `div`. */
    as?: ElementType;
    /** Maximum width of the container's content area (excluding the padding). Defaults to `1288px`. */
    maxWidth?: ResponsiveStyleValue<CSSLength>;
    /** Padding of the container's content area. Defaults to `16px` on mobile and `32px` on desktop. */
    padding?: ResponsiveStyleValue<CSSLength>;
} & HTMLAttributes<HTMLElement> & import('react').RefAttributes<HTMLElement>>;
//# sourceMappingURL=Container.d.ts.map