UNPKG

vue-data-ui-hq

Version:

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

18 lines (17 loc) 30.9 kB
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),r=require("./index-ZfICPrrM.cjs"),ve=require("./useResponsive-BJ7DTGpm.cjs"),Ee=require("./Title-FbHK83tB.cjs"),ye=require("./usePrinter-B-gh2f22.cjs"),Fe=require("./DataTable-CC6dPSer.cjs"),Te=require("./Tooltip-C7TJODUx.cjs"),Oe=require("./Legend-HgHPyA_4.cjs"),Pe=require("./vue-ui-skeleton-Bvmpr51u.cjs"),ze=require("./vue-ui-accordion-Dp6uTsJi.cjs"),me=require("./useNestedProp-C14rfl0j.cjs"),De=require("./PackageVersion-D3dK8oA3.cjs"),Ae=require("./PenAndPaper-PL3bp4ud.cjs"),Ie=require("./useUserOptionState-BgepsfED.cjs"),Me=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),Ue=["id"],Re=["xmlns","viewBox"],qe=["width","height"],Ye=["id"],Xe=["offset","stop-color"],Ge=["offset","stop-opacity"],He=["id"],We=["id"],Je=["id"],Ke=["flood-color"],Qe=["d","fill","stroke","stroke-width","filter"],Ze={key:1},je=["d","fill"],et={key:2},tt=["x","y","font-size","font-weight","fill"],lt={key:3},ot=["filter"],at=["text-anchor","x","y","fill","font-size","font-weight"],nt=["text-anchor","x","y","fill","font-size","font-weight"],rt=["text-anchor","x","y","fill","font-size","font-weight"],st=["d","fill","onMouseenter","onClick"],ut={key:5,class:"vue-data-ui-watermark"},it={key:0,class:"vue-ui-nested-donuts-legend-title"},ct=["onClick"],dt=["innerHTML"],ft={__name:"vue-ui-nested-donuts",props:{config:{type:Object,default(){return{}}},dataset:{type:Array,default(){return[]}}},emits:["selectLegend","selectDatapoint"],setup(be,{expose:ge,emit:ke}){const{vue_ui_nested_donuts:Ce}=r.useConfig(),k=be,x=e.computed(()=>!!k.dataset&&k.dataset.length),h=e.ref(r.createUid()),F=e.ref(!1),T=e.ref(""),we=e.ref(null),R=e.ref(0),L=e.ref(null),q=e.ref(null),O=e.ref(null),Y=e.ref(null),X=e.ref(null),G=e.ref(0),H=e.ref(0),W=e.ref(0),B=e.ref(!1);function Le(l){B.value=l,R.value+=1}const t=e.computed({get:()=>Q(),set:l=>l}),{userOptionsVisible:P,setUserOptionsVisibility:J,keepUserOptionState:K}=Ie.useUserOptionState({config:t.value});function Q(){const l=me.useNestedProp({userConfig:k.config,defaultConfig:Ce});return l.theme?{...me.useNestedProp({userConfig:r.themes.vue_ui_nested_donuts[l.theme]||k.config,defaultConfig:l}),customPalette:r.themePalettes[l.theme]||r.palette}:l}e.watch(()=>k.config,l=>{t.value=Q(),P.value=!t.value.showOnChartHover,Z(),G.value+=1,H.value+=1,W.value+=1},{deep:!0});const $=e.ref(null);e.onMounted(()=>{Z()});function Z(){if(r.objectIsEmpty(k.dataset)&&r.error({componentName:"VueUiNestedDonuts",type:"dataset"}),t.value.responsive){const l=ve.throttle(()=>{const{width:s,height:a}=ve.useResponsive({chart:L.value,title:t.value.style.chart.title.text?q.value:null,legend:t.value.style.chart.legend.show?O.value:null,source:Y.value,noTitle:X.value});c.value.width=s,c.value.height=a});$.value=new ResizeObserver(l),$.value.observe(L.value.parentNode)}}e.onBeforeUnmount(()=>{$.value&&$.value.disconnect()});const{isPrinting:j,isImaging:ee,generatePdf:te,generateImage:le}=ye.usePrinter({elementId:`nested_donuts_${h.value}`,fileName:t.value.style.chart.title.text||"vue-ui-nested-donuts"}),Be=e.computed(()=>t.value.userOptions.show&&!t.value.style.chart.title.text),xe=e.computed(()=>r.convertCustomPalette(t.value.customPalette)),v=e.ref({dataLabels:{show:t.value.style.chart.layout.labels.dataLabels.show},showTable:t.value.table.show,showTooltip:t.value.style.chart.tooltip.show}),c=e.ref({height:512,width:512}),oe=ke;function $e({datapoint:l,index:s}){oe("selectDatapoint",{datapoint:l,index:s})}const f=e.ref([]),m=e.computed(()=>(k.dataset.forEach((l,s)=>{[null,void 0].includes(l.name)&&r.error({componentName:"VueUiNestedDonuts",type:"datasetSerieAttribute",property:"name",index:s}),[null,void 0].includes(l.series)?r.error({componentName:"VueUiNestedDonuts",type:"datasetSerieAttribute",property:"series",index:s}):l.series.length===0?r.error({componentName:"VueUiNestedDonuts",type:"datasetAttributeEmpty",property:`series at index ${s}`}):l.series.forEach((a,n)=>{[null,void 0].includes(a.name)&&r.error({componentName:"VueUiNestedDonuts",type:"datasetSerieAttribute",property:"name",index:n,key:"serie"}),[null,void 0].includes(a.values)&&r.error({componentName:"VueUiNestedDonuts",type:"datasetSerieAttribute",property:"values",index:n,key:"serie"})})}),k.dataset.map((l,s)=>({...l,total:l.series.filter(a=>!f.value.includes(a.id)).map(a=>r.sanitizeArray(a.values).reduce((n,o)=>n+o,0)).reduce((a,n)=>a+n,0),datasetIndex:s,id:`${h.value}_${s}`,series:l.series.map((a,n)=>({name:a.name,arcOf:l.name,arcOfId:`${h.value}_${s}`,id:`${h.value}_${s}_${n}`,seriesIndex:n,datasetIndex:s,color:r.convertColorToHex(a.color)||xe.value[n]||r.palette[n]||r.palette[n%r.palette.length],value:r.sanitizeArray(a.values).reduce((o,u)=>o+u,0),absoluteValues:a.values||[]}))})))),b=e.computed(()=>Math.min(c.value.height,c.value.width)*(t.value.style.chart.layout.donut.strokeWidth/512)),ae=e.computed(()=>[...m.value].map((l,s)=>{const a=l.series.filter(n=>!f.value.includes(n.id)).map(n=>n.value).reduce((n,o)=>n+o,0);return{...l,total:a,series:l.series.filter(n=>!f.value.includes(n.id)).map(n=>({...n,proportion:n.value/a}))}}));function Ne(l,s,a){let n=0;for(let o=0;o<l.length;o+=1)a.includes(l[o])&&(n+=1);return n<s}const d=e.ref(ae.value);e.watch(()=>ae.value,l=>d.value=l);const ne=e.ref(null),re=e.ref(null);function z(l){oe("selectLegend",l);const s=m.value.flatMap(i=>i.series).find(i=>i.id===l.id),a=d.value.flatMap(i=>i.series).find(i=>i.id===l.id);let o=a?a.value:0;const u=m.value.find(i=>i.id===s.arcOfId).series.map(i=>i.id),p=Ne(u,u.length-1,f.value);if(f.value.includes(l.id)){let i=function(){o>s.value?(cancelAnimationFrame(ne.value),d.value=d.value.map(y=>({...y,series:y.series.map(g=>g.id==l.id?{...g,value:s.value}:g)}))):(o+=s.value*.025,d.value=d.value.map(y=>({...y,series:y.series.map(g=>g.id===l.id?{...g,value:o}:g)})),ne.value=requestAnimationFrame(i))};f.value=f.value.filter(y=>y!==l.id),i()}else if(p){let i=function(){o<.1?(cancelAnimationFrame(re.value),f.value.push(l.id),d.value=d.value.map((y,g)=>({...y,series:y.series.map(w=>w.id===l.id?{...w,value:0}:w)}))):(o/=1.1,d.value=d.value.map((y,g)=>({...y,series:y.series.map(w=>w.id===l.id?{...w,value:o}:w)})),re.value=requestAnimationFrame(i))};i()}}const D=e.computed(()=>b.value/m.value.length*t.value.style.chart.layout.donut.spacingRatio),se=e.computed(()=>d.value.map((l,s)=>b.value-s*b.value/m.value.length)),N=e.computed(()=>d.value.map((l,s)=>{const a=s*b.value/m.value.length;return{...l,radius:b.value-a,donut:r.makeDonut({series:l.series},c.value.width/2,c.value.height/2,b.value-a,b.value-a,1.99999,2,1,360,105.25,D.value)}})),ue=e.computed(()=>[...m.value].map((l,s)=>{const a=s*b.value/m.value.length;return{sizeRatio:a,donut:r.makeDonut({series:[{value:1}]},c.value.width/2,c.value.height/2,b.value-a,b.value-a,1.99999,2,1,360,105.25,b.value/m.value.length*t.value.style.chart.layout.donut.spacingRatio)[0]}})),ie=e.ref(null),S=e.ref(null),_=e.ref(null),A=e.ref(null);function Se({datapoint:l,_relativeIndex:s,seriesIndex:a}){ie.value=l.arcOfId,S.value=l.id,_.value=a,A.value={datapoint:l,seriesIndex:a,series:d.value,config:t.value};const n=t.value.style.chart.tooltip.customFormat;if(r.isFunction(n)&&r.functionReturnsString(()=>n({seriesIndex:a,datapoint:l,series:d.value,config:t.value})))T.value=n({seriesIndex:a,datapoint:l,series:d.value,config:t.value});else{let o="";if(t.value.style.chart.tooltip.showAllItemsAtIndex&&f.value.length===0){const u=d.value.map(p=>p.series.find(i=>i.seriesIndex===a));u.forEach((p,i)=>{if(!p)return"";o+=` <div style="display:flex; flex-direction: column; justify-content:flex-start; align-items:flex-start;padding:6px 0; ${i<u.length-1?`border-bottom:1px solid ${t.value.style.chart.tooltip.borderColor}`:""}"> <div style="display:flex; flex-direction: row; gap: 3px; justify-content:flex-start; align-items:center;"> <svg viewBox="0 0 20 20" height="${t.value.style.chart.tooltip.fontSize}" width="${t.value.style.chart.tooltip.fontSize}"> <circle cx="10" cy="10" r="10" fill="${p.color}"/> </svg> <span> ${p.arcOf??""} - ${p.name} </span> </div> <span> ${t.value.style.chart.tooltip.showValue?`<b>${r.applyDataLabel(t.value.style.chart.layout.labels.dataLabels.formatter,l.value,r.dataLabel({p:t.value.style.chart.layout.labels.dataLabels.prefix,v:l.value,s:t.value.style.chart.layout.labels.dataLabels.suffix,r:t.value.style.chart.tooltip.roundingValue}),{datapoint:l,seriesIndex:a})} </b>`:""} ${t.value.style.chart.tooltip.showPercentage?`(${r.dataLabel({v:p.proportion*100,s:"%",r:t.value.style.chart.tooltip.roundingPercentage})})`:""} </span> </div> `})}else o+=`<div style="width:100%;text-align:center;border-bottom:1px solid ${t.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${l.arcOf??""} - ${l.name}</div>`,o+=`<div style="display:flex;flex-direction:row;gap:6px;align-items:center;"><svg viewBox="0 0 12 12" height="14" width="14"><circle cx="6" cy="6" r="6" stroke="none" fill="${l.color}"/></svg>`,t.value.style.chart.tooltip.showValue&&(o+=`<b>${r.applyDataLabel(t.value.style.chart.layout.labels.dataLabels.formatter,l.value,r.dataLabel({p:t.value.style.chart.layout.labels.dataLabels.prefix,v:l.value,s:t.value.style.chart.layout.labels.dataLabels.suffix,r:t.value.style.chart.tooltip.roundingValue}),{datapoint:l,seriesIndex:a})}</b>`),t.value.style.chart.tooltip.showPercentage&&(t.value.style.chart.tooltip.showValue?o+=`<span>(${r.dataLabel({v:l.proportion*100,s:"%",r:t.value.style.chart.tooltip.roundingPercentage})})</span></div>`:o+=`<b>${r.dataLabel({v:l.proportion*100,s:"%",r:t.value.style.chart.tooltip.roundingPercentage})}</b></div>`);T.value=`<div style="font-size:${t.value.style.chart.tooltip.fontSize}px">${o}</div>`}F.value=!0}function I(l){return l.proportion*100>t.value.style.chart.layout.labels.dataLabels.hideUnderValue}function ce(l,s){if(!t.value.useBlurOnHover)return"";if(t.value.style.chart.tooltip.showAllItemsAtIndex&&f.value.length===0)return[null,void 0].includes(_.value)||_.value===s?"":`url(#blur_${h.value})`;if(!t.value.style.chart.tooltip.showAllItemsAtIndex||f.value.length)return[null,void 0].includes(S.value)||S.value===l.id?"":`url(#blur_${h.value})`}const M=e.computed(()=>m.value.map((l,s)=>l.series.map((a,n)=>({name:a.name,color:a.color,value:a.value,shape:"circle",arcOf:a.arcOf,id:a.id,seriesIndex:n,datasetIndex:s,total:l.series.filter(o=>!f.value.includes(o.id)).map(o=>o.value).reduce((o,u)=>o+u,0)})).map(a=>({...a,opacity:f.value.includes(a.id)?.5:1,segregate:()=>z(a),isSegregated:f.value.includes(a.id)})))),_e=e.computed(()=>({cy:"nested-donuts-legend",backgroundColor:t.value.style.chart.legend.backgroundColor,color:t.value.style.chart.legend.color,fontSize:t.value.style.chart.legend.fontSize,paddingBottom:12,fontWeight:t.value.style.chart.legend.bold?"bold":""})),C=e.computed(()=>{const l=d.value.flatMap(a=>a.series.map(n=>({name:`${a.name} - ${n.name}`,color:n.color,total:a.total}))),s=d.value.flatMap(a=>a.series.map(n=>n.value));return{head:l,body:s}});function de(){e.nextTick(()=>{const l=C.value.head.map((n,o)=>[[n.name],[C.value.body[o]],[isNaN(C.value.body[o]/n.total)?"-":C.value.body[o]/n.total*100]]),s=[[t.value.style.chart.title.text],[t.value.style.chart.title.subtitle.text],[[""],["val"],["%"]]].concat(l),a=r.createCsvContent(s);r.downloadCsv({csvContent:a,title:t.value.style.chart.title.text||"vue-ui-nested-donuts"})})}const V=e.computed(()=>{const l=[t.value.table.columnNames.series,t.value.table.columnNames.value,t.value.table.columnNames.percentage],s=C.value.head.map((o,u)=>{const p=r.dataLabel({p:t.value.style.chart.layout.labels.dataLabels.prefix,v:C.value.body[u],s:t.value.style.chart.layout.labels.dataLabels.suffix,r:t.value.table.td.roundingValue});return[{color:o.color,name:o.name},p,isNaN(C.value.body[u]/o.total)?"-":r.dataLabel({v:C.value.body[u]/o.total*100,s:"%",r:t.value.table.td.roundingPercentage})]}),a={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.series,t.value.table.columnNames.value,t.value.table.columnNames.percentage],head:l,body:s,config:a}});function Ve(){return m.value}function fe(){v.value.showTable=!v.value.showTable}function pe(){v.value.dataLabels.show=!v.value.dataLabels.show}function he(){v.value.showTooltip=!v.value.showTooltip}const E=e.ref(!1);function U(){E.value=!E.value}return ge({getData:Ve,generatePdf:te,generateCsv:de,generateImage:le,toggleTable:fe,toggleLabels:pe,toggleTooltip:he,toggleAnnotator:U}),(l,s)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"nestedDonutsChart",ref:L,class:e.normalizeClass(`vue-ui-nested-donuts ${e.unref(B)?"vue-data-ui-wrapper-fullscreen":""} ${e.unref(t).useCssAnimation?"":"vue-ui-dna"}`),style:e.normalizeStyle(`font-family:${e.unref(t).style.fontFamily};width:100%; text-align:center;background:${e.unref(t).style.chart.backgroundColor}`),id:`nested_donuts_${e.unref(h)}`,onMouseenter:s[3]||(s[3]=()=>e.unref(J)(!0)),onMouseleave:s[4]||(s[4]=()=>e.unref(J)(!1))},[e.unref(t).userOptions.buttons.annotator?(e.openBlock(),e.createBlock(Ae.PenAndPaper,{key:0,parent:e.unref(L),backgroundColor:e.unref(t).style.chart.backgroundColor,color:e.unref(t).style.chart.color,active:e.unref(E),onClose:U},null,8,["parent","backgroundColor","color","active"])):e.createCommentVNode("",!0),e.unref(Be)?(e.openBlock(),e.createElementBlock("div",{key:1,ref_key:"noTitle",ref:X,class:"vue-data-ui-no-title-space",style:"height:36px; width: 100%;background:transparent"},null,512)):e.createCommentVNode("",!0),e.unref(t).style.chart.title.text?(e.openBlock(),e.createElementBlock("div",{key:2,ref_key:"chartTitle",ref:q},[(e.openBlock(),e.createBlock(Ee._sfc_main,{key:`title_${e.unref(G)}`,config:{title:{cy:"donut-div-title",...e.unref(t).style.chart.title},subtitle:{cy:"donut-div-subtitle",...e.unref(t).style.chart.title.subtitle}}},null,8,["config"]))],512)):e.createCommentVNode("",!0),e.unref(t).userOptions.show&&e.unref(x)&&(e.unref(K)||e.unref(P))?(e.openBlock(),e.createBlock(ye.UserOptions,{ref:"details",key:`user_option_${e.unref(R)}`,backgroundColor:e.unref(t).style.chart.backgroundColor,color:e.unref(t).style.chart.color,isPrinting:e.unref(j),isImaging:e.unref(ee),uid:e.unref(h),hasTooltip:e.unref(t).userOptions.buttons.tooltip&&e.unref(t).style.chart.tooltip.show,hasPdf:e.unref(t).userOptions.buttons.pdf,hasXls:e.unref(t).userOptions.buttons.csv,hasImg:e.unref(t).userOptions.buttons.img,hasTable:e.unref(t).userOptions.buttons.table,hasLabel:e.unref(t).userOptions.buttons.labels,hasFullscreen:e.unref(t).userOptions.buttons.fullscreen,isFullscreen:e.unref(B),isTooltip:e.unref(v).showTooltip,titles:{...e.unref(t).userOptions.buttonTitles},chartElement:e.unref(L),position:e.unref(t).userOptions.position,hasAnnotator:e.unref(t).userOptions.buttons.annotator,isAnnotation:e.unref(E),onToggleFullscreen:Le,onGeneratePdf:e.unref(te),onGenerateCsv:de,onGenerateImage:e.unref(le),onToggleTable:fe,onToggleLabels:pe,onToggleTooltip:he,onToggleAnnotator:U,style:e.normalizeStyle({visibility:e.unref(K)?e.unref(P)?"visible":"hidden":"visible"})},e.createSlots({_:2},[l.$slots.optionTooltip?{name:"optionTooltip",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"optionTooltip",{},void 0,!0)]),key:"0"}:void 0,l.$slots.optionPdf?{name:"optionPdf",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"optionPdf",{},void 0,!0)]),key:"1"}:void 0,l.$slots.optionCsv?{name:"optionCsv",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"optionCsv",{},void 0,!0)]),key:"2"}:void 0,l.$slots.optionImg?{name:"optionImg",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"optionImg",{},void 0,!0)]),key:"3"}:void 0,l.$slots.optionTable?{name:"optionTable",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"optionTable",{},void 0,!0)]),key:"4"}:void 0,l.$slots.optionLabels?{name:"optionLabels",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"optionLabels",{},void 0,!0)]),key:"5"}:void 0,l.$slots.optionFullscreen?{name:"optionFullscreen",fn:e.withCtx(({toggleFullscreen:a,isFullscreen:n})=>[e.renderSlot(l.$slots,"optionFullscreen",e.normalizeProps(e.guardReactiveProps({toggleFullscreen:a,isFullscreen:n})),void 0,!0)]),key:"6"}:void 0,l.$slots.optionAnnotator?{name:"optionAnnotator",fn:e.withCtx(({toggleAnnotator:a,isAnnotator:n})=>[e.renderSlot(l.$slots,"optionAnnotator",e.normalizeProps(e.guardReactiveProps({toggleAnnotator:a,isAnnotator:n})),void 0,!0)]),key:"7"}:void 0]),1032,["backgroundColor","color","isPrinting","isImaging","uid","hasTooltip","hasPdf","hasXls","hasImg","hasTable","hasLabel","hasFullscreen","isFullscreen","isTooltip","titles","chartElement","position","hasAnnotator","isAnnotation","onGeneratePdf","onGenerateImage","style"])):e.createCommentVNode("",!0),e.unref(x)?(e.openBlock(),e.createElementBlock("svg",{key:4,xmlns:e.unref(r.XMLNS),class:e.normalizeClass({"vue-data-ui-fullscreen--on":e.unref(B),"vue-data-ui-fulscreen--off":!e.unref(B)}),viewBox:`0 0 ${e.unref(c).width<=0?.001:e.unref(c).width} ${e.unref(c).height<0?.001:e.unref(c).height}`,style:e.normalizeStyle(`max-width:100%; overflow: visible; background:transparent;color:${e.unref(t).style.chart.color}`)},[e.createVNode(De._sfc_main),l.$slots["chart-background"]?(e.openBlock(),e.createElementBlock("foreignObject",{key:0,x:0,y:0,width:e.unref(c).width<=0?.001:e.unref(c).width,height:e.unref(c).height<0?.001:e.unref(c).height,style:{pointerEvents:"none"}},[e.renderSlot(l.$slots,"chart-background",{},void 0,!0)],8,qe)):e.createCommentVNode("",!0),e.createElementVNode("defs",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(ue),(a,n)=>(e.openBlock(),e.createElementBlock("radialGradient",{id:`radial_${e.unref(h)}_${n}`},[s[5]||(s[5]=e.createElementVNode("stop",{offset:"0%","stop-color":"#FFFFFF","stop-opacity":"0"},null,-1)),e.createElementVNode("stop",{offset:`${(1-e.unref(D)/e.unref(se)[n])*100}%`,"stop-color":e.unref(r.setOpacity)("#FFFFFF",0),"stop-opacity":"0"},null,8,Xe),e.createElementVNode("stop",{offset:`${(1-e.unref(D)/e.unref(se)[n]/2)*100}%`,"stop-color":"#FFFFFF","stop-opacity":e.unref(t).style.chart.gradientIntensity/100},null,8,Ge),s[6]||(s[6]=e.createElementVNode("stop",{offset:"100%","stop-color":"#FFFFFF","stop-opacity":"0"},null,-1))],8,Ye))),256))]),e.createElementVNode("defs",null,[e.createElementVNode("filter",{id:`blur_${e.unref(h)}`,x:"-50%",y:"-50%",width:"200%",height:"200%"},[e.createElementVNode("feGaussianBlur",{in:"SourceGraphic",stdDeviation:2,id:`blur_std_${e.unref(h)}`},null,8,We),s[7]||(s[7]=e.createElementVNode("feColorMatrix",{type:"saturate",values:"0"},null,-1))],8,He),e.createElementVNode("filter",{id:`shadow_${e.unref(h)}`,"color-interpolation-filters":"sRGB"},[e.createElementVNode("feDropShadow",{dx:"0",dy:"0",stdDeviation:"10","flood-opacity":"0.5","flood-color":e.unref(t).style.chart.layout.donut.shadowColor},null,8,Ke)],8,Je)]),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(N),(a,n)=>(e.openBlock(),e.createElementBlock("g",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.donut,(o,u)=>(e.openBlock(),e.createElementBlock("g",null,[e.createElementVNode("path",{class:"vue-ui-donut-arc-path",d:o.arcSlice,fill:e.unref(r.setOpacity)(o.color,80),stroke:e.unref(t).style.chart.backgroundColor,"stroke-width":e.unref(t).style.chart.layout.donut.borderWidth,filter:ce(o,u)},null,8,Qe)]))),256))]))),256)),e.unref(t).style.chart.useGradient?(e.openBlock(),e.createElementBlock("g",Ze,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(ue),(a,n)=>(e.openBlock(),e.createElementBlock("g",null,[e.createElementVNode("path",{d:a.donut.arcSlice,fill:`url(#radial_${e.unref(h)}_${n})`,stroke:"transparent","stroke-width":"0"},null,8,je)]))),256))])):e.createCommentVNode("",!0),e.unref(t).style.chart.layout.labels.dataLabels.showDonutName?(e.openBlock(),e.createElementBlock("g",et,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(N),(a,n)=>(e.openBlock(),e.createElementBlock("g",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.donut,(o,u)=>(e.openBlock(),e.createElementBlock("g",null,[u===0&&e.unref(c).width&&e.unref(c).height?(e.openBlock(),e.createElementBlock("text",{key:0,class:e.normalizeClass({animated:e.unref(t).useCssAnimation}),x:e.unref(c).width/2,y:o.startY-e.unref(t).style.chart.layout.labels.dataLabels.fontSize+e.unref(t).style.chart.layout.labels.dataLabels.donutNameOffsetY,"text-anchor":"middle","font-size":e.unref(t).style.chart.layout.labels.dataLabels.fontSize,"font-weight":e.unref(t).style.chart.layout.labels.dataLabels.boldDonutName?"bold":"normal",fill:e.unref(t).style.chart.layout.labels.dataLabels.color},e.toDisplayString(e.unref(t).style.chart.layout.labels.dataLabels.donutNameAbbreviation?e.unref(r.abbreviate)({source:a.name,length:e.unref(t).style.chart.layout.labels.dataLabels.donutNameMaxAbbreviationSize}):a.name),11,tt)):e.createCommentVNode("",!0)]))),256))]))),256))])):e.createCommentVNode("",!0),e.unref(t).style.chart.layout.labels.dataLabels.show?(e.openBlock(),e.createElementBlock("g",lt,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(N),(a,n)=>(e.openBlock(),e.createElementBlock("g",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.donut,(o,u)=>(e.openBlock(),e.createElementBlock("g",{filter:ce(o,u)},[I(o)&&e.unref(v).dataLabels.show&&e.unref(t).style.chart.layout.labels.dataLabels.showPercentage?(e.openBlock(),e.createElementBlock("text",{key:0,class:e.normalizeClass({animated:e.unref(t).useCssAnimation}),"text-anchor":e.unref(r.calcMarkerOffsetX)(o,!0).anchor,x:e.unref(r.calcMarkerOffsetX)(o,!1,e.unref(t).style.chart.layout.labels.dataLabels.offsetX).x||0,y:e.unref(r.calcMarkerOffsetY)(o,e.unref(t).style.chart.layout.labels.dataLabels.offsetY,e.unref(t).style.chart.layout.labels.dataLabels.offsetY),fill:e.unref(t).style.chart.layout.labels.dataLabels.useSerieColor?o.color:e.unref(t).style.chart.layout.labels.dataLabels.color,"font-size":e.unref(t).style.chart.layout.labels.dataLabels.fontSize,"font-weight":e.unref(t).style.chart.layout.labels.dataLabels.boldPercentage?"bold":"normal"},e.toDisplayString(e.unref(r.dataLabel)({v:o.proportion*100,s:"%",r:e.unref(t).style.chart.layout.labels.dataLabels.roundingPercentage})),11,at)):e.createCommentVNode("",!0),I(o)&&e.unref(v).dataLabels.show&&e.unref(t).style.chart.layout.labels.dataLabels.showPercentage&&e.unref(t).style.chart.layout.labels.dataLabels.showValue?(e.openBlock(),e.createElementBlock("text",{key:1,class:e.normalizeClass({animated:e.unref(t).useCssAnimation}),"text-anchor":e.unref(r.calcMarkerOffsetX)(o,!0).anchor,x:e.unref(r.calcMarkerOffsetX)(o,!1,e.unref(t).style.chart.layout.labels.dataLabels.offsetX).x||0,y:e.unref(r.calcMarkerOffsetY)(o,e.unref(t).style.chart.layout.labels.dataLabels.offsetY,e.unref(t).style.chart.layout.labels.dataLabels.offsetY)+e.unref(t).style.chart.layout.labels.dataLabels.fontSize,fill:e.unref(t).style.chart.layout.labels.dataLabels.useSerieColor?o.color:e.unref(t).style.chart.layout.labels.dataLabels.color,"font-size":e.unref(t).style.chart.layout.labels.dataLabels.fontSize,"font-weight":e.unref(t).style.chart.layout.labels.dataLabels.boldValue?"bold":"normal"}," ("+e.toDisplayString(e.unref(r.applyDataLabel)(e.unref(t).style.chart.layout.labels.dataLabels.formatter,o.value,e.unref(r.dataLabel)({p:e.unref(t).style.chart.layout.labels.dataLabels.prefix,v:o.value,s:e.unref(t).style.chart.layout.labels.dataLabels.suffix,r:e.unref(t).style.chart.layout.labels.dataLabels.roundingValue}),{datapoint:o,seriesIndex:n,datapointIndex:u}))+") ",11,nt)):e.createCommentVNode("",!0),I(o)&&e.unref(v).dataLabels.show&&!e.unref(t).style.chart.layout.labels.dataLabels.showPercentage&&e.unref(t).style.chart.layout.labels.dataLabels.showValue?(e.openBlock(),e.createElementBlock("text",{key:2,class:e.normalizeClass({animated:e.unref(t).useCssAnimation}),"text-anchor":e.unref(r.calcMarkerOffsetX)(o,!0).anchor,x:e.unref(r.calcMarkerOffsetX)(o,!1,e.unref(t).style.chart.layout.labels.dataLabels.offsetX).x||0,y:e.unref(r.calcMarkerOffsetY)(o,e.unref(t).style.chart.layout.labels.dataLabels.offsetY,e.unref(t).style.chart.layout.labels.dataLabels.offsetY),fill:e.unref(t).style.chart.layout.labels.dataLabels.useSerieColor?o.color:e.unref(t).style.chart.layout.labels.dataLabels.color,"font-size":e.unref(t).style.chart.layout.labels.dataLabels.fontSize,"font-weight":e.unref(t).style.chart.layout.labels.dataLabels.boldValue?"bold":"normal"},e.toDisplayString(e.unref(r.applyDataLabel)(e.unref(t).style.chart.layout.labels.dataLabels.formatter,o.value,e.unref(r.dataLabel)({p:e.unref(t).style.chart.layout.labels.dataLabels.prefix,v:o.value,s:e.unref(t).style.chart.layout.labels.dataLabels.suffix,r:e.unref(t).style.chart.layout.labels.dataLabels.roundingValue}),{datapoint:o,seriesIndex:n,datapointIndex:u})),11,rt)):e.createCommentVNode("",!0)],8,ot))),256))]))),256))])):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(N),(a,n)=>(e.openBlock(),e.createElementBlock("g",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.donut,(o,u)=>(e.openBlock(),e.createElementBlock("g",null,[e.createElementVNode("path",{"data-cy-donut-trap":"",d:o.arcSlice,fill:e.unref(we)===n?"rgba(0,0,0,0.1)":"transparent",onMouseenter:p=>Se({datapoint:o,relativeIndex:n,seriesIndex:o.seriesIndex}),onClick:p=>$e({datapoint:o,index:u}),onMouseleave:s[0]||(s[0]=p=>{F.value=!1,ie.value=null,S.value=null,_.value=null})},null,40,st)]))),256))]))),256)),e.renderSlot(l.$slots,"svg",{svg:e.unref(c)},void 0,!0)],14,Re)):e.createCommentVNode("",!0),l.$slots.watermark?(e.openBlock(),e.createElementBlock("div",ut,[e.renderSlot(l.$slots,"watermark",e.normalizeProps(e.guardReactiveProps({isPrinting:e.unref(j)||e.unref(ee)})),void 0,!0)])):e.createCommentVNode("",!0),e.unref(x)?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(Pe.default,{key:6,config:{type:"donut",style:{backgroundColor:e.unref(t).style.chart.backgroundColor,donut:{color:"#CCCCCC"}}}},null,8,["config"])),e.createVNode(Te._sfc_main,{show:e.unref(v).showTooltip&&e.unref(F),backgroundColor:e.unref(t).style.chart.tooltip.backgroundColor,color:e.unref(t).style.chart.tooltip.color,borderRadius:e.unref(t).style.chart.tooltip.borderRadius,borderColor:e.unref(t).style.chart.tooltip.borderColor,borderWidth:e.unref(t).style.chart.tooltip.borderWidth,fontSize:e.unref(t).style.chart.tooltip.fontSize,backgroundOpacity:e.unref(t).style.chart.tooltip.backgroundOpacity,position:e.unref(t).style.chart.tooltip.position,offsetY:e.unref(t).style.chart.tooltip.offsetY,parent:e.unref(L),content:e.unref(T),isFullscreen:e.unref(B),isCustom:e.unref(r.isFunction)(e.unref(t).style.chart.tooltip.customFormat)},{"tooltip-before":e.withCtx(()=>[e.renderSlot(l.$slots,"tooltip-before",e.normalizeProps(e.guardReactiveProps({...e.unref(A)})),void 0,!0)]),"tooltip-after":e.withCtx(()=>[e.renderSlot(l.$slots,"tooltip-after",e.normalizeProps(e.guardReactiveProps({...e.unref(A)})),void 0,!0)]),_:3},8,["show","backgroundColor","color","borderRadius","borderColor","borderWidth","fontSize","backgroundOpacity","position","offsetY","parent","content","isFullscreen","isCustom"]),e.unref(t).style.chart.legend.show?(e.openBlock(),e.createElementBlock("div",{key:7,ref_key:"chartLegend",ref:O,class:e.normalizeClass({"vue-ui-nested-donuts-legend":e.unref(M).length>1})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(M),(a,n)=>(e.openBlock(),e.createBlock(Oe.Legend,{key:`legend_${n}_${e.unref(W)}`,legendSet:a,config:e.unref(_e),onClickMarker:s[1]||(s[1]=({legend:o})=>z(o))},{legendTitle:e.withCtx(({titleSet:o})=>[o[0]&&o[0].arcOf?(e.openBlock(),e.createElementBlock("div",it,e.toDisplayString(o[0].arcOf),1)):e.createCommentVNode("",!0)]),item:e.withCtx(({legend:o,index:u})=>[e.createElementVNode("div",{onClick:p=>z(o),style:e.normalizeStyle(`opacity:${e.unref(f).includes(o.id)?.5:1}`)},[e.createTextVNode(e.toDisplayString(o.name)+": "+e.toDisplayString(e.unref(r.applyDataLabel)(e.unref(t).style.chart.layout.labels.dataLabels.formatter,o.value,e.unref(r.dataLabel)({p:e.unref(t).style.chart.layout.labels.dataLabels.prefix,v:o.value,s:e.unref(t).style.chart.layout.labels.dataLabels.suffix,r:e.unref(t).style.chart.legend.roundingValue}),{datapoint:o,seriesIndex:u}))+" ",1),e.unref(f).includes(o.id)?(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createTextVNode(" ( - % ) ")],64)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createTextVNode(" ("+e.toDisplayString(isNaN(o.value/o.total)?"-":e.unref(r.dataLabel)({v:o.value/o.total*100,s:"%",r:e.unref(t).style.chart.legend.roundingPercentage}))+") ",1)],64))],12,ct)]),_:2},1032,["legendSet","config"]))),128))],2)):e.createCommentVNode("",!0),e.unref(t).style.chart.legend.show?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:8,ref_key:"chartLegend",ref:O},[e.renderSlot(l.$slots,"legend",{legend:e.unref(M)},void 0,!0)],512)),l.$slots.source?(e.openBlock(),e.createElementBlock("div",{key:9,ref_key:"source",ref:Y,dir:"auto"},[e.renderSlot(l.$slots,"source",{},void 0,!0)],512)):e.createCommentVNode("",!0),e.unref(x)?(e.openBlock(),e.createBlock(ze.default,{key:10,hideDetails:"",config:{open:e.unref(v).showTable,maxHeight:1e4,body:{backgroundColor:e.unref(t).style.chart.backgroundColor,color:e.unref(t).style.chart.color},head:{backgroundColor:e.unref(t).style.chart.backgroundColor,color:e.unref(t).style.chart.color}}},{content:e.withCtx(()=>[(e.openBlock(),e.createBlock(Fe.DataTable,{key:`table_${e.unref(H)}`,colNames:e.unref(V).colNames,head:e.unref(V).head,body:e.unref(V).body,config:e.unref(V).config,title:`${e.unref(t).style.chart.title.text}${e.unref(t).style.chart.title.subtitle.text?` : ${e.unref(t).style.chart.title.subtitle.text}`:""}`,onClose:s[2]||(s[2]=a=>e.unref(v).showTable=!1)},{th:e.withCtx(({th:a})=>[e.createElementVNode("div",{innerHTML:a,style:{display:"flex","align-items":"center"}},null,8,dt)]),td:e.withCtx(({td:a})=>[e.createTextVNode(e.toDisplayString(a.name||a),1)]),_:1},8,["colNames","head","body","config","title"]))]),_:1},8,["config"])):e.createCommentVNode("",!0)],46,Ue))}},pt=Me._export_sfc(ft,[["__scopeId","data-v-b36de847"]]);exports.default=pt;