@progress/kendo-react-dateinputs 14.5.0-develop.9 → 15.0.0-develop.2
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/CalendarMcpWrapper.d.ts +16 -0
- package/CalendarMcpWrapper.js +8 -0
- package/CalendarMcpWrapper.mjs +18 -0
- package/DateRangePickerMcpWrapper.d.ts +16 -0
- package/DateRangePickerMcpWrapper.js +8 -0
- package/DateRangePickerMcpWrapper.mjs +18 -0
- package/DateTimePickerMcpWrapper.d.ts +16 -0
- package/DateTimePickerMcpWrapper.js +8 -0
- package/DateTimePickerMcpWrapper.mjs +18 -0
- package/README.md +4 -4
- package/TimePickerMcpWrapper.d.ts +16 -0
- package/TimePickerMcpWrapper.js +8 -0
- package/TimePickerMcpWrapper.mjs +18 -0
- package/calendar/components/Calendar.d.ts +6 -1
- package/calendar/components/Calendar.mjs +5 -5
- package/dateinput/DateInput.d.ts +11 -1
- package/dateinput/DateInput.js +1 -1
- package/dateinput/DateInput.mjs +202 -194
- package/datepicker/DatePicker.d.ts +6 -1
- package/datepicker/DatePicker.js +1 -1
- package/datepicker/DatePicker.mjs +233 -231
- package/daterangepicker/DateRangePicker.d.ts +6 -1
- package/daterangepicker/DateRangePicker.js +1 -1
- package/daterangepicker/DateRangePicker.mjs +65 -61
- package/datetimepicker/DateTimePicker.d.ts +7 -1
- package/datetimepicker/DateTimePicker.js +1 -1
- package/datetimepicker/DateTimePicker.mjs +106 -100
- package/dist/cdn/js/kendo-react-dateinputs.js +1 -1
- package/index.d.mts +12 -4
- package/index.d.ts +12 -4
- package/index.js +1 -1
- package/index.mjs +110 -105
- package/messages/index.d.ts +25 -0
- package/messages/index.js +1 -1
- package/messages/index.mjs +46 -36
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +2 -2
- package/package.json +8 -8
- package/timepicker/TimePicker.d.ts +7 -1
- package/timepicker/TimePicker.js +1 -1
- package/timepicker/TimePicker.mjs +90 -87
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
8
|
import { default as PropTypes } from 'prop-types';
|
|
9
|
-
import { FormComponent, FormComponentProps, FormComponentValidity, DateInputsClassStructure, AdaptiveModeContextType } from '@progress/kendo-react-common';
|
|
9
|
+
import { FormComponent, FormComponentProps, FormComponentValidity, DateInputsClassStructure, AdaptiveModeContextType, WebMcpProps } from '@progress/kendo-react-common';
|
|
10
10
|
import { LocalizationService } from '@progress/kendo-react-intl';
|
|
11
11
|
import { DateInputHandle, DateInputProps } from '../dateinput/DateInput.js';
|
|
12
12
|
import { TimeSelector } from './TimeSelector.js';
|
|
@@ -158,6 +158,11 @@ export interface TimePickerProps extends TimePickerSettings, FormComponentProps,
|
|
|
158
158
|
* This prop is provided by the withAdaptiveModeContext HOC to subscribe to AdaptiveModeContext.
|
|
159
159
|
*/
|
|
160
160
|
_adaptiveMode?: AdaptiveModeContextType;
|
|
161
|
+
/**
|
|
162
|
+
* Enables Web MCP tool registration for this component.
|
|
163
|
+
* Requires a parent `WebMcpProvider` from `@progress/kendo-react-webmcp`.
|
|
164
|
+
*/
|
|
165
|
+
webMcp?: boolean | WebMcpProps;
|
|
161
166
|
}
|
|
162
167
|
/**
|
|
163
168
|
* @hidden
|
|
@@ -221,6 +226,7 @@ export declare class TimePickerWithoutContext extends React.Component<TimePicker
|
|
|
221
226
|
appendTo: PropTypes.Requireable<any>;
|
|
222
227
|
popupClass: PropTypes.Requireable<string>;
|
|
223
228
|
}>>;
|
|
229
|
+
dateInput: PropTypes.Requireable<PropTypes.ReactComponentLike>;
|
|
224
230
|
show: PropTypes.Requireable<boolean>;
|
|
225
231
|
steps: PropTypes.Requireable<PropTypes.InferProps<{
|
|
226
232
|
hour: PropTypes.Requireable<number>;
|
package/timepicker/TimePicker.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 strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const X=require("react"),t=require("prop-types"),Z=require("@progress/kendo-react-popup"),y=require("@progress/kendo-date-math"),n=require("@progress/kendo-react-common"),$=require("@progress/kendo-svg-icons"),P=require("@progress/kendo-react-intl"),T=require("../package-metadata.js"),l=require("../messages/index.js"),J=require("../dateinput/DateInput.js"),Q=require("./TimeSelector.js"),p=require("../utils.js"),g=require("./utils.js"),Y=require("../hooks/usePickerFloatingLabel.js"),ee=require("@progress/kendo-react-buttons"),te=require("../common/AdaptiveMode.js"),ie=require("@progress/kendo-react-layout");function se(c){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const e in c)if(e!=="default"){const i=Object.getOwnPropertyDescriptor(c,e);Object.defineProperty(s,e,i.get?i:{enumerable:!0,get:()=>c[e]})}}return s.default=c,Object.freeze(s)}const a=se(X),r=class r extends a.Component{constructor(s){super(s),this._element=null,this._dateInput=a.createRef(),this._timeSelector=null,this.shouldFocusDateInput=!1,this.prevShow=!1,this.showLicenseWatermark=!1,this.handleKendoPasteValue=e=>{if(e instanceof Date&&!isNaN(e.getTime())){this.applyKendoPasteTime(e);return}const i=e!=null?String(e):"";if(!i)return;const o=new Date(i);isNaN(o.getTime())||this.applyKendoPasteTime(o)},this.applyKendoPasteTime=e=>{const i=this.normalizeTime(e);if(!g.isInRange(i,this.min,this.max))return;const o=new Event("change",{bubbles:!0}),h={target:this._element,currentTarget:this._element,nativeEvent:o};this.handleValueChange({syntheticEvent:h,nativeEvent:o,value:i})},this.focus=()=>{this.dateInput&&this.dateInput.focus()},this.renderTimeSelector=()=>{const{smoothScroll:e,cancelButton:i,nowButton:o,disabled:h,format:d,steps:u,unstyled:f}=this.props;return a.createElement(Q.TimeSelector,{ref:this.setTimeSelectorRef,mobileMode:this.mobileMode,show:this.show,cancelButton:i,disabled:h,nowButton:o,format:d,min:this.min,max:this.max,steps:u,smoothScroll:e,value:this.value,footer:!this.mobileMode,handleTimeChange:this.mobileMode&&this.handleTimeChange,onChange:this.handleValueChange,onReject:this.handleValueReject,unstyled:f})},this.renderPopup=()=>{const{popupClass:e,...i}=this.popupSettings,{unstyled:o}=this.props,h=o&&o.uTimePicker,d=n.classNames(e),u={popupClass:n.uTimePicker.popup({c:h}),show:this.show,animate:this.element!==null,anchor:this.element,className:d,id:this._popupId,anchorAlign:{horizontal:"left",vertical:"bottom"},popupAlign:{horizontal:"left",vertical:"top"},...i};return this.props.popup?a.createElement(this.props.popup,{...u},this.renderTimeSelector()):a.createElement(Z.Popup,{...u},this.renderTimeSelector())},this.renderAdaptivePopup=()=>{const{windowWidth:e=0}=this.state,i={expand:this.show,onClose:this.handleBlur,title:this.props.adaptiveTitle||this.props.label,subTitle:this.props.adaptiveSubtitle,windowWidth:e,footer:{cancelText:this.localizationService.toLanguageString(l.toggleClock,l.messages[l.timePickerCancel]),onCancel:this.handleValueReject,applyText:this.localizationService.toLanguageString(l.timePickerSet,l.messages[l.timePickerSet]),onApply:o=>this.handleValueChange(o)}};return a.createElement(te.AdaptiveMode,{...i},a.createElement(ie.ActionSheetContent,null,this.renderTimeSelector()))},this.setTimeSelectorRef=e=>{this._timeSelector=e},this.nextValue=(e,i)=>e.value!==void 0?e.value:i.value,this.nextShow=(e,i)=>e.show!==void 0?e.show:i.show,this.handleInputValueChange=e=>{const i=this.mergeTime(e.value);this.handleValueChange({...e,value:i})},this.handleTimeChange=e=>{this.setState({candidate:e.time})},this.handleValueChange=e=>{this.setState({value:y.cloneDate(e.value||this.state.candidate)}),this.valueDuringOnChange=e.value,this.showDuringOnChange=!1,this.mobileMode||(this.shouldFocusDateInput=!0);const{onChange:i}=this.props,o=this.state.candidate||this.value;i&&i.call(void 0,{syntheticEvent:e.syntheticEvent,nativeEvent:e.nativeEvent,value:o,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.handleValueReject=e=>{this.setShow(!1)},this.handleClick=e=>{this.props.disabled||(this.shouldFocusDateInput=!0,this.setShow(!this.show))},this.handleIconMouseDown=e=>{e.preventDefault()},this.handleKeyDown=e=>{const{altKey:i,keyCode:o}=e;if(o===n.Keys.esc){this.shouldFocusDateInput=!0,this.setShow(!1);return}i&&(o===n.Keys.up||o===n.Keys.down)&&(e.preventDefault(),e.stopPropagation(),this.shouldFocusDateInput=o===n.Keys.up,this.setShow(o===n.Keys.down))},this.showLicenseWatermark=!n.validatePackage(T.packageMetadata,{component:"TimePicker"}),this.licenseMessage=n.getLicenseMessage(T.packageMetadata),this.state={value:this.props.defaultValue||r.defaultProps.defaultValue,show:this.props.defaultShow||r.defaultProps.defaultShow,focused:!1,candidate:null},this.normalizeTime=this.normalizeTime.bind(this),this.setShow=this.setShow.bind(this),this.mergeTime=this.mergeTime.bind(this)}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 dateInput(){return this._dateInput.current}get timeSelector(){return this._timeSelector}get value(){const s=this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value;return s!==null?y.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 validity(){const s=this.value&&this.normalizeTime(this.value),e=this.normalizeTime(this.min),i=this.normalizeTime(this.max),o=g.isInRange(s,e,i),h=this.props.validationMessage!==void 0,d=(!this.required||this.value!==null)&&o,u=this.props.valid!==void 0?this.props.valid:d;return{customError:h,rangeOverflow:g.isBiggerThanMax(s,i),rangeUnderflow:g.isSmallerThanMin(s,e),valid:u,valueMissing:this.value===null}}get mobileMode(){var e;return!!(this.state.windowWidth&&this.props._adaptiveMode&&this.state.windowWidth<=((e=this.props._adaptiveMode)==null?void 0:e.medium)&&this.props.adaptive)}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:r.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:!1}get popupSettings(){return this.props.popupSettings||r.defaultProps.popupSettings}get min(){return this.props.min!==void 0?this.props.min:r.defaultProps.min}get max(){return this.props.max!==void 0?this.props.max:r.defaultProps.max}get dateInputComp(){return this.props.dateInput||r.defaultProps.dateInput}get localizationService(){return P.provideLocalizationService(this)}componentDidMount(){var e;this.observerResize=n.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.show&&this.forceUpdate(),(e=this.document)!=null&&e.body&&this.observerResize&&this.observerResize.observe(this.document.body);const s=this.props.name||this.props.id;this.KendoPasteSubscription=n.subscribeToKendoPaste(this._element,{fieldName:s,onValueChange:i=>{this.handleKendoPasteValue(i)}})}componentDidUpdate(){this._timeSelector&&this.show&&!this.prevShow&&this._timeSelector.focusActiveList(),this.mobileMode&&this.show&&!this.prevShow&&setTimeout(()=>{this._timeSelector&&this._timeSelector.focusActiveList()},300),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,e;(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.disconnect(),(e=this.KendoPasteSubscription)==null||e.unsubscribe()}render(){const{size:s=r.defaultProps.size,rounded:e=r.defaultProps.rounded,fillMode:i=r.defaultProps.fillMode,disabled:o,tabIndex:h,title:d,id:u,className:f,format:I,formatPlaceholder:k,width:D,name:O,steps:z,validationMessage:x,required:R,validityStyles:q,ariaLabelledBy:E,ariaDescribedBy:N,unstyled:v,enableMouseWheel:B,autoCorrectParts:K,autoSwitchParts:V,autoSwitchKeys:A,allowCaretMode:F,inputAttributes:_}=this.props,b=v&&v.uTimePicker,w=!this.validityStyles||this.validity.valid,L={disabled:o,format:I,formatPlaceholder:k,id:u,ariaLabelledBy:E,ariaDescribedBy:N,max:this.normalizeTime(this.max),min:this.normalizeTime(this.min),name:O,onChange:this.handleInputValueChange,required:R,steps:z,tabIndex:this.show?-1:h,title:d,valid:this.validity.valid,validationMessage:x,validityStyles:q,value:this.value&&this.normalizeTime(this.value),label:void 0,placeholder:this.state.focused?null:this.props.placeholder,ariaHasPopup:"dialog",ariaExpanded:this.show,enableMouseWheel:B,autoCorrectParts:K,autoSwitchParts:V,autoSwitchKeys:A,allowCaretMode:F,inputAttributes:_},j=this.localizationService.toLanguageString(l.toggleClock,l.messages[l.toggleClock]),W=this.localizationService.toLanguageString(l.toggleTimeSelector,l.messages[l.toggleTimeSelector]),S=a.createElement(n.AsyncFocusBlur,{onFocus:this.handleFocus,onBlur:this.mobileMode?void 0:this.handleBlur,onSyncBlur:this.props.onBlur,onSyncFocus:this.props.onFocus},({onFocus:U,onBlur:H})=>a.createElement(a.Fragment,null,a.createElement("span",{ref:G=>{this._element=G},className:n.classNames(n.uTimePicker.wrapper({c:b,size:s,rounded:e,fillMode:i,invalid:!w,required:this.required,disabled:o}),f),onKeyDown:this.handleKeyDown,style:{width:D},onFocus:this.mobileMode?this.handleClick:U,onBlur:H,onClick:this.mobileMode?this.handleClick:void 0},a.createElement(this.dateInputComp,{_ref:this._dateInput,ariaRole:"combobox",ariaControls:this.show?this._popupId:void 0,...L}),a.createElement(ee.Button,{tabIndex:-1,type:"button",icon:"clock",svgIcon:$.clockIcon,onMouseDown:this.handleIconMouseDown,onClick:this.mobileMode?void 0:this.handleClick,title:W,className:n.classNames(n.uTimePicker.inputButton({c:b})),fillMode:i,"aria-label":j}),!this.mobileMode&&this.renderPopup()),this.mobileMode&&this.renderAdaptivePopup(),this.showLicenseWatermark&&a.createElement(n.WatermarkOverlay,{message:this.licenseMessage})));return this.props.label?a.createElement(Y.PickerFloatingLabel,{dateInput:this._dateInput,label:this.props.label,editorId:u,editorValid:w,editorDisabled:this.props.disabled,children:S,style:{width:this.props.width}}):S}normalizeTime(s){return p.setTime(p.MIDNIGHT_DATE,s)}setShow(s){const{onOpen:e,onClose:i}=this.props;this.show!==s&&(this.setState({show:s}),s&&e&&e.call(void 0,{target:this}),!s&&i&&i.call(void 0,{target:this}))}mergeTime(s){return this.value&&s?p.setTime(this.value,s):s}calculateMedia(s){for(const e of s)this.setState({windowWidth:e.target.clientWidth})}};r.displayName="TimePicker",r.propTypes={className:t.string,cancelButton:t.bool,nowButton:t.bool,defaultShow:t.bool,defaultValue:t.instanceOf(Date),disabled:t.bool,format:t.oneOfType([t.string,t.shape({skeleton:t.string,pattern:t.string,date:t.oneOf(["short","medium","long","full"]),time:t.oneOf(["short","medium","long","full"]),datetime:t.oneOf(["short","medium","long","full"]),era:t.oneOf(["narrow","short","long"]),year:t.oneOf(["numeric","2-digit"]),month:t.oneOf(["numeric","2-digit","narrow","short","long"]),day:t.oneOf(["numeric","2-digit"]),weekday:t.oneOf(["narrow","short","long"]),hour:t.oneOf(["numeric","2-digit"]),hour12:t.bool,minute:t.oneOf(["numeric","2-digit"]),second:t.oneOf(["numeric","2-digit"]),timeZoneName:t.oneOf(["short","long"])})]),formatPlaceholder:t.oneOfType([t.oneOf(["wide","narrow","short","formatPattern"]),t.shape({year:t.string,month:t.string,day:t.string,hour:t.string,minute:t.string,second:t.string})]),id:t.string,ariaLabelledBy:t.string,ariaDescribedBy:t.string,min:t.instanceOf(Date),max:t.instanceOf(Date),name:t.string,popupSettings:t.shape({animate:t.bool,appendTo:t.any,popupClass:t.string}),show:t.bool,steps:t.shape({hour:t.number,minute:t.number,second:t.number}),smoothScroll:t.bool,tabIndex:t.number,title:t.string,value:t.instanceOf(Date),width:t.oneOfType([t.number,t.string]),validationMessage:t.string,required:t.bool,validate:t.bool,valid:t.bool,size:t.oneOf(["small","medium","large"]),rounded:t.oneOf(["small","medium","large","full","none"]),fillMode:t.oneOf(["solid","flat","outline"]),inputAttributes:t.object},r.defaultProps={defaultShow:!1,defaultValue:null,disabled:!1,format:"t",max:p.MAX_TIME,min:p.MIN_TIME,popupSettings:{},tabIndex:0,steps:{},validityStyles:!0,dateInput:J.DateInput,size:void 0,rounded:void 0,fillMode:void 0};let m=r;const C=n.createPropsContext(),M=n.withIdHOC(n.withPropsContext(C,n.withUnstyledHOC(n.withAdaptiveModeContext(m))));M.displayName="KendoReactTimePicker";P.registerForLocalization(m);exports.TimePicker=M;exports.TimePickerPropsContext=C;exports.TimePickerWithoutContext=m;
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Z=require("react"),e=require("prop-types"),$=require("@progress/kendo-react-popup"),y=require("@progress/kendo-date-math"),n=require("@progress/kendo-react-common"),J=require("@progress/kendo-svg-icons"),P=require("@progress/kendo-react-intl"),T=require("../package-metadata.js"),a=require("../messages/index.js"),Q=require("../dateinput/DateInput.js"),Y=require("./TimeSelector.js"),p=require("../utils.js"),g=require("./utils.js"),ee=require("../hooks/usePickerFloatingLabel.js"),te=require("@progress/kendo-react-buttons"),ie=require("../common/AdaptiveMode.js"),se=require("@progress/kendo-react-layout");function oe(c){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const t in c)if(t!=="default"){const i=Object.getOwnPropertyDescriptor(c,t);Object.defineProperty(s,t,i.get?i:{enumerable:!0,get:()=>c[t]})}}return s.default=c,Object.freeze(s)}const r=oe(Z),l=class l extends r.Component{constructor(s){super(s),this._element=null,this._dateInput=r.createRef(),this._timeSelector=null,this.shouldFocusDateInput=!1,this.prevShow=!1,this.showLicenseWatermark=!1,this.handleKendoPasteValue=t=>{if(t instanceof Date&&!isNaN(t.getTime())){this.applyKendoPasteTime(t);return}const i=t!=null?String(t):"";if(!i)return;const o=new Date(i);isNaN(o.getTime())||this.applyKendoPasteTime(o)},this.applyKendoPasteTime=t=>{const i=this.normalizeTime(t);if(!g.isInRange(i,this.min,this.max))return;const o=new Event("change",{bubbles:!0}),h={target:this._element,currentTarget:this._element,nativeEvent:o};this.handleValueChange({syntheticEvent:h,nativeEvent:o,value:i})},this.focus=()=>{this.dateInput&&this.dateInput.focus()},this.renderTimeSelector=()=>{const{smoothScroll:t,cancelButton:i,nowButton:o,disabled:h,format:d,steps:u,unstyled:f}=this.props;return r.createElement(Y.TimeSelector,{ref:this.setTimeSelectorRef,mobileMode:this.mobileMode,show:this.show,cancelButton:i,disabled:h,nowButton:o,format:d,min:this.min,max:this.max,steps:u,smoothScroll:t,value:this.value,footer:!this.mobileMode,handleTimeChange:this.mobileMode&&this.handleTimeChange,onChange:this.handleValueChange,onReject:this.handleValueReject,unstyled:f})},this.renderPopup=()=>{const{popupClass:t,...i}=this.popupSettings,{unstyled:o}=this.props,h=o&&o.uTimePicker,d=n.classNames(t),u={popupClass:n.uTimePicker.popup({c:h}),show:this.show,animate:this.element!==null,anchor:this.element,className:d,id:this._popupId,anchorAlign:{horizontal:"left",vertical:"bottom"},popupAlign:{horizontal:"left",vertical:"top"},...i};return this.props.popup?r.createElement(this.props.popup,{...u},this.renderTimeSelector()):r.createElement($.Popup,{...u},this.renderTimeSelector())},this.renderAdaptivePopup=()=>{const{windowWidth:t=0}=this.state,i={expand:this.show,onClose:this.handleBlur,title:this.props.adaptiveTitle||this.props.label,subTitle:this.props.adaptiveSubtitle,windowWidth:t,footer:{cancelText:this.localizationService.toLanguageString(a.toggleClock,a.messages[a.timePickerCancel]),onCancel:this.handleValueReject,applyText:this.localizationService.toLanguageString(a.timePickerSet,a.messages[a.timePickerSet]),onApply:o=>this.handleValueChange(o)}};return r.createElement(ie.AdaptiveMode,{...i},r.createElement(se.ActionSheetContent,null,this.renderTimeSelector()))},this.setTimeSelectorRef=t=>{this._timeSelector=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.handleInputValueChange=t=>{const i=this.mergeTime(t.value);this.handleValueChange({...t,value:i})},this.handleTimeChange=t=>{this.setState({candidate:t.time})},this.handleValueChange=t=>{this.setState({value:y.cloneDate(t.value||this.state.candidate)}),this.valueDuringOnChange=t.value,this.showDuringOnChange=!1,this.mobileMode||(this.shouldFocusDateInput=!0);const{onChange:i}=this.props,o=this.valueDuringOnChange!==void 0?this.value:this.state.candidate||this.value;i&&i.call(void 0,{syntheticEvent:t.syntheticEvent,nativeEvent:t.nativeEvent,value:o,show:this.show,target:this}),this.valueDuringOnChange=void 0,this.showDuringOnChange=void 0,this.setState({candidate:null}),this.setShow(!1)},this.handleFocus=()=>{this.setState({focused:!0})},this.handleBlur=()=>{this.setState({focused:!1}),this.setShow(!1)},this.handleValueReject=t=>{this.setShow(!1)},this.handleClick=t=>{this.props.disabled||(this.shouldFocusDateInput=!0,this.setShow(!this.show))},this.handleIconMouseDown=t=>{t.preventDefault()},this.handleKeyDown=t=>{const{altKey:i,keyCode:o}=t;if(o===n.Keys.esc){this.shouldFocusDateInput=!0,this.setShow(!1);return}i&&(o===n.Keys.up||o===n.Keys.down)&&(t.preventDefault(),t.stopPropagation(),this.shouldFocusDateInput=o===n.Keys.up,this.setShow(o===n.Keys.down))},this.showLicenseWatermark=!n.validatePackage(T.packageMetadata,{component:"TimePicker"}),this.licenseMessage=n.getLicenseMessage(T.packageMetadata),this.state={value:this.props.defaultValue||l.defaultProps.defaultValue,show:this.props.defaultShow||l.defaultProps.defaultShow,focused:!1,candidate:null},this.normalizeTime=this.normalizeTime.bind(this),this.setShow=this.setShow.bind(this),this.mergeTime=this.mergeTime.bind(this)}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 dateInput(){return this._dateInput.current}get timeSelector(){return this._timeSelector}get value(){const s=this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value;return s!==null?y.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 validity(){const s=this.value&&this.normalizeTime(this.value),t=this.normalizeTime(this.min),i=this.normalizeTime(this.max),o=g.isInRange(s,t,i),h=this.props.validationMessage!==void 0,d=(!this.required||this.value!==null)&&o,u=this.props.valid!==void 0?this.props.valid:d;return{customError:h,rangeOverflow:g.isBiggerThanMax(s,i),rangeUnderflow:g.isSmallerThanMin(s,t),valid:u,valueMissing:this.value===null}}get mobileMode(){var t;return!!(this.state.windowWidth&&this.props._adaptiveMode&&this.state.windowWidth<=((t=this.props._adaptiveMode)==null?void 0:t.medium)&&this.props.adaptive)}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:l.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:!1}get popupSettings(){return this.props.popupSettings||l.defaultProps.popupSettings}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 dateInputComp(){return this.props.dateInput||l.defaultProps.dateInput}get localizationService(){return P.provideLocalizationService(this)}componentDidMount(){var t;this.observerResize=n.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);const s=this.props.name||this.props.id;this.KendoPasteSubscription=n.subscribeToKendoPaste(this._element,{fieldName:s,onValueChange:i=>{this.handleKendoPasteValue(i)}})}componentDidUpdate(){this._timeSelector&&this.show&&!this.prevShow&&this._timeSelector.focusActiveList(),this.mobileMode&&this.show&&!this.prevShow&&setTimeout(()=>{this._timeSelector&&this._timeSelector.focusActiveList()},300),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,t;(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.disconnect(),(t=this.KendoPasteSubscription)==null||t.unsubscribe()}render(){const{size:s=l.defaultProps.size,rounded:t=l.defaultProps.rounded,fillMode:i=l.defaultProps.fillMode,disabled:o,tabIndex:h,title:d,id:u,className:f,format:I,formatPlaceholder:k,width:D,name:O,steps:z,validationMessage:x,required:R,validityStyles:q,ariaLabelledBy:E,ariaDescribedBy:L,unstyled:v,enableMouseWheel:N,autoCorrectParts:B,autoSwitchParts:K,autoSwitchKeys:V,allowCaretMode:A,inputAttributes:F}=this.props,b=v&&v.uTimePicker,w=!this.validityStyles||this.validity.valid,_=this.localizationService.toLanguageString(a.selectTime,a.messages[a.selectTime]),j={disabled:o,format:I,formatPlaceholder:k,id:u,ariaLabelledBy:E,ariaDescribedBy:L,ariaLabel:_,max:this.normalizeTime(this.max),min:this.normalizeTime(this.min),name:O,onChange:this.handleInputValueChange,required:R,steps:z,tabIndex:this.show?-1:h,title:d,valid:this.validity.valid,validationMessage:x,validityStyles:q,value:this.value&&this.normalizeTime(this.value),label:void 0,placeholder:this.state.focused?null:this.props.placeholder,ariaHasPopup:"dialog",ariaExpanded:this.show,enableMouseWheel:N,autoCorrectParts:B,autoSwitchParts:K,autoSwitchKeys:V,allowCaretMode:A,inputAttributes:F},W=this.localizationService.toLanguageString(a.toggleClock,a.messages[a.toggleClock]),U=this.localizationService.toLanguageString(a.toggleTimeSelector,a.messages[a.toggleTimeSelector]),S=r.createElement(n.AsyncFocusBlur,{onFocus:this.handleFocus,onBlur:this.mobileMode?void 0:this.handleBlur,onSyncBlur:this.props.onBlur,onSyncFocus:this.props.onFocus},({onFocus:H,onBlur:G})=>r.createElement(r.Fragment,null,r.createElement("span",{ref:X=>{this._element=X},className:n.classNames(n.uTimePicker.wrapper({c:b,size:s,rounded:t,fillMode:i,invalid:!w,required:this.required,disabled:o}),{"k-focus":this.state.focused},f),onKeyDown:this.handleKeyDown,style:{width:D},onFocus:this.mobileMode?this.handleClick:H,onBlur:G,onClick:this.mobileMode?this.handleClick:void 0},r.createElement(this.dateInputComp,{_ref:this._dateInput,ariaRole:"combobox",ariaControls:this.show?this._popupId:void 0,...j}),r.createElement(te.Button,{tabIndex:-1,type:"button",icon:"clock",svgIcon:J.clockIcon,onMouseDown:this.handleIconMouseDown,onClick:this.mobileMode?void 0:this.handleClick,title:U,className:n.classNames(n.uTimePicker.inputButton({c:b})),fillMode:i,"aria-label":W}),!this.mobileMode&&this.renderPopup()),this.mobileMode&&this.renderAdaptivePopup(),this.showLicenseWatermark&&r.createElement(n.WatermarkOverlay,{message:this.licenseMessage})));return this.props.label?r.createElement(ee.PickerFloatingLabel,{dateInput:this._dateInput,label:this.props.label,editorId:u,editorValid:w,editorDisabled:this.props.disabled,children:S,style:{width:this.props.width}}):S}normalizeTime(s){return p.setTime(p.MIDNIGHT_DATE,s)}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?p.setTime(this.value,s):s}calculateMedia(s){for(const t of s)this.setState({windowWidth:t.target.clientWidth})}};l.displayName="TimePicker",l.propTypes={className:e.string,cancelButton:e.bool,nowButton:e.bool,defaultShow:e.bool,defaultValue:e.instanceOf(Date),disabled:e.bool,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}),dateInput:e.elementType,show:e.bool,steps:e.shape({hour:e.number,minute:e.number,second:e.number}),smoothScroll:e.bool,tabIndex:e.number,title:e.string,value:e.instanceOf(Date),width:e.oneOfType([e.number,e.string]),validationMessage:e.string,required:e.bool,validate:e.bool,valid:e.bool,size:e.oneOf(["small","medium","large"]),rounded:e.oneOf(["small","medium","large","full","none"]),fillMode:e.oneOf(["solid","flat","outline"]),inputAttributes:e.object},l.defaultProps={defaultShow:!1,defaultValue:null,disabled:!1,format:"t",max:p.MAX_TIME,min:p.MIN_TIME,popupSettings:{},tabIndex:0,steps:{},validityStyles:!0,dateInput:Q.DateInputInner,size:void 0,rounded:void 0,fillMode:void 0};let m=l;const C=n.createPropsContext(),M=n.withIdHOC(n.withPropsContext(C,n.withUnstyledHOC(n.withAdaptiveModeContext(m))));M.displayName="KendoReactTimePicker";P.registerForLocalization(m);exports.TimePicker=M;exports.TimePickerPropsContext=C;exports.TimePickerWithoutContext=m;
|
|
@@ -7,21 +7,21 @@
|
|
|
7
7
|
*/
|
|
8
8
|
import * as n from "react";
|
|
9
9
|
import e from "prop-types";
|
|
10
|
-
import { Popup as
|
|
10
|
+
import { Popup as Y } from "@progress/kendo-react-popup";
|
|
11
11
|
import { cloneDate as y } from "@progress/kendo-date-math";
|
|
12
|
-
import {
|
|
13
|
-
import { clockIcon as
|
|
14
|
-
import { provideLocalizationService as
|
|
12
|
+
import { createPropsContext as $, classNames as m, uTimePicker as g, Keys as d, validatePackage as ee, getLicenseMessage as te, canUseDOM as T, subscribeToKendoPaste as ie, AsyncFocusBlur as se, WatermarkOverlay as oe, withIdHOC as ne, withPropsContext as ae, withUnstyledHOC as re, withAdaptiveModeContext as le } from "@progress/kendo-react-common";
|
|
13
|
+
import { clockIcon as he } from "@progress/kendo-svg-icons";
|
|
14
|
+
import { provideLocalizationService as de, registerForLocalization as ue } from "@progress/kendo-react-intl";
|
|
15
15
|
import { packageMetadata as C } from "../package-metadata.mjs";
|
|
16
|
-
import { timePickerSet as I, messages as u, toggleClock as f, timePickerCancel as
|
|
17
|
-
import {
|
|
18
|
-
import { TimeSelector as
|
|
19
|
-
import { MIN_TIME as
|
|
20
|
-
import { isInRange as
|
|
21
|
-
import { PickerFloatingLabel as
|
|
22
|
-
import { Button as
|
|
23
|
-
import { AdaptiveMode as
|
|
24
|
-
import { ActionSheetContent as
|
|
16
|
+
import { timePickerSet as I, messages as u, toggleClock as f, timePickerCancel as pe, selectTime as M, toggleTimeSelector as P } from "../messages/index.mjs";
|
|
17
|
+
import { DateInputInner as ce } from "../dateinput/DateInput.mjs";
|
|
18
|
+
import { TimeSelector as me } from "./TimeSelector.mjs";
|
|
19
|
+
import { MIN_TIME as ge, MAX_TIME as fe, setTime as D, MIDNIGHT_DATE as ve } from "../utils.mjs";
|
|
20
|
+
import { isInRange as O, isSmallerThanMin as we, isBiggerThanMax as be } from "./utils.mjs";
|
|
21
|
+
import { PickerFloatingLabel as Se } from "../hooks/usePickerFloatingLabel.mjs";
|
|
22
|
+
import { Button as ye } from "@progress/kendo-react-buttons";
|
|
23
|
+
import { AdaptiveMode as Te } from "../common/AdaptiveMode.mjs";
|
|
24
|
+
import { ActionSheetContent as Ce } from "@progress/kendo-react-layout";
|
|
25
25
|
const a = class a extends n.Component {
|
|
26
26
|
constructor(s) {
|
|
27
27
|
super(s), this._element = null, this._dateInput = n.createRef(), this._timeSelector = null, this.shouldFocusDateInput = !1, this.prevShow = !1, this.showLicenseWatermark = !1, this.handleKendoPasteValue = (t) => {
|
|
@@ -36,7 +36,7 @@ const a = class a extends n.Component {
|
|
|
36
36
|
isNaN(o.getTime()) || this.applyKendoPasteTime(o);
|
|
37
37
|
}, this.applyKendoPasteTime = (t) => {
|
|
38
38
|
const i = this.normalizeTime(t);
|
|
39
|
-
if (!
|
|
39
|
+
if (!O(i, this.min, this.max))
|
|
40
40
|
return;
|
|
41
41
|
const o = new Event("change", { bubbles: !0 }), r = {
|
|
42
42
|
target: this._element,
|
|
@@ -51,9 +51,9 @@ const a = class a extends n.Component {
|
|
|
51
51
|
}, this.focus = () => {
|
|
52
52
|
this.dateInput && this.dateInput.focus();
|
|
53
53
|
}, this.renderTimeSelector = () => {
|
|
54
|
-
const { smoothScroll: t, cancelButton: i, nowButton: o, disabled: r, format: h, steps: l, unstyled:
|
|
54
|
+
const { smoothScroll: t, cancelButton: i, nowButton: o, disabled: r, format: h, steps: l, unstyled: c } = this.props;
|
|
55
55
|
return /* @__PURE__ */ n.createElement(
|
|
56
|
-
|
|
56
|
+
me,
|
|
57
57
|
{
|
|
58
58
|
ref: this.setTimeSelectorRef,
|
|
59
59
|
mobileMode: this.mobileMode,
|
|
@@ -71,11 +71,11 @@ const a = class a extends n.Component {
|
|
|
71
71
|
handleTimeChange: this.mobileMode && this.handleTimeChange,
|
|
72
72
|
onChange: this.handleValueChange,
|
|
73
73
|
onReject: this.handleValueReject,
|
|
74
|
-
unstyled:
|
|
74
|
+
unstyled: c
|
|
75
75
|
}
|
|
76
76
|
);
|
|
77
77
|
}, this.renderPopup = () => {
|
|
78
|
-
const { popupClass: t, ...i } = this.popupSettings, { unstyled: o } = this.props, r = o && o.uTimePicker, h =
|
|
78
|
+
const { popupClass: t, ...i } = this.popupSettings, { unstyled: o } = this.props, r = o && o.uTimePicker, h = m(t), l = {
|
|
79
79
|
popupClass: g.popup({ c: r }),
|
|
80
80
|
show: this.show,
|
|
81
81
|
animate: this.element !== null,
|
|
@@ -92,7 +92,7 @@ const a = class a extends n.Component {
|
|
|
92
92
|
},
|
|
93
93
|
...i
|
|
94
94
|
};
|
|
95
|
-
return this.props.popup ? /* @__PURE__ */ n.createElement(this.props.popup, { ...l }, this.renderTimeSelector()) : /* @__PURE__ */ n.createElement(
|
|
95
|
+
return this.props.popup ? /* @__PURE__ */ n.createElement(this.props.popup, { ...l }, this.renderTimeSelector()) : /* @__PURE__ */ n.createElement(Y, { ...l }, this.renderTimeSelector());
|
|
96
96
|
}, this.renderAdaptivePopup = () => {
|
|
97
97
|
const { windowWidth: t = 0 } = this.state, i = {
|
|
98
98
|
expand: this.show,
|
|
@@ -101,13 +101,13 @@ const a = class a extends n.Component {
|
|
|
101
101
|
subTitle: this.props.adaptiveSubtitle,
|
|
102
102
|
windowWidth: t,
|
|
103
103
|
footer: {
|
|
104
|
-
cancelText: this.localizationService.toLanguageString(f, u[
|
|
104
|
+
cancelText: this.localizationService.toLanguageString(f, u[pe]),
|
|
105
105
|
onCancel: this.handleValueReject,
|
|
106
106
|
applyText: this.localizationService.toLanguageString(I, u[I]),
|
|
107
107
|
onApply: (o) => this.handleValueChange(o)
|
|
108
108
|
}
|
|
109
109
|
};
|
|
110
|
-
return /* @__PURE__ */ n.createElement(
|
|
110
|
+
return /* @__PURE__ */ n.createElement(Te, { ...i }, /* @__PURE__ */ n.createElement(Ce, null, this.renderTimeSelector()));
|
|
111
111
|
}, this.setTimeSelectorRef = (t) => {
|
|
112
112
|
this._timeSelector = t;
|
|
113
113
|
}, 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.handleInputValueChange = (t) => {
|
|
@@ -119,14 +119,14 @@ const a = class a extends n.Component {
|
|
|
119
119
|
this.setState({
|
|
120
120
|
value: y(t.value || this.state.candidate)
|
|
121
121
|
}), this.valueDuringOnChange = t.value, this.showDuringOnChange = !1, this.mobileMode || (this.shouldFocusDateInput = !0);
|
|
122
|
-
const { onChange: i } = this.props, o = this.state.candidate || this.value;
|
|
122
|
+
const { onChange: i } = this.props, o = this.valueDuringOnChange !== void 0 ? this.value : this.state.candidate || this.value;
|
|
123
123
|
i && i.call(void 0, {
|
|
124
124
|
syntheticEvent: t.syntheticEvent,
|
|
125
125
|
nativeEvent: t.nativeEvent,
|
|
126
126
|
value: o,
|
|
127
127
|
show: this.show,
|
|
128
128
|
target: this
|
|
129
|
-
}), this.valueDuringOnChange = void 0, this.showDuringOnChange = void 0, this.setShow(!1);
|
|
129
|
+
}), this.valueDuringOnChange = void 0, this.showDuringOnChange = void 0, this.setState({ candidate: null }), this.setShow(!1);
|
|
130
130
|
}, this.handleFocus = () => {
|
|
131
131
|
this.setState({ focused: !0 });
|
|
132
132
|
}, this.handleBlur = () => {
|
|
@@ -144,7 +144,7 @@ const a = class a extends n.Component {
|
|
|
144
144
|
return;
|
|
145
145
|
}
|
|
146
146
|
i && (o === d.up || o === d.down) && (t.preventDefault(), t.stopPropagation(), this.shouldFocusDateInput = o === d.up, this.setShow(o === d.down));
|
|
147
|
-
}, this.showLicenseWatermark = !
|
|
147
|
+
}, this.showLicenseWatermark = !ee(C, { component: "TimePicker" }), this.licenseMessage = te(C), this.state = {
|
|
148
148
|
value: this.props.defaultValue || a.defaultProps.defaultValue,
|
|
149
149
|
show: this.props.defaultShow || a.defaultProps.defaultShow,
|
|
150
150
|
focused: !1,
|
|
@@ -199,11 +199,11 @@ const a = class a extends n.Component {
|
|
|
199
199
|
* Represents the validity state into which the TimePicker is set.
|
|
200
200
|
*/
|
|
201
201
|
get validity() {
|
|
202
|
-
const s = this.value && this.normalizeTime(this.value), t = this.normalizeTime(this.min), i = this.normalizeTime(this.max), o =
|
|
202
|
+
const s = this.value && this.normalizeTime(this.value), t = this.normalizeTime(this.min), i = this.normalizeTime(this.max), o = O(s, t, i), r = this.props.validationMessage !== void 0, h = (!this.required || this.value !== null) && o, l = this.props.valid !== void 0 ? this.props.valid : h;
|
|
203
203
|
return {
|
|
204
204
|
customError: r,
|
|
205
|
-
rangeOverflow:
|
|
206
|
-
rangeUnderflow:
|
|
205
|
+
rangeOverflow: be(s, i),
|
|
206
|
+
rangeUnderflow: we(s, t),
|
|
207
207
|
valid: l,
|
|
208
208
|
valueMissing: this.value === null
|
|
209
209
|
};
|
|
@@ -240,7 +240,7 @@ const a = class a extends n.Component {
|
|
|
240
240
|
return this.props.dateInput || a.defaultProps.dateInput;
|
|
241
241
|
}
|
|
242
242
|
get localizationService() {
|
|
243
|
-
return
|
|
243
|
+
return de(this);
|
|
244
244
|
}
|
|
245
245
|
/**
|
|
246
246
|
* @hidden
|
|
@@ -249,7 +249,7 @@ const a = class a extends n.Component {
|
|
|
249
249
|
var t;
|
|
250
250
|
this.observerResize = T && 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);
|
|
251
251
|
const s = this.props.name || this.props.id;
|
|
252
|
-
this.KendoPasteSubscription =
|
|
252
|
+
this.KendoPasteSubscription = ie(this._element, {
|
|
253
253
|
fieldName: s,
|
|
254
254
|
onValueChange: (i) => {
|
|
255
255
|
this.handleKendoPasteValue(i);
|
|
@@ -283,42 +283,43 @@ const a = class a extends n.Component {
|
|
|
283
283
|
tabIndex: r,
|
|
284
284
|
title: h,
|
|
285
285
|
id: l,
|
|
286
|
-
className:
|
|
287
|
-
format:
|
|
288
|
-
formatPlaceholder:
|
|
289
|
-
width:
|
|
290
|
-
name:
|
|
291
|
-
steps:
|
|
292
|
-
validationMessage:
|
|
293
|
-
required:
|
|
294
|
-
validityStyles:
|
|
286
|
+
className: c,
|
|
287
|
+
format: z,
|
|
288
|
+
formatPlaceholder: k,
|
|
289
|
+
width: x,
|
|
290
|
+
name: E,
|
|
291
|
+
steps: R,
|
|
292
|
+
validationMessage: V,
|
|
293
|
+
required: B,
|
|
294
|
+
validityStyles: L,
|
|
295
295
|
ariaLabelledBy: A,
|
|
296
296
|
ariaDescribedBy: F,
|
|
297
297
|
unstyled: v,
|
|
298
298
|
enableMouseWheel: N,
|
|
299
299
|
autoCorrectParts: K,
|
|
300
|
-
autoSwitchParts:
|
|
301
|
-
autoSwitchKeys:
|
|
302
|
-
allowCaretMode:
|
|
303
|
-
inputAttributes:
|
|
304
|
-
} = this.props, w = v && v.uTimePicker, b = !this.validityStyles || this.validity.valid,
|
|
300
|
+
autoSwitchParts: _,
|
|
301
|
+
autoSwitchKeys: q,
|
|
302
|
+
allowCaretMode: W,
|
|
303
|
+
inputAttributes: U
|
|
304
|
+
} = this.props, w = v && v.uTimePicker, b = !this.validityStyles || this.validity.valid, j = this.localizationService.toLanguageString(M, u[M]), H = {
|
|
305
305
|
disabled: o,
|
|
306
|
-
format:
|
|
307
|
-
formatPlaceholder:
|
|
306
|
+
format: z,
|
|
307
|
+
formatPlaceholder: k,
|
|
308
308
|
id: l,
|
|
309
309
|
ariaLabelledBy: A,
|
|
310
310
|
ariaDescribedBy: F,
|
|
311
|
+
ariaLabel: j,
|
|
311
312
|
max: this.normalizeTime(this.max),
|
|
312
313
|
min: this.normalizeTime(this.min),
|
|
313
|
-
name:
|
|
314
|
+
name: E,
|
|
314
315
|
onChange: this.handleInputValueChange,
|
|
315
|
-
required:
|
|
316
|
-
steps:
|
|
316
|
+
required: B,
|
|
317
|
+
steps: R,
|
|
317
318
|
tabIndex: this.show ? -1 : r,
|
|
318
319
|
title: h,
|
|
319
320
|
valid: this.validity.valid,
|
|
320
|
-
validationMessage:
|
|
321
|
-
validityStyles:
|
|
321
|
+
validationMessage: V,
|
|
322
|
+
validityStyles: L,
|
|
322
323
|
value: this.value && this.normalizeTime(this.value),
|
|
323
324
|
label: void 0,
|
|
324
325
|
placeholder: this.state.focused ? null : this.props.placeholder,
|
|
@@ -326,28 +327,28 @@ const a = class a extends n.Component {
|
|
|
326
327
|
ariaExpanded: this.show,
|
|
327
328
|
enableMouseWheel: N,
|
|
328
329
|
autoCorrectParts: K,
|
|
329
|
-
autoSwitchParts:
|
|
330
|
-
autoSwitchKeys:
|
|
331
|
-
allowCaretMode:
|
|
332
|
-
inputAttributes:
|
|
333
|
-
},
|
|
334
|
-
|
|
335
|
-
u[
|
|
330
|
+
autoSwitchParts: _,
|
|
331
|
+
autoSwitchKeys: q,
|
|
332
|
+
allowCaretMode: W,
|
|
333
|
+
inputAttributes: U
|
|
334
|
+
}, G = this.localizationService.toLanguageString(f, u[f]), X = this.localizationService.toLanguageString(
|
|
335
|
+
P,
|
|
336
|
+
u[P]
|
|
336
337
|
), S = /* @__PURE__ */ n.createElement(
|
|
337
|
-
|
|
338
|
+
se,
|
|
338
339
|
{
|
|
339
340
|
onFocus: this.handleFocus,
|
|
340
341
|
onBlur: this.mobileMode ? void 0 : this.handleBlur,
|
|
341
342
|
onSyncBlur: this.props.onBlur,
|
|
342
343
|
onSyncFocus: this.props.onFocus
|
|
343
344
|
},
|
|
344
|
-
({ onFocus:
|
|
345
|
+
({ onFocus: Z, onBlur: J }) => /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(
|
|
345
346
|
"span",
|
|
346
347
|
{
|
|
347
|
-
ref: (
|
|
348
|
-
this._element =
|
|
348
|
+
ref: (Q) => {
|
|
349
|
+
this._element = Q;
|
|
349
350
|
},
|
|
350
|
-
className:
|
|
351
|
+
className: m(
|
|
351
352
|
g.wrapper({
|
|
352
353
|
c: w,
|
|
353
354
|
size: s,
|
|
@@ -357,12 +358,13 @@ const a = class a extends n.Component {
|
|
|
357
358
|
required: this.required,
|
|
358
359
|
disabled: o
|
|
359
360
|
}),
|
|
360
|
-
|
|
361
|
+
{ "k-focus": this.state.focused },
|
|
362
|
+
c
|
|
361
363
|
),
|
|
362
364
|
onKeyDown: this.handleKeyDown,
|
|
363
|
-
style: { width:
|
|
364
|
-
onFocus: this.mobileMode ? this.handleClick :
|
|
365
|
-
onBlur:
|
|
365
|
+
style: { width: x },
|
|
366
|
+
onFocus: this.mobileMode ? this.handleClick : Z,
|
|
367
|
+
onBlur: J,
|
|
366
368
|
onClick: this.mobileMode ? this.handleClick : void 0
|
|
367
369
|
},
|
|
368
370
|
/* @__PURE__ */ n.createElement(
|
|
@@ -371,29 +373,29 @@ const a = class a extends n.Component {
|
|
|
371
373
|
_ref: this._dateInput,
|
|
372
374
|
ariaRole: "combobox",
|
|
373
375
|
ariaControls: this.show ? this._popupId : void 0,
|
|
374
|
-
...
|
|
376
|
+
...H
|
|
375
377
|
}
|
|
376
378
|
),
|
|
377
379
|
/* @__PURE__ */ n.createElement(
|
|
378
|
-
|
|
380
|
+
ye,
|
|
379
381
|
{
|
|
380
382
|
tabIndex: -1,
|
|
381
383
|
type: "button",
|
|
382
384
|
icon: "clock",
|
|
383
|
-
svgIcon:
|
|
385
|
+
svgIcon: he,
|
|
384
386
|
onMouseDown: this.handleIconMouseDown,
|
|
385
387
|
onClick: this.mobileMode ? void 0 : this.handleClick,
|
|
386
|
-
title:
|
|
387
|
-
className:
|
|
388
|
+
title: X,
|
|
389
|
+
className: m(g.inputButton({ c: w })),
|
|
388
390
|
fillMode: i,
|
|
389
|
-
"aria-label":
|
|
391
|
+
"aria-label": G
|
|
390
392
|
}
|
|
391
393
|
),
|
|
392
394
|
!this.mobileMode && this.renderPopup()
|
|
393
|
-
), this.mobileMode && this.renderAdaptivePopup(), this.showLicenseWatermark && /* @__PURE__ */ n.createElement(
|
|
395
|
+
), this.mobileMode && this.renderAdaptivePopup(), this.showLicenseWatermark && /* @__PURE__ */ n.createElement(oe, { message: this.licenseMessage }))
|
|
394
396
|
);
|
|
395
397
|
return this.props.label ? /* @__PURE__ */ n.createElement(
|
|
396
|
-
|
|
398
|
+
Se,
|
|
397
399
|
{
|
|
398
400
|
dateInput: this._dateInput,
|
|
399
401
|
label: this.props.label,
|
|
@@ -406,7 +408,7 @@ const a = class a extends n.Component {
|
|
|
406
408
|
) : S;
|
|
407
409
|
}
|
|
408
410
|
normalizeTime(s) {
|
|
409
|
-
return
|
|
411
|
+
return D(ve, s);
|
|
410
412
|
}
|
|
411
413
|
setShow(s) {
|
|
412
414
|
const { onOpen: t, onClose: i } = this.props;
|
|
@@ -417,7 +419,7 @@ const a = class a extends n.Component {
|
|
|
417
419
|
}));
|
|
418
420
|
}
|
|
419
421
|
mergeTime(s) {
|
|
420
|
-
return this.value && s ?
|
|
422
|
+
return this.value && s ? D(this.value, s) : s;
|
|
421
423
|
}
|
|
422
424
|
calculateMedia(s) {
|
|
423
425
|
for (const t of s)
|
|
@@ -478,6 +480,7 @@ a.displayName = "TimePicker", a.propTypes = {
|
|
|
478
480
|
appendTo: e.any,
|
|
479
481
|
popupClass: e.string
|
|
480
482
|
}),
|
|
483
|
+
dateInput: e.elementType,
|
|
481
484
|
show: e.bool,
|
|
482
485
|
steps: e.shape({
|
|
483
486
|
hour: e.number,
|
|
@@ -502,28 +505,28 @@ a.displayName = "TimePicker", a.propTypes = {
|
|
|
502
505
|
defaultValue: null,
|
|
503
506
|
disabled: !1,
|
|
504
507
|
format: "t",
|
|
505
|
-
max:
|
|
506
|
-
min:
|
|
508
|
+
max: fe,
|
|
509
|
+
min: ge,
|
|
507
510
|
popupSettings: {},
|
|
508
511
|
tabIndex: 0,
|
|
509
512
|
steps: {},
|
|
510
513
|
validityStyles: !0,
|
|
511
|
-
dateInput:
|
|
514
|
+
dateInput: ce,
|
|
512
515
|
size: void 0,
|
|
513
516
|
rounded: void 0,
|
|
514
517
|
fillMode: void 0
|
|
515
518
|
};
|
|
516
519
|
let p = a;
|
|
517
|
-
const
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
520
|
+
const Ie = $(), Me = ne(
|
|
521
|
+
ae(
|
|
522
|
+
Ie,
|
|
523
|
+
re(le(p))
|
|
521
524
|
)
|
|
522
525
|
);
|
|
523
|
-
|
|
524
|
-
|
|
526
|
+
Me.displayName = "KendoReactTimePicker";
|
|
527
|
+
ue(p);
|
|
525
528
|
export {
|
|
526
|
-
|
|
527
|
-
|
|
529
|
+
Me as TimePicker,
|
|
530
|
+
Ie as TimePickerPropsContext,
|
|
528
531
|
p as TimePickerWithoutContext
|
|
529
532
|
};
|