@cimpress/react-components/dist/src/GridLayout/GridLayout.d.ts

React components to support the MCP styleguide

import * as React from 'react';
type GapSize = 0 | 8 | 16 | 24 | 32 | 40 | 48 | 56 | 64 | 80 | 96;
type ColumnCount = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
export interface GridLayoutProps {
    children?: React.ReactNode;
    className?: string;
    style?: React.CSSProperties;
    gap?: GapSize;
}
export declare function GridLayout({ children, className, style, gap, ...props }: GridLayoutProps): React.JSX.Element;
export declare namespace GridLayout {
    var Item: typeof GridLayoutItem;
}
interface GridItemProps {
    children?: React.ReactNode;
    className?: string;
    style?: React.CSSProperties;
    /** Number of columns to span */
    span?: ColumnCount;
    /** Number of columns to span at `>640px` */
    smSpan?: ColumnCount;
    /** Number of columns to span at `>768px` */
    mdSpan?: ColumnCount;
    /** Number of columns to span at `>1024px` */
    lgSpan?: ColumnCount;
    /** Number of columns to span at `>1280px` */
    xlSpan?: ColumnCount;
    /** Starting point of column */
    start?: ColumnCount;
    /** Starting point of column at `>640px` */
    smStart?: ColumnCount;
    /** Starting point of column at `>768px` */
    mdStart?: ColumnCount;
    /** Starting point of column at `>1024px` */
    lgStart?: ColumnCount;
    /** Starting point of column at `>1280px` */
    xlStart?: ColumnCount;
}
export declare function GridLayoutItem({ children, className, style, span, smSpan, mdSpan, lgSpan, xlSpan, start, smStart, mdStart, lgStart, xlStart, ...props }: GridItemProps): React.JSX.Element;
export {};
//# sourceMappingURL=GridLayout.d.ts.map