import * as React from 'react';
import { DefaultTheme } from 'styled-components';
import { ResponsiveCSSProps } from '../../util/css-props';
declare type Variant = 'primary' | 'secondary' | 'tertiary';
interface Props<X extends React.ElementType> extends ResponsiveCSSProps {
    children?: React.ReactNode;
    /**
     * The visual style variant of the button.
     *
     * Default: `"primary"`
     */
    variant?: Variant;
    /**
     * Specifies which underlying HTML element to render.
     *
     * Default: `"button"`
     */
    as?: X;
    onClick?: React.MouseEventHandler<HTMLButtonElement>;
}
export declare const StyledButton: import("styled-components").StyledComponent<"button", DefaultTheme, Props<React.ElementType<HTMLButtonElement>>, never>;
/**
 * Buttons allow users to perform an action or to navigate to another page.
 * They have multiple styles for various needs, and are ideal for calling
 * attention to where a user needs to do something
 * in order to move forward in a flow.
 */
export declare const Button: React.ForwardRefExoticComponent<Props<React.ElementType<any>> & React.RefAttributes<unknown>>;
export {};