import { ComponentElement, Component } from 'react';
import { Item } from './Item';
import type { FlexItemProps } from './Item/props';
import type { FlexProps } from './props';
/**
---
category: components
---
@module Flex
**/
declare class Flex extends Component<FlexProps> {
    static readonly componentId = "Flex";
    componentDidMount(): void;
    componentDidUpdate(): void;
    static Item: typeof Item;
    static allowedProps: readonly (keyof {
        children?: import("@instructure/shared-types").Renderable;
        as?: import("@instructure/shared-types").AsElementType;
        elementRef?: (element: Element | null) => void;
        height?: string | number;
        width?: string | number;
        margin?: import("@instructure/emotion").Spacing;
        gap?: import("@instructure/emotion").Spacing;
        padding?: import("@instructure/emotion").Spacing;
        display?: "flex" | "inline-flex";
        textAlign?: "start" | "center" | "end";
        direction?: "row" | "column" | "row-reverse" | "column-reverse";
        alignItems?: "center" | "start" | "end" | "stretch";
        justifyItems?: "center" | "start" | "end" | "space-around" | "space-between";
        wrap?: "wrap" | "no-wrap" | "wrap-reverse";
        withVisualDebug?: boolean;
    })[];
    static defaultProps: {
        as: string;
        direction: string;
        justifyItems: string;
        display: string;
        withVisualDebug: boolean;
        wrap: string;
        gap: string;
    };
    ref: Element | null;
    handleRef: (el: Element | null) => void;
    renderChildren(children: FlexProps['children']): (string | number | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | ComponentElement<FlexItemProps, Item>)[] | null | undefined;
    render(): import("@emotion/react/jsx-runtime").JSX.Element | null;
}
export default Flex;
export { Flex, Item as FlexItem };
//# sourceMappingURL=index.d.ts.map