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

package/calendar/services/MonthViewService.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 n=require("@progress/kendo-date-math"),l=require("../models/NavigationAction.js"),N=require("../models/SelectionRange.js"),u=require("../../utils.js"),b=[[]],f=7,v=6,p=6,O=0,V={[l.Action.Left]:r=>n.addDays(r,-1),[l.Action.Up]:r=>n.addWeeks(r,-1),[l.Action.Right]:r=>n.addDays(r,1),[l.Action.Down]:r=>n.addWeeks(r,1),[l.Action.PrevView]:r=>n.addMonths(r,-1),[l.Action.NextView]:r=>n.addMonths(r,1),[l.Action.FirstInView]:r=>n.firstDayOfMonth(r),[l.Action.LastInView]:r=>n.lastDayOfMonth(r)};class k{constructor(t){this.intl=t}addToDate(t,e){return n.addMonths(t,e)}datesList(t,e){return u.range(0,e).map(i=>n.addMonths(t,i))}data(t){const{cellUID:e,focusedDate:i,isActiveView:h,max:a,min:o,selectedDate:c,selectionRange:d=N.EMPTY_SELECTIONRANGE,viewDate:g}=t;if(!g)return b;const M=n.firstDayOfMonth(g),y=n.lastDayOfMonth(g),A=n.dayOfWeek(M,this.intl.firstDay(),-1),w=u.range(0,f),E=u.getToday();return u.range(0,v).map(T=>{const I=n.addDays(A,T*f);return w.map(R=>{const s=this.normalize(n.addDays(I,R),o,a);if(s<M||s>y)return null;const m=this.isEqual(s,d.start),S=this.isEqual(s,d.end),D=!m&&!S&&u.isInSelectionRange(s,d),q=h&&(Array.isArray(c)?this.isSelectedFromArray(s,c,o,a):u.isInRange(c,o,a)&&this.isEqual(s,c));return{formattedValue:this.value(s),id:`${e}${s.getTime()}`,isFocused:this.isEqual(s,i),isSelected:q,isInRange:u.isInRange(s,o,a),isWeekend:this.isWeekend(s),isRangeStart:m,isRangeMid:D,isRangeEnd:S,isRangeSplitStart:D&&this.isEqual(s,M),isRangeSplitEnd:D&&this.isEqual(s,y),isToday:this.isEqual(s,E),title:this.cellTitle(s),value:s}})})}isEqual(t,e){return!t||!e?!1:n.getDate(t).getTime()===n.getDate(e).getTime()}isSelectedFromArray(t,e,i,h){let a=!1;return e.forEach(o=>{u.isInRange(t,i,h)&&this.isEqual(t,o)&&(a=!0)}),a}isInArray(t,e){return!!e.length&&n.firstDayOfMonth(e[0])<=t&&t<=n.lastDayOfMonth(e[e.length-1])}isInRange(t,e,i){const h=n.getDate(t),a=!e||n.getDate(e)<=h,o=!i||h<=n.getDate(i);return a&&o}isInSameView(t,e){return n.durationInMonths(t,e)===0}isRangeStart(t){return!t.getMonth()}move(t,e){const i=V[e];return i?i(t):t}cellTitle(t){return this.intl.formatDate(t,"D")}navigationTitle(t){return t?this.isRangeStart(t)?t.getFullYear().toString():this.abbrMonthNames()[t.getMonth()]:""}title(t){return`${this.wideMonthNames()[t.getMonth()]} ${t.getFullYear()}`}rowLength(t){return f+(t?1:0)}skip(t,e){return n.durationInMonths(e,t)}total(t,e){return n.durationInMonths(t,e)+1}value(t){return t?t.getDate().toString():""}viewDate(t,e,i=1){return n.durationInMonths(t,e)<i?n.addMonths(t,-1):t}isWeekend(t){const e=t.getDay();return e===p||e===O}abbrMonthNames(){return this.intl.dateFormatNames({nameType:"abbreviated",type:"months"})}normalize(t,e,i){return t<e&&this.isEqual(t,e)?n.getDate(e):t>i&&this.isEqual(t,i)?n.getDate(i):t}wideMonthNames(){return this.intl.dateFormatNames({nameType:"wide",type:"months",standAlone:!0})}}exports.MonthViewService=k;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("@progress/kendo-date-math"),l=require("../models/NavigationAction.js"),b=require("../models/SelectionRange.js"),h=require("../../utils.js"),v=[[]],f=7,O=6,p=6,V=0,k={[l.Action.Left]:a=>n.addDays(a,-1),[l.Action.Up]:a=>n.addWeeks(a,-1),[l.Action.Right]:a=>n.addDays(a,1),[l.Action.Down]:a=>n.addWeeks(a,1),[l.Action.PrevView]:a=>n.addMonths(a,-1),[l.Action.NextView]:a=>n.addMonths(a,1),[l.Action.FirstInView]:a=>n.firstDayOfMonth(a),[l.Action.LastInView]:a=>n.lastDayOfMonth(a)};class L{constructor(t){this.intl=t}addToDate(t,e){return n.addMonths(t,e)}datesList(t,e){return h.range(0,e).map(i=>n.addMonths(t,i))}data(t){const{cellUID:e,focusedDate:i,isActiveView:u,max:r,min:o,selectedDate:c,selectionRange:d=b.EMPTY_SELECTIONRANGE,viewDate:g}=t;if(!g)return v;const M=n.firstDayOfMonth(g),y=n.lastDayOfMonth(g),A=n.dayOfWeek(M,this.intl.firstDay(),-1),w=h.range(0,f),E=h.getToday();return h.range(0,O).map(T=>{const I=n.addDays(A,T*f);return w.map(R=>{const s=this.normalize(n.addDays(I,R),o,r),q=s<M||s>y,m=this.isEqual(s,d.start),S=this.isEqual(s,d.end),D=!m&&!S&&h.isInSelectionRange(s,d),N=u&&(Array.isArray(c)?this.isSelectedFromArray(s,c,o,r):h.isInRange(c,o,r)&&this.isEqual(s,c));return{formattedValue:this.value(s),id:`${e}${s.getTime()}`,isFocused:this.isEqual(s,i),isSelected:N,isInRange:h.isInRange(s,o,r),isWeekend:this.isWeekend(s),isRangeStart:m,isRangeMid:D,isRangeEnd:S,isRangeSplitStart:D&&this.isEqual(s,M),isRangeSplitEnd:D&&this.isEqual(s,y),isToday:this.isEqual(s,E),title:this.cellTitle(s),value:s,isOtherMonth:q}})})}isEqual(t,e){return!t||!e?!1:n.getDate(t).getTime()===n.getDate(e).getTime()}isSelectedFromArray(t,e,i,u){let r=!1;return e.forEach(o=>{h.isInRange(t,i,u)&&this.isEqual(t,o)&&(r=!0)}),r}isInArray(t,e){return!!e.length&&n.firstDayOfMonth(e[0])<=t&&t<=n.lastDayOfMonth(e[e.length-1])}isInRange(t,e,i){const u=n.getDate(t),r=!e||n.getDate(e)<=u,o=!i||u<=n.getDate(i);return r&&o}isInSameView(t,e){return n.durationInMonths(t,e)===0}isRangeStart(t){return!t.getMonth()}move(t,e){const i=k[e];return i?i(t):t}cellTitle(t){return this.intl.formatDate(t,"D")}navigationTitle(t){return t?this.isRangeStart(t)?t.getFullYear().toString():this.abbrMonthNames()[t.getMonth()]:""}title(t){return`${this.wideMonthNames()[t.getMonth()]} ${t.getFullYear()}`}rowLength(t){return f+(t?1:0)}skip(t,e){return n.durationInMonths(e,t)}total(t,e){return n.durationInMonths(t,e)+1}value(t){return t?t.getDate().toString():""}viewDate(t,e,i=1){return n.durationInMonths(t,e)<i?n.addMonths(t,-1):t}isWeekend(t){const e=t.getDay();return e===p||e===V}abbrMonthNames(){return this.intl.dateFormatNames({nameType:"abbreviated",type:"months"})}normalize(t,e,i){return t<e&&this.isEqual(t,e)?n.getDate(e):t>i&&this.isEqual(t,i)?n.getDate(i):t}wideMonthNames(){return this.intl.dateFormatNames({nameType:"wide",type:"months",standAlone:!0})}}exports.MonthViewService=L;

package/calendar/services/MonthViewService.mjs

@@ -6,11 +6,11 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import { addDays as g, addWeeks as I, addMonths as h, firstDayOfMonth as y, lastDayOfMonth as D, dayOfWeek as F, getDate as u, durationInMonths as d } from "@progress/kendo-date-math";
+import { addDays as g, addWeeks as I, addMonths as h, firstDayOfMonth as y, lastDayOfMonth as D, dayOfWeek as O, getDate as u, durationInMonths as d } from "@progress/kendo-date-math";
 import { Action as o } from "../models/NavigationAction.mjs";
-import { EMPTY_SELECTIONRANGE as O } from "../models/SelectionRange.mjs";
-import { range as w, getToday as W, isInRange as T, isInSelectionRange as Y } from "../../utils.mjs";
-const U = [[]], S = 7, _ = 6, $ = 6, C = 0, G = {
+import { EMPTY_SELECTIONRANGE as W } from "../models/SelectionRange.mjs";
+import { range as w, getToday as Y, isInRange as T, isInSelectionRange as U } from "../../utils.mjs";
+const _ = [[]], S = 7, $ = 6, C = 6, G = 0, P = {
   [o.Left]: (s) => g(s, -1),
   [o.Up]: (s) => I(s, -1),
   [o.Right]: (s) => g(s, 1),
@@ -38,24 +38,21 @@ class Q {
       max: r,
       min: a,
       selectedDate: c,
-      selectionRange: m = O,
+      selectionRange: m = W,
       viewDate: f
     } = t;
     if (!f)
-      return U;
-    const M = y(f), R = D(f), N = F(M, this.intl.firstDay(), -1), b = w(0, S), q = W();
-    return w(0, _).map((V) => {
+      return _;
+    const M = y(f), R = D(f), N = O(M, this.intl.firstDay(), -1), b = w(0, S), q = Y();
+    return w(0, $).map((V) => {
       const v = g(N, V * S);
       return b.map((L) => {
-        const i = this.normalize(g(v, L), a, r);
-        if (i < M || i > R)
-          return null;
-        const p = this.isEqual(i, m.start), A = this.isEqual(i, m.end), E = !p && !A && Y(i, m), k = l && (Array.isArray(c) ? this.isSelectedFromArray(i, c, a, r) : T(c, a, r) && this.isEqual(i, c));
+        const i = this.normalize(g(v, L), a, r), k = i < M || i > R, p = this.isEqual(i, m.start), A = this.isEqual(i, m.end), E = !p && !A && U(i, m), F = l && (Array.isArray(c) ? this.isSelectedFromArray(i, c, a, r) : T(c, a, r) && this.isEqual(i, c));
         return {
           formattedValue: this.value(i),
           id: `${e}${i.getTime()}`,
           isFocused: this.isEqual(i, n),
-          isSelected: k,
+          isSelected: F,
           isInRange: T(i, a, r),
           isWeekend: this.isWeekend(i),
           isRangeStart: p,
@@ -65,7 +62,8 @@ class Q {
           isRangeSplitEnd: E && this.isEqual(i, R),
           isToday: this.isEqual(i, q),
           title: this.cellTitle(i),
-          value: i
+          value: i,
+          isOtherMonth: k
         };
       });
     });
@@ -93,7 +91,7 @@ class Q {
     return !t.getMonth();
   }
   move(t, e) {
-    const n = G[e];
+    const n = P[e];
     return n ? n(t) : t;
   }
   cellTitle(t) {
@@ -122,7 +120,7 @@ class Q {
   }
   isWeekend(t) {
     const e = t.getDay();
-    return e === $ || e === C;
+    return e === C || e === G;
   }
   abbrMonthNames() {
     return this.intl.dateFormatNames({ nameType: "abbreviated", type: "months" });

package/datepicker/DatePicker.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 W=require("react"),e=require("prop-types"),_=require("@progress/kendo-react-popup"),I=require("@progress/kendo-date-math"),n=require("@progress/kendo-react-common"),U=require("@progress/kendo-svg-icons"),j=require("../package-metadata.js"),$=require("../dateinput/DateInput.js"),H=require("../calendar/components/Calendar.js"),m=require("../utils.js"),D=require("../messages/index.js"),q=require("@progress/kendo-react-intl"),X=require("./ToggleButton.js"),Z=require("../common/PickerWrap.js"),G=require("../hooks/usePickerFloatingLabel.js"),J=require("@progress/kendo-react-layout"),Q=require("../common/AdaptiveMode.js"),Y=require("../common/constants.js");function ee(l){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const t in l)if(t!=="default"){const i=Object.getOwnPropertyDescriptor(l,t);Object.defineProperty(s,t,i.get?i:{enumerable:!0,get:()=>l[t]})}}return s.default=l,Object.freeze(s)}const r=ee(W),o=class o extends r.Component{constructor(s){super(s),this._element=null,this._dateInput=r.createRef(),this._calendar=null,this.shouldFocusDateInput=!1,this.prevShow=!1,this.focus=()=>{this.dateInput&&this.dateInput.focus()},this.setCalendarRef=t=>{this._calendar=t},this.nextValue=(t,i)=>t.value!==void 0?t.value:i.value,this.nextShow=(t,i)=>t.show!==void 0?t.show:i.show,this.renderPopup=()=>{const{disabled:t,min:i,max:a,weekNumber:g,focusedDate:f,popupSettings:d}=this.props,{popupClass:v,...w}=d,b=this.show,h=this.value,y=h&&I.getDate(h),p=n.classNames(v),C={popupClass:"k-datepicker-popup",show:b,anchor:this._element,className:p,id:this._popupId,anchorAlign:{horizontal:"left",vertical:"bottom"},popupAlign:{horizontal:"left",vertical:"top"},...w},c={disabled:t,value:y,min:i,max:a,weekNumber:g,focusedDate:f,className:this.mobileMode?"k-calendar-lg":"",navigation:!this.mobileMode,onChange:this.handleCalendarValueChange};return this.mobileMode?r.createElement(this.calendarComp,{_ref:this.setCalendarRef,...c}):r.createElement(this.popupComp,{...C},r.createElement(this.calendarComp,{_ref:this.setCalendarRef,...c}))},this.renderAdaptivePopup=()=>{const{windowWidth:t=0}=this.state,i={expand:this.show,onClose:this.handleBlur,adaptiveTitle:this.props.adaptiveTitle,windowWidth:t};return r.createElement(Q.AdaptiveMode,{...i},r.createElement(J.ActionSheetContent,{className:"!k-overflow-hidden"},this.renderPopup()))},this.handleInputValueChange=t=>{this.handleValueChange(t.value,t)},this.handleCalendarValueChange=t=>{const i=this.mergeTime(t.value);this.handleValueChange(i,t)},this.handleValueChange=(t,i)=>{this.setState({value:I.cloneDate(t||void 0)}),this.valueDuringOnChange=t,this.showDuringOnChange=!1,this.mobileMode||(this.shouldFocusDateInput=!0);const{onChange:a}=this.props;a&&a.call(void 0,{syntheticEvent:i.syntheticEvent,nativeEvent:i.nativeEvent,value:this.value,show:this.show,target:this}),this.valueDuringOnChange=void 0,this.showDuringOnChange=void 0,this.setShow(!1)},this.handleFocus=()=>{this.setState({focused:!0})},this.handleBlur=()=>{this.setState({focused:!1}),this.setShow(!1)},this.handleIconClick=()=>{this.props.disabled||(this.shouldFocusDateInput=!0,this.setShow(!this.show))},this.handleIconMouseDown=t=>{t.preventDefault()},this.handleKeyDown=t=>{const{altKey:i,keyCode:a}=t;if(a===n.Keys.esc){this.shouldFocusDateInput=!0,this.setShow(!1);return}i&&(a===n.Keys.up||a===n.Keys.down)&&(t.preventDefault(),t.stopPropagation(),this.shouldFocusDateInput=a===n.Keys.up,this.setShow(a===n.Keys.down))},n.validatePackage(j.packageMetadata),this.state={value:this.props.defaultValue||o.defaultProps.defaultValue,show:this.props.defaultShow||o.defaultProps.defaultShow,focused:!1}}get _popupId(){return this.props.id+"-popup-id"}get document(){if(n.canUseDOM)return this.element&&this.element.ownerDocument||document}get element(){return this._element}get mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=Y.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}get dateInput(){return this._dateInput.current}get calendar(){return this._calendar}get value(){const s=this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value;return s!==null?I.cloneDate(s):null}get show(){return this.showDuringOnChange!==void 0?this.showDuringOnChange:this.props.show!==void 0?this.props.show:this.state.show}get name(){return this.props.name}get min(){return this.props.min!==void 0?this.props.min:o.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:o.defaultProps.max}get dateInputComp(){return this.props.dateInput||o.defaultProps.dateInput}get toggleButtonComp(){return this.props.toggleButton||o.defaultProps.toggleButton}get calendarComp(){return this.props.calendar||o.defaultProps.calendar}get popupComp(){return this.props.popup||o.defaultProps.popup}get pickerWrapComp(){return this.props.pickerWrap||o.defaultProps.pickerWrap}get validity(){const s=m.isInDateRange(this.value,this.min,this.max),t=this.props.validationMessage!==void 0,i=(!this.required||this.value!==null)&&s,a=this.props.valid!==void 0?this.props.valid:i;return{customError:t,rangeOverflow:this.value&&this.max.getTime()<this.value.getTime()||!1,rangeUnderflow:this.value&&this.value.getTime()<this.min.getTime()||!1,valid:a,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:o.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:o.defaultProps.required}componentDidMount(){var s;this.observerResize=n.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.show&&this.forceUpdate(),(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentDidUpdate(){this._calendar&&this._calendar.element&&this.show&&!this.prevShow&&this._calendar.element.focus({preventScroll:!0}),this.dateInput&&this.dateInput.element&&!this.show&&this.shouldFocusDateInput&&this.dateInput.element.focus({preventScroll:!0}),this.prevShow=this.show,this.shouldFocusDateInput=!1}componentWillUnmount(){var s;clearTimeout(this.nextTickId),(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.disconnect()}render(){const{size:s=o.defaultProps.size,rounded:t=o.defaultProps.rounded,fillMode:i=o.defaultProps.fillMode,disabled:a,tabIndex:g,title:f,id:d,format:v,formatPlaceholder:w,min:b,max:h,className:y,width:p,name:C,validationMessage:c,required:E,validityStyles:R,ariaLabelledBy:z,ariaDescribedBy:F,ariaLabel:N,placeholder:V,label:k,popupSettings:te,defaultValue:se,defaultShow:ie,value:oe,popup:ae,weekNumber:ne,dateInput:re,calendar:le,toggleButton:ue,onChange:de,onBlur:he,onFocus:pe,show:ce,onOpen:me,pickerWrap:ge,...O}=this.props,A=this.value,S=!this.validityStyles||this.validity.valid,L={disabled:a,format:v,formatPlaceholder:w,id:d,ariaLabelledBy:z,ariaDescribedBy:F,ariaLabel:N,max:h,min:b,name:C,onChange:this.handleInputValueChange,required:E,tabIndex:this.show?-1:g,title:f,valid:this.validity.valid,validationMessage:c,validityStyles:R,value:A,label:void 0,placeholder:this.state.focused?null:V,ariaExpanded:this.show,size:null,fillMode:null,rounded:null},M=q.provideLocalizationService(this).toLanguageString(D.toggleCalendar,D.messages[D.toggleCalendar]),P=r.createElement(n.AsyncFocusBlur,{onFocus:this.handleFocus,onBlur:this.mobileMode?void 0:this.handleBlur,onSyncBlur:this.props.onBlur,onSyncFocus:this.props.onFocus},T=>r.createElement(r.Fragment,null,r.createElement("span",{...k?{}:O,ref:K=>{this._element=K},className:n.classNames("k-input","k-datepicker",{[`k-input-${n.kendoThemeMaps.sizeMap[s]||s}`]:s,[`k-rounded-${n.kendoThemeMaps.roundedMap[t]||t}`]:t,[`k-input-${i}`]:i,"k-invalid":!S,"k-required":this.required,"k-disabled":a},y),onKeyDown:this.handleKeyDown,style:{width:p},onFocus:T.onFocus,onBlur:T.onBlur,onClick:this.mobileMode?this.handleIconClick:void 0},r.createElement(this.dateInputComp,{_ref:this._dateInput,ariaRole:"combobox",readonly:this.mobileMode,ariaExpanded:this.show,ariaControls:this._popupId,...L}),r.createElement(this.toggleButtonComp,{type:"button",icon:"calendar",svgIcon:U.calendarIcon,title:M,className:"k-input-button",rounded:null,onClick:this.mobileMode?void 0:this.handleIconClick,"aria-label":M,onMouseDown:this.handleIconMouseDown}),!this.mobileMode&&this.renderPopup()),this.mobileMode&&this.renderAdaptivePopup()));return k?r.createElement(G.PickerFloatingLabel,{dateInput:this._dateInput,label:k,editorId:d,editorValid:S,editorDisabled:a,children:P,style:{width:p},...O}):P}setShow(s){const{onOpen:t,onClose:i}=this.props;this.show!==s&&(this.setState({show:s}),s&&t&&t.call(void 0,{target:this}),!s&&i&&i.call(void 0,{target:this}))}mergeTime(s){return this.value&&s?m.setTime(s,this.value):s}nextTick(s){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>s())}calculateMedia(s){for(let t of s)this.setState({windowWidth:t.target.clientWidth})}};o.displayName="DatePicker",o.propTypes={className:e.string,defaultShow:e.bool,defaultValue:e.instanceOf(Date),disabled:e.bool,focusedDate:e.instanceOf(Date),format:e.oneOfType([e.string,e.shape({skeleton:e.string,pattern:e.string,date:e.oneOf(["short","medium","long","full"]),time:e.oneOf(["short","medium","long","full"]),datetime:e.oneOf(["short","medium","long","full"]),era:e.oneOf(["narrow","short","long"]),year:e.oneOf(["numeric","2-digit"]),month:e.oneOf(["numeric","2-digit","narrow","short","long"]),day:e.oneOf(["numeric","2-digit"]),weekday:e.oneOf(["narrow","short","long"]),hour:e.oneOf(["numeric","2-digit"]),hour12:e.bool,minute:e.oneOf(["numeric","2-digit"]),second:e.oneOf(["numeric","2-digit"]),timeZoneName:e.oneOf(["short","long"])})]),formatPlaceholder:e.oneOfType([e.oneOf(["wide","narrow","short","formatPattern"]),e.shape({year:e.string,month:e.string,day:e.string,hour:e.string,minute:e.string,second:e.string})]),id:e.string,ariaLabelledBy:e.string,ariaDescribedBy:e.string,ariaLabel:e.string,min:e.instanceOf(Date),max:e.instanceOf(Date),name:e.string,popupSettings:e.shape({animate:e.bool,appendTo:e.any,popupClass:e.string}),show:e.bool,tabIndex:e.number,title:e.string,value:e.instanceOf(Date),weekNumber:e.bool,width:e.oneOfType([e.number,e.string]),validationMessage:e.string,required:e.bool,validate:e.bool,valid:e.bool,size:e.oneOf([null,"small","medium","large"]),rounded:e.oneOf([null,"small","medium","large","full"]),fillMode:e.oneOf([null,"solid","flat","outline"]),adaptive:e.bool,adaptiveTitle:e.string},o.defaultProps={defaultShow:!1,defaultValue:null,dateInput:$.DateInput,calendar:H.Calendar,toggleButton:X.ToggleButton,popup:_.Popup,pickerWrap:Z.PickerWrap,disabled:!1,format:"d",max:m.MAX_DATE,min:m.MIN_DATE,popupSettings:{},tabIndex:0,weekNumber:!1,required:!1,validityStyles:!0,size:"medium",rounded:"medium",fillMode:"solid"};let u=o;const x=n.createPropsContext(),B=n.withIdHOC(n.withPropsContext(x,u));B.displayName="KendoReactDatePicker";q.registerForLocalization(u);exports.DatePicker=B;exports.DatePickerPropsContext=x;exports.DatePickerWithoutContext=u;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const W=require("react"),e=require("prop-types"),_=require("@progress/kendo-react-popup"),I=require("@progress/kendo-date-math"),n=require("@progress/kendo-react-common"),U=require("@progress/kendo-svg-icons"),j=require("../package-metadata.js"),$=require("../dateinput/DateInput.js"),H=require("../calendar/components/Calendar.js"),m=require("../utils.js"),D=require("../messages/index.js"),q=require("@progress/kendo-react-intl"),X=require("./ToggleButton.js"),Z=require("../common/PickerWrap.js"),G=require("../hooks/usePickerFloatingLabel.js"),J=require("@progress/kendo-react-layout"),Q=require("../common/AdaptiveMode.js"),Y=require("../common/constants.js");function ee(l){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const t in l)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(l,t);Object.defineProperty(i,t,s.get?s:{enumerable:!0,get:()=>l[t]})}}return i.default=l,Object.freeze(i)}const r=ee(W),o=class o extends r.Component{constructor(i){super(i),this._element=null,this._dateInput=r.createRef(),this._calendar=null,this.shouldFocusDateInput=!1,this.prevShow=!1,this.focus=()=>{this.dateInput&&this.dateInput.focus()},this.setCalendarRef=t=>{this._calendar=t},this.nextValue=(t,s)=>t.value!==void 0?t.value:s.value,this.nextShow=(t,s)=>t.show!==void 0?t.show:s.show,this.renderPopup=()=>{const{disabled:t,min:s,max:a,weekNumber:g,focusedDate:f,popupSettings:d}=this.props,{popupClass:v,...w}=d,b=this.show,h=this.value,y=h&&I.getDate(h),p=n.classNames(v),C={popupClass:"k-datepicker-popup",show:b,anchor:this._element,className:p,id:this._popupId,anchorAlign:{horizontal:"left",vertical:"bottom"},popupAlign:{horizontal:"left",vertical:"top"},...w},c={disabled:t,value:y,min:s,max:a,weekNumber:g,focusedDate:f,className:this.mobileMode?"k-calendar-lg":"",navigation:!this.mobileMode,onChange:this.handleCalendarValueChange};return this.mobileMode?r.createElement(this.calendarComp,{_ref:this.setCalendarRef,...c}):r.createElement(this.popupComp,{...C},r.createElement(this.calendarComp,{_ref:this.setCalendarRef,...c}))},this.renderAdaptivePopup=()=>{const{windowWidth:t=0}=this.state,s={expand:this.show,onClose:this.handleBlur,adaptiveTitle:this.props.adaptiveTitle,windowWidth:t};return r.createElement(Q.AdaptiveMode,{...s},r.createElement(J.ActionSheetContent,{className:"!k-overflow-hidden"},this.renderPopup()))},this.handleInputValueChange=t=>{this.handleValueChange(t.value,t)},this.handleCalendarValueChange=t=>{const s=this.mergeTime(t.value);this.handleValueChange(s,t)},this.handleValueChange=(t,s)=>{this.setState({value:I.cloneDate(t||void 0)}),this.valueDuringOnChange=t,this.showDuringOnChange=!1,this.mobileMode||(this.shouldFocusDateInput=!0);const{onChange:a}=this.props;a&&a.call(void 0,{syntheticEvent:s.syntheticEvent,nativeEvent:s.nativeEvent,value:this.value,show:this.show,target:this}),this.valueDuringOnChange=void 0,this.showDuringOnChange=void 0,this.setShow(!1)},this.handleFocus=()=>{this.setState({focused:!0})},this.handleBlur=()=>{this.setState({focused:!1}),this.setShow(!1)},this.handleIconClick=()=>{this.props.disabled||(this.shouldFocusDateInput=!0,this.setShow(!this.show))},this.handleIconMouseDown=t=>{t.preventDefault()},this.handleKeyDown=t=>{const{altKey:s,keyCode:a}=t;if(a===n.Keys.esc){this.shouldFocusDateInput=!0,this.setShow(!1);return}s&&(a===n.Keys.up||a===n.Keys.down)&&(t.preventDefault(),t.stopPropagation(),this.shouldFocusDateInput=a===n.Keys.up,this.setShow(a===n.Keys.down))},n.validatePackage(j.packageMetadata),this.state={value:this.props.defaultValue||o.defaultProps.defaultValue,show:this.props.defaultShow||o.defaultProps.defaultShow,focused:!1}}get _popupId(){return this.props.id+"-popup-id"}get document(){if(n.canUseDOM)return this.element&&this.element.ownerDocument||document}get element(){return this._element}get mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=Y.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}get dateInput(){return this._dateInput.current}get calendar(){return this._calendar}get value(){const i=this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value;return i!==null?I.cloneDate(i):null}get show(){return this.showDuringOnChange!==void 0?this.showDuringOnChange:this.props.show!==void 0?this.props.show:this.state.show}get name(){return this.props.name}get min(){return this.props.min!==void 0?this.props.min:o.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:o.defaultProps.max}get dateInputComp(){return this.props.dateInput||o.defaultProps.dateInput}get toggleButtonComp(){return this.props.toggleButton||o.defaultProps.toggleButton}get calendarComp(){return this.props.calendar||o.defaultProps.calendar}get popupComp(){return this.props.popup||o.defaultProps.popup}get pickerWrapComp(){return this.props.pickerWrap||o.defaultProps.pickerWrap}get validity(){const i=m.isInDateRange(this.value,this.min,this.max),t=this.props.validationMessage!==void 0,s=(!this.required||this.value!==null)&&i,a=this.props.valid!==void 0?this.props.valid:s;return{customError:t,rangeOverflow:this.value&&this.max.getTime()<this.value.getTime()||!1,rangeUnderflow:this.value&&this.value.getTime()<this.min.getTime()||!1,valid:a,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:o.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:o.defaultProps.required}componentDidMount(){var i;this.observerResize=n.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.show&&this.forceUpdate(),(i=this.document)!=null&&i.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentDidUpdate(){this._calendar&&this._calendar.element&&this.show&&!this.prevShow&&this._calendar.element.focus({preventScroll:!0}),this.dateInput&&this.dateInput.element&&!this.show&&this.shouldFocusDateInput&&this.dateInput.element.focus({preventScroll:!0}),this.prevShow=this.show,this.shouldFocusDateInput=!1}componentWillUnmount(){var i;clearTimeout(this.nextTickId),(i=this.document)!=null&&i.body&&this.observerResize&&this.observerResize.disconnect()}render(){const{size:i=o.defaultProps.size,rounded:t=o.defaultProps.rounded,fillMode:s=o.defaultProps.fillMode,disabled:a,tabIndex:g,title:f,id:d,format:v,formatPlaceholder:w,min:b,max:h,className:y,width:p,name:C,validationMessage:c,required:E,validityStyles:R,ariaLabelledBy:z,ariaDescribedBy:F,ariaLabel:N,placeholder:V,label:k,popupSettings:te,defaultValue:ie,defaultShow:se,value:oe,popup:ae,weekNumber:ne,dateInput:re,calendar:le,toggleButton:ue,onChange:de,onBlur:he,onFocus:pe,show:ce,onOpen:me,pickerWrap:ge,adaptive:fe,adaptiveTitle:ve,valid:we,...O}=this.props,A=this.value,S=!this.validityStyles||this.validity.valid,L={disabled:a,format:v,formatPlaceholder:w,id:d,ariaLabelledBy:z,ariaDescribedBy:F,ariaLabel:N,max:h,min:b,name:C,onChange:this.handleInputValueChange,required:E,tabIndex:this.show?-1:g,title:f,valid:this.validity.valid,validationMessage:c,validityStyles:R,value:A,label:void 0,placeholder:this.state.focused?null:V,ariaExpanded:this.show,size:null,fillMode:null,rounded:null},M=q.provideLocalizationService(this).toLanguageString(D.toggleCalendar,D.messages[D.toggleCalendar]),P=r.createElement(n.AsyncFocusBlur,{onFocus:this.handleFocus,onBlur:this.mobileMode?void 0:this.handleBlur,onSyncBlur:this.props.onBlur,onSyncFocus:this.props.onFocus},T=>r.createElement(r.Fragment,null,r.createElement("span",{...k?{}:O,ref:K=>{this._element=K},className:n.classNames("k-input","k-datepicker",{[`k-input-${n.kendoThemeMaps.sizeMap[i]||i}`]:i,[`k-rounded-${n.kendoThemeMaps.roundedMap[t]||t}`]:t,[`k-input-${s}`]:s,"k-invalid":!S,"k-required":this.required,"k-disabled":a},y),onKeyDown:this.handleKeyDown,style:{width:p},onFocus:T.onFocus,onBlur:T.onBlur,onClick:this.mobileMode?this.handleIconClick:void 0},r.createElement(this.dateInputComp,{_ref:this._dateInput,ariaRole:"combobox",readonly:this.mobileMode,ariaExpanded:this.show,ariaControls:this._popupId,...L}),r.createElement(this.toggleButtonComp,{type:"button",icon:"calendar",svgIcon:U.calendarIcon,title:M,className:"k-input-button",rounded:null,onClick:this.mobileMode?void 0:this.handleIconClick,"aria-label":M,onMouseDown:this.handleIconMouseDown}),!this.mobileMode&&this.renderPopup()),this.mobileMode&&this.renderAdaptivePopup()));return k?r.createElement(G.PickerFloatingLabel,{dateInput:this._dateInput,label:k,editorId:d,editorValid:S,editorDisabled:a,children:P,style:{width:p},...O}):P}setShow(i){const{onOpen:t,onClose:s}=this.props;this.show!==i&&(this.setState({show:i}),i&&t&&t.call(void 0,{target:this}),!i&&s&&s.call(void 0,{target:this}))}mergeTime(i){return this.value&&i?m.setTime(i,this.value):i}nextTick(i){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>i())}calculateMedia(i){for(let t of i)this.setState({windowWidth:t.target.clientWidth})}};o.displayName="DatePicker",o.propTypes={className:e.string,defaultShow:e.bool,defaultValue:e.instanceOf(Date),disabled:e.bool,focusedDate:e.instanceOf(Date),format:e.oneOfType([e.string,e.shape({skeleton:e.string,pattern:e.string,date:e.oneOf(["short","medium","long","full"]),time:e.oneOf(["short","medium","long","full"]),datetime:e.oneOf(["short","medium","long","full"]),era:e.oneOf(["narrow","short","long"]),year:e.oneOf(["numeric","2-digit"]),month:e.oneOf(["numeric","2-digit","narrow","short","long"]),day:e.oneOf(["numeric","2-digit"]),weekday:e.oneOf(["narrow","short","long"]),hour:e.oneOf(["numeric","2-digit"]),hour12:e.bool,minute:e.oneOf(["numeric","2-digit"]),second:e.oneOf(["numeric","2-digit"]),timeZoneName:e.oneOf(["short","long"])})]),formatPlaceholder:e.oneOfType([e.oneOf(["wide","narrow","short","formatPattern"]),e.shape({year:e.string,month:e.string,day:e.string,hour:e.string,minute:e.string,second:e.string})]),id:e.string,ariaLabelledBy:e.string,ariaDescribedBy:e.string,ariaLabel:e.string,min:e.instanceOf(Date),max:e.instanceOf(Date),name:e.string,popupSettings:e.shape({animate:e.bool,appendTo:e.any,popupClass:e.string}),show:e.bool,tabIndex:e.number,title:e.string,value:e.instanceOf(Date),weekNumber:e.bool,width:e.oneOfType([e.number,e.string]),validationMessage:e.string,required:e.bool,validate:e.bool,valid:e.bool,size:e.oneOf([null,"small","medium","large"]),rounded:e.oneOf([null,"small","medium","large","full"]),fillMode:e.oneOf([null,"solid","flat","outline"]),adaptive:e.bool,adaptiveTitle:e.string},o.defaultProps={defaultShow:!1,defaultValue:null,dateInput:$.DateInput,calendar:H.Calendar,toggleButton:X.ToggleButton,popup:_.Popup,pickerWrap:Z.PickerWrap,disabled:!1,format:"d",max:m.MAX_DATE,min:m.MIN_DATE,popupSettings:{},tabIndex:0,weekNumber:!1,required:!1,validityStyles:!0,size:"medium",rounded:"medium",fillMode:"solid"};let u=o;const x=n.createPropsContext(),B=n.withIdHOC(n.withPropsContext(x,u));B.displayName="KendoReactDatePicker";q.registerForLocalization(u);exports.DatePicker=B;exports.DatePickerPropsContext=x;exports.DatePickerWithoutContext=u;

package/datepicker/DatePicker.mjs

@@ -264,6 +264,9 @@ const o = class o extends n.Component {
       show: ke,
       onOpen: Se,
       pickerWrap: Oe,
+      adaptive: Me,
+      adaptiveTitle: Pe,
+      valid: Te,
       ...I
     } = this.props, R = this.value, C = !this.validityStyles || this.validity.valid, A = {
       disabled: a,