import * as React from "react";
import { type Breakpoints } from "../styles";
import type { MergeElementProps } from "../typings";
declare type ResponsivePropType<T> = T | Partial<Record<Breakpoints["keys"][number] | "fallback", T>>;
interface FlexBaseProps {
    /**
     * The content of the component.
     */
    children?: React.ReactNode;
    /**
     * Append to the classNames applied to the component so you can override or
     * extend the styles.
     */
    className?: string;
    /**
     * The variant of the flexbox.
     * @default "block"
     */
    variant?: ResponsivePropType<"block" | "inline">;
    /**
     * Changes how flex items wrap in the flexbox.
     * @default "nowrap"
     */
    wrap?: ResponsivePropType<"nowrap" | "wrap" | "wrap-reverse">;
    /**
     * Sets the gap between flex items in the flexbox.
     */
    gap?: ResponsivePropType<"xxs" | "xs" | "sm" | "md" | "lg" | "xlg">;
    /**
     * Sets the direction of flex items in the flexbox.
     * @default "row"
     */
    direction?: ResponsivePropType<"row" | "column" | "row-reverse" | "column-reverse">;
    /**
     * Changes the alignment of flex items on the main axis in the flexbox.
     * @default "start"
     */
    mainAxisAlignment?: ResponsivePropType<"start" | "end" | "center" | "between" | "around" | "evenly">;
    /**
     * Changes the alignment of flex items on the cross axis in the flexbox.
     * @default "stretch"
     */
    crossAxisAlignment?: ResponsivePropType<"start" | "end" | "center" | "baseline" | "stretch">;
    /**
     * Aligns flex items together on the cross axis in the flexbox.
     * (Note: This property has no effect on single rows of flex items.)
     * @default "start"
     */
    contentAlignment?: ResponsivePropType<"start" | "end" | "center" | "between" | "around" | "evenly" | "stretch">;
}
export declare type FlexProps<T extends React.ElementType = "div"> = MergeElementProps<T, FlexBaseProps & {
    /**
     * The component used for the root node.
     * Either a string to use a HTML element or a component.
     */
    as?: T;
}>;
declare type Component = {
    <T extends React.ElementType = "div">(props: FlexProps<T>): JSX.Element;
    propTypes?: React.WeakValidationMap<FlexProps> | undefined;
    displayName?: string | undefined;
};
declare const Flex: Component;
export default Flex;