import * as React from "react";
export type AlignOptions = "start" | "center" | "end";
export type JustifyOptions = AlignOptions | "around" | "between";
export type GridPoints = boolean | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "auto" | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
export type OrderOptions = GridPoints | "last" | "first";
export type DisplayValues = "none" | "inline" | "inline-block" | "block" | "table" | "table-row" | "table-cell" | "flex" | "inline-flex";
export interface DisplayableProps {
    dXs?: DisplayValues;
    dSm?: DisplayValues;
    dMd?: DisplayValues;
    dLg?: DisplayValues;
    dXl?: DisplayValues;
    order?: OrderOptions;
    xsStyle?: React.CSSProperties;
    smStyle?: React.CSSProperties;
    mdStyle?: React.CSSProperties;
    lgStyle?: React.CSSProperties;
    xlStyle?: React.CSSProperties;
    alignItems?: AlignOptions;
    justifyContent?: JustifyOptions;
    id?: string;
    className?: string;
    [other: string]: any;
}
export declare const injectBreakpointStyles: (props: DisplayableProps) => import("@emotion/react").SerializedStyles;
export declare const injectDisplayClasses: ({ dXs, dSm, dMd, dLg, dXl, alignItems, justifyContent, order, }: DisplayableProps) => {
    [x: string]: boolean;
};
export declare const ripBreakpointStyleProps: (props: DisplayableProps) => {
    xsStyle: React.CSSProperties | undefined;
    smStyle: React.CSSProperties | undefined;
    mdStyle: React.CSSProperties | undefined;
    lgStyle: React.CSSProperties | undefined;
    xlStyle: React.CSSProperties | undefined;
};
export declare const ripDisplayProps: (props: DisplayableProps) => {
    dXs: DisplayValues | undefined;
    dSm: DisplayValues | undefined;
    dMd: DisplayValues | undefined;
    dLg: DisplayValues | undefined;
    dXl: DisplayValues | undefined;
    order: OrderOptions | undefined;
    justifyContent: JustifyOptions | undefined;
    alignItems: AlignOptions | undefined;
};
export { default as Display } from "./Display";
export { default as Column } from "./Column";
export { default as Container } from "./Container";
export { default as Row } from "./Row";