@chenfengyuan/vue-countdown/dist/vue-countdown.esm.min.js

Countdown component for Vue 3.

/*! vue-countdown v2.1.3 | (c) 2018-present Chen Fengyuan | MIT */
import{defineComponent as t,h as s}from"vue";const i=1e3,e=6e4,o=36e5,n=864e5,a="abort",l="progress",h="start",u="visibilitychange";var d=t({name:"VueCountdown",props:{autoStart:{type:Boolean,default:!0},emitEvents:{type:Boolean,default:!0},interval:{type:Number,default:1e3,validator:t=>t>=0},now:{type:Function,default:()=>Date.now()},tag:{type:String,default:"span"},time:{type:Number,default:0,validator:t=>t>=0},transform:{type:Function,default:t=>t}},emits:[a,"end",l,h],data:()=>({counting:!1,endTime:0,totalMilliseconds:0,requestId:0,autoPauseOnHide:!1}),computed:{days(){return Math.floor(this.totalMilliseconds/n)},hours(){return Math.floor(this.totalMilliseconds%n/o)},minutes(){return Math.floor(this.totalMilliseconds%o/e)},seconds(){return Math.floor(this.totalMilliseconds%e/i)},milliseconds(){return Math.floor(this.totalMilliseconds%i)},totalDays(){return this.days},totalHours(){return Math.floor(this.totalMilliseconds/o)},totalMinutes(){return Math.floor(this.totalMilliseconds/e)},totalSeconds(){return Math.floor(this.totalMilliseconds/i)}},watch:{$props:{deep:!0,immediate:!0,handler(){this.totalMilliseconds=this.time,this.endTime=this.now()+this.time,this.autoStart&&this.start()}}},mounted(){document.addEventListener(u,this.handleVisibilityChange)},beforeUnmount(){document.removeEventListener(u,this.handleVisibilityChange),this.pause()},methods:{start(){this.counting||(this.counting=!0,this.autoStart||(this.totalMilliseconds=this.time,this.endTime=this.now()+this.time),this.emitEvents&&this.$emit(h),"visible"===document.visibilityState&&this.continue())},continue(){if(!this.counting)return;const t=Math.min(this.totalMilliseconds,this.interval);if(t>0){let s,i;const e=o=>{s||(s=o),i||(i=o);const n=o-s;n>=t||n+(o-i)/2>=t?this.progress():this.requestId=requestAnimationFrame(e),i=o};this.requestId=requestAnimationFrame(e)}else this.end()},pause(){cancelAnimationFrame(this.requestId),this.requestId=0},progress(){this.counting&&(this.update(),this.emitEvents&&this.totalMilliseconds>0&&this.$emit(l,{days:this.days,hours:this.hours,minutes:this.minutes,seconds:this.seconds,milliseconds:this.milliseconds,totalDays:this.totalDays,totalHours:this.totalHours,totalMinutes:this.totalMinutes,totalSeconds:this.totalSeconds,totalMilliseconds:this.totalMilliseconds}),this.continue())},abort(){this.counting&&(this.pause(),this.counting=!1,this.emitEvents&&this.$emit(a))},end(){this.counting&&(this.pause(),this.totalMilliseconds=0,this.counting=!1,this.emitEvents&&this.$emit("end"))},update(){this.counting&&(this.totalMilliseconds=Math.max(0,this.endTime-this.now()))},restart(){this.pause(),this.totalMilliseconds=this.time,this.endTime=this.now()+this.time,this.counting=!1,this.start()},handleVisibilityChange(){switch(document.visibilityState){case"visible":0===this.requestId&&this.autoPauseOnHide&&(this.update(),this.continue()),this.autoPauseOnHide=!1;break;case"hidden":this.requestId>0&&(this.autoPauseOnHide=!0,this.pause())}}},render(){return s(this.tag,this.$slots.default?[this.$slots.default(this.transform({days:this.days,hours:this.hours,minutes:this.minutes,seconds:this.seconds,milliseconds:this.milliseconds,totalDays:this.totalDays,totalHours:this.totalHours,totalMinutes:this.totalMinutes,totalSeconds:this.totalSeconds,totalMilliseconds:this.totalMilliseconds}))]:void 0)}});export{d as default};