import { DensityProp } from '../../composables/density.js';
import { SkeletonInjected } from '../../composables/useSkeletonState.js';
import { AutofocusProp } from '../../types/index.js';
import { FormInjected } from '../OnyxForm/OnyxForm.core.js';
import { WithLinkProp } from '../OnyxRouterLink/types.js';
export type OnyxButtonProps = DensityProp & AutofocusProp & {
    /**
     * The text content of the button.
     */
    label: string;
    /**
     * If the button should be disabled or not.
     */
    disabled?: FormInjected<boolean>;
    /**
     * Shows a loading indicator.
     */
    loading?: boolean;
    /**
     * The button type.
     */
    type?: ButtonType;
    /**
     * The color of the button.
     */
    color?: ButtonColor;
    /**
     * The style of the button.
     */
    mode?: ButtonMode;
    /**
     * An icon which will be displayed on the left side of the label.
     */
    icon?: string;
    /**
     * Position where the icon is placed.
     */
    iconPosition?: "left" | "right";
    /**
     * Whether to show a skeleton button.
     */
    skeleton?: SkeletonInjected;
    /**
     * If set, the button will be rendered as link.
     * Note that not all button properties are supported when used as link, e.g. `disabled`, `type` and `autofocus` are not supported.
     */
    link?: WithLinkProp["link"];
};
export declare const BUTTON_TYPES: readonly ["button", "submit", "reset"];
export type ButtonType = (typeof BUTTON_TYPES)[number];
export declare const BUTTON_COLORS: readonly ["primary", "neutral", "danger"];
export type ButtonColor = (typeof BUTTON_COLORS)[number];
export declare const BUTTON_MODES: readonly ["default", "outline", "plain"];
export type ButtonMode = (typeof BUTTON_MODES)[number];