@progress/kendo-react-dateinputs 9.2.0-develop.2 → 9.2.0-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/LICENSE.md +1 -1
- package/README.md +1 -1
- package/calendar/components/Calendar.js +1 -1
- package/calendar/components/Calendar.mjs +1 -1
- package/calendar/components/CalendarCell.js +1 -1
- package/calendar/components/CalendarCell.mjs +1 -1
- package/calendar/components/CalendarHeaderTitle.js +1 -1
- package/calendar/components/CalendarHeaderTitle.mjs +1 -1
- package/calendar/components/CalendarNavigationItem.js +1 -1
- package/calendar/components/CalendarNavigationItem.mjs +1 -1
- package/calendar/components/CalendarWeekCell.js +1 -1
- package/calendar/components/CalendarWeekCell.mjs +1 -1
- package/calendar/components/Header.js +1 -1
- package/calendar/components/Header.mjs +1 -1
- package/calendar/components/HorizontalViewList.js +1 -1
- package/calendar/components/HorizontalViewList.mjs +1 -1
- package/calendar/components/MultiViewCalendar.js +1 -1
- package/calendar/components/MultiViewCalendar.mjs +1 -1
- package/calendar/components/Navigation.js +1 -1
- package/calendar/components/Navigation.mjs +1 -1
- package/calendar/components/TodayCommand.js +1 -1
- package/calendar/components/TodayCommand.mjs +1 -1
- package/calendar/components/View.js +1 -1
- package/calendar/components/View.mjs +1 -1
- package/calendar/components/ViewList.js +1 -1
- package/calendar/components/ViewList.mjs +1 -1
- package/calendar/models/CalendarViewEnum.js +1 -1
- package/calendar/models/CalendarViewEnum.mjs +1 -1
- package/calendar/models/NavigationAction.js +1 -1
- package/calendar/models/NavigationAction.mjs +1 -1
- package/calendar/models/SelectionRange.js +1 -1
- package/calendar/models/SelectionRange.mjs +1 -1
- package/calendar/services/BusViewService.js +1 -1
- package/calendar/services/BusViewService.mjs +1 -1
- package/calendar/services/CenturyViewService.js +1 -1
- package/calendar/services/CenturyViewService.mjs +1 -1
- package/calendar/services/DOMService.js +1 -1
- package/calendar/services/DOMService.mjs +1 -1
- package/calendar/services/DecadeViewService.js +1 -1
- package/calendar/services/DecadeViewService.mjs +1 -1
- package/calendar/services/MonthViewService.js +1 -1
- package/calendar/services/MonthViewService.mjs +1 -1
- package/calendar/services/NavigationService.js +1 -1
- package/calendar/services/NavigationService.mjs +1 -1
- package/calendar/services/ScrollSyncService.js +1 -1
- package/calendar/services/ScrollSyncService.mjs +1 -1
- package/calendar/services/WeekNamesService.js +1 -1
- package/calendar/services/WeekNamesService.mjs +1 -1
- package/calendar/services/YearViewService.js +1 -1
- package/calendar/services/YearViewService.mjs +1 -1
- package/common/AdaptiveMode.js +2 -2
- package/common/AdaptiveMode.mjs +44 -37
- package/common/ClearButton.js +1 -1
- package/common/ClearButton.mjs +1 -1
- package/common/PickerWrap.js +1 -1
- package/common/PickerWrap.mjs +1 -1
- package/dateinput/DateInput.js +1 -1
- package/dateinput/DateInput.mjs +1 -1
- package/dateinput/dateInputIntl.js +1 -1
- package/dateinput/dateInputIntl.mjs +1 -1
- package/dateinput/utils.js +1 -1
- package/dateinput/utils.mjs +1 -1
- package/datepicker/DatePicker.js +2 -2
- package/datepicker/DatePicker.mjs +70 -71
- package/datepicker/ToggleButton.js +1 -1
- package/datepicker/ToggleButton.mjs +1 -1
- package/daterangepicker/DateRangePicker.js +2 -2
- package/daterangepicker/DateRangePicker.mjs +25 -26
- package/datetimepicker/DateTimePicker.js +2 -2
- package/datetimepicker/DateTimePicker.mjs +38 -39
- package/datetimepicker/DateTimeSelector.js +1 -1
- package/datetimepicker/DateTimeSelector.mjs +1 -1
- package/dist/cdn/js/kendo-react-dateinputs.js +2 -2
- package/hooks/usePickerFloatingLabel.js +1 -1
- package/hooks/usePickerFloatingLabel.mjs +1 -1
- package/index.d.mts +1 -1
- package/index.d.ts +1 -1
- package/index.js +1 -1
- package/index.mjs +1 -1
- package/messages/index.js +1 -1
- package/messages/index.mjs +1 -1
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +2 -2
- package/package.json +7 -7
- package/timepicker/TimeList.js +1 -1
- package/timepicker/TimeList.mjs +1 -1
- package/timepicker/TimePart.js +1 -1
- package/timepicker/TimePart.mjs +1 -1
- package/timepicker/TimePicker.js +2 -2
- package/timepicker/TimePicker.mjs +49 -50
- package/timepicker/TimeSelector.js +1 -1
- package/timepicker/TimeSelector.mjs +1 -1
- package/timepicker/models/TimePart.js +1 -1
- package/timepicker/models/TimePart.mjs +1 -1
- package/timepicker/services/DOMService.js +1 -1
- package/timepicker/services/DOMService.mjs +1 -1
- package/timepicker/services/DayPeriodService.js +1 -1
- package/timepicker/services/DayPeriodService.mjs +1 -1
- package/timepicker/services/HoursService.js +1 -1
- package/timepicker/services/HoursService.mjs +1 -1
- package/timepicker/services/MinutesService.js +1 -1
- package/timepicker/services/MinutesService.mjs +1 -1
- package/timepicker/services/SecondsService.js +1 -1
- package/timepicker/services/SecondsService.mjs +1 -1
- package/timepicker/utils.js +1 -1
- package/timepicker/utils.mjs +1 -1
- package/utils.js +1 -1
- package/utils.mjs +1 -1
- package/virtualization/Virtualization.js +1 -1
- package/virtualization/Virtualization.mjs +1 -1
- package/virtualization/services/ScrollerService.js +1 -1
- package/virtualization/services/ScrollerService.mjs +1 -1
- package/common/constants.js +0 -8
- package/common/constants.mjs +0 -12
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @license
|
|
3
3
|
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright ©
|
|
4
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
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 k=require("react"),t=require("prop-types"),M=require("@progress/kendo-react-popup"),D=require("@progress/kendo-date-math"),r=require("@progress/kendo-react-common"),c=require("@progress/kendo-react-intl"),T=require("@progress/kendo-svg-icons"),x=require("../package-metadata.js"),g=require("../dateinput/DateInput.js"),P=require("../calendar/components/MultiViewCalendar.js"),h=require("../calendar/models/SelectionRange.js"),u=require("../utils.js"),_=require("../common/constants.js"),n=require("../messages/index.js"),A=require("@progress/kendo-react-buttons"),N=require("../common/AdaptiveMode.js"),F=require("@progress/kendo-react-layout");function L(d){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(d){for(const e in d)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(d,e);Object.defineProperty(a,e,s.get?s:{enumerable:!0,get:()=>d[e]})}}return a.default=d,Object.freeze(a)}const i=L(k),l=class l extends i.Component{constructor(a){super(a),this._element=null,this._calendar=null,this._startDateInput=i.createRef(),this._endDateInput=i.createRef(),this.shouldFocusDateInput=!1,this.shouldFocusCalendar=!1,this.focus=()=>{this.startDateInput&&this.startDateInput.focus()},this.setCalendarRef=e=>{this._calendar=e},this.focusCalendarElement=()=>{this._calendar&&this._calendar.element&&this._calendar.element.focus({preventScroll:!0})},this.calculateValue=(e,s)=>(e.value!==void 0?e.value:s.value)||h.EMPTY_SELECTIONRANGE,this.calculateShow=(e,s)=>e.show!==void 0?e.show:s.show,this.renderCalendar=()=>{const e=this.value||h.EMPTY_SELECTIONRANGE,s={min:this.min,max:this.max,allowReverse:this.props.allowReverse,mode:"range",focusedDate:this.props.focusedDate,disabled:this.props.disabled,className:this.mobileMode?"k-calendar-lg":"",mobileMode:this.mobileMode,...this.props.calendarSettings,value:e,dir:this.props.dir,onChange:this.handleCalendarChange};return this.props.calendar?i.createElement(this.props.calendar,{...s}):i.createElement(P.MultiViewCalendar,{...s,ref:this.setCalendarRef})},this.renderPopup=()=>{const e={popupClass:r.classNames("k-calendar-container","k-daterangepicker-popup"),animate:this._element!==null,anchor:this._element,id:this._popupId,anchorAlign:{horizontal:"left",vertical:"bottom"},popupAlign:{horizontal:"left",vertical:"top"},...this.props.popupSettings,show:this.show};return this.props.popup?i.createElement(this.props.popup,{...e},this.renderCalendar()):i.createElement(M.Popup,{...e},this.renderCalendar())},this.renderAdaptivePopup=()=>{const{windowWidth:e=0}=this.state,s={expand:this.show,onClose:o=>this.handleCancel(o),adaptiveTitle:this.props.adaptiveTitle,windowWidth:e,footer:{cancelText:this.localizationService.toLanguageString(n.dateRangePickerCancel,n.messages[n.dateRangePickerCancel]),onCancel:this.handleCancel,applyText:this.localizationService.toLanguageString(n.dateRangePickerSet,n.messages[n.dateRangePickerSet]),onApply:this.handleBlur}};return i.createElement(N.AdaptiveMode,{...s},i.createElement(F.ActionSheetContent,{overflowHidden:!0},i.createElement("div",{className:"k-scrollable-wrap"},this.renderCalendar())))},this.handleReverseClick=e=>{const s={start:this.value.end,end:this.value.start},o={syntheticEvent:e,nativeEvent:e.nativeEvent};this.handleChange(s,o)},this.handleReverseMouseDown=e=>{e.preventDefault()},this.handleFocus=e=>{clearTimeout(this.nextTickId),this.shouldFocusDateInput||this.mobileMode&&this.setState({currentValue:this.value});const{onFocus:s}=this.props;s&&s.call(void 0,e)},this.handleClick=()=>{this.shouldFocusDateInput||this.setShow(!0)},this.handleBlur=e=>{this.nextTick(()=>{this.setShow(!1)});const{onBlur:s}=this.props;s&&s.call(void 0,e)},this.handleCancel=e=>{this.nextTick(()=>{this.setShow(!1),this.setState({currentValue:h.EMPTY_SELECTIONRANGE})});const{onCancel:s}=this.props;s&&s.call(void 0,e)},this.handleEndChange=e=>{const s={start:this.value.start,end:D.cloneDate(e.value||void 0)};this.handleChange(s,e)},this.handleStartChange=e=>{const s={start:D.cloneDate(e.value||void 0),end:this.value.end};this.handleChange(s,e)},this.extractRangeFromValue=e=>{if(!Array.isArray(e.value)&&!(e.value instanceof Date))return e.value||h.EMPTY_SELECTIONRANGE;const s=Array.isArray(e.value)?e.value[0]:e.value;return{start:this.value.end!==null?s:this.value.start,end:this.value.start!==null?s:this.value.end}},this.handleCalendarChange=e=>{const s=this.extractRangeFromValue(e);this.handleChange(s,e)},this.handleKeyDown=e=>{const{keyCode:s,altKey:o}=e;s===r.Keys.esc?(e.preventDefault(),this.shouldFocusDateInput=!0,this.setShow(!1)):o&&s===r.Keys.down?(e.preventDefault(),this.shouldFocusCalendar=!0,this.setShow(!0),this.focusCalendarElement()):o&&s===r.Keys.up&&(e.preventDefault(),this.shouldFocusDateInput=!0,this.setShow(!1))},this.handleChange=(e,s)=>{this.setState({value:e}),this.valueDuringOnChange=e;const{onChange:o}=this.props;if(o){const m={syntheticEvent:s.syntheticEvent,nativeEvent:s.nativeEvent,value:this.value,show:this.show,target:this};o.call(void 0,m)}this.valueDuringOnChange=void 0},r.validatePackage(x.packageMetadata),this.state={show:this.props.show||this.props.defaultShow||l.defaultProps.defaultShow,value:this.props.value||this.props.defaultValue||l.defaultProps.defaultValue,currentValue:h.EMPTY_SELECTIONRANGE},this.nextTick=this.nextTick.bind(this),this.setShow=this.setShow.bind(this),this.focusCalendarElement=this.focusCalendarElement.bind(this),this.focusDateInputElement=this.focusDateInputElement.bind(this)}get _popupId(){return this.props.id+"-popup-id"}get _startInputId(){return this.props.id+"-start-input-id"}get _endInputId(){return this.props.id+"-end-input-id"}get element(){return this._element}get startDateInput(){return this._startDateInput.current}get endDateInput(){return this._endDateInput.current}get calendar(){return this._calendar}get value(){return(this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value)||h.EMPTY_SELECTIONRANGE}get show(){return this.showDuringOnChange!==void 0?this.showDuringOnChange:this.props.show!==void 0?this.props.show:this.state.show}get min(){return this.props.min!==void 0?this.props.min:l.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:l.defaultProps.max}get document(){if(r.canUseDOM)return this.element&&this.element.ownerDocument||document}get localizationService(){return c.provideLocalizationService(this)}get mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=_.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}componentDidMount(){var a;this.observerResize=r.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.show&&this.forceUpdate(),(a=this.document)!=null&&a.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentDidUpdate(){this.shouldFocusCalendar&&this.focusCalendarElement(),this.shouldFocusDateInput&&this.focusDateInputElement(),this.shouldFocusCalendar=!1,this.shouldFocusDateInput=!1}componentWillUnmount(){var a;clearTimeout(this.nextTickId),(a=this.document)!=null&&a.body&&this.observerResize&&this.observerResize.disconnect()}render(){const{autoFocus:a,inputAttributes:e}=this.props,s=this.value||h.EMPTY_SELECTIONRANGE,o=this.mobileMode&&this.show?this.state.currentValue:s,m=(this.props.startDateInputSettings||{}).id||this._startInputId,w=(this.props.endDateInputSettings||{}).id||this._endInputId,E=r.classNames("k-daterangepicker",{"k-disabled":this.props.disabled},this.props.className),S=this.localizationService.toLanguageString(n.start,n.messages[n.start]),C=this.localizationService.toLanguageString(n.end,n.messages[n.end]),R=this.localizationService.toLanguageString(n.separator,n.messages[n.separator]),f={disableSelection:this.mobileMode&&!0,label:S,format:this.props.format,min:this.min,max:this.max,id:this._startInputId,disabled:this.props.disabled,valid:this.props.valid,tabIndex:this.props.tabIndex,ariaExpanded:this.show,clearButton:this.props.clearButton,...this.props.startDateInputSettings,value:o.start,onChange:this.handleStartChange,inputAttributes:this.props.inputAttributes},v={disableSelection:this.mobileMode&&!0,label:C,format:this.props.format,min:this.min,max:this.max,id:this._endInputId,disabled:this.props.disabled,valid:this.props.valid,tabIndex:this.props.tabIndex,ariaExpanded:this.show,clearButton:this.props.clearButton,...this.props.endDateInputSettings,value:o.end,onChange:this.handleEndChange,inputAttributes:this.props.inputAttributes},y=i.createElement(A.Button,{type:"button",className:"k-select",fillMode:"flat",title:c.provideLocalizationService(this).toLanguageString(n.swapStartEnd,n.messages[n.swapStartEnd]),onMouseDown:this.handleReverseMouseDown,onClick:this.handleReverseClick,"aria-controls":m+" "+w,"aria-label":c.provideLocalizationService(this).toLanguageString(n.swapStartEnd,n.messages[n.swapStartEnd])},i.createElement(r.IconWrap,{style:{transform:"rotate(90deg)"},name:"arrows-swap",icon:T.arrowsSwapIcon}));return i.createElement(i.Fragment,null,i.createElement("span",{ref:O=>{this._element=O},className:E,style:this.props.style,id:this.props.id,"aria-labelledby":this.props.ariaLabelledBy,"aria-describedby":this.props.ariaDescribedBy,tabIndex:this.props.tabIndex,onFocus:this.handleFocus,onClick:this.handleClick,onKeyDown:this.handleKeyDown,onBlur:this.mobileMode?void 0:this.handleBlur,dir:this.props.dir},this.props.startDateInput?i.createElement(this.props.startDateInput,{...f}):i.createElement(g.DateInput,{...f,autoFocus:a,ref:this._startDateInput,ariaRole:"combobox",ariaControls:this._popupId}),(this.props.allowReverse||this.props.calendarSettings&&this.props.calendarSettings.allowReverse)&&this.props.swapButton?y:R,this.props.endDateInput?i.createElement(this.props.endDateInput,{...v}):i.createElement(g.DateInput,{...v,ref:this._endDateInput,ariaRole:"combobox",ariaControls:this._popupId}),!this.mobileMode&&this.renderPopup()),this.mobileMode&&this.renderAdaptivePopup())}focusDateInputElement(){if(!document||!this.startDateInput||!this.startDateInput.element||!this.endDateInput||!this.endDateInput.element)return;const a=r.getActiveElement(document);(this.value.start===null||this.value.end!==null)&&a!==this.endDateInput.element?this.startDateInput.element.focus({preventScroll:!0}):a!==this.startDateInput.element&&this.endDateInput.element.focus({preventScroll:!0})}nextTick(a){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>a())}setShow(a){const{onOpen:e,onClose:s}=this.props;this.show!==a&&(this.setState({show:a}),a&&e&&e.call(void 0,{target:this}),!a&&s&&s.call(void 0,{target:this}))}calculateMedia(a){for(const e of a)this.setState({windowWidth:e.target.clientWidth})}};l.displayName="DateRangePicker",l.propTypes={allowReverse:t.bool,calendarSettings:t.any,className:t.string,defaultShow:t.bool,defaultValue:t.shape({start:u.nullable(t.instanceOf(Date).isRequired),end:u.nullable(t.instanceOf(Date).isRequired)}),disabled:t.bool,endDateInputSettings:t.shape(g.DateInputWithoutContext.propTypes),focusedDate:t.instanceOf(Date),format:t.oneOfType([t.string,t.shape({skeleton:t.string,pattern:t.string,date:t.oneOf(["short","medium","long","full"]),time:t.oneOf(["short","medium","long","full"]),datetime:t.oneOf(["short","medium","long","full"]),era:t.oneOf(["narrow","short","long"]),year:t.oneOf(["numeric","2-digit"]),month:t.oneOf(["numeric","2-digit","narrow","short","long"]),day:t.oneOf(["numeric","2-digit"]),weekday:t.oneOf(["narrow","short","long"]),hour:t.oneOf(["numeric","2-digit"]),hour12:t.bool,minute:t.oneOf(["numeric","2-digit"]),second:t.oneOf(["numeric","2-digit"]),timeZoneName:t.oneOf(["short","long"])})]),id:t.string,ariaLabelledBy:t.string,ariaDescribedBy:t.string,max:t.instanceOf(Date),min:t.instanceOf(Date),onBlur:t.func,onChange:t.func,onFocus:t.func,popupSettings:t.any,show:t.bool,startDateInputSettings:t.any,style:t.any,swapButton:t.any,tabIndex:t.number,dir:t.string,value:t.shape({start:u.nullable(t.instanceOf(Date).isRequired),end:u.nullable(t.instanceOf(Date).isRequired)}),autoFocus:t.bool,inputAttributes:t.object},l.defaultProps={allowReverse:!1,defaultShow:!1,defaultValue:h.EMPTY_SELECTIONRANGE,disabled:!1,format:"d",max:u.MAX_DATE,min:u.MIN_DATE,swapButton:!1,autoFocus:!1};let p=l;const I=r.createPropsContext(),b=r.withIdHOC(r.withPropsContext(I,p));b.displayName="KendoReactDateRangePicker";c.registerForLocalization(p);exports.DateRangePicker=b;exports.DateRangePickerPropsContext=I;exports.DateRangePickerWithoutContext=p;
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const k=require("react"),t=require("prop-types"),M=require("@progress/kendo-react-popup"),D=require("@progress/kendo-date-math"),o=require("@progress/kendo-react-common"),c=require("@progress/kendo-react-intl"),T=require("@progress/kendo-svg-icons"),P=require("../package-metadata.js"),g=require("../dateinput/DateInput.js"),x=require("../calendar/components/MultiViewCalendar.js"),h=require("../calendar/models/SelectionRange.js"),u=require("../utils.js"),n=require("../messages/index.js"),A=require("@progress/kendo-react-buttons"),_=require("../common/AdaptiveMode.js"),N=require("@progress/kendo-react-layout");function F(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=F(k),l=class l extends i.Component{constructor(a){super(a),this._element=null,this._calendar=null,this._startDateInput=i.createRef(),this._endDateInput=i.createRef(),this.shouldFocusDateInput=!1,this.shouldFocusCalendar=!1,this.focus=()=>{this.startDateInput&&this.startDateInput.focus()},this.setCalendarRef=e=>{this._calendar=e},this.focusCalendarElement=()=>{this._calendar&&this._calendar.element&&this._calendar.element.focus({preventScroll:!0})},this.calculateValue=(e,s)=>(e.value!==void 0?e.value:s.value)||h.EMPTY_SELECTIONRANGE,this.calculateShow=(e,s)=>e.show!==void 0?e.show:s.show,this.renderCalendar=()=>{const e=this.value||h.EMPTY_SELECTIONRANGE,s={min:this.min,max:this.max,allowReverse:this.props.allowReverse,mode:"range",focusedDate:this.props.focusedDate,disabled:this.props.disabled,className:this.mobileMode?"k-calendar-lg":"",mobileMode:this.mobileMode,...this.props.calendarSettings,value:e,dir:this.props.dir,onChange:this.handleCalendarChange};return this.props.calendar?i.createElement(this.props.calendar,{...s}):i.createElement(x.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),title: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(P.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<=o.ADAPTIVE_MEDIUM_BREAKPOINT&&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{autoFocus:a,inputAttributes:e}=this.props,s=this.value||h.EMPTY_SELECTIONRANGE,r=this.mobileMode&&this.show?this.state.currentValue:s,m=(this.props.startDateInputSettings||{}).id||this._startInputId,w=(this.props.endDateInputSettings||{}).id||this._endInputId,E=o.classNames("k-daterangepicker",{"k-disabled":this.props.disabled},this.props.className),S=this.localizationService.toLanguageString(n.start,n.messages[n.start]),C=this.localizationService.toLanguageString(n.end,n.messages[n.end]),R=this.localizationService.toLanguageString(n.separator,n.messages[n.separator]),f={disableSelection:this.mobileMode&&!0,label:S,format:this.props.format,min:this.min,max:this.max,id:this._startInputId,disabled:this.props.disabled,valid:this.props.valid,tabIndex:this.props.tabIndex,ariaExpanded:this.show,clearButton:this.props.clearButton,...this.props.startDateInputSettings,value:r.start,onChange:this.handleStartChange,inputAttributes:this.props.inputAttributes},v={disableSelection:this.mobileMode&&!0,label:C,format:this.props.format,min:this.min,max:this.max,id:this._endInputId,disabled:this.props.disabled,valid:this.props.valid,tabIndex:this.props.tabIndex,ariaExpanded:this.show,clearButton:this.props.clearButton,...this.props.endDateInputSettings,value:r.end,onChange:this.handleEndChange,inputAttributes:this.props.inputAttributes},y=i.createElement(A.Button,{type:"button",className:"k-select",fillMode:"flat",title:c.provideLocalizationService(this).toLanguageString(n.swapStartEnd,n.messages[n.swapStartEnd]),onMouseDown:this.handleReverseMouseDown,onClick:this.handleReverseClick,"aria-controls":m+" "+w,"aria-label":c.provideLocalizationService(this).toLanguageString(n.swapStartEnd,n.messages[n.swapStartEnd])},i.createElement(o.IconWrap,{style:{transform:"rotate(90deg)"},name:"arrows-swap",icon:T.arrowsSwapIcon}));return i.createElement(i.Fragment,null,i.createElement("span",{ref:O=>{this._element=O},className:E,style:this.props.style,id:this.props.id,"aria-labelledby":this.props.ariaLabelledBy,"aria-describedby":this.props.ariaDescribedBy,tabIndex:this.props.tabIndex,onFocus:this.handleFocus,onClick:this.handleClick,onKeyDown:this.handleKeyDown,onBlur:this.mobileMode?void 0:this.handleBlur,dir:this.props.dir},this.props.startDateInput?i.createElement(this.props.startDateInput,{...f}):i.createElement(g.DateInput,{...f,autoFocus:a,ref:this._startDateInput,ariaRole:"combobox",ariaControls:this._popupId}),(this.props.allowReverse||this.props.calendarSettings&&this.props.calendarSettings.allowReverse)&&this.props.swapButton?y:R,this.props.endDateInput?i.createElement(this.props.endDateInput,{...v}):i.createElement(g.DateInput,{...v,ref:this._endDateInput,ariaRole:"combobox",ariaControls:this._popupId}),!this.mobileMode&&this.renderPopup()),this.mobileMode&&this.renderAdaptivePopup())}focusDateInputElement(){if(!document||!this.startDateInput||!this.startDateInput.element||!this.endDateInput||!this.endDateInput.element)return;const a=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,inputAttributes:t.object},l.defaultProps={allowReverse:!1,defaultShow:!1,defaultValue:h.EMPTY_SELECTIONRANGE,disabled:!1,format:"d",max:u.MAX_DATE,min:u.MIN_DATE,swapButton:!1,autoFocus:!1};let p=l;const I=o.createPropsContext(),b=o.withIdHOC(o.withPropsContext(I,p));b.displayName="KendoReactDateRangePicker";c.registerForLocalization(p);exports.DateRangePicker=b;exports.DateRangePickerPropsContext=I;exports.DateRangePickerWithoutContext=p;
|
|
@@ -1,24 +1,23 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @license
|
|
3
3
|
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright ©
|
|
4
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
8
|
"use client";
|
|
9
9
|
import * as i from "react";
|
|
10
10
|
import e from "prop-types";
|
|
11
|
-
import { Popup as
|
|
11
|
+
import { Popup as _ } from "@progress/kendo-react-popup";
|
|
12
12
|
import { cloneDate as v } from "@progress/kendo-date-math";
|
|
13
|
-
import { classNames as D, Keys as c, validatePackage as
|
|
14
|
-
import { provideLocalizationService as m, registerForLocalization as
|
|
15
|
-
import { arrowsSwapIcon as
|
|
16
|
-
import { packageMetadata as
|
|
17
|
-
import { DateInputWithoutContext as
|
|
18
|
-
import { MultiViewCalendar as
|
|
13
|
+
import { classNames as D, Keys as c, validatePackage as P, canUseDOM as I, ADAPTIVE_MEDIUM_BREAKPOINT as F, IconWrap as B, getActiveElement as z, createPropsContext as N, withIdHOC as V, withPropsContext as L } from "@progress/kendo-react-common";
|
|
14
|
+
import { provideLocalizationService as m, registerForLocalization as K } from "@progress/kendo-react-intl";
|
|
15
|
+
import { arrowsSwapIcon as U } from "@progress/kendo-svg-icons";
|
|
16
|
+
import { packageMetadata as q } from "../package-metadata.mjs";
|
|
17
|
+
import { DateInputWithoutContext as W, DateInput as w } from "../dateinput/DateInput.mjs";
|
|
18
|
+
import { MultiViewCalendar as H } from "../calendar/components/MultiViewCalendar.mjs";
|
|
19
19
|
import { EMPTY_SELECTIONRANGE as r } from "../calendar/models/SelectionRange.mjs";
|
|
20
|
-
import { nullable as h, MAX_DATE as
|
|
21
|
-
import { MOBILE_MEDIUM_DEVISE as G } from "../common/constants.mjs";
|
|
20
|
+
import { nullable as h, MAX_DATE as j, MIN_DATE as G } from "../utils.mjs";
|
|
22
21
|
import { dateRangePickerCancel as b, messages as l, dateRangePickerSet as C, start as S, end as E, separator as y, swapStartEnd as u } from "../messages/index.mjs";
|
|
23
22
|
import { Button as X } from "@progress/kendo-react-buttons";
|
|
24
23
|
import { AdaptiveMode as Y } from "../common/AdaptiveMode.mjs";
|
|
@@ -46,7 +45,7 @@ const o = class o extends i.Component {
|
|
|
46
45
|
dir: this.props.dir,
|
|
47
46
|
onChange: this.handleCalendarChange
|
|
48
47
|
};
|
|
49
|
-
return this.props.calendar ? /* @__PURE__ */ i.createElement(this.props.calendar, { ...s }) : /* @__PURE__ */ i.createElement(
|
|
48
|
+
return this.props.calendar ? /* @__PURE__ */ i.createElement(this.props.calendar, { ...s }) : /* @__PURE__ */ i.createElement(H, { ...s, ref: this.setCalendarRef });
|
|
50
49
|
}, this.renderPopup = () => {
|
|
51
50
|
const t = {
|
|
52
51
|
popupClass: D("k-calendar-container", "k-daterangepicker-popup"),
|
|
@@ -64,12 +63,12 @@ const o = class o extends i.Component {
|
|
|
64
63
|
...this.props.popupSettings,
|
|
65
64
|
show: this.show
|
|
66
65
|
};
|
|
67
|
-
return this.props.popup ? /* @__PURE__ */ i.createElement(this.props.popup, { ...t }, this.renderCalendar()) : /* @__PURE__ */ i.createElement(
|
|
66
|
+
return this.props.popup ? /* @__PURE__ */ i.createElement(this.props.popup, { ...t }, this.renderCalendar()) : /* @__PURE__ */ i.createElement(_, { ...t }, this.renderCalendar());
|
|
68
67
|
}, this.renderAdaptivePopup = () => {
|
|
69
68
|
const { windowWidth: t = 0 } = this.state, s = {
|
|
70
69
|
expand: this.show,
|
|
71
70
|
onClose: (n) => this.handleCancel(n),
|
|
72
|
-
|
|
71
|
+
title: this.props.adaptiveTitle,
|
|
73
72
|
windowWidth: t,
|
|
74
73
|
footer: {
|
|
75
74
|
cancelText: this.localizationService.toLanguageString(
|
|
@@ -151,7 +150,7 @@ const o = class o extends i.Component {
|
|
|
151
150
|
n.call(void 0, d);
|
|
152
151
|
}
|
|
153
152
|
this.valueDuringOnChange = void 0;
|
|
154
|
-
},
|
|
153
|
+
}, P(q), this.state = {
|
|
155
154
|
show: this.props.show || this.props.defaultShow || o.defaultProps.defaultShow,
|
|
156
155
|
value: this.props.value || this.props.defaultValue || o.defaultProps.defaultValue,
|
|
157
156
|
currentValue: r
|
|
@@ -219,7 +218,7 @@ const o = class o extends i.Component {
|
|
|
219
218
|
* The mobile mode of the DateRangePicker.
|
|
220
219
|
*/
|
|
221
220
|
get mobileMode() {
|
|
222
|
-
return !!(this.state.windowWidth && this.state.windowWidth <=
|
|
221
|
+
return !!(this.state.windowWidth && this.state.windowWidth <= F && this.props.adaptive);
|
|
223
222
|
}
|
|
224
223
|
/**
|
|
225
224
|
* @hidden
|
|
@@ -283,7 +282,7 @@ const o = class o extends i.Component {
|
|
|
283
282
|
value: n.end,
|
|
284
283
|
onChange: this.handleEndChange,
|
|
285
284
|
inputAttributes: this.props.inputAttributes
|
|
286
|
-
},
|
|
285
|
+
}, A = /* @__PURE__ */ i.createElement(
|
|
287
286
|
X,
|
|
288
287
|
{
|
|
289
288
|
type: "button",
|
|
@@ -298,13 +297,13 @@ const o = class o extends i.Component {
|
|
|
298
297
|
l[u]
|
|
299
298
|
)
|
|
300
299
|
},
|
|
301
|
-
/* @__PURE__ */ i.createElement(
|
|
300
|
+
/* @__PURE__ */ i.createElement(B, { style: { transform: "rotate(90deg)" }, name: "arrows-swap", icon: U })
|
|
302
301
|
);
|
|
303
302
|
return /* @__PURE__ */ i.createElement(i.Fragment, null, /* @__PURE__ */ i.createElement(
|
|
304
303
|
"span",
|
|
305
304
|
{
|
|
306
|
-
ref: (
|
|
307
|
-
this._element =
|
|
305
|
+
ref: (T) => {
|
|
306
|
+
this._element = T;
|
|
308
307
|
},
|
|
309
308
|
className: R,
|
|
310
309
|
style: this.props.style,
|
|
@@ -328,7 +327,7 @@ const o = class o extends i.Component {
|
|
|
328
327
|
ariaControls: this._popupId
|
|
329
328
|
}
|
|
330
329
|
),
|
|
331
|
-
(this.props.allowReverse || this.props.calendarSettings && this.props.calendarSettings.allowReverse) && this.props.swapButton ?
|
|
330
|
+
(this.props.allowReverse || this.props.calendarSettings && this.props.calendarSettings.allowReverse) && this.props.swapButton ? A : M,
|
|
332
331
|
this.props.endDateInput ? /* @__PURE__ */ i.createElement(this.props.endDateInput, { ...g }) : /* @__PURE__ */ i.createElement(
|
|
333
332
|
w,
|
|
334
333
|
{
|
|
@@ -344,7 +343,7 @@ const o = class o extends i.Component {
|
|
|
344
343
|
focusDateInputElement() {
|
|
345
344
|
if (!document || !this.startDateInput || !this.startDateInput.element || !this.endDateInput || !this.endDateInput.element)
|
|
346
345
|
return;
|
|
347
|
-
const a =
|
|
346
|
+
const a = z(document);
|
|
348
347
|
(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 });
|
|
349
348
|
}
|
|
350
349
|
nextTick(a) {
|
|
@@ -373,7 +372,7 @@ o.displayName = "DateRangePicker", o.propTypes = {
|
|
|
373
372
|
end: h(e.instanceOf(Date).isRequired)
|
|
374
373
|
}),
|
|
375
374
|
disabled: e.bool,
|
|
376
|
-
endDateInputSettings: e.shape(
|
|
375
|
+
endDateInputSettings: e.shape(W.propTypes),
|
|
377
376
|
focusedDate: e.instanceOf(Date),
|
|
378
377
|
format: e.oneOfType([
|
|
379
378
|
e.string,
|
|
@@ -422,20 +421,20 @@ o.displayName = "DateRangePicker", o.propTypes = {
|
|
|
422
421
|
defaultValue: r,
|
|
423
422
|
disabled: !1,
|
|
424
423
|
format: "d",
|
|
425
|
-
max:
|
|
426
|
-
min:
|
|
424
|
+
max: j,
|
|
425
|
+
min: G,
|
|
427
426
|
swapButton: !1,
|
|
428
427
|
autoFocus: !1
|
|
429
428
|
};
|
|
430
429
|
let p = o;
|
|
431
|
-
const J =
|
|
430
|
+
const J = N(), Q = V(
|
|
432
431
|
L(
|
|
433
432
|
J,
|
|
434
433
|
p
|
|
435
434
|
)
|
|
436
435
|
);
|
|
437
436
|
Q.displayName = "KendoReactDateRangePicker";
|
|
438
|
-
|
|
437
|
+
K(p);
|
|
439
438
|
export {
|
|
440
439
|
Q as DateRangePicker,
|
|
441
440
|
J as DateRangePickerPropsContext,
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @license
|
|
3
3
|
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright ©
|
|
4
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
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 G=require("react"),e=require("prop-types"),J=require("@progress/kendo-react-popup"),T=require("@progress/kendo-date-math"),o=require("@progress/kendo-react-common"),Q=require("@progress/kendo-svg-icons"),ee=require("../dateinput/DateInput.js"),te=require("@progress/kendo-react-buttons"),ie=require("../package-metadata.js"),p=require("../utils.js"),se=require("../common/constants.js"),l=require("../messages/index.js"),m=require("@progress/kendo-react-intl"),oe=require("./DateTimeSelector.js"),ae=require("../timepicker/utils.js"),ne=require("../hooks/usePickerFloatingLabel.js"),re=require("../common/AdaptiveMode.js"),le=require("@progress/kendo-react-layout");function ue(h){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(h){for(const i in h)if(i!=="default"){const s=Object.getOwnPropertyDescriptor(h,i);Object.defineProperty(t,i,s.get?s:{enumerable:!0,get:()=>h[i]})}}return t.default=h,Object.freeze(t)}const r=ue(G),a=class a extends r.Component{constructor(t){super(t),this._element=null,this._dateInput=r.createRef(),this._dateTimeSelector=null,this.shouldFocusDateInput=!1,this.prevShow=!1,this.focus=()=>{const i=this.dateInputElement();i&&i.focus()},this.renderPicker=()=>{const{disabled:i,minTime:s,maxTime:n,format:c,calendar:d,cancelButton:u,weekNumber:v,focusedDate:f,unstyled:w}=this.props;return r.createElement(oe.DateTimeSelector,{ref:b=>{this._dateTimeSelector=b},cancelButton:u,steps:this.props.steps,value:this.value,onChange:this.handleValueChange,onReject:this.handleReject,disabled:i,weekNumber:v,min:this.min,max:this.max,minTime:s,maxTime:n,focusedDate:f,format:c,calendar:d,mobileMode:this.mobileMode,footerActions:!this.mobileMode,unstyled:w})},this.renderAdaptivePopup=()=>{const{windowWidth:i=0}=this.state,s=m.provideLocalizationService(this).toLanguageString(l.dateTimePickerCancel,l.messages[l.dateTimePickerCancel]),n=m.provideLocalizationService(this).toLanguageString(l.dateTimePickerSet,l.messages[l.dateTimePickerSet]),c={expand:this.show,onClose:this.handleBlur,adaptiveTitle:this.props.adaptiveTitle,windowWidth:i,footer:{cancelText:s,onCancel:d=>{var u;return(u=this._dateTimeSelector)==null?void 0:u.handleReject(d)},applyText:n,onApply:d=>{var u;return(u=this._dateTimeSelector)==null?void 0:u.handleAccept(d)}}};return r.createElement(re.AdaptiveMode,{...c},r.createElement(le.ActionSheetContent,{overflowHidden:!0},this.renderPicker()))},this.handleReject=()=>{this.shouldFocusDateInput=!0,this.setShow(!1)},this.handleValueChange=i=>{this.setState({value:T.cloneDate(i.value||void 0)}),this.valueDuringOnChange=i.value,this.showDuringOnChange=!1,this.mobileMode||(this.shouldFocusDateInput=!0);const{onChange:s}=this.props;s&&s.call(void 0,{syntheticEvent:i.syntheticEvent,nativeEvent:i.nativeEvent,value:this.value,show:this.show,target:this}),this.valueDuringOnChange=void 0,this.showDuringOnChange=void 0,this.setShow(!1)},this.handleFocus=()=>{this.setState({focused:!0})},this.handleBlur=()=>{this.setState({focused:!1}),this.setShow(!1)},this.handleDateIconClick=()=>{this.props.disabled||(this.shouldFocusDateInput=!0,this.setShow(!this.show))},this.handleIconMouseDown=i=>{i.preventDefault()},this.handleKeyDown=i=>{const{altKey:s,keyCode:n}=i;if(n===o.Keys.esc){this.shouldFocusDateInput=!0,this.setShow(!1);return}s&&(n===o.Keys.up||n===o.Keys.down)&&(i.preventDefault(),i.stopPropagation(),this.shouldFocusDateInput=n===o.Keys.up,this.setShow(n===o.Keys.down))},this.dateInputElement=()=>this.dateInput&&this.dateInput.element||this.element&&this.element.querySelector(".k-dateinput > input.k-input-inner"),o.validatePackage(ie.packageMetadata),this.state={value:this.props.defaultValue||a.defaultProps.defaultValue,show:this.props.defaultShow||a.defaultProps.defaultShow,focused:!1}}get _popupId(){return this.props.id+"-popup-id"}get document(){if(o.canUseDOM)return this.element&&this.element.ownerDocument||document}get element(){return this._element}get dateInput(){return this._dateInput.current}get value(){const t=this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value;return t!==null?T.cloneDate(t):null}get show(){return this.showDuringOnChange!==void 0?this.showDuringOnChange:this.props.show!==void 0?this.props.show:this.state.show}get name(){return this.props.name}get mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=se.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}get min(){return this.props.min!==void 0?this.props.min:a.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:a.defaultProps.max}get validity(){const t=p.isInDateRange(this.value,this.min,this.max)&&ae.isInTimeRange(this.value,this.props.minTime||p.MIN_TIME,this.props.maxTime||p.MAX_TIME),i=this.props.validationMessage!==void 0,s=(!this.required||this.value!==null)&&t,n=this.props.valid!==void 0?this.props.valid:s;return{customError:i,rangeOverflow:this.value&&this.max.getTime()<this.value.getTime()||!1,rangeUnderflow:this.value&&this.value.getTime()<this.min.getTime()||!1,valid:n,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:a.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:!1}get dateInputComp(){return this.props.dateInput||a.defaultProps.dateInput}componentDidMount(){var t;this.observerResize=o.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.show&&this.forceUpdate(),(t=this.document)!=null&&t.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentDidUpdate(){const t=this.dateInputElement();this._dateTimeSelector&&this.show&&!this.prevShow&&this._dateTimeSelector.focus({preventScroll:!0}),t&&!this.show&&this.shouldFocusDateInput&&t.focus({preventScroll:!0}),this.prevShow=this.show,this.shouldFocusDateInput=!1}componentWillUnmount(){var t;clearTimeout(this.nextTickId),(t=this.document)!=null&&t.body&&this.observerResize&&this.observerResize.disconnect()}render(){const{size:t=a.defaultProps.size,rounded:i=a.defaultProps.rounded,fillMode:s=a.defaultProps.fillMode,autoFocus:n=a.defaultProps.autoFocus,inputAttributes:c,disabled:d,tabIndex:u,title:v,id:f,format:w,formatPlaceholder:b,min:M,max:k,className:C,width:x,name:E,validationMessage:q,required:F,validityStyles:R,minTime:z,maxTime:A,ariaLabelledBy:B,ariaDescribedBy:N,popup:L=J.Popup,unstyled:y,autoFill:_,twoDigitYearMax:K,enableMouseWheel:V,autoCorrectParts:j,autoSwitchParts:U,autoSwitchKeys:H,allowCaretMode:W}=this.props,D=y&&y.uDateTimePicker,S=!this.validityStyles||this.validity.valid,X={id:f,ariaLabelledBy:B,ariaDescribedBy:N,format:w,formatPlaceholder:b,disabled:d,title:v,validityStyles:R,validationMessage:q,required:F,min:M,max:k,minTime:z,maxTime:A,name:E,tabIndex:this.show?-1:u,valid:this.validity.valid,value:this.value,onChange:this.handleValueChange,steps:this.props.steps,label:void 0,placeholder:this.state.focused?null:this.props.placeholder,ariaExpanded:this.show,size:null,fillMode:null,rounded:null,unstyled:y,autoFill:_,twoDigitYearMax:K,enableMouseWheel:V,autoCorrectParts:j,autoSwitchParts:U,autoSwitchKeys:H,allowCaretMode:W},I=r.createElement(o.AsyncFocusBlur,{onFocus:this.handleFocus,onBlur:this.handleBlur,onSyncFocus:this.props.onFocus,onSyncBlur:this.props.onBlur},({onFocus:Y,onBlur:Z})=>r.createElement(r.Fragment,null,r.createElement("div",{ref:$=>{this._element=$},className:o.classNames(o.uDateTimePicker.wrapper({c:D,size:t,fillMode:s,rounded:i,disabled:d,required:this.required,invalid:!S}),C),onKeyDown:this.handleKeyDown,style:{width:x},onFocus:this.mobileMode?void 0:Y,onBlur:Z,onClick:this.mobileMode?this.handleDateIconClick:void 0},r.createElement(this.dateInputComp,{_ref:this._dateInput,ariaRole:"combobox",ariaControls:this._popupId,ariaHasPopup:"dialog",autoFocus:n,inputAttributes:c,...X}),r.createElement(te.Button,{tabIndex:-1,type:"button",icon:"calendar",svgIcon:Q.calendarIcon,onMouseDown:this.handleIconMouseDown,onClick:this.mobileMode?void 0:this.handleDateIconClick,title:m.provideLocalizationService(this).toLanguageString(l.toggleDateTimeSelector,l.messages[l.toggleDateTimeSelector]),className:o.classNames(o.uDateTimePicker.inputButton({c:D})),rounded:null,fillMode:s,"aria-label":m.provideLocalizationService(this).toLanguageString(l.toggleDateTimeSelector,l.messages[l.toggleDateTimeSelector])}),r.createElement(L,{show:this.show,animate:this.element!==null,anchor:this.element,popupClass:o.classNames(o.uDateTimePicker.popup({c:D})),id:this._popupId,anchorAlign:{horizontal:"left",vertical:"bottom"},popupAlign:{horizontal:"left",vertical:"top"}},!this.mobileMode&&this.renderPicker())),this.mobileMode&&this.renderAdaptivePopup()));return this.props.label?r.createElement(ne.PickerFloatingLabel,{dateInput:this._dateInput,label:this.props.label,editorId:f,editorValid:S,editorDisabled:this.props.disabled,children:I,style:{width:this.props.width}}):I}setShow(t){const{onOpen:i,onClose:s}=this.props;this.show!==t&&(this.setState({show:t}),t&&i&&i.call(void 0,{target:this}),!t&&s&&s.call(void 0,{target:this}))}nextTick(t){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>t())}calculateMedia(t){for(const i of t)this.setState({windowWidth:i.target.clientWidth})}};a.displayName="DateTimePicker",a.propTypes={className:e.string,defaultShow:e.bool,defaultValue:e.instanceOf(Date),disabled:e.bool,focusedDate:e.instanceOf(Date),format:e.oneOfType([e.string,e.shape({skeleton:e.string,pattern:e.string,date:e.oneOf(["short","medium","long","full"]),time:e.oneOf(["short","medium","long","full"]),datetime:e.oneOf(["short","medium","long","full"]),era:e.oneOf(["narrow","short","long"]),year:e.oneOf(["numeric","2-digit"]),month:e.oneOf(["numeric","2-digit","narrow","short","long"]),day:e.oneOf(["numeric","2-digit"]),weekday:e.oneOf(["narrow","short","long"]),hour:e.oneOf(["numeric","2-digit"]),hour12:e.bool,minute:e.oneOf(["numeric","2-digit"]),second:e.oneOf(["numeric","2-digit"]),timeZoneName:e.oneOf(["short","long"])})]),formatPlaceholder:e.oneOfType([e.oneOf(["wide","narrow","short","formatPattern"]),e.shape({year:e.string,month:e.string,day:e.string,hour:e.string,minute:e.string,second:e.string})]),id:e.string,ariaLabelledBy:e.string,ariaDescribedBy:e.string,min:e.instanceOf(Date),max:e.instanceOf(Date),name:e.string,popupSettings:e.shape({animate:e.bool,appendTo:e.any,popupClass:e.string}),show:e.bool,tabIndex:e.number,title:e.string,value:e.instanceOf(Date),weekNumber:e.bool,width:e.oneOfType([e.number,e.string]),validationMessage:e.string,required:e.bool,validate:e.bool,valid:e.bool,cancelButton:e.bool,size:e.oneOf([null,"small","medium","large"]),rounded:e.oneOf([null,"small","medium","large","full"]),fillMode:e.oneOf([null,"solid","flat","outline"]),autoFocus:e.bool,inputAttributes:e.object},a.defaultProps={defaultShow:!1,defaultValue:null,disabled:!1,format:"g",max:p.MAX_DATE,min:p.MIN_DATE,popupSettings:{},tabIndex:0,weekNumber:!1,validityStyles:!0,cancelButton:!0,dateInput:ee.DateInput,size:"medium",rounded:"medium",fillMode:"solid",autoFocus:!1};let g=a;const P=o.createPropsContext(),O=o.withIdHOC(o.withPropsContext(P,o.withUnstyledHOC(g)));O.displayName="KendoReactDateTimePicker";m.registerForLocalization(g);exports.DateTimePicker=O;exports.DateTimePickerPropsContext=P;exports.DateTimePickerWithoutContext=g;
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const G=require("react"),e=require("prop-types"),J=require("@progress/kendo-react-popup"),T=require("@progress/kendo-date-math"),s=require("@progress/kendo-react-common"),Q=require("@progress/kendo-svg-icons"),ee=require("../dateinput/DateInput.js"),te=require("@progress/kendo-react-buttons"),ie=require("../package-metadata.js"),p=require("../utils.js"),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(h){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(h){for(const i in h)if(i!=="default"){const o=Object.getOwnPropertyDescriptor(h,i);Object.defineProperty(t,i,o.get?o:{enumerable:!0,get:()=>h[i]})}}return t.default=h,Object.freeze(t)}const r=le(G),a=class a extends r.Component{constructor(t){super(t),this._element=null,this._dateInput=r.createRef(),this._dateTimeSelector=null,this.shouldFocusDateInput=!1,this.prevShow=!1,this.focus=()=>{const i=this.dateInputElement();i&&i.focus()},this.renderPicker=()=>{const{disabled:i,minTime:o,maxTime:n,format:c,calendar:d,cancelButton:u,weekNumber:v,focusedDate:f,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:v,min:this.min,max:this.max,minTime:o,maxTime:n,focusedDate:f,format:c,calendar:d,mobileMode:this.mobileMode,footerActions:!this.mobileMode,unstyled:w})},this.renderAdaptivePopup=()=>{const{windowWidth:i=0}=this.state,o=m.provideLocalizationService(this).toLanguageString(l.dateTimePickerCancel,l.messages[l.dateTimePickerCancel]),n=m.provideLocalizationService(this).toLanguageString(l.dateTimePickerSet,l.messages[l.dateTimePickerSet]),c={expand:this.show,onClose:this.handleBlur,title:this.props.adaptiveTitle,windowWidth:i,footer:{cancelText:o,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,{...c},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:o}=this.props;o&&o.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:o,keyCode:n}=i;if(n===s.Keys.esc){this.shouldFocusDateInput=!0,this.setShow(!1);return}o&&(n===s.Keys.up||n===s.Keys.down)&&(i.preventDefault(),i.stopPropagation(),this.shouldFocusDateInput=n===s.Keys.up,this.setShow(n===s.Keys.down))},this.dateInputElement=()=>this.dateInput&&this.dateInput.element||this.element&&this.element.querySelector(".k-dateinput > input.k-input-inner"),s.validatePackage(ie.packageMetadata),this.state={value:this.props.defaultValue||a.defaultProps.defaultValue,show:this.props.defaultShow||a.defaultProps.defaultShow,focused:!1}}get _popupId(){return this.props.id+"-popup-id"}get document(){if(s.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<=s.ADAPTIVE_MEDIUM_BREAKPOINT&&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,o=(!this.required||this.value!==null)&&t,n=this.props.valid!==void 0?this.props.valid:o;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=s.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:o=a.defaultProps.fillMode,autoFocus:n=a.defaultProps.autoFocus,inputAttributes:c,disabled:d,tabIndex:u,title:v,id:f,format:w,formatPlaceholder:b,min:k,max:M,className:C,width:x,name:E,validationMessage:q,required:R,validityStyles:F,minTime:A,maxTime:z,ariaLabelledBy:B,ariaDescribedBy:N,popup:L=J.Popup,unstyled:y,autoFill:_,twoDigitYearMax:K,enableMouseWheel:V,autoCorrectParts:j,autoSwitchParts:U,autoSwitchKeys:H,allowCaretMode:W}=this.props,D=y&&y.uDateTimePicker,S=!this.validityStyles||this.validity.valid,X={id:f,ariaLabelledBy:B,ariaDescribedBy:N,format:w,formatPlaceholder:b,disabled:d,title:v,validityStyles:F,validationMessage:q,required:R,min:k,max:M,minTime:A,maxTime:z,name:E,tabIndex:this.show?-1:u,valid:this.validity.valid,value:this.value,onChange:this.handleValueChange,steps:this.props.steps,label:void 0,placeholder:this.state.focused?null:this.props.placeholder,ariaExpanded:this.show,size:null,fillMode:null,rounded:null,unstyled:y,autoFill:_,twoDigitYearMax:K,enableMouseWheel:V,autoCorrectParts:j,autoSwitchParts:U,autoSwitchKeys:H,allowCaretMode:W},I=r.createElement(s.AsyncFocusBlur,{onFocus:this.handleFocus,onBlur:this.handleBlur,onSyncFocus:this.props.onFocus,onSyncBlur:this.props.onBlur},({onFocus:Y,onBlur:Z})=>r.createElement(r.Fragment,null,r.createElement("div",{ref:$=>{this._element=$},className:s.classNames(s.uDateTimePicker.wrapper({c:D,size:t,fillMode:o,rounded:i,disabled:d,required:this.required,invalid:!S}),C),onKeyDown:this.handleKeyDown,style:{width:x},onFocus:this.mobileMode?void 0:Y,onBlur:Z,onClick:this.mobileMode?this.handleDateIconClick:void 0},r.createElement(this.dateInputComp,{_ref:this._dateInput,ariaRole:"combobox",ariaControls:this._popupId,ariaHasPopup:"dialog",autoFocus:n,inputAttributes:c,...X}),r.createElement(te.Button,{tabIndex:-1,type:"button",icon:"calendar",svgIcon:Q.calendarIcon,onMouseDown:this.handleIconMouseDown,onClick:this.mobileMode?void 0:this.handleDateIconClick,title:m.provideLocalizationService(this).toLanguageString(l.toggleDateTimeSelector,l.messages[l.toggleDateTimeSelector]),className:s.classNames(s.uDateTimePicker.inputButton({c:D})),rounded:null,fillMode:o,"aria-label":m.provideLocalizationService(this).toLanguageString(l.toggleDateTimeSelector,l.messages[l.toggleDateTimeSelector])}),r.createElement(L,{show:this.show,animate:this.element!==null,anchor:this.element,popupClass:s.classNames(s.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:o}=this.props;this.show!==t&&(this.setState({show:t}),t&&i&&i.call(void 0,{target:this}),!t&&o&&o.call(void 0,{target:this}))}nextTick(t){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>t())}calculateMedia(t){for(const i of t)this.setState({windowWidth:i.target.clientWidth})}};a.displayName="DateTimePicker",a.propTypes={className:e.string,defaultShow:e.bool,defaultValue:e.instanceOf(Date),disabled:e.bool,focusedDate:e.instanceOf(Date),format:e.oneOfType([e.string,e.shape({skeleton:e.string,pattern:e.string,date:e.oneOf(["short","medium","long","full"]),time:e.oneOf(["short","medium","long","full"]),datetime:e.oneOf(["short","medium","long","full"]),era:e.oneOf(["narrow","short","long"]),year:e.oneOf(["numeric","2-digit"]),month:e.oneOf(["numeric","2-digit","narrow","short","long"]),day:e.oneOf(["numeric","2-digit"]),weekday:e.oneOf(["narrow","short","long"]),hour:e.oneOf(["numeric","2-digit"]),hour12:e.bool,minute:e.oneOf(["numeric","2-digit"]),second:e.oneOf(["numeric","2-digit"]),timeZoneName:e.oneOf(["short","long"])})]),formatPlaceholder:e.oneOfType([e.oneOf(["wide","narrow","short","formatPattern"]),e.shape({year:e.string,month:e.string,day:e.string,hour:e.string,minute:e.string,second:e.string})]),id:e.string,ariaLabelledBy:e.string,ariaDescribedBy:e.string,min:e.instanceOf(Date),max:e.instanceOf(Date),name:e.string,popupSettings:e.shape({animate:e.bool,appendTo:e.any,popupClass:e.string}),show:e.bool,tabIndex:e.number,title:e.string,value:e.instanceOf(Date),weekNumber:e.bool,width:e.oneOfType([e.number,e.string]),validationMessage:e.string,required:e.bool,validate:e.bool,valid:e.bool,cancelButton:e.bool,size:e.oneOf([null,"small","medium","large"]),rounded:e.oneOf([null,"small","medium","large","full"]),fillMode:e.oneOf([null,"solid","flat","outline"]),autoFocus:e.bool,inputAttributes:e.object},a.defaultProps={defaultShow:!1,defaultValue:null,disabled:!1,format:"g",max:p.MAX_DATE,min:p.MIN_DATE,popupSettings:{},tabIndex:0,weekNumber:!1,validityStyles:!0,cancelButton:!0,dateInput:ee.DateInput,size:"medium",rounded:"medium",fillMode:"solid",autoFocus:!1};let g=a;const P=s.createPropsContext(),O=s.withIdHOC(s.withPropsContext(P,s.withUnstyledHOC(g)));O.displayName="KendoReactDateTimePicker";m.registerForLocalization(g);exports.DateTimePicker=O;exports.DateTimePickerPropsContext=P;exports.DateTimePickerWithoutContext=g;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @license
|
|
3
3
|
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright ©
|
|
4
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
@@ -9,15 +9,14 @@
|
|
|
9
9
|
import * as n from "react";
|
|
10
10
|
import e from "prop-types";
|
|
11
11
|
import { Popup as $ } from "@progress/kendo-react-popup";
|
|
12
|
-
import { cloneDate as
|
|
13
|
-
import { Keys as d, validatePackage as ee, canUseDOM as
|
|
14
|
-
import { calendarIcon as
|
|
15
|
-
import { DateInput as
|
|
16
|
-
import { Button as
|
|
17
|
-
import { packageMetadata as
|
|
18
|
-
import { MAX_DATE as
|
|
19
|
-
import {
|
|
20
|
-
import { dateTimePickerCancel as P, messages as p, dateTimePickerSet as C, toggleDateTimeSelector as c } from "../messages/index.mjs";
|
|
12
|
+
import { cloneDate as O } from "@progress/kendo-date-math";
|
|
13
|
+
import { Keys as d, validatePackage as ee, canUseDOM as P, ADAPTIVE_MEDIUM_BREAKPOINT as te, AsyncFocusBlur as ie, classNames as I, uDateTimePicker as D, createPropsContext as se, withIdHOC as oe, withPropsContext as ae, withUnstyledHOC as ne } from "@progress/kendo-react-common";
|
|
14
|
+
import { calendarIcon as re } from "@progress/kendo-svg-icons";
|
|
15
|
+
import { DateInput as le } from "../dateinput/DateInput.mjs";
|
|
16
|
+
import { Button as he } from "@progress/kendo-react-buttons";
|
|
17
|
+
import { packageMetadata as de } from "../package-metadata.mjs";
|
|
18
|
+
import { MAX_DATE as ue, MIN_DATE as pe, isInDateRange as ce, MAX_TIME as me, MIN_TIME as fe } from "../utils.mjs";
|
|
19
|
+
import { dateTimePickerCancel as M, messages as p, dateTimePickerSet as C, toggleDateTimeSelector as c } from "../messages/index.mjs";
|
|
21
20
|
import { provideLocalizationService as m, registerForLocalization as ge } from "@progress/kendo-react-intl";
|
|
22
21
|
import { DateTimeSelector as ve } from "./DateTimeSelector.mjs";
|
|
23
22
|
import { isInTimeRange as we } from "../timepicker/utils.mjs";
|
|
@@ -58,15 +57,15 @@ const o = class o extends n.Component {
|
|
|
58
57
|
);
|
|
59
58
|
}, this.renderAdaptivePopup = () => {
|
|
60
59
|
const { windowWidth: i = 0 } = this.state, s = m(this).toLanguageString(
|
|
61
|
-
|
|
62
|
-
p[
|
|
60
|
+
M,
|
|
61
|
+
p[M]
|
|
63
62
|
), a = m(this).toLanguageString(
|
|
64
63
|
C,
|
|
65
64
|
p[C]
|
|
66
65
|
), h = {
|
|
67
66
|
expand: this.show,
|
|
68
67
|
onClose: this.handleBlur,
|
|
69
|
-
|
|
68
|
+
title: this.props.adaptiveTitle,
|
|
70
69
|
windowWidth: i,
|
|
71
70
|
footer: {
|
|
72
71
|
cancelText: s,
|
|
@@ -86,7 +85,7 @@ const o = class o extends n.Component {
|
|
|
86
85
|
this.shouldFocusDateInput = !0, this.setShow(!1);
|
|
87
86
|
}, this.handleValueChange = (i) => {
|
|
88
87
|
this.setState({
|
|
89
|
-
value:
|
|
88
|
+
value: O(i.value || void 0)
|
|
90
89
|
}), this.valueDuringOnChange = i.value, this.showDuringOnChange = !1, this.mobileMode || (this.shouldFocusDateInput = !0);
|
|
91
90
|
const { onChange: s } = this.props;
|
|
92
91
|
s && s.call(void 0, {
|
|
@@ -111,7 +110,7 @@ const o = class o extends n.Component {
|
|
|
111
110
|
return;
|
|
112
111
|
}
|
|
113
112
|
s && (a === d.up || a === d.down) && (i.preventDefault(), i.stopPropagation(), this.shouldFocusDateInput = a === d.up, this.setShow(a === d.down));
|
|
114
|
-
}, this.dateInputElement = () => this.dateInput && this.dateInput.element || this.element && this.element.querySelector(".k-dateinput > input.k-input-inner"), ee(
|
|
113
|
+
}, this.dateInputElement = () => this.dateInput && this.dateInput.element || this.element && this.element.querySelector(".k-dateinput > input.k-input-inner"), ee(de), this.state = {
|
|
115
114
|
value: this.props.defaultValue || o.defaultProps.defaultValue,
|
|
116
115
|
show: this.props.defaultShow || o.defaultProps.defaultShow,
|
|
117
116
|
focused: !1
|
|
@@ -121,7 +120,7 @@ const o = class o extends n.Component {
|
|
|
121
120
|
return this.props.id + "-popup-id";
|
|
122
121
|
}
|
|
123
122
|
get document() {
|
|
124
|
-
if (
|
|
123
|
+
if (P)
|
|
125
124
|
return this.element && this.element.ownerDocument || document;
|
|
126
125
|
}
|
|
127
126
|
/**
|
|
@@ -141,7 +140,7 @@ const o = class o extends n.Component {
|
|
|
141
140
|
*/
|
|
142
141
|
get value() {
|
|
143
142
|
const t = this.valueDuringOnChange !== void 0 ? this.valueDuringOnChange : this.props.value !== void 0 ? this.props.value : this.state.value;
|
|
144
|
-
return t !== null ?
|
|
143
|
+
return t !== null ? O(t) : null;
|
|
145
144
|
}
|
|
146
145
|
/**
|
|
147
146
|
* Gets the popup state of the DateTimePicker.
|
|
@@ -159,7 +158,7 @@ const o = class o extends n.Component {
|
|
|
159
158
|
* The mobile mode of the ComboBox.
|
|
160
159
|
*/
|
|
161
160
|
get mobileMode() {
|
|
162
|
-
return !!(this.state.windowWidth && this.state.windowWidth <=
|
|
161
|
+
return !!(this.state.windowWidth && this.state.windowWidth <= te && this.props.adaptive);
|
|
163
162
|
}
|
|
164
163
|
get min() {
|
|
165
164
|
return this.props.min !== void 0 ? this.props.min : o.defaultProps.min;
|
|
@@ -171,7 +170,7 @@ const o = class o extends n.Component {
|
|
|
171
170
|
* Represents the validity state into which the DateTimePicker is set.
|
|
172
171
|
*/
|
|
173
172
|
get validity() {
|
|
174
|
-
const t =
|
|
173
|
+
const t = ce(this.value, this.min, this.max) && we(this.value, this.props.minTime || fe, this.props.maxTime || me), i = this.props.validationMessage !== void 0, s = (!this.required || this.value !== null) && t, a = this.props.valid !== void 0 ? this.props.valid : s;
|
|
175
174
|
return {
|
|
176
175
|
customError: i,
|
|
177
176
|
rangeOverflow: this.value && this.max.getTime() < this.value.getTime() || !1,
|
|
@@ -203,7 +202,7 @@ const o = class o extends n.Component {
|
|
|
203
202
|
*/
|
|
204
203
|
componentDidMount() {
|
|
205
204
|
var t;
|
|
206
|
-
this.observerResize =
|
|
205
|
+
this.observerResize = P && 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);
|
|
207
206
|
}
|
|
208
207
|
/**
|
|
209
208
|
* @hidden
|
|
@@ -236,8 +235,8 @@ const o = class o extends n.Component {
|
|
|
236
235
|
format: v,
|
|
237
236
|
formatPlaceholder: w,
|
|
238
237
|
min: x,
|
|
239
|
-
max:
|
|
240
|
-
className:
|
|
238
|
+
max: k,
|
|
239
|
+
className: E,
|
|
241
240
|
width: F,
|
|
242
241
|
name: A,
|
|
243
242
|
validationMessage: R,
|
|
@@ -245,9 +244,9 @@ const o = class o extends n.Component {
|
|
|
245
244
|
validityStyles: z,
|
|
246
245
|
minTime: N,
|
|
247
246
|
maxTime: V,
|
|
248
|
-
ariaLabelledBy:
|
|
249
|
-
ariaDescribedBy:
|
|
250
|
-
popup:
|
|
247
|
+
ariaLabelledBy: _,
|
|
248
|
+
ariaDescribedBy: q,
|
|
249
|
+
popup: L = $,
|
|
251
250
|
unstyled: b,
|
|
252
251
|
autoFill: K,
|
|
253
252
|
twoDigitYearMax: U,
|
|
@@ -258,8 +257,8 @@ const o = class o extends n.Component {
|
|
|
258
257
|
allowCaretMode: Y
|
|
259
258
|
} = this.props, y = b && b.uDateTimePicker, S = !this.validityStyles || this.validity.valid, Z = {
|
|
260
259
|
id: u,
|
|
261
|
-
ariaLabelledBy:
|
|
262
|
-
ariaDescribedBy:
|
|
260
|
+
ariaLabelledBy: _,
|
|
261
|
+
ariaDescribedBy: q,
|
|
263
262
|
format: v,
|
|
264
263
|
formatPlaceholder: w,
|
|
265
264
|
disabled: l,
|
|
@@ -268,7 +267,7 @@ const o = class o extends n.Component {
|
|
|
268
267
|
validationMessage: R,
|
|
269
268
|
required: B,
|
|
270
269
|
min: x,
|
|
271
|
-
max:
|
|
270
|
+
max: k,
|
|
272
271
|
minTime: N,
|
|
273
272
|
maxTime: V,
|
|
274
273
|
name: A,
|
|
@@ -292,7 +291,7 @@ const o = class o extends n.Component {
|
|
|
292
291
|
autoSwitchKeys: X,
|
|
293
292
|
allowCaretMode: Y
|
|
294
293
|
}, T = /* @__PURE__ */ n.createElement(
|
|
295
|
-
|
|
294
|
+
ie,
|
|
296
295
|
{
|
|
297
296
|
onFocus: this.handleFocus,
|
|
298
297
|
onBlur: this.handleBlur,
|
|
@@ -315,7 +314,7 @@ const o = class o extends n.Component {
|
|
|
315
314
|
required: this.required,
|
|
316
315
|
invalid: !S
|
|
317
316
|
}),
|
|
318
|
-
|
|
317
|
+
E
|
|
319
318
|
),
|
|
320
319
|
onKeyDown: this.handleKeyDown,
|
|
321
320
|
style: { width: F },
|
|
@@ -336,12 +335,12 @@ const o = class o extends n.Component {
|
|
|
336
335
|
}
|
|
337
336
|
),
|
|
338
337
|
/* @__PURE__ */ n.createElement(
|
|
339
|
-
|
|
338
|
+
he,
|
|
340
339
|
{
|
|
341
340
|
tabIndex: -1,
|
|
342
341
|
type: "button",
|
|
343
342
|
icon: "calendar",
|
|
344
|
-
svgIcon:
|
|
343
|
+
svgIcon: re,
|
|
345
344
|
onMouseDown: this.handleIconMouseDown,
|
|
346
345
|
onClick: this.mobileMode ? void 0 : this.handleDateIconClick,
|
|
347
346
|
title: m(this).toLanguageString(
|
|
@@ -358,7 +357,7 @@ const o = class o extends n.Component {
|
|
|
358
357
|
}
|
|
359
358
|
),
|
|
360
359
|
/* @__PURE__ */ n.createElement(
|
|
361
|
-
|
|
360
|
+
L,
|
|
362
361
|
{
|
|
363
362
|
show: this.show,
|
|
364
363
|
animate: this.element !== null,
|
|
@@ -482,24 +481,24 @@ o.displayName = "DateTimePicker", o.propTypes = {
|
|
|
482
481
|
disabled: !1,
|
|
483
482
|
format: "g",
|
|
484
483
|
// general date and time pattern (short time): "M/d/y h:mm a" for en.
|
|
485
|
-
max:
|
|
486
|
-
min:
|
|
484
|
+
max: ue,
|
|
485
|
+
min: pe,
|
|
487
486
|
popupSettings: {},
|
|
488
487
|
tabIndex: 0,
|
|
489
488
|
weekNumber: !1,
|
|
490
489
|
validityStyles: !0,
|
|
491
490
|
cancelButton: !0,
|
|
492
|
-
dateInput:
|
|
491
|
+
dateInput: le,
|
|
493
492
|
size: "medium",
|
|
494
493
|
rounded: "medium",
|
|
495
494
|
fillMode: "solid",
|
|
496
495
|
autoFocus: !1
|
|
497
496
|
};
|
|
498
497
|
let f = o;
|
|
499
|
-
const De =
|
|
500
|
-
|
|
498
|
+
const De = se(), Se = oe(
|
|
499
|
+
ae(
|
|
501
500
|
De,
|
|
502
|
-
|
|
501
|
+
ne(f)
|
|
503
502
|
)
|
|
504
503
|
);
|
|
505
504
|
Se.displayName = "KendoReactDateTimePicker";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @license
|
|
3
3
|
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright ©
|
|
4
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @license
|
|
3
3
|
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright ©
|
|
4
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|