@progress/kendo-angular-dateinputs 17.0.0-develop.2 → 17.0.0-develop.21

package/README.md

@@ -4,146 +4,61 @@
 
 ## Kendo UI for Angular Date Inputs Package (DatePicker, TimePicker, DateInput, DateRangePicker, DateTimePicker, Calendar, and MultiViewCalendar Components)
 
-> **Important**
-> * This package is part of [Kendo UI for Angular](https://www.telerik.com/kendo-angular-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)—a commercial library designed and built for developing business applications with Angular. Every UI component in the Kendo UI for Angular suite has been built from the ground-up specifically for Angular.
-> * You will need to install a license key when adding the package to your project. For more information, please refer to the [Kendo UI for Angular My License page](https://www.telerik.com/kendo-angular-ui/my-license?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs).
-> * To receive a license key, you need to either [purchase a license](https://www.telerik.com/purchase/kendo-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs) or register for a [free trial](https://www.telerik.com/download-login-v2-kendo-angular-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs). Doing so indicates that you [accept the Kendo UI for Angular License Agreement](https://www.telerik.com/purchase/license-agreement/kendo-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs).
+> * This package is part of [Kendo UI for Angular](https://www.telerik.com/kendo-angular-ui)—a commercial library designed and built for developing business applications with Angular. Every UI component in the Kendo UI for Angular suite has been built from the ground-up specifically for Angular.
+> * You must [install a license key](https://www.telerik.com/kendo-angular-ui/my-license) when adding the package to your project. To receive a license key, either [purchase a license](https://www.telerik.com/purchase/kendo-ui) or register for a [free trial](https://www.telerik.com/download-login-v2-kendo-angular-ui).
 > * The 30-day free trial gives you access to all the Kendo UI for Angular components and their full functionality. Additionally, for the period of your license, you get access to our legendary technical support provided directly by the Kendo UI for Angular dev team!
 >
-> [Start using Kendo UI for Angular](https://www.telerik.com/download-login-v2-kendo-angular-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs) and speed up your development process!
+> [Start using Kendo UI for Angular](https://www.telerik.com/download-login-v2-kendo-angular-ui) and speed up your development process!
 
-
-The Date Input Package is a collection of seven components designed to add date selection functionality to your applications. Whether you need date input fields or calendar pickers, everything is inside. Each component is highly customizable, high-performance, and well-documented.
+The [Kendo UI for Angular Date Inputs](https://www.telerik.com/kendo-angular-ui/components/dateinputs) package is a collection of seven components designed to add date selection functionality to your applications. Whether you need date input fields or calendar pickers, everything is inside. Each component is highly customizable, high-performance, and well-documented.
 
 <img src="https://d585tldpucybw.cloudfront.net/sfimages/default-source/component-pages/angular/angular-datetimepicker-overview.gif?sfvrsn=388e98e4_0" alt="Angular Date Input Component Example">
 
-What's Included in This Package:
-* [Angular Calendar Component](#angular-calendar-component)
-* [Angular DateInput Component](#angular-dateinput-component)
-* [Angular DatePicker Component](#angular-datepicker-component)
-* [Angular DateRange Component](#angular-daterange-component)
-* [Angular DateTimePicker Component](#angular-datetimepicker-component)
-* [Angular MultiView Calendar](#angular-multiview-calendar)
-* [Angular TimePicker Component](#angular-timepicker-component)
-
-## Angular Calendar Component
-
-The [Angular Calendar Component](https://www.telerik.com/kendo-angular-ui/components/dateinputs/calendar/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs) renders a visual calendar used for date selection and navigation.
-
-### Key Features
-
-* [Calendar types](https://www.telerik.com/kendo-angular-ui/components/dateinputs/calendar/type/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;You can set the type of the Angular Calendar and choose between the default infinite layout and the classic rendering.
-* [Focused and selected dates](https://www.telerik.com/kendo-angular-ui/components/dateinputs/calendar/dates/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;Control the focused and selected dates within the Calendar.
-* [Disabled dates](https://www.telerik.com/kendo-angular-ui/components/dateinputs/calendar/disabled-dates/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;The Angular Calendar supports specific approaches for disabling a selection of dates such as through using a function, an array of dates, or an array of days.
-* [Fast navigation sidebar](https://www.telerik.com/kendo-angular-ui/components/dateinputs/calendar/sidebar/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;By default a sidebar is placed to the side of the calendar for fast navigation, but you can customize it.
-* [Active view](https://www.telerik.com/kendo-angular-ui/components/dateinputs/calendar/active-view/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;Control the initially loaded page of the Calendar and render it in a month, year, decade, or year view.
-* [View selection depth](https://www.telerik.com/kendo-angular-ui/components/dateinputs/calendar/view-depth/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;The Angular Calendar provides an option for setting the view depth to which the user can navigate.
-* [Selection modes](https://www.telerik.com/kendo-angular-ui/components/dateinputs/calendar/multiple-selection/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;Apart form its default single selection mode, the Angular Calendar supports options for multiple, range, and week selection.
-* [Week number column](https://www.telerik.com/kendo-angular-ui/components/dateinputs/calendar/week-num-column/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;The Angular Calendar also supports options for rendering a column displaying the number of the weeks.
-
-
-## Angular DateInput Component
-
-The [Angular DateInput Component](https://www.telerik.com/kendo-angular-ui/components/dateinputs/dateinput/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs) renders an input field that recognizes and enforces date formats.
-
-### Key Features
-
-* [Spin buttons](https://www.telerik.com/kendo-angular-ui/components/dateinputs/dateinput/spin-buttons/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;Enable spin buttons to increase or decrease the date value by adding or subtracting days.
-* [Incremental steps](https://www.telerik.com/kendo-angular-ui/components/dateinputs/dateinput/incremental-steps/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;Change the default step for increasing and decreasing the parts of its date values.
-* [Formats](https://www.telerik.com/kendo-angular-ui/components/dateinputs/dateinput/formats/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;Display the date value in its single format at all times or configure it to show the value in different formats when the input is focused or blurred.
-* [Placeholders](https://www.telerik.com/kendo-angular-ui/components/dateinputs/dateinput/placeholders/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;Show a text hint, a floating label, or descriptions for its format sections.
-* [Incomplete date validation](https://www.telerik.com/kendo-angular-ui/components/dateinputs/dateinput/placeholders/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;The incomplete date validation feature of the DateInput ensures that users do not accidentally leave a non-required field partially populated.
-
-## Angular DatePicker Component
-
-The [Angular DatePicker Component](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs) combines the DateIput and Calendar components to provide a interactive form element for picking dates. Users can pick a date from the calendar and it will appear as text in the DateInput field or they can type in a date and it will be automatically selected in the Calendar.
-
-### Key Features
-
-* [Calendar options](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/calendar-type/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;Use various options to configure the popup calendar within the Angular DatePicker—for example, switch between different calendar layouts, handle the animation of the calendar navigation, set the focused dates and the initially loaded calendar page, and more.
-* [Disabled dates](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/disabled-dates/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;The Angular DatePicker supports specific approaches for disabling a selection of dates such as through using a function, an array of dates, or an array of days.
-* [Fast navigation sidebar](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/sidebar/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;The Angular DatePicker supports configuration options for controlling the default navigation sidebar.
-* [Formats](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/formats/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;Display the DatePicker in its single format at all times or configure it to show the value in different formats when the input is focused or blurred.
-* [Placeholders](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/placeholders/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;Render a text hint or descriptions for its format sections.
-* [Incomplete date validation](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/incomplete-dates/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;The incomplete date validation feature of the DatePicker ensures that users do not accidentally leave a non-required field partially populated.
+## What's Included in the Angular Date Inputs Package
 
-## Angular DateRange Component
+* [Angular Calendar Component](https://www.telerik.com/kendo-angular-ui/components/dateinputs/calendar)&mdash;Renders a visual calendar used for date selection and navigation.
+* [Angular DateInput Component](https://www.telerik.com/kendo-angular-ui/components/dateinputs/dateinput)&mdash;Renders an input field that recognizes and enforces date formats.
+* [Angular DatePicker Component](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker)&mdash;Combines the DateInput and Calendar components to provide an interactive form element for picking dates. Users can pick a date from the Calendar and it will appear as text in the DateInput field or they can type in a date and it will be automatically selected in the Calendar.
+* [Angular DateTimePicker Component](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datetimepicker)&mdash;Combines the DateInput, Calendar, and TimePicker components to provide an interactive form element for picking dates and specific times.
+* [Angular DateRange Component](https://www.telerik.com/kendo-angular-ui/components/dateinputs/daterange)&mdash;This is a container that holds start and end date input fields and a date range popup calendar.
+* [Angular MultiViewCalendar Component](https://www.telerik.com/kendo-angular-ui/components/dateinputs/multiviewcalendar)&mdash;Renders multiple calendars in one container for the purposes of selecting and navigating dates. It is most often used for setting start and end dates.
+* [Angular TimePicker Component](https://www.telerik.com/kendo-angular-ui/components/dateinputs/timepicker)&mdash;This is an input field that allows the user to enter or pick time values from a time-list.
 
-The [Angular DateRange Component](https://www.telerik.com/kendo-angular-ui/components/dateinputs/daterange/) is a container that hosts start and end date input fields and popup calendars.
+## Key Features
 
-### Key Features
+Among the many features which the Kendo UI for Angular Date Inputs deliver are:
 
-* Selection of [dates](https://www.telerik.com/kendo-angular-ui/components/dateinputs/daterange/directives/) and [ranges](https://www.telerik.com/kendo-angular-ui/components/dateinputs/daterange/selection-range/)&mdash;Allow users to select single dates or date ranges from a popup calendar.
-* [Popup options](https://www.telerik.com/kendo-angular-ui/components/dateinputs/daterange/popup/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;Customize the popup calendar with options for visibility, alignment, position, and more.
-* [Date range auto correction](https://www.telerik.com/kendo-angular-ui/components/dateinputs/daterange/autocorrect/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;Ensure quality UX through automatic correction of date range formats.
+* [Forms Support](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/forms)&mdash;The package provides support for both asynchronous template-driven Angular forms and predominantly synchronous reactive Angular forms. This feature allows you to make use of the logic set either in the template or in the component's TypeScript code.
+* [Date and Time Ranges](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/date-ranges)&mdash;Except for the MultiViewCalendar, all Date Inputs provide configuration options for setting a start and end date or time and, in this way, defining date or time ranges.
+* [Disabled Date Inputs](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/disabled-state)&mdash;You can choose to render the Date Inputs in their disabled state so that they are read-only.
+* [Selection Modes](https://www.telerik.com/kendo-angular-ui/components/dateinputs/calendar/selection-modes)&mdash;The Date Inputs provide a number of selection modes which allow users to select a single date, a range of dates, or multiple dates.
+* [Formats](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/formats)&mdash;The components in the Date Inputs package provide the ability to configure a desired date format for the displayed value.
+* [Placeholders](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/placeholders)&mdash;The Date Inputs conveniently enable you to render a text hint inside the their input field to give the users an indication of what type of value they should provide and in what format.
+* [Typing](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/typing)&mdash;You can control the user typing experience of the input-based Date Inputs by configuring the available typing options depending on your specific requirements.
+* [View Options](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/calendar-options)&mdash;There are various options provided for configuring the type of calendar, the initially displayed view, the currently focused date, and the view depth to which the user can navigate.
+* [Templates](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/templates)&mdash;Customize the content and overall appearance of the calendar-based Date Inputs by utilizing ready-to-use templates and applying them to the individual cells of the components—for example, to the month, year, decade, or century calendar cells.
+* [Integration with JSON](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/integration-with-json)&mdash;Since the Date Inputs only work with JavaScript Date instances, and the data received from the server is serialized in JSON format, the components provide options for binding to dates that are serialized as strings.
+* [Globalization](https://www.telerik.com/kendo-angular-ui/components/dateinputs/globalization)&mdash;The included components support globalization to ensure that they can fit well in any application, no matter what languages and locales need to be supported. Additionally, the Date Inputs support rendering in a right-to-left (RTL) direction.
+* [Accessibility](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/accessibility)&mdash;The Date Inputs are accessible for screen readers and support WAI-ARIA attributes.
+* [Keyboard Navigation](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/keyboard-navigation)&mdash;The Date Inputs support a number of keyboard shortcuts which alow users to accomplish various commands.
 
-## Angular DateTimePicker Component
+## Support Options
 
-The [Angular DateTimePicker Component](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datetimepicker/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs) combines the DateIput, Calendar, and TimePicker components to provide a interactive form element for picking dates and specific times.
+For any issues you might encounter while working with the Kendo UI for Angular Date Inputs, you have the following support channels available:
 
-### Key Features
-
-* [Calendar options](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datetimepicker/calendar-options/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;Configure the popup calendar by switching between different calendar layouts, handling the animation of the calendar navigation, setting the focused dates, and more.
-* [Date and time ranges](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datetimepicker/date-time-limits/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;Date and time ranges can be defined by setting a start and end date for a period of time.
-* [Disabled dates](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datetimepicker/disabled-dates/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;The Angular DateTimePicker supports specific approaches for disabling a selection of dates such as through using a function, an array of dates, or an array of days.
-* [Formats](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datetimepicker/formats/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs) &mdash;Display the DateTimePicker in its single format at all times or configure it to show the value in different formats when the input is focused or blurred.
-* [Placeholders](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datetimepicker/placeholders/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;The DateTimePicker provides options for setting its input field and render a text hint, a floating label, or descriptions for its format sections.
-* [Incremental steps](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datetimepicker/incremental-steps/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;The DateTimePicker enables you to change the default step for increasing and decreasing the parts of its date values.
-* [Popup options](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datetimepicker/popup-options/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;Customizing the calendar popup through various configuation options such as toggling the cancel button.
-
-## Angular MultiView Calendar
-
-The [Angular MultiView Calendar](https://www.telerik.com/kendo-angular-ui/components/dateinputs/multiviewcalendar/) renders multiple caleandars in one container for the purposes of selecting and navigating dates. It is most often used for setting start and end dates.
-
-### Key Features
-
-* [Focused and selected dates](https://www.telerik.com/kendo-angular-ui/components/dateinputs/multiviewcalendar/dates/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash; Control the focused and selected dates within the MultiViewCalendar.
-* [Disabled dates](https://www.telerik.com/kendo-angular-ui/components/dateinputs/multiviewcalendar/disabled-dates/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;  The MultiViewCalendar supports specific approaches for disabling a selection of dates such as through using a function, an array of dates, or an array of days.
-* [Date ranges](https://www.telerik.com/kendo-angular-ui/components/dateinputs/multiviewcalendar/selection-range/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash;  Display a start-end date period as a selection range.
-* [Active view](https://www.telerik.com/kendo-angular-ui/components/dateinputs/multiviewcalendar/active-view/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash; Control the initially loaded page of the Calendar and render it in a month, year, decade, or year view.
-* [Multiple views](https://www.telerik.com/kendo-angular-ui/components/dateinputs/multiviewcalendar/multiple-views/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash; Control the number of the horizontally rendered MultiViewCalendar views.
-* [View header](https://www.telerik.com/kendo-angular-ui/components/dateinputs/multiviewcalendar/view-header/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash; Rrender a header for each view.
-* [View selection depth](https://www.telerik.com/kendo-angular-ui/components/dateinputs/multiviewcalendar/view-depth/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash; The MultiViewCalendar provides an option for setting the view depth to which the user can navigate.
-* [Navigation animation](https://www.telerik.com/kendo-angular-ui/components/dateinputs/multiviewcalendar/navigation-animation/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash; Enable navigation animation for the MultiViewCalendar.
-* [Week number column](https://www.telerik.com/kendo-angular-ui/components/dateinputs/multiviewcalendar/week-num-column/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)&mdash; Render a column displaying the number of the weeks.
-
-## Angular TImePicker Component
-
-The [Angular TImePicker Component](https://www.telerik.com/kendo-angular-ui/components/dateinputs/timepicker/) is an input field that combines text input and spinner controls to give users a choice in how they would like to enter time data.
-
-### Key Features
-
-* [Time ranges](https://www.telerik.com/kendo-angular-ui/components/dateinputs/timepicker/time-ranges/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs) &mdash;Time ranges can be defined by setting a start and end time value.
-* [Incremental steps](https://www.telerik.com/kendo-angular-ui/components/dateinputs/timepicker/incremental-steps/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs) &mdash; The TimePicker enables you to change the default step for increasing and decreasing the parts of its time values.
-* [Formats](https://www.telerik.com/kendo-angular-ui/components/dateinputs/timepicker/formats/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs) &mdash; Control the format of the TimePicker by using its format property.
-* [Placeholders](https://www.telerik.com/kendo-angular-ui/components/dateinputs/timepicker/placeholders/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs) &mdash; The TimePicker provides options for setting its input field and render a text hint or descriptions for its format sections.
-
-## Angular Date Inputs Package Common Features
-
-The following features are aviable across all the components in this package:
-
-* **Forms Support**&mdash;The package provides support both for asynchronous template-driven Angular forms and predominantly synchronous reactive Angular forms. This feature allows you to draw on the logic set either in the template, or in the component or typescript code.
-* **Date and Time Ranges**&mdash; Except for the MultiViewCalendar, all Date Inputs provide configuration options for setting a start and end date or time and, in this way, defining date or time ranges.
-* **Disabled Date Inputs**&mdash; You can choose to render the Date Inputs in their disabled state so that they are read-only.
-* **Templates**&mdash; Customize the content and the general look and feel of the calendar-based Date Inputs by utilizing ready-to-use templates and applying them to the individual cells of the components—for example, to the month, year, decade, or century calendar cells.
-* **Integration with JSON**&mdash;As the components only wprk with date JavaScript instances while the received data from the server is serialized in a JSON format, the component provides options for binding it to dates which are serialized as strings.
-* **Globalization**&mdash; The included components support globalization to ensure that they can fit well in any application, no matter what languages and locales need to be supported. Additionally, the Date Inputs support rendering in a right-to-left (RTL) direction.
-* **Accessibility**&mdash; The Date Inputs are accessible for screen readers and support WAI-ARIA attributes.
-* **Keyboard Navigation**&mdash; The Date Inputs support a number of keyboard shortcuts which alow users to accomplish various commands.
+* Industry-leading technical support&mdash;Kendo UI for Angular paid license holders and users with an active (free) trial license can take advantage of our outstanding customer support. To submit a ticket, use the [dedicated Kendo UI for Angular support system](https://www.telerik.com/account/support-tickets).
+* Product forums&mdash;The [Kendo UI for Angular forums](https://www.telerik.com/forums/kendo-angular-ui) are part of the free support you can get from the community and from the Kendo UI for Angular team.
+* Feedback portal&mdash;The [Kendo UI for Angular feedback portal](https://feedback.telerik.com/kendo-angular-ui) is where you can request and vote for new features to be added.
 
 ## Resources
 
-* [Get Started with Kendo UI for Angular (requires trial registration)](https://www.telerik.com/kendo-angular-ui/getting-started?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)
-* [Demos, documentation, and component reference](https://www.telerik.com/kendo-angular-ui/components?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)
-* [Blogs](http://www.telerik.com/blogs/kendo-ui)
-* [Kendo UI for Angular pricing and licensing](https://www.telerik.com/purchase/kendo-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)
-
-## Questions and Feedback
-
-* [Official Forums](https://www.telerik.com/forums/kendo-angular-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)
-* [GitHub Issues](https://github.com/telerik/kendo-angular/issues?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)
-* [Feedback Portal](https://feedback.telerik.com/kendo-angular-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)
-* [StackOverflow](https://stackoverflow.com/questions/tagged/kendo-ui-angular2?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-dateinputs)
+* [Getting Started with Kendo UI for Angular](https://www.telerik.com/kendo-angular-ui/getting-started)
+* [Getting Started with the Kendo UI for Angular Date Inputs](https://www.telerik.com/kendo-angular-ui/components/dateinputs/installation/getting-started)
+* [Date Inputs Overview page](https://www.telerik.com/kendo-angular-ui/components/dateinputs) and [Date Inputs API reference](https://www.telerik.com/kendo-angular-ui/components/dateinputs/api)
+* [Kendo UI for Angular roadmap](https://www.telerik.com/kendo-angular-ui/roadmap)
+* [Kendo UI for Angular Blog](https://www.telerik.com/blogs/tag/kendo-ui-for-angular)
+* [Demos, documentation, and component reference](https://www.telerik.com/kendo-angular-ui/components)
+* [Kendo UI for Angular pricing and licensing](https://www.telerik.com/purchase/kendo-ui)
 
 *Copyright © 2024 Progress Software Corporation and/or one of its subsidiaries or affiliates. All rights reserved.*
 

package/daterange/date-range-popup.component.d.ts

@@ -15,6 +15,8 @@ import { DateRangeSelectionDirective } from './date-range-selection.directive';
 import { ActionSheetComponent } from '@progress/kendo-angular-navigation';
 import { KeyDown } from '../calendar/models/keydown.interface';
 import { DateInputSize } from '../common/models/size';
+import { CalendarView } from '../calendar/models/view.type';
+import { Day } from '@progress/kendo-date-math';
 import * as i0 from "@angular/core";
 /**
  * Represents the Kendo UI DateRangePopup component for Angular.
@@ -51,12 +53,83 @@ export declare class DateRangePopupComponent implements OnInit, OnDestroy {
     viewCalendar: QueryList<MultiViewCalendarComponent>;
     contentCalendar: QueryList<MultiViewCalendarComponent>;
     /**
-     * Allows reverse selection when using `range` selection.
+     * @hidden
+     *
+     * Determines whether to display the MultiViewCalendar header.
+     */
+    showCalendarHeader: boolean;
+    /**
+     * Sets or gets the `focusedDate` property of the MultiViewCalendar and
+     * defines the focused date of the component
+     * ([see example]({% slug dates_multiviewcalendar %}#toc-focused-dates)).
+     *
+     * > If the MultiViewCalendar is out of the min or max range, it normalizes the defined `focusedDate`.
+     */
+    focusedDate: Date;
+    /**
+     * Sets the dates of the MultiViewCalendar that will be disabled
+     * ([see example]({% slug disabled_dates_multiviewcalendar %})).
+     */
+    disabledDates: ((date: Date) => boolean) | Date[] | Day[];
+    /**
+     * Defines the active view that the MultiViewCalendar initially renders
+     * ([see example]({% slug viewoptions_multiviewcalendar %})).
+     * By default, the active view is `month`.
+     *
+     * > You have to set `activeView` within the `topView`-`bottomView` range.
+     */
+    activeView: CalendarView;
+    /**
+     * Defines the bottommost view, to which the user can navigate
+     * ([see example](slug:viewdepth_multiviewcalendar)).
+     */
+    bottomView: CalendarView;
+    /**
+     * Defines the topmost view, to which the user can navigate.
+     */
+    topView: CalendarView;
+    /**
+     * Sets or gets the `min` property of the MultiViewCalendar and
+     * defines the minimum allowed date value.
+     * By default, the `min` value is `1900-1-1`.
+     */
+    min: Date;
+    /**
+     * Sets or gets the `max` property of the MultiViewCalendar and
+     * defines the maximum allowed date value.
+     * By default, the `max` value is `2099-12-31`.
+     */
+    max: Date;
+    /**
+     * Allows reverse selection.
      * If `allowReverse` is set to `true`, the component skips the validation of whether the start date is after the end date.
      *
      * @default false
      */
     allowReverse: boolean;
+    /**
+     * Determines whether to enable animation when navigating to previous/next view.
+     * @default false
+     */
+    animateNavigation: boolean;
+    /**
+     * Sets or gets the `disabled` property of the MultiViewCalendar and
+     * determines whether the component is active
+     * ([see example]({% slug disabled_multiviewcalendar %})).
+     */
+    disabled: boolean;
+    /**
+     * Sets or gets the `views` property of the MultiViewCalendar and
+     * defines the number of rendered months.
+     *
+     * @default 2
+     */
+    views: number;
+    /**
+     * Determines whether to display a week number column in the `month` view
+     * ([see example]({% slug weeknumcolumn_multiviewcalendar %})).
+     */
+    weekNumber: boolean;
     /**
      * Controls the popup animation.
      * By default, the opening and closing animations are enabled.
@@ -76,6 +149,17 @@ export declare class DateRangePopupComponent implements OnInit, OnDestroy {
      * [positioning]({% slug alignmentpositioning_popup %}#toc-positioning).
      */
     anchorAlign: Align;
+    /**
+     * Determines whether to display a header for every view (for example the month name).
+     *
+     * @default false
+     */
+    showViewHeader: boolean;
+    /**
+     * Displays the days that fall out of the current month ([see example]({% slug viewoptions_multiviewcalendar %}#toc-displaying-other-month-days)).
+     * @default false
+     */
+    showOtherMonthDays: boolean;
     /**
      * Controls the popup container. By default, the popup is appended to the root component.
      */
@@ -272,5 +356,5 @@ export declare class DateRangePopupComponent implements OnInit, OnDestroy {
     private toggleActionSheet;
     private updateActionSheetAdaptiveAppearance;
     static ɵfac: i0.ɵɵFactoryDeclaration<DateRangePopupComponent, [null, null, null, null, null, null, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DateRangePopupComponent, "kendo-daterange-popup", ["kendo-daterange-popup"], { "allowReverse": "allowReverse"; "animate": "animate"; "anchor": "anchor"; "anchorAlign": "anchorAlign"; "appendTo": "appendTo"; "collision": "collision"; "popupAlign": "popupAlign"; "margin": "margin"; "adaptiveMode": "adaptiveMode"; "title": "title"; "subtitle": "subtitle"; "size": "size"; }, { "open": "open"; "close": "close"; "onBlur": "blur"; "onFocus": "focus"; "cancel": "cancel"; }, ["contentTemplate", "contentCalendar"], never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DateRangePopupComponent, "kendo-daterange-popup", ["kendo-daterange-popup"], { "showCalendarHeader": "showCalendarHeader"; "focusedDate": "focusedDate"; "disabledDates": "disabledDates"; "activeView": "activeView"; "bottomView": "bottomView"; "topView": "topView"; "min": "min"; "max": "max"; "allowReverse": "allowReverse"; "animateNavigation": "animateNavigation"; "disabled": "disabled"; "views": "views"; "weekNumber": "weekNumber"; "animate": "animate"; "anchor": "anchor"; "anchorAlign": "anchorAlign"; "showViewHeader": "showViewHeader"; "showOtherMonthDays": "showOtherMonthDays"; "appendTo": "appendTo"; "collision": "collision"; "popupAlign": "popupAlign"; "margin": "margin"; "adaptiveMode": "adaptiveMode"; "title": "title"; "subtitle": "subtitle"; "size": "size"; }, { "open": "open"; "close": "close"; "onBlur": "blur"; "onFocus": "focus"; "cancel": "cancel"; }, ["contentTemplate", "contentCalendar"], never, true, never>;
 }

package/esm2020/calendar/footer.component.mjs

@@ -35,7 +35,7 @@ FooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
                 {{intl.formatDate(getToday(), 'D')}}
         </button>
     </ng-template>
-  `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
+  `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FooterComponent, decorators: [{
             type: Component,
             args: [{

package/esm2020/calendar/header.component.mjs

@@ -209,7 +209,7 @@ HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
             </button>
         </span>
     </ng-template>
-`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }] });
+`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HeaderComponent, decorators: [{
             type: Component,
             args: [{

package/esm2020/datepicker/datepicker.component.mjs

@@ -1271,7 +1271,7 @@ DatePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
                 </kendo-calendar-messages>
             </kendo-calendar>
         </ng-template>
-    `, isInline: true, dependencies: [{ kind: "directive", type: DatePickerLocalizedMessagesDirective, selector: "[kendoDatePickerLocalizedMessages]" }, { kind: "component", type: DateInputComponent, selector: "kendo-dateinput", inputs: ["focusableId", "pickerType", "clearButton", "disabled", "readonly", "title", "tabindex", "role", "ariaReadOnly", "tabIndex", "isRequired", "format", "formatPlaceholder", "placeholder", "steps", "max", "min", "rangeValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "allowCaretMode", "autoFill", "incompleteDateValidation", "twoDigitYearMax", "enableMouseWheel", "value", "spinners", "isPopupOpen", "hasPopup", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "valueUpdate", "focus", "blur"], exportAs: ["kendo-dateinput"] }, { kind: "component", type: DateInputCustomMessagesComponent, selector: "kendo-dateinput-messages" }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: ActionSheetComponent, selector: "kendo-actionsheet", inputs: ["title", "subtitle", "items", "cssClass", "animation", "expanded", "titleId"], outputs: ["expandedChange", "expand", "collapse", "itemClick", "overlayClick"], exportAs: ["kendoActionSheet"] }, { kind: "directive", type: ActionSheetTemplateDirective, selector: "[kendoActionSheetTemplate]" }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: CalendarComponent, selector: "kendo-calendar", inputs: ["showOtherMonthDays", "id", "focusedDate", "min", "max", "rangeValidation", "weekDaysFormat", "footer", "selection", "allowReverse", "value", "disabled", "tabindex", "tabIndex", "disabledDates", "navigation", "activeView", "bottomView", "topView", "type", "animateNavigation", "weekNumber", "cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "headerTemplate", "footerTemplate", "navigationItemTemplate", "size", "activeRangeEnd"], outputs: ["activeViewChange", "navigate", "activeViewDateChange", "blur", "focus", "valueChange"], exportAs: ["kendo-calendar"] }, { kind: "component", type: CalendarCustomMessagesComponent, selector: "kendo-calendar-messages" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    `, isInline: true, dependencies: [{ kind: "directive", type: DatePickerLocalizedMessagesDirective, selector: "[kendoDatePickerLocalizedMessages]" }, { kind: "component", type: DateInputComponent, selector: "kendo-dateinput", inputs: ["focusableId", "pickerType", "clearButton", "disabled", "readonly", "title", "tabindex", "role", "ariaReadOnly", "tabIndex", "isRequired", "format", "formatPlaceholder", "placeholder", "steps", "max", "min", "rangeValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "allowCaretMode", "autoFill", "incompleteDateValidation", "twoDigitYearMax", "enableMouseWheel", "value", "spinners", "isPopupOpen", "hasPopup", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "valueUpdate", "focus", "blur"], exportAs: ["kendo-dateinput"] }, { kind: "component", type: DateInputCustomMessagesComponent, selector: "kendo-dateinput-messages" }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: ActionSheetComponent, selector: "kendo-actionsheet", inputs: ["title", "subtitle", "items", "cssClass", "animation", "expanded", "titleId"], outputs: ["expandedChange", "expand", "collapse", "itemClick", "overlayClick"], exportAs: ["kendoActionSheet"] }, { kind: "directive", type: ActionSheetTemplateDirective, selector: "[kendoActionSheetTemplate]" }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: CalendarComponent, selector: "kendo-calendar", inputs: ["showOtherMonthDays", "id", "focusedDate", "min", "max", "rangeValidation", "weekDaysFormat", "footer", "selection", "allowReverse", "value", "disabled", "tabindex", "tabIndex", "disabledDates", "navigation", "activeView", "bottomView", "topView", "type", "animateNavigation", "weekNumber", "cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "headerTemplate", "footerTemplate", "navigationItemTemplate", "size", "activeRangeEnd"], outputs: ["activeViewChange", "navigate", "activeViewDateChange", "blur", "focus", "valueChange"], exportAs: ["kendo-calendar"] }, { kind: "component", type: CalendarCustomMessagesComponent, selector: "kendo-calendar-messages" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DatePickerComponent, decorators: [{
             type: Component,
             args: [{