@progress/kendo-vue-buttons/Button.d.ts

TODO

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2026 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
import { SvgIconProps } from '@progress/kendo-vue-common';
import { ButtonInterface } from './ButtonInterface';
import { ButtonFocusEvent } from './models/ButtonFocusEvent';
import { ButtonBlurEvent } from './models/ButtonBlurEvent';
import { PropType } from 'vue';
/**
 * Represents the props of the [Kendo UI for Vue Button component]({% slug overview_button %}).
 * Extends the [native button props](https://developer.mozilla.org/en-US/docs/Web/API/HTMLButtonElement).
 */
export interface ButtonProps extends ButtonInterface {
    /**
     * Configures the `size` of the Button.
     *
     * The available options are:
     * - xs
     * - small
     * - medium
     * - large
     *
     * @default `undefined`
     */
    size?: 'xs' | 'small' | 'medium' | 'large';
    /**
     * Configures the `roundness` of the Button.
     *
     * The available options are:
     * - none
     * - small
     * - medium
     * - large
     * - circle
     * - full
     *
     * @default `undefined`
     */
    rounded?: 'none' | 'small' | 'medium' | 'large' | 'full';
    /**
     * Configures the `fillMode` of the Button.
     *
     * The available options are:
     * - solid
     * - outline
     * - flat
     * - link
     *
     * @default `undefined`
     */
    fillMode?: 'solid' | 'outline' | 'flat' | 'link';
    /**
     * Configures the `themeColor` of the Button.
     *
     * The available options are:
     * - base
     * - primary
     * - secondary
     * - tertiary
     * - info
     * - success
     * - warning
     * - error
     * - inverse
     *
     * @default `undefined`
     */
    themeColor?: 'base' | 'primary' | 'secondary' | 'tertiary' | 'info' | 'success' | 'warning' | 'error' | 'inverse';
    /**
     * Sets the `tabIndex` property of the Button.
     */
    tabIndex?: number;
    /**
     * Sets the `accessKey` property of the Button.
     */
    accessKey?: string;
    /**
     * Sets the `id` property of the Button.
     */
    id?: string;
    /**
     * Sets the `type` property of the Button.
     */
    type?: string;
    /**
     * Sets the `role` attribute of the Button.
     */
    role?: string;
    /**
     * Sets the `aria-pressed` attribute of the Button.
     */
    ariaPressed?: boolean;
    /**
     * defines the size of the SVG icon displayed inside the Button.
     */
    iconSize?: SvgIconProps['size'];
}
/**
 * @hidden
 */
export interface ButtonState {
    _activeTemp?: boolean;
}
/**
 * @hidden
 */
export interface ButtonComputed {
    [key: string]: any;
    buttonClasses: object;
}
/**
 * @hidden
 */
export interface ButtonMethods {
    [key: string]: any;
    focus: (e: any) => void;
    toggleIfApplicable: () => void;
    handleClick: (event: any) => void;
}
/**
 * @hidden
 */
export interface ButtonData {
    currentActive: boolean;
}
/**
 * @hidden
 */
declare const Button: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
    ariaLabel: PropType<string>;
    ariaPressed: PropType<boolean>;
    title: PropType<string>;
    dir: PropType<string>;
    selected: {
        type: PropType<boolean>;
        default: any;
    };
    togglable: {
        type: PropType<boolean>;
        default: boolean;
    };
    icon: {
        type: PropType<string>;
        default: () => any;
    };
    svgIcon: PropType<import('@progress/kendo-vue-common').SVGIcon>;
    iconSize: {
        type: PropType<string>;
    };
    iconClass: {
        type: PropType<string>;
        default: () => any;
    };
    imageUrl: {
        type: PropType<string>;
        default: () => any;
    };
    imageAlt: PropType<string>;
    disabled: {
        type: PropType<boolean>;
        default: any;
    };
    size: PropType<"small" | "medium" | "xs" | "large">;
    rounded: PropType<"small" | "medium" | "large" | "full" | "none">;
    fillMode: PropType<"flat" | "link" | "solid" | "outline">;
    themeColor: PropType<"base" | "primary" | "secondary" | "tertiary" | "info" | "success" | "warning" | "error" | "inverse">;
    tabIndex: PropType<number>;
    accessKey: PropType<string>;
    id: PropType<string>;
    type: PropType<string>;
    role: PropType<string>;
}>, {}, {
    currentActive: any;
}, {
    computedSelected(): boolean;
    buttonClasses(): {
        [x: string]: any;
        'k-icon-button': boolean;
        'k-disabled': any;
        'k-selected': any;
        'k-rtl': boolean;
    };
}, {
    focus(e: any): void;
    toggleIfApplicable(): void;
    handleClick(event: any): void;
    handleMouseDown(event: any): void;
    handlePointerDown(event: any): void;
    handleMouseUp(event: any): void;
    handlePointerUp(event: any): void;
    handleFocus(event: FocusEvent): void;
    handleBlur(event: FocusEvent): void;
    handleKeypress(event: any): void;
    handleKeydown(event: any): void;
    handleContextmenu(event: any): void;
}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
    click: (event: Event) => true;
    mousedown: (event: MouseEvent) => true;
    mouseup: (event: MouseEvent) => true;
    pointerdown: (event: PointerEvent) => true;
    pointerup: (event: PointerEvent) => true;
    focus: (event: ButtonFocusEvent) => true;
    blur: (event: ButtonBlurEvent) => true;
    keypress: (event: KeyboardEvent) => true;
    keydown: (event: KeyboardEvent) => true;
    contextmenu: (event: MouseEvent) => true;
}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
    ariaLabel: PropType<string>;
    ariaPressed: PropType<boolean>;
    title: PropType<string>;
    dir: PropType<string>;
    selected: {
        type: PropType<boolean>;
        default: any;
    };
    togglable: {
        type: PropType<boolean>;
        default: boolean;
    };
    icon: {
        type: PropType<string>;
        default: () => any;
    };
    svgIcon: PropType<import('@progress/kendo-vue-common').SVGIcon>;
    iconSize: {
        type: PropType<string>;
    };
    iconClass: {
        type: PropType<string>;
        default: () => any;
    };
    imageUrl: {
        type: PropType<string>;
        default: () => any;
    };
    imageAlt: PropType<string>;
    disabled: {
        type: PropType<boolean>;
        default: any;
    };
    size: PropType<"small" | "medium" | "xs" | "large">;
    rounded: PropType<"small" | "medium" | "large" | "full" | "none">;
    fillMode: PropType<"flat" | "link" | "solid" | "outline">;
    themeColor: PropType<"base" | "primary" | "secondary" | "tertiary" | "info" | "success" | "warning" | "error" | "inverse">;
    tabIndex: PropType<number>;
    accessKey: PropType<string>;
    id: PropType<string>;
    type: PropType<string>;
    role: PropType<string>;
}>> & Readonly<{
    onClick?: (event: Event) => any;
    onBlur?: (event: ButtonBlurEvent) => any;
    onContextmenu?: (event: MouseEvent) => any;
    onFocus?: (event: ButtonFocusEvent) => any;
    onKeydown?: (event: KeyboardEvent) => any;
    onKeypress?: (event: KeyboardEvent) => any;
    onMousedown?: (event: MouseEvent) => any;
    onMouseup?: (event: MouseEvent) => any;
    onPointerdown?: (event: PointerEvent) => any;
    onPointerup?: (event: PointerEvent) => any;
}>, {
    icon: string;
    selected: boolean;
    disabled: boolean;
    togglable: boolean;
    iconClass: string;
    imageUrl: string;
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
export { Button };