vue-data-ui 2.7.4 → 2.7.5

package/dist/{vue-ui-xy-canvas-C76OoGNJ.cjs → vue-ui-xy-canvas-DYC5CQ49.cjs}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),d=require("./index-MIJJ8liG.cjs"),x=require("./useResponsive-DQmBAoBf.cjs"),vt=require("./Tooltip-Dbe23pmt.cjs"),dt=require("./Legend-Bhl2d6oj.cjs"),ht=require("./Title-C5w8bVlo.cjs"),ft=require("./Slicer-Duh-nBCD.cjs"),Ue=require("./usePrinter-U1x-RAEA.cjs"),yt=require("./vue-ui-accordion-cBSqrYy3.cjs"),pt=require("./DataTable-c3nDhwbO.cjs"),gt=require("./vue-ui-skeleton-DOE444ST.cjs"),qe=require("./useNestedProp-DwR4JSzw.cjs"),mt=require("./useUserOptionState-BgepsfED.cjs"),bt=require("./useChartAccessibility-Cm7nkzTG.cjs"),ge=require("./BaseIcon-WIhlX3LN.cjs"),xt=require("./ColorPicker-mXlj2N11.cjs"),We=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),kt={class:t.normalizeClass({"vue-ui-pen-and-paper-action":!0}),style:{padding:"0 !important"}},Ct=["disabled"],Lt=["data-mode","xmlns","viewBox"],wt=["cx","cy","r","fill"],St=["d","stroke","stroke-width"],zt=["x","y","fill","font-size"],$t=["x","dy"],Tt=["d","stroke","stroke-width"],Et={__name:"NonSvgPenAndPaper",props:{parent:{type:HTMLElement},backgroundColor:{type:String,default:"#FFFFFF"},color:{type:String,default:"#2D353C"},active:{type:Boolean,default:!1}},emits:["close"],setup($,{emit:Ee}){const U=$,Be=Ee,L=t.ref([]),V=t.ref([]),_=t.ref("0 0 0 0"),D=t.ref(U.color),y=t.ref(1),m=t.ref("draw"),w=t.ref(null),q=t.ref(!1),h=t.ref(null),Y=t.ref({x:0,y:0}),X=t.ref([""]),E=t.ref({row:0,col:0}),P=t.ref(16);let W=1;function G(){return W++}function ne(i){var a;const r=R.value;if(!r)return{x:0,y:0};const o=r.createSVGPoint();let u=i.clientX,v=i.clientY;i.touches&&i.touches.length&&(u=i.touches[0].clientX,v=i.touches[0].clientY),o.x=u,o.y=v;const f=(a=r.getScreenCTM())==null?void 0:a.inverse();return f?o.matrixTransform(f):{x:0,y:0}}function re(i){if(!w.value||m.value!=="text"||q.value)return;const{x:r,y:o}=ne(i);Y.value={x:r,y:o},X.value=[""],E.value={row:0,col:0};const u=document.createElementNS("http://www.w3.org/2000/svg","text");u.setAttribute("x",r),u.setAttribute("y",o),u.setAttribute("fill",D.value),u.setAttribute("font-size",P.value),u.setAttribute("font-family","sans-serif"),u.setAttribute("class","vue-data-ui-doodle"),u.setAttribute("dominant-baseline","hanging"),u.setAttribute("pointer-events","all");const v=document.createElementNS("http://www.w3.org/2000/svg","tspan");v.setAttribute("x",r),v.setAttribute("dy","0"),v.textContent="",u.appendChild(v),u.style.pointerEvents="none",w.value.appendChild(u),h.value=u,q.value=!0,window.addEventListener("keydown",ue),window.addEventListener("mousedown",ie,!0),J(),se()}function ue(i){if(!q.value)return;let{row:r,col:o}=E.value,u=X.value.slice(),v=!1;if(i.key==="Enter"){const f=u[r],a=f.slice(0,o),T=f.slice(o);u.splice(r,1,a,T),r+=1,o=0,v=!0,i.preventDefault()}else if(i.key==="Backspace"){if(o>0)u[r]=u[r].slice(0,o-1)+u[r].slice(o),o-=1,v=!0;else if(r>0){const f=u[r-1].length;u[r-1]+=u[r],u.splice(r,1),r-=1,o=f,v=!0}i.preventDefault()}else if(i.key==="Delete")o<u[r].length?(u[r]=u[r].slice(0,o)+u[r].slice(o+1),v=!0):r<u.length-1&&(u[r]+=u[r+1],u.splice(r+1,1),v=!0),i.preventDefault();else if(i.key==="ArrowLeft")o>0?o-=1:r>0&&(r-=1,o=u[r].length),v=!0,i.preventDefault();else if(i.key==="ArrowRight")o<u[r].length?o+=1:r<u.length-1&&(r+=1,o=0),v=!0,i.preventDefault();else if(i.key==="ArrowUp")r>0&&(r-=1,o=Math.min(o,u[r].length),v=!0),i.preventDefault();else if(i.key==="ArrowDown")r<u.length-1&&(r+=1,o=Math.min(o,u[r].length),v=!0),i.preventDefault();else if(i.key.length===1&&!i.ctrlKey&&!i.metaKey&&!i.altKey)u[r]=u[r].slice(0,o)+i.key+u[r].slice(o),o+=1,v=!0,i.preventDefault();else if(i.key==="Escape"){ce(!0);return}else i.key==="Tab"&&i.preventDefault();v&&(X.value=u,E.value={row:r,col:o},J(),se())}function J(){const i=h.value,{x:r,y:o}=Y.value;for(;i.firstChild;)i.removeChild(i.firstChild);X.value.forEach((u,v)=>{const f=document.createElementNS("http://www.w3.org/2000/svg","tspan");f.setAttribute("x",r),f.setAttribute("dy",v===0?"0":`${P.value*1.2}`),f.textContent=u.length?u:"​",i.appendChild(f)})}function se(){const i=w.value.querySelector(".vue-data-ui-svg-caret");i&&w.value.removeChild(i);const r=h.value;if(!r)return;const{x:o,y:u}=Y.value,{row:v,col:f}=E.value,a=P.value,T=r.childNodes[v];if(!T)return;let B=T.textContent.slice(0,f);B.endsWith(" ")&&(B+=" ");const p=document.createElementNS("http://www.w3.org/2000/svg","text");p.setAttribute("x",o),p.setAttribute("y",u),p.setAttribute("font-size",a),p.setAttribute("font-family","sans-serif"),p.textContent=B||"",w.value.appendChild(p);const M=p.getBBox();w.value.removeChild(p);let z=u+v*a*1.2,g=o+M.width;const c=document.createElementNS("http://www.w3.org/2000/svg","rect");c.setAttribute("x",g),c.setAttribute("y",z),c.setAttribute("width",1),c.setAttribute("height",a),c.setAttribute("fill",D.value),c.setAttribute("class","vue-data-ui-svg-caret"),w.value.appendChild(c)}function ie(i){if(h.value&&!h.value.contains(i.target)){const r=h.value.children;r.length===1&&(r[0].textContent===""||r[0].textContent==="​")&&h.value.remove(),ce(!1)}}function ce(i=!1){var u;window.removeEventListener("keydown",ue),window.removeEventListener("mousedown",ie,!0);const r=(u=w.value)==null?void 0:u.querySelector(".vue-data-ui-svg-caret");r&&w.value.removeChild(r);const o=X.value.every(v=>!v||v==="​");i||o||L.value.push({id:G(),type:"text",x:Y.value.x,y:Y.value.y,color:D.value,fontSize:P.value,lines:X.value.map(v=>v)}),h.value&&w.value&&w.value.contains(h.value)&&w.value.removeChild(h.value),q.value=!1,h.value=null,X.value=[""],E.value={row:0,col:0}}const H=t.computed(()=>d.lightenHexColor(U.color,.6));function ee({width:i,height:r}){_.value=`0 0 ${i} ${r}`}const K=t.ref(null);t.onMounted(()=>{t.nextTick(()=>{if(U.parent){K.value=new ResizeObserver(o=>{for(const u of o){const{width:v,height:f}=u.contentRect;ee({width:v,height:f})}}),K.value.observe(U.parent);const{width:i,height:r}=U.parent.getBoundingClientRect();ee({width:i,height:r})}}),w.value=R.value.querySelector("g")}),t.onBeforeUnmount(()=>{K.value&&K.value.disconnect()}),t.watch(()=>U.parent,i=>{if(!i)return;const{width:r,height:o}=U.parent.getBoundingClientRect();ee({width:r,height:o})},{immediate:!0}),t.watch(m,i=>{var r,o;i==="text"?(r=R.value)==null||r.addEventListener("mousedown",re):(o=R.value)==null||o.removeEventListener("mousedown",re)});const Z=t.ref(!1),N=t.ref(""),R=t.ref(null);function me(i){if(m.value!=="draw"||!R.value)return;Z.value=!0;const{x:r,y:o}=F(i);N.value=`M ${r} ${o}`}function be(i){if(!Z.value||!R.value)return;const{x:r,y:o}=F(i);N.value+=` ${r} ${o}`}function l(i){const r=i.trim().split(/\s+/);if(r.length<4)return i;const o=r.slice(1).map(Number);if(o.length%2!==0)return i;const u=ve(o),v=[`M ${u[0]} ${u[1]}`];for(let T=2;T<u.length-2;T+=2){const B=u[T-2],p=u[T-1],M=u[T],z=u[T+1],g=(B+M)/2,c=(p+z)/2;v.push(`Q ${B} ${p} ${g} ${c}`)}const f=u[u.length-2],a=u[u.length-1];return v.push(`L ${f} ${a}`),v.join(" ")}function ve(i,r=1){const o=[...i];for(let u=2;u<i.length-2;u+=2){const v=i[u],f=i[u+1],a=i[u-2],T=i[u-1],B=i[u+2],p=i[u+3];o[u]=v+r*((a+B)/2-v),o[u+1]=f+r*((T+p)/2-f)}return o}function xe(i){const r=i.trim().split(/\s+/);let o="",u="",v=null,f=null;for(let a=0;a<r.length;a+=1){const T=r[a];if(isNaN(T)){if(u=T,u==="M"||u==="L")v=parseFloat(r[++a]),f=parseFloat(r[++a]),o+=`${u}${v} ${f}`;else if(u==="Q"){const B=parseFloat(r[++a]),p=parseFloat(r[++a]),M=parseFloat(r[++a]),z=parseFloat(r[++a]);B===v&&p===f?o+=`t${M-v} ${z-f}`:o+=`q${B-v} ${p-f} ${M-v} ${z-f}`,v=M,f=z}}else{const B=parseFloat(T),p=parseFloat(r[++a]);if(u==="L"){const M=B-v,z=p-f;M===0?o+=`v${z}`:z===0?o+=`h${M}`:o+=`l${M} ${z}`,v=B,f=p}else if(u==="Q"){const M=B,z=p,g=parseFloat(r[++a]),c=parseFloat(r[++a]);M===v&&z===f?o+=`t${g-v} ${c-f}`:o+=`q${M-v} ${z-f} ${g-v} ${c-f}`,v=g,f=c}}}return o}function ae(){Z.value&&(L.value.push({id:G(),strokeWidth:y.value,path:xe(l(N.value)),color:D.value}),V.value=[],N.value=""),Z.value=!1}function F(i){if(!R.value)return{x:0,y:0};const r=R.value.getBoundingClientRect();let o,u;return i.touches&&i.touches.length?(o=i.touches[0].clientX,u=i.touches[0].clientY):(o=i.clientX,u=i.clientY),{x:o-r.left,y:u-r.top}}function ke(){if(L.value.length>0){const i=L.value.pop();V.value.push(i)}}function Ce(){if(V.value.length>0){const i=V.value.pop();L.value.push(i)}}function Le(){L.value=[],V.value=[]}const de=t.ref(null);return(i,r)=>(t.openBlock(),t.createElementBlock(t.Fragment,null,[$.active?(t.openBlock(),t.createElementBlock("div",{key:0,"data-dom-to-png-ignore":"",class:t.normalizeClass({"vue-ui-pen-and-paper-actions":!0,visible:$.active})},[t.createElementVNode("button",{class:"vue-ui-pen-and-paper-action",style:t.normalizeStyle({backgroundColor:$.backgroundColor,border:`1px solid ${H.value}`}),onClick:r[0]||(r[0]=o=>Be("close"))},[t.createVNode(ge.default,{name:"close",stroke:$.color},null,8,["stroke"])],4),t.createElementVNode("button",kt,[t.createVNode(xt.ColorPicker,{value:D.value,"onUpdate:value":r[1]||(r[1]=o=>D.value=o),backgroundColor:$.backgroundColor,buttonBorderColor:H.value},null,8,["value","backgroundColor","buttonBorderColor"])]),t.createElementVNode("button",{class:t.normalizeClass(["vue-ui-pen-and-paper-action",{"vue-ui-pen-and-paper-action-active":m.value==="text"}]),onClick:r[2]||(r[2]=o=>m.value=m.value==="text"?"draw":"text"),style:t.normalizeStyle({backgroundColor:$.backgroundColor,border:`1px solid ${H.value}`})},[t.createVNode(ge.default,{name:m.value==="draw"?"annotator":"text",stroke:$.color},null,8,["name","stroke"]),t.createElementVNode("div",{style:t.normalizeStyle({position:"absolute",bottom:"-20px",color:H.value,width:"100%",textAlign:"center",fontSize:"12px"})},t.toDisplayString(t.unref(d.dataLabel)({v:m.value==="draw"?y.value:P.value,s:"px",r:1})),5)],6),t.createElementVNode("button",{class:t.normalizeClass({"vue-ui-pen-and-paper-action":!0,"vue-ui-pen-and-paper-action-disabled":!L.value.length}),disabled:!L.value.length,style:t.normalizeStyle({backgroundColor:$.backgroundColor,border:`1px solid ${H.value}`,marginTop:"20px"}),onClick:ke},[t.createVNode(ge.default,{name:"restart",stroke:$.color},null,8,["stroke"])],14,Ct),t.createElementVNode("button",{class:t.normalizeClass({"vue-ui-pen-and-paper-action":!0,"vue-ui-pen-and-paper-action-disabled":!V.value.length}),style:t.normalizeStyle({backgroundColor:$.backgroundColor,border:`1px solid ${H.value}`}),onClick:Ce},[t.createVNode(ge.default,{name:"restart",stroke:$.color,style:{transform:"scaleX(-1)"}},null,8,["stroke"])],6),t.createElementVNode("button",{class:t.normalizeClass([{"vue-ui-pen-and-paper-action":!0,"vue-ui-pen-and-paper-action-disabled":!L.value.length},"vue-ui-pen-and-paper-action"]),style:t.normalizeStyle({backgroundColor:$.backgroundColor,border:`1px solid ${H.value}`}),onClick:Le},[t.createVNode(ge.default,{name:"trash",stroke:$.color},null,8,["stroke"])],6),m.value==="draw"?t.withDirectives((t.openBlock(),t.createElementBlock("input",{key:0,ref_key:"range",ref:de,type:"range",class:"vertical-range",min:.5,max:12,step:.1,"onUpdate:modelValue":r[3]||(r[3]=o=>y.value=o),style:t.normalizeStyle({accentColor:$.color})},null,4)),[[t.vModelText,y.value]]):t.createCommentVNode("",!0),m.value==="text"?t.withDirectives((t.openBlock(),t.createElementBlock("input",{key:1,ref_key:"range",ref:de,type:"range",class:"vertical-range",min:3,max:48,step:.1,"onUpdate:modelValue":r[4]||(r[4]=o=>P.value=o),style:t.normalizeStyle({accentColor:$.color})},null,4)),[[t.vModelText,P.value]]):t.createCommentVNode("",!0)],2)):t.createCommentVNode("",!0),(t.openBlock(),t.createElementBlock("svg",{"data-mode":m.value,ref_key:"svgElement",ref:R,xmlns:t.unref(d.XMLNS),viewBox:_.value,class:t.normalizeClass({"vue-ui-pen-and-paper":!0,inactive:!$.active}),onMousedown:me,onMousemove:be,onMouseup:ae,onMouseleave:ae,onTouchstart:t.withModifiers(me,["prevent"]),onTouchmove:t.withModifiers(be,["prevent"]),onTouchend:ae},[t.createElementVNode("g",{ref_key:"G",ref:w},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(L.value,o=>(t.openBlock(),t.createElementBlock(t.Fragment,{key:o.id},[o.path&&o.path.replace("M","").split(" ").length===2?(t.openBlock(),t.createElementBlock("circle",{key:0,cx:o.path.replace("M","").split(" ")[0],cy:o.path.replace("M","").split(" ")[1],r:o.strokeWidth/2,fill:o.color},null,8,wt)):o.path?(t.openBlock(),t.createElementBlock("path",{key:1,class:"vue-ui-pen-and-paper-path",d:o.path,stroke:o.color,"stroke-width":o.strokeWidth,fill:"none"},null,8,St)):o.type==="text"?(t.openBlock(),t.createElementBlock("text",{key:2,x:o.x,y:o.y,fill:o.color,"font-size":o.fontSize,"font-family":"sans-serif","dominant-baseline":"hanging",class:"vue-ui-pen-and-paper-text"},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(o.lines,(u,v)=>(t.openBlock(),t.createElementBlock("tspan",{key:v,x:o.x,dy:v===0?"0":o.fontSize*1.2},t.toDisplayString(u.length?u:"​"),9,$t))),128))],8,zt)):t.createCommentVNode("",!0)],64))),128))],512),Z.value?(t.openBlock(),t.createElementBlock("path",{key:0,class:"vue-ui-pen-and-paper-path vue-ui-pen-and-paper-path-drawing",d:l(N.value),stroke:D.value,"stroke-width":y.value*1.1,fill:"none"},null,8,Tt)):t.createCommentVNode("",!0)],42,Lt))],64))}},Bt=We._export_sfc(Et,[["__scopeId","data-v-c74c326e"]]),Mt=["id"],Nt=["onClick"],Pt={key:2,class:"vue-data-ui-watermark"},It=["innerHTML"],At={__name:"vue-ui-xy-canvas",props:{dataset:{type:Array,default(){return[]}},config:{type:Object,default(){return{}}}},emits:["selectLegend"],setup($,{expose:Ee,emit:U}){const{vue_ui_xy_canvas:Be}=d.useConfig(),L=$,V=t.ref(d.createUid()),_=t.ref(null),D=t.ref(null),y=t.ref(null),m=t.ref(1),w=t.ref(1),q=t.ref(!1),h=t.ref(null),Y=t.ref(""),X=t.ref(null),E=t.ref([]),P=t.ref(1),W=t.ref(!0),G=t.ref(!0),ne=t.ref(null),re=t.ref(0),ue=t.ref(0),J=t.ref(!1),se=t.ref(null),ie=t.ref(null),ce=t.ref(null),H=t.ref(null),ee=t.ref(0),K=t.ref(0),Z=t.ref(0),N=t.ref(null),R=t.computed(()=>!!L.dataset&&L.dataset.length),me=U,be=t.useSlots();t.onMounted(()=>{be["chart-background"]&&console.warn("VueUiXyCanvas does not support the #chart-background slot.")});const l=t.computed({get:()=>ke(),set:e=>e}),{userOptionsVisible:ve,setUserOptionsVisibility:xe,keepUserOptionState:ae}=mt.useUserOptionState({config:l.value}),{svgRef:F}=bt.useChartAccessibility({config:l.value.style.chart.title});function ke(){const e=qe.useNestedProp({userConfig:L.config,defaultConfig:Be});let n={};return e.theme?n={...qe.useNestedProp({userConfig:d.themes.vue_ui_xy_canvas[e.theme]||L.config,defaultConfig:e}),customPalette:d.themePalettes[e.theme]||d.palette}:n=e,L.config&&d.hasDeepProperty(L.config,"style.chart.scale.min")?n.style.chart.scale.min=L.config.style.chart.scale.min:n.style.chart.scale.min=null,L.config&&d.hasDeepProperty(L.config,"style.chart.scale.max")?n.style.chart.scale.max=L.config.style.chart.scale.max:n.style.chart.scale.max=null,L.config&&d.hasDeepProperty(L.config,"style.chart.zoom.startIndex")?n.style.chart.zoom.startIndex=L.config.style.chart.zoom.startIndex:n.style.chart.zoom.startIndex=null,L.config&&d.hasDeepProperty(L.config,"style.chart.zoom.endIndex")?n.style.chart.zoom.endIndex=L.config.style.chart.zoom.endIndex:n.style.chart.zoom.endIndex=null,n}t.watch(()=>L.config,e=>{l.value=ke(),ve.value=!l.value.userOptions.showOnChartHover,Me(),ee.value+=1,K.value+=1,Z.value+=1,o.value.showTable=l.value.table.show,o.value.showDataLabels=l.value.style.chart.dataLabels.show,o.value.stacked=l.value.style.chart.stacked,o.value.showTooltip=l.value.style.chart.tooltip.show},{deep:!0}),t.watch(()=>L.dataset,()=>{Me(),ee.value+=1,K.value+=1,Z.value+=1},{deep:!0});const Ce=t.ref(l.value.style.chart.aspectRatio),{isPrinting:Le,isImaging:de,generatePdf:i,generateImage:r}=Ue.usePrinter({elementId:`xy_canvas_${V.value}`,fileName:l.value.style.chart.title.text||"vue-ui-xy-canvas",options:l.value.userOptions.print}),o=t.ref({showTable:l.value.table.show,showDataLabels:l.value.style.chart.dataLabels.show,stacked:l.value.style.chart.stacked,showTooltip:l.value.style.chart.tooltip.show});function u(e){J.value=e,ue.value+=1}const v=t.computed(()=>d.convertCustomPalette(l.value.customPalette)),f=t.computed(()=>z.value?Math.max(...z.value.filter((e,n)=>!E.value.includes(e.absoluteIndex)).map(e=>e.series.length)):0),a=t.computed(()=>{const e=m.value-m.value*(l.value.style.chart.paddingProportions.left+l.value.style.chart.paddingProportions.right);return{canvasWidth:m.value,canvasHeight:w.value,left:m.value*l.value.style.chart.paddingProportions.left,top:w.value*l.value.style.chart.paddingProportions.top,right:m.value-m.value*l.value.style.chart.paddingProportions.right,bottom:w.value-w.value*l.value.style.chart.paddingProportions.bottom,width:e,height:w.value-w.value*(l.value.style.chart.paddingProportions.top+l.value.style.chart.paddingProportions.bottom),slot:e/(c.value.end-c.value.start)}});function T(e,n){return e/n}function B({hasAutoScale:e,series:n,min:s,max:b,scale:C,yOffset:A,individualHeight:k,stackIndex:S=null}){return n.map((te,O)=>{const Q=C.min<0?Math.abs(C.min):0,le=T(te+Q,Q+C.max);let ye,pe;e&&(ye=C.min,pe=T(te-ye,C.max-ye));let j=0;return S===null?j=a.value.bottom-a.value.height*(e?pe:le):j=a.value.bottom-A-k*(e?pe:le),{x:a.value.left+a.value.slot*O+a.value.slot/2,y:j,value:te}})}const p=t.computed(()=>{const e=l.value.style.chart.scale.min!==null?l.value.style.chart.scale.min:Math.min(...z.value.filter((k,S)=>!E.value.includes(k.absoluteIndex)).flatMap(k=>k.series.slice(c.value.start,c.value.end))),n=l.value.style.chart.scale.max!==null?l.value.style.chart.scale.max:Math.max(...z.value.filter((k,S)=>!E.value.includes(k.absoluteIndex)).flatMap(k=>k.series.slice(c.value.start,c.value.end))),s=d.calculateNiceScale(e<0?e:0,n===e?e+1<0?0:e+1:n<0?0:n,l.value.style.chart.scale.ticks),b=s.min<0?Math.abs(s.min):0,C=a.value.bottom-a.value.height*(b/(s.max+b)),A=s.ticks.map(k=>({y:a.value.bottom-a.value.height*((k+b)/(s.max+b)),x:a.value.left-8,value:k}));return{absoluteMin:b,max:n,min:e,scale:s,yLabels:A,zero:C}}),M=t.computed(()=>g.value.map(e=>`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),d=require("./index-B5i_oOe8.cjs"),x=require("./useResponsive-DQmBAoBf.cjs"),vt=require("./Tooltip-BBFZLNTE.cjs"),dt=require("./Legend-DbP3f92j.cjs"),ht=require("./Title-B-RSvsOL.cjs"),ft=require("./Slicer-BarYwls5.cjs"),Ue=require("./usePrinter-DaLLwnEh.cjs"),yt=require("./vue-ui-accordion-D8fBDKkc.cjs"),pt=require("./DataTable-uo_v6Lsv.cjs"),gt=require("./vue-ui-skeleton-CHy5aDUT.cjs"),qe=require("./useNestedProp-BPLMSXYf.cjs"),mt=require("./useUserOptionState-BgepsfED.cjs"),bt=require("./useChartAccessibility-Cm7nkzTG.cjs"),ge=require("./BaseIcon-Djhm7pK9.cjs"),xt=require("./ColorPicker-Dp1Scn6A.cjs"),We=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),kt={class:t.normalizeClass({"vue-ui-pen-and-paper-action":!0}),style:{padding:"0 !important"}},Ct=["disabled"],Lt=["data-mode","xmlns","viewBox"],wt=["cx","cy","r","fill"],St=["d","stroke","stroke-width"],zt=["x","y","fill","font-size"],$t=["x","dy"],Tt=["d","stroke","stroke-width"],Et={__name:"NonSvgPenAndPaper",props:{parent:{type:HTMLElement},backgroundColor:{type:String,default:"#FFFFFF"},color:{type:String,default:"#2D353C"},active:{type:Boolean,default:!1}},emits:["close"],setup(z,{emit:Ee}){const U=z,Be=Ee,L=t.ref([]),V=t.ref([]),K=t.ref("0 0 0 0"),D=t.ref(U.color),y=t.ref(1),m=t.ref("draw"),w=t.ref(null),q=t.ref(!1),h=t.ref(null),Y=t.ref({x:0,y:0}),X=t.ref([""]),E=t.ref({row:0,col:0}),P=t.ref(16);let W=1;function G(){return W++}function ne(i){var a;const r=R.value;if(!r)return{x:0,y:0};const o=r.createSVGPoint();let u=i.clientX,v=i.clientY;i.touches&&i.touches.length&&(u=i.touches[0].clientX,v=i.touches[0].clientY),o.x=u,o.y=v;const f=(a=r.getScreenCTM())==null?void 0:a.inverse();return f?o.matrixTransform(f):{x:0,y:0}}function re(i){if(!w.value||m.value!=="text"||q.value)return;const{x:r,y:o}=ne(i);Y.value={x:r,y:o},X.value=[""],E.value={row:0,col:0};const u=document.createElementNS("http://www.w3.org/2000/svg","text");u.setAttribute("x",r),u.setAttribute("y",o),u.setAttribute("fill",D.value),u.setAttribute("font-size",P.value),u.setAttribute("font-family","sans-serif"),u.setAttribute("class","vue-data-ui-doodle"),u.setAttribute("dominant-baseline","hanging"),u.setAttribute("pointer-events","all");const v=document.createElementNS("http://www.w3.org/2000/svg","tspan");v.setAttribute("x",r),v.setAttribute("dy","0"),v.textContent="",u.appendChild(v),u.style.pointerEvents="none",u.style.userSelect="none",w.value.appendChild(u),h.value=u,q.value=!0,window.addEventListener("keydown",ue),window.addEventListener("mousedown",ie,!0),J(),se()}function ue(i){if(!q.value)return;let{row:r,col:o}=E.value,u=X.value.slice(),v=!1;if(i.key==="Enter"){const f=u[r],a=f.slice(0,o),T=f.slice(o);u.splice(r,1,a,T),r+=1,o=0,v=!0,i.preventDefault()}else if(i.key==="Backspace"){if(o>0)u[r]=u[r].slice(0,o-1)+u[r].slice(o),o-=1,v=!0;else if(r>0){const f=u[r-1].length;u[r-1]+=u[r],u.splice(r,1),r-=1,o=f,v=!0}i.preventDefault()}else if(i.key==="Delete")o<u[r].length?(u[r]=u[r].slice(0,o)+u[r].slice(o+1),v=!0):r<u.length-1&&(u[r]+=u[r+1],u.splice(r+1,1),v=!0),i.preventDefault();else if(i.key==="ArrowLeft")o>0?o-=1:r>0&&(r-=1,o=u[r].length),v=!0,i.preventDefault();else if(i.key==="ArrowRight")o<u[r].length?o+=1:r<u.length-1&&(r+=1,o=0),v=!0,i.preventDefault();else if(i.key==="ArrowUp")r>0&&(r-=1,o=Math.min(o,u[r].length),v=!0),i.preventDefault();else if(i.key==="ArrowDown")r<u.length-1&&(r+=1,o=Math.min(o,u[r].length),v=!0),i.preventDefault();else if(i.key.length===1&&!i.ctrlKey&&!i.metaKey&&!i.altKey)u[r]=u[r].slice(0,o)+i.key+u[r].slice(o),o+=1,v=!0,i.preventDefault();else if(i.key==="Escape"){ce(!0);return}else i.key==="Tab"&&i.preventDefault();v&&(X.value=u,E.value={row:r,col:o},J(),se())}function J(){const i=h.value,{x:r,y:o}=Y.value;for(;i.firstChild;)i.removeChild(i.firstChild);X.value.forEach((u,v)=>{const f=document.createElementNS("http://www.w3.org/2000/svg","tspan");f.setAttribute("x",r),f.setAttribute("dy",v===0?"0":`${P.value*1.2}`),f.textContent=u.length?u:"​",i.appendChild(f)})}function se(){const i=w.value.querySelector(".vue-data-ui-svg-caret");i&&w.value.removeChild(i);const r=h.value;if(!r)return;const{x:o,y:u}=Y.value,{row:v,col:f}=E.value,a=P.value,T=r.childNodes[v];if(!T)return;let B=T.textContent.slice(0,f);B.endsWith(" ")&&(B+=" ");const p=document.createElementNS("http://www.w3.org/2000/svg","text");p.setAttribute("x",o),p.setAttribute("y",u),p.setAttribute("font-size",a),p.setAttribute("font-family","sans-serif"),p.textContent=B||"",w.value.appendChild(p);const M=p.getBBox();w.value.removeChild(p);let $=u+v*a*1.2,g=o+M.width;const c=document.createElementNS("http://www.w3.org/2000/svg","rect");c.setAttribute("x",g),c.setAttribute("y",$),c.setAttribute("width",1),c.setAttribute("height",a),c.setAttribute("fill",D.value),c.setAttribute("class","vue-data-ui-svg-caret"),w.value.appendChild(c)}function ie(i){if(h.value&&!h.value.contains(i.target)){const r=h.value.children;r.length===1&&(r[0].textContent===""||r[0].textContent==="​")&&h.value.remove(),ce(!1)}}function ce(i=!1){var u;window.removeEventListener("keydown",ue),window.removeEventListener("mousedown",ie,!0);const r=(u=w.value)==null?void 0:u.querySelector(".vue-data-ui-svg-caret");r&&w.value.removeChild(r);const o=X.value.every(v=>!v||v==="​");i||o||L.value.push({id:G(),type:"text",x:Y.value.x,y:Y.value.y,color:D.value,fontSize:P.value,lines:X.value.map(v=>v)}),h.value&&w.value&&w.value.contains(h.value)&&w.value.removeChild(h.value),q.value=!1,h.value=null,X.value=[""],E.value={row:0,col:0}}const H=t.computed(()=>d.lightenHexColor(U.color,.6));function ee({width:i,height:r}){K.value=`0 0 ${i} ${r}`}const _=t.ref(null);t.onMounted(()=>{t.nextTick(()=>{if(U.parent){_.value=new ResizeObserver(o=>{for(const u of o){const{width:v,height:f}=u.contentRect;ee({width:v,height:f})}}),_.value.observe(U.parent);const{width:i,height:r}=U.parent.getBoundingClientRect();ee({width:i,height:r})}}),w.value=R.value.querySelector("g")}),t.onBeforeUnmount(()=>{_.value&&_.value.disconnect()}),t.watch(()=>U.parent,i=>{if(!i)return;const{width:r,height:o}=U.parent.getBoundingClientRect();ee({width:r,height:o})},{immediate:!0}),t.watch(m,i=>{var r,o;i==="text"?(r=R.value)==null||r.addEventListener("mousedown",re):(o=R.value)==null||o.removeEventListener("mousedown",re)});const Z=t.ref(!1),N=t.ref(""),R=t.ref(null);function me(i){if(m.value!=="draw"||!R.value)return;Z.value=!0;const{x:r,y:o}=F(i);N.value=`M ${r} ${o}`}function be(i){if(!Z.value||!R.value)return;const{x:r,y:o}=F(i);N.value+=` ${r} ${o}`}function l(i){const r=i.trim().split(/\s+/);if(r.length<4)return i;const o=r.slice(1).map(Number);if(o.length%2!==0)return i;const u=ve(o),v=[`M ${u[0]} ${u[1]}`];for(let T=2;T<u.length-2;T+=2){const B=u[T-2],p=u[T-1],M=u[T],$=u[T+1],g=(B+M)/2,c=(p+$)/2;v.push(`Q ${B} ${p} ${g} ${c}`)}const f=u[u.length-2],a=u[u.length-1];return v.push(`L ${f} ${a}`),v.join(" ")}function ve(i,r=1){const o=[...i];for(let u=2;u<i.length-2;u+=2){const v=i[u],f=i[u+1],a=i[u-2],T=i[u-1],B=i[u+2],p=i[u+3];o[u]=v+r*((a+B)/2-v),o[u+1]=f+r*((T+p)/2-f)}return o}function xe(i){const r=i.trim().split(/\s+/);let o="",u="",v=null,f=null;for(let a=0;a<r.length;a+=1){const T=r[a];if(isNaN(T)){if(u=T,u==="M"||u==="L")v=parseFloat(r[++a]),f=parseFloat(r[++a]),o+=`${u}${v} ${f}`;else if(u==="Q"){const B=parseFloat(r[++a]),p=parseFloat(r[++a]),M=parseFloat(r[++a]),$=parseFloat(r[++a]);B===v&&p===f?o+=`t${M-v} ${$-f}`:o+=`q${B-v} ${p-f} ${M-v} ${$-f}`,v=M,f=$}}else{const B=parseFloat(T),p=parseFloat(r[++a]);if(u==="L"){const M=B-v,$=p-f;M===0?o+=`v${$}`:$===0?o+=`h${M}`:o+=`l${M} ${$}`,v=B,f=p}else if(u==="Q"){const M=B,$=p,g=parseFloat(r[++a]),c=parseFloat(r[++a]);M===v&&$===f?o+=`t${g-v} ${c-f}`:o+=`q${M-v} ${$-f} ${g-v} ${c-f}`,v=g,f=c}}}return o}function ae(){Z.value&&(L.value.push({id:G(),strokeWidth:y.value,path:xe(l(N.value)),color:D.value}),V.value=[],N.value=""),Z.value=!1}function F(i){if(!R.value)return{x:0,y:0};const r=R.value.getBoundingClientRect();let o,u;return i.touches&&i.touches.length?(o=i.touches[0].clientX,u=i.touches[0].clientY):(o=i.clientX,u=i.clientY),{x:o-r.left,y:u-r.top}}function ke(){if(L.value.length>0){const i=L.value.pop();V.value.push(i)}}function Ce(){if(V.value.length>0){const i=V.value.pop();L.value.push(i)}}function Le(){L.value=[],V.value=[]}const de=t.ref(null);return(i,r)=>(t.openBlock(),t.createElementBlock(t.Fragment,null,[z.active?(t.openBlock(),t.createElementBlock("div",{key:0,"data-dom-to-png-ignore":"",class:t.normalizeClass({"vue-ui-pen-and-paper-actions":!0,visible:z.active}),style:t.normalizeStyle({backgroundColor:z.backgroundColor})},[t.createElementVNode("button",{class:"vue-ui-pen-and-paper-action",style:t.normalizeStyle({backgroundColor:z.backgroundColor,border:`1px solid ${H.value}`}),onClick:r[0]||(r[0]=o=>Be("close"))},[t.createVNode(ge.default,{name:"close",stroke:z.color},null,8,["stroke"])],4),t.createElementVNode("button",kt,[t.createVNode(xt.ColorPicker,{value:D.value,"onUpdate:value":r[1]||(r[1]=o=>D.value=o),backgroundColor:z.backgroundColor,buttonBorderColor:H.value},null,8,["value","backgroundColor","buttonBorderColor"])]),t.createElementVNode("button",{class:t.normalizeClass(["vue-ui-pen-and-paper-action",{"vue-ui-pen-and-paper-action-active":m.value==="text"}]),onClick:r[2]||(r[2]=o=>m.value=m.value==="text"?"draw":"text"),style:t.normalizeStyle({backgroundColor:z.backgroundColor,border:`1px solid ${H.value}`})},[t.createVNode(ge.default,{name:m.value==="draw"?"annotator":"text",stroke:z.color},null,8,["name","stroke"]),t.createElementVNode("div",{style:t.normalizeStyle({position:"absolute",bottom:"-20px",color:H.value,width:"100%",textAlign:"center",fontSize:"12px"})},t.toDisplayString(t.unref(d.dataLabel)({v:m.value==="draw"?y.value:P.value,s:"px",r:1})),5)],6),t.createElementVNode("button",{class:t.normalizeClass({"vue-ui-pen-and-paper-action":!0,"vue-ui-pen-and-paper-action-disabled":!L.value.length}),disabled:!L.value.length,style:t.normalizeStyle({backgroundColor:z.backgroundColor,border:`1px solid ${H.value}`,marginTop:"20px"}),onClick:ke},[t.createVNode(ge.default,{name:"restart",stroke:z.color},null,8,["stroke"])],14,Ct),t.createElementVNode("button",{class:t.normalizeClass({"vue-ui-pen-and-paper-action":!0,"vue-ui-pen-and-paper-action-disabled":!V.value.length}),style:t.normalizeStyle({backgroundColor:z.backgroundColor,border:`1px solid ${H.value}`}),onClick:Ce},[t.createVNode(ge.default,{name:"restart",stroke:z.color,style:{transform:"scaleX(-1)"}},null,8,["stroke"])],6),t.createElementVNode("button",{class:t.normalizeClass([{"vue-ui-pen-and-paper-action":!0,"vue-ui-pen-and-paper-action-disabled":!L.value.length},"vue-ui-pen-and-paper-action"]),style:t.normalizeStyle({backgroundColor:z.backgroundColor,border:`1px solid ${H.value}`}),onClick:Le},[t.createVNode(ge.default,{name:"trash",stroke:z.color},null,8,["stroke"])],6),m.value==="draw"?t.withDirectives((t.openBlock(),t.createElementBlock("input",{key:0,ref_key:"range",ref:de,type:"range",class:"vertical-range",min:.5,max:12,step:.1,"onUpdate:modelValue":r[3]||(r[3]=o=>y.value=o),style:t.normalizeStyle({accentColor:z.color})},null,4)),[[t.vModelText,y.value]]):t.createCommentVNode("",!0),m.value==="text"?t.withDirectives((t.openBlock(),t.createElementBlock("input",{key:1,ref_key:"range",ref:de,type:"range",class:"vertical-range",min:3,max:48,step:.1,"onUpdate:modelValue":r[4]||(r[4]=o=>P.value=o),style:t.normalizeStyle({accentColor:z.color})},null,4)),[[t.vModelText,P.value]]):t.createCommentVNode("",!0)],6)):t.createCommentVNode("",!0),(t.openBlock(),t.createElementBlock("svg",{"data-mode":m.value,ref_key:"svgElement",ref:R,xmlns:t.unref(d.XMLNS),viewBox:K.value,class:t.normalizeClass({"vue-ui-pen-and-paper":!0,inactive:!z.active}),onMousedown:me,onMousemove:be,onMouseup:ae,onMouseleave:ae,onTouchstart:t.withModifiers(me,["prevent"]),onTouchmove:t.withModifiers(be,["prevent"]),onTouchend:ae},[t.createElementVNode("g",{ref_key:"G",ref:w},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(L.value,o=>(t.openBlock(),t.createElementBlock(t.Fragment,{key:o.id},[o.path&&o.path.replace("M","").split(" ").length===2?(t.openBlock(),t.createElementBlock("circle",{key:0,cx:o.path.replace("M","").split(" ")[0],cy:o.path.replace("M","").split(" ")[1],r:o.strokeWidth/2,fill:o.color},null,8,wt)):o.path?(t.openBlock(),t.createElementBlock("path",{key:1,class:"vue-ui-pen-and-paper-path",d:o.path,stroke:o.color,"stroke-width":o.strokeWidth,fill:"none"},null,8,St)):o.type==="text"?(t.openBlock(),t.createElementBlock("text",{key:2,x:o.x,y:o.y,fill:o.color,"font-size":o.fontSize,"font-family":"sans-serif","dominant-baseline":"hanging",class:"vue-ui-pen-and-paper-text"},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(o.lines,(u,v)=>(t.openBlock(),t.createElementBlock("tspan",{key:v,x:o.x,dy:v===0?"0":o.fontSize*1.2},t.toDisplayString(u.length?u:"​"),9,$t))),128))],8,zt)):t.createCommentVNode("",!0)],64))),128))],512),Z.value?(t.openBlock(),t.createElementBlock("path",{key:0,class:"vue-ui-pen-and-paper-path vue-ui-pen-and-paper-path-drawing",d:l(N.value),stroke:D.value,"stroke-width":y.value*1.1,fill:"none"},null,8,Tt)):t.createCommentVNode("",!0)],42,Lt))],64))}},Bt=We._export_sfc(Et,[["__scopeId","data-v-14478ba4"]]),Mt=["id"],Nt=["onClick"],Pt={key:2,class:"vue-data-ui-watermark"},It=["innerHTML"],At={__name:"vue-ui-xy-canvas",props:{dataset:{type:Array,default(){return[]}},config:{type:Object,default(){return{}}}},emits:["selectLegend"],setup(z,{expose:Ee,emit:U}){const{vue_ui_xy_canvas:Be}=d.useConfig(),L=z,V=t.ref(d.createUid()),K=t.ref(null),D=t.ref(null),y=t.ref(null),m=t.ref(1),w=t.ref(1),q=t.ref(!1),h=t.ref(null),Y=t.ref(""),X=t.ref(null),E=t.ref([]),P=t.ref(1),W=t.ref(!0),G=t.ref(!0),ne=t.ref(null),re=t.ref(0),ue=t.ref(0),J=t.ref(!1),se=t.ref(null),ie=t.ref(null),ce=t.ref(null),H=t.ref(null),ee=t.ref(0),_=t.ref(0),Z=t.ref(0),N=t.ref(null),R=t.computed(()=>!!L.dataset&&L.dataset.length),me=U,be=t.useSlots();t.onMounted(()=>{be["chart-background"]&&console.warn("VueUiXyCanvas does not support the #chart-background slot.")});const l=t.computed({get:()=>ke(),set:e=>e}),{userOptionsVisible:ve,setUserOptionsVisibility:xe,keepUserOptionState:ae}=mt.useUserOptionState({config:l.value}),{svgRef:F}=bt.useChartAccessibility({config:l.value.style.chart.title});function ke(){const e=qe.useNestedProp({userConfig:L.config,defaultConfig:Be});let n={};return e.theme?n={...qe.useNestedProp({userConfig:d.themes.vue_ui_xy_canvas[e.theme]||L.config,defaultConfig:e}),customPalette:d.themePalettes[e.theme]||d.palette}:n=e,L.config&&d.hasDeepProperty(L.config,"style.chart.scale.min")?n.style.chart.scale.min=L.config.style.chart.scale.min:n.style.chart.scale.min=null,L.config&&d.hasDeepProperty(L.config,"style.chart.scale.max")?n.style.chart.scale.max=L.config.style.chart.scale.max:n.style.chart.scale.max=null,L.config&&d.hasDeepProperty(L.config,"style.chart.zoom.startIndex")?n.style.chart.zoom.startIndex=L.config.style.chart.zoom.startIndex:n.style.chart.zoom.startIndex=null,L.config&&d.hasDeepProperty(L.config,"style.chart.zoom.endIndex")?n.style.chart.zoom.endIndex=L.config.style.chart.zoom.endIndex:n.style.chart.zoom.endIndex=null,n}t.watch(()=>L.config,e=>{l.value=ke(),ve.value=!l.value.userOptions.showOnChartHover,Me(),ee.value+=1,_.value+=1,Z.value+=1,o.value.showTable=l.value.table.show,o.value.showDataLabels=l.value.style.chart.dataLabels.show,o.value.stacked=l.value.style.chart.stacked,o.value.showTooltip=l.value.style.chart.tooltip.show},{deep:!0}),t.watch(()=>L.dataset,()=>{Me(),ee.value+=1,_.value+=1,Z.value+=1},{deep:!0});const Ce=t.ref(l.value.style.chart.aspectRatio),{isPrinting:Le,isImaging:de,generatePdf:i,generateImage:r}=Ue.usePrinter({elementId:`xy_canvas_${V.value}`,fileName:l.value.style.chart.title.text||"vue-ui-xy-canvas",options:l.value.userOptions.print}),o=t.ref({showTable:l.value.table.show,showDataLabels:l.value.style.chart.dataLabels.show,stacked:l.value.style.chart.stacked,showTooltip:l.value.style.chart.tooltip.show});function u(e){J.value=e,ue.value+=1}const v=t.computed(()=>d.convertCustomPalette(l.value.customPalette)),f=t.computed(()=>$.value?Math.max(...$.value.filter((e,n)=>!E.value.includes(e.absoluteIndex)).map(e=>e.series.length)):0),a=t.computed(()=>{const e=m.value-m.value*(l.value.style.chart.paddingProportions.left+l.value.style.chart.paddingProportions.right);return{canvasWidth:m.value,canvasHeight:w.value,left:m.value*l.value.style.chart.paddingProportions.left,top:w.value*l.value.style.chart.paddingProportions.top,right:m.value-m.value*l.value.style.chart.paddingProportions.right,bottom:w.value-w.value*l.value.style.chart.paddingProportions.bottom,width:e,height:w.value-w.value*(l.value.style.chart.paddingProportions.top+l.value.style.chart.paddingProportions.bottom),slot:e/(c.value.end-c.value.start)}});function T(e,n){return e/n}function B({hasAutoScale:e,series:n,min:s,max:b,scale:C,yOffset:A,individualHeight:k,stackIndex:S=null}){return n.map((te,O)=>{const Q=C.min<0?Math.abs(C.min):0,le=T(te+Q,Q+C.max);let ye,pe;e&&(ye=C.min,pe=T(te-ye,C.max-ye));let j=0;return S===null?j=a.value.bottom-a.value.height*(e?pe:le):j=a.value.bottom-A-k*(e?pe:le),{x:a.value.left+a.value.slot*O+a.value.slot/2,y:j,value:te}})}const p=t.computed(()=>{const e=l.value.style.chart.scale.min!==null?l.value.style.chart.scale.min:Math.min(...$.value.filter((k,S)=>!E.value.includes(k.absoluteIndex)).flatMap(k=>k.series.slice(c.value.start,c.value.end))),n=l.value.style.chart.scale.max!==null?l.value.style.chart.scale.max:Math.max(...$.value.filter((k,S)=>!E.value.includes(k.absoluteIndex)).flatMap(k=>k.series.slice(c.value.start,c.value.end))),s=d.calculateNiceScale(e<0?e:0,n===e?e+1<0?0:e+1:n<0?0:n,l.value.style.chart.scale.ticks),b=s.min<0?Math.abs(s.min):0,C=a.value.bottom-a.value.height*(b/(s.max+b)),A=s.ticks.map(k=>({y:a.value.bottom-a.value.height*((k+b)/(s.max+b)),x:a.value.left-8,value:k}));return{absoluteMin:b,max:n,min:e,scale:s,yLabels:A,zero:C}}),M=t.computed(()=>g.value.map(e=>`
             <div style="display:flex;flex-direction:row;gap:6px;align-items:center;">
                 <svg viewBox="0 0 10 10" height="12" width="12">
                     <circle cx="5" cy="5" r="5" fill="${e.color}"/>
@@ -6,4 +6,4 @@
                 <span>${e.name?e.name+": ":""}</span>
                 <span>${d.applyDataLabel(l.value.style.chart.dataLabels.formatter,e.series[h.value],d.dataLabel({p:e.prefix||"",v:e.series[h.value],s:e.suffix||"",r:e.rounding||0}),{datapoint:e,seriesIndex:h.value})}</span>
             </div>
-        `)),z=t.computed(()=>L.dataset.map((e,n)=>({...e,series:d.largestTriangleThreeBucketsArray({data:d.sanitizeArray(e.series),threshold:l.value.downsample.threshold}),absoluteIndex:n,color:d.convertColorToHex(e.color||v.value[n]||d.palette[n]||d.palette[n%d.palette.length])})));t.watch(f,e=>{e&&Pe()});const g=t.computed(()=>d.assignStackRatios(z.value.filter((e,n)=>!E.value.includes(e.absoluteIndex))).map((e,n)=>({...e,series:e.series.slice(c.value.start,c.value.end)})).map((e,n)=>{let s=[null,void 0].includes(e.scaleMin)?Math.min(...e.series)||0:e.scaleMin,b=[null,void 0].includes(e.scaleMax)?Math.max(...e.series)||1:e.scaleMax;s===b&&(s=s>=0?b-1:s,b=b>=0?b:s+1),e.series.filter(j=>![null,void 0].includes(j)).map(j=>(j-s)/(b-s));const C={valueMin:s,valueMax:b},A=e.scaleSteps||l.value.style.chart.scale.ticks;let k;e.autoScaling?k=d.calculateNiceScale(C.valueMin,C.valueMax,A):k=d.calculateNiceScale(C.valueMin<0?C.valueMin:0,C.valueMax<=0?0:C.valueMax,A);const S=o.value.stacked?a.value.height*(1-e.cumulatedStackRatio):0,te=o.value.stacked?a.value.height/l.value.style.chart.stackGap:0,O=o.value.stacked?a.value.height*e.stackRatio-te:a.value.height,Q=k.min<0?Math.abs(k.min):0;let le;e.autoScaling&&o.value.stacked&&b<=0?le=a.value.bottom-S-O:le=a.value.bottom-S-O*(Q/(k.max+Q));const ye=k.ticks.map((j,ct)=>({y:a.value.bottom-S-O*(ct/(k.ticks.length-1)),x:a.value.left-8,value:j})),pe=B({hasAutoScale:o.value.stacked&&e.autoScaling,series:e.series,min:o.value.stacked?s:p.value.min,max:o.value.stacked?b:p.value.max,scale:o.value.stacked?k:p.value.scale,yOffset:S,individualHeight:O,stackIndex:o.value.stacked?n:null});return{...e,coordinatesLine:pe,min:s,max:b,localScale:k,localZero:le,localMin:Q,localYLabels:ye,yOffset:S,individualHeight:O}})),c=t.ref({start:0,end:f.value});function Pe(){Ie()}const oe=t.ref(null);async function Ie(){(l.value.style.chart.zoom.startIndex!==null||l.value.style.chart.zoom.endIndex!==null)&&oe.value?(l.value.style.chart.zoom.startIndex!==null&&(await t.nextTick(),await t.nextTick(),oe.value&&oe.value.setStartValue(l.value.style.chart.zoom.startIndex)),l.value.style.chart.zoom.endIndex!==null&&(await t.nextTick(),await t.nextTick(),oe.value&&oe.value.setEndValue(Ge(l.value.style.chart.zoom.endIndex+1)))):(c.value={start:0,end:f.value},re.value+=1)}function Ge(e){const n=f.value;return e>n?n:e<0||l.value.style.chart.zoom.startIndex!==null&&e<l.value.style.chart.zoom.startIndex?l.value.style.chart.zoom.startIndex!==null?l.value.style.chart.zoom.startIndex+1:1:e}const Ze=t.computed(()=>g.value.filter(e=>["line","plot",void 0].includes(e.type))),I=t.computed(()=>g.value.filter(e=>e.type==="bar"));function je(){if(!F.value)return;const e=D.value.offsetWidth,n=D.value.offsetHeight;F.value.width=e*P.value*2,F.value.height=n*P.value*2,m.value=e*P.value*2,w.value=n*P.value*2,y.value.scale(P.value,P.value),he()}function _e(){if(y.value.clearRect(0,0,1e4,1e4),y.value.fillStyle=l.value.style.chart.backgroundColor,y.value.fillRect(0,0,a.value.canvasWidth,a.value.canvasHeight),o.value.stacked)l.value.style.chart.grid.y.verticalLines.show&&c.value.end-c.value.start<l.value.style.chart.grid.y.verticalLines.hideUnderXLength?g.value.forEach(e=>{for(let n=0;n<c.value.end-c.value.start+1;n+=1)x.line(y.value,[{x:a.value.left+a.value.slot*n,y:a.value.bottom-e.yOffset-e.individualHeight},{x:a.value.left+a.value.slot*n,y:a.value.bottom-e.yOffset}],{color:l.value.style.chart.grid.y.verticalLines.color})}):l.value.style.chart.grid.y.verticalLines.show&&c.value.end-c.value.start>=l.value.style.chart.grid.y.verticalLines.hideUnderXLength&&g.value.forEach(e=>{for(let n=c.value.start;n<c.value.end;n+=1)n%Math.floor((c.value.end-c.value.start)/l.value.style.chart.grid.y.timeLabels.modulo)===0&&x.line(y.value,[{x:a.value.left+a.value.slot*(n-c.value.start)+a.value.slot/2,y:a.value.bottom-e.yOffset-e.individualHeight},{x:a.value.left+a.value.slot*(n-c.value.start)+a.value.slot/2,y:a.value.bottom-e.yOffset}],{color:l.value.style.chart.grid.y.verticalLines.color})}),l.value.style.chart.grid.x.horizontalLines.show&&(l.value.style.chart.grid.x.horizontalLines.alternate?g.value.forEach(e=>{e.localYLabels.forEach((n,s)=>{s<e.localYLabels.length-1&&x.rect(y.value,[{x:a.value.left,y:n.y},{x:a.value.right,y:n.y},{x:a.value.right,y:e.localYLabels[s+1].y},{x:a.value.left,y:e.localYLabels[s+1].y}],{fillColor:s%2===0?"transparent":d.setOpacity(l.value.style.chart.grid.x.horizontalLines.color,l.value.style.chart.grid.x.horizontalLines.opacity),strokeColor:"transparent"})})}):g.value.forEach(e=>{e.localYLabels.slice(c.value.start,c.value.end).forEach(n=>{x.line(y.value,[{x:a.value.left,y:n.y},{x:a.value.right,y:n.y}],{color:l.value.style.chart.grid.x.horizontalLines.color})})})),l.value.style.chart.grid.zeroLine.show&&g.value.forEach(e=>{x.line(y.value,[{x:a.value.left,y:e.localZero},{x:a.value.right,y:e.localZero}],{color:l.value.style.chart.grid.zeroLine.color,lineDash:l.value.style.chart.grid.zeroLine.dashed?[10,10]:[0,0]})}),l.value.style.chart.grid.y.axisLabels.show&&g.value.forEach(e=>{x.line(y.value,[{x:a.value.left,y:a.value.bottom-e.yOffset},{x:a.value.left,y:a.value.bottom-e.yOffset-e.individualHeight}],{color:e.color}),x.line(y.value,[{x:a.value.right,y:a.value.bottom-e.yOffset},{x:a.value.right,y:a.value.bottom-e.yOffset-e.individualHeight}],{color:e.color})}),g.value.forEach(e=>{x.text(y.value,e.name,m.value/35,a.value.bottom-e.yOffset-e.individualHeight/2,{align:"center",rotation:-90,color:e.color,font:`${Math.round(m.value/40*l.value.style.chart.grid.y.axisLabels.fontSizeRatio)}px ${l.value.style.fontFamily}`})});else{if(l.value.style.chart.grid.y.verticalLines.show&&c.value.end-c.value.start<l.value.style.chart.grid.y.verticalLines.hideUnderXLength)for(let e=0;e<c.value.end-c.value.start+1;e+=1)x.line(y.value,[{x:a.value.left+a.value.slot*e,y:a.value.top},{x:a.value.left+a.value.slot*e,y:a.value.bottom}],{color:l.value.style.chart.grid.y.verticalLines.color});else if(l.value.style.chart.grid.y.verticalLines.show&&c.value.end-c.value.start>=l.value.style.chart.grid.y.verticalLines.hideUnderXLength)for(let e=c.value.start;e<c.value.end;e+=1)e%Math.floor((c.value.end-c.value.start)/l.value.style.chart.grid.y.timeLabels.modulo)===0&&x.line(y.value,[{x:a.value.left+a.value.slot*(e-c.value.start)+a.value.slot/2,y:a.value.top},{x:a.value.left+a.value.slot*(e-c.value.start)+a.value.slot/2,y:a.value.bottom}],{color:l.value.style.chart.grid.y.verticalLines.color});l.value.style.chart.grid.x.horizontalLines.show&&(l.value.style.chart.grid.x.horizontalLines.alternate?p.value.yLabels.forEach((e,n)=>{n<p.value.yLabels.length-1&&x.rect(y.value,[{x:a.value.left,y:e.y},{x:a.value.right,y:e.y},{x:a.value.right,y:p.value.yLabels[n+1].y},{x:a.value.left,y:p.value.yLabels[n+1].y}],{fillColor:n%2===0?"transparent":d.setOpacity(l.value.style.chart.grid.x.horizontalLines.color,l.value.style.chart.grid.x.horizontalLines.opacity),strokeColor:"transparent"})}):p.value.yLabels.forEach(e=>{x.line(y.value,[{x:a.value.left,y:e.y},{x:a.value.right,y:e.y}],{color:l.value.style.chart.grid.x.horizontalLines.color})})),l.value.style.chart.grid.y.showAxis&&x.line(y.value,[{x:a.value.left,y:a.value.top},{x:a.value.left,y:a.value.bottom}],{color:l.value.style.chart.grid.y.axisColor,lineWidth:l.value.style.chart.grid.y.axisThickness}),l.value.style.chart.grid.x.showAxis&&x.line(y.value,[{x:a.value.left,y:a.value.bottom},{x:a.value.right,y:a.value.bottom}],{color:l.value.style.chart.grid.x.axisColor,lineWidth:l.value.style.chart.grid.x.axisThickness}),l.value.style.chart.grid.zeroLine.show&&x.line(y.value,[{x:a.value.left,y:p.value.zero},{x:a.value.right,y:p.value.zero}],{color:l.value.style.chart.grid.zeroLine.color,lineDash:l.value.style.chart.grid.zeroLine.dashed?[10,10]:[0,0]})}l.value.style.chart.grid.y.axisName&&x.text(y.value,l.value.style.chart.grid.y.axisName,m.value-m.value/40*l.value.style.chart.grid.y.axisLabels.fontSizeRatio*1.2,a.value.bottom-a.value.height/2,{font:`${l.value.style.chart.grid.y.axisLabels.bold?"bold ":""}${Math.round(m.value/40*l.value.style.chart.grid.y.axisLabels.fontSizeRatio)}px ${l.value.style.fontFamily}`,color:l.value.style.chart.color,align:"center",rotation:90}),l.value.style.chart.grid.x.axisName&&x.text(y.value,l.value.style.chart.grid.x.axisName,m.value/2,w.value,{font:`${l.value.style.chart.grid.y.axisLabels.bold?"bold ":""}${Math.round(m.value/40*l.value.style.chart.grid.y.axisLabels.fontSizeRatio)}px ${l.value.style.fontFamily}`,color:l.value.style.chart.color,align:"center"})}function Ke(e){for(let n=0;n<e.coordinatesLine.length;n+=1){const s=(h.value===n?m.value/150:l.value.style.chart.line.plots.show?m.value/200:0)*l.value.style.chart.line.plots.radiusRatio;x.circle(y.value,{x:e.coordinatesLine[n].x,y:e.coordinatesLine[n].y},s,{color:l.value.style.chart.backgroundColor,fillStyle:e.color})}}function Qe(){g.value.forEach(e=>{e.showYMarker&&fe(e)&&x.text(y.value,d.applyDataLabel(l.value.style.chart.dataLabels.formatter,fe(e).value,d.dataLabel({p:e.prefix||l.value.style.chart.grid.y.axisLabels.prefix||"",v:fe(e).value,s:e.suffix||l.value.style.chart.grid.y.axisLabels.suffix||"",r:e.rounding||l.value.style.chart.grid.y.axisLabels.rounding||0}),{datapoint:fe(e),seriesIndex:null}),a.value.left-8+l.value.style.chart.grid.y.axisLabels.offsetX,fe(e).y,{align:"right",font:`${l.value.style.chart.grid.y.axisLabels.bold?"bold ":""}${Math.round(m.value/40*l.value.style.chart.grid.y.axisLabels.fontSizeRatio)}px ${l.value.style.fontFamily}`,color:e.color})})}function Je(){l.value.style.chart.grid.y.axisLabels.show&&(o.value.stacked?g.value.forEach(e=>{e.localYLabels.forEach((n,s)=>{x.text(y.value,d.applyDataLabel(l.value.style.chart.dataLabels.formatter,n.value,d.dataLabel({p:e.prefix||l.value.style.chart.grid.y.axisLabels.prefix||"",v:n.value,s:e.suffix||l.value.style.chart.grid.y.axisLabels.suffix||"",r:e.rounding||l.value.style.chart.grid.y.axisLabels.rounding||0}),{datapoint:n,seriesIndex:s}),n.x+l.value.style.chart.grid.y.axisLabels.offsetX,n.y,{align:"right",font:`${l.value.style.chart.grid.y.axisLabels.bold?"bold ":""}${Math.round(m.value/40*l.value.style.chart.grid.y.axisLabels.fontSizeRatio)}px ${l.value.style.fontFamily}`,color:e.color,globalAlpha:e.showYMarker&&![null,void 0].includes(h.value)?.2:1})})}):p.value.yLabels.forEach((e,n)=>{x.text(y.value,d.applyDataLabel(l.value.style.chart.dataLabels.formatter,e.value,d.dataLabel({p:l.value.style.chart.grid.y.axisLabels.prefix||"",v:e.value,s:l.value.style.chart.grid.y.axisLabels.suffix||"",r:l.value.style.chart.grid.y.axisLabels.rounding||0}),{datapoint:e,seriesIndex:n}),e.x+l.value.style.chart.grid.y.axisLabels.offsetX,e.y,{align:"right",font:`${l.value.style.chart.grid.y.axisLabels.bold?"bold ":""}${Math.round(m.value/40*l.value.style.chart.grid.y.axisLabels.fontSizeRatio)}px ${l.value.style.fontFamily}`,color:l.value.style.chart.grid.y.axisLabels.color,globalAlpha:g.value.some(s=>s.showYMarker)&&![null,void 0].includes(h.value)?.2:1})}))}function et(e){for(let n=0;n<e.coordinatesLine.length;n+=1)x.text(y.value,d.applyDataLabel(l.value.style.chart.dataLabels.formatter,e.coordinatesLine[n].value,d.dataLabel({p:e.prefix||"",v:e.coordinatesLine[n].value,s:e.suffix||"",r:e.rounding||0}),{datapoint:e.coordinatesLine[n],seriesIndex:n}),e.coordinatesLine[n].x,e.coordinatesLine[n].y+l.value.style.chart.dataLabels.offsetY,{align:"center",font:`${l.value.style.chart.dataLabels.bold?"bold ":""}${Math.round(m.value/40*l.value.style.chart.dataLabels.fontSizeRatio)}px ${l.value.style.fontFamily}`,color:l.value.style.chart.dataLabels.useSerieColor?e.color:l.value.style.chart.dataLabels.color})}function tt(){for(let e=c.value.start;e<c.value.end;e+=1)(c.value.end-c.value.start<l.value.style.chart.grid.y.timeLabels.modulo||c.value.end-c.value.start>=l.value.style.chart.grid.y.timeLabels.modulo&&(e%Math.floor((c.value.end-c.value.start)/l.value.style.chart.grid.y.timeLabels.modulo)===0||e===h.value+c.value.start&&l.value.style.chart.grid.y.timeLabels.showMarker))&&x.text(y.value,l.value.style.chart.grid.y.timeLabels.values[e]||e+1,a.value.left+a.value.slot*(e-c.value.start)+a.value.slot/2,a.value.bottom+m.value/l.value.style.chart.grid.y.timeLabels.offsetY,{align:l.value.style.chart.grid.y.timeLabels.rotation===0?"center":l.value.style.chart.grid.y.timeLabels.rotation>0?"left":"right",font:`${l.value.style.chart.grid.y.timeLabels.bold?"bold ":""}${Math.round(m.value/40*l.value.style.chart.grid.y.timeLabels.fontSizeRatio)}px ${l.value.style.fontFamily}`,color:l.value.style.chart.grid.y.timeLabels.showMarker?d.setOpacity(l.value.style.chart.grid.y.timeLabels.color,h.value!==null?h.value+c.value.start===e?100:20:100):l.value.style.chart.grid.y.timeLabels.color,rotation:l.value.style.chart.grid.y.timeLabels.rotation})}function Ae(){x.line(y.value,[{x:a.value.left+a.value.slot*h.value+a.value.slot/2,y:a.value.top},{x:a.value.left+a.value.slot*h.value+a.value.slot/2,y:a.value.bottom}],{color:l.value.style.chart.selector.color,lineDash:l.value.style.chart.selector.dashed?[8,8]:[0,0],lineWidth:2})}function lt(){N.value&&x.line(y.value,[{x:a.value.left,y:N.value},{x:a.value.right,y:N.value}],{color:l.value.style.chart.selector.color,lineDash:l.value.style.chart.selector.dashed?[8,8]:[0,0],lineWidth:2})}function at(){I.value.forEach((e,n)=>{for(let s=0;s<e.coordinatesLine.length;s+=1)x.rect(y.value,[{x:a.value.left+a.value.slot*s+a.value.slot/10+(o.value.stacked?0:a.value.slot/I.value.length*n-(n===0?0:a.value.slot/(5*I.value.length)*n)),y:o.value.stacked?e.localZero:p.value.zero},{x:a.value.left+a.value.slot*s+a.value.slot/10+(o.value.stacked?0:a.value.slot/I.value.length*n-(n===0?0:a.value.slot/(5*I.value.length)*n))+a.value.slot*.8/(o.value.stacked?1:I.value.length),y:o.value.stacked?e.localZero:p.value.zero},{x:a.value.left+a.value.slot*s+a.value.slot/10+(o.value.stacked?0:a.value.slot/I.value.length*n-(n===0?0:a.value.slot/(5*I.value.length)*n))+a.value.slot*.8/(o.value.stacked?1:I.value.length),y:e.coordinatesLine[s].y},{x:a.value.left+a.value.slot*s+a.value.slot/10+(o.value.stacked?0:a.value.slot/I.value.length*n-(n===0?0:a.value.slot/(5*I.value.length)*n)),y:e.coordinatesLine[s].y}],{strokeColor:l.value.style.chart.backgroundColor,gradient:{type:"linear",start:{x:e.coordinatesLine[s].x,y:e.coordinatesLine[s].y},end:{x:e.coordinatesLine[s].x,y:o.value.stacked?e.localZero:p.value.zero},stops:[{offset:0,color:e.color},{offset:1,color:l.value.style.chart.bar.gradient.show?d.lightenHexColor(e.color,.5):e.color}]}}),o.value.showDataLabels&&[!0,void 0].includes(e.dataLabels)&&x.text(y.value,d.applyDataLabel(l.value.style.chart.dataLabels.formatter,e.coordinatesLine[s].value,d.dataLabel({p:e.prefix||"",v:e.coordinatesLine[s].value,s:e.suffix||"",r:e.rounding||0}),{datapoint:e.coordinatesLine[s],seriesIndex:s}),a.value.left+a.value.slot*s+a.value.slot/10+(o.value.stacked?0:a.value.slot/I.value.length*n-(n===0?0:a.value.slot/(5*I.value.length)*n))+a.value.slot*.4/(o.value.stacked?1:I.value.length),(e.coordinatesLine[s].value<0?o.value.stacked?e.localZero:p.value.zero:e.coordinatesLine[s].y)+l.value.style.chart.dataLabels.offsetY,{align:"center",font:`${Math.round(m.value/40*l.value.style.chart.dataLabels.fontSizeRatio)}px ${l.value.style.fontFamily}`,color:l.value.style.chart.dataLabels.useSerieColor?e.color:l.value.style.chart.dataLabels.color,strokeColor:l.value.style.chart.backgroundColor,lineWidth:.8})})}function ot(e){e.useArea?o.value.stacked?x.polygon(y.value,[{x:e.coordinatesLine[0].x,y:e.localZero},...e.coordinatesLine,{x:e.coordinatesLine.at(-1).x,y:e.localZero}],{fillColor:d.setOpacity(e.color,l.value.style.chart.area.opacity),strokeColor:"transparent"}):x.polygon(y.value,[{x:e.coordinatesLine[0].x,y:p.value.zero},...e.coordinatesLine,{x:e.coordinatesLine.at(-1).x,y:p.value.zero}],{fillColor:d.setOpacity(e.color,l.value.style.chart.area.opacity),strokeColor:"transparent"}):x.line(y.value,e.coordinatesLine,{color:e.color,lineWidth:3})}function nt(){g.value.forEach((e,n)=>{x.line(y.value,[{x:a.value.left,y:a.value.bottom-e.yOffset},{x:a.value.right,y:a.value.bottom-e.yOffset}],{color:l.value.style.chart.grid.x.horizontalLines.color,lineWidth:1})})}function he(){_e(),W.value?(h.value!==null&&l.value.style.chart.selector.show&&Ae(),at(),o.value.stacked&&l.value.style.chart.grid.x.showAxis&&nt(),Ze.value.forEach(e=>{(e.type==="line"||!e.type)&&ot(e),G.value&&(Ke(e),o.value.showDataLabels&&[!0,void 0].includes(e.dataLabels)&&et(e))}),ne.value=x.cloneCanvas(F.value)):(ne.value&&(y.value.clearRect(0,0,1e4,1e4),y.value.drawImage(ne.value,0,0)),h.value!==null&&l.value.style.chart.selector.show&&Ae(),h.value!==null&&g.value.forEach(e=>{if(e.type==="line"||!e.type||e.type==="plot"){if(!e.coordinatesLine[h.value])return;e.coordinatesLine[h.value].x!==void 0&&e.coordinatesLine[h.value].y!==void 0&&x.circle(y.value,{x:e.coordinatesLine[h.value].x,y:e.coordinatesLine[h.value].y},m.value/150*l.value.style.chart.line.plots.radiusRatio,{color:l.value.style.chart.backgroundColor,fillStyle:e.color})}})),l.value.style.chart.grid.y.timeLabels.show&&tt(),l.value.style.chart.selector.show&&l.value.style.chart.selector.showHorizontalSelector&&lt(),Je(),Qe(),W.value=!1}const we=x.debounce(()=>{G.value=!0,je()},f.value>200?10:1,!G.value);function fe(e){if([null,void 0].includes(h.value)||!e.coordinatesLine[h.value])return!1;const{y:n,value:s}=e.coordinatesLine[h.value];return{y:n,value:s}}function rt(e){const{left:n,top:s}=F.value.getBoundingClientRect(),b=e.clientX-n;if(N.value=(e.clientY-s)*2,(N.value<a.value.top||N.value>a.value.bottom)&&(N.value=null),b*2<a.value.left||b*2>a.value.right){q.value=!1,h.value=null;return}const C=b*2-a.value.left;if(h.value=Math.floor(C/a.value.slot),q.value=!0,!G.value)return;let A="";const k=l.value.style.chart.tooltip.customFormat;d.isFunction(k)&&d.functionReturnsString(()=>k({seriesIndex:h.value,datapoint:g.value.map(S=>({shape:S.shape||null,name:S.name,color:S.color,type:S.type||"line",value:S.series.find((te,O)=>O===h.value)})),series:g.value,config:l.value}))?Y.value=k({seriesIndex:h.value,datapoint:g.value.map(S=>({shape:S.shape||null,name:S.name,color:S.color,type:S.type||"line",value:S.series.find((te,O)=>O===h.value)})),series:g.value,config:l.value}):(l.value.style.chart.grid.y.timeLabels.values.slice(c.value.start,c.value.end)[h.value]&&(A+=`<div style="padding-bottom: 6px; margin-bottom: 4px; border-bottom: 1px solid ${l.value.style.chart.tooltip.borderColor}; width:100%">${l.value.style.chart.grid.y.timeLabels.values.slice(c.value.start,c.value.end)[h.value]}</div>`),A+=M.value.join(""),Y.value=A),G.value=!1}t.watch(()=>h.value,e=>{we()}),t.watch(()=>c.value,e=>{W.value=!0,he()},{deep:!0}),t.watch(()=>o.value.showDataLabels,e=>{W.value=!0,he()}),t.watch(()=>N.value,e=>{e&&he()}),t.watch(()=>o.value.stacked,e=>{W.value=!0,G.value=!0,we()});function ut(){q.value=!1,h.value=null,Y.value="",N.value=null,he()}const Se=t.ref(null),ze=t.ref(null);t.onMounted(()=>{Me()});function Me(){if(d.objectIsEmpty(L.dataset)?d.error({componentName:"VueUiXyCanvas",type:"dataset"}):F.value&&(y.value=F.value.getContext("2d",{willReadFrequently:!0})),l.value.responsive){const e=x.throttle(()=>{const{width:n,height:s}=x.useResponsive({chart:_.value,title:l.value.style.chart.title.text?se.value:null,legend:l.value.style.chart.legend.show?ie.value:null,slicer:l.value.style.chart.zoom.show&&f.value>1?ce.value:null,source:H.value});requestAnimationFrame(()=>{Ce.value=`${n} / ${s}`})});Se.value=new ResizeObserver(e),Se.value.observe(_.value.parentNode)}ze.value=new ResizeObserver(e=>{for(const n of e)n.contentBoxSize&&D.value&&(W.value=!0,we())}),ze.value.observe(D.value),Ie()}t.onBeforeUnmount(()=>{ze.value&&ze.value.disconnect(),Se.value&&Se.value.disconnect()});function De(e){me("selectLegend",g.value.find(n=>n.absoluteIndex===e)),E.value.includes(e)?E.value=E.value.filter(n=>n!==e):E.value.push(e),W.value=!0,we()}const Re=t.computed(()=>z.value.map((e,n)=>({...e,name:e.name,color:d.convertColorToHex(e.color)||v.value[n]||d.palette[n]||d.palette[n%d.palette.length],shape:e.shape||"circle",prefix:e.prefix||"",suffix:e.suffix||"",rounding:e.rounding||0})).map(e=>({...e,opacity:E.value.includes(e.absoluteIndex)?.5:1,segregate:()=>De(e.absoluteIndex),isSegregated:E.value.includes(e.absoluteIndex)}))),st=t.computed(()=>({cy:"donut-div-legend",backgroundColor:l.value.style.chart.legend.backgroundColor,color:l.value.style.chart.legend.color,fontSize:l.value.style.chart.legend.fontSize,paddingBottom:12,fontWeight:l.value.style.chart.legend.bold?"bold":""})),$e=t.computed(()=>{const e=[""].concat(g.value.map(C=>C.name)).concat(' <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M18 16v2a1 1 0 0 1 -1 1h-11l6 -7l-6 -7h11a1 1 0 0 1 1 1v2" /></svg>');let n=[];for(let C=0;C<f.value;C+=1){const A=g.value.map(k=>k.series[C]??0).reduce((k,S)=>k+S,0);n.push([l.value.style.chart.grid.y.timeLabels.values.slice(c.value.start,c.value.end)[C]??C+1].concat(g.value.map(k=>(k.series[C]??0).toFixed(l.value.table.rounding))).concat((A??0).toFixed(l.value.table.rounding)))}const s={th:{backgroundColor:l.value.table.th.backgroundColor,color:l.value.table.th.color,outline:l.value.table.th.outline},td:{backgroundColor:l.value.table.td.backgroundColor,color:l.value.table.td.color,outline:l.value.table.td.outline},breakpoint:l.value.table.responsiveBreakpoint},b=[l.value.table.columnNames.period].concat(g.value.map(C=>C.name)).concat(l.value.table.columnNames.total);return{head:e,body:n.slice(0,c.value.end-c.value.start),config:s,colNames:b}}),Fe=t.computed(()=>{if(g.value.length===0)return{head:[],body:[],config:{},columnNames:[]};const e=g.value.map(s=>({label:s.name,color:s.color,type:s.type})),n=[];for(let s=c.value.start;s<c.value.end;s+=1){const b=[l.value.style.chart.grid.y.timeLabels.values[s]||s+1];g.value.forEach(C=>{b.push(Number((C.series[s]||0).toFixed(l.value.table.rounding)))}),n.push(b)}return{head:e,body:n}});function Oe(){const e=[[l.value.style.chart.title.text],[l.value.style.chart.title.subtitle.text],[""]],n=["",...Fe.value.head.map(A=>A.label)],s=Fe.value.body,b=e.concat([n]).concat(s),C=d.createCsvContent(b);d.downloadCsv({csvContent:C,title:l.value.style.chart.title.text||"vue-ui-xy-canvas"})}function it(){return g.value}function Ve(){o.value.showTable=!o.value.showTable}function Ye(){o.value.showDataLabels=!o.value.showDataLabels}function Xe(){o.value.stacked=!o.value.stacked}function He(){o.value.showTooltip=!o.value.showTooltip}const Te=t.ref(!1);function Ne(){Te.value=!Te.value}return Ee({getData:it,generateCsv:Oe,generatePdf:i,generateImage:r,toggleTable:Ve,toggleLabels:Ye,toggleStack:Xe,toggleTooltip:He,toggleAnnotator:Ne}),(e,n)=>(t.openBlock(),t.createElementBlock("div",{style:t.normalizeStyle(`width:100%; position:relative; ${l.value.responsive?"height: 100%":""}`),ref_key:"xy",ref:_,id:`xy_canvas_${V.value}`,class:t.normalizeClass(`vue-ui-donut ${J.value?"vue-data-ui-wrapper-fullscreen":""}`),onMouseenter:n[5]||(n[5]=()=>t.unref(xe)(!0)),onMouseleave:n[6]||(n[6]=()=>t.unref(xe)(!1))},[l.value.style.chart.title.text?(t.openBlock(),t.createElementBlock("div",{key:0,ref_key:"chartTitle",ref:se,style:t.normalizeStyle(`width:100%;background:${l.value.style.chart.backgroundColor};`)},[(t.openBlock(),t.createBlock(ht._sfc_main,{key:`title_${ee.value}`,config:{title:{cy:"xy-canvas-title",...l.value.style.chart.title},subtitle:{cy:"xy-canvas-subtitle",...l.value.style.chart.title.subtitle}}},null,8,["config"]))],4)):t.createCommentVNode("",!0),l.value.userOptions.show&&R.value&&(t.unref(ae)||t.unref(ve))?(t.openBlock(),t.createBlock(Ue.UserOptions,{ref:"details",key:`user_option_${ue.value}`,backgroundColor:l.value.style.chart.backgroundColor,color:l.value.style.chart.color,isPrinting:t.unref(Le),isImaging:t.unref(de),uid:V.value,hasTooltip:l.value.userOptions.buttons.tooltip&&l.value.style.chart.tooltip.show,hasPdf:l.value.userOptions.buttons.pdf,hasImg:l.value.userOptions.buttons.img,hasXls:l.value.userOptions.buttons.csv,hasLabel:l.value.userOptions.buttons.labels,hasStack:$.dataset.length>1&&l.value.userOptions.buttons.stack,hasFullscreen:l.value.userOptions.buttons.fullscreen,hasTable:c.value.end-c.value.start<200&&l.value.userOptions.buttons.table,isFullscreen:J.value,isTooltip:o.value.showTooltip,isStacked:o.value.stacked,titles:{...l.value.userOptions.buttonTitles},chartElement:_.value,position:l.value.userOptions.position,hasAnnotator:l.value.userOptions.buttons.annotator,isAnnotation:Te.value,onToggleFullscreen:u,onGeneratePdf:t.unref(i),onGenerateCsv:Oe,onGenerateImage:t.unref(r),onToggleTable:Ve,onToggleLabels:Ye,onToggleStack:Xe,onToggleTooltip:He,onToggleAnnotator:Ne,style:t.normalizeStyle({visibility:t.unref(ae)?t.unref(ve)?"visible":"hidden":"visible"})},t.createSlots({_:2},[e.$slots.menuIcon?{name:"menuIcon",fn:t.withCtx(({isOpen:s,color:b})=>[t.renderSlot(e.$slots,"menuIcon",t.normalizeProps(t.guardReactiveProps({isOpen:s,color:b})),void 0,!0)]),key:"0"}:void 0,e.$slots.optionTooltip?{name:"optionTooltip",fn:t.withCtx(()=>[t.renderSlot(e.$slots,"optionTooltip",{},void 0,!0)]),key:"1"}:void 0,e.$slots.optionPdf?{name:"optionPdf",fn:t.withCtx(()=>[t.renderSlot(e.$slots,"optionPdf",{},void 0,!0)]),key:"2"}:void 0,e.$slots.optionCsv?{name:"optionCsv",fn:t.withCtx(()=>[t.renderSlot(e.$slots,"optionCsv",{},void 0,!0)]),key:"3"}:void 0,e.$slots.optionImg?{name:"optionImg",fn:t.withCtx(()=>[t.renderSlot(e.$slots,"optionImg",{},void 0,!0)]),key:"4"}:void 0,e.$slots.optionTable?{name:"optionTable",fn:t.withCtx(()=>[t.renderSlot(e.$slots,"optionTable",{},void 0,!0)]),key:"5"}:void 0,e.$slots.optionLabels?{name:"optionLabels",fn:t.withCtx(()=>[t.renderSlot(e.$slots,"optionLabels",{},void 0,!0)]),key:"6"}:void 0,e.$slots.optionStack?{name:"optionStack",fn:t.withCtx(()=>[t.renderSlot(e.$slots,"optionStack",{},void 0,!0)]),key:"7"}:void 0,e.$slots.optionFullscreen?{name:"optionFullscreen",fn:t.withCtx(({toggleFullscreen:s,isFullscreen:b})=>[t.renderSlot(e.$slots,"optionFullscreen",t.normalizeProps(t.guardReactiveProps({toggleFullscreen:s,isFullscreen:b})),void 0,!0)]),key:"8"}:void 0,e.$slots.optionAnnotator?{name:"optionAnnotator",fn:t.withCtx(({toggleAnnotator:s,isAnnotator:b})=>[t.renderSlot(e.$slots,"optionAnnotator",t.normalizeProps(t.guardReactiveProps({toggleAnnotator:s,isAnnotator:b})),void 0,!0)]),key:"9"}:void 0]),1032,["backgroundColor","color","isPrinting","isImaging","uid","hasTooltip","hasPdf","hasImg","hasXls","hasLabel","hasStack","hasFullscreen","hasTable","isFullscreen","isTooltip","isStacked","titles","chartElement","position","hasAnnotator","isAnnotation","onGeneratePdf","onGenerateImage","style"])):t.createCommentVNode("",!0),t.createElementVNode("div",{class:"vue-ui-xy-canvas",style:t.normalizeStyle(`position: relative; aspect-ratio: ${Ce.value}`),ref_key:"container",ref:D},[R.value?(t.openBlock(),t.createElementBlock("canvas",{key:0,ref_key:"canvas",ref:F,style:{width:"100%",height:"100%"},onMousemove:n[0]||(n[0]=s=>rt(s)),onMouseleave:ut},null,544)):(t.openBlock(),t.createBlock(gt.default,{key:1,config:{type:"line",style:{backgroundColor:l.value.style.chart.backgroundColor,line:{axis:{color:"#CCCCCC"},path:{color:"#CCCCCC",strokeWidth:.5}}}}},null,8,["config"])),t.createVNode(vt._sfc_main,{show:o.value.showTooltip&&q.value,backgroundColor:l.value.style.chart.tooltip.backgroundColor,color:l.value.style.chart.tooltip.color,fontSize:l.value.style.chart.tooltip.fontSize,borderRadius:l.value.style.chart.tooltip.borderRadius,borderColor:l.value.style.chart.tooltip.borderColor,borderWidth:l.value.style.chart.tooltip.borderWidth,position:l.value.style.chart.tooltip.position,offsetY:l.value.style.chart.tooltip.offsetY,parent:t.unref(F),content:Y.value,isFullscreen:J.value,backgroundOpacity:l.value.style.chart.tooltip.backgroundOpacity,isCustom:t.unref(d.isFunction)(l.value.style.chart.tooltip.customFormat)},{"tooltip-before":t.withCtx(()=>[t.renderSlot(e.$slots,"tooltip-before",t.normalizeProps(t.guardReactiveProps({...X.value})),void 0,!0)]),"tooltip-after":t.withCtx(()=>[t.renderSlot(e.$slots,"tooltip-after",t.normalizeProps(t.guardReactiveProps({...X.value})),void 0,!0)]),_:3},8,["show","backgroundColor","color","fontSize","borderRadius","borderColor","borderWidth","position","offsetY","parent","content","isFullscreen","backgroundOpacity","isCustom"])],4),t.createElementVNode("div",{ref_key:"chartSlicer",ref:ce,style:t.normalizeStyle(`width:100%;background:${l.value.style.chart.backgroundColor}`),"data-dom-to-png-ignore":""},[l.value.style.chart.zoom.show&&f.value>1?(t.openBlock(),t.createBlock(ft.Slicer,{ref_key:"slicerComponent",ref:oe,key:`slicer_${re.value}`,background:l.value.style.chart.zoom.color,borderColor:l.value.style.chart.backgroundColor,fontSize:l.value.style.chart.zoom.fontSize,useResetSlot:l.value.style.chart.zoom.useResetSlot,labelLeft:l.value.style.chart.grid.y.timeLabels.values[c.value.start]?l.value.style.chart.grid.y.timeLabels.values[c.value.start]:"",labelRight:l.value.style.chart.grid.y.timeLabels.values[c.value.end-1]?l.value.style.chart.grid.y.timeLabels.values[c.value.end-1]:"",textColor:l.value.style.chart.color,inputColor:l.value.style.chart.zoom.color,selectColor:l.value.style.chart.zoom.highlightColor,max:f.value,min:0,valueStart:c.value.start,valueEnd:c.value.end,start:c.value.start,"onUpdate:start":n[1]||(n[1]=s=>c.value.start=s),end:c.value.end,"onUpdate:end":n[2]||(n[2]=s=>c.value.end=s),refreshStartPoint:l.value.style.chart.zoom.startIndex!==null?l.value.style.chart.zoom.startIndex:0,refreshEndPoint:l.value.style.chart.zoom.endIndex!==null?l.value.style.chart.zoom.endIndex+1:f.value,enableRangeHandles:l.value.style.chart.zoom.enableRangeHandles,enableSelectionDrag:l.value.style.chart.zoom.enableSelectionDrag,onReset:Pe},{"reset-action":t.withCtx(({reset:s})=>[t.renderSlot(e.$slots,"reset-action",t.normalizeProps(t.guardReactiveProps({reset:s})),void 0,!0)]),_:3},8,["background","borderColor","fontSize","useResetSlot","labelLeft","labelRight","textColor","inputColor","selectColor","max","valueStart","valueEnd","start","end","refreshStartPoint","refreshEndPoint","enableRangeHandles","enableSelectionDrag"])):t.createCommentVNode("",!0)],4),t.createElementVNode("div",{ref_key:"chartLegend",ref:ie},[l.value.style.chart.legend.show&&R.value?(t.openBlock(),t.createBlock(dt.Legend,{legendSet:Re.value,config:st.value,key:`legend_${Z.value}`,onClickMarker:n[3]||(n[3]=({i:s})=>De(s))},{item:t.withCtx(({legend:s,index:b})=>[t.createElementVNode("div",{onClick:C=>s.segregate(),style:t.normalizeStyle(`opacity:${E.value.includes(b)?.5:1}`)},t.toDisplayString(s.name),13,Nt)]),_:1},8,["legendSet","config"])):t.renderSlot(e.$slots,"legend",{key:1,legend:Re.value},void 0,!0)],512),e.$slots.watermark?(t.openBlock(),t.createElementBlock("div",Pt,[t.renderSlot(e.$slots,"watermark",t.normalizeProps(t.guardReactiveProps({isPrinting:t.unref(Le)||t.unref(de)})),void 0,!0)])):t.createCommentVNode("",!0),e.$slots.source?(t.openBlock(),t.createElementBlock("div",{key:3,ref_key:"source",ref:H,dir:"auto"},[t.renderSlot(e.$slots,"source",{},void 0,!0)],512)):t.createCommentVNode("",!0),c.value.end-c.value.start<200?(t.openBlock(),t.createBlock(yt.default,{key:4,hideDetails:"",config:{open:o.value.showTable,maxHeight:1e4,body:{backgroundColor:l.value.style.chart.backgroundColor,color:l.value.style.chart.color},head:{backgroundColor:l.value.style.chart.backgroundColor,color:l.value.style.chart.color}}},{content:t.withCtx(()=>[(t.openBlock(),t.createBlock(pt.DataTable,{key:`table_${K.value}`,colNames:$e.value.colNames,head:$e.value.head,body:$e.value.body,config:$e.value.config,title:`${l.value.style.chart.title.text}${l.value.style.chart.title.subtitle.text?` : ${l.value.style.chart.title.subtitle.text}`:""}`,onClose:n[4]||(n[4]=s=>o.value.showTable=!1)},{th:t.withCtx(({th:s})=>[t.createElementVNode("div",{innerHTML:s},null,8,It)]),td:t.withCtx(({td:s})=>[t.createTextVNode(t.toDisplayString(s),1)]),_:1},8,["colNames","head","body","config","title"]))]),_:1},8,["config"])):t.createCommentVNode("",!0),l.value.userOptions.buttons.annotator&&g.value.length?(t.openBlock(),t.createBlock(Bt,{key:5,parent:_.value,backgroundColor:l.value.style.chart.backgroundColor,color:l.value.style.chart.color,active:Te.value,onClose:Ne},null,8,["parent","backgroundColor","color","active"])):t.createCommentVNode("",!0)],46,Mt))}},Dt=We._export_sfc(At,[["__scopeId","data-v-b8851cb8"]]);exports.default=Dt;
+        `)),$=t.computed(()=>L.dataset.map((e,n)=>({...e,series:d.largestTriangleThreeBucketsArray({data:d.sanitizeArray(e.series),threshold:l.value.downsample.threshold}),absoluteIndex:n,color:d.convertColorToHex(e.color||v.value[n]||d.palette[n]||d.palette[n%d.palette.length])})));t.watch(f,e=>{e&&Pe()});const g=t.computed(()=>d.assignStackRatios($.value.filter((e,n)=>!E.value.includes(e.absoluteIndex))).map((e,n)=>({...e,series:e.series.slice(c.value.start,c.value.end)})).map((e,n)=>{let s=[null,void 0].includes(e.scaleMin)?Math.min(...e.series)||0:e.scaleMin,b=[null,void 0].includes(e.scaleMax)?Math.max(...e.series)||1:e.scaleMax;s===b&&(s=s>=0?b-1:s,b=b>=0?b:s+1),e.series.filter(j=>![null,void 0].includes(j)).map(j=>(j-s)/(b-s));const C={valueMin:s,valueMax:b},A=e.scaleSteps||l.value.style.chart.scale.ticks;let k;e.autoScaling?k=d.calculateNiceScale(C.valueMin,C.valueMax,A):k=d.calculateNiceScale(C.valueMin<0?C.valueMin:0,C.valueMax<=0?0:C.valueMax,A);const S=o.value.stacked?a.value.height*(1-e.cumulatedStackRatio):0,te=o.value.stacked?a.value.height/l.value.style.chart.stackGap:0,O=o.value.stacked?a.value.height*e.stackRatio-te:a.value.height,Q=k.min<0?Math.abs(k.min):0;let le;e.autoScaling&&o.value.stacked&&b<=0?le=a.value.bottom-S-O:le=a.value.bottom-S-O*(Q/(k.max+Q));const ye=k.ticks.map((j,ct)=>({y:a.value.bottom-S-O*(ct/(k.ticks.length-1)),x:a.value.left-8,value:j})),pe=B({hasAutoScale:o.value.stacked&&e.autoScaling,series:e.series,min:o.value.stacked?s:p.value.min,max:o.value.stacked?b:p.value.max,scale:o.value.stacked?k:p.value.scale,yOffset:S,individualHeight:O,stackIndex:o.value.stacked?n:null});return{...e,coordinatesLine:pe,min:s,max:b,localScale:k,localZero:le,localMin:Q,localYLabels:ye,yOffset:S,individualHeight:O}})),c=t.ref({start:0,end:f.value});function Pe(){Ie()}const oe=t.ref(null);async function Ie(){(l.value.style.chart.zoom.startIndex!==null||l.value.style.chart.zoom.endIndex!==null)&&oe.value?(l.value.style.chart.zoom.startIndex!==null&&(await t.nextTick(),await t.nextTick(),oe.value&&oe.value.setStartValue(l.value.style.chart.zoom.startIndex)),l.value.style.chart.zoom.endIndex!==null&&(await t.nextTick(),await t.nextTick(),oe.value&&oe.value.setEndValue(Ge(l.value.style.chart.zoom.endIndex+1)))):(c.value={start:0,end:f.value},re.value+=1)}function Ge(e){const n=f.value;return e>n?n:e<0||l.value.style.chart.zoom.startIndex!==null&&e<l.value.style.chart.zoom.startIndex?l.value.style.chart.zoom.startIndex!==null?l.value.style.chart.zoom.startIndex+1:1:e}const Ze=t.computed(()=>g.value.filter(e=>["line","plot",void 0].includes(e.type))),I=t.computed(()=>g.value.filter(e=>e.type==="bar"));function je(){if(!F.value)return;const e=D.value.offsetWidth,n=D.value.offsetHeight;F.value.width=e*P.value*2,F.value.height=n*P.value*2,m.value=e*P.value*2,w.value=n*P.value*2,y.value.scale(P.value,P.value),he()}function Ke(){if(y.value.clearRect(0,0,1e4,1e4),y.value.fillStyle=l.value.style.chart.backgroundColor,y.value.fillRect(0,0,a.value.canvasWidth,a.value.canvasHeight),o.value.stacked)l.value.style.chart.grid.y.verticalLines.show&&c.value.end-c.value.start<l.value.style.chart.grid.y.verticalLines.hideUnderXLength?g.value.forEach(e=>{for(let n=0;n<c.value.end-c.value.start+1;n+=1)x.line(y.value,[{x:a.value.left+a.value.slot*n,y:a.value.bottom-e.yOffset-e.individualHeight},{x:a.value.left+a.value.slot*n,y:a.value.bottom-e.yOffset}],{color:l.value.style.chart.grid.y.verticalLines.color})}):l.value.style.chart.grid.y.verticalLines.show&&c.value.end-c.value.start>=l.value.style.chart.grid.y.verticalLines.hideUnderXLength&&g.value.forEach(e=>{for(let n=c.value.start;n<c.value.end;n+=1)n%Math.floor((c.value.end-c.value.start)/l.value.style.chart.grid.y.timeLabels.modulo)===0&&x.line(y.value,[{x:a.value.left+a.value.slot*(n-c.value.start)+a.value.slot/2,y:a.value.bottom-e.yOffset-e.individualHeight},{x:a.value.left+a.value.slot*(n-c.value.start)+a.value.slot/2,y:a.value.bottom-e.yOffset}],{color:l.value.style.chart.grid.y.verticalLines.color})}),l.value.style.chart.grid.x.horizontalLines.show&&(l.value.style.chart.grid.x.horizontalLines.alternate?g.value.forEach(e=>{e.localYLabels.forEach((n,s)=>{s<e.localYLabels.length-1&&x.rect(y.value,[{x:a.value.left,y:n.y},{x:a.value.right,y:n.y},{x:a.value.right,y:e.localYLabels[s+1].y},{x:a.value.left,y:e.localYLabels[s+1].y}],{fillColor:s%2===0?"transparent":d.setOpacity(l.value.style.chart.grid.x.horizontalLines.color,l.value.style.chart.grid.x.horizontalLines.opacity),strokeColor:"transparent"})})}):g.value.forEach(e=>{e.localYLabels.slice(c.value.start,c.value.end).forEach(n=>{x.line(y.value,[{x:a.value.left,y:n.y},{x:a.value.right,y:n.y}],{color:l.value.style.chart.grid.x.horizontalLines.color})})})),l.value.style.chart.grid.zeroLine.show&&g.value.forEach(e=>{x.line(y.value,[{x:a.value.left,y:e.localZero},{x:a.value.right,y:e.localZero}],{color:l.value.style.chart.grid.zeroLine.color,lineDash:l.value.style.chart.grid.zeroLine.dashed?[10,10]:[0,0]})}),l.value.style.chart.grid.y.axisLabels.show&&g.value.forEach(e=>{x.line(y.value,[{x:a.value.left,y:a.value.bottom-e.yOffset},{x:a.value.left,y:a.value.bottom-e.yOffset-e.individualHeight}],{color:e.color}),x.line(y.value,[{x:a.value.right,y:a.value.bottom-e.yOffset},{x:a.value.right,y:a.value.bottom-e.yOffset-e.individualHeight}],{color:e.color})}),g.value.forEach(e=>{x.text(y.value,e.name,m.value/35,a.value.bottom-e.yOffset-e.individualHeight/2,{align:"center",rotation:-90,color:e.color,font:`${Math.round(m.value/40*l.value.style.chart.grid.y.axisLabels.fontSizeRatio)}px ${l.value.style.fontFamily}`})});else{if(l.value.style.chart.grid.y.verticalLines.show&&c.value.end-c.value.start<l.value.style.chart.grid.y.verticalLines.hideUnderXLength)for(let e=0;e<c.value.end-c.value.start+1;e+=1)x.line(y.value,[{x:a.value.left+a.value.slot*e,y:a.value.top},{x:a.value.left+a.value.slot*e,y:a.value.bottom}],{color:l.value.style.chart.grid.y.verticalLines.color});else if(l.value.style.chart.grid.y.verticalLines.show&&c.value.end-c.value.start>=l.value.style.chart.grid.y.verticalLines.hideUnderXLength)for(let e=c.value.start;e<c.value.end;e+=1)e%Math.floor((c.value.end-c.value.start)/l.value.style.chart.grid.y.timeLabels.modulo)===0&&x.line(y.value,[{x:a.value.left+a.value.slot*(e-c.value.start)+a.value.slot/2,y:a.value.top},{x:a.value.left+a.value.slot*(e-c.value.start)+a.value.slot/2,y:a.value.bottom}],{color:l.value.style.chart.grid.y.verticalLines.color});l.value.style.chart.grid.x.horizontalLines.show&&(l.value.style.chart.grid.x.horizontalLines.alternate?p.value.yLabels.forEach((e,n)=>{n<p.value.yLabels.length-1&&x.rect(y.value,[{x:a.value.left,y:e.y},{x:a.value.right,y:e.y},{x:a.value.right,y:p.value.yLabels[n+1].y},{x:a.value.left,y:p.value.yLabels[n+1].y}],{fillColor:n%2===0?"transparent":d.setOpacity(l.value.style.chart.grid.x.horizontalLines.color,l.value.style.chart.grid.x.horizontalLines.opacity),strokeColor:"transparent"})}):p.value.yLabels.forEach(e=>{x.line(y.value,[{x:a.value.left,y:e.y},{x:a.value.right,y:e.y}],{color:l.value.style.chart.grid.x.horizontalLines.color})})),l.value.style.chart.grid.y.showAxis&&x.line(y.value,[{x:a.value.left,y:a.value.top},{x:a.value.left,y:a.value.bottom}],{color:l.value.style.chart.grid.y.axisColor,lineWidth:l.value.style.chart.grid.y.axisThickness}),l.value.style.chart.grid.x.showAxis&&x.line(y.value,[{x:a.value.left,y:a.value.bottom},{x:a.value.right,y:a.value.bottom}],{color:l.value.style.chart.grid.x.axisColor,lineWidth:l.value.style.chart.grid.x.axisThickness}),l.value.style.chart.grid.zeroLine.show&&x.line(y.value,[{x:a.value.left,y:p.value.zero},{x:a.value.right,y:p.value.zero}],{color:l.value.style.chart.grid.zeroLine.color,lineDash:l.value.style.chart.grid.zeroLine.dashed?[10,10]:[0,0]})}l.value.style.chart.grid.y.axisName&&x.text(y.value,l.value.style.chart.grid.y.axisName,m.value-m.value/40*l.value.style.chart.grid.y.axisLabels.fontSizeRatio*1.2,a.value.bottom-a.value.height/2,{font:`${l.value.style.chart.grid.y.axisLabels.bold?"bold ":""}${Math.round(m.value/40*l.value.style.chart.grid.y.axisLabels.fontSizeRatio)}px ${l.value.style.fontFamily}`,color:l.value.style.chart.color,align:"center",rotation:90}),l.value.style.chart.grid.x.axisName&&x.text(y.value,l.value.style.chart.grid.x.axisName,m.value/2,w.value,{font:`${l.value.style.chart.grid.y.axisLabels.bold?"bold ":""}${Math.round(m.value/40*l.value.style.chart.grid.y.axisLabels.fontSizeRatio)}px ${l.value.style.fontFamily}`,color:l.value.style.chart.color,align:"center"})}function _e(e){for(let n=0;n<e.coordinatesLine.length;n+=1){const s=(h.value===n?m.value/150:l.value.style.chart.line.plots.show?m.value/200:0)*l.value.style.chart.line.plots.radiusRatio;x.circle(y.value,{x:e.coordinatesLine[n].x,y:e.coordinatesLine[n].y},s,{color:l.value.style.chart.backgroundColor,fillStyle:e.color})}}function Qe(){g.value.forEach(e=>{e.showYMarker&&fe(e)&&x.text(y.value,d.applyDataLabel(l.value.style.chart.dataLabels.formatter,fe(e).value,d.dataLabel({p:e.prefix||l.value.style.chart.grid.y.axisLabels.prefix||"",v:fe(e).value,s:e.suffix||l.value.style.chart.grid.y.axisLabels.suffix||"",r:e.rounding||l.value.style.chart.grid.y.axisLabels.rounding||0}),{datapoint:fe(e),seriesIndex:null}),a.value.left-8+l.value.style.chart.grid.y.axisLabels.offsetX,fe(e).y,{align:"right",font:`${l.value.style.chart.grid.y.axisLabels.bold?"bold ":""}${Math.round(m.value/40*l.value.style.chart.grid.y.axisLabels.fontSizeRatio)}px ${l.value.style.fontFamily}`,color:e.color})})}function Je(){l.value.style.chart.grid.y.axisLabels.show&&(o.value.stacked?g.value.forEach(e=>{e.localYLabels.forEach((n,s)=>{x.text(y.value,d.applyDataLabel(l.value.style.chart.dataLabels.formatter,n.value,d.dataLabel({p:e.prefix||l.value.style.chart.grid.y.axisLabels.prefix||"",v:n.value,s:e.suffix||l.value.style.chart.grid.y.axisLabels.suffix||"",r:e.rounding||l.value.style.chart.grid.y.axisLabels.rounding||0}),{datapoint:n,seriesIndex:s}),n.x+l.value.style.chart.grid.y.axisLabels.offsetX,n.y,{align:"right",font:`${l.value.style.chart.grid.y.axisLabels.bold?"bold ":""}${Math.round(m.value/40*l.value.style.chart.grid.y.axisLabels.fontSizeRatio)}px ${l.value.style.fontFamily}`,color:e.color,globalAlpha:e.showYMarker&&![null,void 0].includes(h.value)?.2:1})})}):p.value.yLabels.forEach((e,n)=>{x.text(y.value,d.applyDataLabel(l.value.style.chart.dataLabels.formatter,e.value,d.dataLabel({p:l.value.style.chart.grid.y.axisLabels.prefix||"",v:e.value,s:l.value.style.chart.grid.y.axisLabels.suffix||"",r:l.value.style.chart.grid.y.axisLabels.rounding||0}),{datapoint:e,seriesIndex:n}),e.x+l.value.style.chart.grid.y.axisLabels.offsetX,e.y,{align:"right",font:`${l.value.style.chart.grid.y.axisLabels.bold?"bold ":""}${Math.round(m.value/40*l.value.style.chart.grid.y.axisLabels.fontSizeRatio)}px ${l.value.style.fontFamily}`,color:l.value.style.chart.grid.y.axisLabels.color,globalAlpha:g.value.some(s=>s.showYMarker)&&![null,void 0].includes(h.value)?.2:1})}))}function et(e){for(let n=0;n<e.coordinatesLine.length;n+=1)x.text(y.value,d.applyDataLabel(l.value.style.chart.dataLabels.formatter,e.coordinatesLine[n].value,d.dataLabel({p:e.prefix||"",v:e.coordinatesLine[n].value,s:e.suffix||"",r:e.rounding||0}),{datapoint:e.coordinatesLine[n],seriesIndex:n}),e.coordinatesLine[n].x,e.coordinatesLine[n].y+l.value.style.chart.dataLabels.offsetY,{align:"center",font:`${l.value.style.chart.dataLabels.bold?"bold ":""}${Math.round(m.value/40*l.value.style.chart.dataLabels.fontSizeRatio)}px ${l.value.style.fontFamily}`,color:l.value.style.chart.dataLabels.useSerieColor?e.color:l.value.style.chart.dataLabels.color})}function tt(){for(let e=c.value.start;e<c.value.end;e+=1)(c.value.end-c.value.start<l.value.style.chart.grid.y.timeLabels.modulo||c.value.end-c.value.start>=l.value.style.chart.grid.y.timeLabels.modulo&&(e%Math.floor((c.value.end-c.value.start)/l.value.style.chart.grid.y.timeLabels.modulo)===0||e===h.value+c.value.start&&l.value.style.chart.grid.y.timeLabels.showMarker))&&x.text(y.value,l.value.style.chart.grid.y.timeLabels.values[e]||e+1,a.value.left+a.value.slot*(e-c.value.start)+a.value.slot/2,a.value.bottom+m.value/l.value.style.chart.grid.y.timeLabels.offsetY,{align:l.value.style.chart.grid.y.timeLabels.rotation===0?"center":l.value.style.chart.grid.y.timeLabels.rotation>0?"left":"right",font:`${l.value.style.chart.grid.y.timeLabels.bold?"bold ":""}${Math.round(m.value/40*l.value.style.chart.grid.y.timeLabels.fontSizeRatio)}px ${l.value.style.fontFamily}`,color:l.value.style.chart.grid.y.timeLabels.showMarker?d.setOpacity(l.value.style.chart.grid.y.timeLabels.color,h.value!==null?h.value+c.value.start===e?100:20:100):l.value.style.chart.grid.y.timeLabels.color,rotation:l.value.style.chart.grid.y.timeLabels.rotation})}function Ae(){x.line(y.value,[{x:a.value.left+a.value.slot*h.value+a.value.slot/2,y:a.value.top},{x:a.value.left+a.value.slot*h.value+a.value.slot/2,y:a.value.bottom}],{color:l.value.style.chart.selector.color,lineDash:l.value.style.chart.selector.dashed?[8,8]:[0,0],lineWidth:2})}function lt(){N.value&&x.line(y.value,[{x:a.value.left,y:N.value},{x:a.value.right,y:N.value}],{color:l.value.style.chart.selector.color,lineDash:l.value.style.chart.selector.dashed?[8,8]:[0,0],lineWidth:2})}function at(){I.value.forEach((e,n)=>{for(let s=0;s<e.coordinatesLine.length;s+=1)x.rect(y.value,[{x:a.value.left+a.value.slot*s+a.value.slot/10+(o.value.stacked?0:a.value.slot/I.value.length*n-(n===0?0:a.value.slot/(5*I.value.length)*n)),y:o.value.stacked?e.localZero:p.value.zero},{x:a.value.left+a.value.slot*s+a.value.slot/10+(o.value.stacked?0:a.value.slot/I.value.length*n-(n===0?0:a.value.slot/(5*I.value.length)*n))+a.value.slot*.8/(o.value.stacked?1:I.value.length),y:o.value.stacked?e.localZero:p.value.zero},{x:a.value.left+a.value.slot*s+a.value.slot/10+(o.value.stacked?0:a.value.slot/I.value.length*n-(n===0?0:a.value.slot/(5*I.value.length)*n))+a.value.slot*.8/(o.value.stacked?1:I.value.length),y:e.coordinatesLine[s].y},{x:a.value.left+a.value.slot*s+a.value.slot/10+(o.value.stacked?0:a.value.slot/I.value.length*n-(n===0?0:a.value.slot/(5*I.value.length)*n)),y:e.coordinatesLine[s].y}],{strokeColor:l.value.style.chart.backgroundColor,gradient:{type:"linear",start:{x:e.coordinatesLine[s].x,y:e.coordinatesLine[s].y},end:{x:e.coordinatesLine[s].x,y:o.value.stacked?e.localZero:p.value.zero},stops:[{offset:0,color:e.color},{offset:1,color:l.value.style.chart.bar.gradient.show?d.lightenHexColor(e.color,.5):e.color}]}}),o.value.showDataLabels&&[!0,void 0].includes(e.dataLabels)&&x.text(y.value,d.applyDataLabel(l.value.style.chart.dataLabels.formatter,e.coordinatesLine[s].value,d.dataLabel({p:e.prefix||"",v:e.coordinatesLine[s].value,s:e.suffix||"",r:e.rounding||0}),{datapoint:e.coordinatesLine[s],seriesIndex:s}),a.value.left+a.value.slot*s+a.value.slot/10+(o.value.stacked?0:a.value.slot/I.value.length*n-(n===0?0:a.value.slot/(5*I.value.length)*n))+a.value.slot*.4/(o.value.stacked?1:I.value.length),(e.coordinatesLine[s].value<0?o.value.stacked?e.localZero:p.value.zero:e.coordinatesLine[s].y)+l.value.style.chart.dataLabels.offsetY,{align:"center",font:`${Math.round(m.value/40*l.value.style.chart.dataLabels.fontSizeRatio)}px ${l.value.style.fontFamily}`,color:l.value.style.chart.dataLabels.useSerieColor?e.color:l.value.style.chart.dataLabels.color,strokeColor:l.value.style.chart.backgroundColor,lineWidth:.8})})}function ot(e){e.useArea?o.value.stacked?x.polygon(y.value,[{x:e.coordinatesLine[0].x,y:e.localZero},...e.coordinatesLine,{x:e.coordinatesLine.at(-1).x,y:e.localZero}],{fillColor:d.setOpacity(e.color,l.value.style.chart.area.opacity),strokeColor:"transparent"}):x.polygon(y.value,[{x:e.coordinatesLine[0].x,y:p.value.zero},...e.coordinatesLine,{x:e.coordinatesLine.at(-1).x,y:p.value.zero}],{fillColor:d.setOpacity(e.color,l.value.style.chart.area.opacity),strokeColor:"transparent"}):x.line(y.value,e.coordinatesLine,{color:e.color,lineWidth:3})}function nt(){g.value.forEach((e,n)=>{x.line(y.value,[{x:a.value.left,y:a.value.bottom-e.yOffset},{x:a.value.right,y:a.value.bottom-e.yOffset}],{color:l.value.style.chart.grid.x.horizontalLines.color,lineWidth:1})})}function he(){Ke(),W.value?(h.value!==null&&l.value.style.chart.selector.show&&Ae(),at(),o.value.stacked&&l.value.style.chart.grid.x.showAxis&&nt(),Ze.value.forEach(e=>{(e.type==="line"||!e.type)&&ot(e),G.value&&(_e(e),o.value.showDataLabels&&[!0,void 0].includes(e.dataLabels)&&et(e))}),ne.value=x.cloneCanvas(F.value)):(ne.value&&(y.value.clearRect(0,0,1e4,1e4),y.value.drawImage(ne.value,0,0)),h.value!==null&&l.value.style.chart.selector.show&&Ae(),h.value!==null&&g.value.forEach(e=>{if(e.type==="line"||!e.type||e.type==="plot"){if(!e.coordinatesLine[h.value])return;e.coordinatesLine[h.value].x!==void 0&&e.coordinatesLine[h.value].y!==void 0&&x.circle(y.value,{x:e.coordinatesLine[h.value].x,y:e.coordinatesLine[h.value].y},m.value/150*l.value.style.chart.line.plots.radiusRatio,{color:l.value.style.chart.backgroundColor,fillStyle:e.color})}})),l.value.style.chart.grid.y.timeLabels.show&&tt(),l.value.style.chart.selector.show&&l.value.style.chart.selector.showHorizontalSelector&&lt(),Je(),Qe(),W.value=!1}const we=x.debounce(()=>{G.value=!0,je()},f.value>200?10:1,!G.value);function fe(e){if([null,void 0].includes(h.value)||!e.coordinatesLine[h.value])return!1;const{y:n,value:s}=e.coordinatesLine[h.value];return{y:n,value:s}}function rt(e){const{left:n,top:s}=F.value.getBoundingClientRect(),b=e.clientX-n;if(N.value=(e.clientY-s)*2,(N.value<a.value.top||N.value>a.value.bottom)&&(N.value=null),b*2<a.value.left||b*2>a.value.right){q.value=!1,h.value=null;return}const C=b*2-a.value.left;if(h.value=Math.floor(C/a.value.slot),q.value=!0,!G.value)return;let A="";const k=l.value.style.chart.tooltip.customFormat;d.isFunction(k)&&d.functionReturnsString(()=>k({seriesIndex:h.value,datapoint:g.value.map(S=>({shape:S.shape||null,name:S.name,color:S.color,type:S.type||"line",value:S.series.find((te,O)=>O===h.value)})),series:g.value,config:l.value}))?Y.value=k({seriesIndex:h.value,datapoint:g.value.map(S=>({shape:S.shape||null,name:S.name,color:S.color,type:S.type||"line",value:S.series.find((te,O)=>O===h.value)})),series:g.value,config:l.value}):(l.value.style.chart.grid.y.timeLabels.values.slice(c.value.start,c.value.end)[h.value]&&(A+=`<div style="padding-bottom: 6px; margin-bottom: 4px; border-bottom: 1px solid ${l.value.style.chart.tooltip.borderColor}; width:100%">${l.value.style.chart.grid.y.timeLabels.values.slice(c.value.start,c.value.end)[h.value]}</div>`),A+=M.value.join(""),Y.value=A),G.value=!1}t.watch(()=>h.value,e=>{we()}),t.watch(()=>c.value,e=>{W.value=!0,he()},{deep:!0}),t.watch(()=>o.value.showDataLabels,e=>{W.value=!0,he()}),t.watch(()=>N.value,e=>{e&&he()}),t.watch(()=>o.value.stacked,e=>{W.value=!0,G.value=!0,we()});function ut(){q.value=!1,h.value=null,Y.value="",N.value=null,he()}const Se=t.ref(null),ze=t.ref(null);t.onMounted(()=>{Me()});function Me(){if(d.objectIsEmpty(L.dataset)?d.error({componentName:"VueUiXyCanvas",type:"dataset"}):F.value&&(y.value=F.value.getContext("2d",{willReadFrequently:!0})),l.value.responsive){const e=x.throttle(()=>{const{width:n,height:s}=x.useResponsive({chart:K.value,title:l.value.style.chart.title.text?se.value:null,legend:l.value.style.chart.legend.show?ie.value:null,slicer:l.value.style.chart.zoom.show&&f.value>1?ce.value:null,source:H.value});requestAnimationFrame(()=>{Ce.value=`${n} / ${s}`})});Se.value=new ResizeObserver(e),Se.value.observe(K.value.parentNode)}ze.value=new ResizeObserver(e=>{for(const n of e)n.contentBoxSize&&D.value&&(W.value=!0,we())}),ze.value.observe(D.value),Ie()}t.onBeforeUnmount(()=>{ze.value&&ze.value.disconnect(),Se.value&&Se.value.disconnect()});function De(e){me("selectLegend",g.value.find(n=>n.absoluteIndex===e)),E.value.includes(e)?E.value=E.value.filter(n=>n!==e):E.value.push(e),W.value=!0,we()}const Re=t.computed(()=>$.value.map((e,n)=>({...e,name:e.name,color:d.convertColorToHex(e.color)||v.value[n]||d.palette[n]||d.palette[n%d.palette.length],shape:e.shape||"circle",prefix:e.prefix||"",suffix:e.suffix||"",rounding:e.rounding||0})).map(e=>({...e,opacity:E.value.includes(e.absoluteIndex)?.5:1,segregate:()=>De(e.absoluteIndex),isSegregated:E.value.includes(e.absoluteIndex)}))),st=t.computed(()=>({cy:"donut-div-legend",backgroundColor:l.value.style.chart.legend.backgroundColor,color:l.value.style.chart.legend.color,fontSize:l.value.style.chart.legend.fontSize,paddingBottom:12,fontWeight:l.value.style.chart.legend.bold?"bold":""})),$e=t.computed(()=>{const e=[""].concat(g.value.map(C=>C.name)).concat(' <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M18 16v2a1 1 0 0 1 -1 1h-11l6 -7l-6 -7h11a1 1 0 0 1 1 1v2" /></svg>');let n=[];for(let C=0;C<f.value;C+=1){const A=g.value.map(k=>k.series[C]??0).reduce((k,S)=>k+S,0);n.push([l.value.style.chart.grid.y.timeLabels.values.slice(c.value.start,c.value.end)[C]??C+1].concat(g.value.map(k=>(k.series[C]??0).toFixed(l.value.table.rounding))).concat((A??0).toFixed(l.value.table.rounding)))}const s={th:{backgroundColor:l.value.table.th.backgroundColor,color:l.value.table.th.color,outline:l.value.table.th.outline},td:{backgroundColor:l.value.table.td.backgroundColor,color:l.value.table.td.color,outline:l.value.table.td.outline},breakpoint:l.value.table.responsiveBreakpoint},b=[l.value.table.columnNames.period].concat(g.value.map(C=>C.name)).concat(l.value.table.columnNames.total);return{head:e,body:n.slice(0,c.value.end-c.value.start),config:s,colNames:b}}),Fe=t.computed(()=>{if(g.value.length===0)return{head:[],body:[],config:{},columnNames:[]};const e=g.value.map(s=>({label:s.name,color:s.color,type:s.type})),n=[];for(let s=c.value.start;s<c.value.end;s+=1){const b=[l.value.style.chart.grid.y.timeLabels.values[s]||s+1];g.value.forEach(C=>{b.push(Number((C.series[s]||0).toFixed(l.value.table.rounding)))}),n.push(b)}return{head:e,body:n}});function Oe(){const e=[[l.value.style.chart.title.text],[l.value.style.chart.title.subtitle.text],[""]],n=["",...Fe.value.head.map(A=>A.label)],s=Fe.value.body,b=e.concat([n]).concat(s),C=d.createCsvContent(b);d.downloadCsv({csvContent:C,title:l.value.style.chart.title.text||"vue-ui-xy-canvas"})}function it(){return g.value}function Ve(){o.value.showTable=!o.value.showTable}function Ye(){o.value.showDataLabels=!o.value.showDataLabels}function Xe(){o.value.stacked=!o.value.stacked}function He(){o.value.showTooltip=!o.value.showTooltip}const Te=t.ref(!1);function Ne(){Te.value=!Te.value}return Ee({getData:it,generateCsv:Oe,generatePdf:i,generateImage:r,toggleTable:Ve,toggleLabels:Ye,toggleStack:Xe,toggleTooltip:He,toggleAnnotator:Ne}),(e,n)=>(t.openBlock(),t.createElementBlock("div",{style:t.normalizeStyle(`width:100%; position:relative; ${l.value.responsive?"height: 100%":""}`),ref_key:"xy",ref:K,id:`xy_canvas_${V.value}`,class:t.normalizeClass(`vue-ui-donut ${J.value?"vue-data-ui-wrapper-fullscreen":""}`),onMouseenter:n[5]||(n[5]=()=>t.unref(xe)(!0)),onMouseleave:n[6]||(n[6]=()=>t.unref(xe)(!1))},[l.value.style.chart.title.text?(t.openBlock(),t.createElementBlock("div",{key:0,ref_key:"chartTitle",ref:se,style:t.normalizeStyle(`width:100%;background:${l.value.style.chart.backgroundColor};`)},[(t.openBlock(),t.createBlock(ht._sfc_main,{key:`title_${ee.value}`,config:{title:{cy:"xy-canvas-title",...l.value.style.chart.title},subtitle:{cy:"xy-canvas-subtitle",...l.value.style.chart.title.subtitle}}},null,8,["config"]))],4)):t.createCommentVNode("",!0),l.value.userOptions.show&&R.value&&(t.unref(ae)||t.unref(ve))?(t.openBlock(),t.createBlock(Ue.UserOptions,{ref:"details",key:`user_option_${ue.value}`,backgroundColor:l.value.style.chart.backgroundColor,color:l.value.style.chart.color,isPrinting:t.unref(Le),isImaging:t.unref(de),uid:V.value,hasTooltip:l.value.userOptions.buttons.tooltip&&l.value.style.chart.tooltip.show,hasPdf:l.value.userOptions.buttons.pdf,hasImg:l.value.userOptions.buttons.img,hasXls:l.value.userOptions.buttons.csv,hasLabel:l.value.userOptions.buttons.labels,hasStack:z.dataset.length>1&&l.value.userOptions.buttons.stack,hasFullscreen:l.value.userOptions.buttons.fullscreen,hasTable:c.value.end-c.value.start<200&&l.value.userOptions.buttons.table,isFullscreen:J.value,isTooltip:o.value.showTooltip,isStacked:o.value.stacked,titles:{...l.value.userOptions.buttonTitles},chartElement:K.value,position:l.value.userOptions.position,hasAnnotator:l.value.userOptions.buttons.annotator,isAnnotation:Te.value,onToggleFullscreen:u,onGeneratePdf:t.unref(i),onGenerateCsv:Oe,onGenerateImage:t.unref(r),onToggleTable:Ve,onToggleLabels:Ye,onToggleStack:Xe,onToggleTooltip:He,onToggleAnnotator:Ne,style:t.normalizeStyle({visibility:t.unref(ae)?t.unref(ve)?"visible":"hidden":"visible"})},t.createSlots({_:2},[e.$slots.menuIcon?{name:"menuIcon",fn:t.withCtx(({isOpen:s,color:b})=>[t.renderSlot(e.$slots,"menuIcon",t.normalizeProps(t.guardReactiveProps({isOpen:s,color:b})),void 0,!0)]),key:"0"}:void 0,e.$slots.optionTooltip?{name:"optionTooltip",fn:t.withCtx(()=>[t.renderSlot(e.$slots,"optionTooltip",{},void 0,!0)]),key:"1"}:void 0,e.$slots.optionPdf?{name:"optionPdf",fn:t.withCtx(()=>[t.renderSlot(e.$slots,"optionPdf",{},void 0,!0)]),key:"2"}:void 0,e.$slots.optionCsv?{name:"optionCsv",fn:t.withCtx(()=>[t.renderSlot(e.$slots,"optionCsv",{},void 0,!0)]),key:"3"}:void 0,e.$slots.optionImg?{name:"optionImg",fn:t.withCtx(()=>[t.renderSlot(e.$slots,"optionImg",{},void 0,!0)]),key:"4"}:void 0,e.$slots.optionTable?{name:"optionTable",fn:t.withCtx(()=>[t.renderSlot(e.$slots,"optionTable",{},void 0,!0)]),key:"5"}:void 0,e.$slots.optionLabels?{name:"optionLabels",fn:t.withCtx(()=>[t.renderSlot(e.$slots,"optionLabels",{},void 0,!0)]),key:"6"}:void 0,e.$slots.optionStack?{name:"optionStack",fn:t.withCtx(()=>[t.renderSlot(e.$slots,"optionStack",{},void 0,!0)]),key:"7"}:void 0,e.$slots.optionFullscreen?{name:"optionFullscreen",fn:t.withCtx(({toggleFullscreen:s,isFullscreen:b})=>[t.renderSlot(e.$slots,"optionFullscreen",t.normalizeProps(t.guardReactiveProps({toggleFullscreen:s,isFullscreen:b})),void 0,!0)]),key:"8"}:void 0,e.$slots.optionAnnotator?{name:"optionAnnotator",fn:t.withCtx(({toggleAnnotator:s,isAnnotator:b})=>[t.renderSlot(e.$slots,"optionAnnotator",t.normalizeProps(t.guardReactiveProps({toggleAnnotator:s,isAnnotator:b})),void 0,!0)]),key:"9"}:void 0]),1032,["backgroundColor","color","isPrinting","isImaging","uid","hasTooltip","hasPdf","hasImg","hasXls","hasLabel","hasStack","hasFullscreen","hasTable","isFullscreen","isTooltip","isStacked","titles","chartElement","position","hasAnnotator","isAnnotation","onGeneratePdf","onGenerateImage","style"])):t.createCommentVNode("",!0),t.createElementVNode("div",{class:"vue-ui-xy-canvas",style:t.normalizeStyle(`position: relative; aspect-ratio: ${Ce.value}`),ref_key:"container",ref:D},[R.value?(t.openBlock(),t.createElementBlock("canvas",{key:0,ref_key:"canvas",ref:F,style:{width:"100%",height:"100%"},onMousemove:n[0]||(n[0]=s=>rt(s)),onMouseleave:ut},null,544)):(t.openBlock(),t.createBlock(gt.default,{key:1,config:{type:"line",style:{backgroundColor:l.value.style.chart.backgroundColor,line:{axis:{color:"#CCCCCC"},path:{color:"#CCCCCC",strokeWidth:.5}}}}},null,8,["config"])),t.createVNode(vt._sfc_main,{show:o.value.showTooltip&&q.value,backgroundColor:l.value.style.chart.tooltip.backgroundColor,color:l.value.style.chart.tooltip.color,fontSize:l.value.style.chart.tooltip.fontSize,borderRadius:l.value.style.chart.tooltip.borderRadius,borderColor:l.value.style.chart.tooltip.borderColor,borderWidth:l.value.style.chart.tooltip.borderWidth,position:l.value.style.chart.tooltip.position,offsetY:l.value.style.chart.tooltip.offsetY,parent:t.unref(F),content:Y.value,isFullscreen:J.value,backgroundOpacity:l.value.style.chart.tooltip.backgroundOpacity,isCustom:t.unref(d.isFunction)(l.value.style.chart.tooltip.customFormat)},{"tooltip-before":t.withCtx(()=>[t.renderSlot(e.$slots,"tooltip-before",t.normalizeProps(t.guardReactiveProps({...X.value})),void 0,!0)]),"tooltip-after":t.withCtx(()=>[t.renderSlot(e.$slots,"tooltip-after",t.normalizeProps(t.guardReactiveProps({...X.value})),void 0,!0)]),_:3},8,["show","backgroundColor","color","fontSize","borderRadius","borderColor","borderWidth","position","offsetY","parent","content","isFullscreen","backgroundOpacity","isCustom"])],4),t.createElementVNode("div",{ref_key:"chartSlicer",ref:ce,style:t.normalizeStyle(`width:100%;background:${l.value.style.chart.backgroundColor}`),"data-dom-to-png-ignore":""},[l.value.style.chart.zoom.show&&f.value>1?(t.openBlock(),t.createBlock(ft.Slicer,{ref_key:"slicerComponent",ref:oe,key:`slicer_${re.value}`,background:l.value.style.chart.zoom.color,borderColor:l.value.style.chart.backgroundColor,fontSize:l.value.style.chart.zoom.fontSize,useResetSlot:l.value.style.chart.zoom.useResetSlot,labelLeft:l.value.style.chart.grid.y.timeLabels.values[c.value.start]?l.value.style.chart.grid.y.timeLabels.values[c.value.start]:"",labelRight:l.value.style.chart.grid.y.timeLabels.values[c.value.end-1]?l.value.style.chart.grid.y.timeLabels.values[c.value.end-1]:"",textColor:l.value.style.chart.color,inputColor:l.value.style.chart.zoom.color,selectColor:l.value.style.chart.zoom.highlightColor,max:f.value,min:0,valueStart:c.value.start,valueEnd:c.value.end,start:c.value.start,"onUpdate:start":n[1]||(n[1]=s=>c.value.start=s),end:c.value.end,"onUpdate:end":n[2]||(n[2]=s=>c.value.end=s),refreshStartPoint:l.value.style.chart.zoom.startIndex!==null?l.value.style.chart.zoom.startIndex:0,refreshEndPoint:l.value.style.chart.zoom.endIndex!==null?l.value.style.chart.zoom.endIndex+1:f.value,enableRangeHandles:l.value.style.chart.zoom.enableRangeHandles,enableSelectionDrag:l.value.style.chart.zoom.enableSelectionDrag,onReset:Pe},{"reset-action":t.withCtx(({reset:s})=>[t.renderSlot(e.$slots,"reset-action",t.normalizeProps(t.guardReactiveProps({reset:s})),void 0,!0)]),_:3},8,["background","borderColor","fontSize","useResetSlot","labelLeft","labelRight","textColor","inputColor","selectColor","max","valueStart","valueEnd","start","end","refreshStartPoint","refreshEndPoint","enableRangeHandles","enableSelectionDrag"])):t.createCommentVNode("",!0)],4),t.createElementVNode("div",{ref_key:"chartLegend",ref:ie},[l.value.style.chart.legend.show&&R.value?(t.openBlock(),t.createBlock(dt.Legend,{legendSet:Re.value,config:st.value,key:`legend_${Z.value}`,onClickMarker:n[3]||(n[3]=({i:s})=>De(s))},{item:t.withCtx(({legend:s,index:b})=>[t.createElementVNode("div",{onClick:C=>s.segregate(),style:t.normalizeStyle(`opacity:${E.value.includes(b)?.5:1}`)},t.toDisplayString(s.name),13,Nt)]),_:1},8,["legendSet","config"])):t.renderSlot(e.$slots,"legend",{key:1,legend:Re.value},void 0,!0)],512),e.$slots.watermark?(t.openBlock(),t.createElementBlock("div",Pt,[t.renderSlot(e.$slots,"watermark",t.normalizeProps(t.guardReactiveProps({isPrinting:t.unref(Le)||t.unref(de)})),void 0,!0)])):t.createCommentVNode("",!0),e.$slots.source?(t.openBlock(),t.createElementBlock("div",{key:3,ref_key:"source",ref:H,dir:"auto"},[t.renderSlot(e.$slots,"source",{},void 0,!0)],512)):t.createCommentVNode("",!0),c.value.end-c.value.start<200?(t.openBlock(),t.createBlock(yt.default,{key:4,hideDetails:"",config:{open:o.value.showTable,maxHeight:1e4,body:{backgroundColor:l.value.style.chart.backgroundColor,color:l.value.style.chart.color},head:{backgroundColor:l.value.style.chart.backgroundColor,color:l.value.style.chart.color}}},{content:t.withCtx(()=>[(t.openBlock(),t.createBlock(pt.DataTable,{key:`table_${_.value}`,colNames:$e.value.colNames,head:$e.value.head,body:$e.value.body,config:$e.value.config,title:`${l.value.style.chart.title.text}${l.value.style.chart.title.subtitle.text?` : ${l.value.style.chart.title.subtitle.text}`:""}`,onClose:n[4]||(n[4]=s=>o.value.showTable=!1)},{th:t.withCtx(({th:s})=>[t.createElementVNode("div",{innerHTML:s},null,8,It)]),td:t.withCtx(({td:s})=>[t.createTextVNode(t.toDisplayString(s),1)]),_:1},8,["colNames","head","body","config","title"]))]),_:1},8,["config"])):t.createCommentVNode("",!0),l.value.userOptions.buttons.annotator&&g.value.length?(t.openBlock(),t.createBlock(Bt,{key:5,parent:K.value,backgroundColor:l.value.style.chart.backgroundColor,color:l.value.style.chart.color,active:Te.value,onClose:Ne},null,8,["parent","backgroundColor","color","active"])):t.createCommentVNode("",!0)],46,Mt))}},Dt=We._export_sfc(At,[["__scopeId","data-v-b8851cb8"]]);exports.default=Dt;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "vue-data-ui",
   "private": false,
-  "version": "2.7.4",
+  "version": "2.7.5",
   "type": "module",
   "description": "A user-empowering data visualization Vue 3 components library for eloquent data storytelling",
   "keywords": [

package/dist/PenAndPaper-CAqWCUZx.cjs

@@ -1 +0,0 @@
-"use strict";const a=require("vue"),R=require("./BaseIcon-WIhlX3LN.cjs"),ae=require("./ColorPicker-mXlj2N11.cjs"),O=require("./index-MIJJ8liG.cjs"),oe={key:0,"data-dom-to-png-ignore":"",class:"vue-ui-pen-and-paper-actions"},re={class:"vue-ui-pen-and-paper-action",style:{padding:"0 !important"}},se=["disabled"],ue={__name:"PenAndPaper",props:{svgRef:{type:[Object,null],required:!0},color:{type:String,default:"#2D353C"},backgroundColor:{type:String,default:"#FFFFFF"},active:{type:Boolean,default:!1},scale:{type:Number,default:1}},emits:["close"],setup(d,{emit:j}){const s=d,J=j,x=a.ref([]),k=a.ref([]),C=a.ref(s.color),N=a.ref(2),$=a.ref(!1),V=a.ref(""),r=a.ref(null),h=a.ref(null),D=a.ref(null),A=a.ref("draw"),T=a.ref(!1),f=a.ref(null),z=a.ref({x:0,y:0}),B=a.ref([""]),L=a.ref({row:0,col:0}),E=a.ref(16),I=a.ref("url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAABg2lDQ1BJQ0MgcHJvZmlsZQAAKJF9kT1Iw0AcxV9TpSIVh2YQcchQnSyIijhKFYtgobQVWnUwufQLmjQkKS6OgmvBwY/FqoOLs64OroIg+AHi6OSk6CIl/i8ptIjx4Lgf7+497t4BQrPKNKtnAtB020wn4lIuvyqFXhGGiAhCiMnMMpKZxSx8x9c9Any9i/Es/3N/jgG1YDEgIBHPMcO0iTeIZzZtg/M+scjKskp8Tjxu0gWJH7muePzGueSywDNFM5ueJxaJpVIXK13MyqZGPE0cVTWd8oWcxyrnLc5atc7a9+QvDBf0lQzXaY4ggSUkkYIEBXVUUIWNGK06KRbStB/38Q+7/hS5FHJVwMixgBo0yK4f/A9+d2sVpya9pHAc6H1xnI9RILQLtBqO833sOK0TIPgMXOkdf60JzH6S3uho0SNgcBu4uO5oyh5wuQMMPRmyKbtSkKZQLALvZ/RNeSByC/Sveb2193H6AGSpq+Ub4OAQGCtR9rrPu/u6e/v3TLu/H5C7crM1WjgWAAAABmJLR0QAqwB5AHWF+8OUAAAACXBIWXMAAC4jAAAuIwF4pT92AAAAB3RJTUUH5gwUExIUagzGcQAAABl0RVh0Q29tbWVudABDcmVhdGVkIHdpdGggR0lNUFeBDhcAAABfSURBVBjTldAxDoNQDIPhL0+q1L33P1AvAhN7xfK6WAgoLfSfrNiykpQtE+7RLzx2vgF9D3o8lWDmn1QVVMP0LZQGmNtqp1/cmou0XHdG/+sYeGZwFBqPCub8rkcvvAGvsi1VYarR8wAAAABJRU5ErkJggg==') 5 5, auto");function K(l){if(!r.value||A.value!=="text"||T.value)return;const{x:e,y:n}=M(l);z.value={x:e,y:n},B.value=[""],L.value={row:0,col:0};const t=document.createElementNS("http://www.w3.org/2000/svg","text");t.setAttribute("x",e),t.setAttribute("y",n),t.setAttribute("fill",C.value),t.setAttribute("font-size",E.value*s.scale),t.setAttribute("font-family","sans-serif"),t.setAttribute("class","vue-data-ui-doodle"),t.setAttribute("dominant-baseline","hanging"),t.setAttribute("pointer-events","all");const o=document.createElementNS("http://www.w3.org/2000/svg","tspan");o.setAttribute("x",e),o.setAttribute("dy","0"),o.textContent="",t.appendChild(o),t.style.pointerEvents="none",r.value.appendChild(t),f.value=t,T.value=!0,window.addEventListener("keydown",U),window.addEventListener("mousedown",H,!0),q(),G()}function U(l){if(!T.value)return;let{row:e,col:n}=L.value,t=B.value.slice(),o=!1;if(l.key==="Enter"){const u=t[e],i=u.slice(0,n),v=u.slice(n);t.splice(e,1,i,v),e+=1,n=0,o=!0,l.preventDefault()}else if(l.key==="Backspace"){if(n>0)t[e]=t[e].slice(0,n-1)+t[e].slice(n),n-=1,o=!0;else if(e>0){const u=t[e-1].length;t[e-1]+=t[e],t.splice(e,1),e-=1,n=u,o=!0}l.preventDefault()}else if(l.key==="Delete")n<t[e].length?(t[e]=t[e].slice(0,n)+t[e].slice(n+1),o=!0):e<t.length-1&&(t[e]+=t[e+1],t.splice(e+1,1),o=!0),l.preventDefault();else if(l.key==="ArrowLeft")n>0?n-=1:e>0&&(e-=1,n=t[e].length),o=!0,l.preventDefault();else if(l.key==="ArrowRight")n<t[e].length?n+=1:e<t.length-1&&(e+=1,n=0),o=!0,l.preventDefault();else if(l.key==="ArrowUp")e>0&&(e-=1,n=Math.min(n,t[e].length),o=!0),l.preventDefault();else if(l.key==="ArrowDown")e<t.length-1&&(e+=1,n=Math.min(n,t[e].length),o=!0),l.preventDefault();else if(l.key.length===1&&!l.ctrlKey&&!l.metaKey&&!l.altKey)t[e]=t[e].slice(0,n)+l.key+t[e].slice(n),n+=1,o=!0,l.preventDefault();else if(l.key==="Escape"){X(!0);return}else l.key==="Tab"&&l.preventDefault();o&&(B.value=t,L.value={row:e,col:n},q(),G())}function q(){const l=f.value,{x:e}=z.value;for(;l.firstChild;)l.removeChild(l.firstChild);B.value.forEach((n,t)=>{const o=document.createElementNS("http://www.w3.org/2000/svg","tspan");o.setAttribute("x",e),o.setAttribute("dy",t===0?"0":`${E.value*1.2*s.scale}`),o.textContent=n.length?n:"​",l.appendChild(o)})}function G(){const l=r.value.querySelector(".vue-data-ui-svg-caret");l&&r.value.removeChild(l);const e=f.value;if(!e)return;const{x:n,y:t}=z.value,{row:o,col:u}=L.value,i=E.value*s.scale,v=e.childNodes[o];if(!v)return;let g=v.textContent.slice(0,u);g.endsWith(" ")&&(g+=" ");const c=document.createElementNS("http://www.w3.org/2000/svg","text");c.setAttribute("x",n),c.setAttribute("y",t),c.setAttribute("font-size",i),c.setAttribute("font-family","sans-serif"),c.textContent=g||"",r.value.appendChild(c);const p=c.getBBox();r.value.removeChild(c);let m=t+o*i*1.2,y=n+p.width;const w=document.createElementNS("http://www.w3.org/2000/svg","rect");w.setAttribute("x",y),w.setAttribute("y",m),w.setAttribute("width",2),w.setAttribute("height",i),w.setAttribute("fill",C.value),w.setAttribute("class","vue-data-ui-svg-caret"),r.value.appendChild(w)}function H(l){if(f.value&&!f.value.contains(l.target)){const e=f.value.children;e.length===1&&(e[0].textContent===""||e[0].textContent==="​")&&f.value.remove(),X(!1)}}function X(l=!1){var o;window.removeEventListener("keydown",U),window.removeEventListener("mousedown",H,!0);const e=r.value.querySelector(".vue-data-ui-svg-caret");e&&r.value.removeChild(e);const n=(o=f.value)==null?void 0:o.children;let t=!1;if(n&&n.length===1){const u=n[0].textContent;t=!u||u==="​"}l||t?f.value&&r.value.contains(f.value)&&r.value.removeChild(f.value):f.value&&r.value.contains(f.value)&&x.value.push(f.value),T.value=!1,f.value=null,B.value=[""],L.value={row:0,col:0}}const b=a.computed(()=>O.lightenHexColor(s.color,.6));function Y(){if(!r.value)return;const l=r.value.querySelector(".vue-data-ui-mask");if(l&&r.value.removeChild(l),s.active){const e=document.createElementNS("http://www.w3.org/2000/svg","rect");e.setAttribute("class","vue-data-ui-mask"),e.setAttribute("width","100%"),e.setAttribute("height","100%"),e.setAttribute("fill","transparent"),e.setAttribute("pointer-events","all"),r.value.insertBefore(e,r.value.firstChild)}}function M(l){var o;const e=s.svgRef;if(!e)return{x:0,y:0};const n=e.createSVGPoint();n.x=l.clientX,n.y=l.clientY;const t=(o=e.getScreenCTM())==null?void 0:o.inverse();return t?n.matrixTransform(t):{x:0,y:0}}function Z(l){const e=l.trim().split(/\s+/);if(e.length<4)return l;const n=e.slice(1).map(Number);if(n.length%2!==0)return l;const t=_(n),o=[`M ${t[0]} ${t[1]}`];for(let v=2;v<t.length-2;v+=2){const g=t[v-2],c=t[v-1],p=t[v],m=t[v+1],y=(g+p)/2,w=(c+m)/2;o.push(`Q ${g} ${c} ${y} ${w}`)}const u=t[t.length-2],i=t[t.length-1];return o.push(`L ${u} ${i}`),o.join(" ")}function _(l,e=1){const n=[...l];for(let t=2;t<l.length-2;t+=2){const o=l[t],u=l[t+1],i=l[t-2],v=l[t-1],g=l[t+2],c=l[t+3];n[t]=o+e*((i+g)/2-o),n[t+1]=u+e*((v+c)/2-u)}return n}function ee(l){const e=l.trim().split(/\s+/);let n="",t="",o=null,u=null;for(let i=0;i<e.length;i+=1){const v=e[i];if(isNaN(v)){if(t=v,t==="M"||t==="L")o=parseFloat(e[++i]),u=parseFloat(e[++i]),n+=`${t}${o} ${u}`;else if(t==="Q"){const g=parseFloat(e[++i]),c=parseFloat(e[++i]),p=parseFloat(e[++i]),m=parseFloat(e[++i]);g===o&&c===u?n+=`t${p-o} ${m-u}`:n+=`q${g-o} ${c-u} ${p-o} ${m-u}`,o=p,u=m}}else{const g=parseFloat(v),c=parseFloat(e[++i]);if(t==="L"){const p=g-o,m=c-u;p===0?n+=`v${m}`:m===0?n+=`h${p}`:n+=`l${p} ${m}`,o=g,u=c}else if(t==="Q"){const p=g,m=c,y=parseFloat(e[++i]),w=parseFloat(e[++i]);p===o&&m===u?n+=`t${y-o} ${w-u}`:n+=`q${p-o} ${m-u} ${y-o} ${w-u}`,o=y,u=w}}}return n}function P(l){if(A.value!=="draw"||!s.active||!r.value)return;$.value=!0;const{x:e,y:n}=M(l);D.value={x:e,y:n},V.value=`M ${e} ${n}`,h.value=document.createElementNS("http://www.w3.org/2000/svg","path"),h.value.setAttribute("stroke",C.value),h.value.setAttribute("stroke-width",N.value*s.scale),h.value.setAttribute("fill","none"),h.value.setAttribute("stroke-linecap","round"),h.value.setAttribute("stroke-linejoin","round"),h.value.setAttribute("class","vue-data-ui-doodle"),r.value.appendChild(h.value)}function F(l){if(!$.value||!r.value||!h.value)return;const{x:e,y:n}=M(l);V.value+=` ${e} ${n}`,h.value.setAttribute("d",V.value)}function S(l){if($.value&&r.value&&h.value){const{x:e,y:n}=M(l);if(D.value&&D.value.x===e&&D.value.y===n){const t=document.createElementNS("http://www.w3.org/2000/svg","circle");t.setAttribute("cx",e),t.setAttribute("cy",n),t.setAttribute("r",N.value*s.scale/2),t.setAttribute("fill",C.value),t.setAttribute("class","vue-data-ui-doodle"),r.value.appendChild(t),x.value.push(t)}else{const t=h.value;t.setAttribute("d",ee(Z(V.value))),x.value.push(t)}k.value=[],h.value=""}$.value=!1}function te(){if(x.value.length>0){const l=x.value.pop();k.value.push(l),r.value&&r.value.removeChild(l)}}function ne(){if(k.value.length>0){const l=k.value.pop();x.value.push(l),r.value&&r.value.appendChild(l)}}function le(){r.value&&(r.value.innerHTML=""),x.value=[],k.value=[],Y()}a.watch(A,()=>{s.active&&(Q(),W(),A.value==="text"?r.value.style.cursor="text":r.value.style.cursor=I.value)});function W(){!s.svgRef||!s.active||(A.value==="draw"?(s.svgRef.addEventListener("mousedown",P),s.svgRef.addEventListener("mousemove",F),s.svgRef.addEventListener("mouseup",S),s.svgRef.addEventListener("mouseleave",S),s.svgRef.addEventListener("touchstart",P,{passive:!1}),s.svgRef.addEventListener("touchmove",F,{passive:!1}),s.svgRef.addEventListener("touchend",S)):A.value==="text"&&s.svgRef.addEventListener("mousedown",K),r.value&&(r.value.style.pointerEvents="auto"))}function Q(){s.svgRef&&(s.svgRef.removeEventListener("mousedown",P),s.svgRef.removeEventListener("mousemove",F),s.svgRef.removeEventListener("mouseup",S),s.svgRef.removeEventListener("mouseleave",S),s.svgRef.removeEventListener("touchstart",P),s.svgRef.removeEventListener("touchmove",F),s.svgRef.removeEventListener("touchend",S),s.svgRef.removeEventListener("mousedown",K),r.value&&(r.value.style.pointerEvents="none"))}return a.watch(()=>s.active,l=>{l?W():Q()}),a.watch(()=>s.active,()=>{a.nextTick(()=>{Y()})}),a.onMounted(()=>{a.nextTick(()=>{s.svgRef&&(r.value=document.createElementNS("http://www.w3.org/2000/svg","g"),r.value.setAttribute("class","vue-data-ui-doodles"),r.value.style.cursor=I.value,s.svgRef.appendChild(r.value),Q())})}),a.onBeforeUnmount(()=>{r.value&&s.svgRef&&(s.svgRef.removeChild(r.value),Q())}),(l,e)=>d.active?(a.openBlock(),a.createElementBlock("div",oe,[a.createElementVNode("button",{class:"vue-ui-pen-and-paper-action",onClick:e[0]||(e[0]=n=>J("close")),style:a.normalizeStyle({backgroundColor:d.backgroundColor,border:`1px solid ${b.value}`})},[a.createVNode(R.default,{name:"close",stroke:d.color},null,8,["stroke"])],4),a.createElementVNode("button",re,[a.createVNode(ae.ColorPicker,{value:C.value,"onUpdate:value":e[1]||(e[1]=n=>C.value=n),backgroundColor:d.backgroundColor,buttonBorderColor:b.value},null,8,["value","backgroundColor","buttonBorderColor"])]),a.createElementVNode("button",{class:a.normalizeClass(["vue-ui-pen-and-paper-action",{"vue-ui-pen-and-paper-action-active":A.value==="text"}]),onClick:e[2]||(e[2]=n=>A.value=A.value==="text"?"draw":"text"),style:a.normalizeStyle({backgroundColor:d.backgroundColor,border:`1px solid ${b.value}`})},[a.createVNode(R.default,{name:A.value==="draw"?"annotator":"text",stroke:d.color},null,8,["name","stroke"]),a.createElementVNode("div",{style:a.normalizeStyle({position:"absolute",bottom:"-20px",color:b.value,width:"100%",textAlign:"center",fontSize:"12px",fontVariantNumeric:"tabular-nums"})},a.toDisplayString(a.unref(O.dataLabel)({v:A.value==="draw"?N.value:E.value,s:"px",r:1})),5)],6),a.createElementVNode("button",{class:a.normalizeClass(["vue-ui-pen-and-paper-action",{"vue-ui-pen-and-paper-action-disabled":!x.value.length}]),disabled:!x.value.length,onClick:te,style:a.normalizeStyle({backgroundColor:d.backgroundColor,border:`1px solid ${b.value}`,marginTop:"20px"})},[a.createVNode(R.default,{name:"restart",stroke:d.color},null,8,["stroke"])],14,se),a.createElementVNode("button",{class:a.normalizeClass(["vue-ui-pen-and-paper-action",{"vue-ui-pen-and-paper-action-disabled":!k.value.length}]),onClick:ne,style:a.normalizeStyle({backgroundColor:d.backgroundColor,border:`1px solid ${b.value}`})},[a.createVNode(R.default,{name:"restart",stroke:d.color,style:{transform:"scaleX(-1)"}},null,8,["stroke"])],6),a.createElementVNode("button",{class:a.normalizeClass(["vue-ui-pen-and-paper-action",{"vue-ui-pen-and-paper-action-disabled":!x.value.length}]),onClick:le,style:a.normalizeStyle({backgroundColor:d.backgroundColor,border:`1px solid ${b.value}`})},[a.createVNode(R.default,{name:"trash",stroke:d.color},null,8,["stroke"])],6),A.value==="draw"?a.withDirectives((a.openBlock(),a.createElementBlock("input",{key:0,ref:"range",type:"range",class:"vertical-range",min:.5,max:12,step:.1,"onUpdate:modelValue":e[3]||(e[3]=n=>N.value=n),style:a.normalizeStyle({accentColor:d.color})},null,4)),[[a.vModelText,N.value]]):a.createCommentVNode("",!0),A.value==="text"?a.withDirectives((a.openBlock(),a.createElementBlock("input",{key:1,ref:"range",type:"range",class:"vertical-range",min:3,max:48,step:.1,"onUpdate:modelValue":e[4]||(e[4]=n=>E.value=n),style:a.normalizeStyle({accentColor:d.color})},null,4)),[[a.vModelText,E.value]]):a.createCommentVNode("",!0)])):a.createCommentVNode("",!0)}};exports._sfc_main=ue;