@manik02/vue3-timepicker 0.4.3 → 0.4.4

package/dist/vue-timepicker.umd.cjs

@@ -1 +1 @@
-(function(O,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(O=typeof globalThis<"u"?globalThis:O||self,e(O.VueTimepicker={},O.Vue))})(this,(function(O,e){"use strict";const be=["tabindex","onClick","onMousemove"],Z=e.defineComponent({__name:"TimeColumn",props:{items:{},activeIndex:{}},emits:["update:activeIndex","select"],setup(t,{emit:o}){const l=t,n=o,p=e.ref(null),b=e.ref(!1);let u=null;function D(f){const V=Array.from(f.querySelectorAll(".timepicker-option"));if(!V.length)return 0;const S=f.scrollTop+f.clientHeight/2;let E=0,N=Number.POSITIVE_INFINITY;for(let A=0;A<V.length;A++){const _=V[A],s=_.offsetTop+_.offsetHeight/2,d=Math.abs(s-S);d<N&&(N=d,E=A)}return E}function B(f){if(!l.items.length)return 0;if(!l.items[f]?.disabled)return f;for(let V=1;V<l.items.length;V++){const S=f-V,E=f+V;if(S>=0&&!l.items[S]?.disabled)return S;if(E<l.items.length&&!l.items[E]?.disabled)return E}return f}function M(){e.nextTick(()=>{const f=p.value;if(!f)return;const V=f.querySelector(".timepicker-option--active");if(V){const S=f.clientHeight,E=V.offsetTop,N=V.offsetHeight,A=E-S/2+N/2;b.value=!0,f.scrollTo({top:A,behavior:"auto"}),u&&clearTimeout(u),u=setTimeout(()=>{b.value=!1},70)}})}function R(){const f=p.value;if(!f||b.value)return;const V=D(f),S=B(V);l.items[S]?.disabled||($.value=S)}e.onMounted(M),e.onBeforeUnmount(()=>{u&&clearTimeout(u)});function k(f){n("update:activeIndex",f),n("select",l.items[f]?.value)}function I(f){k(f)}const $=e.ref(l.activeIndex??0);return(f,V)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["timepicker-dropdown",{"timepicker-dropdown--short":f.items.length<=3}])},[e.createElementVNode("div",{ref_key:"menu",ref:p,class:"timepicker-dropdown__panel",role:"listbox",tabindex:"-1",onScroll:R},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(f.items,(S,E)=>(e.openBlock(),e.createElementBlock("div",{key:S.key,class:e.normalizeClass(["timepicker-option",{"timepicker-option--active":E===f.activeIndex,"timepicker-option--disabled":S.disabled,"timepicker-option--focused":E===$.value}]),role:"option",tabindex:S.disabled?-1:0,onClick:N=>!S.disabled&&I(E),onMousemove:N=>!S.disabled&&($.value=E)},e.toDisplayString(S.text),43,be))),128))],544)],2))}});function de(t){return t.h*3600+t.m*60+t.s}function ce(t){return/(a|A|p|P)/.test(t)}function ye(t){return/(p|P)/.test(t)}function ae(t){return/k{1,2}/.test(t)}function G(t,o){if(!t||typeof t!="string")return{h:0,m:0,s:0};const l=t.match(/\d+/g)||[];let n=l[0]!==void 0?+l[0]:0;const p=+l[1]||0,b=+l[2]||0;return{h:n,m:p,s:b}}function ke(t){const o=t%12;return o===0?12:o}function me(t,o){return o?t%12+12:t%12}function Te(t){return/(s|ss)/.test(t)}function ee(t,o){let{h:l,m:n,s:p}=o;const b=ce(t),u=l>=12?"PM":"AM";b&&(l=ke(l));const D=l===0?24:l,B={HH:String(l).padStart(2,"0"),H:String(l),hh:String(l).padStart(2,"0"),h:String(l),kk:String(D).padStart(2,"0"),k:String(D),mm:String(n).padStart(2,"0"),m:String(n),ss:String(p).padStart(2,"0"),s:String(p),A:u,a:u.toLowerCase(),P:u,p:u.toLowerCase()};return t.replace(/HH|hh|kk|mm|ss|H|h|k|m|s|A|a|P|p/g,M=>B[M]??M)}function z(t,o){return de(t)-de(o)}function Se(t,o,l){return o&&z(t,o)<0?{...o}:l&&z(t,l)>0?{...l}:{...t}}function fe(t,o,l){return!(o&&z(t,o)<0||l&&z(t,l)>0)}function pe(t,o){return o.some(([l,n])=>z(t,l)>=0&&z(t,n)<=0)}const ve=e.defineComponent({__name:"TimeSelection",props:{open:{type:Boolean},initTime:{},format:{},minTime:{},maxTime:{},disabledRanges:{},isTimeDisabled:{type:Function},hourStep:{},minuteStep:{},secondStep:{}},emits:["update:initTime","open","close","update:open"],setup(t,{emit:o}){function l(a){return Math.max(1,a??1)}const n=e.computed(()=>ce(u.format)),p=e.computed(()=>Te(u.format)),b=e.computed(()=>ae(u.format)),u=t,D=o,B=e.computed({get:()=>u.open??!1,set:a=>{const c=u.open??!1;a!==c&&(D("update:open",a),D(a?"open":"close"))}}),M=e.ref(null);function R(a){if(!B.value)return;const c=a.target;M.value&&!M.value.contains(c)&&(B.value=!1)}e.onMounted(()=>document.addEventListener("mousedown",R)),e.onBeforeUnmount(()=>document.removeEventListener("mousedown",R));function k(a){a.key==="Escape"&&B.value&&(B.value=!1)}e.onMounted(()=>document.addEventListener("keydown",k)),e.onBeforeUnmount(()=>document.removeEventListener("keydown",k));const I=e.ref(Math.floor(u.initTime.h/u.hourStep)||0),$=e.ref(Math.floor(u.initTime.m/u.minuteStep)||0),f=e.ref(Math.floor(u.initTime.s/u.secondStep)||0);e.watch(()=>u.initTime,a=>{const c=l(u.hourStep),h=l(u.minuteStep),T=l(u.secondStep);let w=a.h;n.value?(N.value=a.h>=12?1:0,w=a.h%12):b.value&&a.h===0&&(w=24),I.value=Math.floor(w/c),$.value=Math.floor(a.m/h),f.value=Math.floor(a.s/T)});function V(a,c){const h=[];for(let T=0;T<a;T+=l(c))h.push({key:T,value:T,text:String(T).padStart(2,"0")});return h}function S(a,c){const h=l(c),T=[];for(let w=0;w<12;w+=h){const X=w===0?12:w,K=a?w===0?12:w+12:w;T.push({key:K,value:K,text:String(X).padStart(2,"0")})}return T}function E(a){const c=l(a),h=[];for(let T=0;T<24;T+=c){const w=T===0?24:T;h.push({key:T,value:T,text:String(w).padStart(2,"0")})}return h}const N=e.ref(ye(u.format)?1:0),A=e.computed(()=>{if(!n.value)return b.value?E(u.hourStep):V(24,u.hourStep);const a=N.value===1;return S(a,u.hourStep)}),_=e.computed(()=>V(60,u.minuteStep)),s=e.computed(()=>V(60,u.secondStep)),d=e.computed(()=>/\s[ap]$/.test(u.format)),m=e.computed(()=>{const a=d.value?"am":"AM",c=d.value?"pm":"PM";return[{key:"AM",value:"AM",text:a},{key:"PM",value:"PM",text:c}]}),y=e.computed(()=>_.value.map(a=>Number(a.value??0))),v=e.computed(()=>p.value?s.value.map(a=>Number(a.value??0)):[0]);function x(a){return Number(a.value??0)}function U(a){const c=a.findIndex(h=>!h.disabled);return c>=0?c:0}function q(a){return!(!fe(a,u.minTime,u.maxTime)||pe(a,u.disabledRanges??[])||u.isTimeDisabled?.(a))}const W=e.computed(()=>A.value.map(a=>{const c=x(a),h=y.value.some(T=>v.value.some(w=>q({h:c,m:T,s:w})));return{...a,disabled:!h}})),J=e.computed(()=>{const a=Number(A.value[I.value]?.value??0);return _.value.map(c=>{const h=Number(c.value??0),T=v.value.some(w=>q({h:a,m:h,s:w}));return{...c,disabled:!T}})}),ne=e.computed(()=>{const a=Number(A.value[I.value]?.value??0),c=Number(_.value[$.value]?.value??0);return s.value.map(h=>{const T=Number(h.value??0);return{...h,disabled:!q({h:a,m:c,s:T})}})}),oe=e.computed(()=>{if(!n.value)return m.value;const a=Number(_.value[$.value]?.value??0),c=p.value?Number(s.value[f.value]?.value??0):0;return m.value.map(h=>{const T=h.value==="PM",w=S(T,u.hourStep).some(X=>q({h:Number(X.value??0),m:a,s:c}));return{...h,disabled:!w}})}),re=e.computed(()=>N.value===1?"PM":"AM"),se=e.computed(()=>{const a=Number(A.value[I.value]?.value??0);return n.value?re.value==="PM"?me(a,!0):me(a,!1):b.value&&a===24?0:a}),Y=e.computed(()=>Number(_.value[$.value]?.value??0)),le=e.computed(()=>Number(s.value[f.value]?.value??0));function Q(a,c,h){a.length&&(!a[c]||a[c].disabled)&&h(U(a))}e.watch(W,a=>{Q(a,I.value,c=>{I.value=c})}),e.watch(J,a=>{Q(a,$.value,c=>{$.value=c})}),e.watch(ne,a=>{!p.value||!a.length||Q(a,f.value,c=>{f.value=c})}),e.watch(oe,a=>{!n.value||!a.length||Q(a,N.value,c=>{N.value=c})});function ie(a){!p.value&&!n.value&&H()}function C(a){n.value||H()}function ue(a){H()}function H(){B.value=!1}return e.watch([se,Y,le],([a,c,h])=>{D("update:initTime",{h:a,m:c,s:h})},{immediate:!0}),(a,c)=>B.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"vtp-cols",ref_key:"root",ref:M},[e.createVNode(Z,{activeIndex:I.value,"onUpdate:activeIndex":c[0]||(c[0]=h=>I.value=h),items:W.value,label:"Hours"},null,8,["activeIndex","items"]),e.createVNode(Z,{activeIndex:$.value,"onUpdate:activeIndex":c[1]||(c[1]=h=>$.value=h),items:J.value,label:"Minutes",onSelect:ie},null,8,["activeIndex","items"]),p.value?(e.openBlock(),e.createBlock(Z,{key:0,activeIndex:f.value,"onUpdate:activeIndex":c[2]||(c[2]=h=>f.value=h),items:ne.value,label:"Seconds",onSelect:C},null,8,["activeIndex","items"])):e.createCommentVNode("",!0),n.value?(e.openBlock(),e.createBlock(Z,{key:1,activeIndex:N.value,"onUpdate:activeIndex":c[3]||(c[3]=h=>N.value=h),items:oe.value,label:"AM/PM",onSelect:ue},null,8,["activeIndex","items"])):e.createCommentVNode("",!0)],512)):e.createCommentVNode("",!0)}});function xe(t){return typeof t=="string"?j.test(t):Array.isArray(t)?t.length===2&&j.test(t[0]??"")&&j.test(t[1]??""):!1}function te(t){return t==null||typeof t=="string"||typeof t=="number"}function Ve(t){return t==null||typeof t=="string"||Array.isArray(t)||typeof t=="object"&&t!==null}const he=/^(HH|H|hh|h|kk|k):(mm|m)(?::(ss|s))?(?:\s*(A|a|P|p))?$/,j=/^([01]\d|2[0-3]):([0-5]\d)(:([0-5]\d))?$/,L=typeof __DEV__<"u"?__DEV__:typeof process<"u"&&process.env&&process.env.NODE_ENV!=="production",Ae={modelValue:{type:[String,Array],default:void 0,validator:t=>{let o;return Array.isArray(t)?o=t.length===2&&t.every(l=>j.test(l)):o=t==null||j.test(t),!o&&L&&console.error(`[VueTimepicker] \`modelValue\` is wrong. Received: ${t}`),o}},range:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},hideDropdown:{type:Boolean,default:!1},hourStep:{type:Number,default:1},minuteStep:{type:Number,default:1},secondStep:{type:Number,default:1},minTime:{type:String,default:void 0,validator:t=>{const o=t==null||j.test(t);return!o&&L&&console.error(`[VueTimepicker] \`minTime\` is wrong. Received: ${t}`),o}},maxTime:{type:String,default:void 0,validator:t=>{const o=t==null||j.test(t);return!o&&L&&console.error(`[VueTimepicker] \`maxTime\` is wrong. Received: ${t}`),o}},disabledTimes:{type:Array,default:void 0,validator:t=>{const o=t==null||t.every(xe);return!o&&L&&console.error(`[VueTimepicker] \`disabledTimes\` is wrong. Received: ${JSON.stringify(t)}`),o}},isTimeDisabled:{type:Function,default:void 0},format:{type:String,default:"HH:mm",validator:t=>{const o=he.test(t);return!o&&L&&console.error(`[VueTimepicker] \`format\` format is wrong. Received: ${t}`),o}},placeholder:{type:String,default:"Select time"},id:{type:String,default:void 0,validator:t=>{const o=t==null||typeof t=="string";return!o&&L&&console.error(`[VueTimepicker] \`id\` must be a string. Received: ${t}`),o}},name:{type:String,default:void 0,validator:t=>{const o=t==null||typeof t=="string";return!o&&L&&console.error(`[VueTimepicker] \`name\` must be a string. Received: ${t}`),o}},tabindex:{type:Number,default:0,validator:t=>{const o=Number.isInteger(t);return!o&&L&&console.error(`[VueTimepicker] \`tabindex\` must be an integer. Received: ${t}`),o}},autocomplete:{type:String,default:"off",validator:t=>{const o=typeof t=="string";return!o&&L&&console.error(`[VueTimepicker] \`autocomplete\` must be a string. Received: ${t}`),o}},inputClass:{type:[String,Array,Object],default:void 0,validator:t=>{const o=Ve(t);return!o&&L&&console.error(`[VueTimepicker] \`inputClass\` must be a string, array, or object. Received: ${t}`),o}},inputWidth:{type:[String,Number],default:void 0,validator:t=>{const o=te(t);return!o&&L&&console.error(`[VueTimepicker] \`inputWidth\` must be a string or number. Received: ${t}`),o}},componentWidth:{type:[String,Number],default:void 0,validator:t=>{const o=te(t);return!o&&L&&console.error(`[VueTimepicker] \`componentWidth\` must be a string or number. Received: ${t}`),o}},minInputWidth:{type:[String,Number],default:void 0,validator:t=>{const o=te(t);return!o&&L&&console.error(`[VueTimepicker] \`minInputWidth\` must be a string or number. Received: ${t}`),o}},maxInputWidth:{type:[String,Number],default:void 0,validator:t=>{const o=te(t);return!o&&L&&console.error(`[VueTimepicker] \`maxInputWidth\` must be a string or number. Received: ${t}`),o}},size:{type:String,default:"md",validator:t=>{const o=t==="xs"||t==="sm"||t==="md"||t==="lg"||t==="xl";return!o&&L&&console.error(`[VueTimepicker] \`size\` is wrong. Received: ${t}`),o}}};function Ie(t){const o=he.exec(t);if(!o)throw new Error(`[useTimeMask] Invalid format: ${t}`);const[,l,n,p,b]=o,u=[],D=!!b,B=/^k{1,2}$/.test(l);let M=0,R=23;return D?(M=1,R=12):B&&(M=1,R=24),u.push({token:l,min:M,max:R}),u.push({token:n,min:0,max:59}),p&&u.push({token:p,min:0,max:59}),{digitGroups:u,hasAmPm:!!b,ampmLowercase:b==="a"||b==="p"}}function ge(t){const o=e.computed(()=>Ie(t.value)),l=e.computed(()=>o.value.digitGroups.length*2),n=e.ref([]),p=e.ref("AM"),b=e.ref("");function u(){const{digitGroups:s,hasAmPm:d}=o.value;let m="",y=0;for(let v=0;v<s.length;v++){for(let x=0;x<2;x++)y<n.value.length&&(m+=String(n.value[y]),y++);y===(v+1)*2&&v<s.length-1&&(m+=":")}if(d&&y>=l.value){const v=o.value.ampmLowercase?p.value.toLowerCase():p.value;m+=" "+v}return m}function D(s){const d=s*2;if(n.value.length<d+2)return;const m=n.value[d]*10+n.value[d+1],{min:y,max:v}=o.value.digitGroups[s],x=Math.max(y,Math.min(v,m));x!==m&&(n.value[d]=Math.floor(x/10),n.value[d+1]=x%10)}function B(){for(let s=0;s<o.value.digitGroups.length;s++)D(s)}function M(s){const d=u();let m=0;for(let y=0;y<Math.min(s,d.length);y++)/\d/.test(d[y])&&m++;return m}function R(s){return s+Math.floor(s/2)}function k(s,d){if(s>=l.value)return l.value;const m=[...n.value];m[s]=d,n.value=m;const y=Math.floor(s/2);return D(y),Math.min(s+1,l.value)}function I(s,d){const m=u();b.value=m,s.value=m;const y=d!==void 0?Math.min(R(d),m.length):m.length;s.selectionStart=s.selectionEnd=y,e.nextTick(()=>{document.activeElement===s&&(s.selectionStart=s.selectionEnd=y)})}function $(s){const d=s.key,m=s.target;if(["Tab","Escape","ArrowLeft","ArrowRight","Home","End"].includes(d)||s.metaKey||s.ctrlKey)return;s.preventDefault();const y=m.selectionStart??0,v=M(y);if(d==="Backspace"){v>0&&I(m,v-1);return}if(d!=="Delete"){if(o.value.hasAmPm){const x=d.toLowerCase();if(x==="a"){p.value="AM",I(m,v);return}if(x==="p"){p.value="PM",I(m,v);return}}if(/^\d$/.test(d)){const x=k(v,+d);I(m,x);return}}}function f(s){const d=s.target,m=d.value.replace(/\D/g,"").split("").map(Number).slice(0,l.value);n.value=m,B(),o.value.hasAmPm&&(/p/i.test(d.value)?p.value="PM":/a/i.test(d.value)&&(p.value="AM")),I(d)}function V(s){s.preventDefault();const d=s.clipboardData?.getData("text")??"",m=s.target,y=m.selectionStart??0,v=d.replace(/\D/g,"").split("").map(Number);let x=M(y);for(const U of v){if(x>=l.value)break;x=k(x,U)}o.value.hasAmPm&&(/p\.?m\.?/i.test(d)?p.value="PM":/a\.?m\.?/i.test(d)&&(p.value="AM")),I(m,x)}function S(s){const{digitGroups:d,hasAmPm:m}=o.value,y=[];let v=s.h;m?(p.value=s.h>=12?"PM":"AM",v=s.h%12,v===0&&(v=12)):ae(t.value)&&(v=s.h===0?24:s.h),y.push(Math.floor(v/10),v%10),y.push(Math.floor(s.m/10),s.m%10),d.length>2&&y.push(Math.floor(s.s/10),s.s%10),n.value=y,b.value=u()}function E(){n.value=[],b.value="",p.value="AM"}function N(){if(n.value.length<l.value)return null;const s=[];for(let v=0;v<o.value.digitGroups.length;v++){const x=v*2;s.push(n.value[x]*10+n.value[x+1])}let d=s[0];const m=s[1],y=s[2]??0;return o.value.hasAmPm&&(d=p.value==="PM"?d===12?12:d+12:d===12?0:d),ae(t.value)&&d===24&&(d=0),{h:d,m,s:y}}const A=e.computed(()=>n.value.length>=l.value),_=e.computed(()=>o.value.ampmLowercase);return{inputValue:b,handleKeydown:$,handleInput:f,handlePaste:V,setFromTime:S,clear:E,getParsedTime:N,isComplete:A,totalDigits:l,displayPosToDigitIndex:M,ampm:p,ampmLowercase:_}}const we=["data-size","data-validation","data-disabled"],Me=["id","name","tabindex","autocomplete","value","placeholder","disabled"],Pe=["id","name","tabindex","autocomplete","value","placeholder","disabled"],Ee=e.defineComponent({__name:"TimePicker",props:Ae,emits:["update:modelValue","update:validationState","validate","open","close","error"],setup(t,{emit:o}){const l=e.ref(null),n=t,p=o,b=e.ref(!1),u=e.ref(!1),D=e.ref("valid"),B=e.ref("valid");function M(){b.value=!1,u.value=!1}function R(i,r){if(n.disabled&&r){M();return}r&&(i==="first"?u.value=!1:b.value=!1)}e.watch(b,i=>{R("first",i)}),e.watch(u,i=>{R("second",i)}),e.watch(()=>n.disabled,i=>{i&&M()}),e.watch(()=>n.hideDropdown,i=>{i&&M()});const k=e.computed({get(){if(Array.isArray(n.modelValue)){const[i,r]=n.modelValue;return[G(i,n.format),G(r,n.format)]}else return G(n.modelValue,n.format)},set(i){Array.isArray(i)?p("update:modelValue",[ee("HH:mm:ss",i[0]),ee("HH:mm:ss",i[1])]):p("update:modelValue",ee("HH:mm:ss",i))}}),I=e.computed(()=>n.minTime?G(n.minTime):null),$=e.computed(()=>n.maxTime?G(n.maxTime):null),f=e.computed(()=>!I.value||!$.value?!0:z(I.value,$.value)<=0),V=e.computed(()=>D.value==="out-of-range"||n.range&&B.value==="out-of-range"?"out-of-range":D.value==="invalid"||n.range&&B.value==="invalid"?"invalid":"valid"),S=e.computed(()=>(n.disabledTimes??[]).map(r=>{const g=Array.isArray(r)?r:[r,r],F=G(g[0]),P=G(g[1]);return z(F,P)<=0?[F,P]:[P,F]}));function E(i){return!!(pe(i,S.value)||n.isTimeDisabled?.(i))}function N(i){return i==="first"?Array.isArray(k.value)?k.value[0]:k.value:Array.isArray(k.value)?k.value[1]:k.value}function A(i){const r=n.modelValue;return Array.isArray(r)?i==="first"?!!r[0]:!!r[1]:i==="second"?!1:typeof r=="string"&&r.length>0}function _(i,r){if(i==="first"){Array.isArray(k.value)?k.value=[r,k.value[1]]:k.value=r;return}Array.isArray(k.value)&&(k.value=[k.value[0],r])}function s(i,r,g,F){if(i==="first"?D.value=r:B.value=r,p("validate",{target:i,state:r,reason:g,value:F?ee("HH:mm:ss",F):null}),r==="valid"){l.value=null;return}if(r==="out-of-range"){l.value="OUT_OF_RANGE",p("error",{code:"OUT_OF_RANGE",message:"Time is outside min/max bounds and was clamped."});return}l.value=g??"BAD_TIME",p("error",{code:g??"BAD_TIME",message:g==="DISABLED"?"Time is disabled by disabledTimes or isTimeDisabled.":"Time is invalid."})}e.watch(V,i=>{p("update:validationState",i)},{immediate:!0});const d=e.computed(()=>f.value?I.value:null),m=e.computed(()=>f.value?$.value:null);function y(i){return Se(i,d.value,m.value)}function v(i,r,g){const F=!fe(r,d.value,m.value),P=y(r);return E(P)?(g.emitValidation&&s(i,"invalid","DISABLED",P),!1):(_(i,P),g.emitValidation&&(F?s(i,"out-of-range","OUT_OF_RANGE",P):s(i,"valid",void 0,P)),!0)}const x=e.computed({get(){return Array.isArray(k.value)?k.value[0]:k.value},set(i){!A("first")&&!b.value||v("first",i,{emitValidation:!0})}}),U=e.computed({get(){return Array.isArray(k.value)?k.value[1]:k.value},set(i){!A("second")&&!u.value||Array.isArray(k.value)&&v("second",i,{emitValidation:!0})}});e.watch(()=>n.range,i=>{if(i){if(n.modelValue!=null&&!Array.isArray(n.modelValue))throw new RangeError(`Model value must be an array for range selection: ${n.modelValue}`)}else if(Array.isArray(n.modelValue))throw new RangeError(`Model value must be a single string for single time selection: ${n.modelValue}`)},{immediate:!0});function q(){A("first")&&v("first",N("first"),{emitValidation:!0}),n.range&&A("second")&&v("second",N("second"),{emitValidation:!0})}e.watch(()=>[d.value,m.value,n.range],q,{immediate:!0}),e.watch(()=>[S.value,n.isTimeDisabled,n.range],q,{immediate:!0});const W=e.computed(()=>n.format??"HH:mm:ss"),J=e.computed(()=>n.placeholder??"Select time"),ne=e.computed(()=>n.id),oe=e.computed(()=>n.range&&n.id?`${n.id}-end`:void 0),re=e.computed(()=>n.name),se=e.computed(()=>n.range&&n.name?`${n.name}-end`:void 0);function Y(i){if(i==null)return;if(typeof i=="number")return`${i}px`;const r=i.trim();return r.length>0?r:void 0}const le=e.computed(()=>{let i=Math.max(W.value.length,J.value.length);return/[AaPp]$/.test(W.value)&&(i=Math.max(i,W.value.length+1)),`${Math.min(20,Math.max(6,i))}ch`}),Q=e.computed(()=>{const i={},r=Y(n.componentWidth),g=Y(n.inputWidth),F=Y(n.minInputWidth),P=Y(n.maxInputWidth);return r&&(i["--vtp-component-width"]=r),g&&(i["--vtp-input-width"]=g),F&&(i["--vtp-input-min-width"]=F),P&&(i["--vtp-input-max-width"]=P),i}),ie=e.computed(()=>({width:`var(--vtp-input-width, ${le.value})`,minWidth:"var(--vtp-input-min-width, 0)",maxWidth:"var(--vtp-input-max-width, none)"})),C=ge(W),ue=C.inputValue,H=ge(W),a=H.inputValue,c=e.ref(null),h=e.ref(null),T=e.computed(()=>({left:`${(n.range&&u.value?h.value:c.value)?.offsetLeft??0}px`}));e.watch(()=>[x.value,W.value],([i])=>{if(!A("first")){C.clear();return}C.setFromTime(i)},{immediate:!0}),e.watch(()=>[U.value,W.value,n.range],([i,,r])=>{if(!r||!A("second")){H.clear();return}H.setFromTime(i)},{immediate:!0});function w(i){if(n.disabled)return;if(i.key==="Enter"){i.preventDefault(),K("first");return}/^\d$/.test(i.key)&&(b.value=!1,u.value=!1);const r=i.target,g=C.displayPosToDigitIndex(r.selectionStart??0),F=/^\d$/.test(i.key)&&g>=C.totalDigits.value-1;if(C.handleKeydown(i),/^\d$/.test(i.key)){const P=C.getParsedTime();P&&v("first",P,{emitValidation:!1})}n.range&&F&&h.value&&(K("first"),e.nextTick(()=>{const P=h.value;P&&(P.focus(),P.selectionStart=P.selectionEnd=0)}))}function X(i){if(!n.disabled){if(i.key==="Enter"){i.preventDefault(),K("second");return}if(/^\d$/.test(i.key)&&(b.value=!1,u.value=!1),H.handleKeydown(i),/^\d$/.test(i.key)){const r=H.getParsedTime();r&&v("second",r,{emitValidation:!1})}}}function K(i){const r=i==="first"?C:H,g=r.getParsedTime();g?v(i,g,{emitValidation:!0}):r.inputValue.value.trim()?s(i,"invalid","BAD_TIME"):!n.range&&i==="first"&&(p("update:modelValue",null),s("first","valid")),i==="first"?A("first")?C.setFromTime(x.value):C.clear():n.range&&(A("second")?H.setFromTime(U.value):H.clear())}return(i,r)=>(e.openBlock(),e.createElementBlock("div",{class:"timepicker-shell","data-size":n.size,"data-validation":V.value,"data-disabled":n.disabled?"true":"false",style:e.normalizeStyle(Q.value)},[e.createElementVNode("div",{class:e.normalizeClass(["timepicker-shell__input",{"timepicker-shell__input--error":l.value,"timepicker-shell__input--disabled":n.disabled}])},[e.createElementVNode("input",{ref_key:"firstInputRef",ref:c,type:"text",class:e.normalizeClass(["timepicker-field",n.inputClass]),id:ne.value,name:re.value,tabindex:n.tabindex,autocomplete:n.autocomplete,value:e.unref(ue),placeholder:J.value,style:e.normalizeStyle(ie.value),disabled:n.disabled,onFocus:r[0]||(r[0]=g=>!n.disabled&&!n.hideDropdown&&(b.value=!0)),onKeydown:w,onInput:r[1]||(r[1]=(...g)=>e.unref(C).handleInput&&e.unref(C).handleInput(...g)),onPaste:r[2]||(r[2]=(...g)=>e.unref(C).handlePaste&&e.unref(C).handlePaste(...g)),onBlur:r[3]||(r[3]=g=>!n.disabled&&K("first"))},null,46,Me),n.range?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[r[12]||(r[12]=e.createElementVNode("span",{class:"timepicker-separator"},"–",-1)),e.createElementVNode("input",{ref_key:"secondInputRef",ref:h,type:"text",class:e.normalizeClass(["timepicker-field",n.inputClass]),id:oe.value,name:se.value,tabindex:n.tabindex,autocomplete:n.autocomplete,value:e.unref(a),placeholder:J.value,style:e.normalizeStyle(ie.value),disabled:n.disabled,onFocus:r[4]||(r[4]=g=>!n.disabled&&!n.hideDropdown&&(u.value=!0)),onKeydown:X,onInput:r[5]||(r[5]=(...g)=>e.unref(H).handleInput&&e.unref(H).handleInput(...g)),onPaste:r[6]||(r[6]=(...g)=>e.unref(H).handlePaste&&e.unref(H).handlePaste(...g)),onBlur:r[7]||(r[7]=g=>!n.disabled&&K("second"))},null,46,Pe)],64)):e.createCommentVNode("",!0)],2),n.hideDropdown?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:"timepicker-popovers",style:e.normalizeStyle(T.value)},[e.createVNode(ve,{open:b.value,"onUpdate:open":r[8]||(r[8]=g=>b.value=g),initTime:x.value,"onUpdate:initTime":r[9]||(r[9]=g=>x.value=g),format:n.format,"hour-step":n.hourStep,"minute-step":n.minuteStep,"second-step":n.secondStep,"min-time":d.value,"max-time":m.value,"disabled-ranges":S.value,"is-time-disabled":n.isTimeDisabled},null,8,["open","initTime","format","hour-step","minute-step","second-step","min-time","max-time","disabled-ranges","is-time-disabled"]),n.range?(e.openBlock(),e.createBlock(ve,{key:0,open:u.value,"onUpdate:open":r[10]||(r[10]=g=>u.value=g),initTime:U.value,"onUpdate:initTime":r[11]||(r[11]=g=>U.value=g),format:n.format,"hour-step":n.hourStep,"minute-step":n.minuteStep,"second-step":n.secondStep,"min-time":d.value,"max-time":m.value,"disabled-ranges":S.value,"is-time-disabled":n.isTimeDisabled},null,8,["open","initTime","format","hour-step","minute-step","second-step","min-time","max-time","disabled-ranges","is-time-disabled"])):e.createCommentVNode("",!0)],4))],12,we))}});O.TimePicker=Ee,Object.defineProperty(O,Symbol.toStringTag,{value:"Module"})}));
+(function(K,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(K=typeof globalThis<"u"?globalThis:K||self,e(K.VueTimepicker={},K.Vue))})(this,(function(K,e){"use strict";const Te=["tabindex","onClick","onMousemove"],Z=e.defineComponent({__name:"TimeColumn",props:{items:{},activeIndex:{}},emits:["update:activeIndex","select"],setup(t,{emit:o}){const l=t,n=o,v=e.ref(null),y=e.ref(!1);let c=null;function N(p){const S=Array.from(p.querySelectorAll(".timepicker-option"));if(!S.length)return 0;const V=p.scrollTop+p.clientHeight/2;let I=0,L=Number.POSITIVE_INFINITY;for(let P=0;P<S.length;P++){const W=S[P],s=W.offsetTop+W.offsetHeight/2,u=Math.abs(s-V);u<L&&(L=u,I=P)}return I}function E(p){if(!l.items.length)return 0;if(!l.items[p]?.disabled)return p;for(let S=1;S<l.items.length;S++){const V=p-S,I=p+S;if(V>=0&&!l.items[V]?.disabled)return V;if(I<l.items.length&&!l.items[I]?.disabled)return I}return p}function M(){e.nextTick(()=>{const p=v.value;if(!p)return;const S=p.querySelector(".timepicker-option--active");if(S){const V=p.clientHeight,I=S.offsetTop,L=S.offsetHeight,P=I-V/2+L/2;y.value=!0,p.scrollTo({top:P,behavior:"auto"}),c&&clearTimeout(c),c=setTimeout(()=>{y.value=!1},70)}})}function R(){const p=v.value;if(!p||y.value)return;const S=N(p),V=E(S);l.items[V]?.disabled||(D.value=V)}e.onMounted(M),e.onBeforeUnmount(()=>{c&&clearTimeout(c)});function T(p){n("update:activeIndex",p),n("select",l.items[p]?.value)}function A(p){T(p)}const D=e.ref(l.activeIndex??0);return(p,S)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["timepicker-dropdown",{"timepicker-dropdown--short":p.items.length<=3}])},[e.createElementVNode("div",{ref_key:"menu",ref:v,class:"timepicker-dropdown__panel",role:"listbox",tabindex:"-1",onScroll:R},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(p.items,(V,I)=>(e.openBlock(),e.createElementBlock("div",{key:V.key,class:e.normalizeClass(["timepicker-option",{"timepicker-option--active":I===p.activeIndex,"timepicker-option--disabled":V.disabled,"timepicker-option--focused":I===D.value}]),role:"option",tabindex:V.disabled?-1:0,onClick:L=>!V.disabled&&A(I),onMousemove:L=>!V.disabled&&(D.value=I)},e.toDisplayString(V.text),43,Te))),128))],544)],2))}});function me(t){return t.h*3600+t.m*60+t.s}function fe(t){return/(a|A|p|P)/.test(t)}function re(t){return/k{1,2}/.test(t)}function O(t,o){if(!t||typeof t!="string")return{h:0,m:0,s:0};const l=t.match(/\d+/g)||[];let n=l[0]!==void 0?+l[0]:0;const v=+l[1]||0,y=+l[2]||0;return{h:n,m:v,s:y}}function Se(t){const o=t%12;return o===0?12:o}function pe(t,o){return o?t%12+12:t%12}function xe(t){return/(s|ss)/.test(t)}function ee(t,o){let{h:l,m:n,s:v}=o;const y=fe(t),c=l>=12?"PM":"AM";y&&(l=Se(l));const N=l===0?24:l,E={HH:String(l).padStart(2,"0"),H:String(l),hh:String(l).padStart(2,"0"),h:String(l),kk:String(N).padStart(2,"0"),k:String(N),mm:String(n).padStart(2,"0"),m:String(n),ss:String(v).padStart(2,"0"),s:String(v),A:c,a:c.toLowerCase(),P:c,p:c.toLowerCase()};return t.replace(/HH|hh|kk|mm|ss|H|h|k|m|s|A|a|P|p/g,M=>E[M]??M)}function z(t,o){return me(t)-me(o)}function Ve(t,o,l){return o&&z(t,o)<0?{...o}:l&&z(t,l)>0?{...l}:{...t}}function ve(t,o,l){return!(o&&z(t,o)<0||l&&z(t,l)>0)}function he(t,o){return o.some(([l,n])=>z(t,l)>=0&&z(t,n)<=0)}const ge=e.defineComponent({__name:"TimeSelection",props:{open:{type:Boolean},initTime:{},format:{},minTime:{},maxTime:{},disabledRanges:{},isTimeDisabled:{type:Function},hourStep:{},minuteStep:{},secondStep:{}},emits:["update:initTime","open","close","update:open"],setup(t,{emit:o}){function l(a){return Math.max(1,a??1)}const n=e.computed(()=>fe(c.format)),v=e.computed(()=>xe(c.format)),y=e.computed(()=>re(c.format)),c=t,N=o,E=e.computed({get:()=>c.open??!1,set:a=>{const d=c.open??!1;a!==d&&(N("update:open",a),N(a?"open":"close"))}}),M=e.ref(null);function R(a){if(!E.value)return;const d=a.target;M.value&&!M.value.contains(d)&&(E.value=!1)}e.onMounted(()=>document.addEventListener("mousedown",R)),e.onBeforeUnmount(()=>document.removeEventListener("mousedown",R));function T(a){a.key==="Escape"&&E.value&&(E.value=!1)}e.onMounted(()=>document.addEventListener("keydown",T)),e.onBeforeUnmount(()=>document.removeEventListener("keydown",T));const A=e.ref(0),D=e.ref(0),p=e.ref(0),S=e.ref(0);function V(a){const d=l(c.hourStep),g=l(c.minuteStep),k=l(c.secondStep);let w=a.h;n.value?(S.value=a.h>=12?1:0,w=a.h%12):y.value&&a.h===0&&(w=24),A.value=Math.floor(w/d),D.value=Math.floor(a.m/g),p.value=Math.floor(a.s/k)}e.watch(()=>c.initTime,a=>{V(a)},{immediate:!0});function I(a,d){const g=[];for(let k=0;k<a;k+=l(d))g.push({key:k,value:k,text:String(k).padStart(2,"0")});return g}function L(a,d){const g=l(d),k=[];for(let w=0;w<12;w+=g){const X=w===0?12:w,q=a?w===0?12:w+12:w;k.push({key:q,value:q,text:String(X).padStart(2,"0")})}return k}function P(a){const d=l(a),g=[];for(let k=0;k<24;k+=d){const w=k===0?24:k;g.push({key:k,value:k,text:String(w).padStart(2,"0")})}return g}const W=e.computed(()=>{if(!n.value)return y.value?P(c.hourStep):I(24,c.hourStep);const a=S.value===1;return L(a,c.hourStep)}),s=e.computed(()=>I(60,c.minuteStep)),u=e.computed(()=>I(60,c.secondStep)),m=e.computed(()=>/\s[ap]$/.test(c.format)),b=e.computed(()=>{const a=m.value?"am":"AM",d=m.value?"pm":"PM";return[{key:"AM",value:"AM",text:a},{key:"PM",value:"PM",text:d}]}),h=e.computed(()=>s.value.map(a=>Number(a.value??0))),x=e.computed(()=>v.value?u.value.map(a=>Number(a.value??0)):[0]);function U(a){return Number(a.value??0)}function se(a){const d=a.findIndex(g=>!g.disabled);return d>=0?d:0}function _(a){return!(!ve(a,c.minTime,c.maxTime)||he(a,c.disabledRanges??[])||c.isTimeDisabled?.(a))}const J=e.computed(()=>W.value.map(a=>{const d=U(a),g=h.value.some(k=>x.value.some(w=>_({h:d,m:k,s:w})));return{...a,disabled:!g}})),ne=e.computed(()=>{const a=Number(W.value[A.value]?.value??0);return s.value.map(d=>{const g=Number(d.value??0),k=x.value.some(w=>_({h:a,m:g,s:w}));return{...d,disabled:!k}})}),oe=e.computed(()=>{const a=Number(W.value[A.value]?.value??0),d=Number(s.value[D.value]?.value??0);return u.value.map(g=>{const k=Number(g.value??0);return{...g,disabled:!_({h:a,m:d,s:k})}})}),ie=e.computed(()=>{if(!n.value)return b.value;const a=Number(s.value[D.value]?.value??0),d=v.value?Number(u.value[p.value]?.value??0):0;return b.value.map(g=>{const k=g.value==="PM",w=L(k,c.hourStep).some(X=>_({h:Number(X.value??0),m:a,s:d}));return{...g,disabled:!w}})}),le=e.computed(()=>S.value===1?"PM":"AM"),Y=e.computed(()=>{const a=Number(W.value[A.value]?.value??0);return n.value?le.value==="PM"?pe(a,!0):pe(a,!1):y.value&&a===24?0:a}),ue=e.computed(()=>Number(s.value[D.value]?.value??0)),de=e.computed(()=>Number(u.value[p.value]?.value??0));function j(a,d,g){a.length&&(!a[d]||a[d].disabled)&&g(se(a))}e.watch(J,a=>{j(a,A.value,d=>{A.value=d})}),e.watch(ne,a=>{j(a,D.value,d=>{D.value=d})}),e.watch(oe,a=>{!v.value||!a.length||j(a,p.value,d=>{p.value=d})}),e.watch(ie,a=>{!n.value||!a.length||j(a,S.value,d=>{S.value=d})});function H(a){!v.value&&!n.value&&Q()}function ce(a){n.value||Q()}function F(a){Q()}function Q(){E.value=!1}return e.watch([Y,ue,de],([a,d,g])=>{N("update:initTime",{h:a,m:d,s:g})},{immediate:!0}),(a,d)=>E.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"vtp-cols",ref_key:"root",ref:M},[e.createVNode(Z,{activeIndex:A.value,"onUpdate:activeIndex":d[0]||(d[0]=g=>A.value=g),items:J.value,label:"Hours"},null,8,["activeIndex","items"]),e.createVNode(Z,{activeIndex:D.value,"onUpdate:activeIndex":d[1]||(d[1]=g=>D.value=g),items:ne.value,label:"Minutes",onSelect:H},null,8,["activeIndex","items"]),v.value?(e.openBlock(),e.createBlock(Z,{key:0,activeIndex:p.value,"onUpdate:activeIndex":d[2]||(d[2]=g=>p.value=g),items:oe.value,label:"Seconds",onSelect:ce},null,8,["activeIndex","items"])):e.createCommentVNode("",!0),n.value?(e.openBlock(),e.createBlock(Z,{key:1,activeIndex:S.value,"onUpdate:activeIndex":d[3]||(d[3]=g=>S.value=g),items:ie.value,label:"AM/PM",onSelect:F},null,8,["activeIndex","items"])):e.createCommentVNode("",!0)],512)):e.createCommentVNode("",!0)}});function Ae(t){return typeof t=="string"?G.test(t):Array.isArray(t)?t.length===2&&G.test(t[0]??"")&&G.test(t[1]??""):!1}function te(t){return t==null||typeof t=="string"||typeof t=="number"}function Ie(t){return t==null||typeof t=="string"||Array.isArray(t)||typeof t=="object"&&t!==null}const be=/^(HH|H|hh|h|kk|k):(mm|m)(?::(ss|s))?(?:\s*(A|a|P|p))?$/,G=/^([01]\d|2[0-3]):([0-5]\d)(:([0-5]\d))?$/,$=typeof __DEV__<"u"?__DEV__:typeof process<"u"&&process.env&&process.env.NODE_ENV!=="production",we={modelValue:{type:[String,Array],default:void 0,validator:t=>{let o;return Array.isArray(t)?o=t.length===2&&t.every(l=>G.test(l)):o=t==null||G.test(t),!o&&$&&console.error(`[VueTimepicker] \`modelValue\` is wrong. Received: ${t}`),o}},range:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},hideDropdown:{type:Boolean,default:!1},hourStep:{type:Number,default:1},minuteStep:{type:Number,default:1},secondStep:{type:Number,default:1},minTime:{type:String,default:void 0,validator:t=>{const o=t==null||G.test(t);return!o&&$&&console.error(`[VueTimepicker] \`minTime\` is wrong. Received: ${t}`),o}},maxTime:{type:String,default:void 0,validator:t=>{const o=t==null||G.test(t);return!o&&$&&console.error(`[VueTimepicker] \`maxTime\` is wrong. Received: ${t}`),o}},disabledTimes:{type:Array,default:void 0,validator:t=>{const o=t==null||t.every(Ae);return!o&&$&&console.error(`[VueTimepicker] \`disabledTimes\` is wrong. Received: ${JSON.stringify(t)}`),o}},isTimeDisabled:{type:Function,default:void 0},format:{type:String,default:"HH:mm",validator:t=>{const o=be.test(t);return!o&&$&&console.error(`[VueTimepicker] \`format\` format is wrong. Received: ${t}`),o}},placeholder:{type:String,default:"Select time"},id:{type:String,default:void 0,validator:t=>{const o=t==null||typeof t=="string";return!o&&$&&console.error(`[VueTimepicker] \`id\` must be a string. Received: ${t}`),o}},name:{type:String,default:void 0,validator:t=>{const o=t==null||typeof t=="string";return!o&&$&&console.error(`[VueTimepicker] \`name\` must be a string. Received: ${t}`),o}},tabindex:{type:Number,default:0,validator:t=>{const o=Number.isInteger(t);return!o&&$&&console.error(`[VueTimepicker] \`tabindex\` must be an integer. Received: ${t}`),o}},autocomplete:{type:String,default:"off",validator:t=>{const o=typeof t=="string";return!o&&$&&console.error(`[VueTimepicker] \`autocomplete\` must be a string. Received: ${t}`),o}},inputClass:{type:[String,Array,Object],default:void 0,validator:t=>{const o=Ie(t);return!o&&$&&console.error(`[VueTimepicker] \`inputClass\` must be a string, array, or object. Received: ${t}`),o}},inputWidth:{type:[String,Number],default:void 0,validator:t=>{const o=te(t);return!o&&$&&console.error(`[VueTimepicker] \`inputWidth\` must be a string or number. Received: ${t}`),o}},componentWidth:{type:[String,Number],default:void 0,validator:t=>{const o=te(t);return!o&&$&&console.error(`[VueTimepicker] \`componentWidth\` must be a string or number. Received: ${t}`),o}},minInputWidth:{type:[String,Number],default:void 0,validator:t=>{const o=te(t);return!o&&$&&console.error(`[VueTimepicker] \`minInputWidth\` must be a string or number. Received: ${t}`),o}},maxInputWidth:{type:[String,Number],default:void 0,validator:t=>{const o=te(t);return!o&&$&&console.error(`[VueTimepicker] \`maxInputWidth\` must be a string or number. Received: ${t}`),o}},size:{type:String,default:"md",validator:t=>{const o=t==="xs"||t==="sm"||t==="md"||t==="lg"||t==="xl";return!o&&$&&console.error(`[VueTimepicker] \`size\` is wrong. Received: ${t}`),o}}};function ye(t){const o=be.exec(t);if(!o)throw new Error(`[useTimeMask] Invalid format: ${t}`);const[,l,n,v,y]=o,c=[],N=!!y,E=/^k{1,2}$/.test(l);let M=0,R=23;return N?(M=1,R=12):E&&(M=1,R=24),c.push({token:l,min:M,max:R}),c.push({token:n,min:0,max:59}),v&&c.push({token:v,min:0,max:59}),{digitGroups:c,hasAmPm:!!y,ampmLowercase:y==="a"||y==="p"}}function Me(t){try{return ye(t)}catch{return ye("HH:mm")}}function ke(t){const o=e.computed(()=>Me(t.value)),l=e.computed(()=>o.value.digitGroups.length*2),n=e.ref([]),v=e.ref("AM"),y=e.ref("");function c(){const{digitGroups:s,hasAmPm:u}=o.value;let m="",b=0;for(let h=0;h<s.length;h++){for(let x=0;x<2;x++)b<n.value.length&&(m+=String(n.value[b]),b++);b===(h+1)*2&&h<s.length-1&&(m+=":")}if(u&&b>=l.value){const h=o.value.ampmLowercase?v.value.toLowerCase():v.value;m+=" "+h}return m}function N(s){const u=s*2;if(n.value.length<u+2)return;const m=n.value[u]*10+n.value[u+1],{min:b,max:h}=o.value.digitGroups[s],x=Math.max(b,Math.min(h,m));x!==m&&(n.value[u]=Math.floor(x/10),n.value[u+1]=x%10)}function E(){for(let s=0;s<o.value.digitGroups.length;s++)N(s)}function M(s){const u=c();let m=0;for(let b=0;b<Math.min(s,u.length);b++)/\d/.test(u[b])&&m++;return m}function R(s){return s+Math.floor(s/2)}function T(s,u){if(s>=l.value)return l.value;const m=[...n.value];m[s]=u,n.value=m;const b=Math.floor(s/2);return N(b),Math.min(s+1,l.value)}function A(s,u){const m=c();y.value=m,s.value=m;const b=u!==void 0?Math.min(R(u),m.length):m.length;s.selectionStart=s.selectionEnd=b,e.nextTick(()=>{document.activeElement===s&&(s.selectionStart=s.selectionEnd=b)})}function D(s){const u=s.key,m=s.target;if(["Tab","Escape","ArrowLeft","ArrowRight","Home","End"].includes(u)||s.metaKey||s.ctrlKey)return;s.preventDefault();const b=m.selectionStart??0,h=M(b);if(u==="Backspace"){h>0&&A(m,h-1);return}if(u!=="Delete"){if(o.value.hasAmPm){const x=u.toLowerCase();if(x==="a"){v.value="AM",A(m,h);return}if(x==="p"){v.value="PM",A(m,h);return}}if(/^\d$/.test(u)){const x=T(h,+u);A(m,x);return}}}function p(s){const u=s.target,m=u.value.replace(/\D/g,"").split("").map(Number).slice(0,l.value);n.value=m,E(),o.value.hasAmPm&&(/p/i.test(u.value)?v.value="PM":/a/i.test(u.value)&&(v.value="AM")),A(u)}function S(s){s.preventDefault();const u=s.clipboardData?.getData("text")??"",m=s.target,b=m.selectionStart??0,h=u.replace(/\D/g,"").split("").map(Number);let x=M(b);for(const U of h){if(x>=l.value)break;x=T(x,U)}o.value.hasAmPm&&(/p\.?m\.?/i.test(u)?v.value="PM":/a\.?m\.?/i.test(u)&&(v.value="AM")),A(m,x)}function V(s){const{digitGroups:u,hasAmPm:m}=o.value,b=[];let h=s.h;m?(v.value=s.h>=12?"PM":"AM",h=s.h%12,h===0&&(h=12)):re(t.value)&&(h=s.h===0?24:s.h),b.push(Math.floor(h/10),h%10),b.push(Math.floor(s.m/10),s.m%10),u.length>2&&b.push(Math.floor(s.s/10),s.s%10),n.value=b,y.value=c()}function I(){n.value=[],y.value="",v.value="AM"}function L(){if(n.value.length<l.value)return null;const s=[];for(let h=0;h<o.value.digitGroups.length;h++){const x=h*2;s.push(n.value[x]*10+n.value[x+1])}let u=s[0];const m=s[1],b=s[2]??0;return o.value.hasAmPm&&(u=v.value==="PM"?u===12?12:u+12:u===12?0:u),re(t.value)&&u===24&&(u=0),{h:u,m,s:b}}const P=e.computed(()=>n.value.length>=l.value),W=e.computed(()=>o.value.ampmLowercase);return{inputValue:y,handleKeydown:D,handleInput:p,handlePaste:S,setFromTime:V,clear:I,getParsedTime:L,isComplete:P,totalDigits:l,displayPosToDigitIndex:M,ampm:v,ampmLowercase:W}}const Pe=["data-size","data-validation","data-disabled"],Ne=["id","name","tabindex","autocomplete","value","placeholder","disabled"],Ee=["id","name","tabindex","autocomplete","value","placeholder","disabled"],De=e.defineComponent({__name:"TimePicker",props:we,emits:["update:modelValue","update:validationState","validate","open","close","error"],setup(t,{emit:o}){const l=e.ref(null),n=t,v=o,y=e.ref(!1),c=e.ref(!1),N=e.ref("valid"),E=e.ref("valid");function M(){y.value=!1,c.value=!1}function R(i,r){if(n.disabled&&r){M();return}r&&(i==="first"?c.value=!1:y.value=!1)}e.watch(y,i=>{R("first",i)}),e.watch(c,i=>{R("second",i)}),e.watch(()=>n.disabled,i=>{i&&M()}),e.watch(()=>n.hideDropdown,i=>{i&&M()});const T=e.computed({get(){if(Array.isArray(n.modelValue)){const[i,r]=n.modelValue;return[O(i,n.format),O(r,n.format)]}else return O(n.modelValue,n.format)},set(i){Array.isArray(i)?v("update:modelValue",[ee("HH:mm:ss",i[0]),ee("HH:mm:ss",i[1])]):v("update:modelValue",ee("HH:mm:ss",i))}}),A=e.computed(()=>n.minTime?O(n.minTime):null),D=e.computed(()=>n.maxTime?O(n.maxTime):null),p=e.computed(()=>!A.value||!D.value?!0:z(A.value,D.value)<=0),S=e.computed(()=>N.value==="out-of-range"||n.range&&E.value==="out-of-range"?"out-of-range":N.value==="invalid"||n.range&&E.value==="invalid"?"invalid":"valid"),V=e.computed(()=>(n.disabledTimes??[]).map(r=>{const f=Array.isArray(r)?r:[r,r],B=O(f[0]),C=O(f[1]);return z(B,C)<=0?[B,C]:[C,B]}));function I(i){return!!(he(i,V.value)||n.isTimeDisabled?.(i))}function L(i){return i==="first"?Array.isArray(T.value)?T.value[0]:T.value:Array.isArray(T.value)?T.value[1]:T.value}function P(i){const r=n.modelValue;return Array.isArray(r)?i==="first"?!!r[0]:!!r[1]:i==="second"?!1:typeof r=="string"&&r.length>0}function W(i,r){if(i==="first"){Array.isArray(T.value)?T.value=[r,T.value[1]]:T.value=r;return}Array.isArray(T.value)&&(T.value=[T.value[0],r])}function s(i,r,f,B){if(i==="first"?N.value=r:E.value=r,v("validate",{target:i,state:r,reason:f,value:B?ee("HH:mm:ss",B):null}),r==="valid"){l.value=null;return}if(r==="out-of-range"){l.value="OUT_OF_RANGE",v("error",{code:"OUT_OF_RANGE",message:"Time is outside min/max bounds and was clamped."});return}l.value=f??"BAD_TIME",v("error",{code:f??"BAD_TIME",message:f==="DISABLED"?"Time is disabled by disabledTimes or isTimeDisabled.":"Time is invalid."})}e.watch(S,i=>{v("update:validationState",i)},{immediate:!0});const u=e.computed(()=>p.value?A.value:null),m=e.computed(()=>p.value?D.value:null);function b(i){return Ve(i,u.value,m.value)}function h(i,r,f){const B=!ve(r,u.value,m.value),C=b(r);return I(C)?(f.emitValidation&&s(i,"invalid","DISABLED",C),!1):(W(i,C),f.emitValidation&&(B?s(i,"out-of-range","OUT_OF_RANGE",C):s(i,"valid",void 0,C)),!0)}const x=e.computed({get(){return Array.isArray(T.value)?T.value[0]:T.value},set(i){!P("first")&&!y.value||h("first",i,{emitValidation:!0})}}),U=e.computed({get(){return Array.isArray(T.value)?T.value[1]:T.value},set(i){!P("second")&&!c.value||Array.isArray(T.value)&&h("second",i,{emitValidation:!0})}});e.watch(()=>n.range,i=>{if(i){if(n.modelValue!=null&&!Array.isArray(n.modelValue))throw new RangeError(`Model value must be an array for range selection: ${n.modelValue}`)}else if(Array.isArray(n.modelValue))throw new RangeError(`Model value must be a single string for single time selection: ${n.modelValue}`)},{immediate:!0});function se(){P("first")&&h("first",L("first"),{emitValidation:!0}),n.range&&P("second")&&h("second",L("second"),{emitValidation:!0})}e.watch(()=>[u.value,m.value,V.value,n.isTimeDisabled,n.range],se,{immediate:!0});const _=e.computed(()=>n.format??"HH:mm:ss"),J=e.computed(()=>n.placeholder??"Select time"),ne=e.computed(()=>n.id),oe=e.computed(()=>n.range&&n.id?`${n.id}-end`:void 0),ie=e.computed(()=>n.name),le=e.computed(()=>n.range&&n.name?`${n.name}-end`:void 0);function Y(i){if(i==null)return;if(typeof i=="number")return`${i}px`;const r=i.trim();return r.length>0?r:void 0}const ue=e.computed(()=>{let i=Math.max(_.value.length,J.value.length);return/[AaPp]$/.test(_.value)&&(i=Math.max(i,_.value.length+1)),`${Math.min(20,Math.max(6,i))}ch`}),de=e.computed(()=>{const i={},r=Y(n.componentWidth),f=Y(n.inputWidth),B=Y(n.minInputWidth),C=Y(n.maxInputWidth);return r&&(i["--vtp-component-width"]=r),f&&(i["--vtp-input-width"]=f),B&&(i["--vtp-input-min-width"]=B),C&&(i["--vtp-input-max-width"]=C),i}),j=e.computed(()=>({width:`var(--vtp-input-width, ${ue.value})`,minWidth:"var(--vtp-input-min-width, 0)",maxWidth:"var(--vtp-input-max-width, none)"})),H=ke(_),ce=H.inputValue,F=ke(_),Q=F.inputValue,a=e.ref(null),d=e.ref(null),g=e.computed(()=>({left:`${(n.range&&c.value?d.value:a.value)?.offsetLeft??0}px`}));e.watch(()=>[x.value,_.value],([i])=>{if(!P("first")){H.clear();return}H.setFromTime(i)},{immediate:!0}),e.watch(()=>[U.value,_.value,n.range],([i,,r])=>{if(!r||!P("second")){F.clear();return}F.setFromTime(i)},{immediate:!0});function k(i,r,f){if(n.disabled)return!1;if(r.key==="Enter")return r.preventDefault(),q(i),!1;const B=/^\d$/.test(r.key);if(B&&(y.value=!1,c.value=!1),f.handleKeydown(r),B){const C=f.getParsedTime();C&&h(i,C,{emitValidation:!1})}return B}function w(i){const r=i.target,f=H.displayPosToDigitIndex(r.selectionStart??0),B=/^\d$/.test(i.key)&&f>=H.totalDigits.value-1;k("first",i,H)&&n.range&&B&&d.value&&(q("first"),e.nextTick(()=>{const ae=d.value;ae&&(ae.focus(),ae.selectionStart=ae.selectionEnd=0)}))}function X(i){k("second",i,F)}function q(i){const r=i==="first"?H:F,f=r.getParsedTime();f?h(i,f,{emitValidation:!0}):r.inputValue.value.trim()?s(i,"invalid","BAD_TIME"):!n.range&&i==="first"&&(v("update:modelValue",null),s("first","valid")),i==="first"?P("first")?H.setFromTime(x.value):H.clear():n.range&&(P("second")?F.setFromTime(U.value):F.clear())}return(i,r)=>(e.openBlock(),e.createElementBlock("div",{class:"timepicker-shell","data-size":n.size,"data-validation":S.value,"data-disabled":n.disabled?"true":"false",style:e.normalizeStyle(de.value)},[e.createElementVNode("div",{class:e.normalizeClass(["timepicker-shell__input",{"timepicker-shell__input--error":l.value,"timepicker-shell__input--disabled":n.disabled}])},[e.createElementVNode("input",{ref_key:"firstInputRef",ref:a,type:"text",class:e.normalizeClass(["timepicker-field",n.inputClass]),id:ne.value,name:ie.value,tabindex:n.tabindex,autocomplete:n.autocomplete,value:e.unref(ce),placeholder:J.value,style:e.normalizeStyle(j.value),disabled:n.disabled,onFocus:r[0]||(r[0]=f=>!n.disabled&&!n.hideDropdown&&(y.value=!0)),onKeydown:w,onInput:r[1]||(r[1]=(...f)=>e.unref(H).handleInput&&e.unref(H).handleInput(...f)),onPaste:r[2]||(r[2]=(...f)=>e.unref(H).handlePaste&&e.unref(H).handlePaste(...f)),onBlur:r[3]||(r[3]=f=>!n.disabled&&q("first"))},null,46,Ne),n.range?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[r[12]||(r[12]=e.createElementVNode("span",{class:"timepicker-separator"},"–",-1)),e.createElementVNode("input",{ref_key:"secondInputRef",ref:d,type:"text",class:e.normalizeClass(["timepicker-field",n.inputClass]),id:oe.value,name:le.value,tabindex:n.tabindex,autocomplete:n.autocomplete,value:e.unref(Q),placeholder:J.value,style:e.normalizeStyle(j.value),disabled:n.disabled,onFocus:r[4]||(r[4]=f=>!n.disabled&&!n.hideDropdown&&(c.value=!0)),onKeydown:X,onInput:r[5]||(r[5]=(...f)=>e.unref(F).handleInput&&e.unref(F).handleInput(...f)),onPaste:r[6]||(r[6]=(...f)=>e.unref(F).handlePaste&&e.unref(F).handlePaste(...f)),onBlur:r[7]||(r[7]=f=>!n.disabled&&q("second"))},null,46,Ee)],64)):e.createCommentVNode("",!0)],2),n.hideDropdown?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:"timepicker-popovers",style:e.normalizeStyle(g.value)},[e.createVNode(ge,{open:y.value,"onUpdate:open":r[8]||(r[8]=f=>y.value=f),initTime:x.value,"onUpdate:initTime":r[9]||(r[9]=f=>x.value=f),format:n.format,"hour-step":n.hourStep,"minute-step":n.minuteStep,"second-step":n.secondStep,"min-time":u.value,"max-time":m.value,"disabled-ranges":V.value,"is-time-disabled":n.isTimeDisabled},null,8,["open","initTime","format","hour-step","minute-step","second-step","min-time","max-time","disabled-ranges","is-time-disabled"]),n.range?(e.openBlock(),e.createBlock(ge,{key:0,open:c.value,"onUpdate:open":r[10]||(r[10]=f=>c.value=f),initTime:U.value,"onUpdate:initTime":r[11]||(r[11]=f=>U.value=f),format:n.format,"hour-step":n.hourStep,"minute-step":n.minuteStep,"second-step":n.secondStep,"min-time":u.value,"max-time":m.value,"disabled-ranges":V.value,"is-time-disabled":n.isTimeDisabled},null,8,["open","initTime","format","hour-step","minute-step","second-step","min-time","max-time","disabled-ranges","is-time-disabled"])):e.createCommentVNode("",!0)],4))],12,Pe))}});K.TimePicker=De,Object.defineProperty(K,Symbol.toStringTag,{value:"Module"})}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@manik02/vue3-timepicker",
-  "version": "0.4.3",
+  "version": "0.4.4",
   "description": "A flexible Vue 3 timepicker component with multiple format support, range selection, and fully customisable styling",
   "license": "MIT",
   "author": "Manos Savvides",