@progress/kendo-react-dateinputs 9.1.1-develop.3 → 9.2.0-develop.1

package/datepicker/DatePicker.mjs

@@ -10,20 +10,20 @@ import * as n from "react";
 import e from "prop-types";
 import { Popup as Y } from "@progress/kendo-react-popup";
 import { getDate as Z, cloneDate as M } from "@progress/kendo-date-math";
-import { classNames as k, Keys as r, validatePackage as j, canUseDOM as P, AsyncFocusBlur as G, kendoThemeMaps as T, createPropsContext as J, withIdHOC as Q, withPropsContext as ee } from "@progress/kendo-react-common";
-import { calendarIcon as te } from "@progress/kendo-svg-icons";
-import { packageMetadata as ie } from "../package-metadata.mjs";
-import { DateInput as se } from "../dateinput/DateInput.mjs";
-import { Calendar as oe } from "../calendar/components/Calendar.mjs";
-import { MAX_DATE as ae, MIN_DATE as ne, isInDateRange as re, setTime as le } from "../utils.mjs";
-import { toggleCalendar as x, messages as ue } from "../messages/index.mjs";
-import { provideLocalizationService as de, registerForLocalization as he } from "@progress/kendo-react-intl";
-import { ToggleButton as pe } from "./ToggleButton.mjs";
-import { PickerWrap as ce } from "../common/PickerWrap.mjs";
-import { PickerFloatingLabel as me } from "../hooks/usePickerFloatingLabel.mjs";
-import { ActionSheetContent as fe } from "@progress/kendo-react-layout";
-import { AdaptiveMode as ge } from "../common/AdaptiveMode.mjs";
-import { MOBILE_MEDIUM_DEVISE as ve } from "../common/constants.mjs";
+import { classNames as k, Keys as r, validatePackage as G, canUseDOM as P, AsyncFocusBlur as J, kendoThemeMaps as T, createPropsContext as Q, withIdHOC as ee, withPropsContext as te } from "@progress/kendo-react-common";
+import { calendarIcon as ie } from "@progress/kendo-svg-icons";
+import { packageMetadata as se } from "../package-metadata.mjs";
+import { DateInput as oe } from "../dateinput/DateInput.mjs";
+import { Calendar as ae } from "../calendar/components/Calendar.mjs";
+import { MAX_DATE as ne, MIN_DATE as re, isInDateRange as le, setTime as ue } from "../utils.mjs";
+import { toggleCalendar as x, messages as de } from "../messages/index.mjs";
+import { provideLocalizationService as he, registerForLocalization as pe } from "@progress/kendo-react-intl";
+import { ToggleButton as ce } from "./ToggleButton.mjs";
+import { PickerWrap as me } from "../common/PickerWrap.mjs";
+import { PickerFloatingLabel as fe } from "../hooks/usePickerFloatingLabel.mjs";
+import { ActionSheetContent as ge } from "@progress/kendo-react-layout";
+import { AdaptiveMode as ve } from "../common/AdaptiveMode.mjs";
+import { MOBILE_MEDIUM_DEVISE as we } from "../common/constants.mjs";
 const o = class o extends n.Component {
   constructor(i) {
     super(i), this._element = null, this._dateInput = n.createRef(), this._calendar = null, this.shouldFocusDateInput = !1, this.prevShow = !1, this.focus = () => {
@@ -66,7 +66,7 @@ const o = class o extends n.Component {
         adaptiveTitle: this.props.adaptiveTitle,
         windowWidth: t
       };
-      return /* @__PURE__ */ n.createElement(ge, { ...s }, /* @__PURE__ */ n.createElement(fe, { overflowHidden: !0 }, this.renderPopup()));
+      return /* @__PURE__ */ n.createElement(ve, { ...s }, /* @__PURE__ */ n.createElement(ge, { overflowHidden: !0 }, this.renderPopup()));
     }, this.handleInputValueChange = (t) => {
       this.handleValueChange(t.value, t);
     }, this.handleCalendarValueChange = (t) => {
@@ -104,7 +104,7 @@ const o = class o extends n.Component {
         return;
       }
       s && (a === r.up || a === r.down) && (t.preventDefault(), t.stopPropagation(), this.shouldFocusDateInput = a === r.up, this.setShow(a === r.down));
-    }, j(ie), this.state = {
+    }, G(se), this.state = {
       value: this.props.defaultValue || o.defaultProps.defaultValue,
       show: this.props.defaultShow || o.defaultProps.defaultShow,
       focused: !1
@@ -127,7 +127,7 @@ const o = class o extends n.Component {
    * The mobile mode of the DatePicker.
    */
   get mobileMode() {
-    return !!(this.state.windowWidth && this.state.windowWidth <= ve && this.props.adaptive);
+    return !!(this.state.windowWidth && this.state.windowWidth <= we && this.props.adaptive);
   }
   /**
    * Gets the DateInput component inside the DatePicker component.
@@ -185,7 +185,7 @@ const o = class o extends n.Component {
    * Represents the validity state into which the DatePicker is set.
    */
   get validity() {
-    const i = re(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;
+    const i = le(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,
@@ -253,38 +253,39 @@ const o = class o extends n.Component {
       ariaLabel: z,
       placeholder: N,
       label: y,
-      popupSettings: ye,
-      defaultValue: Ce,
-      defaultShow: Ie,
-      value: De,
-      popup: Se,
-      weekNumber: Oe,
-      dateInput: Me,
-      calendar: ke,
-      toggleButton: Pe,
-      onChange: Te,
-      onBlur: xe,
-      onFocus: Ee,
-      show: Be,
-      onOpen: Fe,
-      pickerWrap: Ve,
-      adaptive: ze,
-      adaptiveTitle: Ne,
-      valid: Re,
+      popupSettings: Ce,
+      defaultValue: Ie,
+      defaultShow: De,
+      value: Se,
+      popup: Oe,
+      weekNumber: Me,
+      dateInput: ke,
+      calendar: Pe,
+      toggleButton: Te,
+      onChange: xe,
+      onBlur: Ee,
+      onFocus: Be,
+      show: Fe,
+      onOpen: Ve,
+      pickerWrap: ze,
+      adaptive: Ne,
+      adaptiveTitle: Re,
+      valid: Ae,
       autoFocus: R,
+      inputAttributes: A,
       // Removed to support direct use in Form Field component
-      visited: Ae,
-      touched: Le,
-      modified: We,
-      autoFill: A,
-      twoDigitYearMax: L,
-      enableMouseWheel: W,
-      autoCorrectParts: q,
-      autoSwitchParts: _,
-      autoSwitchKeys: K,
-      allowCaretMode: U,
+      visited: Le,
+      touched: We,
+      modified: qe,
+      autoFill: L,
+      twoDigitYearMax: W,
+      enableMouseWheel: q,
+      autoCorrectParts: _,
+      autoSwitchParts: K,
+      autoSwitchKeys: U,
+      allowCaretMode: $,
       ...C
-    } = this.props, $ = this.value, I = !this.validityStyles || this.validity.valid, H = {
+    } = this.props, H = this.value, I = !this.validityStyles || this.validity.valid, j = {
       disabled: a,
       format: f,
       formatPlaceholder: g,
@@ -302,25 +303,26 @@ const o = class o extends n.Component {
       valid: this.validity.valid,
       validationMessage: h,
       validityStyles: B,
-      value: $,
+      value: H,
       label: void 0,
       placeholder: this.state.focused ? null : N,
       ariaExpanded: this.show,
       size: null,
       fillMode: null,
       rounded: null,
-      autoFill: A,
-      twoDigitYearMax: L,
-      enableMouseWheel: W,
-      autoCorrectParts: q,
-      autoSwitchParts: _,
-      autoSwitchKeys: K,
-      allowCaretMode: U
-    }, D = de(this).toLanguageString(
+      autoFill: L,
+      twoDigitYearMax: W,
+      enableMouseWheel: q,
+      autoCorrectParts: _,
+      autoSwitchParts: K,
+      autoSwitchKeys: U,
+      allowCaretMode: $,
+      inputAttributes: A
+    }, D = he(this).toLanguageString(
       x,
-      ue[x]
+      de[x]
     ), S = /* @__PURE__ */ n.createElement(
-      G,
+      J,
       {
         onFocus: this.handleFocus,
         onBlur: this.mobileMode ? void 0 : this.handleBlur,
@@ -361,7 +363,7 @@ const o = class o extends n.Component {
             ariaExpanded: this.show,
             ariaControls: this._popupId,
             autoFocus: R,
-            ...H
+            ...j
           }
         ),
         /* @__PURE__ */ n.createElement(
@@ -369,7 +371,7 @@ const o = class o extends n.Component {
           {
             type: "button",
             icon: "calendar",
-            svgIcon: te,
+            svgIcon: ie,
             title: D,
             className: "k-input-button",
             rounded: null,
@@ -383,7 +385,7 @@ const o = class o extends n.Component {
       ), this.mobileMode && this.renderAdaptivePopup())
     );
     return y ? /* @__PURE__ */ n.createElement(
-      me,
+      fe,
       {
         dateInput: this._dateInput,
         label: y,
@@ -405,7 +407,7 @@ const o = class o extends n.Component {
     }));
   }
   mergeTime(i) {
-    return this.value && i ? le(i, this.value) : i;
+    return this.value && i ? ue(i, this.value) : i;
   }
   nextTick(i) {
     clearTimeout(this.nextTickId), this.nextTickId = window.setTimeout(() => i());
@@ -484,19 +486,20 @@ o.displayName = "DatePicker", o.propTypes = {
   fillMode: e.oneOf([null, "solid", "flat", "outline"]),
   adaptive: e.bool,
   adaptiveTitle: e.string,
-  autoFocus: e.bool
+  autoFocus: e.bool,
+  inputAttributes: e.object
 }, o.defaultProps = {
   defaultShow: !1,
   defaultValue: null,
-  dateInput: se,
-  calendar: oe,
-  toggleButton: pe,
+  dateInput: oe,
+  calendar: ae,
+  toggleButton: ce,
   popup: Y,
-  pickerWrap: ce,
+  pickerWrap: me,
   disabled: !1,
   format: "d",
-  max: ae,
-  min: ne,
+  max: ne,
+  min: re,
   popupSettings: {},
   tabIndex: 0,
   weekNumber: !1,
@@ -507,13 +510,13 @@ o.displayName = "DatePicker", o.propTypes = {
   autoFocus: !1
 };
 let p = o;
-const we = J(), be = Q(
-  ee(we, p)
+const be = Q(), ye = ee(
+  te(be, p)
 );
-be.displayName = "KendoReactDatePicker";
-he(p);
+ye.displayName = "KendoReactDatePicker";
+pe(p);
 export {
-  be as DatePicker,
-  we as DatePickerPropsContext,
+  ye as DatePicker,
+  be as DatePickerPropsContext,
   p as DatePickerWithoutContext
 };

package/daterangepicker/DateRangePicker.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 y=require("react"),t=require("prop-types"),O=require("@progress/kendo-react-popup"),D=require("@progress/kendo-date-math"),o=require("@progress/kendo-react-common"),c=require("@progress/kendo-react-intl"),k=require("@progress/kendo-svg-icons"),M=require("../package-metadata.js"),g=require("../dateinput/DateInput.js"),T=require("../calendar/components/MultiViewCalendar.js"),h=require("../calendar/models/SelectionRange.js"),u=require("../utils.js"),x=require("../common/constants.js"),n=require("../messages/index.js"),P=require("@progress/kendo-react-buttons"),_=require("../common/AdaptiveMode.js"),N=require("@progress/kendo-react-layout");function A(d){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(d){for(const e in d)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(d,e);Object.defineProperty(a,e,s.get?s:{enumerable:!0,get:()=>d[e]})}}return a.default=d,Object.freeze(a)}const i=A(y),l=class l extends i.Component{constructor(a){super(a),this._element=null,this._calendar=null,this._startDateInput=i.createRef(),this._endDateInput=i.createRef(),this.shouldFocusDateInput=!1,this.shouldFocusCalendar=!1,this.focus=()=>{this.startDateInput&&this.startDateInput.focus()},this.setCalendarRef=e=>{this._calendar=e},this.focusCalendarElement=()=>{this._calendar&&this._calendar.element&&this._calendar.element.focus({preventScroll:!0})},this.calculateValue=(e,s)=>(e.value!==void 0?e.value:s.value)||h.EMPTY_SELECTIONRANGE,this.calculateShow=(e,s)=>e.show!==void 0?e.show:s.show,this.renderCalendar=()=>{const e=this.value||h.EMPTY_SELECTIONRANGE,s={min:this.min,max:this.max,allowReverse:this.props.allowReverse,mode:"range",focusedDate:this.props.focusedDate,disabled:this.props.disabled,className:this.mobileMode?"k-calendar-lg":"",mobileMode:this.mobileMode,...this.props.calendarSettings,value:e,dir:this.props.dir,onChange:this.handleCalendarChange};return this.props.calendar?i.createElement(this.props.calendar,{...s}):i.createElement(T.MultiViewCalendar,{...s,ref:this.setCalendarRef})},this.renderPopup=()=>{const e={popupClass:o.classNames("k-calendar-container","k-daterangepicker-popup"),animate:this._element!==null,anchor:this._element,id:this._popupId,anchorAlign:{horizontal:"left",vertical:"bottom"},popupAlign:{horizontal:"left",vertical:"top"},...this.props.popupSettings,show:this.show};return this.props.popup?i.createElement(this.props.popup,{...e},this.renderCalendar()):i.createElement(O.Popup,{...e},this.renderCalendar())},this.renderAdaptivePopup=()=>{const{windowWidth:e=0}=this.state,s={expand:this.show,onClose:r=>this.handleCancel(r),adaptiveTitle:this.props.adaptiveTitle,windowWidth:e,footer:{cancelText:this.localizationService.toLanguageString(n.dateRangePickerCancel,n.messages[n.dateRangePickerCancel]),onCancel:this.handleCancel,applyText:this.localizationService.toLanguageString(n.dateRangePickerSet,n.messages[n.dateRangePickerSet]),onApply:this.handleBlur}};return i.createElement(_.AdaptiveMode,{...s},i.createElement(N.ActionSheetContent,{overflowHidden:!0},i.createElement("div",{className:"k-scrollable-wrap"},this.renderCalendar())))},this.handleReverseClick=e=>{const s={start:this.value.end,end:this.value.start},r={syntheticEvent:e,nativeEvent:e.nativeEvent};this.handleChange(s,r)},this.handleReverseMouseDown=e=>{e.preventDefault()},this.handleFocus=e=>{clearTimeout(this.nextTickId),this.shouldFocusDateInput||this.mobileMode&&this.setState({currentValue:this.value});const{onFocus:s}=this.props;s&&s.call(void 0,e)},this.handleClick=()=>{this.shouldFocusDateInput||this.setShow(!0)},this.handleBlur=e=>{this.nextTick(()=>{this.setShow(!1)});const{onBlur:s}=this.props;s&&s.call(void 0,e)},this.handleCancel=e=>{this.nextTick(()=>{this.setShow(!1),this.setState({currentValue:h.EMPTY_SELECTIONRANGE})});const{onCancel:s}=this.props;s&&s.call(void 0,e)},this.handleEndChange=e=>{const s={start:this.value.start,end:D.cloneDate(e.value||void 0)};this.handleChange(s,e)},this.handleStartChange=e=>{const s={start:D.cloneDate(e.value||void 0),end:this.value.end};this.handleChange(s,e)},this.extractRangeFromValue=e=>{if(!Array.isArray(e.value)&&!(e.value instanceof Date))return e.value||h.EMPTY_SELECTIONRANGE;const s=Array.isArray(e.value)?e.value[0]:e.value;return{start:this.value.end!==null?s:this.value.start,end:this.value.start!==null?s:this.value.end}},this.handleCalendarChange=e=>{const s=this.extractRangeFromValue(e);this.handleChange(s,e)},this.handleKeyDown=e=>{const{keyCode:s,altKey:r}=e;s===o.Keys.esc?(e.preventDefault(),this.shouldFocusDateInput=!0,this.setShow(!1)):r&&s===o.Keys.down?(e.preventDefault(),this.shouldFocusCalendar=!0,this.setShow(!0),this.focusCalendarElement()):r&&s===o.Keys.up&&(e.preventDefault(),this.shouldFocusDateInput=!0,this.setShow(!1))},this.handleChange=(e,s)=>{this.setState({value:e}),this.valueDuringOnChange=e;const{onChange:r}=this.props;if(r){const m={syntheticEvent:s.syntheticEvent,nativeEvent:s.nativeEvent,value:this.value,show:this.show,target:this};r.call(void 0,m)}this.valueDuringOnChange=void 0},o.validatePackage(M.packageMetadata),this.state={show:this.props.show||this.props.defaultShow||l.defaultProps.defaultShow,value:this.props.value||this.props.defaultValue||l.defaultProps.defaultValue,currentValue:h.EMPTY_SELECTIONRANGE},this.nextTick=this.nextTick.bind(this),this.setShow=this.setShow.bind(this),this.focusCalendarElement=this.focusCalendarElement.bind(this),this.focusDateInputElement=this.focusDateInputElement.bind(this)}get _popupId(){return this.props.id+"-popup-id"}get _startInputId(){return this.props.id+"-start-input-id"}get _endInputId(){return this.props.id+"-end-input-id"}get element(){return this._element}get startDateInput(){return this._startDateInput.current}get endDateInput(){return this._endDateInput.current}get calendar(){return this._calendar}get value(){return(this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value)||h.EMPTY_SELECTIONRANGE}get show(){return this.showDuringOnChange!==void 0?this.showDuringOnChange:this.props.show!==void 0?this.props.show:this.state.show}get min(){return this.props.min!==void 0?this.props.min:l.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:l.defaultProps.max}get document(){if(o.canUseDOM)return this.element&&this.element.ownerDocument||document}get localizationService(){return c.provideLocalizationService(this)}get mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=x.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}componentDidMount(){var a;this.observerResize=o.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.show&&this.forceUpdate(),(a=this.document)!=null&&a.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentDidUpdate(){this.shouldFocusCalendar&&this.focusCalendarElement(),this.shouldFocusDateInput&&this.focusDateInputElement(),this.shouldFocusCalendar=!1,this.shouldFocusDateInput=!1}componentWillUnmount(){var a;clearTimeout(this.nextTickId),(a=this.document)!=null&&a.body&&this.observerResize&&this.observerResize.disconnect()}render(){const a=this.value||h.EMPTY_SELECTIONRANGE,e=this.mobileMode&&this.show?this.state.currentValue:a,s=(this.props.startDateInputSettings||{}).id||this._startInputId,r=(this.props.endDateInputSettings||{}).id||this._endInputId,m=o.classNames("k-daterangepicker",{"k-disabled":this.props.disabled},this.props.className),b=this.localizationService.toLanguageString(n.start,n.messages[n.start]),E=this.localizationService.toLanguageString(n.end,n.messages[n.end]),S=this.localizationService.toLanguageString(n.separator,n.messages[n.separator]),f={disableSelection:this.mobileMode&&!0,label:b,format:this.props.format,min:this.min,max:this.max,id:this._startInputId,disabled:this.props.disabled,valid:this.props.valid,tabIndex:this.props.tabIndex,ariaExpanded:this.show,clearButton:this.props.clearButton,...this.props.startDateInputSettings,value:e.start,onChange:this.handleStartChange},v={disableSelection:this.mobileMode&&!0,label:E,format:this.props.format,min:this.min,max:this.max,id:this._endInputId,disabled:this.props.disabled,valid:this.props.valid,tabIndex:this.props.tabIndex,ariaExpanded:this.show,clearButton:this.props.clearButton,...this.props.endDateInputSettings,value:e.end,onChange:this.handleEndChange},C=i.createElement(P.Button,{type:"button",className:"k-select",fillMode:"flat",title:c.provideLocalizationService(this).toLanguageString(n.swapStartEnd,n.messages[n.swapStartEnd]),onMouseDown:this.handleReverseMouseDown,onClick:this.handleReverseClick,"aria-controls":s+" "+r,"aria-label":c.provideLocalizationService(this).toLanguageString(n.swapStartEnd,n.messages[n.swapStartEnd])},i.createElement(o.IconWrap,{style:{transform:"rotate(90deg)"},name:"arrows-swap",icon:k.arrowsSwapIcon}));return i.createElement(i.Fragment,null,i.createElement("span",{ref:R=>{this._element=R},className:m,style:this.props.style,id:this.props.id,"aria-labelledby":this.props.ariaLabelledBy,"aria-describedby":this.props.ariaDescribedBy,tabIndex:this.props.tabIndex,onFocus:this.handleFocus,onClick:this.handleClick,onKeyDown:this.handleKeyDown,onBlur:this.mobileMode?void 0:this.handleBlur,dir:this.props.dir},this.props.startDateInput?i.createElement(this.props.startDateInput,{...f}):i.createElement(g.DateInput,{...f,autoFocus:this.props.autoFocus,ref:this._startDateInput,ariaRole:"combobox",ariaControls:this._popupId}),(this.props.allowReverse||this.props.calendarSettings&&this.props.calendarSettings.allowReverse)&&this.props.swapButton?C:S,this.props.endDateInput?i.createElement(this.props.endDateInput,{...v}):i.createElement(g.DateInput,{...v,ref:this._endDateInput,ariaRole:"combobox",ariaControls:this._popupId}),!this.mobileMode&&this.renderPopup()),this.mobileMode&&this.renderAdaptivePopup())}focusDateInputElement(){if(!document||!this.startDateInput||!this.startDateInput.element||!this.endDateInput||!this.endDateInput.element)return;const a=o.getActiveElement(document);(this.value.start===null||this.value.end!==null)&&a!==this.endDateInput.element?this.startDateInput.element.focus({preventScroll:!0}):a!==this.startDateInput.element&&this.endDateInput.element.focus({preventScroll:!0})}nextTick(a){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>a())}setShow(a){const{onOpen:e,onClose:s}=this.props;this.show!==a&&(this.setState({show:a}),a&&e&&e.call(void 0,{target:this}),!a&&s&&s.call(void 0,{target:this}))}calculateMedia(a){for(const e of a)this.setState({windowWidth:e.target.clientWidth})}};l.displayName="DateRangePicker",l.propTypes={allowReverse:t.bool,calendarSettings:t.any,className:t.string,defaultShow:t.bool,defaultValue:t.shape({start:u.nullable(t.instanceOf(Date).isRequired),end:u.nullable(t.instanceOf(Date).isRequired)}),disabled:t.bool,endDateInputSettings:t.shape(g.DateInputWithoutContext.propTypes),focusedDate:t.instanceOf(Date),format:t.oneOfType([t.string,t.shape({skeleton:t.string,pattern:t.string,date:t.oneOf(["short","medium","long","full"]),time:t.oneOf(["short","medium","long","full"]),datetime:t.oneOf(["short","medium","long","full"]),era:t.oneOf(["narrow","short","long"]),year:t.oneOf(["numeric","2-digit"]),month:t.oneOf(["numeric","2-digit","narrow","short","long"]),day:t.oneOf(["numeric","2-digit"]),weekday:t.oneOf(["narrow","short","long"]),hour:t.oneOf(["numeric","2-digit"]),hour12:t.bool,minute:t.oneOf(["numeric","2-digit"]),second:t.oneOf(["numeric","2-digit"]),timeZoneName:t.oneOf(["short","long"])})]),id:t.string,ariaLabelledBy:t.string,ariaDescribedBy:t.string,max:t.instanceOf(Date),min:t.instanceOf(Date),onBlur:t.func,onChange:t.func,onFocus:t.func,popupSettings:t.any,show:t.bool,startDateInputSettings:t.any,style:t.any,swapButton:t.any,tabIndex:t.number,dir:t.string,value:t.shape({start:u.nullable(t.instanceOf(Date).isRequired),end:u.nullable(t.instanceOf(Date).isRequired)}),autoFocus:t.bool},l.defaultProps={allowReverse:!1,defaultShow:!1,defaultValue:h.EMPTY_SELECTIONRANGE,disabled:!1,format:"d",max:u.MAX_DATE,min:u.MIN_DATE,swapButton:!1,autoFocus:!1};let p=l;const I=o.createPropsContext(),w=o.withIdHOC(o.withPropsContext(I,p));w.displayName="KendoReactDateRangePicker";c.registerForLocalization(p);exports.DateRangePicker=w;exports.DateRangePickerPropsContext=I;exports.DateRangePickerWithoutContext=p;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const k=require("react"),t=require("prop-types"),M=require("@progress/kendo-react-popup"),D=require("@progress/kendo-date-math"),r=require("@progress/kendo-react-common"),c=require("@progress/kendo-react-intl"),T=require("@progress/kendo-svg-icons"),x=require("../package-metadata.js"),g=require("../dateinput/DateInput.js"),P=require("../calendar/components/MultiViewCalendar.js"),h=require("../calendar/models/SelectionRange.js"),u=require("../utils.js"),_=require("../common/constants.js"),n=require("../messages/index.js"),A=require("@progress/kendo-react-buttons"),N=require("../common/AdaptiveMode.js"),F=require("@progress/kendo-react-layout");function L(d){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(d){for(const e in d)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(d,e);Object.defineProperty(a,e,s.get?s:{enumerable:!0,get:()=>d[e]})}}return a.default=d,Object.freeze(a)}const i=L(k),l=class l extends i.Component{constructor(a){super(a),this._element=null,this._calendar=null,this._startDateInput=i.createRef(),this._endDateInput=i.createRef(),this.shouldFocusDateInput=!1,this.shouldFocusCalendar=!1,this.focus=()=>{this.startDateInput&&this.startDateInput.focus()},this.setCalendarRef=e=>{this._calendar=e},this.focusCalendarElement=()=>{this._calendar&&this._calendar.element&&this._calendar.element.focus({preventScroll:!0})},this.calculateValue=(e,s)=>(e.value!==void 0?e.value:s.value)||h.EMPTY_SELECTIONRANGE,this.calculateShow=(e,s)=>e.show!==void 0?e.show:s.show,this.renderCalendar=()=>{const e=this.value||h.EMPTY_SELECTIONRANGE,s={min:this.min,max:this.max,allowReverse:this.props.allowReverse,mode:"range",focusedDate:this.props.focusedDate,disabled:this.props.disabled,className:this.mobileMode?"k-calendar-lg":"",mobileMode:this.mobileMode,...this.props.calendarSettings,value:e,dir:this.props.dir,onChange:this.handleCalendarChange};return this.props.calendar?i.createElement(this.props.calendar,{...s}):i.createElement(P.MultiViewCalendar,{...s,ref:this.setCalendarRef})},this.renderPopup=()=>{const e={popupClass:r.classNames("k-calendar-container","k-daterangepicker-popup"),animate:this._element!==null,anchor:this._element,id:this._popupId,anchorAlign:{horizontal:"left",vertical:"bottom"},popupAlign:{horizontal:"left",vertical:"top"},...this.props.popupSettings,show:this.show};return this.props.popup?i.createElement(this.props.popup,{...e},this.renderCalendar()):i.createElement(M.Popup,{...e},this.renderCalendar())},this.renderAdaptivePopup=()=>{const{windowWidth:e=0}=this.state,s={expand:this.show,onClose:o=>this.handleCancel(o),adaptiveTitle:this.props.adaptiveTitle,windowWidth:e,footer:{cancelText:this.localizationService.toLanguageString(n.dateRangePickerCancel,n.messages[n.dateRangePickerCancel]),onCancel:this.handleCancel,applyText:this.localizationService.toLanguageString(n.dateRangePickerSet,n.messages[n.dateRangePickerSet]),onApply:this.handleBlur}};return i.createElement(N.AdaptiveMode,{...s},i.createElement(F.ActionSheetContent,{overflowHidden:!0},i.createElement("div",{className:"k-scrollable-wrap"},this.renderCalendar())))},this.handleReverseClick=e=>{const s={start:this.value.end,end:this.value.start},o={syntheticEvent:e,nativeEvent:e.nativeEvent};this.handleChange(s,o)},this.handleReverseMouseDown=e=>{e.preventDefault()},this.handleFocus=e=>{clearTimeout(this.nextTickId),this.shouldFocusDateInput||this.mobileMode&&this.setState({currentValue:this.value});const{onFocus:s}=this.props;s&&s.call(void 0,e)},this.handleClick=()=>{this.shouldFocusDateInput||this.setShow(!0)},this.handleBlur=e=>{this.nextTick(()=>{this.setShow(!1)});const{onBlur:s}=this.props;s&&s.call(void 0,e)},this.handleCancel=e=>{this.nextTick(()=>{this.setShow(!1),this.setState({currentValue:h.EMPTY_SELECTIONRANGE})});const{onCancel:s}=this.props;s&&s.call(void 0,e)},this.handleEndChange=e=>{const s={start:this.value.start,end:D.cloneDate(e.value||void 0)};this.handleChange(s,e)},this.handleStartChange=e=>{const s={start:D.cloneDate(e.value||void 0),end:this.value.end};this.handleChange(s,e)},this.extractRangeFromValue=e=>{if(!Array.isArray(e.value)&&!(e.value instanceof Date))return e.value||h.EMPTY_SELECTIONRANGE;const s=Array.isArray(e.value)?e.value[0]:e.value;return{start:this.value.end!==null?s:this.value.start,end:this.value.start!==null?s:this.value.end}},this.handleCalendarChange=e=>{const s=this.extractRangeFromValue(e);this.handleChange(s,e)},this.handleKeyDown=e=>{const{keyCode:s,altKey:o}=e;s===r.Keys.esc?(e.preventDefault(),this.shouldFocusDateInput=!0,this.setShow(!1)):o&&s===r.Keys.down?(e.preventDefault(),this.shouldFocusCalendar=!0,this.setShow(!0),this.focusCalendarElement()):o&&s===r.Keys.up&&(e.preventDefault(),this.shouldFocusDateInput=!0,this.setShow(!1))},this.handleChange=(e,s)=>{this.setState({value:e}),this.valueDuringOnChange=e;const{onChange:o}=this.props;if(o){const m={syntheticEvent:s.syntheticEvent,nativeEvent:s.nativeEvent,value:this.value,show:this.show,target:this};o.call(void 0,m)}this.valueDuringOnChange=void 0},r.validatePackage(x.packageMetadata),this.state={show:this.props.show||this.props.defaultShow||l.defaultProps.defaultShow,value:this.props.value||this.props.defaultValue||l.defaultProps.defaultValue,currentValue:h.EMPTY_SELECTIONRANGE},this.nextTick=this.nextTick.bind(this),this.setShow=this.setShow.bind(this),this.focusCalendarElement=this.focusCalendarElement.bind(this),this.focusDateInputElement=this.focusDateInputElement.bind(this)}get _popupId(){return this.props.id+"-popup-id"}get _startInputId(){return this.props.id+"-start-input-id"}get _endInputId(){return this.props.id+"-end-input-id"}get element(){return this._element}get startDateInput(){return this._startDateInput.current}get endDateInput(){return this._endDateInput.current}get calendar(){return this._calendar}get value(){return(this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value)||h.EMPTY_SELECTIONRANGE}get show(){return this.showDuringOnChange!==void 0?this.showDuringOnChange:this.props.show!==void 0?this.props.show:this.state.show}get min(){return this.props.min!==void 0?this.props.min:l.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:l.defaultProps.max}get document(){if(r.canUseDOM)return this.element&&this.element.ownerDocument||document}get localizationService(){return c.provideLocalizationService(this)}get mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=_.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}componentDidMount(){var a;this.observerResize=r.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.show&&this.forceUpdate(),(a=this.document)!=null&&a.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentDidUpdate(){this.shouldFocusCalendar&&this.focusCalendarElement(),this.shouldFocusDateInput&&this.focusDateInputElement(),this.shouldFocusCalendar=!1,this.shouldFocusDateInput=!1}componentWillUnmount(){var a;clearTimeout(this.nextTickId),(a=this.document)!=null&&a.body&&this.observerResize&&this.observerResize.disconnect()}render(){const{autoFocus:a,inputAttributes:e}=this.props,s=this.value||h.EMPTY_SELECTIONRANGE,o=this.mobileMode&&this.show?this.state.currentValue:s,m=(this.props.startDateInputSettings||{}).id||this._startInputId,w=(this.props.endDateInputSettings||{}).id||this._endInputId,E=r.classNames("k-daterangepicker",{"k-disabled":this.props.disabled},this.props.className),S=this.localizationService.toLanguageString(n.start,n.messages[n.start]),C=this.localizationService.toLanguageString(n.end,n.messages[n.end]),R=this.localizationService.toLanguageString(n.separator,n.messages[n.separator]),f={disableSelection:this.mobileMode&&!0,label:S,format:this.props.format,min:this.min,max:this.max,id:this._startInputId,disabled:this.props.disabled,valid:this.props.valid,tabIndex:this.props.tabIndex,ariaExpanded:this.show,clearButton:this.props.clearButton,...this.props.startDateInputSettings,value:o.start,onChange:this.handleStartChange,inputAttributes:this.props.inputAttributes},v={disableSelection:this.mobileMode&&!0,label:C,format:this.props.format,min:this.min,max:this.max,id:this._endInputId,disabled:this.props.disabled,valid:this.props.valid,tabIndex:this.props.tabIndex,ariaExpanded:this.show,clearButton:this.props.clearButton,...this.props.endDateInputSettings,value:o.end,onChange:this.handleEndChange,inputAttributes:this.props.inputAttributes},y=i.createElement(A.Button,{type:"button",className:"k-select",fillMode:"flat",title:c.provideLocalizationService(this).toLanguageString(n.swapStartEnd,n.messages[n.swapStartEnd]),onMouseDown:this.handleReverseMouseDown,onClick:this.handleReverseClick,"aria-controls":m+" "+w,"aria-label":c.provideLocalizationService(this).toLanguageString(n.swapStartEnd,n.messages[n.swapStartEnd])},i.createElement(r.IconWrap,{style:{transform:"rotate(90deg)"},name:"arrows-swap",icon:T.arrowsSwapIcon}));return i.createElement(i.Fragment,null,i.createElement("span",{ref:O=>{this._element=O},className:E,style:this.props.style,id:this.props.id,"aria-labelledby":this.props.ariaLabelledBy,"aria-describedby":this.props.ariaDescribedBy,tabIndex:this.props.tabIndex,onFocus:this.handleFocus,onClick:this.handleClick,onKeyDown:this.handleKeyDown,onBlur:this.mobileMode?void 0:this.handleBlur,dir:this.props.dir},this.props.startDateInput?i.createElement(this.props.startDateInput,{...f}):i.createElement(g.DateInput,{...f,autoFocus:a,ref:this._startDateInput,ariaRole:"combobox",ariaControls:this._popupId}),(this.props.allowReverse||this.props.calendarSettings&&this.props.calendarSettings.allowReverse)&&this.props.swapButton?y:R,this.props.endDateInput?i.createElement(this.props.endDateInput,{...v}):i.createElement(g.DateInput,{...v,ref:this._endDateInput,ariaRole:"combobox",ariaControls:this._popupId}),!this.mobileMode&&this.renderPopup()),this.mobileMode&&this.renderAdaptivePopup())}focusDateInputElement(){if(!document||!this.startDateInput||!this.startDateInput.element||!this.endDateInput||!this.endDateInput.element)return;const a=r.getActiveElement(document);(this.value.start===null||this.value.end!==null)&&a!==this.endDateInput.element?this.startDateInput.element.focus({preventScroll:!0}):a!==this.startDateInput.element&&this.endDateInput.element.focus({preventScroll:!0})}nextTick(a){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>a())}setShow(a){const{onOpen:e,onClose:s}=this.props;this.show!==a&&(this.setState({show:a}),a&&e&&e.call(void 0,{target:this}),!a&&s&&s.call(void 0,{target:this}))}calculateMedia(a){for(const e of a)this.setState({windowWidth:e.target.clientWidth})}};l.displayName="DateRangePicker",l.propTypes={allowReverse:t.bool,calendarSettings:t.any,className:t.string,defaultShow:t.bool,defaultValue:t.shape({start:u.nullable(t.instanceOf(Date).isRequired),end:u.nullable(t.instanceOf(Date).isRequired)}),disabled:t.bool,endDateInputSettings:t.shape(g.DateInputWithoutContext.propTypes),focusedDate:t.instanceOf(Date),format:t.oneOfType([t.string,t.shape({skeleton:t.string,pattern:t.string,date:t.oneOf(["short","medium","long","full"]),time:t.oneOf(["short","medium","long","full"]),datetime:t.oneOf(["short","medium","long","full"]),era:t.oneOf(["narrow","short","long"]),year:t.oneOf(["numeric","2-digit"]),month:t.oneOf(["numeric","2-digit","narrow","short","long"]),day:t.oneOf(["numeric","2-digit"]),weekday:t.oneOf(["narrow","short","long"]),hour:t.oneOf(["numeric","2-digit"]),hour12:t.bool,minute:t.oneOf(["numeric","2-digit"]),second:t.oneOf(["numeric","2-digit"]),timeZoneName:t.oneOf(["short","long"])})]),id:t.string,ariaLabelledBy:t.string,ariaDescribedBy:t.string,max:t.instanceOf(Date),min:t.instanceOf(Date),onBlur:t.func,onChange:t.func,onFocus:t.func,popupSettings:t.any,show:t.bool,startDateInputSettings:t.any,style:t.any,swapButton:t.any,tabIndex:t.number,dir:t.string,value:t.shape({start:u.nullable(t.instanceOf(Date).isRequired),end:u.nullable(t.instanceOf(Date).isRequired)}),autoFocus:t.bool,inputAttributes:t.object},l.defaultProps={allowReverse:!1,defaultShow:!1,defaultValue:h.EMPTY_SELECTIONRANGE,disabled:!1,format:"d",max:u.MAX_DATE,min:u.MIN_DATE,swapButton:!1,autoFocus:!1};let p=l;const I=r.createPropsContext(),b=r.withIdHOC(r.withPropsContext(I,p));b.displayName="KendoReactDateRangePicker";c.registerForLocalization(p);exports.DateRangePicker=b;exports.DateRangePickerPropsContext=I;exports.DateRangePickerWithoutContext=p;

package/daterangepicker/DateRangePicker.mjs

@@ -8,21 +8,21 @@
 "use client";
 import * as i from "react";
 import e from "prop-types";
-import { Popup as T } from "@progress/kendo-react-popup";
+import { Popup as A } from "@progress/kendo-react-popup";
 import { cloneDate as v } from "@progress/kendo-date-math";
-import { classNames as D, Keys as c, validatePackage as _, canUseDOM as I, IconWrap as F, getActiveElement as P, createPropsContext as B, withIdHOC as z, withPropsContext as A } from "@progress/kendo-react-common";
-import { provideLocalizationService as m, registerForLocalization as N } from "@progress/kendo-react-intl";
-import { arrowsSwapIcon as L } from "@progress/kendo-svg-icons";
-import { packageMetadata as V } from "../package-metadata.mjs";
-import { DateInputWithoutContext as K, DateInput as w } from "../dateinput/DateInput.mjs";
-import { MultiViewCalendar as U } from "../calendar/components/MultiViewCalendar.mjs";
+import { classNames as D, Keys as c, validatePackage as F, canUseDOM as I, IconWrap as P, getActiveElement as B, createPropsContext as z, withIdHOC as N, withPropsContext as L } from "@progress/kendo-react-common";
+import { provideLocalizationService as m, registerForLocalization as V } from "@progress/kendo-react-intl";
+import { arrowsSwapIcon as K } from "@progress/kendo-svg-icons";
+import { packageMetadata as U } from "../package-metadata.mjs";
+import { DateInputWithoutContext as q, DateInput as w } from "../dateinput/DateInput.mjs";
+import { MultiViewCalendar as W } from "../calendar/components/MultiViewCalendar.mjs";
 import { EMPTY_SELECTIONRANGE as r } from "../calendar/models/SelectionRange.mjs";
-import { nullable as h, MAX_DATE as q, MIN_DATE as W } from "../utils.mjs";
-import { MOBILE_MEDIUM_DEVISE as H } from "../common/constants.mjs";
-import { dateRangePickerCancel as b, messages as l, dateRangePickerSet as C, start as S, end as E, separator as y, swapStartEnd as d } from "../messages/index.mjs";
-import { Button as G } from "@progress/kendo-react-buttons";
-import { AdaptiveMode as X } from "../common/AdaptiveMode.mjs";
-import { ActionSheetContent as Y } from "@progress/kendo-react-layout";
+import { nullable as h, MAX_DATE as H, MIN_DATE as j } from "../utils.mjs";
+import { MOBILE_MEDIUM_DEVISE as G } from "../common/constants.mjs";
+import { dateRangePickerCancel as b, messages as l, dateRangePickerSet as C, start as S, end as E, separator as y, swapStartEnd as u } from "../messages/index.mjs";
+import { Button as X } from "@progress/kendo-react-buttons";
+import { AdaptiveMode as Y } from "../common/AdaptiveMode.mjs";
+import { ActionSheetContent as Z } from "@progress/kendo-react-layout";
 const o = class o extends i.Component {
   constructor(a) {
     super(a), this._element = null, this._calendar = null, this._startDateInput = i.createRef(), this._endDateInput = i.createRef(), this.shouldFocusDateInput = !1, this.shouldFocusCalendar = !1, this.focus = () => {
@@ -46,7 +46,7 @@ const o = class o extends i.Component {
         dir: this.props.dir,
         onChange: this.handleCalendarChange
       };
-      return this.props.calendar ? /* @__PURE__ */ i.createElement(this.props.calendar, { ...s }) : /* @__PURE__ */ i.createElement(U, { ...s, ref: this.setCalendarRef });
+      return this.props.calendar ? /* @__PURE__ */ i.createElement(this.props.calendar, { ...s }) : /* @__PURE__ */ i.createElement(W, { ...s, ref: this.setCalendarRef });
     }, this.renderPopup = () => {
       const t = {
         popupClass: D("k-calendar-container", "k-daterangepicker-popup"),
@@ -64,7 +64,7 @@ const o = class o extends i.Component {
         ...this.props.popupSettings,
         show: this.show
       };
-      return this.props.popup ? /* @__PURE__ */ i.createElement(this.props.popup, { ...t }, this.renderCalendar()) : /* @__PURE__ */ i.createElement(T, { ...t }, this.renderCalendar());
+      return this.props.popup ? /* @__PURE__ */ i.createElement(this.props.popup, { ...t }, this.renderCalendar()) : /* @__PURE__ */ i.createElement(A, { ...t }, this.renderCalendar());
     }, this.renderAdaptivePopup = () => {
       const { windowWidth: t = 0 } = this.state, s = {
         expand: this.show,
@@ -81,7 +81,7 @@ const o = class o extends i.Component {
           onApply: this.handleBlur
         }
       };
-      return /* @__PURE__ */ i.createElement(X, { ...s }, /* @__PURE__ */ i.createElement(Y, { overflowHidden: !0 }, /* @__PURE__ */ i.createElement("div", { className: "k-scrollable-wrap" }, this.renderCalendar())));
+      return /* @__PURE__ */ i.createElement(Y, { ...s }, /* @__PURE__ */ i.createElement(Z, { overflowHidden: !0 }, /* @__PURE__ */ i.createElement("div", { className: "k-scrollable-wrap" }, this.renderCalendar())));
     }, this.handleReverseClick = (t) => {
       const s = {
         start: this.value.end,
@@ -141,17 +141,17 @@ const o = class o extends i.Component {
       this.setState({ value: t }), this.valueDuringOnChange = t;
       const { onChange: n } = this.props;
       if (n) {
-        const p = {
+        const d = {
           syntheticEvent: s.syntheticEvent,
           nativeEvent: s.nativeEvent,
           value: this.value,
           show: this.show,
           target: this
         };
-        n.call(void 0, p);
+        n.call(void 0, d);
       }
       this.valueDuringOnChange = void 0;
-    }, _(V), this.state = {
+    }, F(U), this.state = {
       show: this.props.show || this.props.defaultShow || o.defaultProps.defaultShow,
       value: this.props.value || this.props.defaultValue || o.defaultProps.defaultValue,
       currentValue: r
@@ -219,7 +219,7 @@ const o = class o extends i.Component {
    * The mobile mode of the DateRangePicker.
    */
   get mobileMode() {
-    return !!(this.state.windowWidth && this.state.windowWidth <= H && this.props.adaptive);
+    return !!(this.state.windowWidth && this.state.windowWidth <= G && this.props.adaptive);
   }
   /**
    * @hidden
@@ -245,15 +245,15 @@ const o = class o extends i.Component {
    * @hidden
    */
   render() {
-    const a = this.value || r, t = this.mobileMode && this.show ? this.state.currentValue : a, s = (this.props.startDateInputSettings || {}).id || this._startInputId, n = (this.props.endDateInputSettings || {}).id || this._endInputId, p = D(
+    const { autoFocus: a, inputAttributes: t } = this.props, s = this.value || r, n = this.mobileMode && this.show ? this.state.currentValue : s, d = (this.props.startDateInputSettings || {}).id || this._startInputId, x = (this.props.endDateInputSettings || {}).id || this._endInputId, R = D(
       "k-daterangepicker",
       {
         "k-disabled": this.props.disabled
       },
       this.props.className
-    ), x = this.localizationService.toLanguageString(S, l[S]), R = this.localizationService.toLanguageString(E, l[E]), O = this.localizationService.toLanguageString(y, l[y]), f = {
+    ), O = this.localizationService.toLanguageString(S, l[S]), k = this.localizationService.toLanguageString(E, l[E]), M = this.localizationService.toLanguageString(y, l[y]), f = {
       disableSelection: this.mobileMode && !0,
-      label: x,
+      label: O,
       format: this.props.format,
       min: this.min,
       max: this.max,
@@ -264,11 +264,12 @@ const o = class o extends i.Component {
       ariaExpanded: this.show,
       clearButton: this.props.clearButton,
       ...this.props.startDateInputSettings,
-      value: t.start,
-      onChange: this.handleStartChange
+      value: n.start,
+      onChange: this.handleStartChange,
+      inputAttributes: this.props.inputAttributes
     }, g = {
       disableSelection: this.mobileMode && !0,
-      label: R,
+      label: k,
       format: this.props.format,
       min: this.min,
       max: this.max,
@@ -279,32 +280,33 @@ const o = class o extends i.Component {
       ariaExpanded: this.show,
       clearButton: this.props.clearButton,
       ...this.props.endDateInputSettings,
-      value: t.end,
-      onChange: this.handleEndChange
-    }, k = /* @__PURE__ */ i.createElement(
-      G,
+      value: n.end,
+      onChange: this.handleEndChange,
+      inputAttributes: this.props.inputAttributes
+    }, T = /* @__PURE__ */ i.createElement(
+      X,
       {
         type: "button",
         className: "k-select",
         fillMode: "flat",
-        title: m(this).toLanguageString(d, l[d]),
+        title: m(this).toLanguageString(u, l[u]),
         onMouseDown: this.handleReverseMouseDown,
         onClick: this.handleReverseClick,
-        "aria-controls": s + " " + n,
+        "aria-controls": d + " " + x,
         "aria-label": m(this).toLanguageString(
-          d,
-          l[d]
+          u,
+          l[u]
         )
       },
-      /* @__PURE__ */ i.createElement(F, { style: { transform: "rotate(90deg)" }, name: "arrows-swap", icon: L })
+      /* @__PURE__ */ i.createElement(P, { style: { transform: "rotate(90deg)" }, name: "arrows-swap", icon: K })
     );
     return /* @__PURE__ */ i.createElement(i.Fragment, null, /* @__PURE__ */ i.createElement(
       "span",
       {
-        ref: (M) => {
-          this._element = M;
+        ref: (_) => {
+          this._element = _;
         },
-        className: p,
+        className: R,
         style: this.props.style,
         id: this.props.id,
         "aria-labelledby": this.props.ariaLabelledBy,
@@ -320,13 +322,13 @@ const o = class o extends i.Component {
         w,
         {
           ...f,
-          autoFocus: this.props.autoFocus,
+          autoFocus: a,
           ref: this._startDateInput,
           ariaRole: "combobox",
           ariaControls: this._popupId
         }
       ),
-      (this.props.allowReverse || this.props.calendarSettings && this.props.calendarSettings.allowReverse) && this.props.swapButton ? k : O,
+      (this.props.allowReverse || this.props.calendarSettings && this.props.calendarSettings.allowReverse) && this.props.swapButton ? T : M,
       this.props.endDateInput ? /* @__PURE__ */ i.createElement(this.props.endDateInput, { ...g }) : /* @__PURE__ */ i.createElement(
         w,
         {
@@ -342,7 +344,7 @@ const o = class o extends i.Component {
   focusDateInputElement() {
     if (!document || !this.startDateInput || !this.startDateInput.element || !this.endDateInput || !this.endDateInput.element)
       return;
-    const a = P(document);
+    const a = B(document);
     (this.value.start === null || this.value.end !== null) && a !== this.endDateInput.element ? this.startDateInput.element.focus({ preventScroll: !0 }) : a !== this.startDateInput.element && this.endDateInput.element.focus({ preventScroll: !0 });
   }
   nextTick(a) {
@@ -371,7 +373,7 @@ o.displayName = "DateRangePicker", o.propTypes = {
     end: h(e.instanceOf(Date).isRequired)
   }),
   disabled: e.bool,
-  endDateInputSettings: e.shape(K.propTypes),
+  endDateInputSettings: e.shape(q.propTypes),
   focusedDate: e.instanceOf(Date),
   format: e.oneOfType([
     e.string,
@@ -412,29 +414,30 @@ o.displayName = "DateRangePicker", o.propTypes = {
     start: h(e.instanceOf(Date).isRequired),
     end: h(e.instanceOf(Date).isRequired)
   }),
-  autoFocus: e.bool
+  autoFocus: e.bool,
+  inputAttributes: e.object
 }, o.defaultProps = {
   allowReverse: !1,
   defaultShow: !1,
   defaultValue: r,
   disabled: !1,
   format: "d",
-  max: q,
-  min: W,
+  max: H,
+  min: j,
   swapButton: !1,
   autoFocus: !1
 };
-let u = o;
-const Z = B(), j = z(
-  A(
-    Z,
-    u
+let p = o;
+const J = z(), Q = N(
+  L(
+    J,
+    p
   )
 );
-j.displayName = "KendoReactDateRangePicker";
-N(u);
+Q.displayName = "KendoReactDateRangePicker";
+V(p);
 export {
-  j as DateRangePicker,
-  Z as DateRangePickerPropsContext,
-  u as DateRangePickerWithoutContext
+  Q as DateRangePicker,
+  J as DateRangePickerPropsContext,
+  p as DateRangePickerWithoutContext
 };

package/datetimepicker/DateTimePicker.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 $=require("react"),e=require("prop-types"),G=require("@progress/kendo-react-popup"),T=require("@progress/kendo-date-math"),o=require("@progress/kendo-react-common"),J=require("@progress/kendo-svg-icons"),Q=require("../dateinput/DateInput.js"),ee=require("@progress/kendo-react-buttons"),te=require("../package-metadata.js"),p=require("../utils.js"),ie=require("../common/constants.js"),l=require("../messages/index.js"),m=require("@progress/kendo-react-intl"),se=require("./DateTimeSelector.js"),oe=require("../timepicker/utils.js"),ae=require("../hooks/usePickerFloatingLabel.js"),ne=require("../common/AdaptiveMode.js"),re=require("@progress/kendo-react-layout");function le(c){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const i in c)if(i!=="default"){const s=Object.getOwnPropertyDescriptor(c,i);Object.defineProperty(t,i,s.get?s:{enumerable:!0,get:()=>c[i]})}}return t.default=c,Object.freeze(t)}const r=le($),a=class a extends r.Component{constructor(t){super(t),this._element=null,this._dateInput=r.createRef(),this._dateTimeSelector=null,this.shouldFocusDateInput=!1,this.prevShow=!1,this.focus=()=>{const i=this.dateInputElement();i&&i.focus()},this.renderPicker=()=>{const{disabled:i,minTime:s,maxTime:n,format:h,calendar:d,cancelButton:u,weekNumber:f,focusedDate:v,unstyled:w}=this.props;return r.createElement(se.DateTimeSelector,{ref:b=>{this._dateTimeSelector=b},cancelButton:u,steps:this.props.steps,value:this.value,onChange:this.handleValueChange,onReject:this.handleReject,disabled:i,weekNumber:f,min:this.min,max:this.max,minTime:s,maxTime:n,focusedDate:v,format:h,calendar:d,mobileMode:this.mobileMode,footerActions:!this.mobileMode,unstyled:w})},this.renderAdaptivePopup=()=>{const{windowWidth:i=0}=this.state,s=m.provideLocalizationService(this).toLanguageString(l.dateTimePickerCancel,l.messages[l.dateTimePickerCancel]),n=m.provideLocalizationService(this).toLanguageString(l.dateTimePickerSet,l.messages[l.dateTimePickerSet]),h={expand:this.show,onClose:this.handleBlur,adaptiveTitle:this.props.adaptiveTitle,windowWidth:i,footer:{cancelText:s,onCancel:d=>{var u;return(u=this._dateTimeSelector)==null?void 0:u.handleReject(d)},applyText:n,onApply:d=>{var u;return(u=this._dateTimeSelector)==null?void 0:u.handleAccept(d)}}};return r.createElement(ne.AdaptiveMode,{...h},r.createElement(re.ActionSheetContent,{overflowHidden:!0},this.renderPicker()))},this.handleReject=()=>{this.shouldFocusDateInput=!0,this.setShow(!1)},this.handleValueChange=i=>{this.setState({value:T.cloneDate(i.value||void 0)}),this.valueDuringOnChange=i.value,this.showDuringOnChange=!1,this.mobileMode||(this.shouldFocusDateInput=!0);const{onChange:s}=this.props;s&&s.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.handleDateIconClick=()=>{this.props.disabled||(this.shouldFocusDateInput=!0,this.setShow(!this.show))},this.handleIconMouseDown=i=>{i.preventDefault()},this.handleKeyDown=i=>{const{altKey:s,keyCode:n}=i;if(n===o.Keys.esc){this.shouldFocusDateInput=!0,this.setShow(!1);return}s&&(n===o.Keys.up||n===o.Keys.down)&&(i.preventDefault(),i.stopPropagation(),this.shouldFocusDateInput=n===o.Keys.up,this.setShow(n===o.Keys.down))},this.dateInputElement=()=>this.dateInput&&this.dateInput.element||this.element&&this.element.querySelector(".k-dateinput > input.k-input-inner"),o.validatePackage(te.packageMetadata),this.state={value:this.props.defaultValue||a.defaultProps.defaultValue,show:this.props.defaultShow||a.defaultProps.defaultShow,focused:!1}}get _popupId(){return this.props.id+"-popup-id"}get document(){if(o.canUseDOM)return this.element&&this.element.ownerDocument||document}get element(){return this._element}get dateInput(){return this._dateInput.current}get value(){const t=this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value;return t!==null?T.cloneDate(t):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 mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=ie.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}get min(){return this.props.min!==void 0?this.props.min:a.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:a.defaultProps.max}get validity(){const t=p.isInDateRange(this.value,this.min,this.max)&&oe.isInTimeRange(this.value,this.props.minTime||p.MIN_TIME,this.props.maxTime||p.MAX_TIME),i=this.props.validationMessage!==void 0,s=(!this.required||this.value!==null)&&t,n=this.props.valid!==void 0?this.props.valid:s;return{customError:i,rangeOverflow:this.value&&this.max.getTime()<this.value.getTime()||!1,rangeUnderflow:this.value&&this.value.getTime()<this.min.getTime()||!1,valid:n,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:a.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:!1}get dateInputComp(){return this.props.dateInput||a.defaultProps.dateInput}componentDidMount(){var t;this.observerResize=o.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.show&&this.forceUpdate(),(t=this.document)!=null&&t.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentDidUpdate(){const t=this.dateInputElement();this._dateTimeSelector&&this.show&&!this.prevShow&&this._dateTimeSelector.focus({preventScroll:!0}),t&&!this.show&&this.shouldFocusDateInput&&t.focus({preventScroll:!0}),this.prevShow=this.show,this.shouldFocusDateInput=!1}componentWillUnmount(){var t;clearTimeout(this.nextTickId),(t=this.document)!=null&&t.body&&this.observerResize&&this.observerResize.disconnect()}render(){const{size:t=a.defaultProps.size,rounded:i=a.defaultProps.rounded,fillMode:s=a.defaultProps.fillMode,autoFocus:n=a.defaultProps.autoFocus,disabled:h,tabIndex:d,title:u,id:f,format:v,formatPlaceholder:w,min:b,max:M,className:k,width:C,name:x,validationMessage:E,required:q,validityStyles:F,minTime:R,maxTime:z,ariaLabelledBy:B,ariaDescribedBy:A,popup:N=G.Popup,unstyled:y,autoFill:L,twoDigitYearMax:_,enableMouseWheel:K,autoCorrectParts:V,autoSwitchParts:j,autoSwitchKeys:U,allowCaretMode:H}=this.props,D=y&&y.uDateTimePicker,S=!this.validityStyles||this.validity.valid,W={id:f,ariaLabelledBy:B,ariaDescribedBy:A,format:v,formatPlaceholder:w,disabled:h,title:u,validityStyles:F,validationMessage:E,required:q,min:b,max:M,minTime:R,maxTime:z,name:x,tabIndex:this.show?-1:d,valid:this.validity.valid,value:this.value,onChange:this.handleValueChange,steps:this.props.steps,label:void 0,placeholder:this.state.focused?null:this.props.placeholder,ariaExpanded:this.show,size:null,fillMode:null,rounded:null,unstyled:y,autoFill:L,twoDigitYearMax:_,enableMouseWheel:K,autoCorrectParts:V,autoSwitchParts:j,autoSwitchKeys:U,allowCaretMode:H},I=r.createElement(o.AsyncFocusBlur,{onFocus:this.handleFocus,onBlur:this.handleBlur,onSyncFocus:this.props.onFocus,onSyncBlur:this.props.onBlur},({onFocus:X,onBlur:Y})=>r.createElement(r.Fragment,null,r.createElement("div",{ref:Z=>{this._element=Z},className:o.classNames(o.uDateTimePicker.wrapper({c:D,size:t,fillMode:s,rounded:i,disabled:h,required:this.required,invalid:!S}),k),onKeyDown:this.handleKeyDown,style:{width:C},onFocus:this.mobileMode?void 0:X,onBlur:Y,onClick:this.mobileMode?this.handleDateIconClick:void 0},r.createElement(this.dateInputComp,{_ref:this._dateInput,ariaRole:"combobox",ariaControls:this._popupId,ariaHasPopup:"dialog",autoFocus:n,...W}),r.createElement(ee.Button,{tabIndex:-1,type:"button",icon:"calendar",svgIcon:J.calendarIcon,onMouseDown:this.handleIconMouseDown,onClick:this.mobileMode?void 0:this.handleDateIconClick,title:m.provideLocalizationService(this).toLanguageString(l.toggleDateTimeSelector,l.messages[l.toggleDateTimeSelector]),className:o.classNames(o.uDateTimePicker.inputButton({c:D})),rounded:null,fillMode:s,"aria-label":m.provideLocalizationService(this).toLanguageString(l.toggleDateTimeSelector,l.messages[l.toggleDateTimeSelector])}),r.createElement(N,{show:this.show,animate:this.element!==null,anchor:this.element,popupClass:o.classNames(o.uDateTimePicker.popup({c:D})),id:this._popupId,anchorAlign:{horizontal:"left",vertical:"bottom"},popupAlign:{horizontal:"left",vertical:"top"}},!this.mobileMode&&this.renderPicker())),this.mobileMode&&this.renderAdaptivePopup()));return this.props.label?r.createElement(ae.PickerFloatingLabel,{dateInput:this._dateInput,label:this.props.label,editorId:f,editorValid:S,editorDisabled:this.props.disabled,children:I,style:{width:this.props.width}}):I}setShow(t){const{onOpen:i,onClose:s}=this.props;this.show!==t&&(this.setState({show:t}),t&&i&&i.call(void 0,{target:this}),!t&&s&&s.call(void 0,{target:this}))}nextTick(t){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>t())}calculateMedia(t){for(const i of t)this.setState({windowWidth:i.target.clientWidth})}};a.displayName="DateTimePicker",a.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,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,cancelButton:e.bool,size:e.oneOf([null,"small","medium","large"]),rounded:e.oneOf([null,"small","medium","large","full"]),fillMode:e.oneOf([null,"solid","flat","outline"]),autoFocus:e.bool},a.defaultProps={defaultShow:!1,defaultValue:null,disabled:!1,format:"g",max:p.MAX_DATE,min:p.MIN_DATE,popupSettings:{},tabIndex:0,weekNumber:!1,validityStyles:!0,cancelButton:!0,dateInput:Q.DateInput,size:"medium",rounded:"medium",fillMode:"solid",autoFocus:!1};let g=a;const P=o.createPropsContext(),O=o.withIdHOC(o.withPropsContext(P,o.withUnstyledHOC(g)));O.displayName="KendoReactDateTimePicker";m.registerForLocalization(g);exports.DateTimePicker=O;exports.DateTimePickerPropsContext=P;exports.DateTimePickerWithoutContext=g;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const G=require("react"),e=require("prop-types"),J=require("@progress/kendo-react-popup"),T=require("@progress/kendo-date-math"),o=require("@progress/kendo-react-common"),Q=require("@progress/kendo-svg-icons"),ee=require("../dateinput/DateInput.js"),te=require("@progress/kendo-react-buttons"),ie=require("../package-metadata.js"),p=require("../utils.js"),se=require("../common/constants.js"),l=require("../messages/index.js"),m=require("@progress/kendo-react-intl"),oe=require("./DateTimeSelector.js"),ae=require("../timepicker/utils.js"),ne=require("../hooks/usePickerFloatingLabel.js"),re=require("../common/AdaptiveMode.js"),le=require("@progress/kendo-react-layout");function ue(h){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(h){for(const i in h)if(i!=="default"){const s=Object.getOwnPropertyDescriptor(h,i);Object.defineProperty(t,i,s.get?s:{enumerable:!0,get:()=>h[i]})}}return t.default=h,Object.freeze(t)}const r=ue(G),a=class a extends r.Component{constructor(t){super(t),this._element=null,this._dateInput=r.createRef(),this._dateTimeSelector=null,this.shouldFocusDateInput=!1,this.prevShow=!1,this.focus=()=>{const i=this.dateInputElement();i&&i.focus()},this.renderPicker=()=>{const{disabled:i,minTime:s,maxTime:n,format:c,calendar:d,cancelButton:u,weekNumber:v,focusedDate:f,unstyled:w}=this.props;return r.createElement(oe.DateTimeSelector,{ref:b=>{this._dateTimeSelector=b},cancelButton:u,steps:this.props.steps,value:this.value,onChange:this.handleValueChange,onReject:this.handleReject,disabled:i,weekNumber:v,min:this.min,max:this.max,minTime:s,maxTime:n,focusedDate:f,format:c,calendar:d,mobileMode:this.mobileMode,footerActions:!this.mobileMode,unstyled:w})},this.renderAdaptivePopup=()=>{const{windowWidth:i=0}=this.state,s=m.provideLocalizationService(this).toLanguageString(l.dateTimePickerCancel,l.messages[l.dateTimePickerCancel]),n=m.provideLocalizationService(this).toLanguageString(l.dateTimePickerSet,l.messages[l.dateTimePickerSet]),c={expand:this.show,onClose:this.handleBlur,adaptiveTitle:this.props.adaptiveTitle,windowWidth:i,footer:{cancelText:s,onCancel:d=>{var u;return(u=this._dateTimeSelector)==null?void 0:u.handleReject(d)},applyText:n,onApply:d=>{var u;return(u=this._dateTimeSelector)==null?void 0:u.handleAccept(d)}}};return r.createElement(re.AdaptiveMode,{...c},r.createElement(le.ActionSheetContent,{overflowHidden:!0},this.renderPicker()))},this.handleReject=()=>{this.shouldFocusDateInput=!0,this.setShow(!1)},this.handleValueChange=i=>{this.setState({value:T.cloneDate(i.value||void 0)}),this.valueDuringOnChange=i.value,this.showDuringOnChange=!1,this.mobileMode||(this.shouldFocusDateInput=!0);const{onChange:s}=this.props;s&&s.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.handleDateIconClick=()=>{this.props.disabled||(this.shouldFocusDateInput=!0,this.setShow(!this.show))},this.handleIconMouseDown=i=>{i.preventDefault()},this.handleKeyDown=i=>{const{altKey:s,keyCode:n}=i;if(n===o.Keys.esc){this.shouldFocusDateInput=!0,this.setShow(!1);return}s&&(n===o.Keys.up||n===o.Keys.down)&&(i.preventDefault(),i.stopPropagation(),this.shouldFocusDateInput=n===o.Keys.up,this.setShow(n===o.Keys.down))},this.dateInputElement=()=>this.dateInput&&this.dateInput.element||this.element&&this.element.querySelector(".k-dateinput > input.k-input-inner"),o.validatePackage(ie.packageMetadata),this.state={value:this.props.defaultValue||a.defaultProps.defaultValue,show:this.props.defaultShow||a.defaultProps.defaultShow,focused:!1}}get _popupId(){return this.props.id+"-popup-id"}get document(){if(o.canUseDOM)return this.element&&this.element.ownerDocument||document}get element(){return this._element}get dateInput(){return this._dateInput.current}get value(){const t=this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value;return t!==null?T.cloneDate(t):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 mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=se.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}get min(){return this.props.min!==void 0?this.props.min:a.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:a.defaultProps.max}get validity(){const t=p.isInDateRange(this.value,this.min,this.max)&&ae.isInTimeRange(this.value,this.props.minTime||p.MIN_TIME,this.props.maxTime||p.MAX_TIME),i=this.props.validationMessage!==void 0,s=(!this.required||this.value!==null)&&t,n=this.props.valid!==void 0?this.props.valid:s;return{customError:i,rangeOverflow:this.value&&this.max.getTime()<this.value.getTime()||!1,rangeUnderflow:this.value&&this.value.getTime()<this.min.getTime()||!1,valid:n,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:a.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:!1}get dateInputComp(){return this.props.dateInput||a.defaultProps.dateInput}componentDidMount(){var t;this.observerResize=o.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.show&&this.forceUpdate(),(t=this.document)!=null&&t.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentDidUpdate(){const t=this.dateInputElement();this._dateTimeSelector&&this.show&&!this.prevShow&&this._dateTimeSelector.focus({preventScroll:!0}),t&&!this.show&&this.shouldFocusDateInput&&t.focus({preventScroll:!0}),this.prevShow=this.show,this.shouldFocusDateInput=!1}componentWillUnmount(){var t;clearTimeout(this.nextTickId),(t=this.document)!=null&&t.body&&this.observerResize&&this.observerResize.disconnect()}render(){const{size:t=a.defaultProps.size,rounded:i=a.defaultProps.rounded,fillMode:s=a.defaultProps.fillMode,autoFocus:n=a.defaultProps.autoFocus,inputAttributes:c,disabled:d,tabIndex:u,title:v,id:f,format:w,formatPlaceholder:b,min:M,max:k,className:C,width:x,name:E,validationMessage:q,required:F,validityStyles:R,minTime:z,maxTime:A,ariaLabelledBy:B,ariaDescribedBy:N,popup:L=J.Popup,unstyled:y,autoFill:_,twoDigitYearMax:K,enableMouseWheel:V,autoCorrectParts:j,autoSwitchParts:U,autoSwitchKeys:H,allowCaretMode:W}=this.props,D=y&&y.uDateTimePicker,S=!this.validityStyles||this.validity.valid,X={id:f,ariaLabelledBy:B,ariaDescribedBy:N,format:w,formatPlaceholder:b,disabled:d,title:v,validityStyles:R,validationMessage:q,required:F,min:M,max:k,minTime:z,maxTime:A,name:E,tabIndex:this.show?-1:u,valid:this.validity.valid,value:this.value,onChange:this.handleValueChange,steps:this.props.steps,label:void 0,placeholder:this.state.focused?null:this.props.placeholder,ariaExpanded:this.show,size:null,fillMode:null,rounded:null,unstyled:y,autoFill:_,twoDigitYearMax:K,enableMouseWheel:V,autoCorrectParts:j,autoSwitchParts:U,autoSwitchKeys:H,allowCaretMode:W},I=r.createElement(o.AsyncFocusBlur,{onFocus:this.handleFocus,onBlur:this.handleBlur,onSyncFocus:this.props.onFocus,onSyncBlur:this.props.onBlur},({onFocus:Y,onBlur:Z})=>r.createElement(r.Fragment,null,r.createElement("div",{ref:$=>{this._element=$},className:o.classNames(o.uDateTimePicker.wrapper({c:D,size:t,fillMode:s,rounded:i,disabled:d,required:this.required,invalid:!S}),C),onKeyDown:this.handleKeyDown,style:{width:x},onFocus:this.mobileMode?void 0:Y,onBlur:Z,onClick:this.mobileMode?this.handleDateIconClick:void 0},r.createElement(this.dateInputComp,{_ref:this._dateInput,ariaRole:"combobox",ariaControls:this._popupId,ariaHasPopup:"dialog",autoFocus:n,inputAttributes:c,...X}),r.createElement(te.Button,{tabIndex:-1,type:"button",icon:"calendar",svgIcon:Q.calendarIcon,onMouseDown:this.handleIconMouseDown,onClick:this.mobileMode?void 0:this.handleDateIconClick,title:m.provideLocalizationService(this).toLanguageString(l.toggleDateTimeSelector,l.messages[l.toggleDateTimeSelector]),className:o.classNames(o.uDateTimePicker.inputButton({c:D})),rounded:null,fillMode:s,"aria-label":m.provideLocalizationService(this).toLanguageString(l.toggleDateTimeSelector,l.messages[l.toggleDateTimeSelector])}),r.createElement(L,{show:this.show,animate:this.element!==null,anchor:this.element,popupClass:o.classNames(o.uDateTimePicker.popup({c:D})),id:this._popupId,anchorAlign:{horizontal:"left",vertical:"bottom"},popupAlign:{horizontal:"left",vertical:"top"}},!this.mobileMode&&this.renderPicker())),this.mobileMode&&this.renderAdaptivePopup()));return this.props.label?r.createElement(ne.PickerFloatingLabel,{dateInput:this._dateInput,label:this.props.label,editorId:f,editorValid:S,editorDisabled:this.props.disabled,children:I,style:{width:this.props.width}}):I}setShow(t){const{onOpen:i,onClose:s}=this.props;this.show!==t&&(this.setState({show:t}),t&&i&&i.call(void 0,{target:this}),!t&&s&&s.call(void 0,{target:this}))}nextTick(t){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>t())}calculateMedia(t){for(const i of t)this.setState({windowWidth:i.target.clientWidth})}};a.displayName="DateTimePicker",a.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,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,cancelButton:e.bool,size:e.oneOf([null,"small","medium","large"]),rounded:e.oneOf([null,"small","medium","large","full"]),fillMode:e.oneOf([null,"solid","flat","outline"]),autoFocus:e.bool,inputAttributes:e.object},a.defaultProps={defaultShow:!1,defaultValue:null,disabled:!1,format:"g",max:p.MAX_DATE,min:p.MIN_DATE,popupSettings:{},tabIndex:0,weekNumber:!1,validityStyles:!0,cancelButton:!0,dateInput:ee.DateInput,size:"medium",rounded:"medium",fillMode:"solid",autoFocus:!1};let g=a;const P=o.createPropsContext(),O=o.withIdHOC(o.withPropsContext(P,o.withUnstyledHOC(g)));O.displayName="KendoReactDateTimePicker";m.registerForLocalization(g);exports.DateTimePicker=O;exports.DateTimePickerPropsContext=P;exports.DateTimePickerWithoutContext=g;