vue-data-ui/dist/vue-ui-flow-v5zjc5i3.cjs

A user-empowering data visualization Vue 3 components library for eloquent data storytelling

"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),n=require("./index-B7zOq_yO.cjs"),Le=require("./Title-LLvOAGEi.cjs"),ge=require("./usePrinter-u4erwqXt.cjs"),ze=require("./DataTable-DypMcnH2.cjs"),Fe=require("./vue-ui-accordion-DkOSgEPp.cjs"),Ve=require("./vue-ui-skeleton-Br6xw2QW.cjs"),me=require("./useNestedProp-DUH233CH.cjs"),Ae=require("./PackageVersion-BS7Jybcw.cjs"),Ie=require("./PenAndPaper-CU0ABvzv.cjs"),Me=require("./useUserOptionState-BgepsfED.cjs"),De=require("./useChartAccessibility-Cm7nkzTG.cjs"),He=require("./Tooltip-B1xW8AQT.cjs"),qe=require("./Legend-DUZ-tBhF.cjs"),Re=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),Ye=["id"],Ue={key:1,ref:"noTitle",class:"vue-data-ui-no-title-space",style:"height:36px; width: 100%;background:transparent"},je={key:2,style:"width:100%;background:transparent;padding-bottom:24px"},Ge=["xmlns","viewBox"],We=["width","height"],Xe=["id"],Ze=["stop-color"],Je=["stop-color"],Ke=["d","fill","stroke","stroke-width"],Qe=["x","y","height","width","fill","stroke","stroke-width","onMouseenter"],et=["x","y","font-size","fill"],tt=["x","y","font-size","fill"],ot={key:4,class:"vue-data-ui-watermark"},lt=["onClick"],at={key:6,ref:"source",dir:"auto"},nt=["innerHTML"],rt={__name:"vue-ui-flow",props:{config:{type:Object,default(){return{}}},dataset:{type:Array,default(){return[]}}},setup(ye,{expose:be}){const{vue_ui_flow:ke}=n.useConfig(),y=ye,V=e.computed(()=>!!y.dataset&&y.dataset.length);e.onMounted(()=>{G()});function G(){n.objectIsEmpty(y.dataset)&&n.error({componentName:"VueUiFlow",type:"dataset"})}const A=e.ref(n.createUid()),I=e.ref(null),W=e.ref(0),X=e.ref(0),M=e.ref(!1),D=e.ref(""),Ce=e.ref(null),S=e.ref(!1);function we(o){S.value=o,W.value+=1}const t=e.computed({get:()=>Q(),set:o=>o}),{userOptionsVisible:H,setUserOptionsVisibility:Z,keepUserOptionState:J}=Me.useUserOptionState({config:t.value}),{svgRef:K}=De.useChartAccessibility({config:t.value.style.chart.title});function Q(){const o=me.useNestedProp({userConfig:y.config,defaultConfig:ke});let a=o;return o.theme?a={...me.useNestedProp({userConfig:n.themes.vue_ui_flow[o.theme]||y.config,defaultConfig:o}),customPalette:n.themePalettes[o.theme]||n.palette}:a=o,a.nodeCategories=y.config.nodeCategories||{},a.nodeCategoryColors=y.config.nodeCategoryColors||{},a}e.watch(()=>y.config,o=>{t.value=Q(),H.value=!t.value.userOptions.showOnChartHover,G(),X.value+=1,k.value.showTable=t.value.table.show},{deep:!0});const{isPrinting:ee,isImaging:te,generatePdf:oe,generateImage:le}=ge.usePrinter({elementId:`flow_${A.value}`,fileName:t.value.style.chart.title.text||"vue-ui-flow",options:t.value.userOptions.print}),Ne=e.computed(()=>t.value.userOptions.show&&!t.value.style.chart.title.text),P=e.computed(()=>n.convertCustomPalette(t.value.customPalette)),ae=e.computed(()=>t.value.style.chart.nodes.gap),T=e.computed(()=>t.value.style.chart.nodes.width),k=e.ref({showTable:t.value.table.show,showTooltip:t.value.style.chart.tooltip.show}),$e=e.computed(()=>t.value.style.chart.links.width),q=e.computed(()=>!y.dataset||!y.dataset.length?[]:y.dataset.map((o,a)=>[o[0],o[1],n.checkNaN(o[2]),o[3]?n.convertColorToHex(o[3]):P.value[a]||P.value[a%P.value.length]||n.palette[a]||n.palette[a%n.palette.length]])),ne=e.computed(()=>{const o={};function a(r){o[r]||(o[r]={inflow:0,outflow:0})}q.value.forEach(([r,u,h])=>{a(r),a(u),o[r].outflow+=h,o[u].inflow+=h});let l=0;for(const r in o){const u=Math.max(o[r].inflow,o[r].outflow);l=Math.max(l,u)}return l});function xe(o){return o/ne.value*100+t.value.style.chart.nodes.minHeight}function Se(o){const a=t.value.style.chart.nodes.minHeight;return(o-a)/100*ne.value}function Te(o){const a={},l={};function r(s,c){a[s]||(a[s]={height:0,level:null,inflow:0,outflow:0,uid:n.createUid()}),a[s].level===null&&(a[s].level=c),l[c]||(l[c]=[]),l[c].includes(s)||l[c].push(s)}o.forEach(([s,c,d])=>{var i;const v=((i=a[s])==null?void 0:i.level)??0,p=v+1;r(s,v),r(c,p),a[s].children||(a[s].children=[]),a[s].children.push({target:c,value:d}),a[s].outflow+=d,a[c].inflow+=d});const u=new Set(o.map(([s])=>s)),h=new Set(o.map(([,s])=>s)),w=Array.from(u).filter(s=>!h.has(s)),_={};w.forEach((s,c)=>{_[s]=P.value[c]||n.palette[c%n.palette.length]});const b={};o.forEach(([s,c,d,v])=>{v&&(b[s]=v,b[c]=v)}),Object.keys(a).forEach((s,c)=>{var p,i;const d=(p=t.value.nodeCategories)==null?void 0:p[s],v=d?(i=t.value.nodeCategoryColors)==null?void 0:i[d]:null;a[s].color=b[s]||v||(w.includes(s)?_[s]:null)||n.palette[c%n.palette.length]});for(const s in a)a[s].height=xe(Math.max(a[s].inflow,a[s].outflow)),a[s].name=s;const C={};for(const s in l){let c=0;l[s].forEach((d,v)=>{const p=a[d];C[d]={x:parseInt(s,10)*$e.value+t.value.style.chart.padding.left,y:c,absoluteY:c,height:p.height,i:v,color:p.color,value:Se(p.height)},c+=p.height+ae.value})}const x=[];for(const s of Object.keys(a)){let c=C[s].absoluteY+t.value.style.chart.padding.top;const d=a[s],v=C[s];d.children&&d.children.forEach(({target:p,value:i})=>{const f=C[p],N=a[p],F=n.checkNaN(c),he=n.checkNaN(c+i/d.outflow*v.height),j=n.checkNaN(f.y+t.value.style.chart.padding.top),pe=n.checkNaN(j+i/N.inflow*f.height);x.push({id:n.createUid(),source:s,target:p,path:`M ${n.checkNaN(v.x+T.value)} ${F} L ${n.checkNaN(v.x+T.value)} ${he} L ${n.checkNaN(f.x)} ${pe} L ${n.checkNaN(f.x)} ${j} Z`,value:i,sourceColor:d.color,targetColor:N.color}),c+=he-F,C[p].y+=pe-j})}return{nodeCoordinates:C,links:x}}const g=e.computed(()=>{const o=Te(y.dataset);return{nodes:Object.keys(o.nodeCoordinates).map((a,l)=>({...o.nodeCoordinates[a],name:a})),links:o.links}});e.computed(()=>Be(g.value.nodes));function Be(o){const a={};for(const r in o){const{x:u,height:h}=o[r];a[u]||(a[u]=0),a[u]+=h+ae.value}return Math.max(...Object.values(a))}const E=e.computed(()=>{const{top:o,right:a,bottom:l,left:r}=t.value.style.chart.padding,u=Math.max(...g.value.nodes.map(b=>b.x)),h=r+u+T.value+a,w=Math.max(...g.value.nodes.map(b=>b.absoluteY+b.height)),_=o+w+l;return{width:h,height:_}});function _e(o){const a={},l={},r=new Set;return q.value.forEach(([u,h,w])=>{a[u]||(a[u]=[]),l[h]||(l[h]=[]),a[u].push(h),l[h].push(u)}),a[o]&&a[o].forEach(u=>r.add(u)),l[o]&&l[o].forEach(u=>r.add(u)),Array.from(r).concat(o)}const m=e.ref(null),B=e.ref(null),R=e.ref(null),O=e.ref(!1);function Ee(o){$.value=[],m.value=_e(o.name),B.value=o.name;const a=o.name,l=q.value;let r=0,u=0,h=[],w=[];const _=new Set(l.map(([i])=>i)),b=new Set(l.map(([,i])=>i)),fe=Array.from(_).filter(i=>!b.has(i)),C=l.filter(([i])=>fe.includes(i)).reduce((i,[f,N,F])=>i+F,0),x={};g.value.nodes.forEach(i=>{x[i.name]=i.color}),l.forEach(([i,f,N])=>{f===a&&(r+=N,h.push({source:i,value:N,color:x[i]})),i===a&&(u+=N,w.push({target:f,value:N,color:x[f]}))});const s=Math.max(r,u),c=C>0?s/C*100:0,d={name:a,inflow:r,outflow:u,from:h,to:w,percentOfTotal:c,color:x[a]||"#000000"};R.value={datapoint:d},M.value=!0;let v="";const p=t.value.style.chart.tooltip.customFormat;if(O.value=!1,n.isFunction(p))try{const i=p({datapoint:d,series:g.value,config:t.value});typeof i=="string"&&(D.value=i,O.value=!0)}catch{console.warn("Custom format cannot be applied.")}if(!O.value){const i=t.value.style.chart.tooltip.showPercentage?`<div>${n.dataLabel({p:t.value.style.chart.tooltip.translations.percentOfTotal,v:d.percentOfTotal,s:"%",r:t.value.style.chart.tooltip.roundingPercentage})}</div>`:"";v+=`<div style="width:100%;text-align:center;border-bottom:1px solid ${t.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;"><span style="margin-right:4px; color:${d.color}">⏹</span>${d.name}${i}</div>`,d.from.length&&(v+=`<div>${t.value.style.chart.tooltip.translations.from}</div>`,d.from.forEach(f=>{v+=`<div><span style="color:${f.color}">⏹←</span> ${f.source}: ${n.applyDataLabel(t.value.style.chart.nodes.labels.formatter,f.value,n.dataLabel({p:t.value.style.chart.nodes.labels.prefix,v:f.value,s:t.value.style.chart.nodes.labels.suffix,r:t.value.style.chart.nodes.labels.rounding}))}</div>`})),d.to.length&&(v+=`<div style="margin-top:6px;">${t.value.style.chart.tooltip.translations.to}</div>`,d.to.forEach(f=>{v+=`<div><span style="color:${f.color}">⏹→</span> ${f.target}: ${n.applyDataLabel(t.value.style.chart.nodes.labels.formatter,f.value,n.dataLabel({p:t.value.style.chart.nodes.labels.prefix,v:f.value,s:t.value.style.chart.nodes.labels.suffix,r:t.value.style.chart.nodes.labels.rounding}))}</div>`})),D.value=v}}function re(){m.value=null,B.value=null,M.value=!1}const se=e.computed(()=>g.value.links.map(({source:o,target:a,sourceColor:l,targetColor:r,value:u})=>({source:o,target:a,sourceColor:l,targetColor:r,value:u})));function ue(){e.nextTick(()=>{const o=se.value.map((r,u)=>[[r.source],[r.target],[r.value]]),a=[[t.value.style.chart.title.text],[t.value.style.chart.title.subtitle.text],[[t.value.table.columnNames.source],[t.value.table.columnNames.target],[t.value.table.columnNames.value]]].concat(o),l=n.createCsvContent(a);n.downloadCsv({csvContent:l,title:t.value.style.chart.title.text||"vue-ui-flow"})})}const L=e.computed(()=>{const o=[t.value.table.columnNames.source,t.value.table.columnNames.target,t.value.table.columnNames.value],a=se.value.map((u,h)=>[{color:u.sourceColor,name:u.source},{color:u.targetColor,name:u.target},n.dataLabel({p:t.value.style.chart.nodes.labels.prefix,v:u.value,s:t.value.style.chart.nodes.labels.suffix,r:t.value.style.chart.nodes.labels.rounding})]),l={th:{backgroundColor:t.value.table.th.backgroundColor,color:t.value.table.th.color,outline:t.value.table.th.outline},td:{backgroundColor:t.value.table.td.backgroundColor,color:t.value.table.td.color,outline:t.value.table.td.outline},breakpoint:t.value.table.responsiveBreakpoint};return{colNames:[t.value.table.columnNames.source,t.value.table.columnNames.target,t.value.table.columnNames.value],head:o,body:a,config:l}});function Pe(){return g.value}function ie(){k.value.showTable=!k.value.showTable}const z=e.ref(!1);function Y(){z.value=!z.value}function ce(){k.value.showTooltip=!k.value.showTooltip}const de=e.computed(()=>{const o=new Set(g.value.nodes.map(a=>t.value.nodeCategories[a.name]||"__uncategorized__"));return Array.from(o).map(a=>({name:a,color:t.value.nodeCategoryColors[a]||n.palette[0],shape:"square",count:g.value.nodes.filter(l=>(t.value.nodeCategories[l.name]||"__uncategorized__")===a).length})).map((a,l)=>({...a,segregate:()=>U({legend:a,i:l}),opacity:$.value.length?$.value.includes(l)?1:.5:1}))}),ve=e.computed(()=>de.value.filter(o=>o.name!=="__uncategorized__")),$=e.ref([]);function U({legend:o,i:a}){var r;const l=o.name;if((r=m.value)!=null&&r.every(u=>t.value.nodeCategories[u]===l)){m.value=null,B.value=null,$.value=[];return}$.value=[a],m.value=g.value.nodes.filter(u=>t.value.nodeCategories[u.name]===l).map(u=>u.name),B.value=null}const Oe=e.computed(()=>({cy:"flow-legend",backgroundColor:t.value.style.chart.legend.backgroundColor,color:t.value.style.chart.legend.color,fontSize:t.value.style.chart.legend.fontSize,paddingBottom:t.value.style.chart.legend.paddingBottom,fontWeight:t.value.style.chart.legend.bold?"bold":"normal"}));return be({getData:Pe,generateCsv:ue,generateImage:le,generatePdf:oe,toggleTable:ie,toggleAnnotator:Y,toggleTooltip:ce,drillCategory:U,unselectNode:re}),(o,a)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"flowChart",ref:I,class:e.normalizeClass(`vue-ui-flow ${S.value?"vue-data-ui-wrapper-fullscreen":""}`),style:e.normalizeStyle(`font-family:${t.value.style.fontFamily};width:100%; text-align:center;background:${t.value.style.chart.backgroundColor}`),id:`flow_${A.value}`,onMouseenter:a[3]||(a[3]=()=>e.unref(Z)(!0)),onMouseleave:a[4]||(a[4]=()=>e.unref(Z)(!1))},[t.value.userOptions.buttons.annotator?(e.openBlock(),e.createBlock(Ie._sfc_main,{key:0,svgRef:e.unref(K),backgroundColor:t.value.style.chart.backgroundColor,color:t.value.style.chart.color,active:z.value,onClose:Y},null,8,["svgRef","backgroundColor","color","active"])):e.createCommentVNode("",!0),Ne.value?(e.openBlock(),e.createElementBlock("div",Ue,null,512)):e.createCommentVNode("",!0),t.value.style.chart.title.text?(e.openBlock(),e.createElementBlock("div",je,[(e.openBlock(),e.createBlock(Le._sfc_main,{key:`title_${X.value}`,config:{title:{cy:"flow-title",...t.value.style.chart.title},subtitle:{cy:"flow-subtitle",...t.value.style.chart.title.subtitle}}},null,8,["config"]))])):e.createCommentVNode("",!0),t.value.userOptions.show&&V.value&&(e.unref(J)||e.unref(H))?(e.openBlock(),e.createBlock(ge.UserOptions,{ref:"details",key:`user_option_${W.value}`,backgroundColor:t.value.style.chart.backgroundColor,color:t.value.style.chart.color,isPrinting:e.unref(ee),isImaging:e.unref(te),uid:A.value,hasPdf:t.value.userOptions.buttons.pdf,hasXls:t.value.userOptions.buttons.csv,hasImg:t.value.userOptions.buttons.img,hasTable:t.value.userOptions.buttons.table,hasFullscreen:t.value.userOptions.buttons.fullscreen,isFullscreen:S.value,titles:{...t.value.userOptions.buttonTitles},chartElement:I.value,position:t.value.userOptions.position,hasAnnotator:t.value.userOptions.buttons.annotator,isAnnotation:z.value,hasTooltip:t.value.style.chart.tooltip.show&&t.value.userOptions.buttons.tooltip,isTooltip:k.value.showTooltip,onToggleTooltip:ce,onToggleFullscreen:we,onGeneratePdf:e.unref(oe),onGenerateCsv:ue,onGenerateImage:e.unref(le),onToggleTable:ie,onToggleAnnotator:Y,style:e.normalizeStyle({visibility:e.unref(J)?e.unref(H)?"visible":"hidden":"visible"})},e.createSlots({_:2},[o.$slots.menuIcon?{name:"menuIcon",fn:e.withCtx(({isOpen:l,color:r})=>[e.renderSlot(o.$slots,"menuIcon",e.normalizeProps(e.guardReactiveProps({isOpen:l,color:r})),void 0,!0)]),key:"0"}:void 0,o.$slots.optionTooltip?{name:"optionTooltip",fn:e.withCtx(()=>[e.renderSlot(o.$slots,"optionTooltip",{},void 0,!0)]),key:"1"}:void 0,o.$slots.optionPdf?{name:"optionPdf",fn:e.withCtx(()=>[e.renderSlot(o.$slots,"optionPdf",{},void 0,!0)]),key:"2"}:void 0,o.$slots.optionCsv?{name:"optionCsv",fn:e.withCtx(()=>[e.renderSlot(o.$slots,"optionCsv",{},void 0,!0)]),key:"3"}:void 0,o.$slots.optionImg?{name:"optionImg",fn:e.withCtx(()=>[e.renderSlot(o.$slots,"optionImg",{},void 0,!0)]),key:"4"}:void 0,o.$slots.optionTable?{name:"optionTable",fn:e.withCtx(()=>[e.renderSlot(o.$slots,"optionTable",{},void 0,!0)]),key:"5"}:void 0,o.$slots.optionFullscreen?{name:"optionFullscreen",fn:e.withCtx(({toggleFullscreen:l,isFullscreen:r})=>[e.renderSlot(o.$slots,"optionFullscreen",e.normalizeProps(e.guardReactiveProps({toggleFullscreen:l,isFullscreen:r})),void 0,!0)]),key:"6"}:void 0,o.$slots.optionAnnotator?{name:"optionAnnotator",fn:e.withCtx(({toggleAnnotator:l,isAnnotator:r})=>[e.renderSlot(o.$slots,"optionAnnotator",e.normalizeProps(e.guardReactiveProps({toggleAnnotator:l,isAnnotator:r})),void 0,!0)]),key:"7"}:void 0]),1032,["backgroundColor","color","isPrinting","isImaging","uid","hasPdf","hasXls","hasImg","hasTable","hasFullscreen","isFullscreen","titles","chartElement","position","hasAnnotator","isAnnotation","hasTooltip","isTooltip","onGeneratePdf","onGenerateImage","style"])):e.createCommentVNode("",!0),(e.openBlock(),e.createElementBlock("svg",{ref_key:"svgRef",ref:K,xmlns:e.unref(n.XMLNS),viewBox:`0 0 ${E.value.width} ${E.value.height}`,class:e.normalizeClass({"vue-data-ui-fullscreen--on":S.value,"vue-data-ui-fulscreen--off":!S.value}),style:e.normalizeStyle(`max-width:100%; overflow: visible; background:transparent;color:${t.value.style.chart.color}`)},[e.createVNode(Ae._sfc_main),o.$slots["chart-background"]?(e.openBlock(),e.createElementBlock("foreignObject",{key:0,x:0,y:0,width:E.value.width,height:E.value.height,style:{pointerEvents:"none"}},[e.renderSlot(o.$slots,"chart-background",{},void 0,!0)],8,We)):e.createCommentVNode("",!0),e.createElementVNode("defs",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(g.value.links,(l,r)=>(e.openBlock(),e.createElementBlock("linearGradient",{id:l.id,x1:"0%",y1:"0%",x2:"100%",y2:"0%"},[e.createElementVNode("stop",{offset:"0%","stop-color":l.sourceColor},null,8,Ze),e.createElementVNode("stop",{offset:"100%","stop-color":l.targetColor},null,8,Je)],8,Xe))),256))]),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(g.value.links,l=>(e.openBlock(),e.createElementBlock("path",{class:"vue-ui-flow-link",d:l.path,fill:`url(#${l.id})`,stroke:t.value.style.chart.links.stroke,"stroke-width":t.value.style.chart.links.strokeWidth,style:e.normalizeStyle(`
                    opacity:${m.value?m.value.includes(l.source)&&m.value.includes(l.target)?1:.3:B.value?[l.target,l.source].includes(B.value)?1:.3:t.value.style.chart.links.opacity}
                `)},null,12,Ke))),256)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(g.value.nodes,(l,r)=>(e.openBlock(),e.createElementBlock("rect",{class:"vue-ui-flow-node",x:l.x,y:e.unref(n.checkNaN)(l.absoluteY)+t.value.style.chart.padding.top,height:e.unref(n.checkNaN)(l.height),width:T.value,fill:l.color,stroke:t.value.style.chart.nodes.stroke,"stroke-width":t.value.style.chart.nodes.strokeWidth,onMouseenter:u=>Ee(l),onMouseleave:a[0]||(a[0]=u=>re()),style:e.normalizeStyle(`opacity:${m.value?m.value.includes(l.name)?1:.3:1}`)},null,44,Qe))),256)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(g.value.nodes,(l,r)=>(e.openBlock(),e.createElementBlock("text",{x:l.x+T.value/2,y:e.unref(n.checkNaN)(l.absoluteY+l.height/2-t.value.style.chart.nodes.labels.fontSize/4)+t.value.style.chart.padding.top,"font-size":t.value.style.chart.nodes.labels.fontSize,fill:e.unref(n.adaptColorToBackground)(l.color),"text-anchor":"middle",style:e.normalizeStyle(`pointer-events: none; opacity:${m.value?m.value.includes(l.name)?1:0:1}`)},e.toDisplayString(t.value.style.chart.nodes.labels.abbreviation.use?e.unref(n.abbreviate)({source:l.name,length:t.value.style.chart.nodes.labels.abbreviation.length}):l.name),13,et))),256)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(g.value.nodes,(l,r)=>(e.openBlock(),e.createElementBlock("text",{x:l.x+T.value/2,y:e.unref(n.checkNaN)(l.absoluteY+l.height/2+t.value.style.chart.nodes.labels.fontSize)+t.value.style.chart.padding.top,"font-size":t.value.style.chart.nodes.labels.fontSize,fill:e.unref(n.adaptColorToBackground)(l.color),"text-anchor":"middle",style:e.normalizeStyle(`pointer-events: none; opacity:${m.value?m.value.includes(l.name)?1:0:1}`)},e.toDisplayString(e.unref(n.applyDataLabel)(t.value.style.chart.nodes.labels.formatter,l.value,e.unref(n.dataLabel)({p:t.value.style.chart.nodes.labels.prefix,v:l.value,s:t.value.style.chart.nodes.labels.suffix,r:t.value.style.chart.nodes.labels.rounding}),{datapoint:l,seriesIndex:r})),13,tt))),256)),e.renderSlot(o.$slots,"svg",{svg:E.value},void 0,!0)],14,Ge)),o.$slots.watermark?(e.openBlock(),e.createElementBlock("div",ot,[e.renderSlot(o.$slots,"watermark",e.normalizeProps(e.guardReactiveProps({isPrinting:e.unref(ee)||e.unref(te)})),void 0,!0)])):e.createCommentVNode("",!0),V.value?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(Ve.default,{key:5,config:{type:"flow",style:{backgroundColor:t.value.style.chart.backgroundColor}}},null,8,["config"])),e.createElementVNode("div",{ref_key:"chartLegend",ref:Ce},[t.value.style.chart.legend.show&&ve.value.length?(e.openBlock(),e.createBlock(qe.Legend,{key:0,legendSet:ve.value,config:Oe.value,onClickMarker:a[1]||(a[1]=l=>U(l))},{item:e.withCtx(({legend:l,index:r})=>[e.createElementVNode("div",{onClick:u=>l.segregate(),style:e.normalizeStyle(`opacity:${$.value.length?$.value.includes(r)?1:.5:1}`)},e.toDisplayString(l.name)+" ("+e.toDisplayString(l.count)+") ",13,lt)]),_:1},8,["legendSet","config"])):e.createCommentVNode("",!0),e.renderSlot(o.$slots,"legend",{legend:de.value},void 0,!0)],512),o.$slots.source?(e.openBlock(),e.createElementBlock("div",at,[e.renderSlot(o.$slots,"source",{},void 0,!0)],512)):e.createCommentVNode("",!0),e.createVNode(He._sfc_main,{show:k.value.showTooltip&&M.value,backgroundColor:t.value.style.chart.tooltip.backgroundColor,color:t.value.style.chart.tooltip.color,fontSize:t.value.style.chart.tooltip.fontSize,borderRadius:t.value.style.chart.tooltip.borderRadius,borderColor:t.value.style.chart.tooltip.borderColor,borderWidth:t.value.style.chart.tooltip.borderWidth,backgroundOpacity:t.value.style.chart.tooltip.backgroundOpacity,position:t.value.style.chart.tooltip.position,offsetY:t.value.style.chart.tooltip.offsetY,parent:I.value,content:D.value,isCustom:O.value,isFullscreen:S.value},{"tooltip-before":e.withCtx(()=>[e.renderSlot(o.$slots,"tooltip-before",e.normalizeProps(e.guardReactiveProps({...R.value})),void 0,!0)]),"tooltip-after":e.withCtx(()=>[e.renderSlot(o.$slots,"tooltip-after",e.normalizeProps(e.guardReactiveProps({...R.value})),void 0,!0)]),_:3},8,["show","backgroundColor","color","fontSize","borderRadius","borderColor","borderWidth","backgroundOpacity","position","offsetY","parent","content","isCustom","isFullscreen"]),V.value?(e.openBlock(),e.createBlock(Fe.default,{key:7,hideDetails:"",config:{open:k.value.showTable,maxHeight:1e4,body:{backgroundColor:t.value.style.chart.backgroundColor,color:t.value.style.chart.color},head:{backgroundColor:t.value.style.chart.backgroundColor,color:t.value.style.chart.color}}},{content:e.withCtx(()=>[e.createVNode(ze.DataTable,{colNames:L.value.colNames,head:L.value.head,body:L.value.body,config:L.value.config,title:`${t.value.style.chart.title.text}${t.value.style.chart.title.subtitle.text?` : ${t.value.style.chart.title.subtitle.text}`:""}`,onClose:a[2]||(a[2]=l=>k.value.showTable=!1)},{th:e.withCtx(({th:l})=>[e.createElementVNode("div",{innerHTML:l,style:{display:"flex","align-items":"center"}},null,8,nt)]),td:e.withCtx(({td:l})=>[e.createTextVNode(e.toDisplayString(l.name||l),1)]),_:1},8,["colNames","head","body","config","title"])]),_:1},8,["config"])):e.createCommentVNode("",!0)],46,Ye))}},st=Re._export_sfc(rt,[["__scopeId","data-v-6fcb877a"]]);exports.default=st;