import { CSSProperties, ElementType, ReactElement } from 'react';
import { PolymorphicComponentPropsWithRef, PolymorphicForwardRefComponent } from '../shared/types';
type ButtonColor = 'destroy' | 'primary' | 'secondary' | 'subtle' | 'success';
export type ButtonSize = 'small' | 'medium' | 'large';
declare const ButtonDesigns: {
    readonly solid: "solid";
    readonly outline: "outline";
    readonly minimal: "minimal";
};
type ButtonDesign = (typeof ButtonDesigns)[keyof typeof ButtonDesigns];
type StyledButtonBaseProps = {
    /** Add margin with spacing design tokens `(e.g., ccMargin="xl l m")` */
    $ccMargin?: string;
    $design?: ButtonDesign;
    $color: ButtonColor;
    $size: ButtonSize;
};
export type IconComponentProps = Readonly<ReactElement<{
    style?: CSSProperties;
}>>;
/** explicit, static props of the Slab button that will override any polyporphic props */
export type BaseButtonProps = {
    ccMargin?: StyledButtonBaseProps['$ccMargin'];
    color?: StyledButtonBaseProps['$color'];
    design?: StyledButtonBaseProps['$design'];
    disabled?: boolean;
    icon?: Readonly<{
        component?: IconComponentProps;
        name?: string;
        position?: 'before' | 'after';
    }>;
    loading?: boolean;
    size?: StyledButtonBaseProps['$size'];
};
/** polymorphic props of the Slab button, including explicit, static BaseButtonProps */
export type ButtonProps<C extends ElementType = 'button'> = PolymorphicComponentPropsWithRef<C, BaseButtonProps>;
/**
 * A flexible, styled button component that supports multiple designs, colors, sizes, and icon positions.
 * Can be rendered as any HTML element or React component while maintaining full type safety.
 */
export declare const Button: PolymorphicForwardRefComponent<"button", BaseButtonProps>;
export default Button;