@progress/kendo-react-dateinputs 8.3.0-develop.6 → 8.3.0-develop.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/calendar/components/Calendar.js +2 -2
- package/calendar/components/Calendar.mjs +123 -115
- package/calendar/components/CalendarCell.js +1 -1
- package/calendar/components/CalendarCell.mjs +37 -39
- package/calendar/components/CalendarHeaderTitle.js +1 -1
- package/calendar/components/CalendarHeaderTitle.mjs +6 -12
- package/calendar/components/CalendarNavigationItem.js +1 -1
- package/calendar/components/CalendarNavigationItem.mjs +15 -19
- package/calendar/components/CalendarWeekCell.js +1 -1
- package/calendar/components/CalendarWeekCell.mjs +10 -15
- package/calendar/components/Header.js +1 -1
- package/calendar/components/Header.mjs +30 -40
- package/calendar/components/Navigation.js +1 -1
- package/calendar/components/Navigation.mjs +52 -49
- package/calendar/components/TodayCommand.js +1 -1
- package/calendar/components/TodayCommand.mjs +21 -25
- package/calendar/components/View.js +1 -1
- package/calendar/components/View.mjs +48 -42
- package/calendar/components/ViewList.js +1 -1
- package/calendar/components/ViewList.mjs +99 -94
- package/common/ClearButton.js +1 -1
- package/common/ClearButton.mjs +25 -31
- package/dateinput/DateInput.js +1 -1
- package/dateinput/DateInput.mjs +113 -110
- package/dateinput/utils.js +1 -1
- package/dateinput/utils.mjs +22 -23
- package/datepicker/DatePicker.js +1 -1
- package/datepicker/DatePicker.mjs +9 -9
- package/daterangepicker/DateRangePicker.js +1 -1
- package/daterangepicker/DateRangePicker.mjs +5 -5
- package/datetimepicker/DateTimePicker.js +1 -1
- package/datetimepicker/DateTimePicker.mjs +95 -90
- package/datetimepicker/DateTimeSelector.js +1 -1
- package/datetimepicker/DateTimeSelector.mjs +83 -81
- package/dist/cdn/js/kendo-react-dateinputs.js +1 -1
- package/index.d.mts +38 -28
- package/index.d.ts +38 -28
- package/package-metadata.mjs +1 -1
- package/package.json +7 -7
- package/timepicker/TimeList.js +3 -3
- package/timepicker/TimeList.mjs +83 -81
- package/timepicker/TimePart.js +1 -1
- package/timepicker/TimePart.mjs +74 -68
- package/timepicker/TimePicker.js +1 -1
- package/timepicker/TimePicker.mjs +112 -107
- package/timepicker/TimeSelector.js +1 -1
- package/timepicker/TimeSelector.mjs +66 -59
- package/virtualization/Virtualization.js +1 -1
- package/virtualization/Virtualization.mjs +49 -48
package/dateinput/DateInput.js
CHANGED
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const q=require("react"),t=require("prop-types"),g=require("@progress/kendo-date-math"),O=require("@progress/kendo-react-buttons"),F=require("@progress/kendo-svg-icons"),y=require("@progress/kendo-react-intl"),B=require("./models/kendo-date.js"),l=require("@progress/kendo-react-common"),_=require("@progress/kendo-react-labels"),A=require("../package-metadata.js"),v=require("./utils.js"),b=require("../utils.js"),h=require("../messages/index.js"),L=require("../timepicker/utils.js"),N=require("../common/ClearButton.js");function R(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 u=R(q),z="Please enter a valid value!",o=class o extends u.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 n=this.value,r=v.approximateStringMatching(i,this.currentFormat,this.element.value,this.selection.start),c=r.length===1&&r[0][1]==="_";if(!c)for(let d=0;d<r.length;d++)this.kendoDate.parsePart(r[d][0],r[d][1]);r.length&&r[0][0]!=="_"&&this.setSelection(this.selectionBySymbol(r[0][0])),c&&this.switchDateSegment(1),this.triggerChange(e,n)},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(A.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,autoFocus:a=o.defaultProps.autoFocus}=this.props;this.props._ref&&(this.props._ref.current=this);const n=y.provideLocalizationService(this),r={...o.defaultProps,...this.props},{name:c,label:d,id:E}=r,p=this.text,I=p===this.props.placeholder?"":p,x=p===this.props.placeholder?p:void 0,S=E||this._inputId,w=!this.validityStyles||this.validity.valid,M=[...v.wrapperClasses];this.props.className&&M.push(this.props.className);const P=u.createElement(l.AsyncFocusBlur,{onFocus:this.elementOnFocus,onBlur:this.elementOnBlur},({onFocus:V,onBlur:T})=>u.createElement("span",{ref:k=>{this._wrapper=k},style:d?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:V,onBlur:T},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",autoFocus:a,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:c,ref:k=>this._element=k}),this.props.children,this.props.clearButton&&this.props.value&&u.createElement(N,{onClick:this.handleClick,key:"clearbutton"}),this.props.spinners&&u.createElement("span",{className:"k-input-spinner k-spin-button",onMouseDown:this.spinnersMouseDown},u.createElement(O.Button,{tabIndex:-1,type:"button",rounded:null,className:"k-spinner-increase",icon:"caret-alt-up",svgIcon:F.caretAltUpIcon,"aria-label":n.toLanguageString(h.increaseValue,h.messages[h.increaseValue]),title:n.toLanguageString(h.increaseValue,h.messages[h.increaseValue]),onClick:this.increasePart}),u.createElement(O.Button,{tabIndex:-1,type:"button",rounded:null,className:"k-spinner-decrease",icon:"caret-alt-down",svgIcon:F.caretAltDownIcon,"aria-label":n.toLanguageString(h.decreaseValue,h.messages[h.decreaseValue]),title:n.toLanguageString(h.decreaseValue,h.messages[h.decreaseValue]),onClick:this.decreasePart}))));return d?u.createElement(_.FloatingLabel,{label:d,editorId:S,editorValue:p,editorValid:w,editorDisabled:this.props.disabled,children:P,style:{width:this.props.width}}):P}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:n}=s;this.kendoDate===null?(this.kendoDate=new B.KendoDate(this.intl.bind(this),e,i),this.kendoDate.setValue(a||n||null)):(this.kendoDate.format=i,this.kendoDate.formatPlaceholder=e),a!==void 0&&this.value!==a&&this.kendoDate.setValue(a);const{text:r,format:c}=this.kendoDate.getTextAndFormat();return this.currentFormat=c,s.placeholder!==null&&s.placeholder!==void 0&&!this.state.focused&&!this.kendoDate.hasValue()?s.placeholder:r}get validity(){const s=v.isInRange(this.value,this.min,this.max)&&L.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 n=e+s;for(;n>0&&n<this.currentFormat.length&&!(this.currentFormat[n]!==a&&this.currentFormat[n]!=="_");)n+=s;if(this.currentFormat[n]==="_")return;let r=n;for(;r>=0&&r<this.currentFormat.length&&this.currentFormat[r]===this.currentFormat[n];)r+=s;n>r&&(r+1!==e||n+1!==i)?this.setSelection({start:r+1,end:n+1}):n<r&&(n!==e||r!==i)&&this.setSelection({start:n,end:r})}modifyDateSegmentValue(s,e){if(!this.kendoDate)return;const i=this.value,a=this.currentFormat[this.selection.start],n=this.kendoDate.symbolMap(a),r=((this.props.steps||{})[n]||1)*s;this.kendoDate.modifyPart(a,r),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"]),autoFocus:t.bool},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:z,placeholder:null,ariaHasPopup:"grid",autoFocus:!1};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;
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _=require("react"),t=require("prop-types"),g=require("@progress/kendo-date-math"),F=require("@progress/kendo-react-buttons"),I=require("@progress/kendo-svg-icons"),v=require("@progress/kendo-react-intl"),N=require("./models/kendo-date.js"),o=require("@progress/kendo-react-common"),A=require("@progress/kendo-react-labels"),L=require("../package-metadata.js"),y=require("./utils.js"),b=require("../utils.js"),h=require("../messages/index.js"),R=require("../timepicker/utils.js"),z=require("../common/ClearButton.js");function j(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 c=j(_),K="Please enter a valid value!",l=class l extends c.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||l.defaultProps.validationMessage)},this.updateOnPaste=e=>{if(!this.element||!this.kendoDate)return;const i=v.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=o.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=y.approximateStringMatching(i,this.currentFormat,this.element.value,this.selection.start),u=n.length===1&&n[0][1]==="_";if(!u)for(let d=0;d<n.length;d++)this.kendoDate.parsePart(n[d][0],n[d][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=>{o.getActiveElement(document)===this.element&&e.preventDefault()},this.wheel=e=>{o.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})},o.validatePackage(L.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=l.defaultProps.size,fillMode:e=l.defaultProps.fillMode,rounded:i=l.defaultProps.rounded,autoFocus:a=l.defaultProps.autoFocus,unstyled:r}=this.props,n=r&&r.uDateInput;this.props._ref&&(this.props._ref.current=this);const u=v.provideLocalizationService(this),d={...l.defaultProps,...this.props},{name:E,label:D,id:x,disabled:V}=d,p=this.text,M=p===this.props.placeholder?"":p,T=p===this.props.placeholder?p:void 0,w=x||this._inputId,O=!this.validityStyles||this.validity.valid,P=c.createElement(o.AsyncFocusBlur,{onFocus:this.elementOnFocus,onBlur:this.elementOnBlur},({onFocus:q,onBlur:B})=>c.createElement("span",{ref:S=>{this._wrapper=S},style:D?void 0:{width:this.props.width},dir:this.props.dir,className:o.classNames(o.uDateInput.wrapper({c:n,size:s,fillMode:e,rounded:i,disabled:V,required:this.required,invalid:!O}),this.props.className),onFocus:q,onBlur:B},c.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",autoFocus:a,className:o.classNames(o.uDateInput.input({c:n})),id:w,"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:o.noop,value:M,placeholder:T,name:E,ref:S=>this._element=S}),this.props.children,this.props.clearButton&&this.props.value&&c.createElement(z,{onClick:this.handleClick,key:"clearbutton"}),this.props.spinners&&c.createElement("span",{className:o.classNames(o.uDateInput.inputSpinner({c:n})),onMouseDown:this.spinnersMouseDown},c.createElement(F.Button,{tabIndex:-1,type:"button",rounded:null,className:o.classNames(o.uDateInput.spinnerIncrease({c:n})),icon:"caret-alt-up",svgIcon:I.caretAltUpIcon,"aria-label":u.toLanguageString(h.increaseValue,h.messages[h.increaseValue]),title:u.toLanguageString(h.increaseValue,h.messages[h.increaseValue]),onClick:this.increasePart}),c.createElement(F.Button,{tabIndex:-1,type:"button",rounded:null,className:o.classNames(o.uDateInput.spinnerDecrease({c:n})),icon:"caret-alt-down",svgIcon:I.caretAltDownIcon,"aria-label":u.toLanguageString(h.decreaseValue,h.messages[h.decreaseValue]),title:u.toLanguageString(h.decreaseValue,h.messages[h.decreaseValue]),onClick:this.decreasePart}))));return D?c.createElement(A.FloatingLabel,{label:D,editorId:w,editorValue:p,editorValid:O,editorDisabled:this.props.disabled,children:P,style:{width:this.props.width}}):P}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:l.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:l.defaultProps.max}get text(){const s={...k.defaultProps,...this.props},{formatPlaceholder:e=l.defaultProps.formatPlaceholder,format:i=l.defaultProps.format,value:a,defaultValue:r}=s;this.kendoDate===null?(this.kendoDate=new N.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=y.isInRange(this.value,this.min,this.max)&&R.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:l.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:l.defaultProps.required}get wrapper(){return this._wrapper}intl(){return v.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=o.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)}};l.displayName="DateInput",l.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"]),autoFocus:t.bool},l.defaultProps={format:y.defaultFormat,size:"medium",rounded:"medium",fillMode:"solid",formatPlaceholder:y.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:K,placeholder:null,ariaHasPopup:"grid",autoFocus:!1};let m=l;const C=o.createPropsContext(),k=o.withIdHOC(o.withPropsContext(C,o.withUnstyledHOC(m)));k.displayName="KendoReactDateInput";v.registerForIntl(m);v.registerForLocalization(m);exports.DateInput=k;exports.DateInputPropsContext=C;exports.DateInputWithoutContext=m;
|
package/dateinput/DateInput.mjs
CHANGED
|
@@ -6,22 +6,22 @@
|
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
8
|
"use client";
|
|
9
|
-
import * as
|
|
9
|
+
import * as h from "react";
|
|
10
10
|
import e from "prop-types";
|
|
11
|
-
import { cloneDate as
|
|
12
|
-
import { Button as
|
|
13
|
-
import { caretAltUpIcon as
|
|
14
|
-
import { provideIntlService as
|
|
15
|
-
import { KendoDate as
|
|
16
|
-
import { getActiveElement as
|
|
17
|
-
import { FloatingLabel as
|
|
18
|
-
import { packageMetadata as
|
|
19
|
-
import { approximateStringMatching as
|
|
20
|
-
import { MAX_DATE as
|
|
21
|
-
import { increaseValue as
|
|
22
|
-
import { isInTimeRange as
|
|
23
|
-
import
|
|
24
|
-
const
|
|
11
|
+
import { cloneDate as f, isEqual as L } from "@progress/kendo-date-math";
|
|
12
|
+
import { Button as P } from "@progress/kendo-react-buttons";
|
|
13
|
+
import { caretAltUpIcon as _, caretAltDownIcon as A } from "@progress/kendo-svg-icons";
|
|
14
|
+
import { provideIntlService as O, provideLocalizationService as N, registerForIntl as q, registerForLocalization as R } from "@progress/kendo-react-intl";
|
|
15
|
+
import { KendoDate as z } from "./models/kendo-date.mjs";
|
|
16
|
+
import { getActiveElement as g, validatePackage as K, AsyncFocusBlur as U, classNames as p, uDateInput as c, noop as H, createPropsContext as j, withIdHOC as X, withPropsContext as Y, withUnstyledHOC as G } from "@progress/kendo-react-common";
|
|
17
|
+
import { FloatingLabel as W } from "@progress/kendo-react-labels";
|
|
18
|
+
import { packageMetadata as Z } from "../package-metadata.mjs";
|
|
19
|
+
import { approximateStringMatching as J, defaultFormat as Q, defaultFormatPlaceholder as $, isInRange as ee } from "./utils.mjs";
|
|
20
|
+
import { MAX_DATE as te, MIN_DATE as ie, MIN_TIME as se, MAX_TIME as re } from "../utils.mjs";
|
|
21
|
+
import { increaseValue as v, messages as y, decreaseValue as b } from "../messages/index.mjs";
|
|
22
|
+
import { isInTimeRange as ae } from "../timepicker/utils.mjs";
|
|
23
|
+
import ne from "../common/ClearButton.mjs";
|
|
24
|
+
const oe = "Please enter a valid value!", o = class o extends h.Component {
|
|
25
25
|
constructor(i) {
|
|
26
26
|
super(i), this.kendoDate = null, this.currentFormat = "", this.paste = !1, this._element = null, this._wrapper = null, this._lastSelectedSymbol = "", this.focus = () => {
|
|
27
27
|
this._element && this._element.focus();
|
|
@@ -32,11 +32,11 @@ const ae = "Please enter a valid value!", o = class o extends l.Component {
|
|
|
32
32
|
}, this.updateOnPaste = (t) => {
|
|
33
33
|
if (!this.element || !this.kendoDate)
|
|
34
34
|
return;
|
|
35
|
-
const s =
|
|
35
|
+
const s = O(this).parseDate(this.element.value, this.props.format) || this.value, r = this.value;
|
|
36
36
|
this.kendoDate.setValue(s), this.triggerChange(t, r);
|
|
37
37
|
}, this.spinnersMouseDown = (t) => {
|
|
38
38
|
t.preventDefault();
|
|
39
|
-
const s =
|
|
39
|
+
const s = g(document);
|
|
40
40
|
this.element && s !== this.element && this.element.focus({ preventScroll: !0 });
|
|
41
41
|
}, this.handlePaste = () => {
|
|
42
42
|
this.paste = !0;
|
|
@@ -51,22 +51,22 @@ const ae = "Please enter a valid value!", o = class o extends l.Component {
|
|
|
51
51
|
}
|
|
52
52
|
const { text: s, format: r } = this.kendoDate.getTextAndFormat();
|
|
53
53
|
this.currentFormat = r;
|
|
54
|
-
const
|
|
54
|
+
const n = this.value, a = J(
|
|
55
55
|
s,
|
|
56
56
|
this.currentFormat,
|
|
57
57
|
this.element.value,
|
|
58
58
|
this.selection.start
|
|
59
|
-
),
|
|
60
|
-
if (!
|
|
61
|
-
for (let
|
|
62
|
-
this.kendoDate.parsePart(
|
|
63
|
-
|
|
59
|
+
), l = a.length === 1 && a[0][1] === "_";
|
|
60
|
+
if (!l)
|
|
61
|
+
for (let d = 0; d < a.length; d++)
|
|
62
|
+
this.kendoDate.parsePart(a[d][0], a[d][1]);
|
|
63
|
+
a.length && a[0][0] !== "_" && this.setSelection(this.selectionBySymbol(a[0][0])), l && this.switchDateSegment(1), this.triggerChange(t, n);
|
|
64
64
|
}, this.elementClick = (t) => {
|
|
65
65
|
this.setSelection(this.selectionByIndex(this.selection.start));
|
|
66
66
|
}, this.nativeWheel = (t) => {
|
|
67
|
-
|
|
67
|
+
g(document) === this.element && t.preventDefault();
|
|
68
68
|
}, this.wheel = (t) => {
|
|
69
|
-
|
|
69
|
+
g(document) === this.element && (t.nativeEvent.deltaY < 0 && this.increasePart(t), t.nativeEvent.deltaY > 0 && this.decreasePart(t));
|
|
70
70
|
}, this.increasePart = (t) => {
|
|
71
71
|
this.modifyDateSegmentValue(1, t);
|
|
72
72
|
}, this.decreasePart = (t) => {
|
|
@@ -95,7 +95,7 @@ const ae = "Please enter a valid value!", o = class o extends l.Component {
|
|
|
95
95
|
this.wrapper && this.wrapper.classList.add("k-focus"), this.setState({ focused: !0 });
|
|
96
96
|
}, this.elementOnBlur = (t) => {
|
|
97
97
|
this.wrapper && this.wrapper.classList.remove("k-focus"), this.setState({ focused: !1 });
|
|
98
|
-
},
|
|
98
|
+
}, K(Z), this.state = {
|
|
99
99
|
focused: !1
|
|
100
100
|
};
|
|
101
101
|
}
|
|
@@ -128,50 +128,48 @@ const ae = "Please enter a valid value!", o = class o extends l.Component {
|
|
|
128
128
|
size: i = o.defaultProps.size,
|
|
129
129
|
fillMode: t = o.defaultProps.fillMode,
|
|
130
130
|
rounded: s = o.defaultProps.rounded,
|
|
131
|
-
autoFocus: r = o.defaultProps.autoFocus
|
|
132
|
-
|
|
131
|
+
autoFocus: r = o.defaultProps.autoFocus,
|
|
132
|
+
unstyled: n
|
|
133
|
+
} = this.props, a = n && n.uDateInput;
|
|
133
134
|
this.props._ref && (this.props._ref.current = this);
|
|
134
|
-
const
|
|
135
|
-
this.props.className && x.push(this.props.className);
|
|
136
|
-
const D = /* @__PURE__ */ l.createElement(z, { onFocus: this.elementOnFocus, onBlur: this.elementOnBlur }, ({ onFocus: I, onBlur: M }) => /* @__PURE__ */ l.createElement(
|
|
135
|
+
const l = N(this), d = { ...o.defaultProps, ...this.props }, { name: E, label: D, id: x, disabled: I } = d, u = this.text, T = u === this.props.placeholder ? "" : u, V = u === this.props.placeholder ? u : void 0, w = x || this._inputId, k = !this.validityStyles || this.validity.valid, F = /* @__PURE__ */ h.createElement(U, { onFocus: this.elementOnFocus, onBlur: this.elementOnBlur }, ({ onFocus: M, onBlur: B }) => /* @__PURE__ */ h.createElement(
|
|
137
136
|
"span",
|
|
138
137
|
{
|
|
139
|
-
ref: (
|
|
140
|
-
this._wrapper =
|
|
138
|
+
ref: (S) => {
|
|
139
|
+
this._wrapper = S;
|
|
141
140
|
},
|
|
142
|
-
style:
|
|
141
|
+
style: D ? void 0 : { width: this.props.width },
|
|
143
142
|
dir: this.props.dir,
|
|
144
|
-
className:
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
},
|
|
143
|
+
className: p(
|
|
144
|
+
c.wrapper({
|
|
145
|
+
c: a,
|
|
146
|
+
size: i,
|
|
147
|
+
fillMode: t,
|
|
148
|
+
rounded: s,
|
|
149
|
+
disabled: I,
|
|
150
|
+
required: this.required,
|
|
151
|
+
invalid: !k
|
|
152
|
+
}),
|
|
155
153
|
this.props.className
|
|
156
154
|
),
|
|
157
|
-
onFocus:
|
|
158
|
-
onBlur:
|
|
155
|
+
onFocus: M,
|
|
156
|
+
onBlur: B
|
|
159
157
|
},
|
|
160
|
-
/* @__PURE__ */
|
|
158
|
+
/* @__PURE__ */ h.createElement(
|
|
161
159
|
"input",
|
|
162
160
|
{
|
|
163
161
|
role: this.props.ariaRole || "textbox",
|
|
164
162
|
readOnly: this.props.readonly,
|
|
165
163
|
tabIndex: this.props.tabIndex,
|
|
166
164
|
disabled: this.props.disabled,
|
|
167
|
-
title: this.props.title !== void 0 ? this.props.title :
|
|
165
|
+
title: this.props.title !== void 0 ? this.props.title : u,
|
|
168
166
|
type: "text",
|
|
169
167
|
spellCheck: !1,
|
|
170
168
|
autoComplete: "off",
|
|
171
169
|
autoCorrect: "off",
|
|
172
170
|
autoFocus: r,
|
|
173
|
-
className:
|
|
174
|
-
id:
|
|
171
|
+
className: p(c.input({ c: a })),
|
|
172
|
+
id: w,
|
|
175
173
|
"aria-label": this.props.ariaLabel,
|
|
176
174
|
"aria-labelledby": this.props.ariaLabelledBy,
|
|
177
175
|
"aria-describedby": this.props.ariaDescribedBy,
|
|
@@ -184,55 +182,55 @@ const ae = "Please enter a valid value!", o = class o extends l.Component {
|
|
|
184
182
|
onInput: this.elementChange,
|
|
185
183
|
onPaste: this.handlePaste,
|
|
186
184
|
onKeyDown: this.elementKeyDown,
|
|
187
|
-
onChange:
|
|
188
|
-
value:
|
|
189
|
-
placeholder:
|
|
190
|
-
name:
|
|
191
|
-
ref: (
|
|
185
|
+
onChange: H,
|
|
186
|
+
value: T,
|
|
187
|
+
placeholder: V,
|
|
188
|
+
name: E,
|
|
189
|
+
ref: (S) => this._element = S
|
|
192
190
|
}
|
|
193
191
|
),
|
|
194
192
|
this.props.children,
|
|
195
|
-
this.props.clearButton && this.props.value && /* @__PURE__ */
|
|
196
|
-
this.props.spinners && /* @__PURE__ */
|
|
197
|
-
|
|
193
|
+
this.props.clearButton && this.props.value && /* @__PURE__ */ h.createElement(ne, { onClick: this.handleClick, key: "clearbutton" }),
|
|
194
|
+
this.props.spinners && /* @__PURE__ */ h.createElement("span", { className: p(c.inputSpinner({ c: a })), onMouseDown: this.spinnersMouseDown }, /* @__PURE__ */ h.createElement(
|
|
195
|
+
P,
|
|
198
196
|
{
|
|
199
197
|
tabIndex: -1,
|
|
200
198
|
type: "button",
|
|
201
199
|
rounded: null,
|
|
202
|
-
className:
|
|
200
|
+
className: p(c.spinnerIncrease({ c: a })),
|
|
203
201
|
icon: "caret-alt-up",
|
|
204
|
-
svgIcon:
|
|
205
|
-
"aria-label":
|
|
206
|
-
title:
|
|
202
|
+
svgIcon: _,
|
|
203
|
+
"aria-label": l.toLanguageString(v, y[v]),
|
|
204
|
+
title: l.toLanguageString(v, y[v]),
|
|
207
205
|
onClick: this.increasePart
|
|
208
206
|
}
|
|
209
|
-
), /* @__PURE__ */
|
|
210
|
-
|
|
207
|
+
), /* @__PURE__ */ h.createElement(
|
|
208
|
+
P,
|
|
211
209
|
{
|
|
212
210
|
tabIndex: -1,
|
|
213
211
|
type: "button",
|
|
214
212
|
rounded: null,
|
|
215
|
-
className:
|
|
213
|
+
className: p(c.spinnerDecrease({ c: a })),
|
|
216
214
|
icon: "caret-alt-down",
|
|
217
|
-
svgIcon:
|
|
218
|
-
"aria-label":
|
|
219
|
-
title:
|
|
215
|
+
svgIcon: A,
|
|
216
|
+
"aria-label": l.toLanguageString(b, y[b]),
|
|
217
|
+
title: l.toLanguageString(b, y[b]),
|
|
220
218
|
onClick: this.decreasePart
|
|
221
219
|
}
|
|
222
220
|
))
|
|
223
221
|
));
|
|
224
|
-
return
|
|
225
|
-
|
|
222
|
+
return D ? /* @__PURE__ */ h.createElement(
|
|
223
|
+
W,
|
|
226
224
|
{
|
|
227
|
-
label:
|
|
228
|
-
editorId:
|
|
229
|
-
editorValue:
|
|
225
|
+
label: D,
|
|
226
|
+
editorId: w,
|
|
227
|
+
editorValue: u,
|
|
230
228
|
editorValid: k,
|
|
231
229
|
editorDisabled: this.props.disabled,
|
|
232
|
-
children:
|
|
230
|
+
children: F,
|
|
233
231
|
style: { width: this.props.width }
|
|
234
232
|
}
|
|
235
|
-
) :
|
|
233
|
+
) : F;
|
|
236
234
|
}
|
|
237
235
|
/* Public Getters */
|
|
238
236
|
/**
|
|
@@ -257,21 +255,21 @@ const ae = "Please enter a valid value!", o = class o extends l.Component {
|
|
|
257
255
|
* @hidden
|
|
258
256
|
*/
|
|
259
257
|
get text() {
|
|
260
|
-
const i = { ...
|
|
258
|
+
const i = { ...C.defaultProps, ...this.props }, {
|
|
261
259
|
formatPlaceholder: t = o.defaultProps.formatPlaceholder,
|
|
262
260
|
format: s = o.defaultProps.format,
|
|
263
261
|
value: r,
|
|
264
|
-
defaultValue:
|
|
262
|
+
defaultValue: n
|
|
265
263
|
} = i;
|
|
266
|
-
this.kendoDate === null ? (this.kendoDate = new
|
|
267
|
-
const { text:
|
|
268
|
-
return this.currentFormat =
|
|
264
|
+
this.kendoDate === null ? (this.kendoDate = new z(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);
|
|
265
|
+
const { text: a, format: l } = this.kendoDate.getTextAndFormat();
|
|
266
|
+
return this.currentFormat = l, i.placeholder !== null && i.placeholder !== void 0 && !this.state.focused && !this.kendoDate.hasValue() ? i.placeholder : a;
|
|
269
267
|
}
|
|
270
268
|
/**
|
|
271
269
|
* Represents the validity state into which the DateInput is set.
|
|
272
270
|
*/
|
|
273
271
|
get validity() {
|
|
274
|
-
const i =
|
|
272
|
+
const i = ee(this.value, this.min, this.max) && ae(this.value, this.props.minTime, this.props.maxTime), t = this.props.validationMessage !== void 0, s = (!this.required || this.value !== null) && i, r = this.props.valid !== void 0 ? this.props.valid : s;
|
|
275
273
|
return {
|
|
276
274
|
customError: t,
|
|
277
275
|
rangeOverflow: this.value && this.max.getTime() < this.value.getTime() || !1,
|
|
@@ -336,7 +334,7 @@ const ae = "Please enter a valid value!", o = class o extends l.Component {
|
|
|
336
334
|
* @hidden
|
|
337
335
|
*/
|
|
338
336
|
intl() {
|
|
339
|
-
return
|
|
337
|
+
return O(this);
|
|
340
338
|
}
|
|
341
339
|
/* end handlers */
|
|
342
340
|
get selection() {
|
|
@@ -345,12 +343,12 @@ const ae = "Please enter a valid value!", o = class o extends l.Component {
|
|
|
345
343
|
}
|
|
346
344
|
setSelection(i) {
|
|
347
345
|
this._lastSelectedSymbol = this.currentFormat[i.start], window.requestAnimationFrame(() => {
|
|
348
|
-
const t =
|
|
346
|
+
const t = g(document);
|
|
349
347
|
this.element && t === this.element && !this.props.disableSelection && this.element.setSelectionRange(i.start, i.end);
|
|
350
348
|
});
|
|
351
349
|
}
|
|
352
350
|
triggerChange(i, t) {
|
|
353
|
-
this.valueDuringOnChange = this.value, this.forceUpdate(), this.props.onChange && !
|
|
351
|
+
this.valueDuringOnChange = this.value, this.forceUpdate(), this.props.onChange && !L(t, this.value) && this.props.onChange.call(void 0, {
|
|
354
352
|
syntheticEvent: i,
|
|
355
353
|
nativeEvent: i.nativeEvent,
|
|
356
354
|
value: this.value,
|
|
@@ -385,21 +383,21 @@ const ae = "Please enter a valid value!", o = class o extends l.Component {
|
|
|
385
383
|
return;
|
|
386
384
|
}
|
|
387
385
|
const r = this.currentFormat[t];
|
|
388
|
-
let
|
|
389
|
-
for (;
|
|
390
|
-
a += i;
|
|
391
|
-
if (this.currentFormat[a] === "_")
|
|
392
|
-
return;
|
|
393
|
-
let n = a;
|
|
394
|
-
for (; n >= 0 && n < this.currentFormat.length && this.currentFormat[n] === this.currentFormat[a]; )
|
|
386
|
+
let n = t + i;
|
|
387
|
+
for (; n > 0 && n < this.currentFormat.length && !(this.currentFormat[n] !== r && this.currentFormat[n] !== "_"); )
|
|
395
388
|
n += i;
|
|
396
|
-
|
|
389
|
+
if (this.currentFormat[n] === "_")
|
|
390
|
+
return;
|
|
391
|
+
let a = n;
|
|
392
|
+
for (; a >= 0 && a < this.currentFormat.length && this.currentFormat[a] === this.currentFormat[n]; )
|
|
393
|
+
a += i;
|
|
394
|
+
n > a && (a + 1 !== t || n + 1 !== s) ? this.setSelection({ start: a + 1, end: n + 1 }) : n < a && (n !== t || a !== s) && this.setSelection({ start: n, end: a });
|
|
397
395
|
}
|
|
398
396
|
modifyDateSegmentValue(i, t) {
|
|
399
397
|
if (!this.kendoDate)
|
|
400
398
|
return;
|
|
401
|
-
const s = this.value, r = this.currentFormat[this.selection.start],
|
|
402
|
-
this.kendoDate.modifyPart(r,
|
|
399
|
+
const s = this.value, r = this.currentFormat[this.selection.start], n = this.kendoDate.symbolMap(r), a = ((this.props.steps || {})[n] || 1) * i;
|
|
400
|
+
this.kendoDate.modifyPart(r, a), this.triggerChange(t, s);
|
|
403
401
|
}
|
|
404
402
|
};
|
|
405
403
|
o.displayName = "DateInput", o.propTypes = {
|
|
@@ -478,33 +476,38 @@ o.displayName = "DateInput", o.propTypes = {
|
|
|
478
476
|
fillMode: e.oneOf([null, "solid", "flat", "outline"]),
|
|
479
477
|
autoFocus: e.bool
|
|
480
478
|
}, o.defaultProps = {
|
|
481
|
-
format:
|
|
479
|
+
format: Q,
|
|
482
480
|
size: "medium",
|
|
483
481
|
rounded: "medium",
|
|
484
482
|
fillMode: "solid",
|
|
485
|
-
formatPlaceholder:
|
|
483
|
+
formatPlaceholder: $,
|
|
486
484
|
// defaultValue: null as Date | null,
|
|
487
485
|
spinners: !1,
|
|
488
486
|
disabled: !1,
|
|
489
|
-
max:
|
|
490
|
-
min:
|
|
491
|
-
minTime:
|
|
492
|
-
maxTime:
|
|
487
|
+
max: f(te),
|
|
488
|
+
min: f(ie),
|
|
489
|
+
minTime: f(se),
|
|
490
|
+
maxTime: f(re),
|
|
493
491
|
required: !1,
|
|
494
492
|
validityStyles: !0,
|
|
495
|
-
validationMessage:
|
|
493
|
+
validationMessage: oe,
|
|
496
494
|
placeholder: null,
|
|
497
495
|
// the rest of the properties are undefined by default
|
|
498
496
|
ariaHasPopup: "grid",
|
|
499
497
|
autoFocus: !1
|
|
500
498
|
};
|
|
501
|
-
let
|
|
502
|
-
const
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
499
|
+
let m = o;
|
|
500
|
+
const le = j(), C = X(
|
|
501
|
+
Y(
|
|
502
|
+
le,
|
|
503
|
+
G(m)
|
|
504
|
+
)
|
|
505
|
+
);
|
|
506
|
+
C.displayName = "KendoReactDateInput";
|
|
507
|
+
q(m);
|
|
508
|
+
R(m);
|
|
506
509
|
export {
|
|
507
|
-
|
|
508
|
-
|
|
509
|
-
|
|
510
|
+
C as DateInput,
|
|
511
|
+
le as DateInputPropsContext,
|
|
512
|
+
m as DateInputWithoutContext
|
|
510
513
|
};
|
package/dateinput/utils.js
CHANGED
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b="d",
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b="d",y="wide",M=(h,e,f,u)=>{const p=h[u+h.length-f.length],l=h.substring(0,u+h.length-f.length),n=f.substring(0,u),s=[];if(l===n&&u>0)return s.push([e[u-1],n[u-1]]),s;if(l.indexOf(n)===0&&(n.length===0||e[n.length-1]!==e[n.length])){let t="";n.length===1&&s.push([e[0],n[0]]);for(let g=n.length;g<l.length;g++)e[g]!==t&&e[g]!=="_"&&(t=e[g],s.push([t,""]));return s}if(n.indexOf(l)===0||e[u-1]==="_"){let t=e[0];for(let g=Math.max(0,l.length-1);g<e.length;g++)if(e[g]!=="_"){t=e[g];break}return[[t,n[u-1]]]}return n[n.length-1]===" "||n[n.length-1]===p?[[e[u-1],"_"]]:[[e[u-1],n[u-1]]]},r=(h,e)=>(h[e.pattern[0]]=e.type,h),c=(h,e,f)=>h===null||!(e&&e>h||f&&f<h);exports.approximateStringMatching=M;exports.dateSymbolMap=r;exports.defaultFormat=b;exports.defaultFormatPlaceholder=y;exports.isInRange=c;
|
package/dateinput/utils.mjs
CHANGED
|
@@ -6,33 +6,32 @@
|
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
8
|
"use client";
|
|
9
|
-
const
|
|
10
|
-
const
|
|
11
|
-
if (p ===
|
|
12
|
-
return
|
|
13
|
-
if (p.indexOf(
|
|
9
|
+
const y = "d", _ = "wide", t = (e, n, g, f) => {
|
|
10
|
+
const l = e[f + e.length - g.length], p = e.substring(0, f + e.length - g.length), h = g.substring(0, f), b = [];
|
|
11
|
+
if (p === h && f > 0)
|
|
12
|
+
return b.push([n[f - 1], h[f - 1]]), b;
|
|
13
|
+
if (p.indexOf(h) === 0 && (h.length === 0 || n[h.length - 1] !== n[h.length])) {
|
|
14
14
|
let s = "";
|
|
15
|
-
|
|
16
|
-
for (let
|
|
17
|
-
|
|
18
|
-
return
|
|
15
|
+
h.length === 1 && b.push([n[0], h[0]]);
|
|
16
|
+
for (let u = h.length; u < p.length; u++)
|
|
17
|
+
n[u] !== s && n[u] !== "_" && (s = n[u], b.push([s, ""]));
|
|
18
|
+
return b;
|
|
19
19
|
}
|
|
20
|
-
if (
|
|
21
|
-
let s =
|
|
22
|
-
for (let
|
|
23
|
-
if (
|
|
24
|
-
s =
|
|
20
|
+
if (h.indexOf(p) === 0 || n[f - 1] === "_") {
|
|
21
|
+
let s = n[0];
|
|
22
|
+
for (let u = Math.max(0, p.length - 1); u < n.length; u++)
|
|
23
|
+
if (n[u] !== "_") {
|
|
24
|
+
s = n[u];
|
|
25
25
|
break;
|
|
26
26
|
}
|
|
27
|
-
return [[s,
|
|
27
|
+
return [[s, h[f - 1]]];
|
|
28
28
|
}
|
|
29
|
-
return
|
|
30
|
-
},
|
|
29
|
+
return h[h.length - 1] === " " || h[h.length - 1] === l ? [[n[f - 1], "_"]] : [[n[f - 1], h[f - 1]]];
|
|
30
|
+
}, M = (e, n) => (e[n.pattern[0]] = n.type, e), x = (e, n, g) => e === null || !(n && n > e || g && g < e);
|
|
31
31
|
export {
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
w as wrapperClasses
|
|
32
|
+
t as approximateStringMatching,
|
|
33
|
+
M as dateSymbolMap,
|
|
34
|
+
y as defaultFormat,
|
|
35
|
+
_ as defaultFormatPlaceholder,
|
|
36
|
+
x as isInRange
|
|
38
37
|
};
|
package/datepicker/DatePicker.js
CHANGED
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _=require("react"),e=require("prop-types"),U=require("@progress/kendo-react-popup"),I=require("@progress/kendo-date-math"),n=require("@progress/kendo-react-common"),j=require("@progress/kendo-svg-icons"),$=require("../package-metadata.js"),H=require("../dateinput/DateInput.js"),X=require("../calendar/components/Calendar.js"),m=require("../utils.js"),D=require("../messages/index.js"),q=require("@progress/kendo-react-intl"),Z=require("./ToggleButton.js"),G=require("../common/PickerWrap.js"),J=require("../hooks/usePickerFloatingLabel.js"),Q=require("@progress/kendo-react-layout"),Y=require("../common/AdaptiveMode.js"),ee=require("../common/constants.js");function te(l){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const t in l)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(l,t);Object.defineProperty(i,t,s.get?s:{enumerable:!0,get:()=>l[t]})}}return i.default=l,Object.freeze(i)}const r=te(_),o=class o extends r.Component{constructor(i){super(i),this._element=null,this._dateInput=r.createRef(),this._calendar=null,this.shouldFocusDateInput=!1,this.prevShow=!1,this.focus=()=>{this.dateInput&&this.dateInput.focus()},this.setCalendarRef=t=>{this._calendar=t},this.nextValue=(t,s)=>t.value!==void 0?t.value:s.value,this.nextShow=(t,s)=>t.show!==void 0?t.show:s.show,this.renderPopup=()=>{const{disabled:t,min:s,max:a,weekNumber:g,focusedDate:f,popupSettings:d}=this.props,{popupClass:v,...w}=d,b=this.show,h=this.value,y=h&&I.getDate(h),p=n.classNames(v),C={popupClass:"k-datepicker-popup",show:b,anchor:this._element,className:p,id:this._popupId,anchorAlign:{horizontal:"left",vertical:"bottom"},popupAlign:{horizontal:"left",vertical:"top"},...w},c={disabled:t,value:y,min:s,max:a,weekNumber:g,focusedDate:f,className:this.mobileMode?"k-calendar-lg":"",navigation:!this.mobileMode,onChange:this.handleCalendarValueChange};return this.mobileMode?r.createElement(this.calendarComp,{_ref:this.setCalendarRef,...c}):r.createElement(this.popupComp,{...C},r.createElement(this.calendarComp,{_ref:this.setCalendarRef,...c}))},this.renderAdaptivePopup=()=>{const{windowWidth:t=0}=this.state,s={expand:this.show,onClose:this.handleBlur,adaptiveTitle:this.props.adaptiveTitle,windowWidth:t};return r.createElement(Y.AdaptiveMode,{...s},r.createElement(Q.ActionSheetContent,{className:"!k-overflow-hidden"},this.renderPopup()))},this.handleInputValueChange=t=>{this.handleValueChange(t.value,t)},this.handleCalendarValueChange=t=>{const s=this.mergeTime(t.value);this.handleValueChange(s,t)},this.handleValueChange=(t,s)=>{this.setState({value:I.cloneDate(t||void 0)}),this.valueDuringOnChange=t,this.showDuringOnChange=!1,this.mobileMode||(this.shouldFocusDateInput=!0);const{onChange:a}=this.props;a&&a.call(void 0,{syntheticEvent:s.syntheticEvent,nativeEvent:s.nativeEvent,value:this.value,show:this.show,target:this}),this.valueDuringOnChange=void 0,this.showDuringOnChange=void 0,this.setShow(!1)},this.handleFocus=()=>{this.setState({focused:!0})},this.handleBlur=()=>{this.setState({focused:!1}),this.setShow(!1)},this.handleIconClick=()=>{this.props.disabled||(this.shouldFocusDateInput=!0,this.setShow(!this.show))},this.handleIconMouseDown=t=>{t.preventDefault()},this.handleKeyDown=t=>{const{altKey:s,keyCode:a}=t;if(a===n.Keys.esc&&this.show){this.shouldFocusDateInput=!0,this.setShow(!1);return}s&&(a===n.Keys.up||a===n.Keys.down)&&(t.preventDefault(),t.stopPropagation(),this.shouldFocusDateInput=a===n.Keys.up,this.setShow(a===n.Keys.down))},n.validatePackage($.packageMetadata),this.state={value:this.props.defaultValue||o.defaultProps.defaultValue,show:this.props.defaultShow||o.defaultProps.defaultShow,focused:!1}}get _popupId(){return this.props.id+"-popup-id"}get document(){if(n.canUseDOM)return this.element&&this.element.ownerDocument||document}get element(){return this._element}get mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=ee.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}get dateInput(){return this._dateInput.current}get calendar(){return this._calendar}get value(){const i=this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value;return i!==null?I.cloneDate(i):null}get show(){return this.showDuringOnChange!==void 0?this.showDuringOnChange:this.props.show!==void 0?this.props.show:this.state.show}get name(){return this.props.name}get min(){return this.props.min!==void 0?this.props.min:o.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:o.defaultProps.max}get dateInputComp(){return this.props.dateInput||o.defaultProps.dateInput}get toggleButtonComp(){return this.props.toggleButton||o.defaultProps.toggleButton}get calendarComp(){return this.props.calendar||o.defaultProps.calendar}get popupComp(){return this.props.popup||o.defaultProps.popup}get pickerWrapComp(){return this.props.pickerWrap||o.defaultProps.pickerWrap}get validity(){const i=m.isInDateRange(this.value,this.min,this.max),t=this.props.validationMessage!==void 0,s=(!this.required||this.value!==null)&&i,a=this.props.valid!==void 0?this.props.valid:s;return{customError:t,rangeOverflow:this.value&&this.max.getTime()<this.value.getTime()||!1,rangeUnderflow:this.value&&this.value.getTime()<this.min.getTime()||!1,valid:a,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:o.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:o.defaultProps.required}componentDidMount(){var i;this.observerResize=n.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.show&&this.forceUpdate(),(i=this.document)!=null&&i.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentDidUpdate(){this._calendar&&this._calendar.element&&this.show&&!this.prevShow&&this._calendar.element.focus({preventScroll:!0}),this.dateInput&&this.dateInput.element&&!this.show&&this.shouldFocusDateInput&&this.dateInput.element.focus({preventScroll:!0}),this.prevShow=this.show,this.shouldFocusDateInput=!1}componentWillUnmount(){var i;clearTimeout(this.nextTickId),(i=this.document)!=null&&i.body&&this.observerResize&&this.observerResize.disconnect()}render(){const{size:i=o.defaultProps.size,rounded:t=o.defaultProps.rounded,fillMode:s=o.defaultProps.fillMode,disabled:a,tabIndex:g,title:f,id:d,format:v,formatPlaceholder:w,min:b,max:h,className:y,width:p,name:C,validationMessage:c,required:E,validityStyles:F,ariaLabelledBy:R,ariaDescribedBy:z,ariaLabel:N,placeholder:V,label:k,popupSettings:ie,defaultValue:se,defaultShow:oe,value:ae,popup:ne,weekNumber:re,dateInput:le,calendar:ue,toggleButton:de,onChange:he,onBlur:pe,onFocus:ce,show:me,onOpen:ge,pickerWrap:fe,adaptive:ve,adaptiveTitle:we,valid:be,autoFocus:A,visited:ye,touched:Ce,modified:ke,...O}=this.props,L=this.value,S=!this.validityStyles||this.validity.valid,K={disabled:a,format:v,formatPlaceholder:w,id:d,ariaLabelledBy:R,ariaDescribedBy:z,ariaLabel:N,max:h,min:b,name:C,onChange:this.handleInputValueChange,required:E,tabIndex:this.show?-1:g,title:f,valid:this.validity.valid,validationMessage:c,validityStyles:F,value:L,label:void 0,placeholder:this.state.focused?null:V,ariaExpanded:this.show,size:null,fillMode:null,rounded:null},M=q.provideLocalizationService(this).toLanguageString(D.toggleCalendar,D.messages[D.toggleCalendar]),P=r.createElement(n.AsyncFocusBlur,{onFocus:this.handleFocus,onBlur:this.mobileMode?void 0:this.handleBlur,onSyncBlur:this.props.onBlur,onSyncFocus:this.props.onFocus},T=>r.createElement(r.Fragment,null,r.createElement("span",{...k?{}:O,ref:W=>{this._element=W},className:n.classNames("k-input","k-datepicker",{[`k-input-${n.kendoThemeMaps.sizeMap[i]||i}`]:i,[`k-rounded-${n.kendoThemeMaps.roundedMap[t]||t}`]:t,[`k-input-${s}`]:s,"k-invalid":!S,"k-required":this.required,"k-disabled":a},y),onKeyDown:this.handleKeyDown,style:{width:p},onFocus:T.onFocus,onBlur:T.onBlur,onClick:this.mobileMode?this.handleIconClick:void 0},r.createElement(this.dateInputComp,{_ref:this._dateInput,ariaRole:"combobox",readonly:this.mobileMode,ariaExpanded:this.show,ariaControls:this._popupId,autoFocus:A,...K}),r.createElement(this.toggleButtonComp,{type:"button",icon:"calendar",svgIcon:j.calendarIcon,title:M,className:"k-input-button",rounded:null,onClick:this.mobileMode?void 0:this.handleIconClick,"aria-label":M,fillMode:s,onMouseDown:this.handleIconMouseDown}),!this.mobileMode&&this.renderPopup()),this.mobileMode&&this.renderAdaptivePopup()));return k?r.createElement(J.PickerFloatingLabel,{dateInput:this._dateInput,label:k,editorId:d,editorValid:S,editorDisabled:a,children:P,style:{width:p},...O}):P}setShow(i){const{onOpen:t,onClose:s}=this.props;this.show!==i&&(this.setState({show:i}),i&&t&&t.call(void 0,{target:this}),!i&&s&&s.call(void 0,{target:this}))}mergeTime(i){return this.value&&i?m.setTime(i,this.value):i}nextTick(i){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>i())}calculateMedia(i){for(let t of i)this.setState({windowWidth:t.target.clientWidth})}};o.displayName="DatePicker",o.propTypes={className:e.string,defaultShow:e.bool,defaultValue:e.instanceOf(Date),disabled:e.bool,focusedDate:e.instanceOf(Date),format:e.oneOfType([e.string,e.shape({skeleton:e.string,pattern:e.string,date:e.oneOf(["short","medium","long","full"]),time:e.oneOf(["short","medium","long","full"]),datetime:e.oneOf(["short","medium","long","full"]),era:e.oneOf(["narrow","short","long"]),year:e.oneOf(["numeric","2-digit"]),month:e.oneOf(["numeric","2-digit","narrow","short","long"]),day:e.oneOf(["numeric","2-digit"]),weekday:e.oneOf(["narrow","short","long"]),hour:e.oneOf(["numeric","2-digit"]),hour12:e.bool,minute:e.oneOf(["numeric","2-digit"]),second:e.oneOf(["numeric","2-digit"]),timeZoneName:e.oneOf(["short","long"])})]),formatPlaceholder:e.oneOfType([e.oneOf(["wide","narrow","short","formatPattern"]),e.shape({year:e.string,month:e.string,day:e.string,hour:e.string,minute:e.string,second:e.string})]),id:e.string,ariaLabelledBy:e.string,ariaDescribedBy:e.string,ariaLabel:e.string,min:e.instanceOf(Date),max:e.instanceOf(Date),name:e.string,popupSettings:e.shape({animate:e.bool,appendTo:e.any,popupClass:e.string}),show:e.bool,tabIndex:e.number,title:e.string,value:e.instanceOf(Date),weekNumber:e.bool,width:e.oneOfType([e.number,e.string]),validationMessage:e.string,required:e.bool,validate:e.bool,valid:e.bool,size:e.oneOf([null,"small","medium","large"]),rounded:e.oneOf([null,"small","medium","large","full"]),fillMode:e.oneOf([null,"solid","flat","outline"]),adaptive:e.bool,adaptiveTitle:e.string,autoFocus:e.bool},o.defaultProps={defaultShow:!1,defaultValue:null,dateInput:H.DateInput,calendar:X.Calendar,toggleButton:Z.ToggleButton,popup:U.Popup,pickerWrap:G.PickerWrap,disabled:!1,format:"d",max:m.MAX_DATE,min:m.MIN_DATE,popupSettings:{},tabIndex:0,weekNumber:!1,required:!1,validityStyles:!0,size:"medium",rounded:"medium",fillMode:"solid",autoFocus:!1};let u=o;const x=n.createPropsContext(),B=n.withIdHOC(n.withPropsContext(x,u));B.displayName="KendoReactDatePicker";q.registerForLocalization(u);exports.DatePicker=B;exports.DatePickerPropsContext=x;exports.DatePickerWithoutContext=u;
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _=require("react"),e=require("prop-types"),U=require("@progress/kendo-react-popup"),k=require("@progress/kendo-date-math"),n=require("@progress/kendo-react-common"),j=require("@progress/kendo-svg-icons"),$=require("../package-metadata.js"),H=require("../dateinput/DateInput.js"),X=require("../calendar/components/Calendar.js"),m=require("../utils.js"),D=require("../messages/index.js"),q=require("@progress/kendo-react-intl"),Z=require("./ToggleButton.js"),G=require("../common/PickerWrap.js"),J=require("../hooks/usePickerFloatingLabel.js"),Q=require("@progress/kendo-react-layout"),Y=require("../common/AdaptiveMode.js"),ee=require("../common/constants.js");function te(l){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const t in l)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(l,t);Object.defineProperty(i,t,s.get?s:{enumerable:!0,get:()=>l[t]})}}return i.default=l,Object.freeze(i)}const r=te(_),o=class o extends r.Component{constructor(i){super(i),this._element=null,this._dateInput=r.createRef(),this._calendar=null,this.shouldFocusDateInput=!1,this.prevShow=!1,this.focus=()=>{this.dateInput&&this.dateInput.focus()},this.setCalendarRef=t=>{this._calendar=t},this.nextValue=(t,s)=>t.value!==void 0?t.value:s.value,this.nextShow=(t,s)=>t.show!==void 0?t.show:s.show,this.renderPopup=()=>{const{disabled:t,min:s,max:a,weekNumber:g,focusedDate:f,popupSettings:d}=this.props,{popupClass:v,...w}=d,b=this.show,h=this.value,y=h&&k.getDate(h),p=n.classNames(v),C={popupClass:"k-datepicker-popup",show:b,anchor:this._element,className:p,id:this._popupId,anchorAlign:{horizontal:"left",vertical:"bottom"},popupAlign:{horizontal:"left",vertical:"top"},...w},c={disabled:t,value:y,min:s,max:a,weekNumber:g,focusedDate:f,className:this.mobileMode?"k-calendar-lg":"",navigation:!this.mobileMode,onChange:this.handleCalendarValueChange};return this.mobileMode?r.createElement(this.calendarComp,{_ref:this.setCalendarRef,...c}):r.createElement(this.popupComp,{...C},r.createElement(this.calendarComp,{_ref:this.setCalendarRef,...c}))},this.renderAdaptivePopup=()=>{const{windowWidth:t=0}=this.state,s={expand:this.show,onClose:this.handleBlur,adaptiveTitle:this.props.adaptiveTitle,windowWidth:t};return r.createElement(Y.AdaptiveMode,{...s},r.createElement(Q.ActionSheetContent,{overflowHidden:!0},this.renderPopup()))},this.handleInputValueChange=t=>{this.handleValueChange(t.value,t)},this.handleCalendarValueChange=t=>{const s=this.mergeTime(t.value);this.handleValueChange(s,t)},this.handleValueChange=(t,s)=>{this.setState({value:k.cloneDate(t||void 0)}),this.valueDuringOnChange=t,this.showDuringOnChange=!1,this.mobileMode||(this.shouldFocusDateInput=!0);const{onChange:a}=this.props;a&&a.call(void 0,{syntheticEvent:s.syntheticEvent,nativeEvent:s.nativeEvent,value:this.value,show:this.show,target:this}),this.valueDuringOnChange=void 0,this.showDuringOnChange=void 0,this.setShow(!1)},this.handleFocus=()=>{this.setState({focused:!0})},this.handleBlur=()=>{this.setState({focused:!1}),this.setShow(!1)},this.handleIconClick=()=>{this.props.disabled||(this.shouldFocusDateInput=!0,this.setShow(!this.show))},this.handleIconMouseDown=t=>{t.preventDefault()},this.handleKeyDown=t=>{const{altKey:s,keyCode:a}=t;if(a===n.Keys.esc&&this.show){this.shouldFocusDateInput=!0,this.setShow(!1);return}s&&(a===n.Keys.up||a===n.Keys.down)&&(t.preventDefault(),t.stopPropagation(),this.shouldFocusDateInput=a===n.Keys.up,this.setShow(a===n.Keys.down))},n.validatePackage($.packageMetadata),this.state={value:this.props.defaultValue||o.defaultProps.defaultValue,show:this.props.defaultShow||o.defaultProps.defaultShow,focused:!1}}get _popupId(){return this.props.id+"-popup-id"}get document(){if(n.canUseDOM)return this.element&&this.element.ownerDocument||document}get element(){return this._element}get mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=ee.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}get dateInput(){return this._dateInput.current}get calendar(){return this._calendar}get value(){const i=this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value;return i!==null?k.cloneDate(i):null}get show(){return this.showDuringOnChange!==void 0?this.showDuringOnChange:this.props.show!==void 0?this.props.show:this.state.show}get name(){return this.props.name}get min(){return this.props.min!==void 0?this.props.min:o.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:o.defaultProps.max}get dateInputComp(){return this.props.dateInput||o.defaultProps.dateInput}get toggleButtonComp(){return this.props.toggleButton||o.defaultProps.toggleButton}get calendarComp(){return this.props.calendar||o.defaultProps.calendar}get popupComp(){return this.props.popup||o.defaultProps.popup}get pickerWrapComp(){return this.props.pickerWrap||o.defaultProps.pickerWrap}get validity(){const i=m.isInDateRange(this.value,this.min,this.max),t=this.props.validationMessage!==void 0,s=(!this.required||this.value!==null)&&i,a=this.props.valid!==void 0?this.props.valid:s;return{customError:t,rangeOverflow:this.value&&this.max.getTime()<this.value.getTime()||!1,rangeUnderflow:this.value&&this.value.getTime()<this.min.getTime()||!1,valid:a,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:o.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:o.defaultProps.required}componentDidMount(){var i;this.observerResize=n.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.show&&this.forceUpdate(),(i=this.document)!=null&&i.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentDidUpdate(){this._calendar&&this._calendar.element&&this.show&&!this.prevShow&&this._calendar.element.focus({preventScroll:!0}),this.dateInput&&this.dateInput.element&&!this.show&&this.shouldFocusDateInput&&this.dateInput.element.focus({preventScroll:!0}),this.prevShow=this.show,this.shouldFocusDateInput=!1}componentWillUnmount(){var i;clearTimeout(this.nextTickId),(i=this.document)!=null&&i.body&&this.observerResize&&this.observerResize.disconnect()}render(){const{size:i=o.defaultProps.size,rounded:t=o.defaultProps.rounded,fillMode:s=o.defaultProps.fillMode,disabled:a,tabIndex:g,title:f,id:d,format:v,formatPlaceholder:w,min:b,max:h,className:y,width:p,name:C,validationMessage:c,required:E,validityStyles:F,ariaLabelledBy:R,ariaDescribedBy:z,ariaLabel:V,placeholder:N,label:I,popupSettings:ie,defaultValue:se,defaultShow:oe,value:ae,popup:ne,weekNumber:re,dateInput:le,calendar:ue,toggleButton:de,onChange:he,onBlur:pe,onFocus:ce,show:me,onOpen:ge,pickerWrap:fe,adaptive:ve,adaptiveTitle:we,valid:be,autoFocus:A,visited:ye,touched:Ce,modified:Ie,...O}=this.props,L=this.value,S=!this.validityStyles||this.validity.valid,K={disabled:a,format:v,formatPlaceholder:w,id:d,ariaLabelledBy:R,ariaDescribedBy:z,ariaLabel:V,max:h,min:b,name:C,onChange:this.handleInputValueChange,required:E,tabIndex:this.show?-1:g,title:f,valid:this.validity.valid,validationMessage:c,validityStyles:F,value:L,label:void 0,placeholder:this.state.focused?null:N,ariaExpanded:this.show,size:null,fillMode:null,rounded:null},M=q.provideLocalizationService(this).toLanguageString(D.toggleCalendar,D.messages[D.toggleCalendar]),P=r.createElement(n.AsyncFocusBlur,{onFocus:this.handleFocus,onBlur:this.mobileMode?void 0:this.handleBlur,onSyncBlur:this.props.onBlur,onSyncFocus:this.props.onFocus},T=>r.createElement(r.Fragment,null,r.createElement("span",{...I?{}:O,ref:W=>{this._element=W},className:n.classNames("k-input","k-datepicker",{[`k-input-${n.kendoThemeMaps.sizeMap[i]||i}`]:i,[`k-rounded-${n.kendoThemeMaps.roundedMap[t]||t}`]:t,[`k-input-${s}`]:s,"k-invalid":!S,"k-required":this.required,"k-disabled":a},y),onKeyDown:this.handleKeyDown,style:{width:p},onFocus:T.onFocus,onBlur:T.onBlur,onClick:this.mobileMode?this.handleIconClick:void 0},r.createElement(this.dateInputComp,{_ref:this._dateInput,ariaRole:"combobox",readonly:this.mobileMode,ariaExpanded:this.show,ariaControls:this._popupId,autoFocus:A,...K}),r.createElement(this.toggleButtonComp,{type:"button",icon:"calendar",svgIcon:j.calendarIcon,title:M,className:"k-input-button",rounded:null,onClick:this.mobileMode?void 0:this.handleIconClick,"aria-label":M,fillMode:s,onMouseDown:this.handleIconMouseDown}),!this.mobileMode&&this.renderPopup()),this.mobileMode&&this.renderAdaptivePopup()));return I?r.createElement(J.PickerFloatingLabel,{dateInput:this._dateInput,label:I,editorId:d,editorValid:S,editorDisabled:a,children:P,style:{width:p},...O}):P}setShow(i){const{onOpen:t,onClose:s}=this.props;this.show!==i&&(this.setState({show:i}),i&&t&&t.call(void 0,{target:this}),!i&&s&&s.call(void 0,{target:this}))}mergeTime(i){return this.value&&i?m.setTime(i,this.value):i}nextTick(i){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>i())}calculateMedia(i){for(let t of i)this.setState({windowWidth:t.target.clientWidth})}};o.displayName="DatePicker",o.propTypes={className:e.string,defaultShow:e.bool,defaultValue:e.instanceOf(Date),disabled:e.bool,focusedDate:e.instanceOf(Date),format:e.oneOfType([e.string,e.shape({skeleton:e.string,pattern:e.string,date:e.oneOf(["short","medium","long","full"]),time:e.oneOf(["short","medium","long","full"]),datetime:e.oneOf(["short","medium","long","full"]),era:e.oneOf(["narrow","short","long"]),year:e.oneOf(["numeric","2-digit"]),month:e.oneOf(["numeric","2-digit","narrow","short","long"]),day:e.oneOf(["numeric","2-digit"]),weekday:e.oneOf(["narrow","short","long"]),hour:e.oneOf(["numeric","2-digit"]),hour12:e.bool,minute:e.oneOf(["numeric","2-digit"]),second:e.oneOf(["numeric","2-digit"]),timeZoneName:e.oneOf(["short","long"])})]),formatPlaceholder:e.oneOfType([e.oneOf(["wide","narrow","short","formatPattern"]),e.shape({year:e.string,month:e.string,day:e.string,hour:e.string,minute:e.string,second:e.string})]),id:e.string,ariaLabelledBy:e.string,ariaDescribedBy:e.string,ariaLabel:e.string,min:e.instanceOf(Date),max:e.instanceOf(Date),name:e.string,popupSettings:e.shape({animate:e.bool,appendTo:e.any,popupClass:e.string}),show:e.bool,tabIndex:e.number,title:e.string,value:e.instanceOf(Date),weekNumber:e.bool,width:e.oneOfType([e.number,e.string]),validationMessage:e.string,required:e.bool,validate:e.bool,valid:e.bool,size:e.oneOf([null,"small","medium","large"]),rounded:e.oneOf([null,"small","medium","large","full"]),fillMode:e.oneOf([null,"solid","flat","outline"]),adaptive:e.bool,adaptiveTitle:e.string,autoFocus:e.bool},o.defaultProps={defaultShow:!1,defaultValue:null,dateInput:H.DateInput,calendar:X.Calendar,toggleButton:Z.ToggleButton,popup:U.Popup,pickerWrap:G.PickerWrap,disabled:!1,format:"d",max:m.MAX_DATE,min:m.MIN_DATE,popupSettings:{},tabIndex:0,weekNumber:!1,required:!1,validityStyles:!0,size:"medium",rounded:"medium",fillMode:"solid",autoFocus:!1};let u=o;const x=n.createPropsContext(),B=n.withIdHOC(n.withPropsContext(x,u));B.displayName="KendoReactDatePicker";q.registerForLocalization(u);exports.DatePicker=B;exports.DatePickerPropsContext=x;exports.DatePickerWithoutContext=u;
|