@progress/kendo-vue-dateinputs
Version:
9 lines (8 loc) • 5.61 kB
JavaScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("vue"),k=require("@progress/kendo-vue-buttons"),L=require("@progress/kendo-date-math"),l=require("@progress/kendo-vue-common"),g=require("@progress/kendo-vue-intl"),u=require("../messages/main.js"),$=require("./TimeList.js"),p=require("../utils.js"),c=require("./models/TimePart.js"),o=require("./utils.js");function w(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!s.isVNode(e)}const m=new RegExp(`${c.TIME_PART.hour}|${c.TIME_PART.minute}|${c.TIME_PART.second}|${c.TIME_PART.dayperiod}|literal`);let h=function(e){return e[e.Left=0]="Left",e[e.Right=1]="Right",e}({});const T=s.defineComponent({name:"KendoTimePart",props:{cancelButton:{type:Boolean,default:!0},disabled:{type:Boolean,default:!1},format:{type:[String,Object],default:function(){return"hh:mm a"}},max:{type:Date,default:function(){return p.MAX_TIME}},min:{type:Date,default:function(){return p.MIN_TIME}},nowButton:{type:Boolean,default:!0},steps:{type:Object,default:function(){return{}}},smoothScroll:{type:Boolean,default:!0},tabIndex:Number,value:{type:Date,default:function(){return null}},boundRange:{type:Boolean,default:!1}},emits:{change:e=>!0,focus:e=>!0,blur:e=>!0,nowclick:e=>!0},created(){this.timeLists=[],this.snapTime=o.snapTime(o.generateSnappers(this.$props.steps,this.$props.min)),this.activeListIndex=-1,this.hasActiveButton=this.hasActiveButton.bind(this)},inject:{kendoIntlService:{default:null},kendoLocalizationService:{default:null}},data(){return{activeListIndex:null}},computed:{element(){return this._element},computedValue(){return o.timeInRange(this.snapTime(L.cloneDate(this.$props.value||p.MIDNIGHT_DATE)),this.computedMin,this.computedMax)},intl(){return g.provideIntlService(this)},computedMin(){return this.snapTime(this.$props.min)},computedMax(){return this.snapTime(this.$props.max)}},mounted(){this._nowButton=this.$refs.nowButton,this.dateFormatParts.forEach((e,t)=>{e.type!=="literal"&&this.timeLists.push(this.$refs["timeList"+t])})},setup(){const e=s.inject("kendoIntlService",{}),t=s.inject("kendoLocalizationService",{});return{kendoIntlService:e,kendoLocalizationService:t}},render(){let e;const{format:t,smoothScroll:n,disabled:i}=this.$props;this.snapTime=o.snapTime(o.generateSnappers(this.$props.steps,this.computedMin)),this.dateFormatParts=this.intl.splitDateFormat(t).filter(this.timeFormatFilter);const y=l.classNames({"k-disabled":i},"k-time-part"),f=g.provideLocalizationService(this),v=f.toLanguageString(u.selectNow,u.messages[u.selectNow]);return s.createVNode("div",{class:y},[s.createVNode("div",{class:"k-time-header"},[s.createVNode("span",{class:"k-title"},[this.intl.formatDate(this.computedValue,this.dateFormatParts.reduce(this.timeFormatReducer,""))]),this.showNowButton()&&s.createVNode(k.Button,{type:"button",ref:"nowButton",fillMode:"flat",class:"k-time-now",title:v,"aria-label":v,onClick:this.onNowClick,tabIndex:i?-1:0},w(e=f.toLanguageString(u.now,u.messages[u.now]))?e:{default:()=>[e]})]),s.createVNode("div",{class:"k-time-list-container",onKeydown:this.handleKeyDown},[s.createVNode("span",{class:"k-time-highlight"},null),this.dateFormatParts.map(function(r,a){return r.type!=="literal"?s.createVNode("div",{key:a,class:l.classNames("k-time-list-wrapper",{"k-focus":a===this.activeListIndex}),role:"presentation",tabindex:-1},[s.createVNode("span",{class:"k-title",onMousedown:d=>{d.preventDefault()}},[this.intl.dateFieldName(r)]),s.createVNode($.TimeList,{min:this.computedMin,max:this.computedMax,boundRange:this.$props.boundRange,part:r,step:r.type?this.$props.steps[r.type]:1,smoothScroll:n,ref:"timeList"+a,id:a,onFocus:d=>{this.handleListFocus(d,a)},onBlur:this.handleListBlur,onChange:this.handleChange,value:this.computedValue,disabled:i},null)]):s.createVNode("div",{key:a,class:"k-time-separator"},[r.pattern])},this)])])},methods:{onNowClick(e){this.$emit("nowclick",e)},focus(e){this.$nextTick(()=>{const t=this.timeLists[0];!this.hasActiveButton()&&t&&t.$el&&t.focus(e)})},timeFormatReducer(e,t){return e+t.pattern},timeFormatFilter(e,t,n){const i=t>=1&&n[t-1];return i&&i&&e.type==="literal"?m.test(i.type||""):m.test(e.type||"")},hasActiveButton(){return l.canUseDOM&&this._nowButton&&document.activeElement===this._nowButton.$el},focusList(e){this.timeLists.length&&this.timeLists.reduce(this.listReducer,[]).map(t=>e===h.Right?t.next:t.prev).map(t=>t&&t.$el&&t.$el.focus({preventScroll:!0}))},listReducer(e,t,n,i){return e.length||t.$props.id!==this.activeListIndex?e:[{next:i[n+1]||t,prev:i[n-1]||t}]},showNowButton(){return!this.hasSteps()&&this.$props.nowButton&&o.isInTimeRange(o.getNow(),this.computedMin,this.computedMax)},hasSteps(){const e=Object.keys(this.$props.steps);return e.length!==e.reduce((t,n)=>t+this.$props.steps[n],0)},handleKeyDown(e){const{keyCode:t}=e;switch(t){case l.Keys.left:e.preventDefault(),this.focusList(h.Left);return;case l.Keys.right:e.preventDefault(),this.focusList(h.Right);return;default:return}},handleListBlur(e){this.$emit("blur",e)},handleListFocus(e,t){this.$emit("focus",e),this.activeListIndex=t},handleChange(e){this.$emit("change",e)}}});exports.Direction=h;exports.TimePart=T;