@progress/kendo-react-dateinputs 7.5.0-develop.14 → 7.5.0-develop.15

package/calendar/components/MultiViewCalendar.mjs

@@ -10,20 +10,20 @@ import * as d from "react";
 import t from "prop-types";
 import { provideIntlService as q, provideLocalizationService as H, registerForIntl as j, registerForLocalization as G } from "@progress/kendo-react-intl";
 import { Keys as k, classNames as X, createPropsContext as J, withIdHOC as Q, withPropsContext as Z } from "@progress/kendo-react-common";
-import { isEqualDate as O, cloneDate as u, getDate as f, firstDayOfMonth as W, lastDayOfMonth as ee } from "@progress/kendo-date-math";
-import { Button as T } from "@progress/kendo-react-buttons";
-import { chevronRightIcon as M, chevronLeftIcon as N } from "@progress/kendo-svg-icons";
+import { isEqualDate as A, cloneDate as u, getDate as f, firstDayOfMonth as W, lastDayOfMonth as ee } from "@progress/kendo-date-math";
+import { Button as M } from "@progress/kendo-react-buttons";
+import { chevronRightIcon as T, chevronLeftIcon as N } from "@progress/kendo-svg-icons";
 import { Action as y } from "../models/NavigationAction.mjs";
 import { CalendarViewEnum as E } from "../models/CalendarViewEnum.mjs";
 import { EMPTY_SELECTIONRANGE as Y } from "../models/SelectionRange.mjs";
 import { Header as te } from "./Header.mjs";
-import { dateInRange as R, getToday as C, viewInRange as P, nullable as D, MIN_DATE as se, MAX_DATE as ie, isInRange as A } from "../../utils.mjs";
+import { dateInRange as R, getToday as C, viewInRange as P, nullable as D, MIN_DATE as se, MAX_DATE as ie, isInRange as I } from "../../utils.mjs";
 import { prevView as S, messages as B, nextView as L } from "../../messages/index.mjs";
 import { BusViewService as ae } from "../services/BusViewService.mjs";
 import { NavigationService as ne } from "../services/NavigationService.mjs";
 import { HorizontalViewList as x } from "./HorizontalViewList.mjs";
-import { TodayCommand as re } from "./TodayCommand.mjs";
-const I = (o = m.defaultProps.min, i = m.defaultProps.max, a) => a instanceof Date && !Array.isArray(a) && A(f(a), o, i) ? f(a) : null, _ = (o = m.defaultProps.min, i = m.defaultProps.max, a) => Array.isArray(a) ? a.filter((h) => A(h, o, i)).map((h) => f(h)) : null, K = (o) => typeof o == "object" && !(o instanceof Date) && o !== null && !Array.isArray(o) ? o : Y, z = (o, i, a) => o || i && i[0] || a && a.start, le = (o, i) => o.start === null && i === null ? "start" : o.end === null ? "end" : "start", c = class c extends d.Component {
+import { TodayCommand as oe } from "./TodayCommand.mjs";
+const O = (l = p.defaultProps.min, i = p.defaultProps.max, a) => a instanceof Date && !Array.isArray(a) && I(f(a), l, i) ? f(a) : null, _ = (l = p.defaultProps.min, i = p.defaultProps.max, a) => Array.isArray(a) ? a.filter((h) => I(h, l, i)).map((h) => f(h)) : null, K = (l) => typeof l == "object" && !(l instanceof Date) && l !== null && !Array.isArray(l) ? l : Y, z = (l, i, a) => l || i && i[0] || a && a.start, re = (l, i) => l.start === null && i === null ? "start" : l.end === null ? "end" : "start", c = class c extends d.Component {
   constructor(i) {
     super(i), this.dates = [], this.selectedDate = null, this.selectedMultiple = null, this.selectedRange = Y, this._focusedDate = /* @__PURE__ */ new Date(), this.cellUID = this.props.id + "-cell-uid", this.activeRangeEnd = "start", this._element = null, this.intl = null, this.localization = null, this.service = null, this.calendarViewList = null, this.isActive = !1, this.calculateFocusFromValue = !0, this.focus = () => {
       this._element && this._element.focus();
@@ -31,8 +31,8 @@ const I = (o = m.defaultProps.min, i = m.defaultProps.max, a) => a instanceof Da
       start: e.start,
       end: e.end === null && e.start !== null && this.isActive ? s : e.end
     }), this.generateRange = (e, s) => {
-      const { end: l, start: r } = s, p = s.start !== null && e.getTime() <= s.start.getTime();
-      return !this.props.allowReverse && p ? { start: e, end: this.selectedRange.start } : this.activeRange !== "end" ? { start: e, end: l } : { start: r || this.selectedDate, end: e };
+      const { end: r, start: o } = s, m = s.start !== null && e.getTime() <= s.start.getTime();
+      return !this.props.allowReverse && m ? { start: e, end: this.selectedRange.start } : this.activeRange !== "end" ? { start: e, end: r } : { start: o || this.selectedDate, end: e };
     }, this.canNavigate = (e) => {
       if (!this.service)
         return !1;
@@ -40,11 +40,11 @@ const I = (o = m.defaultProps.min, i = m.defaultProps.max, a) => a instanceof Da
       return this.min <= s && s <= this.max || this.service.isInSameView(s, this.min) || this.service.isInSameView(s, this.max);
     }, this.navigate = (e, s) => {
       this.calculateFocusFromValue = !1;
-      const l = this.move(e, s);
-      this.setState({ navigateDate: l, focusedDate: l });
+      const r = this.move(e, s);
+      this.setState({ navigateDate: r, focusedDate: r });
     }, this.move = (e, s) => this.clampDate(this.service.move(s, e)), this.clampDate = (e) => R(e, this.min, this.max), this.shouldAutoCorrect = (e, s) => {
-      const { end: l, start: r } = s;
-      return this.activeRange !== "end" ? l !== null && e > l : r !== null && e < r;
+      const { end: r, start: o } = s;
+      return this.activeRange !== "end" ? r !== null && e > r : o !== null && e < o;
     }, this.handleCellEnter = (e) => {
       this.props.mode === "range" && (this.calculateFocusFromValue = !1, this.setState({
         focusedDate: e
@@ -78,12 +78,12 @@ const I = (o = m.defaultProps.min, i = m.defaultProps.max, a) => a instanceof Da
     }, this.handleNextButtonClick = () => {
       this.navigate(y.NextView, this.focusedDate);
     }, this.handleKeyDown = (e) => {
-      const { keyCode: l, ctrlKey: r, metaKey: p } = e;
-      if (l === 84) {
+      const { keyCode: r, ctrlKey: o, metaKey: m } = e;
+      if (r === 84) {
         const n = C();
         this.calculateFocusFromValue = !1, this.setState({ focusedDate: n, navigateDate: n });
       }
-      if ((r || p) && (l === k.left && this.handlePrevButtonClick(), l === k.right && this.handleNextButtonClick()), l === k.enter) {
+      if ((o || m) && (r === k.left && this.handlePrevButtonClick(), r === k.right && this.handleNextButtonClick()), r === k.enter) {
         const n = {
           syntheticEvent: e,
           nativeEvent: e.nativeEvent,
@@ -103,7 +103,7 @@ const I = (o = m.defaultProps.min, i = m.defaultProps.max, a) => a instanceof Da
           this.min,
           this.max
         );
-        if (O(this.focusedDate, n))
+        if (A(this.focusedDate, n))
           return;
         this.dates && this.service && !this.service.isInArray(n, this.dates) && this.setState({ navigateDate: n }), this.calculateFocusFromValue = !1, this.setState({ focusedDate: n });
       }
@@ -111,10 +111,10 @@ const I = (o = m.defaultProps.min, i = m.defaultProps.max, a) => a instanceof Da
     }, this.handleViewChange = ({ view: e }) => {
       this.calculateFocusFromValue = !1, this.setState((s) => ({ activeView: e, navigateDate: s.focusedDate }));
     }, this.handleDateChange = (e) => {
-      const s = u(e.value), l = this.bus.canMoveDown(this.state.activeView);
+      const s = u(e.value), r = this.bus.canMoveDown(this.state.activeView);
       if (this.props.disabled)
         return;
-      if (l)
+      if (r)
         if (e.isTodayClick)
           this.bus.moveToBottom(this.state.activeView);
         else {
@@ -122,43 +122,43 @@ const I = (o = m.defaultProps.min, i = m.defaultProps.max, a) => a instanceof Da
           return;
         }
       this.calculateFocusFromValue = !0;
-      let r;
+      let o;
       switch (this.props.mode) {
         case "single":
-          r = u(e.value);
+          o = u(e.value);
           break;
         case "multiple":
           if (Array.isArray(this.selectedMultiple)) {
             const n = this.selectedMultiple.slice();
             let v = -1;
             n.forEach((U, $) => {
-              O(U, e.value) && (v = $);
-            }), v !== -1 ? n.splice(v, 1) : n.push(u(e.value)), r = n.slice();
+              A(U, e.value) && (v = $);
+            }), v !== -1 ? n.splice(v, 1) : n.push(u(e.value)), o = n.slice();
           } else
-            this.selectedDate ? r = [u(this.selectedDate), u(e.value)] : r = [u(e.value)];
+            this.selectedDate ? o = [u(this.selectedDate), u(e.value)] : o = [u(e.value)];
           break;
         case "range": {
-          r = this.selectedRange.start !== null && this.selectedRange.end !== null && this.activeRange === "start" ? this.clampRange(e.value) : this.generateRange(e.value, this.selectedRange), this.activeRangeEnd = this.activeRange !== "end" ? "end" : "start";
+          o = this.selectedRange.start !== null && this.selectedRange.end !== null && this.activeRange === "start" ? this.clampRange(e.value) : this.generateRange(e.value, this.selectedRange), this.activeRangeEnd = this.activeRange !== "end" ? "end" : "start";
           break;
         }
         default:
-          r = u(e.value);
+          o = u(e.value);
           break;
       }
-      this.valueDuringOnChange = r, e.isTodayClick && this.setState({ navigateDate: s }), this.setState({ value: r, focusedDate: s }), this.valueDuringOnChange = r;
-      const { onChange: p } = this.props;
-      if (p) {
+      this.valueDuringOnChange = o, e.isTodayClick && this.setState({ navigateDate: s }), this.setState({ value: o, focusedDate: s }), this.valueDuringOnChange = o;
+      const { onChange: m } = this.props;
+      if (m) {
         const n = {
           syntheticEvent: e.syntheticEvent,
           nativeEvent: e.nativeEvent,
-          value: r,
+          value: o,
           target: this
         };
-        p.call(void 0, n);
+        m.call(void 0, n);
       }
       this.valueDuringOnChange = void 0;
     };
-    const a = i.value !== void 0 ? i.value : i.defaultValue || c.defaultProps.defaultValue, h = I(this.min, this.max, a), g = _(this.min, this.max, a), b = K(a), F = z(h, g, b), w = P(
+    const a = i.value !== void 0 ? i.value : i.defaultValue || c.defaultProps.defaultValue, h = O(this.min, this.max, a), g = _(this.min, this.max, a), b = K(a), F = z(h, g, b), w = P(
       E[i.defaultActiveView],
       this.bottomView,
       this.topView
@@ -172,7 +172,7 @@ const I = (o = m.defaultProps.min, i = m.defaultProps.max, a) => a instanceof Da
       activeView: w,
       focusedDate: V,
       navigateDate: V
-    }, this.activeRangeEnd = le(b, h), this.bus = new ae(this.handleViewChange), this.navigation = new ne(this.bus), this.calculateFocusFromValue = !1, this.lastView = w, this.lastViewsCount = this.props.views || x.defaultProps.views;
+    }, this.activeRangeEnd = re(b, h), this.bus = new ae(this.handleViewChange), this.navigation = new ne(this.bus), this.calculateFocusFromValue = !1, this.lastView = w, this.lastViewsCount = this.props.views || x.defaultProps.views;
   }
   get wrapperID() {
     return this.props.id + "-wrapper-id";
@@ -214,7 +214,7 @@ const I = (o = m.defaultProps.min, i = m.defaultProps.max, a) => a instanceof Da
     return this.props.activeRangeEnd !== void 0 ? this.props.activeRangeEnd : this.activeRangeEnd;
   }
   get todayIsInRange() {
-    return A(C(), f(this.min), f(this.max));
+    return I(C(), f(this.min), f(this.max));
   }
   /**
    * @hidden
@@ -227,7 +227,7 @@ const I = (o = m.defaultProps.min, i = m.defaultProps.max, a) => a instanceof Da
    */
   componentDidUpdate() {
     this.calendarViewList && (this.isActive ? this.calendarViewList.focusActiveDate : this.calendarViewList.blurActiveDate)();
-    const i = I(this.min, this.max, this.value);
+    const i = O(this.min, this.max, this.value);
     this.calculateFocusFromValue = !!(this.selectedDate && i && this.selectedDate.getTime() && i.getTime()), this.lastView = this.state.activeView, this.lastViewsCount = this.props.views || x.defaultProps.views;
   }
   /**
@@ -236,7 +236,7 @@ const I = (o = m.defaultProps.min, i = m.defaultProps.max, a) => a instanceof Da
   render() {
     this.props._ref && this.props._ref(this), this.intl = q(this), this.localization = H(this), this.bus.configure(this.bottomView, this.topView);
     const i = P(this.state.activeView, this.bottomView, this.topView);
-    this.service = this.bus.service(i, this.intl), this.selectedDate = I(this.min, this.max, this.value), this.selectedMultiple = _(this.min, this.max, this.value), this.selectedRange = K(this.value);
+    this.service = this.bus.service(i, this.intl), this.selectedDate = O(this.min, this.max, this.value), this.selectedMultiple = _(this.min, this.max, this.value), this.selectedRange = K(this.value);
     const a = z(this.selectedDate, this.selectedMultiple, this.selectedRange);
     this._focusedDate = R(
       this.calculateFocusFromValue && a !== null ? a : this.state.focusedDate,
@@ -249,8 +249,8 @@ const I = (o = m.defaultProps.min, i = m.defaultProps.max, a) => a instanceof Da
         "k-disabled": this.props.disabled
       },
       this.props.className
-    ), g = this.rangeWithFocused(this.selectedRange, this.focusedDate), b = this.localization.toLanguageString(S, B[S]), F = this.localization.toLanguageString(L, B[L]), w = !this.canNavigate(y.PrevView), V = !this.canNavigate(y.NextView), e = { "aria-disabled": w }, s = { "aria-disabled": V }, l = this.lastView !== i, r = this.dates && this.isInMonth(this.state.navigateDate, this.dates[0]), p = this.lastViewsCount !== this.props.views;
-    (!r || l || p) && (this.dates = this.service.datesList(
+    ), g = this.rangeWithFocused(this.selectedRange, this.focusedDate), b = this.localization.toLanguageString(S, B[S]), F = this.localization.toLanguageString(L, B[L]), w = !this.canNavigate(y.PrevView), V = !this.canNavigate(y.NextView), e = { "aria-disabled": w }, s = { "aria-disabled": V }, r = this.lastView !== i, o = this.dates && this.isInMonth(this.state.navigateDate, this.dates[0]), m = this.lastViewsCount !== this.props.views;
+    (!o || r || m) && (this.dates = this.service.datesList(
       this.state.navigateDate,
       this.props.views || x.defaultProps.views
     ));
@@ -288,12 +288,12 @@ const I = (o = m.defaultProps.min, i = m.defaultProps.max, a) => a instanceof Da
           headerTitle: this.props.headerTitle,
           verticalView: this.props.mobileMode,
           commands: /* @__PURE__ */ d.createElement(d.Fragment, null, /* @__PURE__ */ d.createElement(
-            T,
+            M,
             {
               type: "button",
               className: "k-calendar-nav-prev",
               icon: this.isRtl ? "chevron-right" : "chevron-left",
-              svgIcon: this.isRtl ? M : N,
+              svgIcon: this.isRtl ? T : N,
               fillMode: "flat",
               title: b,
               disabled: w,
@@ -301,7 +301,7 @@ const I = (o = m.defaultProps.min, i = m.defaultProps.max, a) => a instanceof Da
               ...e
             }
           ), /* @__PURE__ */ d.createElement(
-            re,
+            oe,
             {
               min: this.min,
               max: this.max,
@@ -309,12 +309,12 @@ const I = (o = m.defaultProps.min, i = m.defaultProps.max, a) => a instanceof Da
               disabled: !this.todayIsInRange
             }
           ), /* @__PURE__ */ d.createElement(
-            T,
+            M,
             {
               type: "button",
               className: "k-calendar-nav-next",
               icon: this.isRtl ? "chevron-left" : "chevron-right",
-              svgIcon: this.isRtl ? N : M,
+              svgIcon: this.isRtl ? N : T,
               fillMode: "flat",
               title: F,
               disabled: V,
@@ -348,7 +348,8 @@ const I = (o = m.defaultProps.min, i = m.defaultProps.max, a) => a instanceof Da
           cell: this.props.cell,
           weekCell: this.props.weekCell,
           headerTitle: this.props.headerTitle,
-          verticalView: this.props.mobileMode
+          verticalView: this.props.mobileMode,
+          showOtherMonthDays: this.props.showOtherMonthDays
         }
       )
     );
@@ -404,6 +405,7 @@ c.displayName = "MultiViewCalendar", c.propTypes = {
     ) : null;
   },
   weekNumber: t.bool,
+  showOtherMonthDays: t.bool,
   dir: t.string
 }, c.defaultProps = {
   disabled: !1,
@@ -417,15 +419,16 @@ c.displayName = "MultiViewCalendar", c.propTypes = {
   tabIndex: 0,
   bottomView: "month",
   views: 2,
-  allowReverse: !1
+  allowReverse: !1,
+  showOtherMonthDays: !1
 };
-let m = c;
-const oe = J(), he = Q(Z(oe, m));
+let p = c;
+const le = J(), he = Q(Z(le, p));
 he.displayName = "KendoReactMultiViewCalendar";
-j(m);
-G(m);
+j(p);
+G(p);
 export {
   he as MultiViewCalendar,
-  oe as MultiViewCalendarPropsContext,
-  m as MultiViewCalendarWithoutContext
+  le as MultiViewCalendarPropsContext,
+  p as MultiViewCalendarWithoutContext
 };

package/calendar/components/TodayCommand.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 p=require("react"),s=require("prop-types"),d=require("@progress/kendo-react-intl"),m=require("@progress/kendo-react-common"),g=require("@progress/kendo-react-buttons"),l=require("@progress/kendo-date-math"),r=require("../../messages/index.js"),i=require("../../utils.js");function h(a){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(a){for(const t in a)if(t!=="default"){const c=Object.getOwnPropertyDescriptor(a,t);Object.defineProperty(e,t,c.get?c:{enumerable:!0,get:()=>a[t]})}}return e.default=a,Object.freeze(e)}const u=h(p),n=class n extends u.Component{constructor(){super(...arguments),this.localization=null,this.handleClick=e=>{if(this.todayIsInRange&&this.props.onClick){const t={syntheticEvent:e,nativeEvent:e.nativeEvent,value:i.dateInRange(i.getToday(),this.min,this.max),target:this,isTodayClick:!0};this.props.onClick.call(void 0,t)}}}get min(){return this.props.min!==void 0?this.props.min:n.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:n.defaultProps.max}get todayIsInRange(){return i.isInRange(i.getToday(),l.getDate(this.min),l.getDate(this.max))}render(){this.localization=d.provideLocalizationService(this);const e=this.localization.toLanguageString(r.today,r.messages[r.today]),t=m.classNames("k-calendar-nav-today",{"k-disabled":this.props.disabled});return u.createElement(g.Button,{className:t,onClick:this.handleClick,tabIndex:this.props.tabIndex,fillMode:"flat",themeColor:"primary",role:"link"},e)}};n.propTypes={max:s.instanceOf(Date).isRequired,min:s.instanceOf(Date).isRequired,onClick:s.func,disabled:s.bool},n.defaultProps={min:i.MIN_DATE,max:i.MAX_DATE};let o=n;d.registerForLocalization(o);exports.TodayCommand=o;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("react"),a=require("prop-types"),d=require("@progress/kendo-react-intl"),m=require("@progress/kendo-react-common"),g=require("@progress/kendo-react-buttons"),l=require("@progress/kendo-date-math"),r=require("../../messages/index.js"),i=require("../../utils.js");function h(s){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const t in s)if(t!=="default"){const c=Object.getOwnPropertyDescriptor(s,t);Object.defineProperty(e,t,c.get?c:{enumerable:!0,get:()=>s[t]})}}return e.default=s,Object.freeze(e)}const u=h(p),n=class n extends u.Component{constructor(){super(...arguments),this.localization=null,this.handleClick=e=>{if(this.todayIsInRange&&this.props.onClick){const t={syntheticEvent:e,nativeEvent:e.nativeEvent,value:i.dateInRange(i.getToday(),this.min,this.max),target:this,isTodayClick:!0};this.props.onClick.call(void 0,t)}}}get min(){return this.props.min!==void 0?this.props.min:n.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:n.defaultProps.max}get todayIsInRange(){return i.isInRange(i.getToday(),l.getDate(this.min),l.getDate(this.max))}render(){this.localization=d.provideLocalizationService(this);const e=this.localization.toLanguageString(r.today,r.messages[r.today]),t=m.classNames("k-calendar-nav-today",{"k-disabled":this.props.disabled});return u.createElement(g.Button,{className:t,onClick:this.handleClick,tabIndex:this.props.tabIndex,fillMode:"flat",themeColor:"base",role:"link"},e)}};n.propTypes={max:a.instanceOf(Date).isRequired,min:a.instanceOf(Date).isRequired,onClick:a.func,disabled:a.bool},n.defaultProps={min:i.MIN_DATE,max:i.MAX_DATE};let o=n;d.registerForLocalization(o);exports.TodayCommand=o;

package/calendar/components/TodayCommand.mjs

@@ -53,7 +53,7 @@ const t = class t extends o.Component {
         onClick: this.handleClick,
         tabIndex: this.props.tabIndex,
         fillMode: "flat",
-        themeColor: "primary",
+        themeColor: "base",
         role: "link"
       },
       i

package/calendar/components/View.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 v=require("react"),i=require("prop-types"),p=require("@progress/kendo-date-math"),D=require("@progress/kendo-react-intl"),w=require("./CalendarCell.js"),g=require("./CalendarWeekCell.js"),k=require("../models/CalendarViewEnum.js"),m=require("../../utils.js"),b=require("../services/WeekNamesService.js");function y(l){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const e in l)if(e!=="default"){const r=Object.getOwnPropertyDescriptor(l,e);Object.defineProperty(t,e,r.get?r:{enumerable:!0,get:()=>l[e]})}}return t.default=l,Object.freeze(t)}const s=y(v),f=l=>s.createElement("td",{key:l,className:"k-calendar-td k-empty"}," "),u=class u extends s.Component{constructor(){super(...arguments),this.intl=null,this.weekService=null,this.buildWeekNumber=(t,e)=>{if(!this.firstDate(t))return f(`week-cell-${e}`);const n=this.firstDate(t),a=this.getWeekNumber(n),o=`kendo-react-calendar-week-cell-${a}`,c={className:"k-alt",value:a,firstDate:n};return this.props.weekCell?s.createElement(this.props.weekCell,{...c,key:o},a):s.createElement(g.CalendarWeekCell,{...c,key:o},a)},this.buildRow=t=>t.map((e,r)=>{if(!e)return f(r);const n={"aria-selected":e.isSelected},a=`kendo-react-calendar-cell-${e.value.getTime()}`,o={...n,...e,isDisabled:!e.isInRange,view:this.props.activeView,onClick:this.handleClick,onMouseEnter:this.handleMouseEnter,onMouseLeave:this.handleMouseLeave};return this.props.cell?s.createElement(this.props.cell,{...o,key:a},e.formattedValue):s.createElement(w.CalendarCell,{...o,key:a},e.formattedValue)}),this.firstDate=t=>{const e=this.firstWeekDateContext(t);return e?e.value:null},this.firstWeekDateContext=t=>{if(!this.weekNumber)return null;let e=0,r=t[e];for(;!r&&e<t.length;)r=t[++e];return r},this.handleClick=(t,e)=>{const{onChange:r}=this.props;if(r&&e){const n={value:p.cloneDate(t),target:this,nativeEvent:e&&e.nativeEvent,syntheticEvent:e};r.call(void 0,n)}},this.handleMouseEnter=t=>{const{onCellEnter:e}=this.props;e&&e.call(void 0,p.cloneDate(t))},this.handleMouseLeave=t=>{const{onCellLeave:e}=this.props;e&&e.call(void 0,p.cloneDate(t))}}get min(){return this.props.min}get max(){return this.props.max}get isHorizontal(){return this.props.direction==="horizontal"}get isMonthView(){return this.props.activeView===k.CalendarViewEnum.month}get weekNumber(){return!!(this.props.showWeekNumbers&&this.props.activeView===k.CalendarViewEnum.month)}get selectedDate(){return this.props.selectedDate!==void 0?this.props.selectedDate:u.defaultProps.selectedDate}render(){this.intl=D.provideIntlService(this),this.weekService=new b.WeekNamesService(this.intl);const t=this.weekService.getWeekNames(this.weekNumber,this.props.weekDaysFormat),e=this.props.service.rowLength(this.weekNumber),r=this.props.service.title(this.props.viewDate),n=m.getToday(),a=m.setTime(this.props.viewDate,n),o=this.props.service.data({cellUID:this.props.cellUID,min:this.min,max:this.max,focusedDate:this.props.focusedDate,isActiveView:!this.props.bus.canMoveDown(this.props.activeView),selectedDate:this.selectedDate,selectionRange:this.props.selectionRange,viewDate:a});return s.createElement(s.Fragment,null,this.isMonthView&&this.isHorizontal&&s.createElement("thead",{role:"rowgroup",className:"k-calendar-thead"},s.createElement("tr",{role:"row",className:"k-calendar-tr"},t.map((c,h)=>s.createElement("th",{key:h,className:"k-calendar-th"},c)))),s.createElement("tbody",{role:"rowgroup",className:"k-calendar-tbody"},!this.isHorizontal&&s.createElement("tr",{role:"presentation",className:"k-calendar-tr"},s.createElement("th",{scope:"col",colSpan:e,className:"k-calendar-caption"},r)),o.map((c,h)=>s.createElement("tr",{role:"row",className:"k-calendar-tr",key:h},this.weekNumber&&this.buildWeekNumber(c,h),this.buildRow(c)))))}getWeekNumber(t){return!this.weekNumber||!this.intl?null:p.weekInYear(t,this.intl.firstDay())}};u.propTypes={activeRangeEnd:i.oneOf(["start","end",null]),activeView:i.number.isRequired,cellUID:i.string.isRequired,direction:i.oneOf(["horizontal","vertical"]),focusedDate:i.instanceOf(Date).isRequired,max:i.instanceOf(Date).isRequired,min:i.instanceOf(Date).isRequired,onChange:i.func,selectedDate:i.oneOfType([i.instanceOf(Date),i.arrayOf(i.instanceOf(Date))]),showWeekNumbers:i.bool,viewDate:i.instanceOf(Date).isRequired},u.defaultProps={direction:"vertical",selectedDate:m.getToday(),showWeekNumbers:!1};let d=u;D.registerForIntl(d);exports.View=d;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const w=require("react"),s=require("prop-types"),p=require("@progress/kendo-date-math"),D=require("@progress/kendo-react-intl"),v=require("./CalendarCell.js"),g=require("./CalendarWeekCell.js"),k=require("../models/CalendarViewEnum.js"),m=require("../../utils.js"),b=require("../services/WeekNamesService.js");function y(o){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(o){for(const e in o)if(e!=="default"){const i=Object.getOwnPropertyDescriptor(o,e);Object.defineProperty(t,e,i.get?i:{enumerable:!0,get:()=>o[e]})}}return t.default=o,Object.freeze(t)}const r=y(w),f=o=>r.createElement("td",{key:o,className:"k-calendar-td k-empty"}," "),u=class u extends r.Component{constructor(){super(...arguments),this.intl=null,this.weekService=null,this.buildWeekNumber=(t,e)=>{if(!this.firstDate(t))return f(`week-cell-${e}`);const n=this.firstDate(t),a=this.getWeekNumber(n),l=`kendo-react-calendar-week-cell-${a}`,c={className:"k-alt",value:a,firstDate:n};return this.props.weekCell?r.createElement(this.props.weekCell,{...c,key:l},a):r.createElement(g.CalendarWeekCell,{...c,key:l},a)},this.buildRow=t=>t.map((e,i)=>{if(!e)return f(i);const n={"aria-selected":e.isSelected},a=`kendo-react-calendar-cell-${e.value.getTime()}`,l={...n,...e,isDisabled:!e.isInRange,view:this.props.activeView,showOtherMonthDays:this.props.showOtherMonthDays,onClick:this.handleClick,onMouseEnter:this.handleMouseEnter,onMouseLeave:this.handleMouseLeave};return this.props.cell?r.createElement(this.props.cell,{...l,key:a},e.formattedValue):r.createElement(v.CalendarCell,{...l,key:a},e.formattedValue)}),this.firstDate=t=>{const e=this.firstWeekDateContext(t);return e?e.value:null},this.firstWeekDateContext=t=>{if(!this.weekNumber)return null;let e=0,i=t[e];for(;!i&&e<t.length;)i=t[++e];return i},this.handleClick=(t,e)=>{const{onChange:i}=this.props;if(i&&e){const n={value:p.cloneDate(t),target:this,nativeEvent:e&&e.nativeEvent,syntheticEvent:e};i.call(void 0,n)}},this.handleMouseEnter=t=>{const{onCellEnter:e}=this.props;e&&e.call(void 0,p.cloneDate(t))},this.handleMouseLeave=t=>{const{onCellLeave:e}=this.props;e&&e.call(void 0,p.cloneDate(t))}}get min(){return this.props.min}get max(){return this.props.max}get isHorizontal(){return this.props.direction==="horizontal"}get isMonthView(){return this.props.activeView===k.CalendarViewEnum.month}get weekNumber(){return!!(this.props.showWeekNumbers&&this.props.activeView===k.CalendarViewEnum.month)}get selectedDate(){return this.props.selectedDate!==void 0?this.props.selectedDate:u.defaultProps.selectedDate}render(){this.intl=D.provideIntlService(this),this.weekService=new b.WeekNamesService(this.intl);const t=this.weekService.getWeekNames(this.weekNumber,this.props.weekDaysFormat),e=this.props.service.rowLength(this.weekNumber),i=this.props.service.title(this.props.viewDate),n=m.getToday(),a=m.setTime(this.props.viewDate,n),l=this.props.service.data({cellUID:this.props.cellUID,min:this.min,max:this.max,focusedDate:this.props.focusedDate,isActiveView:!this.props.bus.canMoveDown(this.props.activeView),selectedDate:this.selectedDate,selectionRange:this.props.selectionRange,viewDate:a});return r.createElement(r.Fragment,null,this.isMonthView&&this.isHorizontal&&r.createElement("thead",{role:"rowgroup",className:"k-calendar-thead"},r.createElement("tr",{role:"row",className:"k-calendar-tr"},t.map((c,h)=>r.createElement("th",{key:h,className:"k-calendar-th"},c)))),r.createElement("tbody",{role:"rowgroup",className:"k-calendar-tbody"},!this.isHorizontal&&r.createElement("tr",{role:"presentation",className:"k-calendar-tr"},r.createElement("th",{scope:"col",colSpan:e,className:"k-calendar-caption"},i)),l.map((c,h)=>r.createElement("tr",{role:"row",className:"k-calendar-tr",key:h},this.weekNumber&&this.buildWeekNumber(c,h),this.buildRow(c)))))}getWeekNumber(t){return!this.weekNumber||!this.intl?null:p.weekInYear(t,this.intl.firstDay())}};u.propTypes={activeRangeEnd:s.oneOf(["start","end",null]),activeView:s.number.isRequired,cellUID:s.string.isRequired,direction:s.oneOf(["horizontal","vertical"]),focusedDate:s.instanceOf(Date).isRequired,max:s.instanceOf(Date).isRequired,min:s.instanceOf(Date).isRequired,onChange:s.func,selectedDate:s.oneOfType([s.instanceOf(Date),s.arrayOf(s.instanceOf(Date))]),showWeekNumbers:s.bool,showOtherMonthDays:s.bool,viewDate:s.instanceOf(Date).isRequired},u.defaultProps={direction:"vertical",selectedDate:m.getToday(),showWeekNumbers:!1};let d=u;D.registerForIntl(d);exports.View=d;

package/calendar/components/View.mjs

@@ -6,16 +6,16 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import * as s from "react";
-import r from "prop-types";
+import * as r from "react";
+import s from "prop-types";
 import { cloneDate as p, weekInYear as D } from "@progress/kendo-date-math";
-import { provideIntlService as v, registerForIntl as w } from "@progress/kendo-react-intl";
+import { provideIntlService as w, registerForIntl as v } from "@progress/kendo-react-intl";
 import { CalendarCell as g } from "./CalendarCell.mjs";
 import { CalendarWeekCell as N } from "./CalendarWeekCell.mjs";
 import { CalendarViewEnum as u } from "../models/CalendarViewEnum.mjs";
 import { getToday as d, setTime as b } from "../../utils.mjs";
-import { WeekNamesService as E } from "../services/WeekNamesService.mjs";
-const k = (f) => /* @__PURE__ */ s.createElement("td", { key: f, className: "k-calendar-td k-empty" }, " "), c = class c extends s.Component {
+import { WeekNamesService as y } from "../services/WeekNamesService.mjs";
+const k = (f) => /* @__PURE__ */ r.createElement("td", { key: f, className: "k-calendar-td k-empty" }, " "), c = class c extends r.Component {
   constructor() {
     super(...arguments), this.intl = null, this.weekService = null, this.buildWeekNumber = (t, e) => {
       if (!this.firstDate(t))
@@ -25,7 +25,7 @@ const k = (f) => /* @__PURE__ */ s.createElement("td", { key: f, className: "k-c
         value: a,
         firstDate: n
       };
-      return this.props.weekCell ? /* @__PURE__ */ s.createElement(this.props.weekCell, { ...l, key: o }, a) : /* @__PURE__ */ s.createElement(N, { ...l, key: o }, a);
+      return this.props.weekCell ? /* @__PURE__ */ r.createElement(this.props.weekCell, { ...l, key: o }, a) : /* @__PURE__ */ r.createElement(N, { ...l, key: o }, a);
     }, this.buildRow = (t) => t.map((e, i) => {
       if (!e)
         return k(i);
@@ -34,11 +34,12 @@ const k = (f) => /* @__PURE__ */ s.createElement("td", { key: f, className: "k-c
         ...e,
         isDisabled: !e.isInRange,
         view: this.props.activeView,
+        showOtherMonthDays: this.props.showOtherMonthDays,
         onClick: this.handleClick,
         onMouseEnter: this.handleMouseEnter,
         onMouseLeave: this.handleMouseLeave
       };
-      return this.props.cell ? /* @__PURE__ */ s.createElement(this.props.cell, { ...o, key: a }, e.formattedValue) : /* @__PURE__ */ s.createElement(g, { ...o, key: a }, e.formattedValue);
+      return this.props.cell ? /* @__PURE__ */ r.createElement(this.props.cell, { ...o, key: a }, e.formattedValue) : /* @__PURE__ */ r.createElement(g, { ...o, key: a }, e.formattedValue);
     }), this.firstDate = (t) => {
       const e = this.firstWeekDateContext(t);
       return e ? e.value : null;
@@ -87,7 +88,7 @@ const k = (f) => /* @__PURE__ */ s.createElement("td", { key: f, className: "k-c
     return this.props.selectedDate !== void 0 ? this.props.selectedDate : c.defaultProps.selectedDate;
   }
   render() {
-    this.intl = v(this), this.weekService = new E(this.intl);
+    this.intl = w(this), this.weekService = new y(this.intl);
     const t = this.weekService.getWeekNames(this.weekNumber, this.props.weekDaysFormat), e = this.props.service.rowLength(this.weekNumber), i = this.props.service.title(this.props.viewDate), n = d(), a = b(this.props.viewDate, n), o = this.props.service.data({
       cellUID: this.props.cellUID,
       min: this.min,
@@ -98,20 +99,20 @@ const k = (f) => /* @__PURE__ */ s.createElement("td", { key: f, className: "k-c
       selectionRange: this.props.selectionRange,
       viewDate: a
     });
-    return /* @__PURE__ */ s.createElement(s.Fragment, null, this.isMonthView && this.isHorizontal && /* @__PURE__ */ s.createElement(
+    return /* @__PURE__ */ r.createElement(r.Fragment, null, this.isMonthView && this.isHorizontal && /* @__PURE__ */ r.createElement(
       "thead",
       {
         role: "rowgroup",
         className: "k-calendar-thead"
       },
-      /* @__PURE__ */ s.createElement("tr", { role: "row", className: "k-calendar-tr" }, t.map((l, h) => /* @__PURE__ */ s.createElement("th", { key: h, className: "k-calendar-th" }, l)))
-    ), /* @__PURE__ */ s.createElement(
+      /* @__PURE__ */ r.createElement("tr", { role: "row", className: "k-calendar-tr" }, t.map((l, h) => /* @__PURE__ */ r.createElement("th", { key: h, className: "k-calendar-th" }, l)))
+    ), /* @__PURE__ */ r.createElement(
       "tbody",
       {
         role: "rowgroup",
         className: "k-calendar-tbody"
       },
-      !this.isHorizontal && /* @__PURE__ */ s.createElement("tr", { role: "presentation", className: "k-calendar-tr" }, /* @__PURE__ */ s.createElement(
+      !this.isHorizontal && /* @__PURE__ */ r.createElement("tr", { role: "presentation", className: "k-calendar-tr" }, /* @__PURE__ */ r.createElement(
         "th",
         {
           scope: "col",
@@ -120,7 +121,7 @@ const k = (f) => /* @__PURE__ */ s.createElement("td", { key: f, className: "k-c
         },
         i
       )),
-      o.map((l, h) => /* @__PURE__ */ s.createElement("tr", { role: "row", className: "k-calendar-tr", key: h }, this.weekNumber && this.buildWeekNumber(l, h), this.buildRow(l)))
+      o.map((l, h) => /* @__PURE__ */ r.createElement("tr", { role: "row", className: "k-calendar-tr", key: h }, this.weekNumber && this.buildWeekNumber(l, h), this.buildRow(l)))
     ));
   }
   getWeekNumber(t) {
@@ -128,26 +129,27 @@ const k = (f) => /* @__PURE__ */ s.createElement("td", { key: f, className: "k-c
   }
 };
 c.propTypes = {
-  activeRangeEnd: r.oneOf(["start", "end", null]),
-  activeView: r.number.isRequired,
-  cellUID: r.string.isRequired,
-  direction: r.oneOf(["horizontal", "vertical"]),
-  focusedDate: r.instanceOf(Date).isRequired,
-  max: r.instanceOf(Date).isRequired,
-  min: r.instanceOf(Date).isRequired,
-  onChange: r.func,
-  selectedDate: r.oneOfType(
-    [r.instanceOf(Date), r.arrayOf(r.instanceOf(Date))]
+  activeRangeEnd: s.oneOf(["start", "end", null]),
+  activeView: s.number.isRequired,
+  cellUID: s.string.isRequired,
+  direction: s.oneOf(["horizontal", "vertical"]),
+  focusedDate: s.instanceOf(Date).isRequired,
+  max: s.instanceOf(Date).isRequired,
+  min: s.instanceOf(Date).isRequired,
+  onChange: s.func,
+  selectedDate: s.oneOfType(
+    [s.instanceOf(Date), s.arrayOf(s.instanceOf(Date))]
   ),
-  showWeekNumbers: r.bool,
-  viewDate: r.instanceOf(Date).isRequired
+  showWeekNumbers: s.bool,
+  showOtherMonthDays: s.bool,
+  viewDate: s.instanceOf(Date).isRequired
 }, c.defaultProps = {
   direction: "vertical",
   selectedDate: d(),
   showWeekNumbers: !1
 };
 let m = c;
-w(m);
+v(m);
 export {
   m as View
 };

package/calendar/components/ViewList.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 V=require("react"),r=require("prop-types"),y=require("@progress/kendo-react-common"),d=require("@progress/kendo-date-math"),f=require("@progress/kendo-react-intl"),x=require("../../virtualization/Virtualization.js"),S=require("./View.js"),C=require("./Header.js"),E=require("../services/WeekNamesService.js"),c=require("../../utils.js"),l=require("../models/CalendarViewEnum.js"),I=require("./TodayCommand.js");function T(h){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(h){for(const e in h)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(h,e);Object.defineProperty(o,e,t.get?t:{enumerable:!0,get:()=>h[e]})}}return o.default=h,Object.freeze(o)}const s=T(V),N=5,p=class p extends s.Component{constructor(o){super(o),this.virtualization=null,this.calendarView=null,this.table=null,this.intl=null,this.bottomOffset=0,this.viewOffset=0,this.viewHeight=0,this._element=null,this.isActive=!1,this.animateToIndex=!0,this.shouldScroll=!1,this.weekService=null,this.focusActiveDate=()=>{if(!this._element)return;const e=this._element.querySelector("td.k-focus"),t=this._element.querySelector(".k-state-pending-focus");e&&e[0]&&e[0].classList.remove("k-focus"),t&&t.classList.add("k-focus"),this.isActive=!0},this.blurActiveDate=()=>{if(!this._element)return;const e=this._element.querySelector("td.k-focus");e&&e.classList.remove("k-focus"),this.isActive=!1},this.handleVirtualizationMount=e=>{if(this.virtualization=e,this.virtualization&&this.table){this.table.style.transform=`translateY(${this.viewOffset}px)`;const t=c.dateInRange(this.props.focusedDate,this.props.min,this.props.max),i=this.props.service.skip(t,this.props.min);this.virtualization.scrollToIndex(i)}},this.buildMonthView=(e,t)=>s.createElement("table",{key:"calendar-view-list-weekdays",className:"k-calendar-table k-calendar-weekdays",role:"grid",tabIndex:this.props.tabIndex},s.createElement("colgroup",null,e.map((i,a)=>s.createElement("col",{key:a}))),s.createElement("thead",{className:"k-calendar-thead"},s.createElement("tr",{className:"k-calendar-tr"},t.map((i,a)=>s.createElement("th",{key:a,className:"k-calendar-th"},i))))),this.buildDates=(e,t)=>{const i=this.props.cellUID;return s.createElement("table",{className:"k-calendar-table",ref:a=>this.table=a,role:"grid",tabIndex:this.props.tabIndex,"aria-activedescendant":i+this.props.focusedDate.getTime()},s.createElement("colgroup",null,e.map((a,n)=>s.createElement("col",{key:n}))),t.map(a=>s.createElement(S.View,{ref:n=>{this.calendarView||(this.calendarView=n)},key:a.getTime(),activeView:this.props.activeView,viewDate:a,min:this.props.min,max:this.props.max,cellUID:i,focusedDate:this.props.focusedDate,cell:this.props.cell,selectedDate:this.props.value,showWeekNumbers:this.weekNumber,onChange:this.handleDateChange,bus:this.props.bus,service:this.props.service,weekCell:this.props.weekCell})))},this.calculateHeights=()=>{if(!this.props.dom)return;const e=this.props.activeView===l.CalendarViewEnum.month?this.props.dom.scrollableContentHeight:this.props.dom.scrollableYearContentHeight;this.bottomOffset=e-this.props.dom.viewHeight(this.props.activeView),this.viewOffset=-1*this.props.dom.headerHeight,this.viewHeight=this.props.dom.viewHeight(this.props.activeView)||1},this.getTake=(e,t)=>Math.min(t-e,this.take),this.handleScrollAction=({index:e,scrollAction:t,pageAction:i})=>{const a=i?i.skip:this.state.skip;if((this.state.index!==e||this.state.skip!==a)&&this.setState({index:e,skip:a}),this.table&&t){const n=`translateY(${t.offset}px)`;this.table.style.transform=n}},this.handleTodayClick=e=>{this.shouldScroll=!0,this.handleDateChange.call(void 0,e,!0)},this.handleDateChange=(e,t=!1)=>{const{onChange:i}=this.props;if(i){const a={syntheticEvent:e.syntheticEvent,nativeEvent:e.nativeEvent,value:d.cloneDate(e.value),target:this,isTodayClick:t};i.call(void 0,a)}},this.lastView=this.props.activeView,this.lastFocus=this.props.focusedDate,this.state={skip:this.props.service.skip(this.props.focusedDate,this.props.min),index:this.props.service.skip(this.props.focusedDate,this.props.min)}}get element(){return this._element}get weekNames(){this.intl=f.provideIntlService(this),this.weekService=new E.WeekNamesService(this.intl);const o=this.weekService.getWeekNames(this.weekNumber,this.props.weekDaysFormat),e=c.shiftWeekNames(o,this.intl.firstDay());return this.weekNumber?[""].concat(e):e}get weekNumber(){return!!(this.props.showWeekNumbers&&this.props.activeView===l.CalendarViewEnum.month)}get take(){return this.props.take!==void 0?this.props.take:p.defaultProps.take}get animate(){return!!(this.props.smoothScroll&&this.animateToIndex)}get todayIsInRange(){return c.isInRange(c.getToday(),d.getDate(this.props.min),d.getDate(this.props.max))}componentDidUpdate(o,e){this.shouldScroll=!1,this.indexToScroll!==void 0&&this.virtualization&&this.virtualization[this.animate?"animateToIndex":"scrollToIndex"](this.indexToScroll),this.isActive&&this.focusActiveDate(),this.lastView=this.props.activeView,this.indexToScroll=void 0}render(){this.calculateHeights();const o=this.lastView!==this.props.activeView,e=c.dateInRange(this.props.focusedDate,this.props.min,this.props.max),t=o?this.props.service.skip(e,this.props.min):this.state.skip,i=this.props.service.total(this.props.min,this.props.max),a=this.getTake(t,i),n=this.props.service.addToDate(this.props.min,t),w=this.props.service.addToDate(this.props.min,this.state.index),m=new Array(this.props.service.rowLength(this.weekNumber)).fill(""),v=this.props.activeView!==this.lastView;this.animateToIndex=!v,(v||!d.isEqualDate(this.lastFocus,e)||this.shouldScroll||!this.props.shouldScroll||this.props.shouldScroll())&&(this.indexToScroll=this.props.service.skip(e,this.props.min)),this.lastFocus=e;const k=y.classNames("k-calendar-view k-vstack",{"k-calendar-monthview":this.props.activeView===l.CalendarViewEnum.month,"k-calendar-yearview":this.props.activeView===l.CalendarViewEnum.year,"k-calendar-decadeview":this.props.activeView===l.CalendarViewEnum.decade,"k-calendar-centuryview":this.props.activeView===l.CalendarViewEnum.century}),b=this.buildDates(m,this.props.service.datesList(n,a)),g=s.createElement(s.Fragment,null,s.createElement(C.Header,{key:"calendar-view-list-header",currentDate:w,min:this.props.min,max:this.props.max,activeView:this.props.activeView,bus:this.props.bus,service:this.props.service,headerTitle:this.props.headerTitle,commands:s.createElement(s.Fragment,null,s.createElement(I.TodayCommand,{min:this.props.min,max:this.props.max,onClick:this.handleTodayClick,disabled:!this.todayIsInRange,tabIndex:this.props.tabIndex}))}),this.props.activeView===l.CalendarViewEnum.month&&this.buildMonthView(m,this.weekNames),s.createElement(x.Virtualization,{key:"calendar-view-list-content",skip:t,take:this.take,total:i,itemHeight:this.viewHeight,topOffset:this.viewOffset,bottomOffset:this.bottomOffset,scrollOffsetSize:this.viewOffset,maxScrollDifference:this.viewHeight,onScroll:this.props.onScroll,onScrollAction:this.handleScrollAction,onMount:this.handleVirtualizationMount,children:b,tabIndex:this.props.tabIndex}));return s.createElement("div",{ref:D=>{this._element=D},className:k},this.props.dom.didCalculate?g:null)}};p.propTypes={activeView:r.number.isRequired,bottomOffset:r.number,cellUID:r.string.isRequired,focusedDate:r.instanceOf(Date).isRequired,max:r.instanceOf(Date).isRequired,min:r.instanceOf(Date).isRequired,onChange:r.func,showWeekNumbers:r.bool,smoothScroll:r.bool,take:r.number,value:r.instanceOf(Date),viewHeight:r.number,viewOffset:r.number,weekDaysFormat:r.oneOf(["short","abbreviated","narrow"]),tabIndex:r.number},p.defaultProps={take:N,showWeekNumbers:!1,weekDaysFormat:"short",smoothScroll:!0};let u=p;f.registerForIntl(u);exports.ViewList=u;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("react"),r=require("prop-types"),V=require("@progress/kendo-react-common"),d=require("@progress/kendo-date-math"),f=require("@progress/kendo-react-intl"),x=require("../../virtualization/Virtualization.js"),S=require("./View.js"),C=require("./Header.js"),E=require("../services/WeekNamesService.js"),c=require("../../utils.js"),l=require("../models/CalendarViewEnum.js"),I=require("./TodayCommand.js");function T(h){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(h){for(const e in h)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(h,e);Object.defineProperty(o,e,t.get?t:{enumerable:!0,get:()=>h[e]})}}return o.default=h,Object.freeze(o)}const s=T(y),N=5,p=class p extends s.Component{constructor(o){super(o),this.virtualization=null,this.calendarView=null,this.table=null,this.intl=null,this.bottomOffset=0,this.viewOffset=0,this.viewHeight=0,this._element=null,this.isActive=!1,this.animateToIndex=!0,this.shouldScroll=!1,this.weekService=null,this.focusActiveDate=()=>{if(!this._element)return;const e=this._element.querySelector("td.k-focus"),t=this._element.querySelector(".k-state-pending-focus");e&&e[0]&&e[0].classList.remove("k-focus"),t&&t.classList.add("k-focus"),this.isActive=!0},this.blurActiveDate=()=>{if(!this._element)return;const e=this._element.querySelector("td.k-focus");e&&e.classList.remove("k-focus"),this.isActive=!1},this.handleVirtualizationMount=e=>{if(this.virtualization=e,this.virtualization&&this.table){this.table.style.transform=`translateY(${this.viewOffset}px)`;const t=c.dateInRange(this.props.focusedDate,this.props.min,this.props.max),i=this.props.service.skip(t,this.props.min);this.virtualization.scrollToIndex(i)}},this.buildMonthView=(e,t)=>s.createElement("table",{key:"calendar-view-list-weekdays",className:"k-calendar-table k-calendar-weekdays",role:"grid",tabIndex:this.props.tabIndex},s.createElement("colgroup",null,e.map((i,a)=>s.createElement("col",{key:a}))),s.createElement("thead",{className:"k-calendar-thead"},s.createElement("tr",{className:"k-calendar-tr"},t.map((i,a)=>s.createElement("th",{key:a,className:"k-calendar-th"},i))))),this.buildDates=(e,t)=>{const i=this.props.cellUID;return s.createElement("table",{className:"k-calendar-table",ref:a=>this.table=a,role:"grid",tabIndex:this.props.tabIndex,"aria-activedescendant":i+this.props.focusedDate.getTime()},s.createElement("colgroup",null,e.map((a,n)=>s.createElement("col",{key:n}))),t.map(a=>s.createElement(S.View,{ref:n=>{this.calendarView||(this.calendarView=n)},key:a.getTime(),activeView:this.props.activeView,viewDate:a,min:this.props.min,max:this.props.max,cellUID:i,focusedDate:this.props.focusedDate,cell:this.props.cell,selectedDate:this.props.value,showWeekNumbers:this.weekNumber,onChange:this.handleDateChange,bus:this.props.bus,service:this.props.service,weekCell:this.props.weekCell,showOtherMonthDays:this.props.showOtherMonthDays})))},this.calculateHeights=()=>{if(!this.props.dom)return;const e=this.props.activeView===l.CalendarViewEnum.month?this.props.dom.scrollableContentHeight:this.props.dom.scrollableYearContentHeight;this.bottomOffset=e-this.props.dom.viewHeight(this.props.activeView),this.viewOffset=-1*this.props.dom.headerHeight,this.viewHeight=this.props.dom.viewHeight(this.props.activeView)||1},this.getTake=(e,t)=>Math.min(t-e,this.take),this.handleScrollAction=({index:e,scrollAction:t,pageAction:i})=>{const a=i?i.skip:this.state.skip;if((this.state.index!==e||this.state.skip!==a)&&this.setState({index:e,skip:a}),this.table&&t){const n=`translateY(${t.offset}px)`;this.table.style.transform=n}},this.handleTodayClick=e=>{this.shouldScroll=!0,this.handleDateChange.call(void 0,e,!0)},this.handleDateChange=(e,t=!1)=>{const{onChange:i}=this.props;if(i){const a={syntheticEvent:e.syntheticEvent,nativeEvent:e.nativeEvent,value:d.cloneDate(e.value),target:this,isTodayClick:t};i.call(void 0,a)}},this.lastView=this.props.activeView,this.lastFocus=this.props.focusedDate,this.state={skip:this.props.service.skip(this.props.focusedDate,this.props.min),index:this.props.service.skip(this.props.focusedDate,this.props.min)}}get element(){return this._element}get weekNames(){this.intl=f.provideIntlService(this),this.weekService=new E.WeekNamesService(this.intl);const o=this.weekService.getWeekNames(this.weekNumber,this.props.weekDaysFormat),e=c.shiftWeekNames(o,this.intl.firstDay());return this.weekNumber?[""].concat(e):e}get weekNumber(){return!!(this.props.showWeekNumbers&&this.props.activeView===l.CalendarViewEnum.month)}get take(){return this.props.take!==void 0?this.props.take:p.defaultProps.take}get animate(){return!!(this.props.smoothScroll&&this.animateToIndex)}get todayIsInRange(){return c.isInRange(c.getToday(),d.getDate(this.props.min),d.getDate(this.props.max))}componentDidUpdate(o,e){this.shouldScroll=!1,this.indexToScroll!==void 0&&this.virtualization&&this.virtualization[this.animate?"animateToIndex":"scrollToIndex"](this.indexToScroll),this.isActive&&this.focusActiveDate(),this.lastView=this.props.activeView,this.indexToScroll=void 0}render(){this.calculateHeights();const o=this.lastView!==this.props.activeView,e=c.dateInRange(this.props.focusedDate,this.props.min,this.props.max),t=o?this.props.service.skip(e,this.props.min):this.state.skip,i=this.props.service.total(this.props.min,this.props.max),a=this.getTake(t,i),n=this.props.service.addToDate(this.props.min,t),w=this.props.service.addToDate(this.props.min,this.state.index),m=new Array(this.props.service.rowLength(this.weekNumber)).fill(""),v=this.props.activeView!==this.lastView;this.animateToIndex=!v,(v||!d.isEqualDate(this.lastFocus,e)||this.shouldScroll||!this.props.shouldScroll||this.props.shouldScroll())&&(this.indexToScroll=this.props.service.skip(e,this.props.min)),this.lastFocus=e;const k=V.classNames("k-calendar-view k-vstack",{"k-calendar-monthview":this.props.activeView===l.CalendarViewEnum.month,"k-calendar-yearview":this.props.activeView===l.CalendarViewEnum.year,"k-calendar-decadeview":this.props.activeView===l.CalendarViewEnum.decade,"k-calendar-centuryview":this.props.activeView===l.CalendarViewEnum.century}),b=this.buildDates(m,this.props.service.datesList(n,a)),g=s.createElement(s.Fragment,null,s.createElement(C.Header,{key:"calendar-view-list-header",currentDate:w,min:this.props.min,max:this.props.max,activeView:this.props.activeView,bus:this.props.bus,service:this.props.service,headerTitle:this.props.headerTitle,header:this.props.header,commands:s.createElement(s.Fragment,null,s.createElement(I.TodayCommand,{min:this.props.min,max:this.props.max,onClick:this.handleTodayClick,disabled:!this.todayIsInRange,tabIndex:this.props.tabIndex}))}),this.props.activeView===l.CalendarViewEnum.month&&this.buildMonthView(m,this.weekNames),s.createElement(x.Virtualization,{key:"calendar-view-list-content",skip:t,take:this.take,total:i,itemHeight:this.viewHeight,topOffset:this.viewOffset,bottomOffset:this.bottomOffset,scrollOffsetSize:this.viewOffset,maxScrollDifference:this.viewHeight,onScroll:this.props.onScroll,onScrollAction:this.handleScrollAction,onMount:this.handleVirtualizationMount,children:b,tabIndex:this.props.tabIndex}));return s.createElement("div",{ref:D=>{this._element=D},className:k},this.props.dom.didCalculate?g:null)}};p.propTypes={activeView:r.number.isRequired,bottomOffset:r.number,cellUID:r.string.isRequired,focusedDate:r.instanceOf(Date).isRequired,max:r.instanceOf(Date).isRequired,min:r.instanceOf(Date).isRequired,onChange:r.func,showWeekNumbers:r.bool,smoothScroll:r.bool,take:r.number,value:r.instanceOf(Date),viewHeight:r.number,viewOffset:r.number,weekDaysFormat:r.oneOf(["short","abbreviated","narrow"]),tabIndex:r.number},p.defaultProps={take:N,showWeekNumbers:!1,weekDaysFormat:"short",smoothScroll:!0};let u=p;f.registerForIntl(u);exports.ViewList=u;

package/calendar/components/ViewList.mjs

@@ -18,9 +18,9 @@ import { WeekNamesService as N } from "../services/WeekNamesService.mjs";
 import { dateInRange as u, shiftWeekNames as C, isInRange as E, getToday as O } from "../../utils.mjs";
 import { CalendarViewEnum as n } from "../models/CalendarViewEnum.mjs";
 import { TodayCommand as H } from "./TodayCommand.mjs";
-const z = 5, h = class h extends s.Component {
-  constructor(l) {
-    super(l), this.virtualization = null, this.calendarView = null, this.table = null, this.intl = null, this.bottomOffset = 0, this.viewOffset = 0, this.viewHeight = 0, this._element = null, this.isActive = !1, this.animateToIndex = !0, this.shouldScroll = !1, this.weekService = null, this.focusActiveDate = () => {
+const z = 5, l = class l extends s.Component {
+  constructor(h) {
+    super(h), this.virtualization = null, this.calendarView = null, this.table = null, this.intl = null, this.bottomOffset = 0, this.viewOffset = 0, this.viewHeight = 0, this._element = null, this.isActive = !1, this.animateToIndex = !0, this.shouldScroll = !1, this.weekService = null, this.focusActiveDate = () => {
       if (!this._element)
         return;
       const e = this._element.querySelector("td.k-focus"), t = this._element.querySelector(".k-state-pending-focus");
@@ -77,7 +77,8 @@ const z = 5, h = class h extends s.Component {
             onChange: this.handleDateChange,
             bus: this.props.bus,
             service: this.props.service,
-            weekCell: this.props.weekCell
+            weekCell: this.props.weekCell,
+            showOtherMonthDays: this.props.showOtherMonthDays
           }
         ))
       );
@@ -116,14 +117,14 @@ const z = 5, h = class h extends s.Component {
   }
   get weekNames() {
     this.intl = y(this), this.weekService = new N(this.intl);
-    const l = this.weekService.getWeekNames(this.weekNumber, this.props.weekDaysFormat), e = C(l, this.intl.firstDay());
+    const h = this.weekService.getWeekNames(this.weekNumber, this.props.weekDaysFormat), e = C(h, this.intl.firstDay());
     return this.weekNumber ? [""].concat(e) : e;
   }
   get weekNumber() {
     return !!(this.props.showWeekNumbers && this.props.activeView === n.month);
   }
   get take() {
-    return this.props.take !== void 0 ? this.props.take : h.defaultProps.take;
+    return this.props.take !== void 0 ? this.props.take : l.defaultProps.take;
   }
   get animate() {
     return !!(this.props.smoothScroll && this.animateToIndex);
@@ -131,12 +132,12 @@ const z = 5, h = class h extends s.Component {
   get todayIsInRange() {
     return E(O(), d(this.props.min), d(this.props.max));
   }
-  componentDidUpdate(l, e) {
+  componentDidUpdate(h, e) {
     this.shouldScroll = !1, this.indexToScroll !== void 0 && this.virtualization && this.virtualization[this.animate ? "animateToIndex" : "scrollToIndex"](this.indexToScroll), this.isActive && this.focusActiveDate(), this.lastView = this.props.activeView, this.indexToScroll = void 0;
   }
   render() {
     this.calculateHeights();
-    const l = this.lastView !== this.props.activeView, e = u(this.props.focusedDate, this.props.min, this.props.max), t = l ? this.props.service.skip(e, this.props.min) : this.state.skip, i = this.props.service.total(this.props.min, this.props.max), a = this.getTake(t, i), r = this.props.service.addToDate(this.props.min, t), v = this.props.service.addToDate(this.props.min, this.state.index), p = new Array(this.props.service.rowLength(this.weekNumber)).fill(""), m = this.props.activeView !== this.lastView;
+    const h = this.lastView !== this.props.activeView, e = u(this.props.focusedDate, this.props.min, this.props.max), t = h ? this.props.service.skip(e, this.props.min) : this.state.skip, i = this.props.service.total(this.props.min, this.props.max), a = this.getTake(t, i), r = this.props.service.addToDate(this.props.min, t), v = this.props.service.addToDate(this.props.min, this.state.index), p = new Array(this.props.service.rowLength(this.weekNumber)).fill(""), m = this.props.activeView !== this.lastView;
     this.animateToIndex = !m, (m || !x(this.lastFocus, e) || this.shouldScroll || !this.props.shouldScroll || this.props.shouldScroll()) && (this.indexToScroll = this.props.service.skip(e, this.props.min)), this.lastFocus = e;
     const f = g(
       "k-calendar-view k-vstack",
@@ -146,7 +147,7 @@ const z = 5, h = class h extends s.Component {
         "k-calendar-decadeview": this.props.activeView === n.decade,
         "k-calendar-centuryview": this.props.activeView === n.century
       }
-    ), k = this.buildDates(p, this.props.service.datesList(r, a)), w = /* @__PURE__ */ s.createElement(s.Fragment, null, /* @__PURE__ */ s.createElement(
+    ), w = this.buildDates(p, this.props.service.datesList(r, a)), k = /* @__PURE__ */ s.createElement(s.Fragment, null, /* @__PURE__ */ s.createElement(
       T,
       {
         key: "calendar-view-list-header",
@@ -157,6 +158,7 @@ const z = 5, h = class h extends s.Component {
         bus: this.props.bus,
         service: this.props.service,
         headerTitle: this.props.headerTitle,
+        header: this.props.header,
         commands: /* @__PURE__ */ s.createElement(s.Fragment, null, /* @__PURE__ */ s.createElement(
           H,
           {
@@ -183,7 +185,7 @@ const z = 5, h = class h extends s.Component {
         onScroll: this.props.onScroll,
         onScrollAction: this.handleScrollAction,
         onMount: this.handleVirtualizationMount,
-        children: k,
+        children: w,
         tabIndex: this.props.tabIndex
       }
     ));
@@ -195,11 +197,11 @@ const z = 5, h = class h extends s.Component {
         },
         className: f
       },
-      this.props.dom.didCalculate ? w : null
+      this.props.dom.didCalculate ? k : null
     );
   }
 };
-h.propTypes = {
+l.propTypes = {
   activeView: o.number.isRequired,
   bottomOffset: o.number,
   cellUID: o.string.isRequired,
@@ -215,13 +217,13 @@ h.propTypes = {
   viewOffset: o.number,
   weekDaysFormat: o.oneOf(["short", "abbreviated", "narrow"]),
   tabIndex: o.number
-}, h.defaultProps = {
+}, l.defaultProps = {
   take: z,
   showWeekNumbers: !1,
   weekDaysFormat: "short",
   smoothScroll: !0
 };
-let c = h;
+let c = l;
 S(c);
 export {
   c as ViewList