vexip-ui/lib/components/progress/progress.vue2.cjs

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

"use strict";const e=require("vue");require("../bubble/index.cjs");require("../renderer/index.cjs");const l=require("@vexip-ui/config"),c=require("@vexip-ui/utils"),k=require("./props.cjs"),C=require("./symbol.cjs"),u=require("../renderer/renderer.cjs"),h=require("../bubble/bubble.vue2.cjs"),_=["aria-valuenow","aria-valuetext"],z=e.defineComponent({name:"Progress",__name:"progress",props:k.progressProps,setup(p,{expose:d}){const f=p,t=l.useProps("progress",f,{percentage:{default:0,validator:o=>o>=0&&o<=100,static:!0},state:l.createStateProp(),strokeWidth:8,infoType:{default:"outside",validator:o=>C.infoTypes.includes(o)},precision:2,activated:!1,strokeColor:{default:null,validator:o=>!(Array.isArray(o)&&(!o[0]||!o[1]))},slots:()=>({})}),r=l.useNameHelper("progress"),m=e.computed(()=>[r.b(),r.bs("vars"),r.bm(`info-${t.infoType}`),{[r.bm("inherit")]:t.inherit,[r.bm(t.state)]:t.state!=="default",[r.bm("activated")]:t.activated}]),b=e.computed(()=>({[r.cv("percentage")]:t.percentage})),y=e.computed(()=>({height:`${t.strokeWidth}px`,borderRadius:`${t.strokeWidth}px`})),v=e.computed(()=>{const o={borderRadius:`${t.strokeWidth}px`},a=c.callIfFunc(t.strokeColor,t.percentage);return typeof a=="string"?o.backgroundColor=a:Array.isArray(a)&&(o.backgroundImage=`linear-gradient(to right, ${a[0]} 0%, ${a[1]} 100%)`),o}),n=e.computed(()=>t.infoType.includes("bubble")),i=e.computed(()=>n.value&&t.infoType.split("-").pop()==="bottom"?"bottom":"top"),g=e.computed(()=>n.value?{[i.value==="top"?"bottom":"top"]:`${t.strokeWidth}px`}:{}),s=e.computed(()=>c.toFixed(t.percentage,t.precision));return d({percentValue:s}),(o,a)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(m.value),style:e.normalizeStyle(b.value),role:"progressbar","aria-valuenow":s.value,"aria-valuetext":`${s.value}%`,"aria-valuemin":"0","aria-valuemax":"100"},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("track")),style:e.normalizeStyle(y.value)},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("filler")),style:e.normalizeStyle(v.value)},null,6),e.unref(t).infoType==="inside"?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(e.unref(r).be("info"))},[e.renderSlot(o.$slots,"default",{},()=>[e.createVNode(e.unref(u),{renderer:e.unref(t).slots.default},{default:e.withCtx(()=>[e.createElementVNode("span",{class:e.normalizeClass(e.unref(r).be("percentage"))},e.toDisplayString(`${s.value}%`),3)]),_:1},8,["renderer"])])],2)):e.createCommentVNode("",!0)],6),n.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(e.unref(r).be("reference"))},[e.createVNode(e.unref(h),{inherit:"",class:e.normalizeClass(e.unref(r).be("bubble")),style:e.normalizeStyle(g.value),placement:i.value,"content-class":e.unref(r).be("info")},{default:e.withCtx(()=>[e.renderSlot(o.$slots,"default",{},()=>[e.createVNode(e.unref(u),{renderer:e.unref(t).slots.default},{default:e.withCtx(()=>[e.createElementVNode("span",{class:e.normalizeClass(e.unref(r).be("percentage"))},e.toDisplayString(`${s.value}%`),3)]),_:1},8,["renderer"])])]),_:3},8,["class","style","placement","content-class"])],2)):e.unref(t).infoType==="outside"?(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(e.unref(r).be("info"))},[e.renderSlot(o.$slots,"default",{},()=>[e.createVNode(e.unref(u),{renderer:e.unref(t).slots.default},{default:e.withCtx(()=>[e.createElementVNode("span",{class:e.normalizeClass(e.unref(r).be("percentage"))},e.toDisplayString(`${s.value}%`),3)]),_:1},8,["renderer"])])],2)):e.createCommentVNode("",!0)],14,_))}});module.exports=z;
//# sourceMappingURL=progress.vue2.cjs.map