vue-amazing-ui
Version:
An Amazing Vue3 UI Components Library, Using TypeScript.
2 lines (1 loc) • 1.2 kB
JavaScript
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("vue"),y=require("../utils/index.cjs"),i=require("@vueuse/core"),h=t.defineComponent({__name:"NumberAnimation",props:{from:{default:0},to:{default:1e3},duration:{default:3e3},autoplay:{type:Boolean,default:!0},precision:{default:0},prefix:{default:void 0},suffix:{default:void 0},separator:{default:","},decimal:{default:"."},valueStyle:{default:()=>({})},transition:{default:"easeInOutCubic"}},emits:["started","finished"],setup(s,{expose:l,emit:d}){const e=s,o=t.ref(e.from),n=d;t.watchEffect(()=>{o.value=e.from}),t.watch(()=>[e.from,e.to],()=>{e.autoplay&&a()},{deep:!0}),t.onMounted(()=>{e.autoplay&&a()});const f=i.useTransition(o,{duration:e.duration,transition:i.TransitionPresets[e.transition],onFinished:()=>n("finished"),onStarted:()=>n("started")});function a(){o.value=e.to}const c=t.computed(()=>{const{precision:u,separator:r,decimal:p,prefix:m,suffix:v}=e;return y.formatNumber(f.value,u,r,p,m,v)});return l({play:a}),(u,r)=>(t.openBlock(),t.createElementBlock("span",{style:t.normalizeStyle(u.valueStyle)},t.toDisplayString(c.value),5))}});exports.default=h;