vue-data-ui
Version:
A user-empowering data visualization Vue 3 components library for eloquent data storytelling
2 lines (1 loc) • 3.94 kB
JavaScript
;Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),g=require("./useNestedProp-BJQoarHp.cjs"),L=require("./index-_gyicZFE.cjs"),f={key:0},m=["d","fill"],k=["d","fill"],h=["d","fill"],v=["d","fill"],C=["d","fill"],N=["d","fill"],b=["d","fill"],B={key:1},E=["cx","cy","fill"],q={__name:"Digit",props:{quanta:{type:String,default:null},backgroundColor:{type:String,default:"#e1e5e8"},color:{type:String,default:"#000000"},x:{type:Number,default:0},y:{type:Number,default:0}},setup(e){const $=e,u=t.ref({0:"1111110",1:"0110000",2:"1101101",3:"1111001",4:"0110011",5:"1011011",6:"1011111",7:"1110000",8:"1111111",9:"1111011","-":"0000001",X:"0000000"}),l=t.computed(()=>[void 0,null].includes($.quanta)?u.value.X:u.value[$.quanta]);return(a,x)=>(t.openBlock(),t.createElementBlock(t.Fragment,null,[[void 0,null,"."].includes(e.quanta)?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("g",f,[t.createElementVNode("path",{d:`M ${e.x} ${e.y} L ${e.x+2} ${e.y-2} L ${e.x+24} ${e.y-2} L ${e.x+26} ${e.y} L ${e.x+24} ${e.y+2} L ${e.x+2} ${e.y+2}Z`,fill:l.value[0]==1?e.color:e.backgroundColor,stroke:"none"},null,8,m),t.createElementVNode("path",{d:`M ${e.x+26} ${e.y+26} L ${e.x+26} ${e.y+4} L ${e.x+28} ${e.y+2} L ${e.x+30} ${e.y+4} L ${e.x+30} ${e.y+26} L ${e.x+28} ${e.y+28} L ${e.x+26} ${e.y+26}`,fill:l.value[1]==1?e.color:e.backgroundColor,stroke:"none"},null,8,k),t.createElementVNode("path",{d:`M ${e.x+26} ${e.y+56} L ${e.x+26} ${e.y+34} L ${e.x+28} ${e.y+32} L ${e.x+30} ${e.y+34} L ${e.x+30} ${e.y+56} L ${e.x+28} ${e.y+58} L ${e.x+26} ${e.y+56}`,fill:l.value[2]==1?e.color:e.backgroundColor,stroke:"none"},null,8,h),t.createElementVNode("path",{d:`M ${e.x+2} ${e.y+58} L ${e.x} ${e.y+60} L ${e.x+2} ${e.y+62} L ${e.x+24} ${e.y+62} L ${e.x+26} ${e.y+60} L ${e.x+24} ${e.y+58} L ${e.x+2} ${e.y+58}`,fill:l.value[3]==1?e.color:e.backgroundColor,stroke:"none"},null,8,v),t.createElementVNode("path",{d:`M ${e.x} ${e.y+34} L ${e.x-2} ${e.y+32} L ${e.x-4} ${e.y+34} L ${e.x-4} ${e.y+56} L ${e.x-2} ${e.y+58} L ${e.x} ${e.y+56} L ${e.x} ${e.y+34}`,fill:l.value[4]==1?e.color:e.backgroundColor,stroke:"none"},null,8,C),t.createElementVNode("path",{d:`M ${e.x-2} ${e.y+2} L ${e.x} ${e.y+4} L ${e.x} ${e.y+26} L ${e.x-2} ${e.y+28} L ${e.x-4} ${e.y+26} L ${e.x-4} ${e.y+4} L ${e.x-2} ${e.y+2}`,fill:l.value[5]==1?e.color:e.backgroundColor,stroke:"none"},null,8,N),t.createElementVNode("path",{d:`M ${e.x+2} ${e.y+28} L ${e.x} ${e.y+30} L ${e.x+2} ${e.y+32} L ${e.x+24} ${e.y+32} L ${e.x+26} ${e.y+30} L ${e.x+24} ${e.y+28} L ${e.x+2} ${e.y+28}`,fill:l.value[6]==1?e.color:e.backgroundColor,stroke:"none"},null,8,b)])),e.quanta=="."?(t.openBlock(),t.createElementBlock("g",B,[t.createElementVNode("circle",{cx:e.x-8,cy:e.y+60,r:3,fill:e.color},null,8,E)])):t.createCommentVNode("",!0)],64))}},M=["xmlns","viewBox"],V={__name:"vue-ui-digits",props:{dataset:{type:Number,default:0},config:{type:Object,default(){return{}}}},setup(e){const{vue_ui_digits:$}=L.useConfig(),u=e,l=t.computed(()=>g.useNestedProp({userConfig:u.config,defaultConfig:$})),a=t.computed(()=>{const c=(u.dataset||0).toString().split(""),i=[],n={x:10,y:10};let d=0;for(let y=0;y<c.length;y+=1){const o=c[y];i.push({x:n.x+d,y:n.y,quanta:o}),o=="."?d+=2:d+=44}return i}),x=t.computed(()=>Math.max(...a.value.map(c=>c.x))+36);return(c,i)=>(t.openBlock(),t.createElementBlock("svg",{class:"vue-ui-digits",xmlns:t.unref(L.XMLNS),viewBox:`0 0 ${x.value} 80`,style:t.normalizeStyle(`background:${l.value.backgroundColor};${l.value.height?`height:${l.value.height};`:""}${l.value.width?`width:${l.value.width}`:""}`)},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(a.value,n=>(t.openBlock(),t.createBlock(q,{x:n.x,y:n.y,quanta:n.quanta,color:l.value.digits.color,backgroundColor:l.value.digits.skeletonColor},null,8,["x","y","quanta","color","backgroundColor"]))),256))],12,M))}};exports.default=V;