/**
 * This is a trick using a very large inset box shadow to mix
 * `surface-transparent` over the base background color.
 *
 * An example alternative approach would be to pre-mix the hover
 * colour and use that as semantic tokens
 * or use color-mix css syntax once more widely adopted
 */
export declare const buttonHoverStyle: {
    bg: null;
    boxShadow: string;
};
export declare const buttonBaseStyle: {
    boxShadow: string;
    _hover: {
        bg: null;
        boxShadow: string;
    };
    _active: {
        transform: string;
        bg: null;
        boxShadow: string;
    };
};
export declare const buttonTheme: {
    baseStyle?: ((props: import('@chakra-ui/styled-system').StyleFunctionProps) => {
        display: string;
        alignIitems: string;
        justifyContent: string;
        outline: string;
        border: string;
        textAlign: string;
        rounded: string;
        cursor: string;
        _disabled: {
            pointerEvents: string;
        };
        _focusVisible: {
            boxShadow: string;
        };
        boxShadow: string;
        _hover: {
            bg: null;
            boxShadow: string;
        };
        _active: {
            transform: string;
            bg: null;
            boxShadow: string;
        };
    }) | undefined;
    sizes?: {
        auto: {};
        large: {
            px: number;
            py: number;
            minHeight: number;
            fontSize: string;
            fontWeight: string;
            lineHeight: string;
        };
        medium: {
            px: number;
            py: number;
            minHeight: number;
            fontSize: string;
            fontWeight: string;
            lineHeight: string;
        };
        small: {
            px: number;
            py: number;
            minHeight: number;
            fontSize: string;
            fontWeight: string;
            lineHeight: string;
        };
        /** @deprecated */
        "3xs": {
            px: string;
            py: number;
            fontSize: string;
            fontWeight: string;
            lineHeight: string;
        };
        /** @deprecated */
        "2xs": {
            minHeight: number;
            px: number;
            py: number;
            fontSize: string;
            fontWeight: string;
            lineHeight: string;
        };
        /** @deprecated */
        xs: {
            minHeight: number;
            px: number;
            py: number;
            fontSize: string;
            fontWeight: string;
            lineHeight: string;
        };
        /** @deprecated */
        sm: {
            minHeight: number;
            px: number;
            py: number;
            ".chakra-button__icon": {
                fontSize: string;
            };
            fontSize: string;
            fontWeight: string;
            lineHeight: string;
        };
        /** @deprecated */
        md: {
            minHeight: number;
            px: number;
            py: number;
            fontSize: string;
            fontWeight: string;
            lineHeight: string;
        };
        /** @deprecated */
        lg: {
            minHeight: number;
            px: number;
            py: number;
            fontSize: string;
            fontWeight: string;
            lineHeight: string;
        };
    } | undefined;
    variants?: {
        outline: {};
        solid: (props: import('@chakra-ui/styled-system').StyleFunctionProps) => {
            bg: string;
            color: string;
            boxShadow: string;
            _hover: {
                bg: null;
                boxShadow: string;
            };
            _active: {
                transform: string;
                bg: null;
                boxShadow: string;
            };
        } | {
            bg: string;
            border: string;
            borderColor: string;
            color: string;
            boxShadow: string;
            _hover: {
                bg: null;
                boxShadow: string;
            };
            _active: {
                transform: string;
                bg: null;
                boxShadow: string;
            };
        };
    } | undefined;
    defaultProps?: {
        size?: "small" | "auto" | "sm" | "md" | "lg" | "3xs" | "2xs" | "xs" | "medium" | "large" | undefined;
        variant?: "outline" | "solid" | undefined;
        colorScheme?: string | undefined;
    } | undefined;
};