@progress/kendo-angular-scheduler/types/datepicker-options.interface.d.ts

Kendo UI Scheduler Angular - Outlook or Google-style angular scheduler calendar. Full-featured and customizable embedded scheduling from the creator developers trust for professional UI components.

/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { CalendarView, DateInputFormatPlaceholder, PopupSettings } from '@progress/kendo-angular-dateinputs';
import { Day } from '@progress/kendo-date-math';
/**
 * Represents the available configuration options for the DatePicker component used in the recurrence editor.
 */
export interface DatePickerOptions {
    /**
     * Defines the active view that the Calendar initially renders
     * ([see example](slug:viewoptions_calendar#toc-active-view).
     * Always set the `activeView` within the range defined by `topView` and `bottomView`.
     *
     * @default 'month'
     */
    activeView?: CalendarView;
    /**
     * Defines the bottommost Calendar view to which the user can navigate
     * ([see example](slug:datepicker_calendar_options#toc-view-selection-depth)).
     */
    bottomView?: CalendarView;
    /**
     * Determines whether the built-in validator for disabled
     * date ranges is enforced when validating a form
     * ([see example](slug:disabled_dates_datepicker#toc-using-a-function)).
     */
    disabledDatesValidation?: boolean;
    /**
     * Sets the focused date of the Calendar component
     * ([see example](slug:datepicker_calendar_options#toc-focused-dates)).
     */
    focusedDate?: Date;
    /**
     * Sets the date format used to display the input value
     * ([see example](slug:formats_datepicker)).
     */
    format?: string;
    /**
     * Defines the descriptions of the format sections in the input field
     * ([more information and examples](slug:placeholders_datepicker)).
     */
    formatPlaceHolder?: DateInputFormatPlaceholder;
    /**
     * Sets the largest valid date
     * ([see example](slug:dateranges_datepicker)).
     */
    max?: Date;
    /**
     * Sets the smallest valid date
     * ([see example](slug:dateranges_datepicker)).
     */
    min?: Date;
    /**
     * Sets or gets the `navigation` property of the Calendar and determines if the navigation side-bar is displayed
     * ([see example](slug:sidebar_datepicker)).
     */
    navigation?: boolean;
    /**
     * Specifies the hint the DatePicker displays when its value is `null`
     * ([more information and examples](slug:placeholders_datepicker)).
     */
    placeholder?: string;
    /**
     * Sets the read-only state of the DatePicker input field
     * ([see example](slug:readonly_datepicker#read-only-input)).
     *
     * If [`readonly`](slug:api_dateinputs_datepickercomponent#readonly) is `true`, the input appears in a read-only state, regardless of the `readOnlyInput` value.
     */
    readOnlyInput?: boolean;
    /**
     * Sets the read-only state of the DatePicker
     * ([see example](slug:readonly_datepicker#toc-read-only-datepicker)).
     */
    readonly?: boolean;
    /**
     * Sets the title of the input element of the DatePicker.
     */
    title?: string;
    /**
     * Defines the topmost Calendar view to which the user can navigate
     * ([see example](slug:viewdepth_calendar)).
     */
    topView?: CalendarView;
    /**
     * Determines if the week number column is displayed in the `month` view of the Calendar
     * ([see example](slug:datepicker_calendar_options#toc-week-number-column)).
     */
    weekNumber?: boolean;
    /**
     * Sets the dates of the DatePicker that are disabled
     * ([see example](slug:disabled_dates_datepicker)).
     */
    disabledDates?: ((date: Date) => boolean) | Date[] | Day[];
    /**
     * Configures the popup options of the DatePicker.
     */
    popupSettings?: PopupSettings;
}