/**
 *
 * Button is an extension to standard button element with icons and theming.
 *
 * [Live Demo](https://www.primevue.dev/button/)
 *
 * @module button
 *
 */
import type { DefineComponent, DesignToken, EmitFn, HintedString, PassThrough } from '@primevue/core';
import type { ComponentHooks } from '@primevue/core/basecomponent';
import type { PassThroughOptions } from 'primevue/passthrough';
import type { ButtonHTMLAttributes, Component, VNode } from 'vue';

export declare type ButtonPassThroughOptionType<T = any> = ButtonPassThroughAttributes | ((options: ButtonPassThroughMethodOptions<T>) => ButtonPassThroughAttributes | string) | string | null | undefined;

/**
 * Custom passthrough(pt) option method.
 */
export interface ButtonPassThroughMethodOptions<T> {
    /**
     * Defines instance.
     */
    instance: any;
    /**
     * Defines valid properties.
     */
    props: ButtonProps;
    /**
     * Defines current options.
     */
    context: ButtonContext;
    /**
     * Defines parent instance.
     */
    parent: T;
    /**
     * Defines passthrough(pt) options in global config.
     */
    global: object | undefined;
}

/**
 * Custom passthrough(pt) options.
 * @see {@link ButtonProps.pt}
 */
export interface ButtonPassThroughOptions<T = any> {
    /**
     * Used to pass attributes to the root's DOM element.
     */
    root?: ButtonPassThroughOptionType<T>;
    /**
     * Used to pass attributes to the loading icon's DOM element.
     */
    loadingIcon?: ButtonPassThroughOptionType<T>;
    /**
     * Used to pass attributes to the icon's DOM element.
     */
    icon?: ButtonPassThroughOptionType<T>;
    /**
     * Used to pass attributes to the label's DOM element.
     */
    label?: ButtonPassThroughOptionType<T>;
    /**
     * Used to pass attributes to the Badge component.
     */
    pcBadge?: ButtonPassThroughOptionType<T>;
    /**
     * Used to manage all lifecycle hooks.
     * @see {@link BaseComponent.ComponentHooks}
     */
    hooks?: ComponentHooks;
}

/**
 * Custom passthrough attributes for each DOM elements
 */
export interface ButtonPassThroughAttributes {
    [key: string]: any;
}

/**
 * Defines valid properties in Button component.
 */
export interface ButtonProps extends ButtonHTMLAttributes {
    /**
     * Inline style of the button.
     */
    style?: any;
    /**
     * Style class of the button.
     */
    class?: any;
    /**
     * When enabled, the button is rendered as icon-only (square footprint) regardless of slot content.
     * @defaultValue false
     */
    iconOnly?: boolean | undefined;
    /**
     *  Add a link style to the button.
     * @defaultValue false
     */
    link?: boolean | undefined;
    /**
     * Defines the style of the button.
     */
    severity?: HintedString<'secondary' | 'success' | 'info' | 'warn' | 'help' | 'danger' | 'contrast'> | undefined;
    /**
     * Add a shadow to indicate elevation.
     * @defaultValue false
     */
    raised?: boolean | undefined;
    /**
     * Add a circular border radius to the button.
     * @defaultValue false
     */
    rounded?: boolean | undefined;
    /**
     * Add a textual class to the button without a background initially.
     * @defaultValue false
     */
    text?: boolean | undefined;
    /**
     * Add a border class without a background initially.
     * @defaultValue false
     */
    outlined?: boolean | undefined;
    /**
     * Defines the size of the button.
     */
    size?: HintedString<'small' | 'large'> | undefined;
    /**
     * Specifies the variant of the component.
     * @defaultValue undefined
     */
    variant?: HintedString<'outlined' | 'text' | 'link'> | undefined;
    /**
     * Spans 100% width of the container when enabled.
     * @defaultValue null
     */
    fluid?: boolean | undefined;
    /**
     * Use to change the HTML tag of root element.
     * @defaultValue BUTTON
     */
    as?: string | Component | undefined;
    /**
     * When enabled, it changes the default rendered element for the one passed as a child element.
     * @defaultValue false
     */
    asChild?: boolean | undefined;
    /**
     * It generates scoped CSS variables using design tokens for the component.
     */
    dt?: DesignToken<any>;
    /**
     * Used to pass attributes to DOM elements inside the component.
     * @type {ButtonPassThroughOptions}
     */
    pt?: PassThrough<ButtonPassThroughOptions<any>>;
    /**
     * Used to configure passthrough(pt) options of the component.
     * @type {PassThroughOptions}
     */
    ptOptions?: PassThroughOptions;
    /**
     * When enabled, it removes component related styles in the core.
     * @defaultValue false
     */
    unstyled?: boolean;
    /**
     * Text of the button.
     * @deprecated since v5.0.0. Use the default slot instead.
     */
    label?: string | undefined;
    /**
     * Name of the icon.
     * @deprecated since v5.0.0. Use the default slot instead.
     */
    icon?: string | undefined;
    /**
     * Position of the icon.
     * @defaultValue left
     * @deprecated since v5.0.0. Express icon position via slot order in the default slot.
     */
    iconPos?: HintedString<'left' | 'right' | 'top' | 'bottom'> | undefined;
    /**
     * Style class of the icon.
     * @deprecated since v5.0.0. Use the default slot instead.
     */
    iconClass?: string | object | undefined;
    /**
     * Value of the badge.
     * @deprecated since v5.0.0. Compose a `<Badge>` inside the default slot instead.
     */
    badge?: string | undefined;
    /**
     * Style class of the badge.
     * @deprecated since v5.0.0. Compose a `<Badge>` inside the default slot instead.
     */
    badgeClass?: string | object | undefined;
    /**
     * Severity type of the badge.
     * @deprecated since v5.0.0. Compose a `<Badge>` inside the default slot instead.
     */
    badgeSeverity?: HintedString<'secondary' | 'info' | 'success' | 'warn' | 'danger' | 'contrast'> | null | undefined;
    /**
     * Whether the button is in loading state.
     * @defaultValue false
     * @deprecated since v5.0.0. Render your own spinner inside the default slot and toggle `disabled`.
     */
    loading?: boolean | undefined;
    /**
     * Icon to display in loading state.
     * @deprecated since v5.0.0. Render your own spinner inside the default slot and toggle `disabled`.
     */
    loadingIcon?: string | undefined;
}

/**
 * Defines current options in Button component.
 */
export interface ButtonContext {
    /**
     * Current disabled state of the element as a boolean.
     * @defaultValue false
     */
    disabled: boolean;
}

/**
 * Defines valid slots in Button component.
 */
export interface ButtonSlots {
    /**
     * Custom content such as icons, images and text can be placed inside the button via the default slot. Note that when slot is used, label, icon and badge properties are not included.
     */
    default(scope: {
        /**
         * Style class of the button.
         */
        class: string;
        /**
         * Object containing the accessibility attributes.
         * @remarks Only available when {@link ButtonProps.asChild} is set to true.
         */
        a11yAttrs?: Record<string, unknown>;
    }): VNode[];
    /**
     * Custom icon template.
     * @param {Object} scope - icon slot's params.
     * @deprecated since v5.0.0. Use the default slot instead.
     */
    icon(scope: {
        /**
         * Style class of the icon.
         */
        class: string;
    }): VNode[];
    /**
     * Custom loading icon template.
     * @param {Object} scope - loading icon slot's params.
     * @deprecated since v5.0.0. Render your own spinner inside the default slot and toggle `disabled`.
     */
    loadingicon(scope: {
        /**
         * Style class of the loading icon.
         */
        class: string;
    }): VNode[];
}

/**
 * Defines valid emits in Button component.
 */
export interface ButtonEmitsOptions {}

export declare type ButtonEmits = EmitFn<ButtonEmitsOptions>;

/**
 * **PrimeVue - Button**
 *
 * _Button is an extension to standard button element with icons and theming._
 *
 * [Live Demo](https://www.primevue.dev/button/)
 * --- ---
 * ![PrimeVue](https://primefaces.org/cdn/primevue/images/logo-100.png)
 *
 * @group Component
 *
 */
declare const Button: DefineComponent<ButtonProps, ButtonSlots, ButtonEmits>;

declare module 'vue' {
    export interface GlobalComponents {
        Button: DefineComponent<ButtonProps, ButtonSlots, ButtonEmits>;
    }
}

export default Button;