@progress/kendo-vue-dateinputs/datepicker/models/DatePickerSettings.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 { 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;
}