import { default as React } from 'react';
import { Icon } from '@phosphor-icons/react';
/** Button variant definitions mapping shape, size, and variant names to their Tailwind classes. */
export declare const KUMO_BUTTON_VARIANTS: {
    readonly shape: {
        readonly base: {
            readonly classes: "";
            readonly description: "Default rectangular button shape";
        };
        readonly square: {
            readonly classes: "items-center justify-center p-0";
            readonly description: "Square button for icon-only actions";
        };
        readonly circle: {
            readonly classes: "items-center justify-center p-0 rounded-full";
            readonly description: "Circular button for icon-only actions";
        };
    };
    readonly size: {
        readonly xs: {
            readonly classes: "h-5 gap-1 rounded-sm px-1.5 text-xs";
            readonly description: "Extra small button for compact UIs";
        };
        readonly sm: {
            readonly classes: "h-6.5 gap-1 rounded-md px-2 text-xs";
            readonly description: "Small button for secondary actions";
        };
        readonly base: {
            readonly classes: "h-9 gap-1.5 rounded-lg px-3 text-base";
            readonly description: "Default button size";
        };
        readonly lg: {
            readonly classes: "h-10 gap-2 rounded-lg px-4 text-base";
            readonly description: "Large button for primary CTAs";
        };
    };
    readonly compactSize: {
        readonly xs: {
            readonly classes: "size-3.5";
        };
        readonly sm: {
            readonly classes: "size-6.5";
        };
        readonly base: {
            readonly classes: "size-9";
        };
        readonly lg: {
            readonly classes: "size-10";
        };
    };
    readonly variant: {
        readonly primary: {
            readonly classes: "bg-kumo-brand !text-white hover:bg-kumo-brand-hover focus:bg-kumo-brand-hover disabled:bg-kumo-brand/50";
            readonly description: "High-emphasis button for primary actions";
        };
        readonly secondary: {
            readonly classes: "bg-kumo-base !text-kumo-default ring not-disabled:hover:border-secondary! not-disabled:hover:bg-kumo-tint disabled:bg-kumo-base/50 disabled:!text-kumo-default/70 ring-kumo-ring data-[state=open]:bg-kumo-base";
            readonly description: "Default button style for most actions";
        };
        readonly ghost: {
            readonly classes: "text-kumo-default hover:bg-kumo-tint shadow-none bg-inherit";
            readonly description: "Minimal button with no background";
        };
        readonly destructive: {
            readonly classes: "bg-kumo-danger !text-white hover:bg-kumo-danger/70";
            readonly description: "Danger button for destructive actions like delete";
        };
        readonly "secondary-destructive": {
            readonly classes: "bg-kumo-base !text-kumo-danger ring not-disabled:hover:border-secondary! not-disabled:hover:bg-kumo-base disabled:bg-kumo-base/50 disabled:!text-kumo-danger/70 ring-kumo-line data-[state=open]:bg-kumo-base";
            readonly description: "Secondary button with destructive text for less prominent dangerous actions";
        };
        readonly outline: {
            readonly classes: "bg-transparent text-kumo-default ring-2 ring-kumo-ring";
            readonly description: "Bordered button with transparent background";
        };
    };
};
export declare const KUMO_BUTTON_DEFAULT_VARIANTS: {
    readonly shape: "base";
    readonly size: "base";
    readonly variant: "secondary";
};
export type KumoButtonShape = keyof typeof KUMO_BUTTON_VARIANTS.shape;
export type KumoButtonSize = keyof typeof KUMO_BUTTON_VARIANTS.size;
export type KumoButtonVariant = keyof typeof KUMO_BUTTON_VARIANTS.variant;
export interface KumoButtonVariantsProps {
    /**
     * Button shape.
     * - `"base"` — Default rectangular button
     * - `"square"` — Square button for icon-only actions
     * - `"circle"` — Circular button for icon-only actions
     * @default "base"
     */
    shape?: KumoButtonShape;
    /**
     * Button size.
     * - `"xs"` — Extra small for compact UIs
     * - `"sm"` — Small for secondary actions
     * - `"base"` — Default size
     * - `"lg"` — Large for primary CTAs
     * @default "base"
     */
    size?: KumoButtonSize;
    /**
     * Visual style of the button.
     * - `"primary"` — High-emphasis, brand-colored for primary actions
     * - `"secondary"` — Default style with border for most actions
     * - `"ghost"` — Minimal, no background for tertiary actions
     * - `"destructive"` — Danger button for destructive actions
     * - `"secondary-destructive"` — Secondary style with destructive text
     * - `"outline"` — Bordered with transparent background
     * @default "secondary"
     */
    variant?: KumoButtonVariant;
}
export declare function buttonVariants({ variant, size, shape, }?: KumoButtonVariantsProps): string;
/**
 * Button component props.
 *
 * Uses a discriminated union on `shape` so that icon-only buttons
 * (`shape="square"` or `shape="circle"`) require an `aria-label`.
 *
 * @example
 * ```tsx
 * <Button variant="primary">Save</Button>
 * <Button variant="secondary" shape="square" icon={PlusIcon} aria-label="Add" />
 * <Button variant="destructive" loading>Deleting...</Button>
 * ```
 */
type ButtonBaseProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {
    /** Content rendered inside the button. */
    children?: React.ReactNode;
    /** Additional CSS classes merged via `cn()`. */
    className?: string;
    /** Icon from `@phosphor-icons/react` or a React element. Rendered before children. */
    icon?: Icon | React.ReactNode;
    /** Shows a loading spinner and disables interaction. */
    loading?: boolean;
};
type ButtonWithTextProps = ButtonBaseProps & {
    shape?: "base";
    size?: KumoButtonSize;
    variant?: KumoButtonVariant;
};
type IconOnlyButtonProps = ButtonBaseProps & {
    shape: "square" | "circle";
    size?: KumoButtonSize;
    variant?: KumoButtonVariant;
    /** Required for icon-only buttons to provide accessible label for screen readers */
    "aria-label": string;
};
export type ButtonProps = ButtonWithTextProps | IconOnlyButtonProps;
/**
 * LinkButton component props — renders an anchor styled as a button.
 *
 * @example
 * ```tsx
 * <LinkButton href="/docs" variant="ghost" icon={BookIcon}>Docs</LinkButton>
 * <LinkButton href="https://example.com" external>Visit Site</LinkButton>
 * ```
 */
export type LinkButtonProps = React.AnchorHTMLAttributes<HTMLAnchorElement> & KumoButtonVariantsProps & {
    /** Content rendered inside the link button. */
    children?: React.ReactNode;
    /** Additional CSS classes merged via `cn()`. */
    className?: string;
    /** Icon from `@phosphor-icons/react` or a React element. Rendered before children. */
    icon?: Icon | React.ReactNode;
    /** When `true`, opens in a new tab with `rel="noopener noreferrer"`. */
    external?: boolean;
    linksExternal?: boolean;
};
/**
 * Primary action trigger. Supports multiple variants, sizes, shapes, icons, and loading state.
 *
 * @example
 * ```tsx
 * <Button variant="primary">Save</Button>
 * <Button variant="secondary" icon={PlusIcon}>Create Worker</Button>
 * ```
 */
export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
/**
 * Square button with a rotating arrows icon, used to trigger data refresh actions.
 *
 * @example
 * ```tsx
 * <RefreshButton loading={isRefreshing} onClick={refresh} />
 * ```
 */
export declare const RefreshButton: ({ "aria-label": ariaLabel, loading, ...props }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
/**
 * Anchor element styled as a button. Integrates with `LinkProvider` for framework routing.
 *
 * @example
 * ```tsx
 * <LinkButton href="/settings" variant="ghost">Settings</LinkButton>
 * ```
 */
export declare const LinkButton: React.ForwardRefExoticComponent<React.AnchorHTMLAttributes<HTMLAnchorElement> & KumoButtonVariantsProps & {
    /** Content rendered inside the link button. */
    children?: React.ReactNode;
    /** Additional CSS classes merged via `cn()`. */
    className?: string;
    /** Icon from `@phosphor-icons/react` or a React element. Rendered before children. */
    icon?: Icon | React.ReactNode;
    /** When `true`, opens in a new tab with `rel="noopener noreferrer"`. */
    external?: boolean;
    linksExternal?: boolean;
} & React.RefAttributes<HTMLAnchorElement>>;
export {};
//# sourceMappingURL=button.d.ts.map