@progress/kendo-react-dateinputs 7.5.0-develop.2 → 7.5.0-develop.20

package/index.d.mts

@@ -141,6 +141,14 @@ export declare interface CalendarHandle extends Pick<CalendarWithoutContext, key
     value: Date | null;
 }
 
+/**
+ * The props which will be received by the custom header of the Calendar and the MultiViewCalendar.
+ */
+declare interface CalendarHeaderProps {
+    headerTitleProps: CalendarHeaderTitleProps;
+    commands: React.ReactNode;
+}
+
 /**
  * The `CalendarHeaderTitle` component is internally used for rendering the title of the current calendar view. Also used as a custom `headerTitle` for the [Calendar]({% slug api_dateinputs_calendarprops %}#toc-headertitle) and the [MultiViewCalendar]({% slug api_dateinputs_multiviewcalendarprops %}#toc-headertitle) components.
  *
@@ -302,10 +310,20 @@ export declare interface CalendarSettings {
      * Defines the topmost view to which the user can navigate.
      */
     topView?: ActiveView;
+    /**
+     * Specifies the possible format options for the displayed Calendar week days' names.
+     *
+     * @default short
+     */
+    weekDaysFormat?: WeekDaysFormat;
     /**
      * Determines if the week number column will be displayed.
      */
     weekNumber?: boolean;
+    /**
+     * Displays the days that fall out of the current month.
+     */
+    showOtherMonthDays?: boolean;
     /**
      * Enables the customization or the override of the default Calendar cell
      * ([see example]({% slug custom_rendering_calendar %}#toc-cells-inside-the-view)).
@@ -321,6 +339,11 @@ export declare interface CalendarSettings {
      * ([see example]({% slug custom_rendering_calendar %}#toc-titles-of-current-views)).
      */
     headerTitle?: React.ComponentType<CalendarHeaderTitleProps>;
+    /**
+     * Enables the customization or the override of the default header title in the Calendar
+     * ([see example]({% slug custom_rendering_calendar %}#toc-titles-of-current-views)).
+     */
+    header?: React.ComponentType<CalendarHeaderProps>;
     /**
      * Enables the customization or the override of the default navigation item in the Calendar
      * ([see example]({% slug custom_rendering_calendar %}#toc-items-in-the-side-navigation)).
@@ -391,6 +414,7 @@ export declare class CalendarWithoutContext extends React_2.Component<CalendarPr
         id: PropTypes.Requireable<string>;
         ariaLabelledBy: PropTypes.Requireable<string>;
         ariaDescribedBy: PropTypes.Requireable<string>;
+        weekDaysFormat: PropTypes.Requireable<string>;
         max: PropTypes.Requireable<Date>;
         min: PropTypes.Requireable<Date>;
         navigation: PropTypes.Requireable<boolean>;
@@ -411,11 +435,13 @@ export declare class CalendarWithoutContext extends React_2.Component<CalendarPr
         disabled: boolean;
         min: Date;
         max: Date;
+        weekDaysFormat: string;
         navigation: boolean;
         defaultActiveView: ActiveView;
         defaultValue: null;
         topView: ActiveView;
         bottomView: ActiveView;
+        showOtherMonthDays: boolean;
     };
     protected dom: DOMService;
     protected scrollSyncService: ScrollSyncService | null;
@@ -492,6 +518,7 @@ export declare interface CellContext {
     isToday: boolean;
     title?: string;
     value: Date;
+    isOtherMonth?: boolean;
 }
 
 /**
@@ -883,7 +910,7 @@ export declare class DateInputWithoutContext extends React_2.Component<DateInput
             second: PropTypes.Requireable<string>;
             timeZoneName: PropTypes.Requireable<string>;
         }> | null | undefined>>;
-        formatPlaceholder: PropTypes.Requireable<NonNullable<"narrow" | "short" | "wide" | "formatPattern" | PropTypes.InferProps<{
+        formatPlaceholder: PropTypes.Requireable<NonNullable<"short" | "narrow" | "wide" | "formatPattern" | PropTypes.InferProps<{
             year: PropTypes.Requireable<string>;
             month: PropTypes.Requireable<string>;
             day: PropTypes.Requireable<string>;
@@ -1389,7 +1416,7 @@ export declare class DatePickerWithoutContext extends React_2.Component<DatePick
             second: PropTypes.Requireable<string>;
             timeZoneName: PropTypes.Requireable<string>;
         }> | null | undefined>>;
-        formatPlaceholder: PropTypes.Requireable<NonNullable<"narrow" | "short" | "wide" | "formatPattern" | PropTypes.InferProps<{
+        formatPlaceholder: PropTypes.Requireable<NonNullable<"short" | "narrow" | "wide" | "formatPattern" | PropTypes.InferProps<{
             year: PropTypes.Requireable<string>;
             month: PropTypes.Requireable<string>;
             day: PropTypes.Requireable<string>;
@@ -1565,7 +1592,7 @@ export declare const DateRangePicker: React_2.ForwardRefExoticComponent<DateRang
 /**
  * Represents the settings that can be passed to the MultiViewCalendar inside the DateRangePicker.
  */
-export declare interface DateRangePickerCalendarSettings extends MultiViewCalendarSettings {
+export declare interface DateRangePickerCalendarSettings extends Omit<MultiViewCalendarSettings, 'showOtherMonthDays'> {
 }
 
 /**
@@ -1851,7 +1878,7 @@ export declare class DateRangePickerWithoutContext extends React_2.Component<Dat
                 second: PropTypes.Requireable<string>;
                 timeZoneName: PropTypes.Requireable<string>;
             }> | null | undefined>>;
-            formatPlaceholder: PropTypes.Requireable<NonNullable<"narrow" | "short" | "wide" | "formatPattern" | PropTypes.InferProps<{
+            formatPlaceholder: PropTypes.Requireable<NonNullable<"short" | "narrow" | "wide" | "formatPattern" | PropTypes.InferProps<{
                 year: PropTypes.Requireable<string>;
                 month: PropTypes.Requireable<string>;
                 day: PropTypes.Requireable<string>;
@@ -2363,7 +2390,7 @@ export declare class DateTimePickerWithoutContext extends React_2.Component<Date
             second: PropTypes.Requireable<string>;
             timeZoneName: PropTypes.Requireable<string>;
         }> | null | undefined>>;
-        formatPlaceholder: PropTypes.Requireable<NonNullable<"narrow" | "short" | "wide" | "formatPattern" | PropTypes.InferProps<{
+        formatPlaceholder: PropTypes.Requireable<NonNullable<"short" | "narrow" | "wide" | "formatPattern" | PropTypes.InferProps<{
             year: PropTypes.Requireable<string>;
             month: PropTypes.Requireable<string>;
             day: PropTypes.Requireable<string>;
@@ -2708,6 +2735,7 @@ declare interface HeaderProps {
     rangeLength?: number;
     service: ViewService;
     headerTitle?: React_2.ComponentType<CalendarHeaderTitleProps>;
+    header?: React_2.ComponentType<CalendarHeaderProps>;
     commands?: React_2.ReactNode;
     verticalView?: boolean;
 }
@@ -2721,6 +2749,7 @@ export declare class HorizontalViewList extends React_2.Component<HorizontalView
         views: number;
         take: number;
         allowReverse: boolean;
+        weekDaysFormat: string;
         min: Date;
         max: Date;
     };
@@ -2764,6 +2793,7 @@ export declare interface HorizontalViewListProps {
     selectionRange: SelectionRange;
     service: ViewService;
     showWeekNumbers?: boolean;
+    weekDaysFormat?: WeekDaysFormat;
     take?: number;
     value: Date[] | Date | null;
     views?: number;
@@ -2771,6 +2801,7 @@ export declare interface HorizontalViewListProps {
     allowReverse?: boolean;
     cell?: React_2.ComponentType<CalendarCellProps>;
     weekCell?: React_2.ComponentType<CalendarWeekCellProps>;
+    showOtherMonthDays?: boolean;
     headerTitle?: React_2.ComponentType<CalendarHeaderTitleProps>;
     dates: any[];
     verticalView?: boolean;
@@ -3044,6 +3075,12 @@ export declare interface MultiViewCalendarSettings {
      * Determines if the week number column will be displayed.
      */
     weekNumber?: boolean;
+    /**
+     * Specifies the possible format options for the displayed Calendar week days' names.
+     *
+     * @default short
+     */
+    weekDaysFormat?: WeekDaysFormat;
     /**
      * Fires each time the MultiViewCalendar is focused.
      */
@@ -3094,6 +3131,10 @@ export declare interface MultiViewCalendarSettings {
      * * `range`&mdash;Renders a date-range selection.
      */
     mode?: MultiViewCalendarMode;
+    /**
+     * Displays the days that fall out of the current month.
+     */
+    showOtherMonthDays?: boolean;
     /**
      * Fires each time the MultiViewCalendar is blurred.
      */
@@ -3144,6 +3185,7 @@ export declare class MultiViewCalendarWithoutContext extends React_2.Component<M
         disabled: PropTypes.Requireable<boolean>;
         focusedDate: PropTypes.Requireable<Date>;
         id: PropTypes.Requireable<string>;
+        weekDaysFormat: PropTypes.Requireable<string>;
         ariaLabelledBy: PropTypes.Requireable<string>;
         ariaDescribedBy: PropTypes.Requireable<string>;
         max: PropTypes.Requireable<Date>;
@@ -3157,6 +3199,7 @@ export declare class MultiViewCalendarWithoutContext extends React_2.Component<M
         value: PropTypes.Requireable<any>;
         views: (props: MultiViewCalendarProps, propName: keyof MultiViewCalendarProps<any>, componentName: string) => Error | null;
         weekNumber: PropTypes.Requireable<boolean>;
+        showOtherMonthDays: PropTypes.Requireable<boolean>;
         dir: PropTypes.Requireable<string>;
     };
     /**
@@ -3170,10 +3213,12 @@ export declare class MultiViewCalendarWithoutContext extends React_2.Component<M
         defaultActiveView: ActiveView;
         defaultValue: null;
         topView: ActiveView;
+        weekDaysFormat: string;
         tabIndex: number;
         bottomView: ActiveView;
         views: number;
         allowReverse: boolean;
+        showOtherMonthDays: boolean;
     };
     protected dates: any[];
     private lastView;
@@ -3931,7 +3976,7 @@ export declare class TimePickerWithoutContext extends React_2.Component<TimePick
             second: PropTypes.Requireable<string>;
             timeZoneName: PropTypes.Requireable<string>;
         }> | null | undefined>>;
-        formatPlaceholder: PropTypes.Requireable<NonNullable<"narrow" | "short" | "wide" | "formatPattern" | PropTypes.InferProps<{
+        formatPlaceholder: PropTypes.Requireable<NonNullable<"short" | "narrow" | "wide" | "formatPattern" | PropTypes.InferProps<{
             year: PropTypes.Requireable<string>;
             month: PropTypes.Requireable<string>;
             day: PropTypes.Requireable<string>;
@@ -4281,11 +4326,13 @@ export declare class ViewList extends React_2.Component<ViewListProps, ViewListS
         value: PropTypes.Requireable<Date>;
         viewHeight: PropTypes.Requireable<number>;
         viewOffset: PropTypes.Requireable<number>;
+        weekDaysFormat: PropTypes.Requireable<string>;
         tabIndex: PropTypes.Requireable<number>;
     };
     static defaultProps: {
         take: number;
         showWeekNumbers: boolean;
+        weekDaysFormat: string;
         smoothScroll: boolean;
     };
     virtualization: Virtualization | null;
@@ -4302,6 +4349,7 @@ export declare class ViewList extends React_2.Component<ViewListProps, ViewListS
     private shouldScroll;
     private indexToScroll?;
     private lastFocus;
+    private weekService;
     get element(): HTMLDivElement | null;
     protected get weekNames(): string[];
     protected get weekNumber(): boolean;
@@ -4353,11 +4401,14 @@ declare interface ViewListProps {
     showWeekNumbers?: boolean;
     smoothScroll?: boolean;
     take?: number;
+    weekDaysFormat?: WeekDaysFormat;
     value: Date | null;
     viewHeight?: number;
     viewOffset?: number;
     weekCell?: React_2.ComponentType<CalendarWeekCellProps>;
+    showOtherMonthDays?: boolean;
     headerTitle?: React_2.ComponentType<CalendarHeaderTitleProps>;
+    header?: React_2.ComponentType<CalendarHeaderProps>;
     shouldScroll?: () => boolean;
     tabIndex?: number;
 }
@@ -4488,13 +4539,18 @@ declare interface VirtualizationProps {
     children?: React_2.ReactNode;
 }
 
+/**
+ * Specifies the possible format options for the displayed Calendar week days' names.
+ */
+declare type WeekDaysFormat = 'short' | 'narrow' | 'abbreviated';
+
 /**
  * @hidden
  */
 export declare class WeekNamesService {
     private intl;
     constructor(intl: IntlService);
-    getWeekNames(includeWeekNumber?: boolean): string[];
+    getWeekNames(includeWeekNumber?: boolean, weekDaysFormat?: WeekDaysFormat): string[];
 }
 
 /**

package/index.d.ts

@@ -141,6 +141,14 @@ export declare interface CalendarHandle extends Pick<CalendarWithoutContext, key
     value: Date | null;
 }
 
+/**
+ * The props which will be received by the custom header of the Calendar and the MultiViewCalendar.
+ */
+declare interface CalendarHeaderProps {
+    headerTitleProps: CalendarHeaderTitleProps;
+    commands: React.ReactNode;
+}
+
 /**
  * The `CalendarHeaderTitle` component is internally used for rendering the title of the current calendar view. Also used as a custom `headerTitle` for the [Calendar]({% slug api_dateinputs_calendarprops %}#toc-headertitle) and the [MultiViewCalendar]({% slug api_dateinputs_multiviewcalendarprops %}#toc-headertitle) components.
  *
@@ -302,10 +310,20 @@ export declare interface CalendarSettings {
      * Defines the topmost view to which the user can navigate.
      */
     topView?: ActiveView;
+    /**
+     * Specifies the possible format options for the displayed Calendar week days' names.
+     *
+     * @default short
+     */
+    weekDaysFormat?: WeekDaysFormat;
     /**
      * Determines if the week number column will be displayed.
      */
     weekNumber?: boolean;
+    /**
+     * Displays the days that fall out of the current month.
+     */
+    showOtherMonthDays?: boolean;
     /**
      * Enables the customization or the override of the default Calendar cell
      * ([see example]({% slug custom_rendering_calendar %}#toc-cells-inside-the-view)).
@@ -321,6 +339,11 @@ export declare interface CalendarSettings {
      * ([see example]({% slug custom_rendering_calendar %}#toc-titles-of-current-views)).
      */
     headerTitle?: React.ComponentType<CalendarHeaderTitleProps>;
+    /**
+     * Enables the customization or the override of the default header title in the Calendar
+     * ([see example]({% slug custom_rendering_calendar %}#toc-titles-of-current-views)).
+     */
+    header?: React.ComponentType<CalendarHeaderProps>;
     /**
      * Enables the customization or the override of the default navigation item in the Calendar
      * ([see example]({% slug custom_rendering_calendar %}#toc-items-in-the-side-navigation)).
@@ -391,6 +414,7 @@ export declare class CalendarWithoutContext extends React_2.Component<CalendarPr
         id: PropTypes.Requireable<string>;
         ariaLabelledBy: PropTypes.Requireable<string>;
         ariaDescribedBy: PropTypes.Requireable<string>;
+        weekDaysFormat: PropTypes.Requireable<string>;
         max: PropTypes.Requireable<Date>;
         min: PropTypes.Requireable<Date>;
         navigation: PropTypes.Requireable<boolean>;
@@ -411,11 +435,13 @@ export declare class CalendarWithoutContext extends React_2.Component<CalendarPr
         disabled: boolean;
         min: Date;
         max: Date;
+        weekDaysFormat: string;
         navigation: boolean;
         defaultActiveView: ActiveView;
         defaultValue: null;
         topView: ActiveView;
         bottomView: ActiveView;
+        showOtherMonthDays: boolean;
     };
     protected dom: DOMService;
     protected scrollSyncService: ScrollSyncService | null;
@@ -492,6 +518,7 @@ export declare interface CellContext {
     isToday: boolean;
     title?: string;
     value: Date;
+    isOtherMonth?: boolean;
 }
 
 /**
@@ -883,7 +910,7 @@ export declare class DateInputWithoutContext extends React_2.Component<DateInput
             second: PropTypes.Requireable<string>;
             timeZoneName: PropTypes.Requireable<string>;
         }> | null | undefined>>;
-        formatPlaceholder: PropTypes.Requireable<NonNullable<"narrow" | "short" | "wide" | "formatPattern" | PropTypes.InferProps<{
+        formatPlaceholder: PropTypes.Requireable<NonNullable<"short" | "narrow" | "wide" | "formatPattern" | PropTypes.InferProps<{
             year: PropTypes.Requireable<string>;
             month: PropTypes.Requireable<string>;
             day: PropTypes.Requireable<string>;
@@ -1389,7 +1416,7 @@ export declare class DatePickerWithoutContext extends React_2.Component<DatePick
             second: PropTypes.Requireable<string>;
             timeZoneName: PropTypes.Requireable<string>;
         }> | null | undefined>>;
-        formatPlaceholder: PropTypes.Requireable<NonNullable<"narrow" | "short" | "wide" | "formatPattern" | PropTypes.InferProps<{
+        formatPlaceholder: PropTypes.Requireable<NonNullable<"short" | "narrow" | "wide" | "formatPattern" | PropTypes.InferProps<{
             year: PropTypes.Requireable<string>;
             month: PropTypes.Requireable<string>;
             day: PropTypes.Requireable<string>;
@@ -1565,7 +1592,7 @@ export declare const DateRangePicker: React_2.ForwardRefExoticComponent<DateRang
 /**
  * Represents the settings that can be passed to the MultiViewCalendar inside the DateRangePicker.
  */
-export declare interface DateRangePickerCalendarSettings extends MultiViewCalendarSettings {
+export declare interface DateRangePickerCalendarSettings extends Omit<MultiViewCalendarSettings, 'showOtherMonthDays'> {
 }
 
 /**
@@ -1851,7 +1878,7 @@ export declare class DateRangePickerWithoutContext extends React_2.Component<Dat
                 second: PropTypes.Requireable<string>;
                 timeZoneName: PropTypes.Requireable<string>;
             }> | null | undefined>>;
-            formatPlaceholder: PropTypes.Requireable<NonNullable<"narrow" | "short" | "wide" | "formatPattern" | PropTypes.InferProps<{
+            formatPlaceholder: PropTypes.Requireable<NonNullable<"short" | "narrow" | "wide" | "formatPattern" | PropTypes.InferProps<{
                 year: PropTypes.Requireable<string>;
                 month: PropTypes.Requireable<string>;
                 day: PropTypes.Requireable<string>;
@@ -2363,7 +2390,7 @@ export declare class DateTimePickerWithoutContext extends React_2.Component<Date
             second: PropTypes.Requireable<string>;
             timeZoneName: PropTypes.Requireable<string>;
         }> | null | undefined>>;
-        formatPlaceholder: PropTypes.Requireable<NonNullable<"narrow" | "short" | "wide" | "formatPattern" | PropTypes.InferProps<{
+        formatPlaceholder: PropTypes.Requireable<NonNullable<"short" | "narrow" | "wide" | "formatPattern" | PropTypes.InferProps<{
             year: PropTypes.Requireable<string>;
             month: PropTypes.Requireable<string>;
             day: PropTypes.Requireable<string>;
@@ -2708,6 +2735,7 @@ declare interface HeaderProps {
     rangeLength?: number;
     service: ViewService;
     headerTitle?: React_2.ComponentType<CalendarHeaderTitleProps>;
+    header?: React_2.ComponentType<CalendarHeaderProps>;
     commands?: React_2.ReactNode;
     verticalView?: boolean;
 }
@@ -2721,6 +2749,7 @@ export declare class HorizontalViewList extends React_2.Component<HorizontalView
         views: number;
         take: number;
         allowReverse: boolean;
+        weekDaysFormat: string;
         min: Date;
         max: Date;
     };
@@ -2764,6 +2793,7 @@ export declare interface HorizontalViewListProps {
     selectionRange: SelectionRange;
     service: ViewService;
     showWeekNumbers?: boolean;
+    weekDaysFormat?: WeekDaysFormat;
     take?: number;
     value: Date[] | Date | null;
     views?: number;
@@ -2771,6 +2801,7 @@ export declare interface HorizontalViewListProps {
     allowReverse?: boolean;
     cell?: React_2.ComponentType<CalendarCellProps>;
     weekCell?: React_2.ComponentType<CalendarWeekCellProps>;
+    showOtherMonthDays?: boolean;
     headerTitle?: React_2.ComponentType<CalendarHeaderTitleProps>;
     dates: any[];
     verticalView?: boolean;
@@ -3044,6 +3075,12 @@ export declare interface MultiViewCalendarSettings {
      * Determines if the week number column will be displayed.
      */
     weekNumber?: boolean;
+    /**
+     * Specifies the possible format options for the displayed Calendar week days' names.
+     *
+     * @default short
+     */
+    weekDaysFormat?: WeekDaysFormat;
     /**
      * Fires each time the MultiViewCalendar is focused.
      */
@@ -3094,6 +3131,10 @@ export declare interface MultiViewCalendarSettings {
      * * `range`&mdash;Renders a date-range selection.
      */
     mode?: MultiViewCalendarMode;
+    /**
+     * Displays the days that fall out of the current month.
+     */
+    showOtherMonthDays?: boolean;
     /**
      * Fires each time the MultiViewCalendar is blurred.
      */
@@ -3144,6 +3185,7 @@ export declare class MultiViewCalendarWithoutContext extends React_2.Component<M
         disabled: PropTypes.Requireable<boolean>;
         focusedDate: PropTypes.Requireable<Date>;
         id: PropTypes.Requireable<string>;
+        weekDaysFormat: PropTypes.Requireable<string>;
         ariaLabelledBy: PropTypes.Requireable<string>;
         ariaDescribedBy: PropTypes.Requireable<string>;
         max: PropTypes.Requireable<Date>;
@@ -3157,6 +3199,7 @@ export declare class MultiViewCalendarWithoutContext extends React_2.Component<M
         value: PropTypes.Requireable<any>;
         views: (props: MultiViewCalendarProps, propName: keyof MultiViewCalendarProps<any>, componentName: string) => Error | null;
         weekNumber: PropTypes.Requireable<boolean>;
+        showOtherMonthDays: PropTypes.Requireable<boolean>;
         dir: PropTypes.Requireable<string>;
     };
     /**
@@ -3170,10 +3213,12 @@ export declare class MultiViewCalendarWithoutContext extends React_2.Component<M
         defaultActiveView: ActiveView;
         defaultValue: null;
         topView: ActiveView;
+        weekDaysFormat: string;
         tabIndex: number;
         bottomView: ActiveView;
         views: number;
         allowReverse: boolean;
+        showOtherMonthDays: boolean;
     };
     protected dates: any[];
     private lastView;
@@ -3931,7 +3976,7 @@ export declare class TimePickerWithoutContext extends React_2.Component<TimePick
             second: PropTypes.Requireable<string>;
             timeZoneName: PropTypes.Requireable<string>;
         }> | null | undefined>>;
-        formatPlaceholder: PropTypes.Requireable<NonNullable<"narrow" | "short" | "wide" | "formatPattern" | PropTypes.InferProps<{
+        formatPlaceholder: PropTypes.Requireable<NonNullable<"short" | "narrow" | "wide" | "formatPattern" | PropTypes.InferProps<{
             year: PropTypes.Requireable<string>;
             month: PropTypes.Requireable<string>;
             day: PropTypes.Requireable<string>;
@@ -4281,11 +4326,13 @@ export declare class ViewList extends React_2.Component<ViewListProps, ViewListS
         value: PropTypes.Requireable<Date>;
         viewHeight: PropTypes.Requireable<number>;
         viewOffset: PropTypes.Requireable<number>;
+        weekDaysFormat: PropTypes.Requireable<string>;
         tabIndex: PropTypes.Requireable<number>;
     };
     static defaultProps: {
         take: number;
         showWeekNumbers: boolean;
+        weekDaysFormat: string;
         smoothScroll: boolean;
     };
     virtualization: Virtualization | null;
@@ -4302,6 +4349,7 @@ export declare class ViewList extends React_2.Component<ViewListProps, ViewListS
     private shouldScroll;
     private indexToScroll?;
     private lastFocus;
+    private weekService;
     get element(): HTMLDivElement | null;
     protected get weekNames(): string[];
     protected get weekNumber(): boolean;
@@ -4353,11 +4401,14 @@ declare interface ViewListProps {
     showWeekNumbers?: boolean;
     smoothScroll?: boolean;
     take?: number;
+    weekDaysFormat?: WeekDaysFormat;
     value: Date | null;
     viewHeight?: number;
     viewOffset?: number;
     weekCell?: React_2.ComponentType<CalendarWeekCellProps>;
+    showOtherMonthDays?: boolean;
     headerTitle?: React_2.ComponentType<CalendarHeaderTitleProps>;
+    header?: React_2.ComponentType<CalendarHeaderProps>;
     shouldScroll?: () => boolean;
     tabIndex?: number;
 }
@@ -4488,13 +4539,18 @@ declare interface VirtualizationProps {
     children?: React_2.ReactNode;
 }
 
+/**
+ * Specifies the possible format options for the displayed Calendar week days' names.
+ */
+declare type WeekDaysFormat = 'short' | 'narrow' | 'abbreviated';
+
 /**
  * @hidden
  */
 export declare class WeekNamesService {
     private intl;
     constructor(intl: IntlService);
-    getWeekNames(includeWeekNumber?: boolean): string[];
+    getWeekNames(includeWeekNumber?: boolean, weekDaysFormat?: WeekDaysFormat): string[];
 }
 
 /**

package/package-metadata.mjs

@@ -10,7 +10,7 @@ const e = {
   name: "@progress/kendo-react-dateinputs",
   productName: "KendoReact",
   productCodes: ["KENDOUIREACT", "KENDOUICOMPLETE"],
-  publishDate: 1712928355,
+  publishDate: 1715351737,
   version: "",
   licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning"
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-react-dateinputs",
-  "version": "7.5.0-develop.2",
+  "version": "7.5.0-develop.20",
   "description": "React DateInput is a perfect input component for handling quick and efficient date values. KendoReact Date Inputs package",
   "author": "Progress",
   "license": "SEE LICENSE IN LICENSE.md",
@@ -24,13 +24,13 @@
   "peerDependencies": {
     "@progress/kendo-date-math": "^1.4.0",
     "@progress/kendo-licensing": "^1.3.4",
-    "@progress/kendo-react-buttons": "7.5.0-develop.2",
-    "@progress/kendo-react-common": "7.5.0-develop.2",
-    "@progress/kendo-react-intl": "7.5.0-develop.2",
-    "@progress/kendo-react-labels": "7.5.0-develop.2",
-    "@progress/kendo-react-layout": "7.5.0-develop.2",
-    "@progress/kendo-react-popup": "7.5.0-develop.2",
-    "@progress/kendo-svg-icons": "^2.1.0",
+    "@progress/kendo-react-buttons": "7.5.0-develop.20",
+    "@progress/kendo-react-common": "7.5.0-develop.20",
+    "@progress/kendo-react-intl": "7.5.0-develop.20",
+    "@progress/kendo-react-labels": "7.5.0-develop.20",
+    "@progress/kendo-react-layout": "7.5.0-develop.20",
+    "@progress/kendo-react-popup": "7.5.0-develop.20",
+    "@progress/kendo-svg-icons": "^3.0.0",
     "react": "^16.8.2 || ^17.0.0 || ^18.0.0",
     "react-dom": "^16.8.2 || ^17.0.0 || ^18.0.0"
   },

package/virtualization/Virtualization.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("react"),s=require("prop-types"),m=require("@progress/kendo-react-common"),w=require("./services/RowHeightService.js"),H=require("./services/ScrollerService.js");function P(r){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const t in r)if(t!=="default"){const i=Object.getOwnPropertyDescriptor(r,t);Object.defineProperty(e,t,i.get?i:{enumerable:!0,get:()=>r[t]})}}return e.default=r,Object.freeze(e)}const h=P(b),T=(r,e,t)=>Math.min(Math.abs(e-r),t),O=17,A=10,x={1:r=>e=>e+r,0:r=>e=>e-r},I={1:r=>e=>Math.min(e,r),0:r=>e=>Math.max(e,r)},C={1:r=>e=>e<r,0:r=>e=>e>r},c=class c extends h.Component{constructor(e){super(e),this.rowHeightService=null,this.scrollContainer=null,this.lastDirection=null,this.lastTotal=0,this.lastTake=0,this.animationInProgress=!1,this.restrictScroll=!1,this.scrollTo=t=>{const i=this.direction==="vertical"?"scrollTop":"scrollLeft";if(!this.scrollContainer)return;const o=this.scrollContainer[i];this.restrictScroll&&i==="scrollTop"&&(!Number.isInteger(o)||!Number.isInteger(t))&&Math.abs(o-t)<A||(this.scrollContainer[i]=t)},this.scrollToIndex=t=>{this.animationInProgress=!1,this.rowHeightService&&this.scrollTo(this.rowHeightService.offset(t))},this.animateToIndex=t=>{if(!this.rowHeightService||!window)return;window.cancelAnimationFrame(this.cancelAnimation);const i=this.rowHeightService.offset(t),o=this.getContainerScrollDirection(i);let{start:n,end:l}=this.scrollRange(i,o);if(n===l)return;const f=this.scrollStep(n,l),a=x[o](f),u=I[o](l),g=C[o](a(l)),p=v=>{this.animationInProgress=!0;const S=a(v);this.scrollTo(u(S)),g(S)?this.cancelAnimation=window.requestAnimationFrame(()=>{p(S)}):this.animationInProgress=!1};this.cancelAnimation=window.requestAnimationFrame(()=>{p(n)})},this.scrollToBottom=()=>{this.rowHeightService&&this.scrollTo(this.rowHeightService.totalHeight()+this.props.bottomOffset)},this.scrollStep=(t,i)=>{const o=this.props.scrollDuration||c.defaultProps.scrollDuration;return Math.abs(i-t)/(o/O)},this.scrollRange=(t,i)=>{const o=this.containerScrollPosition;if(parseInt(`${t}`,10)===parseInt(`${o}`,10))return{start:t,end:t};const n=this.containerMaxScroll(),l=i===0?1:-1,f=T(o,t,this.props.maxScrollDifference||0),a=Math.min(t,n);return{start:Math.min(Math.max(a+l*f,0),n),end:a}},this.containerMaxScroll=()=>this.containerScrollSize-this.containerOffsetSize,this.getContainerScrollDirection=t=>t<this.containerScrollPosition?0:1,this.initServices=(t=this.props)=>{const i=this.direction==="vertical"?t.itemHeight:t.itemWidth;i!==void 0&&(this.rowHeightService=new w.RowHeightService(t.total,i,0),this.scrollerService.create(this.rowHeightService,t.skip,t.take,t.total,t.topOffset,this.scrollOffsetSize,this.direction))},this.getContainerProperty=t=>this.scrollContainer?this.scrollContainer[t]:0,this.handleScroll=t=>{if(!this.scrollContainer||!this.rowHeightService)return;const i=t.target;this.scrollerService.onScroll({scrollLeft:i.scrollLeft,scrollTop:i.scrollTop,offsetHeight:i.offsetHeight,offsetWidth:i.offsetWidth});const o=this.rowHeightService.index(this.containerScrollPosition-this.props.topOffset),{onScrollAction:n}=this.props,l={index:o,target:i,scrollAction:this.scrollAction,pageAction:this.pageAction,animationInProgress:this.animationInProgress};this.props.onScroll&&this.props.onScroll.call(void 0,t),n&&n.call(void 0,l),this.scrollAction=void 0,this.pageAction=void 0},this.handleScrollAction=t=>{this.scrollAction=t},this.handlePageAction=t=>{this.pageAction=t},this.scrollerService=new H.ScrollerService(this.handleScrollAction,this.handlePageAction),this.restrictScroll=Number.parseFloat(h.version)>17}get element(){return this.scrollContainer}get containerOffsetSize(){return this.getContainerProperty(this.direction==="vertical"?"offsetHeight":"offsetWidth")}get containerScrollSize(){return this.getContainerProperty(this.direction==="vertical"?"scrollHeight":"scrollWidth")}get containerScrollPosition(){return this.getContainerProperty(this.direction==="vertical"?"scrollTop":"scrollLeft")}get direction(){return this.props.direction!==void 0?this.props.direction:c.defaultProps.direction}get scrollOffsetSize(){return this.props.scrollOffsetSize!==void 0?this.props.scrollOffsetSize:c.defaultProps.scrollOffsetSize}activeIndex(){return this.itemIndex(Math.ceil(this.containerScrollPosition))}itemIndex(e){return this.rowHeightService?this.rowHeightService.index(e):0}itemOffset(e){return this.rowHeightService?this.rowHeightService.offset(e):0}isIndexVisible(e){if(!this.rowHeightService)return!1;const t=this.containerScrollPosition,i=t+this.containerOffsetSize,o=this.rowHeightService.offset(e),n=o+this.rowHeightService.height(e);return o>=t&&n<=i}isListScrolled(e){return this.rowHeightService?this.containerScrollPosition!==this.rowHeightService.offset(e):!1}componentDidMount(){const{onMount:e}=this.props;e&&e.call(void 0,this)}render(){(this.lastTotal!==this.props.total||this.lastDirection!==this.direction||this.lastTake!==this.props.take)&&(this.initServices(),this.lastTotal=this.props.total,this.lastDirection=this.direction,this.lastTake=this.props.take);const e=`${(this.rowHeightService?this.rowHeightService.totalHeight():0)+this.props.bottomOffset}`,t=this.direction==="vertical"?{height:`${e}px`}:{width:`${e}px`},i=m.classNames("k-content k-scrollable",{"k-scrollable-horizontal":this.direction==="horizontal"},this.props.className),o=m.classNames("k-scrollable-placeholder",{"k-scrollable-horizontal-placeholder":this.direction==="horizontal"});return h.createElement("div",{ref:n=>{this.scrollContainer=n},onScroll:this.handleScroll,className:i,tabIndex:this.props.tabIndex,role:this.props.role},this.props.children,h.createElement("div",{style:t,className:o}))}};c.propTypes={bottomOffset:s.number.isRequired,className:s.string,direction:s.oneOf(["horizontal","vertical"]),forceScroll:s.bool,itemHeight:s.number,itemWidth:s.number,maxScrollDifference:s.number,onScroll:s.func,onScrollAction:s.func,scrollDuration:s.number,scrollOffsetSize:s.number,skip:s.number.isRequired,tabIndex:s.number,take:s.number.isRequired,topOffset:s.number.isRequired,total:s.number.isRequired,role:s.string},c.defaultProps={direction:"vertical",forceScroll:!1,scrollOffsetSize:0,maxScrollDifference:100,scrollDuration:100};let d=c;exports.Virtualization=d;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("react"),s=require("prop-types"),d=require("@progress/kendo-react-common"),w=require("./services/ScrollerService.js");function H(r){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const t in r)if(t!=="default"){const i=Object.getOwnPropertyDescriptor(r,t);Object.defineProperty(e,t,i.get?i:{enumerable:!0,get:()=>r[t]})}}return e.default=r,Object.freeze(e)}const h=H(b),P=(r,e,t)=>Math.min(Math.abs(e-r),t),T=17,O=10,A={1:r=>e=>e+r,0:r=>e=>e-r},x={1:r=>e=>Math.min(e,r),0:r=>e=>Math.max(e,r)},I={1:r=>e=>e<r,0:r=>e=>e>r},c=class c extends h.Component{constructor(e){super(e),this.rowHeightService=null,this.scrollContainer=null,this.lastDirection=null,this.lastTotal=0,this.lastTake=0,this.animationInProgress=!1,this.restrictScroll=!1,this.scrollTo=t=>{const i=this.direction==="vertical"?"scrollTop":"scrollLeft";if(!this.scrollContainer)return;const o=this.scrollContainer[i];this.restrictScroll&&i==="scrollTop"&&(!Number.isInteger(o)||!Number.isInteger(t))&&Math.abs(o-t)<O||(this.scrollContainer[i]=t)},this.scrollToIndex=t=>{this.animationInProgress=!1,this.rowHeightService&&this.scrollTo(this.rowHeightService.offset(t))},this.animateToIndex=t=>{if(!this.rowHeightService||!window)return;window.cancelAnimationFrame(this.cancelAnimation);const i=this.rowHeightService.offset(t),o=this.getContainerScrollDirection(i);let{start:n,end:l}=this.scrollRange(i,o);if(n===l)return;const f=this.scrollStep(n,l),a=A[o](f),p=x[o](l),g=I[o](a(l)),m=v=>{this.animationInProgress=!0;const S=a(v);this.scrollTo(p(S)),g(S)?this.cancelAnimation=window.requestAnimationFrame(()=>{m(S)}):this.animationInProgress=!1};this.cancelAnimation=window.requestAnimationFrame(()=>{m(n)})},this.scrollToBottom=()=>{this.rowHeightService&&this.scrollTo(this.rowHeightService.totalHeight()+this.props.bottomOffset)},this.scrollStep=(t,i)=>{const o=this.props.scrollDuration||c.defaultProps.scrollDuration;return Math.abs(i-t)/(o/T)},this.scrollRange=(t,i)=>{const o=this.containerScrollPosition;if(parseInt(`${t}`,10)===parseInt(`${o}`,10))return{start:t,end:t};const n=this.containerMaxScroll(),l=i===0?1:-1,f=P(o,t,this.props.maxScrollDifference||0),a=Math.min(t,n);return{start:Math.min(Math.max(a+l*f,0),n),end:a}},this.containerMaxScroll=()=>this.containerScrollSize-this.containerOffsetSize,this.getContainerScrollDirection=t=>t<this.containerScrollPosition?0:1,this.initServices=(t=this.props)=>{const i=this.direction==="vertical"?t.itemHeight:t.itemWidth;i!==void 0&&(this.rowHeightService=new d.RowHeightService(t.total,i,0),this.scrollerService.create(this.rowHeightService,t.skip,t.take,t.total,t.topOffset,this.scrollOffsetSize,this.direction))},this.getContainerProperty=t=>this.scrollContainer?this.scrollContainer[t]:0,this.handleScroll=t=>{if(!this.scrollContainer||!this.rowHeightService)return;const i=t.target;this.scrollerService.onScroll({scrollLeft:i.scrollLeft,scrollTop:i.scrollTop,offsetHeight:i.offsetHeight,offsetWidth:i.offsetWidth});const o=this.rowHeightService.index(this.containerScrollPosition-this.props.topOffset),{onScrollAction:n}=this.props,l={index:o,target:i,scrollAction:this.scrollAction,pageAction:this.pageAction,animationInProgress:this.animationInProgress};this.props.onScroll&&this.props.onScroll.call(void 0,t),n&&n.call(void 0,l),this.scrollAction=void 0,this.pageAction=void 0},this.handleScrollAction=t=>{this.scrollAction=t},this.handlePageAction=t=>{this.pageAction=t},this.scrollerService=new w.ScrollerService(this.handleScrollAction,this.handlePageAction),this.restrictScroll=Number.parseFloat(h.version)>17}get element(){return this.scrollContainer}get containerOffsetSize(){return this.getContainerProperty(this.direction==="vertical"?"offsetHeight":"offsetWidth")}get containerScrollSize(){return this.getContainerProperty(this.direction==="vertical"?"scrollHeight":"scrollWidth")}get containerScrollPosition(){return this.getContainerProperty(this.direction==="vertical"?"scrollTop":"scrollLeft")}get direction(){return this.props.direction!==void 0?this.props.direction:c.defaultProps.direction}get scrollOffsetSize(){return this.props.scrollOffsetSize!==void 0?this.props.scrollOffsetSize:c.defaultProps.scrollOffsetSize}activeIndex(){return this.itemIndex(Math.ceil(this.containerScrollPosition))}itemIndex(e){return this.rowHeightService?this.rowHeightService.index(e):0}itemOffset(e){return this.rowHeightService?this.rowHeightService.offset(e):0}isIndexVisible(e){if(!this.rowHeightService)return!1;const t=this.containerScrollPosition,i=t+this.containerOffsetSize,o=this.rowHeightService.offset(e),n=o+this.rowHeightService.height(e);return o>=t&&n<=i}isListScrolled(e){return this.rowHeightService?this.containerScrollPosition!==this.rowHeightService.offset(e):!1}componentDidMount(){const{onMount:e}=this.props;e&&e.call(void 0,this)}render(){(this.lastTotal!==this.props.total||this.lastDirection!==this.direction||this.lastTake!==this.props.take)&&(this.initServices(),this.lastTotal=this.props.total,this.lastDirection=this.direction,this.lastTake=this.props.take);const e=`${(this.rowHeightService?this.rowHeightService.totalHeight():0)+this.props.bottomOffset}`,t=this.direction==="vertical"?{height:`${e}px`}:{width:`${e}px`},i=d.classNames("k-content k-scrollable",{"k-scrollable-horizontal":this.direction==="horizontal"},this.props.className),o=d.classNames("k-scrollable-placeholder",{"k-scrollable-horizontal-placeholder":this.direction==="horizontal"});return h.createElement("div",{ref:n=>{this.scrollContainer=n},onScroll:this.handleScroll,className:i,tabIndex:this.props.tabIndex,role:this.props.role},this.props.children,h.createElement("div",{style:t,className:o}))}};c.propTypes={bottomOffset:s.number.isRequired,className:s.string,direction:s.oneOf(["horizontal","vertical"]),forceScroll:s.bool,itemHeight:s.number,itemWidth:s.number,maxScrollDifference:s.number,onScroll:s.func,onScrollAction:s.func,scrollDuration:s.number,scrollOffsetSize:s.number,skip:s.number.isRequired,tabIndex:s.number,take:s.number.isRequired,topOffset:s.number.isRequired,total:s.number.isRequired,role:s.string},c.defaultProps={direction:"vertical",forceScroll:!1,scrollOffsetSize:0,maxScrollDifference:100,scrollDuration:100};let u=c;exports.Virtualization=u;

package/virtualization/Virtualization.mjs

@@ -8,8 +8,7 @@
 "use client";
 import * as a from "react";
 import o from "prop-types";
-import { classNames as m } from "@progress/kendo-react-common";
-import { RowHeightService as w } from "./services/RowHeightService.mjs";
+import { RowHeightService as w, classNames as m } from "@progress/kendo-react-common";
 import { ScrollerService as b } from "./services/ScrollerService.mjs";
 const H = (s, i, t) => Math.min(Math.abs(i - s), t), P = 17, T = 10, x = {
   1: (s) => (i) => i + s,
@@ -38,15 +37,15 @@ const H = (s, i, t) => Math.min(Math.abs(i - s), t), P = 17, T = 10, x = {
       let { start: n, end: l } = this.scrollRange(e, r);
       if (n === l)
         return;
-      const f = this.scrollStep(n, l), h = x[r](f), p = A[r](l), u = I[r](h(l)), d = (v) => {
+      const f = this.scrollStep(n, l), h = x[r](f), d = A[r](l), u = I[r](h(l)), p = (v) => {
         this.animationInProgress = !0;
         const S = h(v);
-        this.scrollTo(p(S)), u(S) ? this.cancelAnimation = window.requestAnimationFrame(() => {
-          d(S);
+        this.scrollTo(d(S)), u(S) ? this.cancelAnimation = window.requestAnimationFrame(() => {
+          p(S);
         }) : this.animationInProgress = !1;
       };
       this.cancelAnimation = window.requestAnimationFrame(() => {
-        d(n);
+        p(n);
       });
     }, this.scrollToBottom = () => {
       this.rowHeightService && this.scrollTo(this.rowHeightService.totalHeight() + this.props.bottomOffset);

package/virtualization/services/RowHeightService.js

@@ -1,8 +0,0 @@
-/**
- * @license
- *-------------------------------------------------------------------------------------------
- * Copyright © 2024 Progress Software Corporation. All rights reserved.
- * Licensed under commercial license. See LICENSE.md in the package root for more information
- *-------------------------------------------------------------------------------------------
- */
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=(i,t,e)=>[...i.slice(0,t+1),...i.slice(t+1).map(s=>s+e)];class g{constructor(t=0,e,s){this.total=t,this.rowHeight=e,this.detailRowHeight=s,this.offsets=[],this.heights=[];let h=0;for(let f=0;f<t;f++)this.offsets.push(h),h+=e,this.heights.push(e)}height(t){return this.heights[t]}expandDetail(t){this.height(t)===this.rowHeight&&this.updateRowHeight(t,this.detailRowHeight)}collapseDetail(t){this.height(t)>this.rowHeight&&this.updateRowHeight(t,this.detailRowHeight*-1)}index(t){for(let e=0;e<this.offsets.length;e++){if(t===this.offsets[e])return e;if(t<this.offsets[e])return e-1}return this.total-1}offset(t){return this.offsets[t]}totalHeight(){return this.heights.reduce((t,e)=>t+e,0)}updateRowHeight(t,e){this.heights[t]+=e,this.offsets=o(this.offsets,t,e)}}exports.RowHeightService=g;