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

package/calendar/components/View.mjs

@@ -6,61 +6,67 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import * as r from "react";
+import * as i from "react";
 import s from "prop-types";
-import { cloneDate as p, weekInYear as D } from "@progress/kendo-date-math";
-import { provideIntlService as w, registerForIntl as v } from "@progress/kendo-react-intl";
+import { cloneDate as p, weekInYear as w } from "@progress/kendo-date-math";
+import { provideIntlService as D, registerForIntl as v } from "@progress/kendo-react-intl";
 import { CalendarCell as g } from "./CalendarCell.mjs";
-import { CalendarWeekCell as N } from "./CalendarWeekCell.mjs";
+import { CalendarWeekCell as y } from "./CalendarWeekCell.mjs";
 import { CalendarViewEnum as u } from "../models/CalendarViewEnum.mjs";
-import { getToday as d, setTime as b } from "../../utils.mjs";
-import { WeekNamesService as y } from "../services/WeekNamesService.mjs";
-const k = (f) => /* @__PURE__ */ r.createElement("td", { key: f, className: "k-calendar-td k-empty" }, " "), c = class c extends r.Component {
+import { getToday as d, setTime as N } from "../../utils.mjs";
+import { WeekNamesService as b } from "../services/WeekNamesService.mjs";
+const k = (f) => /* @__PURE__ */ i.createElement("td", { key: f, className: "k-calendar-td k-empty" }, " "), c = class c extends i.Component {
   constructor() {
     super(...arguments), this.intl = null, this.weekService = null, this.buildWeekNumber = (t, e) => {
       if (!this.firstDate(t))
         return k(`week-cell-${e}`);
-      const n = this.firstDate(t), a = this.getWeekNumber(n), o = `kendo-react-calendar-week-cell-${a}`, l = {
+      const a = this.firstDate(t), n = this.getWeekNumber(a), o = `kendo-react-calendar-week-cell-${n}`, l = {
         className: "k-alt",
-        value: a,
-        firstDate: n
+        value: n,
+        firstDate: a,
+        weekDays: t,
+        onClick: this.handleWeekCellClick
       };
-      return this.props.weekCell ? /* @__PURE__ */ r.createElement(this.props.weekCell, { ...l, key: o }, a) : /* @__PURE__ */ r.createElement(N, { ...l, key: o }, a);
-    }, this.buildRow = (t) => t.map((e, i) => {
+      return this.props.weekCell ? /* @__PURE__ */ i.createElement(this.props.weekCell, { ...l, key: o }, n) : /* @__PURE__ */ i.createElement(y, { ...l, key: o }, n);
+    }, this.buildRow = (t) => t.map((e, r) => {
       if (!e)
-        return k(i);
-      const n = { "aria-selected": e.isSelected }, a = `kendo-react-calendar-cell-${e.value.getTime()}`, o = {
-        ...n,
+        return k(r);
+      const a = { "aria-selected": e.isSelected }, n = `kendo-react-calendar-cell-${e.value.getTime()}`, o = {
+        ...a,
         ...e,
         isDisabled: !e.isInRange,
         view: this.props.activeView,
         showOtherMonthDays: this.props.showOtherMonthDays,
+        allowReverse: this.props.allowReverse,
         onClick: this.handleClick,
         onMouseEnter: this.handleMouseEnter,
         onMouseLeave: this.handleMouseLeave
       };
-      return this.props.cell ? /* @__PURE__ */ r.createElement(this.props.cell, { ...o, key: a }, e.formattedValue) : /* @__PURE__ */ r.createElement(g, { ...o, key: a }, e.formattedValue);
+      return this.props.cell ? /* @__PURE__ */ i.createElement(this.props.cell, { ...o, key: n }, e.formattedValue) : /* @__PURE__ */ i.createElement(g, { ...o, key: n }, e.formattedValue);
     }), this.firstDate = (t) => {
       const e = this.firstWeekDateContext(t);
       return e ? e.value : null;
     }, this.firstWeekDateContext = (t) => {
       if (!this.weekNumber)
         return null;
-      let e = 0, i = t[e];
-      for (; !i && e < t.length; )
-        i = t[++e];
-      return i;
+      let e = 0, r = t[e];
+      for (; !r && e < t.length; )
+        r = t[++e];
+      return r;
     }, this.handleClick = (t, e) => {
-      const { onChange: i } = this.props;
-      if (i && e) {
-        const n = {
+      const { onChange: r } = this.props;
+      if (r && e) {
+        const a = {
           value: p(t),
           target: this,
           nativeEvent: e && e.nativeEvent,
           syntheticEvent: e
         };
-        i.call(void 0, n);
+        r.call(void 0, a);
       }
+    }, this.handleWeekCellClick = (t, e, r) => {
+      const { onWeekSelect: a } = this.props, n = e.findIndex((o) => o && o.value === t);
+      a && r && a.call(void 0, t, n, r);
     }, this.handleMouseEnter = (t) => {
       const { onCellEnter: e } = this.props;
       e && e.call(void 0, p(t));
@@ -88,8 +94,8 @@ const k = (f) => /* @__PURE__ */ r.createElement("td", { key: f, className: "k-c
     return this.props.selectedDate !== void 0 ? this.props.selectedDate : c.defaultProps.selectedDate;
   }
   render() {
-    this.intl = w(this), this.weekService = new y(this.intl);
-    const t = this.weekService.getWeekNames(this.weekNumber, this.props.weekDaysFormat), e = this.props.service.rowLength(this.weekNumber), i = this.props.service.title(this.props.viewDate), n = d(), a = b(this.props.viewDate, n), o = this.props.service.data({
+    this.intl = D(this), this.weekService = new b(this.intl);
+    const t = this.weekService.getWeekNames(this.weekNumber, this.props.weekDaysFormat), e = this.props.service.rowLength(this.weekNumber), r = this.props.service.title(this.props.viewDate), a = d(), n = N(this.props.viewDate, a), o = this.props.service.data({
       cellUID: this.props.cellUID,
       min: this.min,
       max: this.max,
@@ -97,35 +103,35 @@ const k = (f) => /* @__PURE__ */ r.createElement("td", { key: f, className: "k-c
       isActiveView: !this.props.bus.canMoveDown(this.props.activeView),
       selectedDate: this.selectedDate,
       selectionRange: this.props.selectionRange,
-      viewDate: a
+      viewDate: n
     });
-    return /* @__PURE__ */ r.createElement(r.Fragment, null, this.isMonthView && this.isHorizontal && /* @__PURE__ */ r.createElement(
+    return /* @__PURE__ */ i.createElement(i.Fragment, null, this.isMonthView && this.isHorizontal && /* @__PURE__ */ i.createElement(
       "thead",
       {
         role: "rowgroup",
         className: "k-calendar-thead"
       },
-      /* @__PURE__ */ r.createElement("tr", { role: "row", className: "k-calendar-tr" }, t.map((l, h) => /* @__PURE__ */ r.createElement("th", { key: h, className: "k-calendar-th" }, l)))
-    ), /* @__PURE__ */ r.createElement(
+      /* @__PURE__ */ i.createElement("tr", { role: "row", className: "k-calendar-tr" }, t.map((l, h) => /* @__PURE__ */ i.createElement("th", { key: h, className: "k-calendar-th" }, l)))
+    ), /* @__PURE__ */ i.createElement(
       "tbody",
       {
         role: "rowgroup",
         className: "k-calendar-tbody"
       },
-      !this.isHorizontal && /* @__PURE__ */ r.createElement("tr", { role: "presentation", className: "k-calendar-tr" }, /* @__PURE__ */ r.createElement(
+      !this.isHorizontal && /* @__PURE__ */ i.createElement("tr", { role: "presentation", className: "k-calendar-tr" }, /* @__PURE__ */ i.createElement(
         "th",
         {
           scope: "col",
           colSpan: e,
           className: "k-calendar-caption"
         },
-        i
+        r
       )),
-      o.map((l, h) => /* @__PURE__ */ r.createElement("tr", { role: "row", className: "k-calendar-tr", key: h }, this.weekNumber && this.buildWeekNumber(l, h), this.buildRow(l)))
+      o.map((l, h) => /* @__PURE__ */ i.createElement("tr", { role: "row", className: "k-calendar-tr", key: h }, this.weekNumber && this.buildWeekNumber(l, h), this.buildRow(l)))
     ));
   }
   getWeekNumber(t) {
-    return !this.weekNumber || !this.intl ? null : D(t, this.intl.firstDay());
+    return !this.weekNumber || !this.intl ? null : w(t, this.intl.firstDay());
   }
 };
 c.propTypes = {

package/common/ClearButton.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use client";"use strict";const i=require("react"),a=require("@progress/kendo-react-intl"),o=require("../messages/index.js"),l=require("@progress/kendo-react-common"),u=require("@progress/kendo-svg-icons");function p(n){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const t in n)if(t!=="default"){const c=Object.getOwnPropertyDescriptor(n,t);Object.defineProperty(e,t,c.get?c:{enumerable:!0,get:()=>n[t]})}}return e.default=n,Object.freeze(e)}const r=p(i);class s extends r.Component{constructor(){super(...arguments),this.handelClick=e=>{e.stopPropagation();const{onClick:t}=this.props;t&&t.call(void 0,e)}}render(){const e=a.provideLocalizationService(this).toLanguageString(o.clear,o.messages[o.clear]);return r.createElement("span",{className:"k-clear-value",role:"button",onClick:this.handelClick,tabIndex:this.props.tabindex||-1,title:e,key:"clearbutton"},r.createElement(l.IconWrap,{name:"x",icon:u.xIcon}))}}a.registerForLocalization(s);module.exports=s;

package/common/ClearButton.mjs

@@ -0,0 +1,41 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use client";
+import * as e from "react";
+import { provideLocalizationService as a, registerForLocalization as n } from "@progress/kendo-react-intl";
+import { clear as r, messages as i } from "../messages/index.mjs";
+import { IconWrap as s } from "@progress/kendo-react-common";
+import { xIcon as c } from "@progress/kendo-svg-icons";
+class l extends e.Component {
+  constructor() {
+    super(...arguments), this.handelClick = (t) => {
+      t.stopPropagation();
+      const { onClick: o } = this.props;
+      o && o.call(void 0, t);
+    };
+  }
+  render() {
+    const t = a(this).toLanguageString(r, i[r]);
+    return /* @__PURE__ */ e.createElement(
+      "span",
+      {
+        className: "k-clear-value",
+        role: "button",
+        onClick: this.handelClick,
+        tabIndex: this.props.tabindex || -1,
+        title: t,
+        key: "clearbutton"
+      },
+      /* @__PURE__ */ e.createElement(s, { name: "x", icon: c })
+    );
+  }
+}
+n(l);
+export {
+  l as default
+};

package/dateinput/DateInput.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 T=require("react"),t=require("prop-types"),g=require("@progress/kendo-date-math"),P=require("@progress/kendo-react-buttons"),F=require("@progress/kendo-svg-icons"),y=require("@progress/kendo-react-intl"),q=require("./models/kendo-date.js"),l=require("@progress/kendo-react-common"),B=require("@progress/kendo-react-labels"),_=require("../package-metadata.js"),v=require("./utils.js"),b=require("../utils.js"),h=require("../messages/index.js"),A=require("../timepicker/utils.js");function L(f){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(f){for(const e in f)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(f,e);Object.defineProperty(i,e,s.get?s:{enumerable:!0,get:()=>f[e]})}}return i.default=f,Object.freeze(i)}const u=L(T),N="Please enter a valid value!",o=class o extends u.Component{constructor(i){super(i),this.kendoDate=null,this.currentFormat="",this.paste=!1,this._element=null,this._wrapper=null,this._lastSelectedSymbol="",this.focus=()=>{this._element&&this._element.focus()},this.setValidity=()=>{this.element&&this.element.setCustomValidity&&this.element.setCustomValidity(this.validity.valid?"":this.props.validationMessage||o.defaultProps.validationMessage)},this.updateOnPaste=e=>{if(!this.element||!this.kendoDate)return;const s=y.provideIntlService(this).parseDate(this.element.value,this.props.format)||this.value,a=this.value;this.kendoDate.setValue(s),this.triggerChange(e,a)},this.spinnersMouseDown=e=>{e.preventDefault();const s=l.getActiveElement(document);this.element&&s!==this.element&&this.element.focus({preventScroll:!0})},this.handlePaste=()=>{this.paste=!0},this.elementChange=e=>{if(!this.element||!this.kendoDate)return;if(this.paste){this.updateOnPaste(e),this.paste=!1;return}const{text:s,format:a}=this.kendoDate.getTextAndFormat();this.currentFormat=a;const r=this.value,n=v.approximateStringMatching(s,this.currentFormat,this.element.value,this.selection.start),d=n.length===1&&n[0][1]==="_";if(!d)for(let c=0;c<n.length;c++)this.kendoDate.parsePart(n[c][0],n[c][1]);n.length&&n[0][0]!=="_"&&this.setSelection(this.selectionBySymbol(n[0][0])),d&&this.switchDateSegment(1),this.triggerChange(e,r)},this.elementClick=e=>{this.setSelection(this.selectionByIndex(this.selection.start))},this.nativeWheel=e=>{l.getActiveElement(document)===this.element&&e.preventDefault()},this.wheel=e=>{l.getActiveElement(document)===this.element&&(e.nativeEvent.deltaY<0&&this.increasePart(e),e.nativeEvent.deltaY>0&&this.decreasePart(e))},this.increasePart=e=>{this.modifyDateSegmentValue(1,e)},this.decreasePart=e=>{this.modifyDateSegmentValue(-1,e)},this.elementKeyDown=e=>{if(!e.altKey){switch(e.keyCode){case 37:this.switchDateSegment(-1);break;case 38:this.modifyDateSegmentValue(1,e);break;case 39:this.switchDateSegment(1);break;case 40:this.modifyDateSegmentValue(-1,e);break;default:return}e.preventDefault()}},this.elementOnFocus=e=>{this.wrapper&&this.wrapper.classList.add("k-focus"),this.setState({focused:!0})},this.elementOnBlur=e=>{this.wrapper&&this.wrapper.classList.remove("k-focus"),this.setState({focused:!1})},l.validatePackage(_.packageMetadata),this.state={focused:!1}}get _inputId(){return this.props.id+"-accessibility-id"}componentDidMount(){this.setValidity(),this.wrapper&&this.wrapper.addEventListener("wheel",this.nativeWheel,{passive:!1})}componentDidUpdate(i,e){this._lastSelectedSymbol&&e.focused===this.state.focused?this.setSelection(this.selectionBySymbol(this._lastSelectedSymbol)):this.props.placeholder!==void 0&&this.selection.start===this.selection.end&&this.setSelection({start:0,end:this.currentFormat.length}),this.setValidity()}componentWillUnmount(){this.wrapper&&this.wrapper.removeEventListener("wheel",this.nativeWheel)}render(){const{size:i=o.defaultProps.size,fillMode:e=o.defaultProps.fillMode,rounded:s=o.defaultProps.rounded}=this.props;this.props._ref&&(this.props._ref.current=this);const a=y.provideLocalizationService(this),r={...o.defaultProps,...this.props},{name:n,label:d,id:c}=r,p=this.text,I=p===this.props.placeholder?"":p,x=p===this.props.placeholder?p:void 0,S=c||this._inputId,w=!this.validityStyles||this.validity.valid;let C=[...v.wrapperClasses];this.props.className&&C.push(this.props.className);const O=u.createElement(l.AsyncFocusBlur,{onFocus:this.elementOnFocus,onBlur:this.elementOnBlur},({onFocus:M,onBlur:V})=>u.createElement("span",{ref:D=>{this._wrapper=D},style:d?void 0:{width:this.props.width},dir:this.props.dir,className:l.classNames("k-dateinput","k-input",{[`k-input-${l.kendoThemeMaps.sizeMap[i]||i}`]:i,[`k-input-${e}`]:e,[`k-rounded-${l.kendoThemeMaps.roundedMap[s]||s}`]:s,"k-invalid":!w,"k-required":this.required,"k-disabled":this.props.disabled},this.props.className),onFocus:M,onBlur:V},u.createElement("input",{role:this.props.ariaRole||"textbox",readOnly:this.props.readonly,tabIndex:this.props.tabIndex,disabled:this.props.disabled,title:this.props.title!==void 0?this.props.title:p,type:"text",spellCheck:!1,autoComplete:"off",autoCorrect:"off",className:"k-input-inner",id:S,"aria-label":this.props.ariaLabel,"aria-labelledby":this.props.ariaLabelledBy,"aria-describedby":this.props.ariaDescribedBy,"aria-haspopup":this.props.ariaHasPopup,"aria-disabled":this.props.disabled,"aria-expanded":this.props.ariaExpanded,"aria-controls":this.props.ariaControls,onWheel:this.wheel,onClick:this.elementClick,onInput:this.elementChange,onPaste:this.handlePaste,onKeyDown:this.elementKeyDown,onChange:l.noop,value:I,placeholder:x,name:n,ref:D=>this._element=D}),this.props.children,this.props.spinners&&u.createElement("span",{className:"k-input-spinner k-spin-button",onMouseDown:this.spinnersMouseDown},u.createElement(P.Button,{tabIndex:-1,type:"button",rounded:null,className:"k-spinner-increase",icon:"caret-alt-up",svgIcon:F.caretAltUpIcon,"aria-label":a.toLanguageString(h.increaseValue,h.messages[h.increaseValue]),title:a.toLanguageString(h.increaseValue,h.messages[h.increaseValue]),onClick:this.increasePart}),u.createElement(P.Button,{tabIndex:-1,type:"button",rounded:null,className:"k-spinner-decrease",icon:"caret-alt-down",svgIcon:F.caretAltDownIcon,"aria-label":a.toLanguageString(h.decreaseValue,h.messages[h.decreaseValue]),title:a.toLanguageString(h.decreaseValue,h.messages[h.decreaseValue]),onClick:this.decreasePart}))));return d?u.createElement(B.FloatingLabel,{label:d,editorId:S,editorValue:p,editorValid:w,editorDisabled:this.props.disabled,children:O,style:{width:this.props.width}}):O}get value(){return this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.kendoDate&&this.kendoDate.getDateObject()}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 text(){const i={...k.defaultProps,...this.props},{formatPlaceholder:e=o.defaultProps.formatPlaceholder,format:s=o.defaultProps.format,value:a,defaultValue:r}=i;this.kendoDate===null?(this.kendoDate=new q.KendoDate(this.intl.bind(this),e,s),this.kendoDate.setValue(a||r||null)):(this.kendoDate.format=s,this.kendoDate.formatPlaceholder=e),a!==void 0&&this.value!==a&&this.kendoDate.setValue(a);const{text:n,format:d}=this.kendoDate.getTextAndFormat();return this.currentFormat=d,i.placeholder!==null&&i.placeholder!==void 0&&!this.state.focused&&!this.kendoDate.hasValue()?i.placeholder:n}get validity(){const i=v.isInRange(this.value,this.min,this.max)&&A.isInTimeRange(this.value,this.props.minTime,this.props.maxTime),e=this.props.validationMessage!==void 0,s=(!this.required||this.value!==null)&&i,a=this.props.valid!==void 0?this.props.valid:s;return{customError:e,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 element(){return this._element}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}get wrapper(){return this._wrapper}intl(){return y.provideIntlService(this)}get selection(){let i={start:0,end:0};return this.element!==null&&this.element.selectionStart!==void 0&&(i={start:this.element.selectionStart,end:this.element.selectionEnd}),i}setSelection(i){this._lastSelectedSymbol=this.currentFormat[i.start],window.requestAnimationFrame(()=>{const e=l.getActiveElement(document);this.element&&e===this.element&&!this.props.disableSelection&&this.element.setSelectionRange(i.start,i.end)})}triggerChange(i,e){this.valueDuringOnChange=this.value,this.forceUpdate(),this.props.onChange&&!g.isEqual(e,this.value)&&this.props.onChange.call(void 0,{syntheticEvent:i,nativeEvent:i.nativeEvent,value:this.value,target:this}),this.valueDuringOnChange=void 0}selectionBySymbol(i){let e=-1,s=0;for(let a=0;a<this.currentFormat.length;a++)this.currentFormat[a]===i&&(s=a+1,e===-1&&(e=a));return e<0&&(e=0),{start:e,end:s}}selectionByIndex(i){let e={start:i,end:i};for(let s=i,a=i-1;s<this.currentFormat.length||a>=0;s++,a--){if(s<this.currentFormat.length&&this.currentFormat[s]!=="_"){e=this.selectionBySymbol(this.currentFormat[s]);break}if(a>=0&&this.currentFormat[a]!=="_"){e=this.selectionBySymbol(this.currentFormat[a]);break}}return e}switchDateSegment(i){const{start:e,end:s}=this.selection;if(e<s&&this.currentFormat[e]!==this.currentFormat[s-1]){this.setSelection(this.selectionByIndex(i>0?e:s-1));return}const a=this.currentFormat[e];let r=e+i;for(;r>0&&r<this.currentFormat.length&&!(this.currentFormat[r]!==a&&this.currentFormat[r]!=="_");)r+=i;if(this.currentFormat[r]==="_")return;let n=r;for(;n>=0&&n<this.currentFormat.length&&this.currentFormat[n]===this.currentFormat[r];)n+=i;r>n&&(n+1!==e||r+1!==s)?this.setSelection({start:n+1,end:r+1}):r<n&&(r!==e||n!==s)&&this.setSelection({start:r,end:n})}modifyDateSegmentValue(i,e){if(!this.kendoDate)return;const s=this.value,a=this.currentFormat[this.selection.start],r=this.kendoDate.symbolMap(a),n=((this.props.steps||{})[r]||1)*i;this.kendoDate.modifyPart(a,n),this.triggerChange(e,s)}};o.displayName="DateInput",o.propTypes={value: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"])})]),formatPlaceholder:t.oneOfType([t.oneOf(["wide","narrow","short","formatPattern"]),t.shape({year:t.string,month:t.string,day:t.string,hour:t.string,minute:t.string,second:t.string})]),width:t.oneOfType([t.string,t.number]),tabIndex:t.number,title:t.string,steps:t.shape({year:t.number,month:t.number,day:t.number,hour:t.number,minute:t.number,second:t.number}),min:t.instanceOf(Date),max:t.instanceOf(Date),disabled:t.bool,spinners:t.bool,name:t.string,dir:t.string,label:t.string,id:t.string,ariaLabelledBy:t.string,ariaDescribedBy:t.string,ariaLabel:t.string,ariaRole:t.string,ariaHasPopup:t.oneOfType([t.bool,t.string]),ariaExpanded:t.oneOfType([t.bool]),onChange:t.func,validationMessage:t.string,required:t.bool,validate:t.bool,valid:t.bool,size:t.oneOf([null,"small","medium","large"]),rounded:t.oneOf([null,"small","medium","large","full"]),fillMode:t.oneOf([null,"solid","flat","outline"])},o.defaultProps={format:v.defaultFormat,size:"medium",rounded:"medium",fillMode:"solid",formatPlaceholder:v.defaultFormatPlaceholder,spinners:!1,disabled:!1,max:g.cloneDate(b.MAX_DATE),min:g.cloneDate(b.MIN_DATE),minTime:g.cloneDate(b.MIN_TIME),maxTime:g.cloneDate(b.MAX_TIME),required:!1,validityStyles:!0,validationMessage:N,placeholder:null,ariaHasPopup:"grid"};let m=o;const E=l.createPropsContext(),k=l.withIdHOC(l.withPropsContext(E,m));k.displayName="KendoReactDateInput";y.registerForIntl(m);y.registerForLocalization(m);exports.DateInput=k;exports.DateInputPropsContext=E;exports.DateInputWithoutContext=m;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("react"),t=require("prop-types"),g=require("@progress/kendo-date-math"),P=require("@progress/kendo-react-buttons"),F=require("@progress/kendo-svg-icons"),y=require("@progress/kendo-react-intl"),q=require("./models/kendo-date.js"),l=require("@progress/kendo-react-common"),B=require("@progress/kendo-react-labels"),_=require("../package-metadata.js"),v=require("./utils.js"),b=require("../utils.js"),h=require("../messages/index.js"),A=require("../timepicker/utils.js"),L=require("../common/ClearButton.js");function N(f){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(f){for(const e in f)if(e!=="default"){const i=Object.getOwnPropertyDescriptor(f,e);Object.defineProperty(s,e,i.get?i:{enumerable:!0,get:()=>f[e]})}}return s.default=f,Object.freeze(s)}const d=N(T),R="Please enter a valid value!",o=class o extends d.Component{constructor(s){super(s),this.kendoDate=null,this.currentFormat="",this.paste=!1,this._element=null,this._wrapper=null,this._lastSelectedSymbol="",this.focus=()=>{this._element&&this._element.focus()},this.setValidity=()=>{this.element&&this.element.setCustomValidity&&this.element.setCustomValidity(this.validity.valid?"":this.props.validationMessage||o.defaultProps.validationMessage)},this.updateOnPaste=e=>{if(!this.element||!this.kendoDate)return;const i=y.provideIntlService(this).parseDate(this.element.value,this.props.format)||this.value,a=this.value;this.kendoDate.setValue(i),this.triggerChange(e,a)},this.spinnersMouseDown=e=>{e.preventDefault();const i=l.getActiveElement(document);this.element&&i!==this.element&&this.element.focus({preventScroll:!0})},this.handlePaste=()=>{this.paste=!0},this.handleClick=e=>{this.props.onChange&&this.props.onChange(e)},this.elementChange=e=>{if(!this.element||!this.kendoDate)return;if(this.paste){this.updateOnPaste(e),this.paste=!1;return}const{text:i,format:a}=this.kendoDate.getTextAndFormat();this.currentFormat=a;const r=this.value,n=v.approximateStringMatching(i,this.currentFormat,this.element.value,this.selection.start),u=n.length===1&&n[0][1]==="_";if(!u)for(let c=0;c<n.length;c++)this.kendoDate.parsePart(n[c][0],n[c][1]);n.length&&n[0][0]!=="_"&&this.setSelection(this.selectionBySymbol(n[0][0])),u&&this.switchDateSegment(1),this.triggerChange(e,r)},this.elementClick=e=>{this.setSelection(this.selectionByIndex(this.selection.start))},this.nativeWheel=e=>{l.getActiveElement(document)===this.element&&e.preventDefault()},this.wheel=e=>{l.getActiveElement(document)===this.element&&(e.nativeEvent.deltaY<0&&this.increasePart(e),e.nativeEvent.deltaY>0&&this.decreasePart(e))},this.increasePart=e=>{this.modifyDateSegmentValue(1,e)},this.decreasePart=e=>{this.modifyDateSegmentValue(-1,e)},this.elementKeyDown=e=>{if(!e.altKey){switch(e.keyCode){case 37:this.switchDateSegment(-1);break;case 38:this.modifyDateSegmentValue(1,e);break;case 39:this.switchDateSegment(1);break;case 40:this.modifyDateSegmentValue(-1,e);break;default:return}e.preventDefault()}},this.elementOnFocus=e=>{this.wrapper&&this.wrapper.classList.add("k-focus"),this.setState({focused:!0})},this.elementOnBlur=e=>{this.wrapper&&this.wrapper.classList.remove("k-focus"),this.setState({focused:!1})},l.validatePackage(_.packageMetadata),this.state={focused:!1}}get _inputId(){return this.props.id+"-accessibility-id"}componentDidMount(){this.setValidity(),this.wrapper&&this.wrapper.addEventListener("wheel",this.nativeWheel,{passive:!1})}componentDidUpdate(s,e){this._lastSelectedSymbol&&e.focused===this.state.focused?this.setSelection(this.selectionBySymbol(this._lastSelectedSymbol)):this.props.placeholder!==void 0&&this.selection.start===this.selection.end&&this.setSelection({start:0,end:this.currentFormat.length}),this.setValidity()}componentWillUnmount(){this.wrapper&&this.wrapper.removeEventListener("wheel",this.nativeWheel)}render(){const{size:s=o.defaultProps.size,fillMode:e=o.defaultProps.fillMode,rounded:i=o.defaultProps.rounded}=this.props;this.props._ref&&(this.props._ref.current=this);const a=y.provideLocalizationService(this),r={...o.defaultProps,...this.props},{name:n,label:u,id:c}=r,p=this.text,E=p===this.props.placeholder?"":p,I=p===this.props.placeholder?p:void 0,S=c||this._inputId,w=!this.validityStyles||this.validity.valid,x=[...v.wrapperClasses];this.props.className&&x.push(this.props.className);const O=d.createElement(l.AsyncFocusBlur,{onFocus:this.elementOnFocus,onBlur:this.elementOnBlur},({onFocus:M,onBlur:V})=>d.createElement("span",{ref:k=>{this._wrapper=k},style:u?void 0:{width:this.props.width},dir:this.props.dir,className:l.classNames("k-dateinput","k-input",{[`k-input-${l.kendoThemeMaps.sizeMap[s]||s}`]:s,[`k-input-${e}`]:e,[`k-rounded-${l.kendoThemeMaps.roundedMap[i]||i}`]:i,"k-invalid":!w,"k-required":this.required,"k-disabled":this.props.disabled},this.props.className),onFocus:M,onBlur:V},d.createElement("input",{role:this.props.ariaRole||"textbox",readOnly:this.props.readonly,tabIndex:this.props.tabIndex,disabled:this.props.disabled,title:this.props.title!==void 0?this.props.title:p,type:"text",spellCheck:!1,autoComplete:"off",autoCorrect:"off",className:"k-input-inner",id:S,"aria-label":this.props.ariaLabel,"aria-labelledby":this.props.ariaLabelledBy,"aria-describedby":this.props.ariaDescribedBy,"aria-haspopup":this.props.ariaHasPopup,"aria-disabled":this.props.disabled,"aria-expanded":this.props.ariaExpanded,"aria-controls":this.props.ariaControls,onWheel:this.wheel,onClick:this.elementClick,onInput:this.elementChange,onPaste:this.handlePaste,onKeyDown:this.elementKeyDown,onChange:l.noop,value:E,placeholder:I,name:n,ref:k=>this._element=k}),this.props.children,this.props.clearButton&&this.props.value&&d.createElement(L,{onClick:this.handleClick,key:"clearbutton"}),this.props.spinners&&d.createElement("span",{className:"k-input-spinner k-spin-button",onMouseDown:this.spinnersMouseDown},d.createElement(P.Button,{tabIndex:-1,type:"button",rounded:null,className:"k-spinner-increase",icon:"caret-alt-up",svgIcon:F.caretAltUpIcon,"aria-label":a.toLanguageString(h.increaseValue,h.messages[h.increaseValue]),title:a.toLanguageString(h.increaseValue,h.messages[h.increaseValue]),onClick:this.increasePart}),d.createElement(P.Button,{tabIndex:-1,type:"button",rounded:null,className:"k-spinner-decrease",icon:"caret-alt-down",svgIcon:F.caretAltDownIcon,"aria-label":a.toLanguageString(h.decreaseValue,h.messages[h.decreaseValue]),title:a.toLanguageString(h.decreaseValue,h.messages[h.decreaseValue]),onClick:this.decreasePart}))));return u?d.createElement(B.FloatingLabel,{label:u,editorId:S,editorValue:p,editorValid:w,editorDisabled:this.props.disabled,children:O,style:{width:this.props.width}}):O}get value(){return this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.kendoDate&&this.kendoDate.getDateObject()}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 text(){const s={...D.defaultProps,...this.props},{formatPlaceholder:e=o.defaultProps.formatPlaceholder,format:i=o.defaultProps.format,value:a,defaultValue:r}=s;this.kendoDate===null?(this.kendoDate=new q.KendoDate(this.intl.bind(this),e,i),this.kendoDate.setValue(a||r||null)):(this.kendoDate.format=i,this.kendoDate.formatPlaceholder=e),a!==void 0&&this.value!==a&&this.kendoDate.setValue(a);const{text:n,format:u}=this.kendoDate.getTextAndFormat();return this.currentFormat=u,s.placeholder!==null&&s.placeholder!==void 0&&!this.state.focused&&!this.kendoDate.hasValue()?s.placeholder:n}get validity(){const s=v.isInRange(this.value,this.min,this.max)&&A.isInTimeRange(this.value,this.props.minTime,this.props.maxTime),e=this.props.validationMessage!==void 0,i=(!this.required||this.value!==null)&&s,a=this.props.valid!==void 0?this.props.valid:i;return{customError:e,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 element(){return this._element}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}get wrapper(){return this._wrapper}intl(){return y.provideIntlService(this)}get selection(){let s={start:0,end:0};return this.element!==null&&this.element.selectionStart!==void 0&&(s={start:this.element.selectionStart,end:this.element.selectionEnd}),s}setSelection(s){this._lastSelectedSymbol=this.currentFormat[s.start],window.requestAnimationFrame(()=>{const e=l.getActiveElement(document);this.element&&e===this.element&&!this.props.disableSelection&&this.element.setSelectionRange(s.start,s.end)})}triggerChange(s,e){this.valueDuringOnChange=this.value,this.forceUpdate(),this.props.onChange&&!g.isEqual(e,this.value)&&this.props.onChange.call(void 0,{syntheticEvent:s,nativeEvent:s.nativeEvent,value:this.value,target:this}),this.valueDuringOnChange=void 0}selectionBySymbol(s){let e=-1,i=0;for(let a=0;a<this.currentFormat.length;a++)this.currentFormat[a]===s&&(i=a+1,e===-1&&(e=a));return e<0&&(e=0),{start:e,end:i}}selectionByIndex(s){let e={start:s,end:s};for(let i=s,a=s-1;i<this.currentFormat.length||a>=0;i++,a--){if(i<this.currentFormat.length&&this.currentFormat[i]!=="_"){e=this.selectionBySymbol(this.currentFormat[i]);break}if(a>=0&&this.currentFormat[a]!=="_"){e=this.selectionBySymbol(this.currentFormat[a]);break}}return e}switchDateSegment(s){const{start:e,end:i}=this.selection;if(e<i&&this.currentFormat[e]!==this.currentFormat[i-1]){this.setSelection(this.selectionByIndex(s>0?e:i-1));return}const a=this.currentFormat[e];let r=e+s;for(;r>0&&r<this.currentFormat.length&&!(this.currentFormat[r]!==a&&this.currentFormat[r]!=="_");)r+=s;if(this.currentFormat[r]==="_")return;let n=r;for(;n>=0&&n<this.currentFormat.length&&this.currentFormat[n]===this.currentFormat[r];)n+=s;r>n&&(n+1!==e||r+1!==i)?this.setSelection({start:n+1,end:r+1}):r<n&&(r!==e||n!==i)&&this.setSelection({start:r,end:n})}modifyDateSegmentValue(s,e){if(!this.kendoDate)return;const i=this.value,a=this.currentFormat[this.selection.start],r=this.kendoDate.symbolMap(a),n=((this.props.steps||{})[r]||1)*s;this.kendoDate.modifyPart(a,n),this.triggerChange(e,i)}};o.displayName="DateInput",o.propTypes={value: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"])})]),formatPlaceholder:t.oneOfType([t.oneOf(["wide","narrow","short","formatPattern"]),t.shape({year:t.string,month:t.string,day:t.string,hour:t.string,minute:t.string,second:t.string})]),width:t.oneOfType([t.string,t.number]),tabIndex:t.number,title:t.string,steps:t.shape({year:t.number,month:t.number,day:t.number,hour:t.number,minute:t.number,second:t.number}),min:t.instanceOf(Date),max:t.instanceOf(Date),disabled:t.bool,spinners:t.bool,name:t.string,dir:t.string,label:t.string,id:t.string,ariaLabelledBy:t.string,ariaDescribedBy:t.string,ariaLabel:t.string,ariaRole:t.string,ariaHasPopup:t.oneOfType([t.bool,t.string]),ariaExpanded:t.oneOfType([t.bool]),onChange:t.func,validationMessage:t.string,required:t.bool,validate:t.bool,valid:t.bool,size:t.oneOf([null,"small","medium","large"]),rounded:t.oneOf([null,"small","medium","large","full"]),fillMode:t.oneOf([null,"solid","flat","outline"])},o.defaultProps={format:v.defaultFormat,size:"medium",rounded:"medium",fillMode:"solid",formatPlaceholder:v.defaultFormatPlaceholder,spinners:!1,disabled:!1,max:g.cloneDate(b.MAX_DATE),min:g.cloneDate(b.MIN_DATE),minTime:g.cloneDate(b.MIN_TIME),maxTime:g.cloneDate(b.MAX_TIME),required:!1,validityStyles:!0,validationMessage:R,placeholder:null,ariaHasPopup:"grid"};let m=o;const C=l.createPropsContext(),D=l.withIdHOC(l.withPropsContext(C,m));D.displayName="KendoReactDateInput";y.registerForIntl(m);y.registerForLocalization(m);exports.DateInput=D;exports.DateInputPropsContext=C;exports.DateInputWithoutContext=m;

package/dateinput/DateInput.mjs

@@ -6,10 +6,10 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import * as h from "react";
+import * as l from "react";
 import e from "prop-types";
 import { cloneDate as m, isEqual as M } from "@progress/kendo-date-math";
-import { Button as k } from "@progress/kendo-react-buttons";
+import { Button as S } from "@progress/kendo-react-buttons";
 import { caretAltUpIcon as T, caretAltDownIcon as V } from "@progress/kendo-svg-icons";
 import { provideIntlService as w, provideLocalizationService as B, registerForIntl as _, registerForLocalization as L } from "@progress/kendo-react-intl";
 import { KendoDate as N } from "./models/kendo-date.mjs";
@@ -20,7 +20,8 @@ import { approximateStringMatching as X, defaultFormat as Y, defaultFormatPlaceh
 import { MAX_DATE as J, MIN_DATE as Q, MIN_TIME as ee, MAX_TIME as te } from "../utils.mjs";
 import { increaseValue as f, messages as g, decreaseValue as v } from "../messages/index.mjs";
 import { isInTimeRange as ie } from "../timepicker/utils.mjs";
-const se = "Please enter a valid value!", o = class o extends h.Component {
+import se from "../common/ClearButton.mjs";
+const re = "Please enter a valid value!", o = class o extends l.Component {
   constructor(i) {
     super(i), this.kendoDate = null, this.currentFormat = "", this.paste = !1, this._element = null, this._wrapper = null, this._lastSelectedSymbol = "", this.focus = () => {
       this._element && this._element.focus();
@@ -39,6 +40,8 @@ const se = "Please enter a valid value!", o = class o extends h.Component {
       this.element && s !== this.element && this.element.focus({ preventScroll: !0 });
     }, this.handlePaste = () => {
       this.paste = !0;
+    }, this.handleClick = (t) => {
+      this.props.onChange && this.props.onChange(t);
     }, this.elementChange = (t) => {
       if (!this.element || !this.kendoDate)
         return;
@@ -53,11 +56,11 @@ const se = "Please enter a valid value!", o = class o extends h.Component {
         this.currentFormat,
         this.element.value,
         this.selection.start
-      ), l = a.length === 1 && a[0][1] === "_";
-      if (!l)
+      ), h = a.length === 1 && a[0][1] === "_";
+      if (!h)
         for (let d = 0; d < a.length; d++)
           this.kendoDate.parsePart(a[d][0], a[d][1]);
-      a.length && a[0][0] !== "_" && this.setSelection(this.selectionBySymbol(a[0][0])), l && this.switchDateSegment(1), this.triggerChange(t, n);
+      a.length && a[0][0] !== "_" && this.setSelection(this.selectionBySymbol(a[0][0])), h && this.switchDateSegment(1), this.triggerChange(t, n);
     }, this.elementClick = (t) => {
       this.setSelection(this.selectionByIndex(this.selection.start));
     }, this.nativeWheel = (t) => {
@@ -127,16 +130,15 @@ const se = "Please enter a valid value!", o = class o extends h.Component {
       rounded: s = o.defaultProps.rounded
     } = this.props;
     this.props._ref && (this.props._ref.current = this);
-    const r = B(this), n = { ...o.defaultProps, ...this.props }, { name: a, label: l, id: d } = n, p = this.text, O = p === this.props.placeholder ? "" : p, E = p === this.props.placeholder ? p : void 0, b = d || this._inputId, D = !this.validityStyles || this.validity.valid;
-    let x = [...Z];
-    this.props.className && x.push(this.props.className);
-    const S = /* @__PURE__ */ h.createElement(q, { onFocus: this.elementOnFocus, onBlur: this.elementOnBlur }, ({ onFocus: C, onBlur: I }) => /* @__PURE__ */ h.createElement(
+    const r = B(this), n = { ...o.defaultProps, ...this.props }, { name: a, label: h, id: d } = n, p = this.text, O = p === this.props.placeholder ? "" : p, C = p === this.props.placeholder ? p : void 0, b = d || this._inputId, k = !this.validityStyles || this.validity.valid, E = [...Z];
+    this.props.className && E.push(this.props.className);
+    const D = /* @__PURE__ */ l.createElement(q, { onFocus: this.elementOnFocus, onBlur: this.elementOnBlur }, ({ onFocus: x, onBlur: I }) => /* @__PURE__ */ l.createElement(
       "span",
       {
         ref: (y) => {
           this._wrapper = y;
         },
-        style: l ? void 0 : { width: this.props.width },
+        style: h ? void 0 : { width: this.props.width },
         dir: this.props.dir,
         className: z(
           "k-dateinput",
@@ -145,16 +147,16 @@ const se = "Please enter a valid value!", o = class o extends h.Component {
             [`k-input-${P.sizeMap[i] || i}`]: i,
             [`k-input-${t}`]: t,
             [`k-rounded-${P.roundedMap[s] || s}`]: s,
-            "k-invalid": !D,
+            "k-invalid": !k,
             "k-required": this.required,
             "k-disabled": this.props.disabled
           },
           this.props.className
         ),
-        onFocus: C,
+        onFocus: x,
         onBlur: I
       },
-      /* @__PURE__ */ h.createElement(
+      /* @__PURE__ */ l.createElement(
         "input",
         {
           role: this.props.ariaRole || "textbox",
@@ -182,14 +184,15 @@ const se = "Please enter a valid value!", o = class o extends h.Component {
           onKeyDown: this.elementKeyDown,
           onChange: R,
           value: O,
-          placeholder: E,
+          placeholder: C,
           name: a,
           ref: (y) => this._element = y
         }
       ),
       this.props.children,
-      this.props.spinners && /* @__PURE__ */ h.createElement("span", { className: "k-input-spinner k-spin-button", onMouseDown: this.spinnersMouseDown }, /* @__PURE__ */ h.createElement(
-        k,
+      this.props.clearButton && this.props.value && /* @__PURE__ */ l.createElement(se, { onClick: this.handleClick, key: "clearbutton" }),
+      this.props.spinners && /* @__PURE__ */ l.createElement("span", { className: "k-input-spinner k-spin-button", onMouseDown: this.spinnersMouseDown }, /* @__PURE__ */ l.createElement(
+        S,
         {
           tabIndex: -1,
           type: "button",
@@ -201,8 +204,8 @@ const se = "Please enter a valid value!", o = class o extends h.Component {
           title: r.toLanguageString(f, g[f]),
           onClick: this.increasePart
         }
-      ), /* @__PURE__ */ h.createElement(
-        k,
+      ), /* @__PURE__ */ l.createElement(
+        S,
         {
           tabIndex: -1,
           type: "button",
@@ -216,18 +219,18 @@ const se = "Please enter a valid value!", o = class o extends h.Component {
         }
       ))
     ));
-    return l ? /* @__PURE__ */ h.createElement(
+    return h ? /* @__PURE__ */ l.createElement(
       $,
       {
-        label: l,
+        label: h,
         editorId: b,
         editorValue: p,
-        editorValid: D,
+        editorValid: k,
         editorDisabled: this.props.disabled,
-        children: S,
+        children: D,
         style: { width: this.props.width }
       }
-    ) : S;
+    ) : D;
   }
   /* Public Getters */
   /**
@@ -259,8 +262,8 @@ const se = "Please enter a valid value!", o = class o extends h.Component {
       defaultValue: n
     } = i;
     this.kendoDate === null ? (this.kendoDate = new N(this.intl.bind(this), t, s), this.kendoDate.setValue(r || n || null)) : (this.kendoDate.format = s, this.kendoDate.formatPlaceholder = t), r !== void 0 && this.value !== r && this.kendoDate.setValue(r);
-    const { text: a, format: l } = this.kendoDate.getTextAndFormat();
-    return this.currentFormat = l, i.placeholder !== null && i.placeholder !== void 0 && !this.state.focused && !this.kendoDate.hasValue() ? i.placeholder : a;
+    const { text: a, format: h } = this.kendoDate.getTextAndFormat();
+    return this.currentFormat = h, i.placeholder !== null && i.placeholder !== void 0 && !this.state.focused && !this.kendoDate.hasValue() ? i.placeholder : a;
   }
   /**
    * Represents the validity state into which the DateInput is set.
@@ -486,18 +489,18 @@ o.displayName = "DateInput", o.propTypes = {
   maxTime: m(te),
   required: !1,
   validityStyles: !0,
-  validationMessage: se,
+  validationMessage: re,
   placeholder: null,
   // the rest of the properties are undefined by default
   ariaHasPopup: "grid"
 };
 let u = o;
-const re = K(), F = U(H(re, u));
+const ae = K(), F = U(H(ae, u));
 F.displayName = "KendoReactDateInput";
 _(u);
 L(u);
 export {
   F as DateInput,
-  re as DateInputPropsContext,
+  ae as DateInputPropsContext,
   u as DateInputWithoutContext
 };

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 R=require("react"),t=require("prop-types"),M=require("@progress/kendo-react-popup"),D=require("@progress/kendo-date-math"),o=require("@progress/kendo-react-common"),c=require("@progress/kendo-react-intl"),O=require("@progress/kendo-svg-icons"),k=require("../package-metadata.js"),g=require("../dateinput/DateInput.js"),T=require("../calendar/components/MultiViewCalendar.js"),h=require("../calendar/models/SelectionRange.js"),d=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(u){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(u){for(const e in u)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(u,e);Object.defineProperty(a,e,s.get?s:{enumerable:!0,get:()=>u[e]})}}return a.default=u,Object.freeze(a)}const i=A(R),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(M.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,{className:"!k-overflow-hidden"},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(k.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,...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,...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:O.arrowsSwapIcon}));return i.createElement(i.Fragment,null,i.createElement("span",{ref:y=>{this._element=y},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,ref:this._startDateInput,ariaRole:"combobox",ariaControls:this._popupId,readonly:this.mobileMode}),(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,readonly:this.mobileMode}),!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(let 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:d.nullable(t.instanceOf(Date).isRequired),end:d.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:d.nullable(t.instanceOf(Date).isRequired),end:d.nullable(t.instanceOf(Date).isRequired)})},l.defaultProps={allowReverse:!1,defaultShow:!1,defaultValue:h.EMPTY_SELECTIONRANGE,disabled:!1,format:"d",max:d.MAX_DATE,min:d.MIN_DATE,swapButton:!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 R=require("react"),t=require("prop-types"),M=require("@progress/kendo-react-popup"),D=require("@progress/kendo-date-math"),o=require("@progress/kendo-react-common"),c=require("@progress/kendo-react-intl"),O=require("@progress/kendo-svg-icons"),k=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(R),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(M.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,{className:"!k-overflow-hidden"},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(k.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:O.arrowsSwapIcon}));return i.createElement(i.Fragment,null,i.createElement("span",{ref:y=>{this._element=y},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,ref:this._startDateInput,ariaRole:"combobox",ariaControls:this._popupId,readonly:this.mobileMode}),(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,readonly:this.mobileMode}),!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)})},l.defaultProps={allowReverse:!1,defaultShow:!1,defaultValue:h.EMPTY_SELECTIONRANGE,disabled:!1,format:"d",max:u.MAX_DATE,min:u.MIN_DATE,swapButton:!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;

package/daterangepicker/DateRangePicker.mjs

@@ -10,7 +10,7 @@ import * as i from "react";
 import e from "prop-types";
 import { Popup as T } 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 P, getActiveElement as F, createPropsContext as z, withIdHOC as A, withPropsContext as B } from "@progress/kendo-react-common";
+import { classNames as D, Keys as c, validatePackage as _, canUseDOM as I, IconWrap as P, getActiveElement as B, createPropsContext as F, 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";
@@ -259,6 +259,7 @@ const o = class o extends i.Component {
       valid: this.props.valid,
       tabIndex: this.props.tabIndex,
       ariaExpanded: this.show,
+      clearButton: this.props.clearButton,
       ...this.props.startDateInputSettings,
       value: t.start,
       onChange: this.handleStartChange
@@ -273,6 +274,7 @@ const o = class o extends i.Component {
       valid: this.props.valid,
       tabIndex: this.props.tabIndex,
       ariaExpanded: this.show,
+      clearButton: this.props.clearButton,
       ...this.props.endDateInputSettings,
       value: t.end,
       onChange: this.handleEndChange
@@ -335,7 +337,7 @@ const o = class o extends i.Component {
   focusDateInputElement() {
     if (!document || !this.startDateInput || !this.startDateInput.element || !this.endDateInput || !this.endDateInput.element)
       return;
-    const a = F(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) {
@@ -350,7 +352,7 @@ const o = class o extends i.Component {
     }));
   }
   calculateMedia(a) {
-    for (let t of a)
+    for (const t of a)
       this.setState({ windowWidth: t.target.clientWidth });
   }
 };
@@ -416,7 +418,7 @@ o.displayName = "DateRangePicker", o.propTypes = {
   swapButton: !1
 };
 let p = o;
-const Z = z(), j = A(B(Z, p));
+const Z = F(), j = z(A(Z, p));
 j.displayName = "KendoReactDateRangePicker";
 N(p);
 export {