import React from "react";
export declare const colors: {
    readonly dangerDarker: "var(--add-ons-danger-30)";
    readonly dangerDark: "var(--add-ons-danger-40)";
    readonly danger: "var(--add-ons-danger-50)";
    readonly dangerLight: "var(--add-ons-danger-60)";
    readonly dangerLighter: "var(--add-ons-danger-70)";
    readonly dangerLightest: "var(--add-ons-danger-90)";
    readonly warningDarker: "var(--add-ons-warning-30)";
    readonly warningDark: "var(--add-ons-warning-40)";
    readonly warning: "var(--add-ons-warning-50)";
    readonly warningLight: "var(--add-ons-warning-60)";
    readonly warningLighter: "var(--add-ons-warning-70)";
    readonly warningLightest: "var(--add-ons-warning-80)";
    readonly successDarker: "var(--add-ons-success-30)";
    readonly successDark: "var(--add-ons-success-40)";
    readonly success: "var(--add-ons-success-50)";
    readonly successLight: "var(--add-ons-success-60)";
    readonly successLighter: "var(--add-ons-success-80)";
    readonly successLightest: "var(--add-ons-success-90)";
    readonly infoDarker: "var(--add-ons-interaction-30)";
    readonly infoDark: "var(--add-ons-interaction-40)";
    readonly info: "var(--add-ons-interaction-50)";
    readonly infoLight: "var(--add-ons-interaction-60)";
    readonly infoLighter: "var(--add-ons-interaction-80)";
    readonly infoLightest: "var(--add-ons-interaction-90)";
    readonly interactionDarker: "var(--add-ons-interaction-30)";
    readonly interactionDark: "var(--add-ons-interaction-40)";
    readonly interaction: "var(--add-ons-interaction-50)";
    readonly interactionLight: "var(--add-ons-interaction-60)";
    readonly interactionLighter: "var(--add-ons-interaction-80)";
    readonly interactionLightest: "var(--add-ons-interaction-90)";
    readonly neutralDarker: "var(--t-fill-color-neutral-000)";
    readonly neutralDark: "var(--t-fill-color-neutral-010)";
    readonly neutral: "var(--t-fill-color-neutral-020)";
    readonly neutralLight: "var(--t-fill-color-neutral-030)";
    readonly neutralLighter: "var(--t-fill-color-neutral-060)";
    readonly neutralLightest: "var(--t-fill-color-neutral-080)";
    readonly danger30: "var(--add-ons-danger-30)";
    readonly danger40: "var(--add-ons-danger-40)";
    readonly danger50: "var(--add-ons-danger-50)";
    readonly danger60: "var(--add-ons-danger-60)";
    readonly danger70: "var(--add-ons-danger-70)";
    readonly danger80: "var(--add-ons-danger-80)";
    readonly danger90: "var(--add-ons-danger-90)";
    readonly warning30: "var(--add-ons-warning-30)";
    readonly warning40: "var(--add-ons-warning-40)";
    readonly warning50: "var(--add-ons-warning-50)";
    readonly warning60: "var(--add-ons-warning-60)";
    readonly warning70: "var(--add-ons-warning-70)";
    readonly warning80: "var(--add-ons-warning-80)";
    readonly warning90: "var(--add-ons-warning-90)";
    readonly success30: "var(--add-ons-success-30)";
    readonly success40: "var(--add-ons-success-40)";
    readonly success50: "var(--add-ons-success-50)";
    readonly success60: "var(--add-ons-success-60)";
    readonly success70: "var(--add-ons-success-70)";
    readonly success80: "var(--add-ons-success-80)";
    readonly success90: "var(--add-ons-success-90)";
    readonly interaction30: "var(--add-ons-interaction-30)";
    readonly interaction40: "var(--add-ons-interaction-40)";
    readonly interaction50: "var(--add-ons-interaction-50)";
    readonly interaction60: "var(--add-ons-interaction-60)";
    readonly interaction70: "var(--add-ons-interaction-70)";
    readonly interaction80: "var(--add-ons-interaction-80)";
    readonly interaction90: "var(--add-ons-interaction-90)";
    readonly neutral0: "var(--t-fill-color-neutral-000)";
    readonly neutral10: "var(--t-fill-color-neutral-010)";
    readonly neutral20: "var(--t-fill-color-neutral-020)";
    readonly neutral30: "var(--t-fill-color-neutral-030)";
    readonly neutral40: "var(--t-fill-color-neutral-040)";
    readonly neutral50: "var(--t-fill-color-neutral-050)";
    readonly neutral60: "var(--t-fill-color-neutral-060)";
    readonly neutral70: "var(--t-fill-color-neutral-070)";
    readonly neutral80: "var(--t-fill-color-neutral-080)";
    readonly neutral90: "var(--t-fill-color-neutral-090)";
    readonly neutral100: "var(--t-fill-color-neutral-100)";
};
declare const boxThemes: {
    readonly neutral: {
        readonly background: "neutral80";
        readonly border: "neutral40";
    };
    readonly info: {
        readonly background: "interactionLightest";
        readonly border: "interactionLight";
    };
    readonly success: {
        readonly background: "successLighter";
        readonly border: "success";
    };
    readonly warning: {
        readonly background: "warningLighter";
        readonly border: "warningDark";
    };
    readonly danger: {
        readonly background: "dangerLighter";
        readonly border: "dangerDark";
    };
};
type Color = keyof typeof colors;
export interface BoxProps {
    backgroundColor?: Color;
    borderColor?: Color;
    borderRadius?: number;
    children: React.ReactNode;
    color?: Color;
    flex?: number;
    height?: number | string;
    inline?: boolean;
    maxHeight?: number | string;
    maxWidth?: number | string;
    minHeight?: number | string;
    overflow?: "visible" | "hidden" | "scroll" | "auto";
    padding?: number;
    paddingTop?: number;
    paddingRight?: number;
    paddingBottom?: number;
    paddingLeft?: number;
    paddingVertical?: number;
    paddingHorizontal?: number;
    pointerEvents?: "auto" | "none" | "all" | "inherit";
    width?: number | string;
    theme?: keyof typeof boxThemes;
}
export declare const Box: ({ backgroundColor, borderColor, borderRadius, children, color, flex, height, inline, maxHeight, maxWidth, minHeight, overflow, padding, paddingTop, paddingRight, paddingBottom, paddingLeft, paddingVertical, paddingHorizontal, pointerEvents, width, theme, }: BoxProps) => React.JSX.Element;
export {};
//# sourceMappingURL=Box.d.ts.map