UNPKG

vue-amazing-ui

Version:

An Amazing Vue3 UI Components Library, Using TypeScript.

15 lines (14 loc) 6.28 kB
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),v=require("../utils/index.cjs"),C={class:"progress-inner"},$={key:0,class:"progress-success"},B={key:0,class:"icon-svg",focusable:"false","data-icon":"check-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},S={key:1,class:"progress-success-info"},w={key:1,class:"progress-text"},z={class:"progress-circle",viewBox:"0 0 100 100"},E={key:0},N=["id"],V=["stop-color"],_=["stop-color"],T=["d","stroke-linecap","stroke-width"],b=["d","stroke-linecap","stroke-width","opacity"],I={key:0,class:"icon-svg",focusable:"false","data-icon":"check",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},M={key:1,class:"progress-success-info"},P={key:2,class:"progress-text"},x=e.defineComponent({__name:"Progress",props:{width:{default:void 0},percent:{default:0},lineSize:{default:void 0},lineColor:{default:void 0},lineCap:{default:"round"},showInfo:{type:Boolean,default:!0},infoSize:{default:void 0},success:{default:void 0},format:{type:Function,default:i=>i+"%"},type:{default:"line"}},setup(i){const t=i,{colorPalettes:h}=v.useInject("Progress"),g=v.useSlotsExist(["success"]),c=e.computed(()=>{if(t.width===void 0){if(t.type==="line")return"100%";if(t.type==="circle")return"120px"}return typeof t.width=="number"?`${t.width}px`:t.width}),l=e.computed(()=>{if(t.lineSize===void 0){if(t.type==="line")return 8;if(t.type==="circle")return 6}return t.lineSize}),a=e.computed(()=>{if(t.infoSize===void 0){if(t.type==="line")return"14px";if(t.type==="circle")return"24px"}return`${t.infoSize}px`}),s=e.computed(()=>(100-l.value)*Math.PI),u=e.computed(()=>{const o=100-l.value;return`M 50,50 m 0,-${o/2} a ${o/2},${o/2} 0 1 1 0,${o} a ${o/2},${o/2} 0 1 1 0,-${o}`}),r=e.computed(()=>t.lineColor!==void 0&&typeof t.lineColor!="string"),d=e.computed(()=>t.lineColor===void 0?h.value[5]:typeof t.lineColor=="string"?t.lineColor:`linear-gradient(to ${t.lineColor.direction||"right"}, ${t.lineColor["0%"]||t.lineColor.from}, ${t.lineColor["100%"]||t.lineColor.to})`),p=e.computed(()=>{if(r.value){const o=t.lineColor;return o.direction===void 0||o.direction==="right"?`right-${o["0%"]||o.from}-${o["100%"]||o.to}`:`left-${o["100%"]||o.to}-${o["0%"]||o.from}`}return null}),k=e.computed(()=>{if(r.value){const o=t.lineColor;return o.direction===void 0||o.direction==="right"?o["0%"]||o.from:o["100%"]||o.to}}),y=e.computed(()=>{if(r.value){const o=t.lineColor;return!o.direction||o.direction==="right"?o["100%"]||o.to:o["0%"]||o.from}}),f=e.computed(()=>t.format(t.percent>100?100:t.percent)),m=e.computed(()=>g.success||t.success);return(o,n)=>o.type==="line"?(e.openBlock(),e.createElementBlock("div",{key:0,class:"progress-line-wrap",style:e.normalizeStyle(` --progress-size: ${c.value}; --progress-primary-color: ${d.value}; --progress-success-color: #52c41a; --progress-font-size: ${a.value}; --progress-border-radius: ${o.lineCap==="round"?"100px":0}; `)},[e.createElementVNode("div",C,[e.createElementVNode("div",{class:e.normalizeClass(["progress-bg",{"line-success":o.percent>=100&&!r.value}]),style:e.normalizeStyle(`width: ${o.percent>=100?100:o.percent}%; height: ${l.value}px;`)},null,6)]),o.showInfo?(e.openBlock(),e.createBlock(e.Transition,{key:0,name:"fade",mode:"out-in"},{default:e.withCtx(()=>[o.percent>=100?(e.openBlock(),e.createElementBlock("span",$,[m.value===void 0?(e.openBlock(),e.createElementBlock("svg",B,[...n[0]||(n[0]=[e.createElementVNode("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm193.5 301.7l-210.6 292a31.8 31.8 0 01-51.7 0L318.5 484.9c-3.8-5.3 0-12.7 6.5-12.7h46.9c10.2 0 19.9 4.9 25.9 13.3l71.2 98.8 157.2-218c6-8.3 15.6-13.3 25.9-13.3H699c6.5 0 10.3 7.4 6.5 12.7z"},null,-1)])])):(e.openBlock(),e.createElementBlock("p",S,[e.renderSlot(o.$slots,"success",{},()=>[e.createTextVNode(e.toDisplayString(o.success),1)],!0)]))])):(e.openBlock(),e.createElementBlock("p",w,[e.renderSlot(o.$slots,"format",{percent:o.percent},()=>[e.createTextVNode(e.toDisplayString(f.value),1)],!0)]))]),_:3})):e.createCommentVNode("",!0)],4)):(e.openBlock(),e.createElementBlock("div",{key:1,class:"progress-circle-wrap",style:e.normalizeStyle(` --progress-size: ${c.value}; --progress-primary-color: ${r.value?`url(#${p.value})`:d.value}; --progress-success-color: #52c41a; --progress-font-size: ${a.value}; `)},[(e.openBlock(),e.createElementBlock("svg",z,[r.value?(e.openBlock(),e.createElementBlock("defs",E,[e.createElementVNode("linearGradient",{id:`${p.value}`,x1:"100%",y1:"0%",x2:"0%",y2:"0%"},[e.createElementVNode("stop",{offset:"0%","stop-color":k.value},null,8,V),e.createElementVNode("stop",{offset:"100%","stop-color":y.value},null,8,_)],8,N)])):e.createCommentVNode("",!0),e.createElementVNode("path",{d:u.value,"stroke-linecap":o.lineCap,class:"circle-trail","stroke-width":l.value,style:e.normalizeStyle(`stroke-dasharray: ${s.value}px, ${s.value}px;`),"fill-opacity":"0"},null,12,T),e.createElementVNode("path",{d:u.value,"stroke-linecap":o.lineCap,class:e.normalizeClass(["circle-path",{"circle-path-success":o.percent>=100&&!r.value}]),"stroke-width":l.value,style:e.normalizeStyle(`stroke-dasharray: ${o.percent/100*s.value}px, ${s.value}px;`),opacity:o.percent===0?0:1,"fill-opacity":"0"},null,14,b)])),o.showInfo?(e.openBlock(),e.createBlock(e.Transition,{key:0,name:"fade",mode:"out-in"},{default:e.withCtx(()=>[m.value===void 0&&o.percent>=100?(e.openBlock(),e.createElementBlock("svg",I,[...n[1]||(n[1]=[e.createElementVNode("path",{d:"M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 00-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z"},null,-1)])])):o.percent>=100?(e.openBlock(),e.createElementBlock("p",M,[e.renderSlot(o.$slots,"success",{},()=>[e.createTextVNode(e.toDisplayString(o.success),1)],!0)])):(e.openBlock(),e.createElementBlock("p",P,[e.renderSlot(o.$slots,"format",{percent:o.percent},()=>[e.createTextVNode(e.toDisplayString(f.value),1)],!0)]))]),_:3})):e.createCommentVNode("",!0)],4))}});exports.default=x;