import { ButtonAppearance, Size, DataTrackingId, LayoutUtilProps } from '../../types';
import { ComponentPropsWithoutRef } from 'react';
import { IconProps } from '../Icon';
import { AiIconName } from './internal';
export type { AiIconName };
/**
 * Props for the Button component
 * @extends Omit<ComponentPropsWithoutRef<"button">, "children">
 * @extends LayoutUtilProps
 * @extends DataTrackingId
 */
export type ButtonProps = Omit<ComponentPropsWithoutRef<"button">, "children"> & LayoutUtilProps & DataTrackingId & {
    /**
     * When `true` or an icon name, shows an AI indicator. With button text, any leading
     * `icon` (plain Svg or `icon.before`) is not shown—the AI icon is used instead.
     * On an icon-only button, `icon` is not shown—the AI icon is used instead.
     * Icon-only usage must include an accessible name (for example `aria-label`).
     * In development, a console warning is logged when `icon` is overridden.
     */
    aiMark?: boolean | AiIconName;
    /**
     * The visual variant of the button.
     * @default secondary
     */
    appearance?: ButtonAppearance;
    /**
     * The size of the button.
     * @default medium
     */
    size?: Extract<Size, "xsmall" | "small" | "medium" | "large">;
    /**
     * The loading state of the button.
     * If true, it will show infinite state of the loading.
     * @default false
     */
    loading?: boolean;
} & ({
    children?: ComponentPropsWithoutRef<"button">["children"];
    /**
     * The icons of the button.
     */
    icon?: IconProps["svg"] | {
        after: IconProps["svg"];
    } | {
        before: IconProps["svg"];
    };
} | {
    children?: never;
    /**
     * The icon of the icon only button.
     */
    icon?: IconProps["svg"];
});
/**
 * Button component for triggering actions and user interactions.
 *
 * Features:
 * - Multiple visual appearances (primary, secondary, ghost, danger variants)
 * - Four size options (xsmall, small, medium, large)
 * - Loading state with spinner animation
 * - Icon support (before, after, or icon-only)
 * - Optional AI mark / named AI icons via `aiMark`
 * - Full accessibility support with ARIA attributes
 * - Supports layout utilities for positioning and spacing
 * - Automatic disabled state when loading
 * - Flexible content with text and/or icons
 * - Automatic tracking ID generation for analytics
 *
 * @example
 * <Button appearance="primary" size="medium" onClick={() => console.log('clicked')}>
 *   Click Me
 * </Button>
 */
export declare const Button: import('react').ForwardRefExoticComponent<ButtonProps & import('react').RefAttributes<HTMLButtonElement>>;