import * as React from "react";
interface BgImageOptions {
    size?: React.CSSProperties["backgroundSize"];
    position?: React.CSSProperties["backgroundPosition"];
    repeat?: React.CSSProperties["backgroundRepeat"];
}
export interface BoxProps {
    /**
     * Applies a background color
     */
    bgColor?: React.CSSProperties["backgroundColor"];
    /**
     * Applies a background image
     */
    bgImageUrl?: string;
    /**
     * Options for how the background image should be displayed
     */
    bgImageOptions?: BgImageOptions;
    /**
     * Modifies the `display` property
     */
    display?: React.CSSProperties["display"];
    /**
     * Vertically aligns the direct children of the component
     */
    vertAlignChildren?: "top" | "bottom" | "center";
    /**
     * Hides the component and it's children visually, but still keeps them visual to screenreaders
     */
    isVisuallyHidden?: boolean;
    /**
     * Aligns text or inline and inline-block elements
     */
    textAlign?: React.CSSProperties["textAlign"];
    /**
     * Which HTML tag to render the component with
     */
    tag?: keyof React.ReactHTML;
    /**
     * Allows custom styling
     */
    className?: string;
    /**
     * Human-readable selector used for writing tests
     */
    "data-cy"?: string;
    children?: React.ReactNode;
}
declare const Box: (props: BoxProps) => React.JSX.Element;
export default Box;