@progress/kendo-vue-dateinputs 8.0.3-develop.2 → 8.0.3-develop.3

package/datepicker/ToggleButton.d.ts

@@ -0,0 +1,151 @@
+/**
+ * @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 ToggleButton: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    ariaLabel: import('vue').PropType<string>;
+    ariaPressed: import('vue').PropType<boolean>;
+    title: import('vue').PropType<string>;
+    dir: import('vue').PropType<string>;
+    selected: {
+        type: import('vue').PropType<boolean>;
+        default: any;
+    };
+    togglable: {
+        type: import('vue').PropType<boolean>;
+        default: boolean;
+    };
+    icon: {
+        type: import('vue').PropType<string>;
+        default: () => any;
+    };
+    svgIcon: import('vue').PropType<import('@progress/kendo-vue-common').SVGIcon>;
+    iconSize: {
+        type: import('vue').PropType<string>;
+    };
+    iconClass: {
+        type: import('vue').PropType<string>;
+        default: () => any;
+    };
+    imageUrl: {
+        type: import('vue').PropType<string>;
+        default: () => any;
+    };
+    imageAlt: import('vue').PropType<string>;
+    disabled: {
+        type: import('vue').PropType<boolean>;
+        default: any;
+    };
+    size: import('vue').PropType<"small" | "medium" | "large">;
+    rounded: import('vue').PropType<"small" | "medium" | "large" | "full" | "none">;
+    fillMode: import('vue').PropType<"flat" | "link" | "solid" | "outline">;
+    themeColor: import('vue').PropType<"base" | "primary" | "secondary" | "tertiary" | "info" | "success" | "warning" | "dark" | "light" | "inverse">;
+    tabIndex: import('vue').PropType<number>;
+    accessKey: import('vue').PropType<string>;
+    id: import('vue').PropType<string>;
+    type: import('vue').PropType<string>;
+    role: import('vue').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: import('@progress/kendo-vue-buttons').ButtonFocusEvent) => true;
+    blur: (event: import('@progress/kendo-vue-buttons').ButtonBlurEvent) => true;
+    keypress: (event: KeyboardEvent) => true;
+    keydown: (event: KeyboardEvent) => true;
+    contextmenu: (event: MouseEvent) => true;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    ariaLabel: import('vue').PropType<string>;
+    ariaPressed: import('vue').PropType<boolean>;
+    title: import('vue').PropType<string>;
+    dir: import('vue').PropType<string>;
+    selected: {
+        type: import('vue').PropType<boolean>;
+        default: any;
+    };
+    togglable: {
+        type: import('vue').PropType<boolean>;
+        default: boolean;
+    };
+    icon: {
+        type: import('vue').PropType<string>;
+        default: () => any;
+    };
+    svgIcon: import('vue').PropType<import('@progress/kendo-vue-common').SVGIcon>;
+    iconSize: {
+        type: import('vue').PropType<string>;
+    };
+    iconClass: {
+        type: import('vue').PropType<string>;
+        default: () => any;
+    };
+    imageUrl: {
+        type: import('vue').PropType<string>;
+        default: () => any;
+    };
+    imageAlt: import('vue').PropType<string>;
+    disabled: {
+        type: import('vue').PropType<boolean>;
+        default: any;
+    };
+    size: import('vue').PropType<"small" | "medium" | "large">;
+    rounded: import('vue').PropType<"small" | "medium" | "large" | "full" | "none">;
+    fillMode: import('vue').PropType<"flat" | "link" | "solid" | "outline">;
+    themeColor: import('vue').PropType<"base" | "primary" | "secondary" | "tertiary" | "info" | "success" | "warning" | "dark" | "light" | "inverse">;
+    tabIndex: import('vue').PropType<number>;
+    accessKey: import('vue').PropType<string>;
+    id: import('vue').PropType<string>;
+    type: import('vue').PropType<string>;
+    role: import('vue').PropType<string>;
+}>> & Readonly<{
+    onClick?: (event: Event) => any;
+    onBlur?: (event: import('@progress/kendo-vue-buttons').ButtonBlurEvent) => any;
+    onContextmenu?: (event: MouseEvent) => any;
+    onFocus?: (event: import('@progress/kendo-vue-buttons').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 { ToggleButton };

package/datepicker/interfaces/DatePickerComputed.d.ts

@@ -0,0 +1,15 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+/**
+ * @hidden
+ */
+export interface DatePickerComputed {
+    [key: string]: any;
+    computedValue: Date | null;
+    computedShow: boolean;
+}

package/datepicker/interfaces/DatePickerData.d.ts

@@ -0,0 +1,15 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+/**
+ * @hidden
+ */
+export interface DatePickerData {
+    currentValue: Date | null;
+    currentShow: boolean;
+    isFocused: boolean;
+}

package/datepicker/interfaces/DatePickerEventArguments.d.ts

@@ -0,0 +1,29 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+/**
+ * The arguments for the `change` event of the DatePicker.
+ */
+export interface DatePickerChangeEvent {
+    event: any;
+    value: Date | null;
+    show: boolean;
+    target: any;
+    component: any;
+}
+/**
+ * The arguments for the `open` event of the DatePicker.
+ */
+export interface DatePickerOpenEvent {
+    component: any;
+}
+/**
+ * The arguments for the `close` event of the DatePicker.
+ */
+export interface DatePickerCloseEvent {
+    component: any;
+}

package/datepicker/interfaces/DatePickerFocusBlurEvents.d.ts

@@ -0,0 +1,25 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+/**
+ * The arguments for the `onFocus` event of the DatePicker.
+ */
+export interface DatePickerFocusEvent {
+    /**
+     * The native browser focus event.
+     */
+    event: FocusEvent;
+}
+/**
+ * The arguments for the `onBlur` event of the DatePicker.
+ */
+export interface DatePickerBlurEvent {
+    /**
+     * The native browser blur event.
+     */
+    event: FocusEvent;
+}

package/datepicker/interfaces/DatePickerMethods.d.ts

@@ -0,0 +1,34 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { FormComponentValidity } from '@progress/kendo-vue-common';
+import { DatePickerProps, DateInputChangeEvent, CalendarChangeEvent } from '../..';
+import { DatePickerState } from './DatePickerState';
+/**
+ * @hidden
+ */
+export interface DatePickerMethods {
+    [key: string]: any;
+    emitBlur?: (_: any) => void;
+    validity: () => FormComponentValidity;
+    nextValue: (nextProps: DatePickerProps, nextState: DatePickerState) => any;
+    nextShow: (nextProps: DatePickerProps, nextState: DatePickerState) => any;
+    setShow: (show: boolean) => void;
+    mergeTime: (value: Date | null) => Date | null;
+    handleInputValueChange: (event: DateInputChangeEvent) => void;
+    handleCalendarValueChange: (event: CalendarChangeEvent) => void;
+    handleValueChange: (value: Date | null, event: DateInputChangeEvent | CalendarChangeEvent) => void;
+    handleFocus: (event: any) => void;
+    handleBlur: (event: any) => void;
+    calendarFocus: (event: any) => void;
+    calendarBlur: (event: any) => void;
+    getDateInputText: () => string;
+    createBlurTimeout: () => void;
+    handleIconClick: () => void;
+    handleIconMouseDown: (event: any) => void;
+    handleKeyDown: (event: any) => void;
+}

package/datepicker/interfaces/DatePickerProps.d.ts

@@ -0,0 +1,53 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { DatePickerChangeEvent } from './DatePickerEventArguments';
+import { DatePickerSettings } from '../models/main';
+import { FormComponentProps } from '@progress/kendo-vue-common';
+/**
+ * Represents the props of the [Kendo UI for Vue DatePicker component]({% slug overview_datepicker %}).
+ */
+export interface DatePickerProps extends DatePickerSettings, FormComponentProps {
+    /**
+     * @hidden
+     */
+    modelValue?: Date;
+    /**
+     * Sets the default value of the DatePicker ([see example]({% slug default_value_datepicker %})).
+     */
+    defaultValue?: Date;
+    /**
+     * Fires each time the user selects a new value ([see example]({% slug controlled_datepicker %}#toc-controlling-the-date-value)).
+     */
+    onChange?: (event: DatePickerChangeEvent) => void;
+    /**
+     * Fires when the icon element is clicked.
+     */
+    onIconclick?: (event: any) => void;
+    /**
+     * Renders a floating label for the DatePicker.
+     */
+    label?: string;
+    /**
+     * Specifies the value of the placeholder.
+     */
+    placeholder?: string;
+    /**
+     * Specifies the value of the DatePicker ([see example]({% slug controlled_datepicker %}#toc-controlling-the-date-value)).
+     *
+     * > The `value` has to be a valid [JavaScript `Date`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date) instance.
+     */
+    value?: Date | null;
+    /**
+     * Specifies the validate of the DatePicker.
+     */
+    validate?: boolean;
+    /**
+     * Specifies the validate of the DatePicker.
+     */
+    ariaLabel?: string;
+}

package/datepicker/interfaces/DatePickerState.d.ts

@@ -0,0 +1,23 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+/**
+ * @hidden
+ */
+export interface DatePickerState {
+    _popupId: string;
+    _wrapper: any;
+    _dateInput: any;
+    _calendar: any;
+    _anchor: string;
+    _oldShow: boolean;
+    _blurTimeout: any;
+    kendoAnchorRef: any;
+    wrapperRef: any;
+    dateInputRef: any;
+    calendarRef: any;
+}

package/datepicker/models/DatePickerSettings.d.ts

@@ -0,0 +1,157 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { DateInputFormatPlaceholder } from '../../dateinput/models/format-placeholder';
+import { DateInputsPopupSettings } from '../../PopupSettings';
+import { DateFormatOptions } from '@progress/kendo-vue-intl';
+/**
+ * @hidden
+ */
+export interface DatePickerSettings {
+    /**
+     * Enables the customization or the override of the default wrapping component around the `DateInput` and `ToggleButton` rendered by the DatePicker
+     * ([see example]({% slug custom_rendering_datepicker %}#toc-customizing-the-toggle-button)).
+     */
+    pickerWrap?: any;
+    /**
+     * Enables the customization or the override of the default Toggle button which is rendered by the DatePicker
+     * ([see example]({% slug custom_rendering_datepicker %}#toc-customizing-the-toggle-button)).
+     */
+    toggleButton?: any;
+    /**
+     * Enables the customization or the override of the default Calendar which is rendered by the DatePicker
+     * ([see example]({% slug custom_rendering_datepicker %}#toc-customizing-the-calendar)).
+     */
+    calendar?: any;
+    /**
+     * Enables the customization or the override of the default Popup which is rendered by the DatePicker
+     * ([see example]({% slug custom_rendering_datepicker %}#toc-customizing-the-popup)).
+     */
+    popup?: any;
+    /**
+     * Enables the customization or the override of the default DateInput which is rendered by the DatePicker
+     * ([see example]({% slug custom_rendering_datepicker %}#toc-customizing-the-dateinput)).
+     */
+    dateInput?: any;
+    /**
+     * Sets the default state of the DatePicker upon render ([see example]({% slug default_value_datepicker %})).
+     */
+    defaultShow?: boolean;
+    /**
+     * Determines whether the DatePicker is disabled ([see example]({% slug disabled_datepicker %})).
+     */
+    disabled?: boolean;
+    /**
+     * Configures the `size` of the TimeInput.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     * - null—Does not set a size `class`.
+     *
+     * @default `medium`
+     */
+    size?: null | 'small' | 'medium' | 'large';
+    /**
+     * Configures the `roundness` of the TimeInput.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     * - circle
+     * - full
+     * - null—Does not set a rounded `class`.
+     *
+     * @default `medium`
+     */
+    rounded?: null | 'small' | 'medium' | 'large' | 'full' | string;
+    /**
+     * Configures the `fillMode` of the TimeInput.
+     *
+     * The available options are:
+     * - solid
+     * - outline
+     * - flat
+     * - link
+     * - null—Does not set a fillMode `class`.
+     *
+     * @default `solid`
+     */
+    fillMode?: null | 'solid' | 'outline' | 'flat' | string;
+    /**
+     * Specifies the focused date of the DatePicker ([see example]({% slug dates_datepicker %})).
+     */
+    focusedDate?: Date;
+    /**
+     * Specifies the date format that is used to display the input value ([see example]({% slug formats_datepicker %})).
+     */
+    format?: string | DateFormatOptions;
+    /**
+     * Defines the descriptions of the format sections in the input field ([more information and examples]({% slug placeholders_datepicker %})).
+     */
+    formatPlaceholder?: DateInputFormatPlaceholder;
+    /**
+     * Specifies the `id` of the DatePicker.
+     */
+    id?: string;
+    /**
+     * Specifies the greatest valid date ([see example]({% slug dateranges_datepicker %})).
+     */
+    max?: Date;
+    /**
+     * Specifies the smallest valid date ([see example]({% slug dateranges_datepicker %})).
+     */
+    min?: Date;
+    /**
+     * Specifies the `name` property of the `input` DOM element.
+     */
+    name?: string;
+    /**
+     * Fires each time any of the DatePicker elements gets blurred.
+     */
+    onBlur?: (event: any) => void;
+    /**
+     * Fires each time the user focuses any of the DatePicker elements.
+     */
+    onFocus?: (event: any) => void;
+    /**
+     * Configures the popup options of the DatePicker.
+     *
+     * The available options are:
+     * - `animate: Boolean`—Controls the popup animation. By default, the open and close animations are enabled.
+     * - `appendTo`: — Defines the container to which the Popup will be appended. Defaults to [`body`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/body).
+     * - `popupClass: String`—Specifies a list of CSS classes that are used to style the popup.
+     */
+    popupSettings?: DateInputsPopupSettings;
+    /**
+     * Specifies if the calendar will be displayed ([see example]({% slug controlled_datepicker %}#toc-controlling-the-popup-state)).
+     */
+    show?: boolean;
+    /**
+     * Sets the `tabIndex` property of the DatePicker.
+     */
+    tabIndex?: number;
+    /**
+     * Sets the title of the `input` element of the DatePicker.
+     */
+    title?: string;
+    /**
+     * Determines whether to display a week number column in the `month` view of the Calendar ([see example]({% slug weeknumcolumn_datepicker %})).
+     */
+    weekNumber?: boolean;
+    /**
+     * Specifies the width of the DatePicker.
+     */
+    width?: number | string;
+    /**
+     * Sets the built-in HTML attributes of the inner focusable input element.
+     * Attributes which are essential for certain component functionalities cannot be changed.
+     */
+    inputAttributes?: Object;
+}

package/datepicker/models/main.d.ts

@@ -0,0 +1,9 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { DatePickerSettings } from './DatePickerSettings';
+export { type DatePickerSettings };