vue-data-ui-hq
Version:
A user-empowering data visualization Vue 3 components library for eloquent data storytelling
2 lines (1 loc) • 1.56 kB
JavaScript
"use strict";const e=require("vue"),d=require("./Shape-C3YtaYr4.cjs"),u=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),s=["id"],f=["onClick","height","width"],g={__name:"Legend",props:{legendSet:{type:Array,default(){return[]}},config:{type:Object,default(){return{}}},id:{type:String,default:""},clickable:{type:Boolean,default:!0}},emits:["clickMarker"],setup(t,{emit:c}){const a=c;function r(i,o){a("clickMarker",{legend:i,i:o})}return(i,o)=>(e.openBlock(),e.createElementBlock("div",{id:t.id,class:"vue-data-ui-legend",style:e.normalizeStyle(`background:${t.config.backgroundColor};font-size:${t.config.fontSize}px;color:${t.config.color};padding-bottom:${t.config.paddingBottom}px;padding-top:${t.config.paddingTop||12}px;font-weight:${t.config.fontWeight}`)},[e.renderSlot(i.$slots,"legendTitle",{titleSet:t.legendSet},void 0,!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.legendSet,(n,l)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass({"vue-data-ui-legend-item":!0,active:t.clickable})},[n.shape?(e.openBlock(),e.createElementBlock("svg",{key:0,onClick:m=>r(n,l),height:t.config.fontSize,width:t.config.fontSize,viewBox:"0 0 20 20",style:e.normalizeStyle(`overflow: visible;opacity:${n.opacity}`)},[e.createVNode(d._sfc_main,{shape:n.shape,radius:9,stroke:"none",plot:{x:10,y:10},fill:n.color},null,8,["shape","fill"])],12,f)):e.createCommentVNode("",!0),e.renderSlot(i.$slots,"item",{legend:n,index:l},void 0,!0)],2))),256))],12,s))}},k=u._export_sfc(g,[["__scopeId","data-v-310b3d7d"]]);exports.Legend=k;