import { AlignContentProp, ColumnGapProp, FlexBasisProp, FlexDirectionProp, FlexGrowProp, FlexShrinkProp, FlexWrapProp, GapProp, ResponsiveProp, RowGapProp } from "../../styling";
import { ComponentProps, ReactNode } from "react";
import { InternalProps, OmitInternalProps, SlotProps, StyledComponentProps } from "../../shared";
import { Property } from "csstype";
export declare type FlexOrientation = "horizontal" | "vertical";
export declare type FlexAlignment = "start" | "end" | "center";
export declare type FlexOrientationProp = ResponsiveProp<FlexOrientation>;
export declare type FlexAlignmentProp = ResponsiveProp<FlexAlignment>;
export interface UseFlexAlignmentProps {
    alignX?: FlexAlignment;
    alignY?: FlexAlignment;
    orientation: FlexOrientation;
}
export declare function useFlexAlignment({ alignX, alignY, orientation }: UseFlexAlignmentProps): {
    alignItems: FlexAlignment;
    direction: FlexDirectionProp;
    justifyContent: FlexAlignment;
};
declare const DefaultElement = "div";
export declare type SafeAlignItemsProp = ResponsiveProp<Omit<Property.AlignItems, "flex-start" | "flex-end">>;
export declare type SafeJustifyContentProp = ResponsiveProp<Omit<Property.JustifyContent, "flex-start" | "flex-end">>;
export interface InnerFlexProps extends SlotProps, InternalProps, Omit<StyledComponentProps<typeof DefaultElement>, "alignContent" | "alignItems" | "columnGap" | "display" | "flex" | "flexBasis" | "flexDirection" | "flexWrap" | "gap" | "justifyContent" | "rowGap" | "wrap"> {
    /**
     * See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).
     */
    alignContent?: AlignContentProp;
    /**
     * See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).
     */
    alignItems?: SafeAlignItemsProp;
    /**
     * Alias for [flex basis](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-basis);
     */
    basis?: FlexBasisProp;
    /**
     * React children.
     */
    children: ReactNode;
    /**
     * See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/column-gap).
     */
    columnGap?: ColumnGapProp;
    /**
     * Alias for [flex-direction](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-direction).
     */
    direction?: FlexDirectionProp;
    /**
     * Whether the elements take up all the space of their container.
     */
    fluid?: ResponsiveProp<boolean>;
    /**
     * See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/gap).
     */
    gap?: GapProp;
    /**
     * See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-grow).
     */
    grow?: FlexGrowProp;
    /**
     * Whether or not the element generate line breaks before or after himself.
     */
    inline?: boolean;
    /**
     * See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).
     */
    justifyContent?: SafeJustifyContentProp;
    /**
     * Whether or not to reverse the order of the elements.
     */
    reverse?: boolean;
    /**
     * See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/row-gap).
     */
    rowGap?: RowGapProp;
    /**
     * See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-shrink).
     */
    shrink?: FlexShrinkProp;
    /**
     * Alias for [flex-wrap](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-wrap).
     */
    wrap?: FlexWrapProp;
}
export declare function InnerFlex(props: InnerFlexProps): JSX.Element;
export declare namespace InnerFlex {
    var defaultElement: string;
}
/**
 * A layout container using flexbox.
 *
 * [Documentation](https://orbit.sharegate.design/?path=/docs/flex--horizontal)
*/
export declare const Flex: import("react").ForwardRefExoticComponent<Omit<OmitInternalProps<InnerFlexProps, never>, "ref"> & import("react").RefAttributes<any>>;
export declare type FlexProps = ComponentProps<typeof Flex>;
export {};