import { TNode, Value } from '@tempots/dom';
import { ControlSize, ButtonVariant } from '../theme';
import { ThemeColorName } from '../../tokens';
import { ExtendedColor } from '../theme/style-utils';
import { RadiusName } from '../../tokens/radius';
export interface ButtonOptions {
    type?: Value<'submit' | 'reset' | 'button'>;
    disabled?: Value<boolean>;
    loading?: Value<boolean>;
    variant?: Value<ButtonVariant>;
    size?: Value<ControlSize>;
    color?: Value<ThemeColorName>;
    roundedness?: Value<RadiusName>;
    onClick?: () => void;
    fullWidth?: Value<boolean>;
    /**
     * Whether to stop event propagation on click.
     * When true (default), prevents the click event from bubbling up.
     * Set to false if you need parent elements to receive click events (e.g., for Flyout triggers).
     */
    stopPropagation?: boolean;
}
export declare function generateButtonClasses(size: ControlSize, roundedness: RadiusName, loading: boolean, fullWidth: boolean): string;
export declare function generateButtonStyles(variant: ButtonVariant, color: ExtendedColor, disabled: boolean): string;
export declare function Button({ type, disabled, loading, variant, size, color, roundedness, onClick, fullWidth, stopPropagation, }: ButtonOptions, ...children: TNode[]): import("@tempots/dom").Renderable;
