import * as react from 'react';
import { ReactNode, ComponentProps } from 'react';
import * as react_jsx_runtime from 'react/jsx-runtime';
import { FlexDirectionProp, AlignContentProp, FlexBasisProp, ColumnGapProp, GapProp, FlexGrowProp, RowGapProp, FlexShrinkProp, FlexWrapProp } from '../../styling/src/styled-system/props-handler.js';
import { SlotProps, InternalProps, StyledComponentProps, OmitInternalProps } from '../../shared/src/types.js';
import { ResponsiveProp } from '../../styling/src/useResponsiveValue.js';
import { Property } from 'csstype';
import '../../shared/src/type-fest.js';
import '../../styling/src/styled-system/StylingContext.js';
import '../../styling/src/BreakpointProvider.js';

type FlexOrientation = "horizontal" | "vertical";
type FlexAlignment = "start" | "end" | "center";
type FlexOrientationProp = ResponsiveProp<FlexOrientation>;
type FlexAlignmentProp = ResponsiveProp<FlexAlignment>;
interface UseFlexAlignmentProps {
    alignX?: FlexAlignment;
    alignY?: FlexAlignment;
    orientation: FlexOrientation;
}
declare function useFlexAlignment({ alignX, alignY, orientation }: UseFlexAlignmentProps): {
    alignItems: FlexAlignment;
    direction: FlexDirectionProp;
    justifyContent: FlexAlignment;
};
declare const DefaultElement = "div";
type SafeAlignItemsProp = ResponsiveProp<Omit<Property.AlignItems, "flex-start" | "flex-end">>;
type SafeJustifyContentProp = ResponsiveProp<Omit<Property.JustifyContent, "flex-start" | "flex-end">>;
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;
}
declare function InnerFlex(props: InnerFlexProps): react_jsx_runtime.JSX.Element;
declare namespace InnerFlex {
    var defaultElement: string;
}
/**
 * A layout container using flexbox.
 *
 * [Documentation](https://wl-orbiter-website.netlify.app/?path=/docs/flex--horizontal)
*/
declare const Flex: react.ForwardRefExoticComponent<Omit<OmitInternalProps<InnerFlexProps>, "ref"> & react.RefAttributes<any>>;
type FlexProps = ComponentProps<typeof Flex>;

export { Flex, type FlexAlignment, type FlexAlignmentProp, type FlexOrientation, type FlexOrientationProp, type FlexProps, InnerFlex, type InnerFlexProps, type SafeAlignItemsProp, type SafeJustifyContentProp, type UseFlexAlignmentProps, useFlexAlignment };