@progress/kendo-react-dateinputs 9.1.1-develop.2 → 9.1.1-develop.3
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/dateinput/DateInput.js +1 -1
- package/dateinput/DateInput.mjs +9 -9
- package/datepicker/DatePicker.js +1 -1
- package/datepicker/DatePicker.mjs +19 -20
- package/daterangepicker/DateRangePicker.js +1 -1
- package/daterangepicker/DateRangePicker.mjs +7 -9
- package/datetimepicker/DateTimePicker.js +1 -1
- package/datetimepicker/DateTimePicker.mjs +0 -1
- package/dist/cdn/js/kendo-react-dateinputs.js +1 -1
- package/package-metadata.mjs +1 -1
- package/package.json +7 -7
- package/timepicker/TimePicker.js +1 -1
- package/timepicker/TimePicker.mjs +0 -1
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 V=require("react"),e=require("prop-types"),g=require("@progress/kendo-date-math"),P=require("@progress/kendo-react-buttons"),M=require("@progress/kendo-svg-icons"),f=require("@progress/kendo-react-intl"),n=require("@progress/kendo-react-common"),_=require("@progress/kendo-react-labels"),L=require("@progress/kendo-dateinputs-common"),w=require("./utils.js"),N=require("../package-metadata.js"),v=require("../utils.js"),o=require("../messages/index.js"),A=require("../timepicker/utils.js"),F=require("../common/ClearButton.js"),R=require("./dateInputIntl.js");function j(c){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const i in c)if(i!=="default"){const s=Object.getOwnPropertyDescriptor(c,i);Object.defineProperty(t,i,s.get?s:{enumerable:!0,get:()=>c[i]})}}return t.default=c,Object.freeze(t)}const d=j(V),B="Please enter a valid value!",a=class a extends d.Component{constructor(t){super(t),this.kendoDate=null,this.kendoDateObject=null,this.mounted=!1,this._element=null,this._wrapper=null,this._nativeEvent=null,this.focus=()=>{this._element&&this._element.focus()},this.setValidity=()=>{this.element&&this.element.setCustomValidity&&this.element.setCustomValidity(this.validity.valid?"":this.props.validationMessage||a.defaultProps.validationMessage)},this.updateOnPaste=i=>{!this.element||!this.kendoDate||this.triggerChange(i)},this.spinnersMouseDown=i=>{i.preventDefault();const s=n.getActiveElement(document);this.element&&s!==this.element&&this.element.focus({preventScroll:!0})},this.handleClick=i=>{this.props.onChange&&this.props.onChange(i)},this.nativeWheel=i=>{n.getActiveElement(document)===this.element&&i.preventDefault()},this.increasePart=i=>{var s;(s=this.kendoDate)==null||s.modifyDateSegmentValue(1),this.onChange(i)},this.decreasePart=i=>{var s;(s=this.kendoDate)==null||s.modifyDateSegmentValue(-1),this.onChange(i)},this.elementOnFocus=i=>{this.wrapper&&this.wrapper.classList.add("k-focus"),this.setState({focused:!0})},this.elementOnBlur=i=>{this.wrapper&&this.wrapper.classList.remove("k-focus"),this.setState({focused:!1})},n.validatePackage(N.packageMetadata),this.state={focused:!1}}get _inputId(){return this.props.id+"-accessibility-id"}isFormatChanged(t,i){return typeof t!=typeof i?!0:typeof t=="string"&&typeof i=="string"?t!==i:typeof t=="object"&&typeof i=="object"?JSON.stringify(t)!==JSON.stringify(i):!1}mapFormatToCommonFormat(t){return typeof t=="string"?t:{inputFormat:t,displayFormat:t}}get value(){return this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.kendoDate&&this.kendoDate.value}get name(){return this.props.name}get min(){return this.props.min!==void 0?this.props.min:a.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:a.defaultProps.max}get isInSegmentSelection(){const{year:t,month:i,day:s,hours:l,minutes:u,seconds:r}=this.kendoDateObject;return(!t||!i||!s||!l||!u||!r)&&(t||i||s||l||u||r)}get text(){const{placeholder:t}=this.props,i=this.kendoDate&&this.kendoDate.currentText||"";return t!=null&&!this.state.focused&&!this.value?t:i}get validity(){const t=w.isInRange(this.value,this.min,this.max)&&A.isInTimeRange(this.value,this.props.minTime,this.props.maxTime),i=this.props.validationMessage!==void 0,s=(!this.required||this.value!==null)&&t,l=this.props.valid!==void 0?this.props.valid:s;return{customError:i,rangeOverflow:this.value&&this.max.getTime()<this.value.getTime()||!1,rangeUnderflow:this.value&&this.value.getTime()<this.min.getTime()||!1,valid:l,valueMissing:this.value===null}}get element(){return this._element}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:a.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:!1}get wrapper(){return this._wrapper}get options(){const{format:t,steps:i,placeholder:s,value:l,autoFill:u,enableMouseWheel:r,autoCorrectParts:h,autoSwitchParts:b,autoSwitchKeys:y,twoDigitYearMax:m,allowCaretMode:D,formatPlaceholder:C}=this.props;return{format:t,steps:i,formatPlaceholder:C,placeholder:s,selectPreviousSegmentOnBackspace:!0,value:l||this.value,intlService:this.intlCommon,autoFill:u!==void 0?u:!1,enableMouseWheel:r,autoCorrectParts:h,autoSwitchParts:b,autoSwitchKeys:y||[],twoDigitYearMax:m,allowCaretMode:D}}componentDidMount(){this.setValidity(),this.mounted||(this.wrapper&&this.wrapper.addEventListener("wheel",this.nativeWheel,{passive:!1}),this.kendoDate=this.initKendoDate(),this.kendoDateObject=this.kendoDate.dateObject,this.mounted=!0)}componentDidUpdate(t){this.setValidity(),this.kendoDate&&((this.isFormatChanged(t.format,this.props.format)||t.readonly!==this.props.readonly||t.steps!==this.props.steps||this.intlCommon.locale!==this.kendoDate.options.intlService.locale)&&this.kendoDate.setOptions(this.options,!0),t.value!==this.props.value&&(this.kendoDateObject.getValue()!==null||this.isInSegmentSelection&&this.props.value!==null)&&(this.kendoDateObject.setValue(this.props.value),this.kendoDate.writeValue(this.props.value)),this.props.ariaExpanded!==void 0&&this.props.ariaExpanded&&(this.kendoDate.options.placeholder=null),this.props.ariaExpanded!==void 0&&!this.props.ariaExpanded&&(this.kendoDate.options.placeholder=this.props.placeholder),this.kendoDate.refreshElementValue())}componentWillUnmount(){this.wrapper&&this.wrapper.removeEventListener("wheel",this.nativeWheel)}render(){var x;const{size:t=a.defaultProps.size,fillMode:i=a.defaultProps.fillMode,rounded:s=a.defaultProps.rounded,autoFocus:l=a.defaultProps.autoFocus,unstyled:u}=this.props,r=u&&u.uDateInput;this.props._ref&&(this.props._ref.current=this);const h=f.provideLocalizationService(this),b={...a.defaultProps,...this.props},{name:y,label:m,id:D,disabled:C}=b,I=this.text,E=D||this._inputId,O=!this.validityStyles||this.validity.valid,S=d.createElement("span",{ref:k=>{this._wrapper=k},style:m?void 0:{width:this.props.width},dir:this.props.dir,className:n.classNames(n.uDateInput.wrapper({c:r,size:t,fillMode:i,rounded:s,disabled:C,required:this.required,invalid:!O}),this.props.className)},d.createElement("input",{role:this.props.ariaRole||"textbox",readOnly:this.props.readonly,tabIndex:this.props.tabIndex||0,disabled:this.props.disabled,title:this.props.title!==void 0?this.props.title:I,value:I,type:"text",spellCheck:!1,autoComplete:"off",autoCorrect:"off",autoFocus:l,className:n.classNames(n.uDateInput.inputInner({c:r})),id:E,"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,"aria-required":this.props.required,"aria-invalid":!O,onKeyDown:this.onChange.bind(this),onChange:this.onChange.bind(this),onWheel:this.onChange.bind(this),onInput:this.onChange.bind(this),onClick:this.onChange.bind(this),name:y,ref:k=>this._element=k}),this.props.children,this.props.clearButton&&this.props.value&&d.createElement(F,{onClick:this.handleClick,key:"clearbutton"}),this.props.spinners&&d.createElement("span",{className:n.classNames(n.uDateInput.inputSpinner({c:r})),onMouseDown:this.spinnersMouseDown},d.createElement(P.Button,{tabIndex:-1,type:"button",rounded:null,className:n.classNames(n.uDateInput.spinnerIncrease({c:r})),icon:"caret-alt-up",svgIcon:M.caretAltUpIcon,"aria-label":h.toLanguageString(o.increaseValue,o.messages[o.increaseValue]),title:h.toLanguageString(o.increaseValue,o.messages[o.increaseValue]),onClick:this.increasePart}),d.createElement(P.Button,{tabIndex:-1,type:"button",rounded:null,className:n.classNames(n.uDateInput.spinnerDecrease({c:r})),icon:"caret-alt-down",svgIcon:M.caretAltDownIcon,"aria-label":h.toLanguageString(o.decreaseValue,o.messages[o.decreaseValue]),title:h.toLanguageString(o.decreaseValue,o.messages[o.decreaseValue]),onClick:this.decreasePart})));return m?d.createElement(_.FloatingLabel,{label:m,editorId:E,editorValue:(x=this._element)==null?void 0:x.value,editorValid:O,editorDisabled:this.props.disabled,children:S,style:{width:this.props.width}}):S}intl(){return f.provideIntlService(this)}get intlCommon(){return new R.DateInputIntl(f.provideIntlService(this))}triggerChange(t){this.valueDuringOnChange=this.value,this.forceUpdate(),this._nativeEvent=t,this.valueDuringOnChange=void 0}onChange(t){this._nativeEvent&&this.props.onChange&&!g.isEqual(this._nativeEvent.oldValue,this.value)&&this.props.onChange.call(void 0,{syntheticEvent:t,nativeEvent:this._nativeEvent.event,value:this._nativeEvent.value,target:this}),this._nativeEvent=null}initKendoDate(){return new L.DateInput(this._element,{...this.options,format:this.mapFormatToCommonFormat(this.options.format),events:{focus:this.elementOnFocus.bind(this),blur:this.elementOnBlur.bind(this),valueChange:this.triggerChange.bind(this),click:this.handleClick.bind(this)}})}};a.displayName="DateInput",a.propTypes={value: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})]),width:e.oneOfType([e.string,e.number]),tabIndex:e.number,title:e.string,steps:e.shape({year:e.number,month:e.number,day:e.number,hour:e.number,minute:e.number,second:e.number}),min:e.instanceOf(Date),max:e.instanceOf(Date),disabled:e.bool,spinners:e.bool,name:e.string,dir:e.string,label:e.string,id:e.string,ariaLabelledBy:e.string,ariaDescribedBy:e.string,ariaLabel:e.string,ariaRole:e.string,ariaHasPopup:e.oneOfType([e.bool,e.string]),ariaExpanded:e.oneOfType([e.bool]),onChange:e.func,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"]),autoFocus:e.bool},a.defaultProps={format:w.DEFAULT_FORMAT,size:"medium",rounded:"medium",fillMode:"solid",formatPlaceholder:w.DEFAULT_FORMAT_PLACEHOLDER,spinners:!1,disabled:!1,max:g.cloneDate(v.MAX_DATE),min:g.cloneDate(v.MIN_DATE),minTime:g.cloneDate(v.MIN_TIME),maxTime:g.cloneDate(v.MAX_TIME),validityStyles:!0,validationMessage:B,placeholder:null,enableMouseWheel:!0,autoCorrectParts:!0,autoSwitchParts:!0,allowCaretMode:!1,twoDigitYearMax:68,ariaHasPopup:"grid",autoFocus:!1};let p=a;const T=n.createPropsContext(),q=n.withIdHOC(n.withPropsContext(T,n.withUnstyledHOC(p)));q.displayName="KendoReactDateInput";f.registerForIntl(p);f.registerForLocalization(p);exports.DateInput=q;exports.DateInputPropsContext=T;exports.DateInputWithoutContext=p;
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const V=require("react"),e=require("prop-types"),g=require("@progress/kendo-date-math"),P=require("@progress/kendo-react-buttons"),M=require("@progress/kendo-svg-icons"),f=require("@progress/kendo-react-intl"),n=require("@progress/kendo-react-common"),_=require("@progress/kendo-react-labels"),L=require("@progress/kendo-dateinputs-common"),w=require("./utils.js"),N=require("../package-metadata.js"),v=require("../utils.js"),o=require("../messages/index.js"),A=require("../timepicker/utils.js"),F=require("../common/ClearButton.js"),R=require("./dateInputIntl.js");function j(c){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const i in c)if(i!=="default"){const s=Object.getOwnPropertyDescriptor(c,i);Object.defineProperty(t,i,s.get?s:{enumerable:!0,get:()=>c[i]})}}return t.default=c,Object.freeze(t)}const d=j(V),B="Please enter a valid value!",a=class a extends d.Component{constructor(t){super(t),this.kendoDate=null,this.kendoDateObject=null,this.mounted=!1,this._element=null,this._wrapper=null,this._nativeEvent=null,this.focus=()=>{this._element&&this._element.focus()},this.setValidity=()=>{this.element&&this.element.setCustomValidity&&this.element.setCustomValidity(this.validity.valid?"":this.props.validationMessage||a.defaultProps.validationMessage)},this.updateOnPaste=i=>{!this.element||!this.kendoDate||this.triggerChange(i)},this.spinnersMouseDown=i=>{i.preventDefault();const s=n.getActiveElement(document);this.element&&s!==this.element&&this.element.focus({preventScroll:!0})},this.handleClick=i=>{this.props.onChange&&this.props.onChange(i)},this.nativeWheel=i=>{n.getActiveElement(document)===this.element&&i.preventDefault()},this.increasePart=i=>{var s;(s=this.kendoDate)==null||s.modifyDateSegmentValue(1),this.onChange(i)},this.decreasePart=i=>{var s;(s=this.kendoDate)==null||s.modifyDateSegmentValue(-1),this.onChange(i)},this.elementOnFocus=i=>{this.wrapper&&this.wrapper.classList.add("k-focus"),this.setState({focused:!0})},this.elementOnBlur=i=>{this.wrapper&&this.wrapper.classList.remove("k-focus"),this.setState({focused:!1})},n.validatePackage(N.packageMetadata),this.state={focused:!1}}get _inputId(){return this.props.id+"-accessibility-id"}isFormatChanged(t,i){return typeof t!=typeof i?!0:typeof t=="string"&&typeof i=="string"?t!==i:typeof t=="object"&&typeof i=="object"?JSON.stringify(t)!==JSON.stringify(i):!1}mapFormatToCommonFormat(t){return typeof t=="string"?t:{inputFormat:t,displayFormat:t}}get value(){return this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.kendoDate&&this.kendoDate.value}get name(){return this.props.name}get min(){return this.props.min!==void 0?this.props.min:a.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:a.defaultProps.max}get isInSegmentSelection(){const{year:t,month:i,day:s,hours:l,minutes:u,seconds:r}=this.kendoDateObject;return(!t||!i||!s||!l||!u||!r)&&(t||i||s||l||u||r)}get text(){const{placeholder:t}=this.props,i=this.kendoDate&&this.kendoDate.currentText||"";return t!=null&&!this.state.focused&&!this.value?t:i}get validity(){const t=w.isInRange(this.value,this.min,this.max)&&A.isInTimeRange(this.value,this.props.minTime,this.props.maxTime),i=this.props.validationMessage!==void 0,s=(!this.required||this.value!==null)&&t,l=this.props.valid!==void 0?this.props.valid:s;return{customError:i,rangeOverflow:this.value&&this.max.getTime()<this.value.getTime()||!1,rangeUnderflow:this.value&&this.value.getTime()<this.min.getTime()||!1,valid:l,valueMissing:this.value===null}}get element(){return this._element}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:a.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:!1}get wrapper(){return this._wrapper}get options(){const{format:t,steps:i,placeholder:s,value:l,autoFill:u,enableMouseWheel:r,autoCorrectParts:h,autoSwitchParts:b,autoSwitchKeys:y,twoDigitYearMax:m,allowCaretMode:D,formatPlaceholder:C}=this.props;return{format:t,steps:i,formatPlaceholder:C,placeholder:s,selectPreviousSegmentOnBackspace:!0,value:l||this.value,intlService:this.intlCommon,autoFill:u!==void 0?u:!1,enableMouseWheel:r,autoCorrectParts:h,autoSwitchParts:b,autoSwitchKeys:y||[],twoDigitYearMax:m,allowCaretMode:D}}componentDidMount(){this.setValidity(),this.mounted||(this.wrapper&&this.wrapper.addEventListener("wheel",this.nativeWheel,{passive:!1}),this.kendoDate=this.initKendoDate(),this.kendoDateObject=this.kendoDate.dateObject,this.mounted=!0)}componentDidUpdate(t){this.setValidity(),this.kendoDate&&((this.isFormatChanged(t.format,this.props.format)||t.readonly!==this.props.readonly||t.steps!==this.props.steps||this.intlCommon.locale!==this.kendoDate.options.intlService.locale)&&this.kendoDate.setOptions(this.options,!0),t.value!==this.props.value&&(this.kendoDateObject.getValue()!==null||this.isInSegmentSelection&&this.props.value!==null)&&this.kendoDateObject.setValue(this.props.value),this.props.ariaExpanded!==void 0&&this.props.ariaExpanded&&(this.kendoDate.options.placeholder=null),this.props.ariaExpanded!==void 0&&!this.props.ariaExpanded&&(this.kendoDate.options.placeholder=this.props.placeholder),this.kendoDate.refreshElementValue())}componentWillUnmount(){this.wrapper&&this.wrapper.removeEventListener("wheel",this.nativeWheel)}render(){var x;const{size:t=a.defaultProps.size,fillMode:i=a.defaultProps.fillMode,rounded:s=a.defaultProps.rounded,autoFocus:l=a.defaultProps.autoFocus,unstyled:u}=this.props,r=u&&u.uDateInput;this.props._ref&&(this.props._ref.current=this);const h=f.provideLocalizationService(this),b={...a.defaultProps,...this.props},{name:y,label:m,id:D,disabled:C}=b,I=this.text,E=D||this._inputId,O=!this.validityStyles||this.validity.valid,S=d.createElement("span",{ref:k=>{this._wrapper=k},style:m?void 0:{width:this.props.width},dir:this.props.dir,className:n.classNames(n.uDateInput.wrapper({c:r,size:t,fillMode:i,rounded:s,disabled:C,required:this.required,invalid:!O}),this.props.className)},d.createElement("input",{role:this.props.ariaRole||"textbox",readOnly:this.props.readonly,tabIndex:this.props.tabIndex||0,disabled:this.props.disabled,title:this.props.title!==void 0?this.props.title:I,value:I,type:"text",spellCheck:!1,autoComplete:"off",autoCorrect:"off",autoFocus:l,className:n.classNames(n.uDateInput.inputInner({c:r})),id:E,"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,"aria-required":this.props.required,"aria-invalid":!O,onKeyDown:this.onChange.bind(this),onChange:this.onChange.bind(this),onWheel:this.onChange.bind(this),onInput:this.onChange.bind(this),onClick:this.onChange.bind(this),name:y,ref:k=>this._element=k}),this.props.children,this.props.clearButton&&this.props.value&&d.createElement(F,{onClick:this.handleClick,key:"clearbutton"}),this.props.spinners&&d.createElement("span",{className:n.classNames(n.uDateInput.inputSpinner({c:r})),onMouseDown:this.spinnersMouseDown},d.createElement(P.Button,{tabIndex:-1,type:"button",rounded:null,className:n.classNames(n.uDateInput.spinnerIncrease({c:r})),icon:"caret-alt-up",svgIcon:M.caretAltUpIcon,"aria-label":h.toLanguageString(o.increaseValue,o.messages[o.increaseValue]),title:h.toLanguageString(o.increaseValue,o.messages[o.increaseValue]),onClick:this.increasePart}),d.createElement(P.Button,{tabIndex:-1,type:"button",rounded:null,className:n.classNames(n.uDateInput.spinnerDecrease({c:r})),icon:"caret-alt-down",svgIcon:M.caretAltDownIcon,"aria-label":h.toLanguageString(o.decreaseValue,o.messages[o.decreaseValue]),title:h.toLanguageString(o.decreaseValue,o.messages[o.decreaseValue]),onClick:this.decreasePart})));return m?d.createElement(_.FloatingLabel,{label:m,editorId:E,editorValue:(x=this._element)==null?void 0:x.value,editorValid:O,editorDisabled:this.props.disabled,children:S,style:{width:this.props.width}}):S}intl(){return f.provideIntlService(this)}get intlCommon(){return new R.DateInputIntl(f.provideIntlService(this))}triggerChange(t){this.valueDuringOnChange=this.value,this.forceUpdate(),this._nativeEvent=t,this.valueDuringOnChange=void 0}onChange(t){this._nativeEvent&&this.props.onChange&&!g.isEqual(this._nativeEvent.oldValue,this.value)&&this.props.onChange.call(void 0,{syntheticEvent:t,nativeEvent:this._nativeEvent.event,value:this._nativeEvent.value,target:this}),this._nativeEvent=null}initKendoDate(){return new L.DateInput(this._element,{...this.options,format:this.mapFormatToCommonFormat(this.options.format),events:{focus:this.elementOnFocus.bind(this),blur:this.elementOnBlur.bind(this),valueChange:this.triggerChange.bind(this),click:this.handleClick.bind(this)}})}};a.displayName="DateInput",a.propTypes={value: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})]),width:e.oneOfType([e.string,e.number]),tabIndex:e.number,title:e.string,steps:e.shape({year:e.number,month:e.number,day:e.number,hour:e.number,minute:e.number,second:e.number}),min:e.instanceOf(Date),max:e.instanceOf(Date),disabled:e.bool,spinners:e.bool,name:e.string,dir:e.string,label:e.string,id:e.string,ariaLabelledBy:e.string,ariaDescribedBy:e.string,ariaLabel:e.string,ariaRole:e.string,ariaHasPopup:e.oneOfType([e.bool,e.string]),ariaExpanded:e.oneOfType([e.bool]),onChange:e.func,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"]),autoFocus:e.bool},a.defaultProps={format:w.DEFAULT_FORMAT,size:"medium",rounded:"medium",fillMode:"solid",formatPlaceholder:w.DEFAULT_FORMAT_PLACEHOLDER,spinners:!1,disabled:!1,max:g.cloneDate(v.MAX_DATE),min:g.cloneDate(v.MIN_DATE),minTime:g.cloneDate(v.MIN_TIME),maxTime:g.cloneDate(v.MAX_TIME),validityStyles:!0,validationMessage:B,placeholder:null,enableMouseWheel:!0,autoCorrectParts:!0,autoSwitchParts:!0,allowCaretMode:!1,twoDigitYearMax:68,ariaHasPopup:"grid",autoFocus:!1};let p=a;const T=n.createPropsContext(),q=n.withIdHOC(n.withPropsContext(T,n.withUnstyledHOC(p)));q.displayName="KendoReactDateInput";f.registerForIntl(p);f.registerForLocalization(p);exports.DateInput=q;exports.DateInputPropsContext=T;exports.DateInputWithoutContext=p;
|
package/dateinput/DateInput.mjs
CHANGED
|
@@ -10,8 +10,8 @@ import * as l from "react";
|
|
|
10
10
|
import e from "prop-types";
|
|
11
11
|
import { cloneDate as c, isEqual as T } from "@progress/kendo-date-math";
|
|
12
12
|
import { Button as x } from "@progress/kendo-react-buttons";
|
|
13
|
-
import { caretAltUpIcon as L, caretAltDownIcon as
|
|
14
|
-
import { provideLocalizationService as
|
|
13
|
+
import { caretAltUpIcon as L, caretAltDownIcon as _ } from "@progress/kendo-svg-icons";
|
|
14
|
+
import { provideLocalizationService as V, provideIntlService as P, registerForIntl as A, registerForLocalization as F } from "@progress/kendo-react-intl";
|
|
15
15
|
import { getActiveElement as M, validatePackage as N, classNames as d, uDateInput as u, createPropsContext as q, withIdHOC as B, withPropsContext as R, withUnstyledHOC as j } from "@progress/kendo-react-common";
|
|
16
16
|
import { FloatingLabel as U } from "@progress/kendo-react-labels";
|
|
17
17
|
import { DateInput as z } from "@progress/kendo-dateinputs-common";
|
|
@@ -206,7 +206,7 @@ const te = "Please enter a valid value!", n = class n extends l.Component {
|
|
|
206
206
|
* @hidden
|
|
207
207
|
*/
|
|
208
208
|
componentDidUpdate(t) {
|
|
209
|
-
this.setValidity(), this.kendoDate && ((this.isFormatChanged(t.format, this.props.format) || t.readonly !== this.props.readonly || t.steps !== this.props.steps || this.intlCommon.locale !== this.kendoDate.options.intlService.locale) && this.kendoDate.setOptions(this.options, !0), t.value !== this.props.value && (this.kendoDateObject.getValue() !== null || this.isInSegmentSelection && this.props.value !== null) &&
|
|
209
|
+
this.setValidity(), this.kendoDate && ((this.isFormatChanged(t.format, this.props.format) || t.readonly !== this.props.readonly || t.steps !== this.props.steps || this.intlCommon.locale !== this.kendoDate.options.intlService.locale) && this.kendoDate.setOptions(this.options, !0), t.value !== this.props.value && (this.kendoDateObject.getValue() !== null || this.isInSegmentSelection && this.props.value !== null) && this.kendoDateObject.setValue(this.props.value), this.props.ariaExpanded !== void 0 && this.props.ariaExpanded && (this.kendoDate.options.placeholder = null), this.props.ariaExpanded !== void 0 && !this.props.ariaExpanded && (this.kendoDate.options.placeholder = this.props.placeholder), this.kendoDate.refreshElementValue());
|
|
210
210
|
}
|
|
211
211
|
/**
|
|
212
212
|
* @hidden
|
|
@@ -227,7 +227,7 @@ const te = "Please enter a valid value!", n = class n extends l.Component {
|
|
|
227
227
|
unstyled: r
|
|
228
228
|
} = this.props, a = r && r.uDateInput;
|
|
229
229
|
this.props._ref && (this.props._ref.current = this);
|
|
230
|
-
const h =
|
|
230
|
+
const h = V(this), y = { ...n.defaultProps, ...this.props }, { name: b, label: p, id: D, disabled: C } = y, E = this.text, k = D || this._inputId, O = !this.validityStyles || this.validity.valid, I = /* @__PURE__ */ l.createElement(
|
|
231
231
|
"span",
|
|
232
232
|
{
|
|
233
233
|
ref: (w) => {
|
|
@@ -255,15 +255,15 @@ const te = "Please enter a valid value!", n = class n extends l.Component {
|
|
|
255
255
|
readOnly: this.props.readonly,
|
|
256
256
|
tabIndex: this.props.tabIndex || 0,
|
|
257
257
|
disabled: this.props.disabled,
|
|
258
|
-
title: this.props.title !== void 0 ? this.props.title :
|
|
259
|
-
value:
|
|
258
|
+
title: this.props.title !== void 0 ? this.props.title : E,
|
|
259
|
+
value: E,
|
|
260
260
|
type: "text",
|
|
261
261
|
spellCheck: !1,
|
|
262
262
|
autoComplete: "off",
|
|
263
263
|
autoCorrect: "off",
|
|
264
264
|
autoFocus: o,
|
|
265
265
|
className: d(u.inputInner({ c: a })),
|
|
266
|
-
id:
|
|
266
|
+
id: k,
|
|
267
267
|
"aria-label": this.props.ariaLabel,
|
|
268
268
|
"aria-labelledby": this.props.ariaLabelledBy,
|
|
269
269
|
"aria-describedby": this.props.ariaDescribedBy,
|
|
@@ -312,7 +312,7 @@ const te = "Please enter a valid value!", n = class n extends l.Component {
|
|
|
312
312
|
rounded: null,
|
|
313
313
|
className: d(u.spinnerDecrease({ c: a })),
|
|
314
314
|
icon: "caret-alt-down",
|
|
315
|
-
svgIcon:
|
|
315
|
+
svgIcon: _,
|
|
316
316
|
"aria-label": h.toLanguageString(v, g[v]),
|
|
317
317
|
title: h.toLanguageString(v, g[v]),
|
|
318
318
|
onClick: this.decreasePart
|
|
@@ -324,7 +324,7 @@ const te = "Please enter a valid value!", n = class n extends l.Component {
|
|
|
324
324
|
U,
|
|
325
325
|
{
|
|
326
326
|
label: p,
|
|
327
|
-
editorId:
|
|
327
|
+
editorId: k,
|
|
328
328
|
editorValue: (S = this._element) == null ? void 0 : S.value,
|
|
329
329
|
editorValid: O,
|
|
330
330
|
editorDisabled: this.props.disabled,
|
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 Z=require("react"),e=require("prop-types"),G=require("@progress/kendo-react-popup"),I=require("@progress/kendo-date-math"),n=require("@progress/kendo-react-common"),J=require("@progress/kendo-svg-icons"),Q=require("../package-metadata.js"),ee=require("../dateinput/DateInput.js"),te=require("../calendar/components/Calendar.js"),m=require("../utils.js"),k=require("../messages/index.js"),q=require("@progress/kendo-react-intl"),se=require("./ToggleButton.js"),ie=require("../common/PickerWrap.js"),oe=require("../hooks/usePickerFloatingLabel.js"),ae=require("@progress/kendo-react-layout"),ne=require("../common/AdaptiveMode.js"),re=require("../common/constants.js");function le(l){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const t in l)if(t!=="default"){const i=Object.getOwnPropertyDescriptor(l,t);Object.defineProperty(s,t,i.get?i:{enumerable:!0,get:()=>l[t]})}}return s.default=l,Object.freeze(s)}const r=le(Z),o=class o extends r.Component{constructor(s){super(s),this._element=null,this._dateInput=r.createRef(),this._calendar=null,this.shouldFocusDateInput=!1,this.prevShow=!1,this.focus=()=>{this.dateInput&&this.dateInput.focus()},this.setCalendarRef=t=>{this._calendar=t},this.nextValue=(t,i)=>t.value!==void 0?t.value:i.value,this.nextShow=(t,i)=>t.show!==void 0?t.show:i.show,this.renderPopup=()=>{const{disabled:t,min:i,max:a,weekNumber:g,focusedDate:f,popupSettings:d}=this.props,{popupClass:v,...w}=d,b=this.show,h=this.value,y=h&&I.getDate(h),p=n.classNames(v),D={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,onMouseDownOutside:this.handleMouseDownOutside},c={disabled:t,value:y,min:i,max:a,weekNumber:g,focusedDate:f,className:this.mobileMode?"k-calendar-lg":"",navigation:!this.mobileMode,onChange:this.handleCalendarValueChange};return this.mobileMode?r.createElement(this.calendarComp,{_ref:this.setCalendarRef,...c}):r.createElement(this.popupComp,{...D},r.createElement(this.calendarComp,{_ref:this.setCalendarRef,...c}))},this.renderAdaptivePopup=()=>{const{windowWidth:t=0}=this.state,i={expand:this.show,onClose:this.handleBlur,adaptiveTitle:this.props.adaptiveTitle,windowWidth:t};return r.createElement(ne.AdaptiveMode,{...i},r.createElement(ae.ActionSheetContent,{overflowHidden:!0},this.renderPopup()))},this.handleInputValueChange=t=>{this.handleValueChange(t.value,t)},this.handleCalendarValueChange=t=>{const i=this.mergeTime(t.value);this.handleValueChange(i,t)},this.handleValueChange=(t,i)=>{this.setState({value:I.cloneDate(t||void 0)}),this.valueDuringOnChange=t,this.showDuringOnChange=!1,this.mobileMode||(this.shouldFocusDateInput=!0);const{onChange:a}=this.props;a&&a.call(void 0,{syntheticEvent:i.syntheticEvent,nativeEvent:i.nativeEvent,value:this.value,show:this.show,target:this}),this.valueDuringOnChange=void 0,this.showDuringOnChange=void 0,this.setShow(!1)},this.handleFocus=()=>{this.setState({focused:!0})},this.handleBlur=()=>{this.setState({focused:!1}),this.setShow(!1)},this.togglePopup=()=>{this.setShow(!this.show)},this.handleMouseDownOutside=t=>{var i;(i=this.props.popupSettings)!=null&&i.onMouseDownOutside&&this.props.popupSettings.onMouseDownOutside.call(void 0,t)},this.handleIconClick=()=>{this.props.disabled||(this.shouldFocusDateInput=!0,this.setShow(!this.show))},this.handleIconMouseDown=t=>{t.preventDefault()},this.handleKeyDown=t=>{const{altKey:i,keyCode:a}=t;if(a===n.Keys.esc&&this.show){this.shouldFocusDateInput=!0,this.setShow(!1);return}i&&(a===n.Keys.up||a===n.Keys.down)&&(t.preventDefault(),t.stopPropagation(),this.shouldFocusDateInput=a===n.Keys.up,this.setShow(a===n.Keys.down))},n.validatePackage(Q.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<=re.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}get dateInput(){return this._dateInput.current}get calendar(){return this._calendar}get value(){const s=this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value;return s!==null?I.cloneDate(s):null}get show(){return this.showDuringOnChange!==void 0?this.showDuringOnChange:this.props.show!==void 0?this.props.show:this.state.show}get name(){return this.props.name}get min(){return this.props.min!==void 0?this.props.min:o.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:o.defaultProps.max}get dateInputComp(){return this.props.dateInput||o.defaultProps.dateInput}get toggleButtonComp(){return this.props.toggleButton||o.defaultProps.toggleButton}get calendarComp(){return this.props.calendar||o.defaultProps.calendar}get popupComp(){return this.props.popup||o.defaultProps.popup}get pickerWrapComp(){return this.props.pickerWrap||o.defaultProps.pickerWrap}get validity(){const s=m.isInDateRange(this.value,this.min,this.max),t=this.props.validationMessage!==void 0,i=(!this.required||this.value!==null)&&s,a=this.props.valid!==void 0?this.props.valid:i;return{customError:t,rangeOverflow:this.value&&this.max.getTime()<this.value.getTime()||!1,rangeUnderflow:this.value&&this.value.getTime()<this.min.getTime()||!1,valid:a,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:o.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:!1}componentDidMount(){var s;this.observerResize=n.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.show&&this.forceUpdate(),(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentDidUpdate(){this._calendar&&this._calendar.element&&this.show&&!this.prevShow&&this._calendar.element.focus({preventScroll:!0}),this.dateInput&&this.dateInput.element&&!this.show&&this.shouldFocusDateInput&&this.dateInput.element.focus({preventScroll:!0}),this.prevShow=this.show,this.shouldFocusDateInput=!1}componentWillUnmount(){var s;clearTimeout(this.nextTickId),(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.disconnect()}render(){const{size:s=o.defaultProps.size,rounded:t=o.defaultProps.rounded,fillMode:i=o.defaultProps.fillMode,disabled:a,tabIndex:g,title:f,id:d,format:v,formatPlaceholder:w,min:b,max:h,className:y,width:p,name:D,validationMessage:c,required:E,validityStyles:F,ariaLabelledBy:R,ariaDescribedBy:z,ariaLabel:V,placeholder:N,label:C,popupSettings:ue,defaultValue:de,defaultShow:he,value:pe,popup:ce,weekNumber:me,dateInput:ge,calendar:fe,toggleButton:ve,onChange:we,onBlur:be,onFocus:ye,show:De,onOpen:Ce,pickerWrap:Ie,adaptive:ke,adaptiveTitle:Me,valid:Oe,autoFocus:A,visited:Se,touched:Pe,modified:Te,autoFill:K,twoDigitYearMax:L,enableMouseWheel:W,autoCorrectParts:_,autoSwitchParts:U,autoSwitchKeys:j,allowCaretMode:$,...M}=this.props,H=this.value,O=!this.validityStyles||this.validity.valid,X={disabled:a,format:v,formatPlaceholder:w,id:d,ariaLabelledBy:R,ariaDescribedBy:z,ariaLabel:V,max:h,min:b,name:D,onChange:this.handleInputValueChange,required:E,tabIndex:this.show?-1:g,title:f,valid:this.validity.valid,validationMessage:c,validityStyles:F,value:H,label:void 0,placeholder:this.state.focused?null:N,ariaExpanded:this.show,size:null,fillMode:null,rounded:null,autoFill:K,twoDigitYearMax:L,enableMouseWheel:W,autoCorrectParts:_,autoSwitchParts:U,autoSwitchKeys:j,allowCaretMode:$},S=q.provideLocalizationService(this).toLanguageString(k.toggleCalendar,k.messages[k.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",{...C?{}:M,ref:Y=>{this._element=Y},className:n.classNames("k-input","k-datepicker",{[`k-input-${n.kendoThemeMaps.sizeMap[s]||s}`]:s,[`k-rounded-${n.kendoThemeMaps.roundedMap[t]||t}`]:t,[`k-input-${i}`]:i,"k-invalid":!O,"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,...X}),r.createElement(this.toggleButtonComp,{type:"button",icon:"calendar",svgIcon:J.calendarIcon,title:S,className:"k-input-button",rounded:null,onClick:this.mobileMode?void 0:this.handleIconClick,"aria-label":S,fillMode:i,onMouseDown:this.handleIconMouseDown}),!this.mobileMode&&this.renderPopup()),this.mobileMode&&this.renderAdaptivePopup()));return C?r.createElement(oe.PickerFloatingLabel,{dateInput:this._dateInput,label:C,editorId:d,editorValid:O,editorDisabled:a,children:P,style:{width:p},...M}):P}setShow(s){const{onOpen:t,onClose:i}=this.props;this.show!==s&&(this.setState({show:s}),s&&t&&t.call(void 0,{target:this}),!s&&i&&i.call(void 0,{target:this}))}mergeTime(s){return this.value&&s?m.setTime(s,this.value):s}nextTick(s){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>s())}calculateMedia(s){for(const t of s)this.setState({windowWidth:t.target.clientWidth})}};o.displayName="DatePicker",o.propTypes={className:e.string,defaultShow:e.bool,defaultValue:e.instanceOf(Date),disabled:e.bool,focusedDate:e.instanceOf(Date),format:e.oneOfType([e.string,e.shape({skeleton:e.string,pattern:e.string,date:e.oneOf(["short","medium","long","full"]),time:e.oneOf(["short","medium","long","full"]),datetime:e.oneOf(["short","medium","long","full"]),era:e.oneOf(["narrow","short","long"]),year:e.oneOf(["numeric","2-digit"]),month:e.oneOf(["numeric","2-digit","narrow","short","long"]),day:e.oneOf(["numeric","2-digit"]),weekday:e.oneOf(["narrow","short","long"]),hour:e.oneOf(["numeric","2-digit"]),hour12:e.bool,minute:e.oneOf(["numeric","2-digit"]),second:e.oneOf(["numeric","2-digit"]),timeZoneName:e.oneOf(["short","long"])})]),formatPlaceholder:e.oneOfType([e.oneOf(["wide","narrow","short","formatPattern"]),e.shape({year:e.string,month:e.string,day:e.string,hour:e.string,minute:e.string,second:e.string})]),id:e.string,ariaLabelledBy:e.string,ariaDescribedBy:e.string,ariaLabel:e.string,min:e.instanceOf(Date),max:e.instanceOf(Date),name:e.string,popupSettings:e.shape({animate:e.bool,appendTo:e.any,popupClass:e.string}),show:e.bool,tabIndex:e.number,title:e.string,value:e.instanceOf(Date),weekNumber:e.bool,width:e.oneOfType([e.number,e.string]),validationMessage:e.string,required:e.bool,validate:e.bool,valid:e.bool,size:e.oneOf([null,"small","medium","large"]),rounded:e.oneOf([null,"small","medium","large","full"]),fillMode:e.oneOf([null,"solid","flat","outline"]),adaptive:e.bool,adaptiveTitle:e.string,autoFocus:e.bool},o.defaultProps={defaultShow:!1,defaultValue:null,dateInput:ee.DateInput,calendar:te.Calendar,toggleButton:se.ToggleButton,popup:G.Popup,pickerWrap:ie.PickerWrap,disabled:!1,format:"d",max:m.MAX_DATE,min:m.MIN_DATE,popupSettings:{},tabIndex:0,weekNumber:!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 Z=require("react"),e=require("prop-types"),G=require("@progress/kendo-react-popup"),I=require("@progress/kendo-date-math"),n=require("@progress/kendo-react-common"),J=require("@progress/kendo-svg-icons"),Q=require("../package-metadata.js"),ee=require("../dateinput/DateInput.js"),te=require("../calendar/components/Calendar.js"),m=require("../utils.js"),k=require("../messages/index.js"),q=require("@progress/kendo-react-intl"),se=require("./ToggleButton.js"),ie=require("../common/PickerWrap.js"),oe=require("../hooks/usePickerFloatingLabel.js"),ae=require("@progress/kendo-react-layout"),ne=require("../common/AdaptiveMode.js"),re=require("../common/constants.js");function le(l){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const t in l)if(t!=="default"){const i=Object.getOwnPropertyDescriptor(l,t);Object.defineProperty(s,t,i.get?i:{enumerable:!0,get:()=>l[t]})}}return s.default=l,Object.freeze(s)}const r=le(Z),o=class o extends r.Component{constructor(s){super(s),this._element=null,this._dateInput=r.createRef(),this._calendar=null,this.shouldFocusDateInput=!1,this.prevShow=!1,this.focus=()=>{this.dateInput&&this.dateInput.focus()},this.setCalendarRef=t=>{this._calendar=t},this.nextValue=(t,i)=>t.value!==void 0?t.value:i.value,this.nextShow=(t,i)=>t.show!==void 0?t.show:i.show,this.renderPopup=()=>{const{disabled:t,min:i,max:a,weekNumber:g,focusedDate:f,popupSettings:d}=this.props,{popupClass:v,...w}=d,b=this.show,h=this.value,y=h&&I.getDate(h),p=n.classNames(v),D={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,onMouseDownOutside:this.handleMouseDownOutside},c={disabled:t,value:y,min:i,max:a,weekNumber:g,focusedDate:f,className:this.mobileMode?"k-calendar-lg":"",navigation:!this.mobileMode,onChange:this.handleCalendarValueChange};return this.mobileMode?r.createElement(this.calendarComp,{_ref:this.setCalendarRef,...c}):r.createElement(this.popupComp,{...D},r.createElement(this.calendarComp,{_ref:this.setCalendarRef,...c}))},this.renderAdaptivePopup=()=>{const{windowWidth:t=0}=this.state,i={expand:this.show,onClose:this.handleBlur,adaptiveTitle:this.props.adaptiveTitle,windowWidth:t};return r.createElement(ne.AdaptiveMode,{...i},r.createElement(ae.ActionSheetContent,{overflowHidden:!0},this.renderPopup()))},this.handleInputValueChange=t=>{this.handleValueChange(t.value,t)},this.handleCalendarValueChange=t=>{const i=this.mergeTime(t.value);this.handleValueChange(i,t)},this.handleValueChange=(t,i)=>{this.setState({value:I.cloneDate(t||void 0)}),this.valueDuringOnChange=t,this.showDuringOnChange=!1,this.mobileMode||(this.shouldFocusDateInput=!0);const{onChange:a}=this.props;a&&a.call(void 0,{syntheticEvent:i.syntheticEvent,nativeEvent:i.nativeEvent,value:this.value,show:this.show,target:this}),this.valueDuringOnChange=void 0,this.showDuringOnChange=void 0,this.setShow(!1)},this.handleFocus=()=>{this.setState({focused:!0})},this.handleBlur=()=>{this.setState({focused:!1}),this.setShow(!1)},this.togglePopup=()=>{this.setShow(!this.show)},this.handleMouseDownOutside=t=>{var i;(i=this.props.popupSettings)!=null&&i.onMouseDownOutside&&this.props.popupSettings.onMouseDownOutside.call(void 0,t)},this.handleIconClick=()=>{this.props.disabled||(this.shouldFocusDateInput=!0,this.setShow(!this.show))},this.handleIconMouseDown=t=>{t.preventDefault()},this.handleKeyDown=t=>{const{altKey:i,keyCode:a}=t;if(a===n.Keys.esc&&this.show){this.shouldFocusDateInput=!0,this.setShow(!1);return}i&&(a===n.Keys.up||a===n.Keys.down)&&(t.preventDefault(),t.stopPropagation(),this.shouldFocusDateInput=a===n.Keys.up,this.setShow(a===n.Keys.down))},n.validatePackage(Q.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<=re.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}get dateInput(){return this._dateInput.current}get calendar(){return this._calendar}get value(){const s=this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value;return s!==null?I.cloneDate(s):null}get show(){return this.showDuringOnChange!==void 0?this.showDuringOnChange:this.props.show!==void 0?this.props.show:this.state.show}get name(){return this.props.name}get min(){return this.props.min!==void 0?this.props.min:o.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:o.defaultProps.max}get dateInputComp(){return this.props.dateInput||o.defaultProps.dateInput}get toggleButtonComp(){return this.props.toggleButton||o.defaultProps.toggleButton}get calendarComp(){return this.props.calendar||o.defaultProps.calendar}get popupComp(){return this.props.popup||o.defaultProps.popup}get pickerWrapComp(){return this.props.pickerWrap||o.defaultProps.pickerWrap}get validity(){const s=m.isInDateRange(this.value,this.min,this.max),t=this.props.validationMessage!==void 0,i=(!this.required||this.value!==null)&&s,a=this.props.valid!==void 0?this.props.valid:i;return{customError:t,rangeOverflow:this.value&&this.max.getTime()<this.value.getTime()||!1,rangeUnderflow:this.value&&this.value.getTime()<this.min.getTime()||!1,valid:a,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:o.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:!1}componentDidMount(){var s;this.observerResize=n.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.show&&this.forceUpdate(),(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentDidUpdate(){this._calendar&&this._calendar.element&&this.show&&!this.prevShow&&this._calendar.element.focus({preventScroll:!0}),this.dateInput&&this.dateInput.element&&!this.show&&this.shouldFocusDateInput&&this.dateInput.element.focus({preventScroll:!0}),this.prevShow=this.show,this.shouldFocusDateInput=!1}componentWillUnmount(){var s;clearTimeout(this.nextTickId),(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.disconnect()}render(){const{size:s=o.defaultProps.size,rounded:t=o.defaultProps.rounded,fillMode:i=o.defaultProps.fillMode,disabled:a,tabIndex:g,title:f,id:d,format:v,formatPlaceholder:w,min:b,max:h,className:y,width:p,name:D,validationMessage:c,required:E,validityStyles:F,ariaLabelledBy:R,ariaDescribedBy:z,ariaLabel:V,placeholder:N,label:C,popupSettings:ue,defaultValue:de,defaultShow:he,value:pe,popup:ce,weekNumber:me,dateInput:ge,calendar:fe,toggleButton:ve,onChange:we,onBlur:be,onFocus:ye,show:De,onOpen:Ce,pickerWrap:Ie,adaptive:ke,adaptiveTitle:Oe,valid:Me,autoFocus:A,visited:Se,touched:Pe,modified:Te,autoFill:K,twoDigitYearMax:L,enableMouseWheel:W,autoCorrectParts:_,autoSwitchParts:U,autoSwitchKeys:j,allowCaretMode:$,...O}=this.props,H=this.value,M=!this.validityStyles||this.validity.valid,X={disabled:a,format:v,formatPlaceholder:w,id:d,ariaLabelledBy:R,ariaDescribedBy:z,ariaLabel:V,max:h,min:b,name:D,onChange:this.handleInputValueChange,required:E,tabIndex:this.show?-1:g,title:f,valid:this.validity.valid,validationMessage:c,validityStyles:F,value:H,label:void 0,placeholder:this.state.focused?null:N,ariaExpanded:this.show,size:null,fillMode:null,rounded:null,autoFill:K,twoDigitYearMax:L,enableMouseWheel:W,autoCorrectParts:_,autoSwitchParts:U,autoSwitchKeys:j,allowCaretMode:$},S=q.provideLocalizationService(this).toLanguageString(k.toggleCalendar,k.messages[k.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",{...C?{}:O,ref:Y=>{this._element=Y},className:n.classNames("k-input","k-datepicker",{[`k-input-${n.kendoThemeMaps.sizeMap[s]||s}`]:s,[`k-rounded-${n.kendoThemeMaps.roundedMap[t]||t}`]:t,[`k-input-${i}`]:i,"k-invalid":!M,"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",ariaExpanded:this.show,ariaControls:this._popupId,autoFocus:A,...X}),r.createElement(this.toggleButtonComp,{type:"button",icon:"calendar",svgIcon:J.calendarIcon,title:S,className:"k-input-button",rounded:null,onClick:this.mobileMode?void 0:this.handleIconClick,"aria-label":S,fillMode:i,onMouseDown:this.handleIconMouseDown}),!this.mobileMode&&this.renderPopup()),this.mobileMode&&this.renderAdaptivePopup()));return C?r.createElement(oe.PickerFloatingLabel,{dateInput:this._dateInput,label:C,editorId:d,editorValid:M,editorDisabled:a,children:P,style:{width:p},...O}):P}setShow(s){const{onOpen:t,onClose:i}=this.props;this.show!==s&&(this.setState({show:s}),s&&t&&t.call(void 0,{target:this}),!s&&i&&i.call(void 0,{target:this}))}mergeTime(s){return this.value&&s?m.setTime(s,this.value):s}nextTick(s){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>s())}calculateMedia(s){for(const t of s)this.setState({windowWidth:t.target.clientWidth})}};o.displayName="DatePicker",o.propTypes={className:e.string,defaultShow:e.bool,defaultValue:e.instanceOf(Date),disabled:e.bool,focusedDate:e.instanceOf(Date),format:e.oneOfType([e.string,e.shape({skeleton:e.string,pattern:e.string,date:e.oneOf(["short","medium","long","full"]),time:e.oneOf(["short","medium","long","full"]),datetime:e.oneOf(["short","medium","long","full"]),era:e.oneOf(["narrow","short","long"]),year:e.oneOf(["numeric","2-digit"]),month:e.oneOf(["numeric","2-digit","narrow","short","long"]),day:e.oneOf(["numeric","2-digit"]),weekday:e.oneOf(["narrow","short","long"]),hour:e.oneOf(["numeric","2-digit"]),hour12:e.bool,minute:e.oneOf(["numeric","2-digit"]),second:e.oneOf(["numeric","2-digit"]),timeZoneName:e.oneOf(["short","long"])})]),formatPlaceholder:e.oneOfType([e.oneOf(["wide","narrow","short","formatPattern"]),e.shape({year:e.string,month:e.string,day:e.string,hour:e.string,minute:e.string,second:e.string})]),id:e.string,ariaLabelledBy:e.string,ariaDescribedBy:e.string,ariaLabel:e.string,min:e.instanceOf(Date),max:e.instanceOf(Date),name:e.string,popupSettings:e.shape({animate:e.bool,appendTo:e.any,popupClass:e.string}),show:e.bool,tabIndex:e.number,title:e.string,value:e.instanceOf(Date),weekNumber:e.bool,width:e.oneOfType([e.number,e.string]),validationMessage:e.string,required:e.bool,validate:e.bool,valid:e.bool,size:e.oneOf([null,"small","medium","large"]),rounded:e.oneOf([null,"small","medium","large","full"]),fillMode:e.oneOf([null,"solid","flat","outline"]),adaptive:e.bool,adaptiveTitle:e.string,autoFocus:e.bool},o.defaultProps={defaultShow:!1,defaultValue:null,dateInput:ee.DateInput,calendar:te.Calendar,toggleButton:se.ToggleButton,popup:G.Popup,pickerWrap:ie.PickerWrap,disabled:!1,format:"d",max:m.MAX_DATE,min:m.MIN_DATE,popupSettings:{},tabIndex:0,weekNumber:!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;
|
|
@@ -9,15 +9,15 @@
|
|
|
9
9
|
import * as n from "react";
|
|
10
10
|
import e from "prop-types";
|
|
11
11
|
import { Popup as Y } from "@progress/kendo-react-popup";
|
|
12
|
-
import { getDate as Z, cloneDate as
|
|
12
|
+
import { getDate as Z, cloneDate as M } from "@progress/kendo-date-math";
|
|
13
13
|
import { classNames as k, Keys as r, validatePackage as j, canUseDOM as P, AsyncFocusBlur as G, kendoThemeMaps as T, createPropsContext as J, withIdHOC as Q, withPropsContext as ee } from "@progress/kendo-react-common";
|
|
14
14
|
import { calendarIcon as te } from "@progress/kendo-svg-icons";
|
|
15
15
|
import { packageMetadata as ie } from "../package-metadata.mjs";
|
|
16
16
|
import { DateInput as se } from "../dateinput/DateInput.mjs";
|
|
17
17
|
import { Calendar as oe } from "../calendar/components/Calendar.mjs";
|
|
18
18
|
import { MAX_DATE as ae, MIN_DATE as ne, isInDateRange as re, setTime as le } from "../utils.mjs";
|
|
19
|
-
import { toggleCalendar as x, messages as
|
|
20
|
-
import { provideLocalizationService as
|
|
19
|
+
import { toggleCalendar as x, messages as ue } from "../messages/index.mjs";
|
|
20
|
+
import { provideLocalizationService as de, registerForLocalization as he } from "@progress/kendo-react-intl";
|
|
21
21
|
import { ToggleButton as pe } from "./ToggleButton.mjs";
|
|
22
22
|
import { PickerWrap as ce } from "../common/PickerWrap.mjs";
|
|
23
23
|
import { PickerFloatingLabel as me } from "../hooks/usePickerFloatingLabel.mjs";
|
|
@@ -31,11 +31,11 @@ const o = class o extends n.Component {
|
|
|
31
31
|
}, this.setCalendarRef = (t) => {
|
|
32
32
|
this._calendar = t;
|
|
33
33
|
}, 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 = () => {
|
|
34
|
-
const { disabled: t, min: s, max: a, weekNumber: c, focusedDate: m, popupSettings: l } = this.props, { popupClass: f, ...g } = l, v = this.show,
|
|
34
|
+
const { disabled: t, min: s, max: a, weekNumber: c, focusedDate: m, popupSettings: l } = this.props, { popupClass: f, ...g } = l, v = this.show, u = this.value, w = u && Z(u), d = k(f), b = {
|
|
35
35
|
popupClass: "k-datepicker-popup",
|
|
36
36
|
show: v,
|
|
37
37
|
anchor: this._element,
|
|
38
|
-
className:
|
|
38
|
+
className: d,
|
|
39
39
|
id: this._popupId,
|
|
40
40
|
anchorAlign: {
|
|
41
41
|
horizontal: "left",
|
|
@@ -74,7 +74,7 @@ const o = class o extends n.Component {
|
|
|
74
74
|
this.handleValueChange(s, t);
|
|
75
75
|
}, this.handleValueChange = (t, s) => {
|
|
76
76
|
this.setState({
|
|
77
|
-
value:
|
|
77
|
+
value: M(t || void 0)
|
|
78
78
|
}), this.valueDuringOnChange = t, this.showDuringOnChange = !1, this.mobileMode || (this.shouldFocusDateInput = !0);
|
|
79
79
|
const { onChange: a } = this.props;
|
|
80
80
|
a && a.call(void 0, {
|
|
@@ -146,7 +146,7 @@ const o = class o extends n.Component {
|
|
|
146
146
|
*/
|
|
147
147
|
get value() {
|
|
148
148
|
const i = this.valueDuringOnChange !== void 0 ? this.valueDuringOnChange : this.props.value !== void 0 ? this.props.value : this.state.value;
|
|
149
|
-
return i !== null ?
|
|
149
|
+
return i !== null ? M(i) : null;
|
|
150
150
|
}
|
|
151
151
|
/**
|
|
152
152
|
* Gets the popup state of the DatePickerWithoutContext.
|
|
@@ -241,9 +241,9 @@ const o = class o extends n.Component {
|
|
|
241
241
|
format: f,
|
|
242
242
|
formatPlaceholder: g,
|
|
243
243
|
min: v,
|
|
244
|
-
max:
|
|
244
|
+
max: u,
|
|
245
245
|
className: w,
|
|
246
|
-
width:
|
|
246
|
+
width: d,
|
|
247
247
|
name: b,
|
|
248
248
|
validationMessage: h,
|
|
249
249
|
required: E,
|
|
@@ -258,8 +258,8 @@ const o = class o extends n.Component {
|
|
|
258
258
|
defaultShow: Ie,
|
|
259
259
|
value: De,
|
|
260
260
|
popup: Se,
|
|
261
|
-
weekNumber:
|
|
262
|
-
dateInput:
|
|
261
|
+
weekNumber: Oe,
|
|
262
|
+
dateInput: Me,
|
|
263
263
|
calendar: ke,
|
|
264
264
|
toggleButton: Pe,
|
|
265
265
|
onChange: Te,
|
|
@@ -292,7 +292,7 @@ const o = class o extends n.Component {
|
|
|
292
292
|
ariaLabelledBy: F,
|
|
293
293
|
ariaDescribedBy: V,
|
|
294
294
|
ariaLabel: z,
|
|
295
|
-
max:
|
|
295
|
+
max: u,
|
|
296
296
|
min: v,
|
|
297
297
|
name: b,
|
|
298
298
|
onChange: this.handleInputValueChange,
|
|
@@ -316,9 +316,9 @@ const o = class o extends n.Component {
|
|
|
316
316
|
autoSwitchParts: _,
|
|
317
317
|
autoSwitchKeys: K,
|
|
318
318
|
allowCaretMode: U
|
|
319
|
-
}, D =
|
|
319
|
+
}, D = de(this).toLanguageString(
|
|
320
320
|
x,
|
|
321
|
-
|
|
321
|
+
ue[x]
|
|
322
322
|
), S = /* @__PURE__ */ n.createElement(
|
|
323
323
|
G,
|
|
324
324
|
{
|
|
@@ -327,7 +327,7 @@ const o = class o extends n.Component {
|
|
|
327
327
|
onSyncBlur: this.props.onBlur,
|
|
328
328
|
onSyncFocus: this.props.onFocus
|
|
329
329
|
},
|
|
330
|
-
(
|
|
330
|
+
(O) => /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(
|
|
331
331
|
"span",
|
|
332
332
|
{
|
|
333
333
|
...y ? {} : C,
|
|
@@ -348,9 +348,9 @@ const o = class o extends n.Component {
|
|
|
348
348
|
w
|
|
349
349
|
),
|
|
350
350
|
onKeyDown: this.handleKeyDown,
|
|
351
|
-
style: { width:
|
|
352
|
-
onFocus:
|
|
353
|
-
onBlur:
|
|
351
|
+
style: { width: d },
|
|
352
|
+
onFocus: O.onFocus,
|
|
353
|
+
onBlur: O.onBlur,
|
|
354
354
|
onClick: this.mobileMode ? this.handleIconClick : void 0
|
|
355
355
|
},
|
|
356
356
|
/* @__PURE__ */ n.createElement(
|
|
@@ -358,7 +358,6 @@ const o = class o extends n.Component {
|
|
|
358
358
|
{
|
|
359
359
|
_ref: this._dateInput,
|
|
360
360
|
ariaRole: "combobox",
|
|
361
|
-
readonly: this.mobileMode,
|
|
362
361
|
ariaExpanded: this.show,
|
|
363
362
|
ariaControls: this._popupId,
|
|
364
363
|
autoFocus: R,
|
|
@@ -392,7 +391,7 @@ const o = class o extends n.Component {
|
|
|
392
391
|
editorValid: I,
|
|
393
392
|
editorDisabled: a,
|
|
394
393
|
children: S,
|
|
395
|
-
style: { width:
|
|
394
|
+
style: { width: d },
|
|
396
395
|
...C
|
|
397
396
|
}
|
|
398
397
|
) : S;
|
|
@@ -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 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,{overflowHidden:!0},i.createElement("div",{className:"k-scrollable-wrap"},this.renderCalendar())))},this.handleReverseClick=e=>{const s={start:this.value.end,end:this.value.start},r={syntheticEvent:e,nativeEvent:e.nativeEvent};this.handleChange(s,r)},this.handleReverseMouseDown=e=>{e.preventDefault()},this.handleFocus=e=>{clearTimeout(this.nextTickId),this.shouldFocusDateInput||this.mobileMode&&this.setState({currentValue:this.value});const{onFocus:s}=this.props;s&&s.call(void 0,e)},this.handleClick=()=>{this.shouldFocusDateInput||this.setShow(!0)},this.handleBlur=e=>{this.nextTick(()=>{this.setShow(!1)});const{onBlur:s}=this.props;s&&s.call(void 0,e)},this.handleCancel=e=>{this.nextTick(()=>{this.setShow(!1),this.setState({currentValue:h.EMPTY_SELECTIONRANGE})});const{onCancel:s}=this.props;s&&s.call(void 0,e)},this.handleEndChange=e=>{const s={start:this.value.start,end:D.cloneDate(e.value||void 0)};this.handleChange(s,e)},this.handleStartChange=e=>{const s={start:D.cloneDate(e.value||void 0),end:this.value.end};this.handleChange(s,e)},this.extractRangeFromValue=e=>{if(!Array.isArray(e.value)&&!(e.value instanceof Date))return e.value||h.EMPTY_SELECTIONRANGE;const s=Array.isArray(e.value)?e.value[0]:e.value;return{start:this.value.end!==null?s:this.value.start,end:this.value.start!==null?s:this.value.end}},this.handleCalendarChange=e=>{const s=this.extractRangeFromValue(e);this.handleChange(s,e)},this.handleKeyDown=e=>{const{keyCode:s,altKey:r}=e;s===o.Keys.esc?(e.preventDefault(),this.shouldFocusDateInput=!0,this.setShow(!1)):r&&s===o.Keys.down?(e.preventDefault(),this.shouldFocusCalendar=!0,this.setShow(!0),this.focusCalendarElement()):r&&s===o.Keys.up&&(e.preventDefault(),this.shouldFocusDateInput=!0,this.setShow(!1))},this.handleChange=(e,s)=>{this.setState({value:e}),this.valueDuringOnChange=e;const{onChange:r}=this.props;if(r){const m={syntheticEvent:s.syntheticEvent,nativeEvent:s.nativeEvent,value:this.value,show:this.show,target:this};r.call(void 0,m)}this.valueDuringOnChange=void 0},o.validatePackage(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),w=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:w,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,autoFocus:this.props.autoFocus,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)}),autoFocus:t.bool},l.defaultProps={allowReverse:!1,defaultShow:!1,defaultValue:h.EMPTY_SELECTIONRANGE,disabled:!1,format:"d",max:u.MAX_DATE,min:u.MIN_DATE,swapButton:!1,autoFocus:!1};let p=l;const I=o.createPropsContext(),b=o.withIdHOC(o.withPropsContext(I,p));b.displayName="KendoReactDateRangePicker";c.registerForLocalization(p);exports.DateRangePicker=b;exports.DateRangePickerPropsContext=I;exports.DateRangePickerWithoutContext=p;
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("react"),t=require("prop-types"),O=require("@progress/kendo-react-popup"),D=require("@progress/kendo-date-math"),o=require("@progress/kendo-react-common"),c=require("@progress/kendo-react-intl"),k=require("@progress/kendo-svg-icons"),M=require("../package-metadata.js"),g=require("../dateinput/DateInput.js"),T=require("../calendar/components/MultiViewCalendar.js"),h=require("../calendar/models/SelectionRange.js"),u=require("../utils.js"),x=require("../common/constants.js"),n=require("../messages/index.js"),P=require("@progress/kendo-react-buttons"),_=require("../common/AdaptiveMode.js"),N=require("@progress/kendo-react-layout");function A(d){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(d){for(const e in d)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(d,e);Object.defineProperty(a,e,s.get?s:{enumerable:!0,get:()=>d[e]})}}return a.default=d,Object.freeze(a)}const i=A(y),l=class l extends i.Component{constructor(a){super(a),this._element=null,this._calendar=null,this._startDateInput=i.createRef(),this._endDateInput=i.createRef(),this.shouldFocusDateInput=!1,this.shouldFocusCalendar=!1,this.focus=()=>{this.startDateInput&&this.startDateInput.focus()},this.setCalendarRef=e=>{this._calendar=e},this.focusCalendarElement=()=>{this._calendar&&this._calendar.element&&this._calendar.element.focus({preventScroll:!0})},this.calculateValue=(e,s)=>(e.value!==void 0?e.value:s.value)||h.EMPTY_SELECTIONRANGE,this.calculateShow=(e,s)=>e.show!==void 0?e.show:s.show,this.renderCalendar=()=>{const e=this.value||h.EMPTY_SELECTIONRANGE,s={min:this.min,max:this.max,allowReverse:this.props.allowReverse,mode:"range",focusedDate:this.props.focusedDate,disabled:this.props.disabled,className:this.mobileMode?"k-calendar-lg":"",mobileMode:this.mobileMode,...this.props.calendarSettings,value:e,dir:this.props.dir,onChange:this.handleCalendarChange};return this.props.calendar?i.createElement(this.props.calendar,{...s}):i.createElement(T.MultiViewCalendar,{...s,ref:this.setCalendarRef})},this.renderPopup=()=>{const e={popupClass:o.classNames("k-calendar-container","k-daterangepicker-popup"),animate:this._element!==null,anchor:this._element,id:this._popupId,anchorAlign:{horizontal:"left",vertical:"bottom"},popupAlign:{horizontal:"left",vertical:"top"},...this.props.popupSettings,show:this.show};return this.props.popup?i.createElement(this.props.popup,{...e},this.renderCalendar()):i.createElement(O.Popup,{...e},this.renderCalendar())},this.renderAdaptivePopup=()=>{const{windowWidth:e=0}=this.state,s={expand:this.show,onClose:r=>this.handleCancel(r),adaptiveTitle:this.props.adaptiveTitle,windowWidth:e,footer:{cancelText:this.localizationService.toLanguageString(n.dateRangePickerCancel,n.messages[n.dateRangePickerCancel]),onCancel:this.handleCancel,applyText:this.localizationService.toLanguageString(n.dateRangePickerSet,n.messages[n.dateRangePickerSet]),onApply:this.handleBlur}};return i.createElement(_.AdaptiveMode,{...s},i.createElement(N.ActionSheetContent,{overflowHidden:!0},i.createElement("div",{className:"k-scrollable-wrap"},this.renderCalendar())))},this.handleReverseClick=e=>{const s={start:this.value.end,end:this.value.start},r={syntheticEvent:e,nativeEvent:e.nativeEvent};this.handleChange(s,r)},this.handleReverseMouseDown=e=>{e.preventDefault()},this.handleFocus=e=>{clearTimeout(this.nextTickId),this.shouldFocusDateInput||this.mobileMode&&this.setState({currentValue:this.value});const{onFocus:s}=this.props;s&&s.call(void 0,e)},this.handleClick=()=>{this.shouldFocusDateInput||this.setShow(!0)},this.handleBlur=e=>{this.nextTick(()=>{this.setShow(!1)});const{onBlur:s}=this.props;s&&s.call(void 0,e)},this.handleCancel=e=>{this.nextTick(()=>{this.setShow(!1),this.setState({currentValue:h.EMPTY_SELECTIONRANGE})});const{onCancel:s}=this.props;s&&s.call(void 0,e)},this.handleEndChange=e=>{const s={start:this.value.start,end:D.cloneDate(e.value||void 0)};this.handleChange(s,e)},this.handleStartChange=e=>{const s={start:D.cloneDate(e.value||void 0),end:this.value.end};this.handleChange(s,e)},this.extractRangeFromValue=e=>{if(!Array.isArray(e.value)&&!(e.value instanceof Date))return e.value||h.EMPTY_SELECTIONRANGE;const s=Array.isArray(e.value)?e.value[0]:e.value;return{start:this.value.end!==null?s:this.value.start,end:this.value.start!==null?s:this.value.end}},this.handleCalendarChange=e=>{const s=this.extractRangeFromValue(e);this.handleChange(s,e)},this.handleKeyDown=e=>{const{keyCode:s,altKey:r}=e;s===o.Keys.esc?(e.preventDefault(),this.shouldFocusDateInput=!0,this.setShow(!1)):r&&s===o.Keys.down?(e.preventDefault(),this.shouldFocusCalendar=!0,this.setShow(!0),this.focusCalendarElement()):r&&s===o.Keys.up&&(e.preventDefault(),this.shouldFocusDateInput=!0,this.setShow(!1))},this.handleChange=(e,s)=>{this.setState({value:e}),this.valueDuringOnChange=e;const{onChange:r}=this.props;if(r){const m={syntheticEvent:s.syntheticEvent,nativeEvent:s.nativeEvent,value:this.value,show:this.show,target:this};r.call(void 0,m)}this.valueDuringOnChange=void 0},o.validatePackage(M.packageMetadata),this.state={show:this.props.show||this.props.defaultShow||l.defaultProps.defaultShow,value:this.props.value||this.props.defaultValue||l.defaultProps.defaultValue,currentValue:h.EMPTY_SELECTIONRANGE},this.nextTick=this.nextTick.bind(this),this.setShow=this.setShow.bind(this),this.focusCalendarElement=this.focusCalendarElement.bind(this),this.focusDateInputElement=this.focusDateInputElement.bind(this)}get _popupId(){return this.props.id+"-popup-id"}get _startInputId(){return this.props.id+"-start-input-id"}get _endInputId(){return this.props.id+"-end-input-id"}get element(){return this._element}get startDateInput(){return this._startDateInput.current}get endDateInput(){return this._endDateInput.current}get calendar(){return this._calendar}get value(){return(this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value)||h.EMPTY_SELECTIONRANGE}get show(){return this.showDuringOnChange!==void 0?this.showDuringOnChange:this.props.show!==void 0?this.props.show:this.state.show}get min(){return this.props.min!==void 0?this.props.min:l.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:l.defaultProps.max}get document(){if(o.canUseDOM)return this.element&&this.element.ownerDocument||document}get localizationService(){return c.provideLocalizationService(this)}get mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=x.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}componentDidMount(){var a;this.observerResize=o.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.show&&this.forceUpdate(),(a=this.document)!=null&&a.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentDidUpdate(){this.shouldFocusCalendar&&this.focusCalendarElement(),this.shouldFocusDateInput&&this.focusDateInputElement(),this.shouldFocusCalendar=!1,this.shouldFocusDateInput=!1}componentWillUnmount(){var a;clearTimeout(this.nextTickId),(a=this.document)!=null&&a.body&&this.observerResize&&this.observerResize.disconnect()}render(){const a=this.value||h.EMPTY_SELECTIONRANGE,e=this.mobileMode&&this.show?this.state.currentValue:a,s=(this.props.startDateInputSettings||{}).id||this._startInputId,r=(this.props.endDateInputSettings||{}).id||this._endInputId,m=o.classNames("k-daterangepicker",{"k-disabled":this.props.disabled},this.props.className),b=this.localizationService.toLanguageString(n.start,n.messages[n.start]),E=this.localizationService.toLanguageString(n.end,n.messages[n.end]),S=this.localizationService.toLanguageString(n.separator,n.messages[n.separator]),f={disableSelection:this.mobileMode&&!0,label:b,format:this.props.format,min:this.min,max:this.max,id:this._startInputId,disabled:this.props.disabled,valid:this.props.valid,tabIndex:this.props.tabIndex,ariaExpanded:this.show,clearButton:this.props.clearButton,...this.props.startDateInputSettings,value:e.start,onChange:this.handleStartChange},v={disableSelection:this.mobileMode&&!0,label:E,format:this.props.format,min:this.min,max:this.max,id:this._endInputId,disabled:this.props.disabled,valid:this.props.valid,tabIndex:this.props.tabIndex,ariaExpanded:this.show,clearButton:this.props.clearButton,...this.props.endDateInputSettings,value:e.end,onChange:this.handleEndChange},C=i.createElement(P.Button,{type:"button",className:"k-select",fillMode:"flat",title:c.provideLocalizationService(this).toLanguageString(n.swapStartEnd,n.messages[n.swapStartEnd]),onMouseDown:this.handleReverseMouseDown,onClick:this.handleReverseClick,"aria-controls":s+" "+r,"aria-label":c.provideLocalizationService(this).toLanguageString(n.swapStartEnd,n.messages[n.swapStartEnd])},i.createElement(o.IconWrap,{style:{transform:"rotate(90deg)"},name:"arrows-swap",icon:k.arrowsSwapIcon}));return i.createElement(i.Fragment,null,i.createElement("span",{ref:R=>{this._element=R},className:m,style:this.props.style,id:this.props.id,"aria-labelledby":this.props.ariaLabelledBy,"aria-describedby":this.props.ariaDescribedBy,tabIndex:this.props.tabIndex,onFocus:this.handleFocus,onClick:this.handleClick,onKeyDown:this.handleKeyDown,onBlur:this.mobileMode?void 0:this.handleBlur,dir:this.props.dir},this.props.startDateInput?i.createElement(this.props.startDateInput,{...f}):i.createElement(g.DateInput,{...f,autoFocus:this.props.autoFocus,ref:this._startDateInput,ariaRole:"combobox",ariaControls:this._popupId}),(this.props.allowReverse||this.props.calendarSettings&&this.props.calendarSettings.allowReverse)&&this.props.swapButton?C:S,this.props.endDateInput?i.createElement(this.props.endDateInput,{...v}):i.createElement(g.DateInput,{...v,ref:this._endDateInput,ariaRole:"combobox",ariaControls:this._popupId}),!this.mobileMode&&this.renderPopup()),this.mobileMode&&this.renderAdaptivePopup())}focusDateInputElement(){if(!document||!this.startDateInput||!this.startDateInput.element||!this.endDateInput||!this.endDateInput.element)return;const a=o.getActiveElement(document);(this.value.start===null||this.value.end!==null)&&a!==this.endDateInput.element?this.startDateInput.element.focus({preventScroll:!0}):a!==this.startDateInput.element&&this.endDateInput.element.focus({preventScroll:!0})}nextTick(a){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>a())}setShow(a){const{onOpen:e,onClose:s}=this.props;this.show!==a&&(this.setState({show:a}),a&&e&&e.call(void 0,{target:this}),!a&&s&&s.call(void 0,{target:this}))}calculateMedia(a){for(const e of a)this.setState({windowWidth:e.target.clientWidth})}};l.displayName="DateRangePicker",l.propTypes={allowReverse:t.bool,calendarSettings:t.any,className:t.string,defaultShow:t.bool,defaultValue:t.shape({start:u.nullable(t.instanceOf(Date).isRequired),end:u.nullable(t.instanceOf(Date).isRequired)}),disabled:t.bool,endDateInputSettings:t.shape(g.DateInputWithoutContext.propTypes),focusedDate:t.instanceOf(Date),format:t.oneOfType([t.string,t.shape({skeleton:t.string,pattern:t.string,date:t.oneOf(["short","medium","long","full"]),time:t.oneOf(["short","medium","long","full"]),datetime:t.oneOf(["short","medium","long","full"]),era:t.oneOf(["narrow","short","long"]),year:t.oneOf(["numeric","2-digit"]),month:t.oneOf(["numeric","2-digit","narrow","short","long"]),day:t.oneOf(["numeric","2-digit"]),weekday:t.oneOf(["narrow","short","long"]),hour:t.oneOf(["numeric","2-digit"]),hour12:t.bool,minute:t.oneOf(["numeric","2-digit"]),second:t.oneOf(["numeric","2-digit"]),timeZoneName:t.oneOf(["short","long"])})]),id:t.string,ariaLabelledBy:t.string,ariaDescribedBy:t.string,max:t.instanceOf(Date),min:t.instanceOf(Date),onBlur:t.func,onChange:t.func,onFocus:t.func,popupSettings:t.any,show:t.bool,startDateInputSettings:t.any,style:t.any,swapButton:t.any,tabIndex:t.number,dir:t.string,value:t.shape({start:u.nullable(t.instanceOf(Date).isRequired),end:u.nullable(t.instanceOf(Date).isRequired)}),autoFocus:t.bool},l.defaultProps={allowReverse:!1,defaultShow:!1,defaultValue:h.EMPTY_SELECTIONRANGE,disabled:!1,format:"d",max:u.MAX_DATE,min:u.MIN_DATE,swapButton:!1,autoFocus:!1};let p=l;const I=o.createPropsContext(),w=o.withIdHOC(o.withPropsContext(I,p));w.displayName="KendoReactDateRangePicker";c.registerForLocalization(p);exports.DateRangePicker=w;exports.DateRangePickerPropsContext=I;exports.DateRangePickerWithoutContext=p;
|
|
@@ -251,7 +251,7 @@ const o = class o extends i.Component {
|
|
|
251
251
|
"k-disabled": this.props.disabled
|
|
252
252
|
},
|
|
253
253
|
this.props.className
|
|
254
|
-
), x = this.localizationService.toLanguageString(S, l[S]), R = this.localizationService.toLanguageString(E, l[E]),
|
|
254
|
+
), x = this.localizationService.toLanguageString(S, l[S]), R = this.localizationService.toLanguageString(E, l[E]), O = this.localizationService.toLanguageString(y, l[y]), f = {
|
|
255
255
|
disableSelection: this.mobileMode && !0,
|
|
256
256
|
label: x,
|
|
257
257
|
format: this.props.format,
|
|
@@ -281,7 +281,7 @@ const o = class o extends i.Component {
|
|
|
281
281
|
...this.props.endDateInputSettings,
|
|
282
282
|
value: t.end,
|
|
283
283
|
onChange: this.handleEndChange
|
|
284
|
-
},
|
|
284
|
+
}, k = /* @__PURE__ */ i.createElement(
|
|
285
285
|
G,
|
|
286
286
|
{
|
|
287
287
|
type: "button",
|
|
@@ -301,8 +301,8 @@ const o = class o extends i.Component {
|
|
|
301
301
|
return /* @__PURE__ */ i.createElement(i.Fragment, null, /* @__PURE__ */ i.createElement(
|
|
302
302
|
"span",
|
|
303
303
|
{
|
|
304
|
-
ref: (
|
|
305
|
-
this._element =
|
|
304
|
+
ref: (M) => {
|
|
305
|
+
this._element = M;
|
|
306
306
|
},
|
|
307
307
|
className: p,
|
|
308
308
|
style: this.props.style,
|
|
@@ -323,19 +323,17 @@ const o = class o extends i.Component {
|
|
|
323
323
|
autoFocus: this.props.autoFocus,
|
|
324
324
|
ref: this._startDateInput,
|
|
325
325
|
ariaRole: "combobox",
|
|
326
|
-
ariaControls: this._popupId
|
|
327
|
-
readonly: this.mobileMode
|
|
326
|
+
ariaControls: this._popupId
|
|
328
327
|
}
|
|
329
328
|
),
|
|
330
|
-
(this.props.allowReverse || this.props.calendarSettings && this.props.calendarSettings.allowReverse) && this.props.swapButton ?
|
|
329
|
+
(this.props.allowReverse || this.props.calendarSettings && this.props.calendarSettings.allowReverse) && this.props.swapButton ? k : O,
|
|
331
330
|
this.props.endDateInput ? /* @__PURE__ */ i.createElement(this.props.endDateInput, { ...g }) : /* @__PURE__ */ i.createElement(
|
|
332
331
|
w,
|
|
333
332
|
{
|
|
334
333
|
...g,
|
|
335
334
|
ref: this._endDateInput,
|
|
336
335
|
ariaRole: "combobox",
|
|
337
|
-
ariaControls: this._popupId
|
|
338
|
-
readonly: this.mobileMode
|
|
336
|
+
ariaControls: this._popupId
|
|
339
337
|
}
|
|
340
338
|
),
|
|
341
339
|
!this.mobileMode && this.renderPopup()
|
|
@@ -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"),G=require("@progress/kendo-react-popup"),T=require("@progress/kendo-date-math"),o=require("@progress/kendo-react-common"),J=require("@progress/kendo-svg-icons"),Q=require("../dateinput/DateInput.js"),ee=require("@progress/kendo-react-buttons"),te=require("../package-metadata.js"),p=require("../utils.js"),ie=require("../common/constants.js"),l=require("../messages/index.js"),m=require("@progress/kendo-react-intl"),se=require("./DateTimeSelector.js"),oe=require("../timepicker/utils.js"),ae=require("../hooks/usePickerFloatingLabel.js"),ne=require("../common/AdaptiveMode.js"),re=require("@progress/kendo-react-layout");function le(c){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const i in c)if(i!=="default"){const s=Object.getOwnPropertyDescriptor(c,i);Object.defineProperty(t,i,s.get?s:{enumerable:!0,get:()=>c[i]})}}return t.default=c,Object.freeze(t)}const r=le($),a=class a extends r.Component{constructor(t){super(t),this._element=null,this._dateInput=r.createRef(),this._dateTimeSelector=null,this.shouldFocusDateInput=!1,this.prevShow=!1,this.focus=()=>{const i=this.dateInputElement();i&&i.focus()},this.renderPicker=()=>{const{disabled:i,minTime:s,maxTime:n,format:h,calendar:d,cancelButton:u,weekNumber:f,focusedDate:v,unstyled:w}=this.props;return r.createElement(se.DateTimeSelector,{ref:b=>{this._dateTimeSelector=b},cancelButton:u,steps:this.props.steps,value:this.value,onChange:this.handleValueChange,onReject:this.handleReject,disabled:i,weekNumber:f,min:this.min,max:this.max,minTime:s,maxTime:n,focusedDate:v,format:h,calendar:d,mobileMode:this.mobileMode,footerActions:!this.mobileMode,unstyled:w})},this.renderAdaptivePopup=()=>{const{windowWidth:i=0}=this.state,s=m.provideLocalizationService(this).toLanguageString(l.dateTimePickerCancel,l.messages[l.dateTimePickerCancel]),n=m.provideLocalizationService(this).toLanguageString(l.dateTimePickerSet,l.messages[l.dateTimePickerSet]),h={expand:this.show,onClose:this.handleBlur,adaptiveTitle:this.props.adaptiveTitle,windowWidth:i,footer:{cancelText:s,onCancel:d=>{var u;return(u=this._dateTimeSelector)==null?void 0:u.handleReject(d)},applyText:n,onApply:d=>{var u;return(u=this._dateTimeSelector)==null?void 0:u.handleAccept(d)}}};return r.createElement(ne.AdaptiveMode,{...h},r.createElement(re.ActionSheetContent,{overflowHidden:!0},this.renderPicker()))},this.handleReject=()=>{this.shouldFocusDateInput=!0,this.setShow(!1)},this.handleValueChange=i=>{this.setState({value:T.cloneDate(i.value||void 0)}),this.valueDuringOnChange=i.value,this.showDuringOnChange=!1,this.mobileMode||(this.shouldFocusDateInput=!0);const{onChange:s}=this.props;s&&s.call(void 0,{syntheticEvent:i.syntheticEvent,nativeEvent:i.nativeEvent,value:this.value,show:this.show,target:this}),this.valueDuringOnChange=void 0,this.showDuringOnChange=void 0,this.setShow(!1)},this.handleFocus=()=>{this.setState({focused:!0})},this.handleBlur=()=>{this.setState({focused:!1}),this.setShow(!1)},this.handleDateIconClick=()=>{this.props.disabled||(this.shouldFocusDateInput=!0,this.setShow(!this.show))},this.handleIconMouseDown=i=>{i.preventDefault()},this.handleKeyDown=i=>{const{altKey:s,keyCode:n}=i;if(n===o.Keys.esc){this.shouldFocusDateInput=!0,this.setShow(!1);return}s&&(n===o.Keys.up||n===o.Keys.down)&&(i.preventDefault(),i.stopPropagation(),this.shouldFocusDateInput=n===o.Keys.up,this.setShow(n===o.Keys.down))},this.dateInputElement=()=>this.dateInput&&this.dateInput.element||this.element&&this.element.querySelector(".k-dateinput > input.k-input-inner"),o.validatePackage(te.packageMetadata),this.state={value:this.props.defaultValue||a.defaultProps.defaultValue,show:this.props.defaultShow||a.defaultProps.defaultShow,focused:!1}}get _popupId(){return this.props.id+"-popup-id"}get document(){if(o.canUseDOM)return this.element&&this.element.ownerDocument||document}get element(){return this._element}get dateInput(){return this._dateInput.current}get value(){const t=this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value;return t!==null?T.cloneDate(t):null}get show(){return this.showDuringOnChange!==void 0?this.showDuringOnChange:this.props.show!==void 0?this.props.show:this.state.show}get name(){return this.props.name}get mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=ie.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}get min(){return this.props.min!==void 0?this.props.min:a.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:a.defaultProps.max}get validity(){const t=p.isInDateRange(this.value,this.min,this.max)&&oe.isInTimeRange(this.value,this.props.minTime||p.MIN_TIME,this.props.maxTime||p.MAX_TIME),i=this.props.validationMessage!==void 0,s=(!this.required||this.value!==null)&&t,n=this.props.valid!==void 0?this.props.valid:s;return{customError:i,rangeOverflow:this.value&&this.max.getTime()<this.value.getTime()||!1,rangeUnderflow:this.value&&this.value.getTime()<this.min.getTime()||!1,valid:n,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:a.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:!1}get dateInputComp(){return this.props.dateInput||a.defaultProps.dateInput}componentDidMount(){var t;this.observerResize=o.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.show&&this.forceUpdate(),(t=this.document)!=null&&t.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentDidUpdate(){const t=this.dateInputElement();this._dateTimeSelector&&this.show&&!this.prevShow&&this._dateTimeSelector.focus({preventScroll:!0}),t&&!this.show&&this.shouldFocusDateInput&&t.focus({preventScroll:!0}),this.prevShow=this.show,this.shouldFocusDateInput=!1}componentWillUnmount(){var t;clearTimeout(this.nextTickId),(t=this.document)!=null&&t.body&&this.observerResize&&this.observerResize.disconnect()}render(){const{size:t=a.defaultProps.size,rounded:i=a.defaultProps.rounded,fillMode:s=a.defaultProps.fillMode,autoFocus:n=a.defaultProps.autoFocus,disabled:h,tabIndex:d,title:u,id:f,format:v,formatPlaceholder:w,min:b,max:O,className:k,width:C,name:x,validationMessage:E,required:q,validityStyles:F,minTime:R,maxTime:z,ariaLabelledBy:B,ariaDescribedBy:A,popup:N=G.Popup,unstyled:y,autoFill:L,twoDigitYearMax:_,enableMouseWheel:K,autoCorrectParts:V,autoSwitchParts:j,autoSwitchKeys:U,allowCaretMode:H}=this.props,D=y&&y.uDateTimePicker,S=!this.validityStyles||this.validity.valid,W={id:f,ariaLabelledBy:B,ariaDescribedBy:A,format:v,formatPlaceholder:w,disabled:h,title:u,validityStyles:F,validationMessage:E,required:q,min:b,max:O,minTime:R,maxTime:z,name:x,tabIndex:this.show?-1:d,valid:this.validity.valid,value:this.value,onChange:this.handleValueChange,steps:this.props.steps,label:void 0,placeholder:this.state.focused?null:this.props.placeholder,ariaExpanded:this.show,size:null,fillMode:null,rounded:null,unstyled:y,autoFill:L,twoDigitYearMax:_,enableMouseWheel:K,autoCorrectParts:V,autoSwitchParts:j,autoSwitchKeys:U,allowCaretMode:H},I=r.createElement(o.AsyncFocusBlur,{onFocus:this.handleFocus,onBlur:this.handleBlur,onSyncFocus:this.props.onFocus,onSyncBlur:this.props.onBlur},({onFocus:X,onBlur:Y})=>r.createElement(r.Fragment,null,r.createElement("div",{ref:Z=>{this._element=Z},className:o.classNames(o.uDateTimePicker.wrapper({c:D,size:t,fillMode:s,rounded:i,disabled:h,required:this.required,invalid:!S}),k),onKeyDown:this.handleKeyDown,style:{width:C},onFocus:this.mobileMode?void 0:X,onBlur:Y,onClick:this.mobileMode?this.handleDateIconClick:void 0},r.createElement(this.dateInputComp,{_ref:this._dateInput,ariaRole:"combobox",ariaControls:this._popupId,ariaHasPopup:"dialog",readonly:this.mobileMode,autoFocus:n,...W}),r.createElement(ee.Button,{tabIndex:-1,type:"button",icon:"calendar",svgIcon:J.calendarIcon,onMouseDown:this.handleIconMouseDown,onClick:this.mobileMode?void 0:this.handleDateIconClick,title:m.provideLocalizationService(this).toLanguageString(l.toggleDateTimeSelector,l.messages[l.toggleDateTimeSelector]),className:o.classNames(o.uDateTimePicker.inputButton({c:D})),rounded:null,fillMode:s,"aria-label":m.provideLocalizationService(this).toLanguageString(l.toggleDateTimeSelector,l.messages[l.toggleDateTimeSelector])}),r.createElement(N,{show:this.show,animate:this.element!==null,anchor:this.element,popupClass:o.classNames(o.uDateTimePicker.popup({c:D})),id:this._popupId,anchorAlign:{horizontal:"left",vertical:"bottom"},popupAlign:{horizontal:"left",vertical:"top"}},!this.mobileMode&&this.renderPicker())),this.mobileMode&&this.renderAdaptivePopup()));return this.props.label?r.createElement(ae.PickerFloatingLabel,{dateInput:this._dateInput,label:this.props.label,editorId:f,editorValid:S,editorDisabled:this.props.disabled,children:I,style:{width:this.props.width}}):I}setShow(t){const{onOpen:i,onClose:s}=this.props;this.show!==t&&(this.setState({show:t}),t&&i&&i.call(void 0,{target:this}),!t&&s&&s.call(void 0,{target:this}))}nextTick(t){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>t())}calculateMedia(t){for(const i of t)this.setState({windowWidth:i.target.clientWidth})}};a.displayName="DateTimePicker",a.propTypes={className:e.string,defaultShow:e.bool,defaultValue:e.instanceOf(Date),disabled:e.bool,focusedDate:e.instanceOf(Date),format:e.oneOfType([e.string,e.shape({skeleton:e.string,pattern:e.string,date:e.oneOf(["short","medium","long","full"]),time:e.oneOf(["short","medium","long","full"]),datetime:e.oneOf(["short","medium","long","full"]),era:e.oneOf(["narrow","short","long"]),year:e.oneOf(["numeric","2-digit"]),month:e.oneOf(["numeric","2-digit","narrow","short","long"]),day:e.oneOf(["numeric","2-digit"]),weekday:e.oneOf(["narrow","short","long"]),hour:e.oneOf(["numeric","2-digit"]),hour12:e.bool,minute:e.oneOf(["numeric","2-digit"]),second:e.oneOf(["numeric","2-digit"]),timeZoneName:e.oneOf(["short","long"])})]),formatPlaceholder:e.oneOfType([e.oneOf(["wide","narrow","short","formatPattern"]),e.shape({year:e.string,month:e.string,day:e.string,hour:e.string,minute:e.string,second:e.string})]),id:e.string,ariaLabelledBy:e.string,ariaDescribedBy:e.string,min:e.instanceOf(Date),max:e.instanceOf(Date),name:e.string,popupSettings:e.shape({animate:e.bool,appendTo:e.any,popupClass:e.string}),show:e.bool,tabIndex:e.number,title:e.string,value:e.instanceOf(Date),weekNumber:e.bool,width:e.oneOfType([e.number,e.string]),validationMessage:e.string,required:e.bool,validate:e.bool,valid:e.bool,cancelButton:e.bool,size:e.oneOf([null,"small","medium","large"]),rounded:e.oneOf([null,"small","medium","large","full"]),fillMode:e.oneOf([null,"solid","flat","outline"]),autoFocus:e.bool},a.defaultProps={defaultShow:!1,defaultValue:null,disabled:!1,format:"g",max:p.MAX_DATE,min:p.MIN_DATE,popupSettings:{},tabIndex:0,weekNumber:!1,validityStyles:!0,cancelButton:!0,dateInput:Q.DateInput,size:"medium",rounded:"medium",fillMode:"solid",autoFocus:!1};let g=a;const P=o.createPropsContext(),M=o.withIdHOC(o.withPropsContext(P,o.withUnstyledHOC(g)));M.displayName="KendoReactDateTimePicker";m.registerForLocalization(g);exports.DateTimePicker=M;exports.DateTimePickerPropsContext=P;exports.DateTimePickerWithoutContext=g;
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const $=require("react"),e=require("prop-types"),G=require("@progress/kendo-react-popup"),T=require("@progress/kendo-date-math"),o=require("@progress/kendo-react-common"),J=require("@progress/kendo-svg-icons"),Q=require("../dateinput/DateInput.js"),ee=require("@progress/kendo-react-buttons"),te=require("../package-metadata.js"),p=require("../utils.js"),ie=require("../common/constants.js"),l=require("../messages/index.js"),m=require("@progress/kendo-react-intl"),se=require("./DateTimeSelector.js"),oe=require("../timepicker/utils.js"),ae=require("../hooks/usePickerFloatingLabel.js"),ne=require("../common/AdaptiveMode.js"),re=require("@progress/kendo-react-layout");function le(c){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const i in c)if(i!=="default"){const s=Object.getOwnPropertyDescriptor(c,i);Object.defineProperty(t,i,s.get?s:{enumerable:!0,get:()=>c[i]})}}return t.default=c,Object.freeze(t)}const r=le($),a=class a extends r.Component{constructor(t){super(t),this._element=null,this._dateInput=r.createRef(),this._dateTimeSelector=null,this.shouldFocusDateInput=!1,this.prevShow=!1,this.focus=()=>{const i=this.dateInputElement();i&&i.focus()},this.renderPicker=()=>{const{disabled:i,minTime:s,maxTime:n,format:h,calendar:d,cancelButton:u,weekNumber:f,focusedDate:v,unstyled:w}=this.props;return r.createElement(se.DateTimeSelector,{ref:b=>{this._dateTimeSelector=b},cancelButton:u,steps:this.props.steps,value:this.value,onChange:this.handleValueChange,onReject:this.handleReject,disabled:i,weekNumber:f,min:this.min,max:this.max,minTime:s,maxTime:n,focusedDate:v,format:h,calendar:d,mobileMode:this.mobileMode,footerActions:!this.mobileMode,unstyled:w})},this.renderAdaptivePopup=()=>{const{windowWidth:i=0}=this.state,s=m.provideLocalizationService(this).toLanguageString(l.dateTimePickerCancel,l.messages[l.dateTimePickerCancel]),n=m.provideLocalizationService(this).toLanguageString(l.dateTimePickerSet,l.messages[l.dateTimePickerSet]),h={expand:this.show,onClose:this.handleBlur,adaptiveTitle:this.props.adaptiveTitle,windowWidth:i,footer:{cancelText:s,onCancel:d=>{var u;return(u=this._dateTimeSelector)==null?void 0:u.handleReject(d)},applyText:n,onApply:d=>{var u;return(u=this._dateTimeSelector)==null?void 0:u.handleAccept(d)}}};return r.createElement(ne.AdaptiveMode,{...h},r.createElement(re.ActionSheetContent,{overflowHidden:!0},this.renderPicker()))},this.handleReject=()=>{this.shouldFocusDateInput=!0,this.setShow(!1)},this.handleValueChange=i=>{this.setState({value:T.cloneDate(i.value||void 0)}),this.valueDuringOnChange=i.value,this.showDuringOnChange=!1,this.mobileMode||(this.shouldFocusDateInput=!0);const{onChange:s}=this.props;s&&s.call(void 0,{syntheticEvent:i.syntheticEvent,nativeEvent:i.nativeEvent,value:this.value,show:this.show,target:this}),this.valueDuringOnChange=void 0,this.showDuringOnChange=void 0,this.setShow(!1)},this.handleFocus=()=>{this.setState({focused:!0})},this.handleBlur=()=>{this.setState({focused:!1}),this.setShow(!1)},this.handleDateIconClick=()=>{this.props.disabled||(this.shouldFocusDateInput=!0,this.setShow(!this.show))},this.handleIconMouseDown=i=>{i.preventDefault()},this.handleKeyDown=i=>{const{altKey:s,keyCode:n}=i;if(n===o.Keys.esc){this.shouldFocusDateInput=!0,this.setShow(!1);return}s&&(n===o.Keys.up||n===o.Keys.down)&&(i.preventDefault(),i.stopPropagation(),this.shouldFocusDateInput=n===o.Keys.up,this.setShow(n===o.Keys.down))},this.dateInputElement=()=>this.dateInput&&this.dateInput.element||this.element&&this.element.querySelector(".k-dateinput > input.k-input-inner"),o.validatePackage(te.packageMetadata),this.state={value:this.props.defaultValue||a.defaultProps.defaultValue,show:this.props.defaultShow||a.defaultProps.defaultShow,focused:!1}}get _popupId(){return this.props.id+"-popup-id"}get document(){if(o.canUseDOM)return this.element&&this.element.ownerDocument||document}get element(){return this._element}get dateInput(){return this._dateInput.current}get value(){const t=this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value;return t!==null?T.cloneDate(t):null}get show(){return this.showDuringOnChange!==void 0?this.showDuringOnChange:this.props.show!==void 0?this.props.show:this.state.show}get name(){return this.props.name}get mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=ie.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}get min(){return this.props.min!==void 0?this.props.min:a.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:a.defaultProps.max}get validity(){const t=p.isInDateRange(this.value,this.min,this.max)&&oe.isInTimeRange(this.value,this.props.minTime||p.MIN_TIME,this.props.maxTime||p.MAX_TIME),i=this.props.validationMessage!==void 0,s=(!this.required||this.value!==null)&&t,n=this.props.valid!==void 0?this.props.valid:s;return{customError:i,rangeOverflow:this.value&&this.max.getTime()<this.value.getTime()||!1,rangeUnderflow:this.value&&this.value.getTime()<this.min.getTime()||!1,valid:n,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:a.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:!1}get dateInputComp(){return this.props.dateInput||a.defaultProps.dateInput}componentDidMount(){var t;this.observerResize=o.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.show&&this.forceUpdate(),(t=this.document)!=null&&t.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentDidUpdate(){const t=this.dateInputElement();this._dateTimeSelector&&this.show&&!this.prevShow&&this._dateTimeSelector.focus({preventScroll:!0}),t&&!this.show&&this.shouldFocusDateInput&&t.focus({preventScroll:!0}),this.prevShow=this.show,this.shouldFocusDateInput=!1}componentWillUnmount(){var t;clearTimeout(this.nextTickId),(t=this.document)!=null&&t.body&&this.observerResize&&this.observerResize.disconnect()}render(){const{size:t=a.defaultProps.size,rounded:i=a.defaultProps.rounded,fillMode:s=a.defaultProps.fillMode,autoFocus:n=a.defaultProps.autoFocus,disabled:h,tabIndex:d,title:u,id:f,format:v,formatPlaceholder:w,min:b,max:M,className:k,width:C,name:x,validationMessage:E,required:q,validityStyles:F,minTime:R,maxTime:z,ariaLabelledBy:B,ariaDescribedBy:A,popup:N=G.Popup,unstyled:y,autoFill:L,twoDigitYearMax:_,enableMouseWheel:K,autoCorrectParts:V,autoSwitchParts:j,autoSwitchKeys:U,allowCaretMode:H}=this.props,D=y&&y.uDateTimePicker,S=!this.validityStyles||this.validity.valid,W={id:f,ariaLabelledBy:B,ariaDescribedBy:A,format:v,formatPlaceholder:w,disabled:h,title:u,validityStyles:F,validationMessage:E,required:q,min:b,max:M,minTime:R,maxTime:z,name:x,tabIndex:this.show?-1:d,valid:this.validity.valid,value:this.value,onChange:this.handleValueChange,steps:this.props.steps,label:void 0,placeholder:this.state.focused?null:this.props.placeholder,ariaExpanded:this.show,size:null,fillMode:null,rounded:null,unstyled:y,autoFill:L,twoDigitYearMax:_,enableMouseWheel:K,autoCorrectParts:V,autoSwitchParts:j,autoSwitchKeys:U,allowCaretMode:H},I=r.createElement(o.AsyncFocusBlur,{onFocus:this.handleFocus,onBlur:this.handleBlur,onSyncFocus:this.props.onFocus,onSyncBlur:this.props.onBlur},({onFocus:X,onBlur:Y})=>r.createElement(r.Fragment,null,r.createElement("div",{ref:Z=>{this._element=Z},className:o.classNames(o.uDateTimePicker.wrapper({c:D,size:t,fillMode:s,rounded:i,disabled:h,required:this.required,invalid:!S}),k),onKeyDown:this.handleKeyDown,style:{width:C},onFocus:this.mobileMode?void 0:X,onBlur:Y,onClick:this.mobileMode?this.handleDateIconClick:void 0},r.createElement(this.dateInputComp,{_ref:this._dateInput,ariaRole:"combobox",ariaControls:this._popupId,ariaHasPopup:"dialog",autoFocus:n,...W}),r.createElement(ee.Button,{tabIndex:-1,type:"button",icon:"calendar",svgIcon:J.calendarIcon,onMouseDown:this.handleIconMouseDown,onClick:this.mobileMode?void 0:this.handleDateIconClick,title:m.provideLocalizationService(this).toLanguageString(l.toggleDateTimeSelector,l.messages[l.toggleDateTimeSelector]),className:o.classNames(o.uDateTimePicker.inputButton({c:D})),rounded:null,fillMode:s,"aria-label":m.provideLocalizationService(this).toLanguageString(l.toggleDateTimeSelector,l.messages[l.toggleDateTimeSelector])}),r.createElement(N,{show:this.show,animate:this.element!==null,anchor:this.element,popupClass:o.classNames(o.uDateTimePicker.popup({c:D})),id:this._popupId,anchorAlign:{horizontal:"left",vertical:"bottom"},popupAlign:{horizontal:"left",vertical:"top"}},!this.mobileMode&&this.renderPicker())),this.mobileMode&&this.renderAdaptivePopup()));return this.props.label?r.createElement(ae.PickerFloatingLabel,{dateInput:this._dateInput,label:this.props.label,editorId:f,editorValid:S,editorDisabled:this.props.disabled,children:I,style:{width:this.props.width}}):I}setShow(t){const{onOpen:i,onClose:s}=this.props;this.show!==t&&(this.setState({show:t}),t&&i&&i.call(void 0,{target:this}),!t&&s&&s.call(void 0,{target:this}))}nextTick(t){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>t())}calculateMedia(t){for(const i of t)this.setState({windowWidth:i.target.clientWidth})}};a.displayName="DateTimePicker",a.propTypes={className:e.string,defaultShow:e.bool,defaultValue:e.instanceOf(Date),disabled:e.bool,focusedDate:e.instanceOf(Date),format:e.oneOfType([e.string,e.shape({skeleton:e.string,pattern:e.string,date:e.oneOf(["short","medium","long","full"]),time:e.oneOf(["short","medium","long","full"]),datetime:e.oneOf(["short","medium","long","full"]),era:e.oneOf(["narrow","short","long"]),year:e.oneOf(["numeric","2-digit"]),month:e.oneOf(["numeric","2-digit","narrow","short","long"]),day:e.oneOf(["numeric","2-digit"]),weekday:e.oneOf(["narrow","short","long"]),hour:e.oneOf(["numeric","2-digit"]),hour12:e.bool,minute:e.oneOf(["numeric","2-digit"]),second:e.oneOf(["numeric","2-digit"]),timeZoneName:e.oneOf(["short","long"])})]),formatPlaceholder:e.oneOfType([e.oneOf(["wide","narrow","short","formatPattern"]),e.shape({year:e.string,month:e.string,day:e.string,hour:e.string,minute:e.string,second:e.string})]),id:e.string,ariaLabelledBy:e.string,ariaDescribedBy:e.string,min:e.instanceOf(Date),max:e.instanceOf(Date),name:e.string,popupSettings:e.shape({animate:e.bool,appendTo:e.any,popupClass:e.string}),show:e.bool,tabIndex:e.number,title:e.string,value:e.instanceOf(Date),weekNumber:e.bool,width:e.oneOfType([e.number,e.string]),validationMessage:e.string,required:e.bool,validate:e.bool,valid:e.bool,cancelButton:e.bool,size:e.oneOf([null,"small","medium","large"]),rounded:e.oneOf([null,"small","medium","large","full"]),fillMode:e.oneOf([null,"solid","flat","outline"]),autoFocus:e.bool},a.defaultProps={defaultShow:!1,defaultValue:null,disabled:!1,format:"g",max:p.MAX_DATE,min:p.MIN_DATE,popupSettings:{},tabIndex:0,weekNumber:!1,validityStyles:!0,cancelButton:!0,dateInput:Q.DateInput,size:"medium",rounded:"medium",fillMode:"solid",autoFocus:!1};let g=a;const P=o.createPropsContext(),O=o.withIdHOC(o.withPropsContext(P,o.withUnstyledHOC(g)));O.displayName="KendoReactDateTimePicker";m.registerForLocalization(g);exports.DateTimePicker=O;exports.DateTimePickerPropsContext=P;exports.DateTimePickerWithoutContext=g;
|