@progress/kendo-react-dateinputs 7.2.4-develop.3 → 7.3.0-develop.1

package/calendar/components/Header.mjs

@@ -0,0 +1,78 @@
+/**
+ * @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";
+import * as s from "react";
+import i from "prop-types";
+import { registerForLocalization as c } from "@progress/kendo-react-intl";
+import { classNames as p } from "@progress/kendo-react-common";
+import { CalendarHeaderTitle as h } from "./CalendarHeaderTitle.mjs";
+import { MIN_DATE as l, MAX_DATE as m } from "../../utils.mjs";
+const t = class t extends s.Component {
+  constructor() {
+    super(...arguments), this.getTitle = () => {
+      if (!this.props.currentDate)
+        return "";
+      const e = this.rangeLength - 1, a = this.props.service.title(this.props.currentDate), r = this.props.service.addToDate(this.props.currentDate, e);
+      return e < 1 || !this.props.service.isInRange(r, this.min, this.max) ? a : `${a} - ${this.props.service.title(r)}`;
+    }, this.handleTitleClick = (e) => {
+      this.canMoveUp && this.props.bus.moveUp(this.props.activeView, e);
+    };
+  }
+  get min() {
+    return this.props.min !== void 0 ? this.props.min : t.defaultProps.min;
+  }
+  get max() {
+    return this.props.max !== void 0 ? this.props.max : t.defaultProps.max;
+  }
+  get rangeLength() {
+    return this.props.rangeLength !== void 0 ? this.props.rangeLength : t.defaultProps.rangeLength;
+  }
+  get canMoveUp() {
+    return this.props.bus.canMoveUp(this.props.activeView);
+  }
+  render() {
+    const e = this.getTitle(), a = p(
+      "k-calendar-title"
+    ), r = {
+      children: e,
+      value: e,
+      view: this.props.activeView,
+      className: a,
+      onClick: this.handleTitleClick,
+      disabled: !this.canMoveUp
+    }, o = this.props.headerTitle ? /* @__PURE__ */ s.createElement(this.props.headerTitle, { ...r }, e) : /* @__PURE__ */ s.createElement(h, { ...r }, e);
+    return /* @__PURE__ */ s.createElement(
+      "div",
+      {
+        className: p("k-calendar-header", {
+          "k-vstack": this.props.verticalView,
+          "k-hstack": !this.props.verticalView
+        })
+      },
+      o,
+      /* @__PURE__ */ s.createElement("span", { className: "k-spacer" }),
+      /* @__PURE__ */ s.createElement("span", { className: "k-calendar-nav k-hstack" }, this.props.commands)
+    );
+  }
+};
+t.propTypes = {
+  activeView: i.number.isRequired,
+  currentDate: i.instanceOf(Date).isRequired,
+  max: i.instanceOf(Date).isRequired,
+  min: i.instanceOf(Date).isRequired,
+  rangeLength: i.number
+}, t.defaultProps = {
+  rangeLength: 1,
+  min: l,
+  max: m
+};
+let n = t;
+c(n);
+export {
+  n as Header
+};

package/calendar/components/HorizontalViewList.js

@@ -0,0 +1,8 @@
+/**
+ * @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 h=require("react"),m=require("./View.js"),r=require("../models/CalendarViewEnum.js"),d=require("@progress/kendo-react-common"),v=require("@progress/kendo-date-math"),l=require("../../utils.js");function f(i){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(i){for(const e in i)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(i,e);Object.defineProperty(s,e,t.get?t:{enumerable:!0,get:()=>i[e]})}}return s.default=i,Object.freeze(s)}const a=f(h),u=2,n=class n extends a.Component{constructor(s){super(s),this._element=null,this.isActive=!1,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.rotateSelectionRange=e=>{if(e.start===null||e.end===null)return e;const t=e.end<e.start;return{start:t?e.end:e.start,end:t?e.start:e.end}},this.handleDateChange=(e,t=!1)=>{const{onChange:c}=this.props;if(c){const p={syntheticEvent:e.syntheticEvent,nativeEvent:e.nativeEvent,value:v.cloneDate(e.value),target:this,isTodayClick:t};c.call(void 0,p)}}}get element(){return this._element}get weekNumber(){return!!(this.props.showWeekNumbers&&this.props.activeView===r.CalendarViewEnum.month)}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}componentDidUpdate(){this.isActive&&this.focusActiveDate()}render(){const s=this.props.allowReverse?this.rotateSelectionRange(this.props.selectionRange):this.props.selectionRange,e=d.classNames("k-calendar-view k-align-items-start k-justify-content-center",{"k-vstack":this.props.verticalView,"k-hstack":!this.props.verticalView,"k-calendar-monthview":this.props.activeView===r.CalendarViewEnum.month,"k-calendar-yearview":this.props.activeView===r.CalendarViewEnum.year,"k-calendar-decadeview":this.props.activeView===r.CalendarViewEnum.decade,"k-calendar-centuryview":this.props.activeView===r.CalendarViewEnum.century});return a.createElement("div",{ref:t=>{this._element=t},className:e},this.props.dates.map(t=>a.createElement("table",{className:"k-calendar-table k-content",key:t.getTime(),role:"grid"},a.createElement(m.View,{bus:this.props.bus,service:this.props.service,key:t.getTime(),direction:"horizontal",activeView:this.props.activeView,cellUID:this.props.cellUID,viewDate:t,min:this.min,max:this.max,focusedDate:this.props.focusedDate,selectionRange:s,selectedDate:this.props.value,showWeekNumbers:this.weekNumber,onChange:this.handleDateChange,onCellEnter:this.props.onCellEnter,cell:this.props.cell,weekCell:this.props.weekCell}))))}};n.defaultProps={showWeekNumbers:!1,views:u,take:u,allowReverse:!0,min:l.MIN_DATE,max:l.MAX_DATE};let o=n;exports.HorizontalViewList=o;

package/calendar/components/HorizontalViewList.mjs

@@ -0,0 +1,120 @@
+/**
+ * @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";
+import * as r from "react";
+import { View as p } from "./View.mjs";
+import { CalendarViewEnum as s } from "../models/CalendarViewEnum.mjs";
+import { classNames as h } from "@progress/kendo-react-common";
+import { cloneDate as m } from "@progress/kendo-date-math";
+import { MIN_DATE as u, MAX_DATE as v } from "../../utils.mjs";
+const n = 2, i = class i extends r.Component {
+  constructor(a) {
+    super(a), this._element = null, this.isActive = !1, 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.rotateSelectionRange = (e) => {
+      if (e.start === null || e.end === null)
+        return e;
+      const t = e.end < e.start;
+      return {
+        start: t ? e.end : e.start,
+        end: t ? e.start : e.end
+      };
+    }, this.handleDateChange = (e, t = !1) => {
+      const { onChange: o } = this.props;
+      if (o) {
+        const c = {
+          syntheticEvent: e.syntheticEvent,
+          nativeEvent: e.nativeEvent,
+          value: m(e.value),
+          target: this,
+          isTodayClick: t
+        };
+        o.call(void 0, c);
+      }
+    };
+  }
+  get element() {
+    return this._element;
+  }
+  get weekNumber() {
+    return !!(this.props.showWeekNumbers && this.props.activeView === s.month);
+  }
+  get min() {
+    return this.props.min !== void 0 ? this.props.min : i.defaultProps.min;
+  }
+  get max() {
+    return this.props.max !== void 0 ? this.props.max : i.defaultProps.max;
+  }
+  componentDidUpdate() {
+    this.isActive && this.focusActiveDate();
+  }
+  render() {
+    const a = this.props.allowReverse ? this.rotateSelectionRange(this.props.selectionRange) : this.props.selectionRange, e = h(
+      "k-calendar-view k-align-items-start k-justify-content-center",
+      {
+        "k-vstack": this.props.verticalView,
+        "k-hstack": !this.props.verticalView,
+        "k-calendar-monthview": this.props.activeView === s.month,
+        "k-calendar-yearview": this.props.activeView === s.year,
+        "k-calendar-decadeview": this.props.activeView === s.decade,
+        "k-calendar-centuryview": this.props.activeView === s.century
+      }
+    );
+    return /* @__PURE__ */ r.createElement(
+      "div",
+      {
+        ref: (t) => {
+          this._element = t;
+        },
+        className: e
+      },
+      this.props.dates.map((t) => /* @__PURE__ */ r.createElement("table", { className: "k-calendar-table k-content", key: t.getTime(), role: "grid" }, /* @__PURE__ */ r.createElement(
+        p,
+        {
+          bus: this.props.bus,
+          service: this.props.service,
+          key: t.getTime(),
+          direction: "horizontal",
+          activeView: this.props.activeView,
+          cellUID: this.props.cellUID,
+          viewDate: t,
+          min: this.min,
+          max: this.max,
+          focusedDate: this.props.focusedDate,
+          selectionRange: a,
+          selectedDate: this.props.value,
+          showWeekNumbers: this.weekNumber,
+          onChange: this.handleDateChange,
+          onCellEnter: this.props.onCellEnter,
+          cell: this.props.cell,
+          weekCell: this.props.weekCell
+        }
+      )))
+    );
+  }
+};
+i.defaultProps = {
+  showWeekNumbers: !1,
+  views: n,
+  take: n,
+  allowReverse: !0,
+  min: u,
+  max: v
+};
+let l = i;
+export {
+  l as HorizontalViewList
+};

package/calendar/components/MultiViewCalendar.js

@@ -0,0 +1,8 @@
+/**
+ * @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 q=require("react"),i=require("prop-types"),I=require("@progress/kendo-react-intl"),f=require("@progress/kendo-react-common"),r=require("@progress/kendo-date-math"),O=require("@progress/kendo-react-buttons"),R=require("@progress/kendo-svg-icons"),C=require("../models/NavigationAction.js"),k=require("../models/CalendarViewEnum.js"),S=require("../models/SelectionRange.js"),_=require("./Header.js"),n=require("../../utils.js"),w=require("../../messages/index.js"),z=require("../services/BusViewService.js"),K=require("../services/NavigationService.js"),x=require("./HorizontalViewList.js"),H=require("./TodayCommand.js");function Y(l){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const a in l)if(a!=="default"){const u=Object.getOwnPropertyDescriptor(l,a);Object.defineProperty(s,a,u.get?u:{enumerable:!0,get:()=>l[a]})}}return s.default=l,Object.freeze(s)}const p=Y(q),F=(l=v.defaultProps.min,s=v.defaultProps.max,a)=>a instanceof Date&&!Array.isArray(a)&&n.isInRange(r.getDate(a),l,s)?r.getDate(a):null,A=(l=v.defaultProps.min,s=v.defaultProps.max,a)=>Array.isArray(a)?a.filter(u=>n.isInRange(u,l,s)).map(u=>r.getDate(u)):null,T=l=>typeof l=="object"&&!(l instanceof Date)&&l!==null&&!Array.isArray(l)?l:S.EMPTY_SELECTIONRANGE,M=(l,s,a)=>l||s&&s[0]||a&&a.start,j=(l,s)=>l.start===null&&s===null?"start":l.end===null?"end":"start",d=class d extends p.Component{constructor(s){super(s),this.dates=[],this.selectedDate=null,this.selectedMultiple=null,this.selectedRange=S.EMPTY_SELECTIONRANGE,this._focusedDate=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()},this.clampRange=e=>({start:e,end:null}),this.rangeWithFocused=(e,t)=>({start:e.start,end:e.end===null&&e.start!==null&&this.isActive?t:e.end}),this.generateRange=(e,t)=>{const{end:h,start:c}=t,g=t.start!==null&&e.getTime()<=t.start.getTime();return!this.props.allowReverse&&g?{start:e,end:this.selectedRange.start}:this.activeRange!=="end"?{start:e,end:h}:{start:c||this.selectedDate,end:e}},this.canNavigate=e=>{if(!this.service)return!1;const t=this.service.move(this.focusedDate,e);return this.min<=t&&t<=this.max||this.service.isInSameView(t,this.min)||this.service.isInSameView(t,this.max)},this.navigate=(e,t)=>{this.calculateFocusFromValue=!1;const h=this.move(e,t);this.setState({navigateDate:h,focusedDate:h})},this.move=(e,t)=>this.clampDate(this.service.move(t,e)),this.clampDate=e=>n.dateInRange(e,this.min,this.max),this.shouldAutoCorrect=(e,t)=>{const{end:h,start:c}=t;return this.activeRange!=="end"?h!==null&&e>h:c!==null&&e<c},this.handleCellEnter=e=>{this.props.mode==="range"&&(this.calculateFocusFromValue=!1,this.setState({focusedDate:e}))},this.handleMouseDown=e=>{e.preventDefault()},this.handleClick=e=>{this._element&&this._element.focus({preventScroll:!0})},this.handleFocus=e=>{if(this.isActive=!0,!this.calendarViewList)return;this.calendarViewList.focusActiveDate();const{onFocus:t}=this.props;t&&t.call(void 0,e)},this.handleBlur=e=>{if(this.isActive=!1,!this.calendarViewList)return;this.calendarViewList.blurActiveDate();const{onBlur:t}=this.props;t&&t.call(void 0,e)},this.handleTodayClick=e=>{this.todayIsInRange&&this.handleDateChange(e)},this.handlePrevButtonClick=()=>{const e=C.Action.PrevView;if(this.state.activeView>0&&this.focusedDate.getFullYear()>this.dates[0].getFullYear())this.navigate(e,this.move(e,this.focusedDate));else{const t=this.isInMonth(this.focusedDate,this.dates[1])?this.move(e,this.focusedDate):this.focusedDate;this.navigate(e,t)}},this.handleNextButtonClick=()=>{this.navigate(C.Action.NextView,this.focusedDate)},this.handleKeyDown=e=>{const{keyCode:h,ctrlKey:c,metaKey:g}=e;if(h===84){const o=n.getToday();this.calculateFocusFromValue=!1,this.setState({focusedDate:o,navigateDate:o})}if((c||g)&&(h===f.Keys.left&&this.handlePrevButtonClick(),h===f.Keys.right&&this.handleNextButtonClick()),h===f.Keys.enter){const o={syntheticEvent:e,nativeEvent:e.nativeEvent,value:this.focusedDate,target:this};this.handleDateChange(o)}else{const o=n.dateInRange(this.navigation.move(this.focusedDate,this.navigation.action(e),this.state.activeView,this.service,e),this.min,this.max);if(r.isEqualDate(this.focusedDate,o))return;this.dates&&this.service&&!this.service.isInArray(o,this.dates)&&this.setState({navigateDate:o}),this.calculateFocusFromValue=!1,this.setState({focusedDate:o})}e.preventDefault()},this.handleViewChange=({view:e})=>{this.calculateFocusFromValue=!1,this.setState(t=>({activeView:e,navigateDate:t.focusedDate}))},this.handleDateChange=e=>{const t=r.cloneDate(e.value),h=this.bus.canMoveDown(this.state.activeView);if(this.props.disabled)return;if(h)if(e.isTodayClick)this.bus.moveToBottom(this.state.activeView);else{this.bus.moveDown(this.state.activeView,e.syntheticEvent),this.setState({focusedDate:t,navigateDate:t});return}this.calculateFocusFromValue=!0;let c;switch(this.props.mode){case"single":c=r.cloneDate(e.value);break;case"multiple":if(Array.isArray(this.selectedMultiple)){const o=this.selectedMultiple.slice();let m=-1;o.forEach((L,B)=>{r.isEqualDate(L,e.value)&&(m=B)}),m!==-1?o.splice(m,1):o.push(r.cloneDate(e.value)),c=o.slice()}else this.selectedDate?c=[r.cloneDate(this.selectedDate),r.cloneDate(e.value)]:c=[r.cloneDate(e.value)];break;case"range":{c=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:c=r.cloneDate(e.value);break}this.valueDuringOnChange=c,e.isTodayClick&&this.setState({navigateDate:t}),this.setState({value:c,focusedDate:t}),this.valueDuringOnChange=c;const{onChange:g}=this.props;if(g){const o={syntheticEvent:e.syntheticEvent,nativeEvent:e.nativeEvent,value:c,target:this};g.call(void 0,o)}this.valueDuringOnChange=void 0};const a=s.value!==void 0?s.value:s.defaultValue||d.defaultProps.defaultValue,u=F(this.min,this.max,a),D=A(this.min,this.max,a),y=T(a),E=M(u,D,y),V=n.viewInRange(k.CalendarViewEnum[s.defaultActiveView],this.bottomView,this.topView),b=n.dateInRange(s.focusedDate||E||n.getToday(),this.min,this.max);this.state={value:a,activeView:V,focusedDate:b,navigateDate:b},this.activeRangeEnd=j(y,u),this.bus=new z.BusViewService(this.handleViewChange),this.navigation=new K.NavigationService(this.bus),this.calculateFocusFromValue=!1,this.lastView=V,this.lastViewsCount=this.props.views||x.HorizontalViewList.defaultProps.views}get wrapperID(){return this.props.id+"-wrapper-id"}get isRtl(){return this.props.dir==="rtl"}get element(){return this._element}get value(){return this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value}get focusedDate(){return r.cloneDate(this._focusedDate)}get min(){return r.getDate(this.props.min!==void 0?this.props.min:d.defaultProps.min)}get max(){return r.getDate(this.props.max!==void 0?this.props.max:d.defaultProps.max)}get bottomView(){return k.CalendarViewEnum[this.props.bottomView!==void 0?this.props.bottomView:d.defaultProps.bottomView]}get topView(){return k.CalendarViewEnum[this.props.topView!==void 0?this.props.topView:d.defaultProps.topView]}get activeRange(){return this.props.activeRangeEnd!==void 0?this.props.activeRangeEnd:this.activeRangeEnd}get todayIsInRange(){return n.isInRange(n.getToday(),r.getDate(this.min),r.getDate(this.max))}componentDidMount(){this.calculateFocusFromValue=!0}componentDidUpdate(){this.calendarViewList&&(this.isActive?this.calendarViewList.focusActiveDate:this.calendarViewList.blurActiveDate)();const s=F(this.min,this.max,this.value);this.calculateFocusFromValue=!!(this.selectedDate&&s&&this.selectedDate.getTime()&&s.getTime()),this.lastView=this.state.activeView,this.lastViewsCount=this.props.views||x.HorizontalViewList.defaultProps.views}render(){this.props._ref&&this.props._ref(this),this.intl=I.provideIntlService(this),this.localization=I.provideLocalizationService(this),this.bus.configure(this.bottomView,this.topView);const s=n.viewInRange(this.state.activeView,this.bottomView,this.topView);this.service=this.bus.service(s,this.intl),this.selectedDate=F(this.min,this.max,this.value),this.selectedMultiple=A(this.min,this.max,this.value),this.selectedRange=T(this.value);const a=M(this.selectedDate,this.selectedMultiple,this.selectedRange);this._focusedDate=n.dateInRange(this.calculateFocusFromValue&&a!==null?a:this.state.focusedDate,this.min,this.max);const u=f.classNames("k-widget k-calendar k-calendar-range",{"k-disabled":this.props.disabled},this.props.className),D=this.rangeWithFocused(this.selectedRange,this.focusedDate),y=this.localization.toLanguageString(w.prevView,w.messages[w.prevView]),E=this.localization.toLanguageString(w.nextView,w.messages[w.nextView]),V=!this.canNavigate(C.Action.PrevView),b=!this.canNavigate(C.Action.NextView),e={"aria-disabled":V},t={"aria-disabled":b},h=this.lastView!==s,c=this.dates&&this.isInMonth(this.state.navigateDate,this.dates[0]),g=this.lastViewsCount!==this.props.views;(!c||h||g)&&(this.dates=this.service.datesList(this.state.navigateDate,this.props.views||x.HorizontalViewList.defaultProps.views));const o=r.cloneDate(this.dates&&this.dates[0]?this.dates[0]:n.getToday());return p.createElement("div",{ref:m=>{this._element=m},className:u,id:this.props.id||this.wrapperID,"aria-labelledby":this.props.ariaLabelledBy,"aria-describedby":this.props.ariaDescribedBy,tabIndex:this.props.disabled?void 0:this.props.tabIndex,onFocus:this.handleFocus,onBlur:this.handleBlur,onMouseDown:this.handleMouseDown,onClick:this.handleClick,onKeyDown:this.handleKeyDown,"aria-disabled":this.props.disabled,dir:this.props.dir},p.createElement(_.Header,{key:`.kendo.calendar.header.${o.getTime()}`,activeView:s,currentDate:o,min:this.min,max:this.max,rangeLength:this.props.views,bus:this.bus,service:this.service,headerTitle:this.props.headerTitle,verticalView:this.props.mobileMode,commands:p.createElement(p.Fragment,null,p.createElement(O.Button,{type:"button",className:"k-calendar-nav-prev",icon:this.isRtl?"chevron-right":"chevron-left",svgIcon:this.isRtl?R.chevronRightIcon:R.chevronLeftIcon,fillMode:"flat",title:y,disabled:V,onClick:this.handlePrevButtonClick,...e}),p.createElement(H.TodayCommand,{min:this.min,max:this.max,onClick:this.handleTodayClick,disabled:!this.todayIsInRange}),p.createElement(O.Button,{type:"button",className:"k-calendar-nav-next",icon:this.isRtl?"chevron-left":"chevron-right",svgIcon:this.isRtl?R.chevronLeftIcon:R.chevronRightIcon,fillMode:"flat",title:E,disabled:b,onClick:this.handleNextButtonClick,...t}))}),p.createElement(x.HorizontalViewList,{ref:m=>{this.calendarViewList=m},dates:this.dates,activeView:s,focusedDate:this.focusedDate,min:this.min,max:this.max,bus:this.bus,service:this.service,selectionRange:D,value:this.selectedMultiple||this.selectedDate,cellUID:this.cellUID,views:this.props.views,onChange:this.handleDateChange,showWeekNumbers:this.props.weekNumber,onCellEnter:this.handleCellEnter,cell:this.props.cell,weekCell:this.props.weekCell,headerTitle:this.props.headerTitle,verticalView:this.props.mobileMode}))}isInMonth(s,a){return!!a&&r.firstDayOfMonth(a)<=s&&s<=r.lastDayOfMonth(a)}};d.displayName="MultiViewCalendar",d.propTypes={activeRangeEnd:i.oneOf(["start","end"]),allowReverse:i.bool,bottomView:i.oneOf(["month","year","decade","century"]),className:i.string,defaultActiveView:i.oneOf(["month","year","decade","century"]),defaultValue:i.oneOfType([n.nullable(i.instanceOf(Date)),i.arrayOf(i.instanceOf(Date)),i.shape({start:n.nullable(i.instanceOf(Date)),end:n.nullable(i.instanceOf(Date))})]),disabled:i.bool,focusedDate:i.instanceOf(Date),id:i.string,ariaLabelledBy:i.string,ariaDescribedBy:i.string,max:i.instanceOf(Date),min:i.instanceOf(Date),mode:i.oneOf(["single","multiple","range"]),onBlur:i.func,onChange:i.func,onFocus:i.func,tabIndex:i.number,topView:i.oneOf(["month","year","decade","century"]),value:i.oneOfType([n.nullable(i.instanceOf(Date)),i.arrayOf(i.instanceOf(Date)),i.shape({start:n.nullable(i.instanceOf(Date).isRequired),end:n.nullable(i.instanceOf(Date).isRequired)})]),views:(s,a,u)=>{const D=s[a];return D!==void 0&&D<1?new Error(`Invalid prop '${a}' supplied to'${u}'. The '${a}' property cannot be less than 1'`):null},weekNumber:i.bool,dir:i.string},d.defaultProps={disabled:!1,min:n.MIN_DATE,max:n.MAX_DATE,navigation:!0,defaultActiveView:"month",defaultValue:null,topView:"century",tabIndex:0,bottomView:"month",views:2,allowReverse:!1};let v=d;const N=f.createPropsContext(),P=f.withIdHOC(f.withPropsContext(N,v));P.displayName="KendoReactMultiViewCalendar";I.registerForIntl(v);I.registerForLocalization(v);exports.MultiViewCalendar=P;exports.MultiViewCalendarPropsContext=N;exports.MultiViewCalendarWithoutContext=v;

package/calendar/components/MultiViewCalendar.mjs

@@ -0,0 +1,428 @@
+/**
+ * @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";
+import * as d from "react";
+import s from "prop-types";
+import { provideIntlService as q, provideLocalizationService as H, registerForIntl as j, registerForLocalization as G } from "@progress/kendo-react-intl";
+import { Keys as E, 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 { Action as y } from "../models/NavigationAction.mjs";
+import { CalendarViewEnum as I } 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 { 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 le } from "./TodayCommand.mjs";
+const k = (o = p.defaultProps.min, i = p.defaultProps.max, a) => a instanceof Date && !Array.isArray(a) && A(f(a), o, i) ? f(a) : null, _ = (o = p.defaultProps.min, i = p.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, re = (o, i) => o.start === null && i === null ? "start" : o.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();
+    }, this.clampRange = (e) => ({ start: e, end: null }), this.rangeWithFocused = (e, t) => ({
+      start: e.start,
+      end: e.end === null && e.start !== null && this.isActive ? t : e.end
+    }), this.generateRange = (e, t) => {
+      const { end: r, start: l } = t, m = t.start !== null && e.getTime() <= t.start.getTime();
+      return !this.props.allowReverse && m ? { start: e, end: this.selectedRange.start } : this.activeRange !== "end" ? { start: e, end: r } : { start: l || this.selectedDate, end: e };
+    }, this.canNavigate = (e) => {
+      if (!this.service)
+        return !1;
+      const t = this.service.move(this.focusedDate, e);
+      return this.min <= t && t <= this.max || this.service.isInSameView(t, this.min) || this.service.isInSameView(t, this.max);
+    }, this.navigate = (e, t) => {
+      this.calculateFocusFromValue = !1;
+      const r = this.move(e, t);
+      this.setState({ navigateDate: r, focusedDate: r });
+    }, this.move = (e, t) => this.clampDate(this.service.move(t, e)), this.clampDate = (e) => R(e, this.min, this.max), this.shouldAutoCorrect = (e, t) => {
+      const { end: r, start: l } = t;
+      return this.activeRange !== "end" ? r !== null && e > r : l !== null && e < l;
+    }, this.handleCellEnter = (e) => {
+      this.props.mode === "range" && (this.calculateFocusFromValue = !1, this.setState({
+        focusedDate: e
+      }));
+    }, this.handleMouseDown = (e) => {
+      e.preventDefault();
+    }, this.handleClick = (e) => {
+      this._element && this._element.focus({ preventScroll: !0 });
+    }, this.handleFocus = (e) => {
+      if (this.isActive = !0, !this.calendarViewList)
+        return;
+      this.calendarViewList.focusActiveDate();
+      const { onFocus: t } = this.props;
+      t && t.call(void 0, e);
+    }, this.handleBlur = (e) => {
+      if (this.isActive = !1, !this.calendarViewList)
+        return;
+      this.calendarViewList.blurActiveDate();
+      const { onBlur: t } = this.props;
+      t && t.call(void 0, e);
+    }, this.handleTodayClick = (e) => {
+      this.todayIsInRange && this.handleDateChange(e);
+    }, this.handlePrevButtonClick = () => {
+      const e = y.PrevView;
+      if (this.state.activeView > 0 && this.focusedDate.getFullYear() > this.dates[0].getFullYear())
+        this.navigate(e, this.move(e, this.focusedDate));
+      else {
+        const t = this.isInMonth(this.focusedDate, this.dates[1]) ? this.move(e, this.focusedDate) : this.focusedDate;
+        this.navigate(e, t);
+      }
+    }, this.handleNextButtonClick = () => {
+      this.navigate(y.NextView, this.focusedDate);
+    }, this.handleKeyDown = (e) => {
+      const { keyCode: r, ctrlKey: l, metaKey: m } = e;
+      if (r === 84) {
+        const n = C();
+        this.calculateFocusFromValue = !1, this.setState({ focusedDate: n, navigateDate: n });
+      }
+      if ((l || m) && (r === E.left && this.handlePrevButtonClick(), r === E.right && this.handleNextButtonClick()), r === E.enter) {
+        const n = {
+          syntheticEvent: e,
+          nativeEvent: e.nativeEvent,
+          value: this.focusedDate,
+          target: this
+        };
+        this.handleDateChange(n);
+      } else {
+        const n = R(
+          this.navigation.move(
+            this.focusedDate,
+            this.navigation.action(e),
+            this.state.activeView,
+            this.service,
+            e
+          ),
+          this.min,
+          this.max
+        );
+        if (O(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 });
+      }
+      e.preventDefault();
+    }, this.handleViewChange = ({ view: e }) => {
+      this.calculateFocusFromValue = !1, this.setState((t) => ({ activeView: e, navigateDate: t.focusedDate }));
+    }, this.handleDateChange = (e) => {
+      const t = u(e.value), r = this.bus.canMoveDown(this.state.activeView);
+      if (this.props.disabled)
+        return;
+      if (r)
+        if (e.isTodayClick)
+          this.bus.moveToBottom(this.state.activeView);
+        else {
+          this.bus.moveDown(this.state.activeView, e.syntheticEvent), this.setState({ focusedDate: t, navigateDate: t });
+          return;
+        }
+      this.calculateFocusFromValue = !0;
+      let l;
+      switch (this.props.mode) {
+        case "single":
+          l = 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)), l = n.slice();
+          } else
+            this.selectedDate ? l = [u(this.selectedDate), u(e.value)] : l = [u(e.value)];
+          break;
+        case "range": {
+          l = 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:
+          l = u(e.value);
+          break;
+      }
+      this.valueDuringOnChange = l, e.isTodayClick && this.setState({ navigateDate: t }), this.setState({ value: l, focusedDate: t }), this.valueDuringOnChange = l;
+      const { onChange: m } = this.props;
+      if (m) {
+        const n = {
+          syntheticEvent: e.syntheticEvent,
+          nativeEvent: e.nativeEvent,
+          value: l,
+          target: this
+        };
+        m.call(void 0, n);
+      }
+      this.valueDuringOnChange = void 0;
+    };
+    const a = i.value !== void 0 ? i.value : i.defaultValue || c.defaultProps.defaultValue, h = k(this.min, this.max, a), g = _(this.min, this.max, a), b = K(a), F = z(h, g, b), w = P(
+      I[i.defaultActiveView],
+      this.bottomView,
+      this.topView
+    ), V = R(
+      i.focusedDate || F || C(),
+      this.min,
+      this.max
+    );
+    this.state = {
+      value: a,
+      activeView: w,
+      focusedDate: V,
+      navigateDate: V
+    }, 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";
+  }
+  get isRtl() {
+    return this.props.dir === "rtl";
+  }
+  /**
+   * Gets the wrapping element of the MultiViewCalendar component.
+   */
+  get element() {
+    return this._element;
+  }
+  /**
+   * Gets the value of the MultiViewCalendar.
+   */
+  get value() {
+    return this.valueDuringOnChange !== void 0 ? this.valueDuringOnChange : this.props.value !== void 0 ? this.props.value : this.state.value;
+  }
+  /**
+   * Gets the current focused date of the MultiViewCalendar.
+   */
+  get focusedDate() {
+    return u(this._focusedDate);
+  }
+  get min() {
+    return f(this.props.min !== void 0 ? this.props.min : c.defaultProps.min);
+  }
+  get max() {
+    return f(this.props.max !== void 0 ? this.props.max : c.defaultProps.max);
+  }
+  get bottomView() {
+    return I[this.props.bottomView !== void 0 ? this.props.bottomView : c.defaultProps.bottomView];
+  }
+  get topView() {
+    return I[this.props.topView !== void 0 ? this.props.topView : c.defaultProps.topView];
+  }
+  get activeRange() {
+    return this.props.activeRangeEnd !== void 0 ? this.props.activeRangeEnd : this.activeRangeEnd;
+  }
+  get todayIsInRange() {
+    return A(C(), f(this.min), f(this.max));
+  }
+  /**
+   * @hidden
+   */
+  componentDidMount() {
+    this.calculateFocusFromValue = !0;
+  }
+  /**
+   * @hidden
+   */
+  componentDidUpdate() {
+    this.calendarViewList && (this.isActive ? this.calendarViewList.focusActiveDate : this.calendarViewList.blurActiveDate)();
+    const i = k(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;
+  }
+  /**
+   * @hidden
+   */
+  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 = k(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,
+      this.min,
+      this.max
+    );
+    const h = X(
+      "k-widget k-calendar k-calendar-range",
+      {
+        "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 }, t = { "aria-disabled": V }, r = this.lastView !== i, l = this.dates && this.isInMonth(this.state.navigateDate, this.dates[0]), m = this.lastViewsCount !== this.props.views;
+    (!l || r || m) && (this.dates = this.service.datesList(
+      this.state.navigateDate,
+      this.props.views || x.defaultProps.views
+    ));
+    const n = u(this.dates && this.dates[0] ? this.dates[0] : C());
+    return /* @__PURE__ */ d.createElement(
+      "div",
+      {
+        ref: (v) => {
+          this._element = v;
+        },
+        className: h,
+        id: this.props.id || this.wrapperID,
+        "aria-labelledby": this.props.ariaLabelledBy,
+        "aria-describedby": this.props.ariaDescribedBy,
+        tabIndex: this.props.disabled ? void 0 : this.props.tabIndex,
+        onFocus: this.handleFocus,
+        onBlur: this.handleBlur,
+        onMouseDown: this.handleMouseDown,
+        onClick: this.handleClick,
+        onKeyDown: this.handleKeyDown,
+        "aria-disabled": this.props.disabled,
+        dir: this.props.dir
+      },
+      /* @__PURE__ */ d.createElement(
+        te,
+        {
+          key: `.kendo.calendar.header.${n.getTime()}`,
+          activeView: i,
+          currentDate: n,
+          min: this.min,
+          max: this.max,
+          rangeLength: this.props.views,
+          bus: this.bus,
+          service: this.service,
+          headerTitle: this.props.headerTitle,
+          verticalView: this.props.mobileMode,
+          commands: /* @__PURE__ */ d.createElement(d.Fragment, null, /* @__PURE__ */ d.createElement(
+            T,
+            {
+              type: "button",
+              className: "k-calendar-nav-prev",
+              icon: this.isRtl ? "chevron-right" : "chevron-left",
+              svgIcon: this.isRtl ? M : N,
+              fillMode: "flat",
+              title: b,
+              disabled: w,
+              onClick: this.handlePrevButtonClick,
+              ...e
+            }
+          ), /* @__PURE__ */ d.createElement(
+            le,
+            {
+              min: this.min,
+              max: this.max,
+              onClick: this.handleTodayClick,
+              disabled: !this.todayIsInRange
+            }
+          ), /* @__PURE__ */ d.createElement(
+            T,
+            {
+              type: "button",
+              className: "k-calendar-nav-next",
+              icon: this.isRtl ? "chevron-left" : "chevron-right",
+              svgIcon: this.isRtl ? N : M,
+              fillMode: "flat",
+              title: F,
+              disabled: V,
+              onClick: this.handleNextButtonClick,
+              ...t
+            }
+          ))
+        }
+      ),
+      /* @__PURE__ */ d.createElement(
+        x,
+        {
+          ref: (v) => {
+            this.calendarViewList = v;
+          },
+          dates: this.dates,
+          activeView: i,
+          focusedDate: this.focusedDate,
+          min: this.min,
+          max: this.max,
+          bus: this.bus,
+          service: this.service,
+          selectionRange: g,
+          value: this.selectedMultiple || this.selectedDate,
+          cellUID: this.cellUID,
+          views: this.props.views,
+          onChange: this.handleDateChange,
+          showWeekNumbers: this.props.weekNumber,
+          onCellEnter: this.handleCellEnter,
+          cell: this.props.cell,
+          weekCell: this.props.weekCell,
+          headerTitle: this.props.headerTitle,
+          verticalView: this.props.mobileMode
+        }
+      )
+    );
+  }
+  // protected isListInRange = (list: Date[]): boolean => {
+  //     return this.min < list[0]
+  //         && this.max > list[Math.max(0, (this.props.views || MultiViewCalendarWithoutContext.defaultProps.views) - 1)];
+  // };
+  isInMonth(i, a) {
+    return !!a && W(a) <= i && i <= ee(a);
+  }
+};
+c.displayName = "MultiViewCalendar", c.propTypes = {
+  activeRangeEnd: s.oneOf(["start", "end"]),
+  allowReverse: s.bool,
+  bottomView: s.oneOf(["month", "year", "decade", "century"]),
+  className: s.string,
+  defaultActiveView: s.oneOf(["month", "year", "decade", "century"]),
+  defaultValue: s.oneOfType([
+    D(s.instanceOf(Date)),
+    s.arrayOf(s.instanceOf(Date)),
+    s.shape({
+      start: D(s.instanceOf(Date)),
+      end: D(s.instanceOf(Date))
+    })
+  ]),
+  disabled: s.bool,
+  focusedDate: s.instanceOf(Date),
+  id: s.string,
+  ariaLabelledBy: s.string,
+  ariaDescribedBy: s.string,
+  max: s.instanceOf(Date),
+  min: s.instanceOf(Date),
+  mode: s.oneOf(["single", "multiple", "range"]),
+  onBlur: s.func,
+  onChange: s.func,
+  onFocus: s.func,
+  tabIndex: s.number,
+  topView: s.oneOf(["month", "year", "decade", "century"]),
+  value: s.oneOfType([
+    D(s.instanceOf(Date)),
+    s.arrayOf(s.instanceOf(Date)),
+    s.shape({
+      start: D(s.instanceOf(Date).isRequired),
+      end: D(s.instanceOf(Date).isRequired)
+    })
+  ]),
+  views: (i, a, h) => {
+    const g = i[a];
+    return g !== void 0 && g < 1 ? new Error(
+      `Invalid prop '${a}' supplied to'${h}'. The '${a}' property cannot be less than 1'`
+    ) : null;
+  },
+  weekNumber: s.bool,
+  dir: s.string
+}, c.defaultProps = {
+  disabled: !1,
+  min: se,
+  max: ie,
+  navigation: !0,
+  defaultActiveView: "month",
+  defaultValue: null,
+  topView: "century",
+  tabIndex: 0,
+  bottomView: "month",
+  views: 2,
+  allowReverse: !1
+};
+let p = c;
+const oe = J(), he = Q(Z(oe, p));
+he.displayName = "KendoReactMultiViewCalendar";
+j(p);
+G(p);
+export {
+  he as MultiViewCalendar,
+  oe as MultiViewCalendarPropsContext,
+  p as MultiViewCalendarWithoutContext
+};