@workday/canvas-kit-react/dist/es6/layout/lib/utils/flex.d.ts

The parent module that contains all Workday Canvas Kit React components

import { Property, Globals } from 'csstype';
import { StyleFnConfig } from './buildStyleFns';
import { SystemPropValues } from './systemProps';
/** style props to for CSS flexbox container properties */
export type FlexStyleProps = {
    /** sets [CSS align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items) */
    alignItems?: Property.AlignItems;
    /** sets [CSS align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content) */
    alignContent?: Property.AlignContent;
    /**
     * - sets [CSS display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display)
     * - @default 'flex'
     * */
    display?: 'flex' | 'inline-flex' | 'none' | Globals | (string & {});
    /** sets [CSS justify-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items) */
    justifyItems?: Property.JustifyItems;
    /** sets [CSS justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content) */
    justifyContent?: Property.JustifyContent;
    /** sets [CSS flex-wrap property](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-wrap) */
    flexWrap?: Property.FlexWrap;
    /** sets [CSS flex-direction property](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-direction) */
    flexDirection?: Property.FlexDirection;
    /**
     * - sets [CSS gap property](https://developer.mozilla.org/en-US/docs/Web/CSS/gap)
     * - system tokens: `space`
     * */
    gap?: SystemPropValues['space'];
    /**
     * - sets [CSS column-gap property](https://developer.mozilla.org/en-US/docs/Web/CSS/column-gap)
     * - system tokens: `space`
     * */
    columnGap?: SystemPropValues['space'];
    /**
     * - sets [CSS row-gap property](https://developer.mozilla.org/en-US/docs/Web/CSS/row-gap)
     * - system tokens: `space`
     * */
    rowGap?: SystemPropValues['space'];
};
export declare const flexStyleFnConfigs: StyleFnConfig[];
export declare const flexStyleFns: import("./buildStyleFns").StyleFns;
/**
 * A style prop function that takes component props and returns flexbox styles.
 * If no `FlexStyleProps` are found, it returns an empty object.
 *
 * @example
 * ```tsx
 * const FlexExample = () => (
 *   <Flex justifyContent="center" alignItems="center">
 *     Hello, flex!
 *   </Flex>
 * );
 * ```
 */
export declare const flex: (props: FlexStyleProps) => {};
//# sourceMappingURL=flex.d.ts.map