@cbinsights/fds/lib/components/Flex/index.d.ts

Form: A design system by CB Insights

import React from 'react';
/**
 * @description map of alignment prop values to class names
 */
export declare const DirectionPropMap: {
    row: string;
    column: string;
};
/**
 * @description map of justify prop values to class names
 */
export declare const JustifyPropMap: {
    end: string;
    center: string;
    spaceBetween: string;
    spaceAround: string;
};
/**
 * @description map of align prop values to class names
 */
export declare const AlignPropMap: {
    start: string;
    end: string;
    center: string;
    stretch: string;
};
export interface FlexProps {
    /** sets flex-direction (along with either 100% height or width) */
    direction?: 'row' | 'column';
    /** switches flex-direction at a given breakpoint */
    switchDirection?: 'xs' | 's' | 'm' | 'l' | 'xl';
    /** sets standard justify-content */
    justify?: 'end' | 'center' | 'spaceBetween' | 'spaceAround';
    /** sets standard align-items */
    align?: 'start' | 'end' | 'center' | 'stretch';
    /** When set, gutters are removed from `FlexItem` children */
    noGutters?: boolean;
    /** When set, `FlexItem` order is rendered in reverse */
    reverse?: boolean;
    /** React children (should be of type `FlexItem`) */
    children: React.ReactNode;
}
/**
 * @param {Object} props react props
 * @returns {ReactElement}
 */
declare const Flex: ({ align, direction, switchDirection: breakpoint, reverse, justify, noGutters, children, }: FlexProps) => JSX.Element;
export default Flex;