@progress/kendo-vue-buttons 8.0.3-develop.2 → 8.0.3-develop.4

package/Button.d.ts

@@ -0,0 +1,273 @@
+/**
+ * @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:
+     * - small
+     * - medium
+     * - large
+     *
+     * @default `undefined`
+     */
+    size?: '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
+     * - dark
+     * - light
+     * - inverse
+     *
+     * @default `undefined`
+     */
+    themeColor?: 'base' | 'primary' | 'secondary' | 'tertiary' | 'info' | 'success' | 'warning' | 'dark' | 'light' | '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" | "large">;
+    rounded: PropType<"small" | "medium" | "large" | "full" | "none">;
+    fillMode: PropType<"flat" | "link" | "solid" | "outline">;
+    themeColor: PropType<"base" | "primary" | "secondary" | "tertiary" | "info" | "success" | "warning" | "dark" | "light" | "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" | "large">;
+    rounded: PropType<"small" | "medium" | "large" | "full" | "none">;
+    fillMode: PropType<"flat" | "link" | "solid" | "outline">;
+    themeColor: PropType<"base" | "primary" | "secondary" | "tertiary" | "info" | "success" | "warning" | "dark" | "light" | "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 };

package/ButtonGroup.d.ts

@@ -0,0 +1,58 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { ButtonProps } from './Button';
+import { ButtonGroupInterface } from './ButtonGroupInterface';
+import { PropType } from 'vue';
+/**
+ * Represents the props of the [Kendo UI for Vue ButtonGroup component]({% slug overview_buttongroup %}).
+ */
+export interface ButtonGroupProps extends ButtonGroupInterface, ButtonProps {
+    /**
+     * Sets the `className` of the ButtonGroup component.
+     */
+    className?: string;
+}
+/**
+ * @hidden
+ */
+export interface ButtonGroupMethods {
+    [key: string]: any;
+    mapButtons: (children: any) => any;
+    renderButton: (child: any, index: number, isLast: boolean, isRtl: boolean) => any;
+    isValidButton: (child: any) => any;
+}
+/**
+ * @hidden
+ */
+declare const ButtonGroup: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    disabled: {
+        type: PropType<boolean>;
+        default: any;
+    };
+    width: PropType<string>;
+    dir: {
+        type: PropType<string>;
+        default: () => any;
+    };
+}>, {}, {}, {}, {
+    isValidButton(child: any): any;
+}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    disabled: {
+        type: PropType<boolean>;
+        default: any;
+    };
+    width: PropType<string>;
+    dir: {
+        type: PropType<string>;
+        default: () => any;
+    };
+}>> & Readonly<{}>, {
+    disabled: boolean;
+    dir: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export { ButtonGroup };

package/ButtonGroupInterface.d.ts

@@ -0,0 +1,37 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+/**
+ * Represents the properties which can be set to a ButtonGroup.
+ */
+export interface ButtonGroupInterface {
+    /**
+     * By default, the ButtonGroup is enabled ([see example]({% slug disabledstate_buttongroup %})). To disable the whole group of buttons,
+     * set its `disabled` attribute to `true`. To disable a specific button, set its own `disabled` attribute to `true` and leave the `disabled` attribute of the ButtonGroup undefined.
+     *
+     * If you define the `disabled` attribute of the ButtonGroup, it will take precedence over the `disabled` attributes
+     *  of the underlying buttons and they will be ignored.
+     */
+    disabled?: boolean;
+    /**
+     * Sets the width of the ButtonGroup.
+     *
+     * If the width of the ButtonGroup is set:
+     * - The buttons resize automatically to fill the full width of the group wrapper.
+     * - The buttons acquire the same width.
+     */
+    width?: string;
+    /**
+     * Sets the direction of the ButtonGroup ([more information](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir)).
+     *
+     * The available options are:
+     * * `rtl`
+     * * `ltr`
+     * * `auto`
+     */
+    dir?: string;
+}

package/ButtonInterface.d.ts

@@ -0,0 +1,57 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { SVGIcon } from '@progress/kendo-vue-common';
+/**
+ * Inherits the native HTML Button. Represents the properties which can be set to a Button.
+ */
+export interface ButtonInterface {
+    /**
+     * Specifies if the Button is disabled ([see example]({% slug disabled_button %})). Defaults to `false`.
+     */
+    disabled?: boolean;
+    /**
+     * Sets the aria-label of the Button.
+     */
+    ariaLabel?: string;
+    /**
+     * Sets the `title` HTML attribute of the Button.
+     */
+    title?: string;
+    /**
+     * Sets the direction of the Button.
+     */
+    dir?: string;
+    /**
+     * Sets the selected state of the Button. Can be used for controlled mode.
+     */
+    selected?: boolean;
+    /**
+     * Provides visual styling that indicates if the Button is selected ([see example]({% slug toggleable_button %})). Defaults to `false`.
+     */
+    togglable?: boolean;
+    /**
+     * Defines the name for an existing icon in a Kendo UI for Vue theme ([see example]({% slug icons_button %})). The icon is rendered inside the Button by a `span.k-icon` element.
+     */
+    icon?: string;
+    /**
+     * Defines an SVGIcon to be rendered within the button.
+     */
+    svgIcon?: SVGIcon;
+    /**
+     * Defines a CSS class—or multiple classes separated by spaces—which are applied to a `span` element inside the Button ([see example]({% slug icons_button %})). Allows the usage of custom icons.
+     */
+    iconClass?: string;
+    /**
+     * Defines a URL which is used as an `img` element inside the Button ([see example]({% slug icons_button %})). The URL can be relative or absolute. If relative, it is evaluated with relation to the URL of the web page.
+     */
+    imageUrl?: string;
+    /**
+     * Defines the alternative text of the image rendered inside the Button component.
+     */
+    imageAlt?: string;
+}

package/ButtonWrap.d.ts

@@ -0,0 +1,12 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+/**
+ * @hidden
+ */
+declare const ButtonWrap: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export { ButtonWrap };