vue-data-ui 2.6.4 → 2.6.5

package/dist/vue-ui-sparkline-Bp7GMRrA.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),n=require("./index-DSGAenF3.cjs"),P=require("./useNestedProp-BdTohsDJ.cjs"),G=require("./vue-ui-skeleton-DvdPnQbR.cjs"),z=require("./useResponsive-YQYQrAZ_.cjs"),R=require("./PackageVersion-Dv25_ZxF.cjs"),H=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),U=["id"],X=["xmlns","viewBox"],Z=["width","height"],Y=["id"],J=["stop-color"],K=["stop-color"],Q=["id"],ee=["stop-color"],te=["stop-color"],le=["id"],ae=["stop-color"],oe=["stop-color"],ne={key:1},re=["d","fill"],ue=["d","fill"],se=["d","stroke","stroke-width"],ie=["d","stroke","stroke-width"],de=["x","y","width","height","fill","rx"],ce=["x1","x2","y1","y2","stroke","stroke-width","stroke-dasharray"],ve=["x1","x2","y1","y2","stroke","stroke-dasharray","stroke-width"],he=["cx","cy","r","fill","stroke","stroke-width"],ye=["x","y","font-size","font-weight","fill"],fe=["x","y","height","width","onMouseenter","onClick"],pe={__name:"vue-ui-sparkline",props:{config:{type:Object,default(){return{}}},dataset:{type:Array,default(){return[]}},showInfo:{type:Boolean,default:!0},selectedIndex:{type:Number,default:void 0},heightRatio:{type:Number,default:1},forcedPadding:{type:Number,default:30}},emits:["hoverIndex","selectDatapoint"],setup(p,{emit:A}){const{vue_ui_sparkline:D}=n.useConfig(),s=p,b=e.computed(()=>Array.isArray(s.dataset)&&s.dataset.length>0),v=e.ref(n.createUid()),x=e.ref(null),V=e.ref(null),C=e.ref(null),t=e.computed({get:()=>L(),set:l=>l});function L(){const l=P.useNestedProp({userConfig:s.config,defaultConfig:D});let o={};return l.theme?o={...P.useNestedProp({userConfig:n.themes.vue_ui_sparkline[l.theme]||s.config,defaultConfig:l})}:o=l,s.config&&n.hasDeepProperty(s.config,"style.scaleMin")?o.style.scaleMin=s.config.style.scaleMin:o.style.scaleMin=null,s.config&&n.hasDeepProperty(s.config,"style.scaleMax")?o.style.scaleMax=s.config.style.scaleMax:o.style.scaleMax=null,o}const _=e.computed(()=>n.largestTriangleThreeBucketsArrayObjects({data:s.dataset,threshold:t.value.downsample.threshold}));e.watch(()=>s.config,l=>{t.value=L(),$(),r.value.chartWidth=t.value.style.chartWidth},{deep:!0}),e.watch(()=>s.dataset,l=>{y.value=n.largestTriangleThreeBucketsArrayObjects({data:s.dataset.map(o=>({...o,value:[void 0].includes(o.value)?null:o.value})),threshold:t.value.downsample.threshold})},{deep:!0});const y=e.ref(O());function O(){return n.largestTriangleThreeBucketsArrayObjects({data:s.dataset.map(l=>t.value.style.animation.show&&s.dataset.length>1?{...l,value:null}:{...l,value:[void 0].includes(l.value)?null:l.value}),threshold:t.value.downsample.threshold})}const E=e.ref(null);e.onMounted(()=>{if($(),t.value.style.animation.show&&s.dataset.length>1){let a=function(){o<_.value.length?(y.value.push(_.value[o]),setTimeout(()=>{requestAnimationFrame(a)},l)):y.value=_.value,o+=1};y.value=[];const l=t.value.style.animation.animationFrames/s.dataset.length;let o=0;a()}});function $(){if(n.objectIsEmpty(s.dataset)?n.error({componentName:"VueUiSparkline",type:"dataset"}):s.dataset.forEach((l,o)=>{n.getMissingDatasetAttributes({datasetObject:l,requiredAttributes:["period","value"]}).forEach(a=>{n.error({componentName:"VueUiSparkline",type:"datasetSerieAttribute",property:a,index:o})})}),t.value.responsive){const l=z.throttle(()=>{const{width:o,height:a}=z.useResponsive({chart:x.value,title:t.value.style.title.show&&s.showInfo?V.value:null,source:C.value});requestAnimationFrame(()=>{r.value.width=o,r.value.height=a,r.value.chartWidth=t.value.style.chartWidth/500*o,r.value.padding=s.forcedPadding/500*o})});E.value=new ResizeObserver(l),E.value.observe(x.value.parentNode)}}const r=e.ref({height:80*s.heightRatio,width:500,chartWidth:t.value.style.chartWidth,padding:s.forcedPadding}),w=A,u=e.computed(()=>{const{top:l,right:o,bottom:a,left:i}=t.value.style.padding;return{top:l,left:i,right:r.value.width-o,bottom:r.value.height-a,start:s.showInfo&&t.value.style.dataLabel.show&&t.value.style.dataLabel.position==="left"?r.value.width-r.value.chartWidth+i:r.value.padding+i,width:s.showInfo&&t.value.style.dataLabel.show?r.value.chartWidth-i-o:r.value.width-r.value.padding-i-o,height:r.value.height-l-a}}),N=e.computed(()=>[null,void 0].includes(t.value.style.scaleMin)?Math.min(...y.value.map(l=>isNaN(l.value)||[void 0,null,"NaN",NaN,1/0,-1/0].includes(l.value)?0:l.value||0)):t.value.style.scaleMin),T=e.computed(()=>[null,void 0].includes(t.value.style.scaleMax)?Math.max(...y.value.map(l=>isNaN(l.value)||[void 0,null,"NaN",NaN,1/0,-1/0].includes(l.value)?0:l.value||0)):t.value.style.scaleMax),g=e.computed(()=>{const l=N.value>=0?0:N.value;return Math.abs(l)}),M=e.computed(()=>T.value+g.value),m=e.computed(()=>u.value.bottom-u.value.height*B(g.value));function B(l){return isNaN(l/M.value)?0:l/M.value}const f=e.computed(()=>_.value.length-1),d=e.computed(()=>y.value.map((l,o)=>{const a=isNaN(l.value)||[void 0,null,"NaN",NaN,1/0,-1/0].includes(l.value)?0:l.value||0,i=u.value.width/(f.value+1)>r.padding?r.padding:u.value.width/(f.value+1);return{absoluteValue:a,period:l.period,plotValue:a+g.value,toMax:B(a+g.value),x:u.value.start+o*(i>u.value.width/12?u.value.width/12:i),y:u.value.bottom-u.value.height*B(a+g.value),id:`plot_${v.value}_${o}`,color:k.value?t.value.style.bar.color:t.value.style.area.useGradient?n.shiftHue(t.value.style.line.color,.05*(1-o/f.value)):t.value.style.line.color,width:i>u.value.width/12?u.value.width/12:i}})),W=e.computed(()=>{const l={x:d.value[0].x||0,y:(r.value.height||0)-6},o={x:d.value[d.value.length-1].x||0,y:(r.value.height||0)-6},a=[];return d.value.forEach(i=>{a.push(`${i.x||0},${i.y||0} `)}),[l.x,l.y,...a,o.x,o.y].toString()}),c=e.ref(void 0);function F(l,o){c.value=l,w("hoverIndex",{index:o})}function q(){c.value=void 0,w("hoverIndex",{index:void 0})}const h=e.computed(()=>{if(b.value){const l=d.value.map(a=>a.absoluteValue),o=l.reduce((a,i)=>a+i,0);return{latest:d.value[d.value.length-1].absoluteValue,sum:o,average:o/d.value.length,median:n.calcMedian(l),trend:n.calcLinearProgression(d.value.map(({x:a,y:i,absoluteValue:S})=>({x:a,y:i,value:S}))).trend}}else return{latest:null,sum:null,average:null,median:null,trend:null}}),I=e.computed(()=>b.value?t.value.style.dataLabel.valueType==="latest"?h.value.latest:t.value.style.dataLabel.valueType==="sum"?h.value.sum:t.value.style.dataLabel.valueType==="average"?h.value.average:0:0),k=e.computed(()=>t.value.type&&t.value.type==="bar");function j(l,o){w("selectDatapoint",{datapoint:l,index:o})}return(l,o)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"sparklineChart",ref:x,class:"vue-ui-sparkline",id:v.value,style:e.normalizeStyle(`width:100%;font-family:${t.value.style.fontFamily};`)},[e.renderSlot(l.$slots,"before",e.normalizeProps(e.guardReactiveProps({selected:c.value,latest:h.value.latest,sum:h.value.sum,average:h.value.average,median:h.value.median,trend:h.value.trend})),void 0,!0),t.value.style.title.show&&p.showInfo?(e.openBlock(),e.createElementBlock("div",{key:0,ref_key:"chartTitle",ref:V,class:"vue-ui-sparkline-title",style:e.normalizeStyle(`display:flex;align-items:center;width:100%;color:${t.value.style.title.color};background:${t.value.style.backgroundColor};justify-content:${t.value.style.title.textAlign==="left"?"flex-start":t.value.style.title.textAlign==="right"?"flex-end":"center"};height:${t.value.style.title.fontSize*2}px;font-size:${t.value.style.title.fontSize}px;font-weight:${t.value.style.title.bold?"bold":"normal"};`)},[e.createElementVNode("span",{style:e.normalizeStyle(`padding:${t.value.style.title.textAlign==="left"?"0 0 0 12px":t.value.style.title.textAlign==="right"?"0 12px 0 0":"0"}`)},e.toDisplayString(c.value?c.value.period:t.value.style.title.text),5)],4)):e.createCommentVNode("",!0),b.value?(e.openBlock(),e.createElementBlock("svg",{key:1,xmlns:e.unref(n.XMLNS),viewBox:`0 0 ${r.value.width} ${r.value.height}`,style:e.normalizeStyle(`background:${t.value.style.backgroundColor};overflow:visible`)},[e.createVNode(R._sfc_main),l.$slots["chart-background"]?(e.openBlock(),e.createElementBlock("foreignObject",{key:0,x:0,y:0,width:r.value.width<=0?10:r.value.width,height:r.value.height<=0?10:r.value.height,style:{pointerEvents:"none"}},[e.renderSlot(l.$slots,"chart-background",{},void 0,!0)],8,Z)):e.createCommentVNode("",!0),e.createElementVNode("defs",null,[e.createElementVNode("linearGradient",{x1:"0%",y1:"0%",x2:"100%",y2:"0%",id:`sparkline_gradient_${v.value}`},[e.createElementVNode("stop",{offset:"0%","stop-color":e.unref(n.setOpacity)(e.unref(n.shiftHue)(t.value.style.area.color,.05),t.value.style.area.opacity)},null,8,J),e.createElementVNode("stop",{offset:"100%","stop-color":e.unref(n.setOpacity)(t.value.style.area.color,t.value.style.area.opacity)},null,8,K)],8,Y),e.createElementVNode("linearGradient",{x2:"0%",y2:"100%",id:`sparkline_bar_gradient_pos_${v.value}`},[e.createElementVNode("stop",{offset:"0%","stop-color":t.value.style.bar.color},null,8,ee),e.createElementVNode("stop",{offset:"100%","stop-color":e.unref(n.shiftHue)(t.value.style.bar.color,.05)},null,8,te)],8,Q),e.createElementVNode("linearGradient",{x2:"0%",y2:"100%",id:`sparkline_bar_gradient_neg_${v.value}`},[e.createElementVNode("stop",{offset:"0%","stop-color":e.unref(n.shiftHue)(t.value.style.bar.color,.05)},null,8,ae),e.createElementVNode("stop",{offset:"100%","stop-color":t.value.style.bar.color},null,8,oe)],8,le)]),t.value.style.area.show&&!k.value&&d.value[0]?(e.openBlock(),e.createElementBlock("g",ne,[t.value.style.line.smooth?(e.openBlock(),e.createElementBlock("path",{key:0,d:`M ${d.value[0].x},${u.value.bottom} ${e.unref(n.createSmoothPath)(d.value)} L ${d.value.at(-1).x},${u.value.bottom} Z`,fill:t.value.style.area.useGradient?`url(#sparkline_gradient_${v.value})`:e.unref(n.setOpacity)(t.value.style.area.color,t.value.style.area.opacity)},null,8,re)):(e.openBlock(),e.createElementBlock("path",{key:1,d:`M${W.value}Z`,fill:t.value.style.area.useGradient?`url(#sparkline_gradient_${v.value})`:e.unref(n.setOpacity)(t.value.style.area.color,t.value.style.area.opacity)},null,8,ue))])):e.createCommentVNode("",!0),t.value.style.line.smooth&&!k.value?(e.openBlock(),e.createElementBlock("path",{key:2,d:`M ${e.unref(n.createSmoothPath)(d.value)}`,stroke:t.value.style.line.color,fill:"none","stroke-width":t.value.style.line.strokeWidth,"stroke-linecap":"round"},null,8,se)):e.createCommentVNode("",!0),!t.value.style.line.smooth&&!k.value?(e.openBlock(),e.createElementBlock("path",{key:3,d:`M ${e.unref(n.createStraightPath)(d.value)}`,stroke:t.value.style.line.color,fill:"none","stroke-width":t.value.style.line.strokeWidth,"stroke-linecap":"round"},null,8,ie)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(d.value,(a,i)=>(e.openBlock(),e.createElementBlock("g",null,[k.value?(e.openBlock(),e.createElementBlock("rect",{key:0,x:a.x-a.width/2,y:isNaN(a.absoluteValue>0?a.y:m.value)?0:a.absoluteValue>0?a.y:m.value,width:a.width,height:isNaN(Math.abs(a.y-m.value))?0:Math.abs(a.y-m.value),fill:a.absoluteValue>0?`url(#sparkline_bar_gradient_pos_${v.value})`:`url(#sparkline_bar_gradient_neg_${v.value})`,rx:t.value.style.bar.borderRadius},null,8,de)):e.createCommentVNode("",!0),t.value.style.verticalIndicator.show&&(c.value&&a.id===c.value.id||p.selectedIndex===i)?(e.openBlock(),e.createElementBlock("line",{key:1,x1:a.x,x2:a.x,y1:u.value.top-6,y2:u.value.bottom,stroke:t.value.style.verticalIndicator.color||a.color,"stroke-width":t.value.style.verticalIndicator.strokeWidth,"stroke-linecap":"round","stroke-dasharray":t.value.style.verticalIndicator.strokeDasharray||0},null,8,ce)):e.createCommentVNode("",!0)]))),256)),N.value<0?(e.openBlock(),e.createElementBlock("line",{key:4,x1:u.value.start,x2:u.value.start+u.value.width-16,y1:e.unref(n.forceValidValue)(m.value,u.value.bottom),y2:e.unref(n.forceValidValue)(m.value,u.value.bottom),stroke:t.value.style.zeroLine.color,"stroke-dasharray":t.value.style.zeroLine.strokeWidth*2,"stroke-width":t.value.style.zeroLine.strokeWidth,"stroke-linecap":"round"},null,8,ve)):e.createCommentVNode("",!0),t.value.style.plot.show?(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:5},e.renderList(d.value,(a,i)=>(e.openBlock(),e.createElementBlock("g",null,[c.value&&a.id===c.value.id||p.selectedIndex===i||p.dataset.length===1?(e.openBlock(),e.createElementBlock("circle",{key:0,cx:a.x,cy:a.y,r:t.value.style.plot.radius,fill:a.color,stroke:t.value.style.plot.stroke,"stroke-width":t.value.style.plot.strokeWidth},null,8,he)):e.createCommentVNode("",!0)]))),256)):e.createCommentVNode("",!0),p.showInfo&&t.value.style.dataLabel.show?(e.openBlock(),e.createElementBlock("text",{key:6,x:t.value.style.dataLabel.position==="left"?12+t.value.style.dataLabel.offsetX:u.value.width+12+t.value.style.dataLabel.offsetX,y:r.value.height/2+t.value.style.dataLabel.fontSize/2.5+t.value.style.dataLabel.offsetY,"font-size":t.value.style.dataLabel.fontSize,"font-weight":t.value.style.dataLabel.bold?"bold":"normal",fill:t.value.style.dataLabel.color},e.toDisplayString(c.value?e.unref(n.applyDataLabel)(t.value.style.dataLabel.formatter,c.value.absoluteValue,e.unref(n.dataLabel)({p:t.value.style.dataLabel.prefix,v:c.value.absoluteValue,s:t.value.style.dataLabel.suffix,r:t.value.style.dataLabel.roundingValue}),{datapoint:c.value}):e.unref(n.applyDataLabel)(t.value.style.dataLabel.formatter,I.value,e.unref(n.dataLabel)({p:t.value.style.dataLabel.prefix,v:I.value,s:t.value.style.dataLabel.suffix,r:t.value.style.dataLabel.roundingValue}))),9,ye)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(d.value,(a,i)=>(e.openBlock(),e.createElementBlock("rect",{x:a.x-(u.value.width/(f.value+1)>r.value.padding?r.value.padding:u.value.width/(f.value+1))/2,y:u.value.top-6,height:u.value.height+6,width:u.value.width/(f.value+1)>r.value.padding?r.value.padding:u.value.width/(f.value+1),fill:"transparent",onMouseenter:S=>F(a,i),onMouseleave:q,onClick:()=>j(a,i)},null,40,fe))),256)),e.renderSlot(l.$slots,"svg",{svg:r.value},void 0,!0)],12,X)):e.createCommentVNode("",!0),l.$slots.source?(e.openBlock(),e.createElementBlock("div",{key:2,ref_key:"source",ref:C,dir:"auto"},[e.renderSlot(l.$slots,"source",{},void 0,!0)],512)):e.createCommentVNode("",!0),b.value?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(G.default,{key:3,config:{type:"sparkline",style:{backgroundColor:t.value.style.backgroundColor,sparkline:{color:"#CCCCCC"}}}},null,8,["config"]))],12,U))}},me=H._export_sfc(pe,[["__scopeId","data-v-e25baba2"]]);exports.default=me;

package/dist/{vue-ui-sparkline-b9FXu2wY.js → vue-ui-sparkline-C2McLmh5.js}

@@ -1,11 +1,11 @@
-import { computed as c, ref as b, watch as U, onMounted as ie, createElementBlock as i, openBlock as r, normalizeStyle as C, renderSlot as M, createCommentVNode as h, createBlock as de, normalizeProps as ve, guardReactiveProps as ce, createElementVNode as f, toDisplayString as X, unref as v, createVNode as he, Fragment as D, renderList as P } from "vue";
-import { u as ye, c as fe, a as pe, C as q, a0 as T, o as ge, e as Z, g as me, w as I, a1 as be, a2 as ke, X as _e, s as V, S as H, a3 as Y, i as J, f as K } from "./index-y7ebFPbO.js";
-import { u as Q } from "./useNestedProp-BWzyGJZ8.js";
-import xe from "./vue-ui-skeleton-DOahsJXV.js";
-import { t as we, u as $e } from "./useResponsive-BWapHhVH.js";
-import { _ as Le } from "./PackageVersion-C5hOoj_p.js";
-import { _ as Ne } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const Ce = ["id"], Me = ["xmlns", "viewBox"], Ie = ["width", "height"], Ve = ["id"], Se = ["stop-color"], ze = ["stop-color"], Ae = ["id"], We = ["stop-color"], De = ["stop-color"], Pe = ["id"], Te = ["stop-color"], Fe = ["stop-color"], Oe = { key: 1 }, Be = ["d", "fill"], Ee = ["d", "fill"], Ge = ["d", "stroke", "stroke-width"], je = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Re = ["x", "y", "width", "height", "fill", "rx"], Ue = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], Xe = ["x1", "x2", "y1", "y2", "stroke", "stroke-dasharray", "stroke-width"], qe = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], Ze = ["x", "y", "font-size", "font-weight", "fill"], He = ["x", "y", "height", "width", "onMouseenter", "onClick"], Ye = {
+import { computed as c, ref as m, watch as X, onMounted as ie, createElementBlock as i, openBlock as r, normalizeStyle as M, renderSlot as C, createCommentVNode as h, createBlock as de, normalizeProps as ve, guardReactiveProps as ce, createElementVNode as f, toDisplayString as q, unref as v, createVNode as he, Fragment as D, renderList as P } from "vue";
+import { u as ye, c as fe, a as pe, C as Z, a0 as T, o as ge, e as H, g as me, w as I, a1 as be, a2 as ke, X as _e, s as V, S as Y, R as we, a3 as J, i as K, f as Q } from "./index-DLCyjPV0.js";
+import { u as ee } from "./useNestedProp-q86V3_LA.js";
+import xe from "./vue-ui-skeleton-D6ojufhb.js";
+import { t as $e, u as Ne } from "./useResponsive-BWapHhVH.js";
+import { _ as Le } from "./PackageVersion-PZr4BkQ5.js";
+import { _ as Me } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const Ce = ["id"], Ie = ["xmlns", "viewBox"], Ve = ["width", "height"], Se = ["id"], Ae = ["stop-color"], ze = ["stop-color"], We = ["id"], De = ["stop-color"], Pe = ["stop-color"], Te = ["id"], Fe = ["stop-color"], Oe = ["stop-color"], Be = { key: 1 }, Ee = ["d", "fill"], Ge = ["d", "fill"], Re = ["d", "stroke", "stroke-width"], je = ["d", "stroke", "stroke-width"], Ue = ["x", "y", "width", "height", "fill", "rx"], Xe = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], qe = ["x1", "x2", "y1", "y2", "stroke", "stroke-dasharray", "stroke-width"], Ze = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], He = ["x", "y", "font-size", "font-weight", "fill"], Ye = ["x", "y", "height", "width", "onMouseenter", "onClick"], Je = {
   __name: "vue-ui-sparkline",
   props: {
     config: {
@@ -38,43 +38,43 @@ const Ce = ["id"], Me = ["xmlns", "viewBox"], Ie = ["width", "height"], Ve = ["i
     }
   },
   emits: ["hoverIndex", "selectDatapoint"],
-  setup(_, { emit: ee }) {
-    const { vue_ui_sparkline: te } = ye(), u = _, $ = c(() => !!u.dataset && u.dataset.length), p = b(fe()), S = b(null), F = b(null), O = b(null), e = c({
+  setup(_, { emit: te }) {
+    const { vue_ui_sparkline: ae } = ye(), o = _, N = c(() => Array.isArray(o.dataset) && o.dataset.length > 0), p = m(fe()), S = m(null), F = m(null), O = m(null), e = c({
       get: () => B(),
       set: (t) => t
     });
     function B() {
-      const t = Q({
-        userConfig: u.config,
-        defaultConfig: te
+      const t = ee({
+        userConfig: o.config,
+        defaultConfig: ae
       });
       let l = {};
       return t.theme ? l = {
-        ...Q({
-          userConfig: pe.vue_ui_sparkline[t.theme] || u.config,
+        ...ee({
+          userConfig: pe.vue_ui_sparkline[t.theme] || o.config,
           defaultConfig: t
         })
-      } : l = t, u.config && q(u.config, "style.scaleMin") ? l.style.scaleMin = u.config.style.scaleMin : l.style.scaleMin = null, u.config && q(u.config, "style.scaleMax") ? l.style.scaleMax = u.config.style.scaleMax : l.style.scaleMax = null, l;
+      } : l = t, o.config && Z(o.config, "style.scaleMin") ? l.style.scaleMin = o.config.style.scaleMin : l.style.scaleMin = null, o.config && Z(o.config, "style.scaleMax") ? l.style.scaleMax = o.config.style.scaleMax : l.style.scaleMax = null, l;
     }
     const L = c(() => T({
-      data: u.dataset,
+      data: o.dataset,
       threshold: e.value.downsample.threshold
     }));
-    U(() => u.config, (t) => {
+    X(() => o.config, (t) => {
       e.value = B(), G(), s.value.chartWidth = e.value.style.chartWidth;
-    }, { deep: !0 }), U(() => u.dataset, (t) => {
-      k.value = T({
-        data: u.dataset.map((l) => ({
+    }, { deep: !0 }), X(() => o.dataset, (t) => {
+      b.value = T({
+        data: o.dataset.map((l) => ({
           ...l,
           value: [void 0].includes(l.value) ? null : l.value
         })),
         threshold: e.value.downsample.threshold
       });
     }, { deep: !0 });
-    const k = b(ae());
-    function ae() {
+    const b = m(le());
+    function le() {
       return T({
-        data: u.dataset.map((t) => e.value.style.animation.show ? {
+        data: o.dataset.map((t) => e.value.style.animation.show && o.dataset.length > 1 ? {
           ...t,
           value: null
         } : {
@@ -84,30 +84,30 @@ const Ce = ["id"], Me = ["xmlns", "viewBox"], Ie = ["width", "height"], Ve = ["i
         threshold: e.value.downsample.threshold
       });
     }
-    const E = b(null);
+    const E = m(null);
     ie(() => {
-      if (G(), e.value.style.animation.show && u.dataset.length > 1) {
+      if (G(), e.value.style.animation.show && o.dataset.length > 1) {
         let a = function() {
-          l < L.value.length ? (k.value.push(L.value[l]), setTimeout(() => {
+          l < L.value.length ? (b.value.push(L.value[l]), setTimeout(() => {
             requestAnimationFrame(a);
-          }, t)) : k.value = L.value, l += 1;
+          }, t)) : b.value = L.value, l += 1;
         };
-        k.value = [];
-        const t = e.value.style.animation.animationFrames / u.dataset.length;
+        b.value = [];
+        const t = e.value.style.animation.animationFrames / o.dataset.length;
         let l = 0;
         a();
       }
     });
     function G() {
-      if (ge(u.dataset) ? Z({
+      if (ge(o.dataset) ? H({
         componentName: "VueUiSparkline",
         type: "dataset"
-      }) : u.dataset.forEach((t, l) => {
+      }) : o.dataset.forEach((t, l) => {
         me({
           datasetObject: t,
           requiredAttributes: ["period", "value"]
         }).forEach((a) => {
-          Z({
+          H({
             componentName: "VueUiSparkline",
             type: "datasetSerieAttribute",
             property: a,
@@ -115,79 +115,79 @@ const Ce = ["id"], Me = ["xmlns", "viewBox"], Ie = ["width", "height"], Ve = ["i
           });
         });
       }), e.value.responsive) {
-        const t = we(() => {
-          const { width: l, height: a } = $e({
+        const t = $e(() => {
+          const { width: l, height: a } = Ne({
             chart: S.value,
-            title: e.value.style.title.show && u.showInfo ? F.value : null,
+            title: e.value.style.title.show && o.showInfo ? F.value : null,
             source: O.value
           });
           requestAnimationFrame(() => {
-            s.value.width = l, s.value.height = a, s.value.chartWidth = e.value.style.chartWidth / 500 * l, s.value.padding = u.forcedPadding / 500 * l;
+            s.value.width = l, s.value.height = a, s.value.chartWidth = e.value.style.chartWidth / 500 * l, s.value.padding = o.forcedPadding / 500 * l;
           });
         });
         E.value = new ResizeObserver(t), E.value.observe(S.value.parentNode);
       }
     }
-    const s = b({
-      height: 80 * u.heightRatio,
+    const s = m({
+      height: 80 * o.heightRatio,
       width: 500,
       chartWidth: e.value.style.chartWidth,
-      padding: u.forcedPadding
-    }), z = ee, o = c(() => {
+      padding: o.forcedPadding
+    }), A = te, u = c(() => {
       const { top: t, right: l, bottom: a, left: n } = e.value.style.padding;
       return {
         top: t,
         left: n,
         right: s.value.width - l,
         bottom: s.value.height - a,
-        start: u.showInfo && e.value.style.dataLabel.show && e.value.style.dataLabel.position === "left" ? s.value.width - s.value.chartWidth + n : s.value.padding + n,
-        width: u.showInfo && e.value.style.dataLabel.show ? s.value.chartWidth - n - l : s.value.width - s.value.padding - n - l,
+        start: o.showInfo && e.value.style.dataLabel.show && e.value.style.dataLabel.position === "left" ? s.value.width - s.value.chartWidth + n : s.value.padding + n,
+        width: o.showInfo && e.value.style.dataLabel.show ? s.value.chartWidth - n - l : s.value.width - s.value.padding - n - l,
         height: s.value.height - t - a
       };
-    }), A = c(() => [null, void 0].includes(e.value.style.scaleMin) ? Math.min(...k.value.map((t) => isNaN(t.value) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(t.value) ? 0 : t.value || 0)) : e.value.style.scaleMin), le = c(() => [null, void 0].includes(e.value.style.scaleMax) ? Math.max(...k.value.map((t) => isNaN(t.value) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(t.value) ? 0 : t.value || 0)) : e.value.style.scaleMax), x = c(() => {
-      const t = A.value >= 0 ? 0 : A.value;
+    }), z = c(() => [null, void 0].includes(e.value.style.scaleMin) ? Math.min(...b.value.map((t) => isNaN(t.value) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(t.value) ? 0 : t.value || 0)) : e.value.style.scaleMin), se = c(() => [null, void 0].includes(e.value.style.scaleMax) ? Math.max(...b.value.map((t) => isNaN(t.value) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(t.value) ? 0 : t.value || 0)) : e.value.style.scaleMax), x = c(() => {
+      const t = z.value >= 0 ? 0 : z.value;
       return Math.abs(t);
-    }), se = c(() => le.value + x.value), N = c(() => o.value.bottom - o.value.height * W(x.value));
+    }), R = c(() => se.value + x.value), w = c(() => u.value.bottom - u.value.height * W(x.value));
     function W(t) {
-      return t / se.value;
+      return isNaN(t / R.value) ? 0 : t / R.value;
     }
-    const g = c(() => L.value.length - 1), d = c(() => k.value.map((t, l) => {
-      const a = isNaN(t.value) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(t.value) ? 0 : t.value || 0;
+    const k = c(() => L.value.length - 1), d = c(() => b.value.map((t, l) => {
+      const a = isNaN(t.value) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(t.value) ? 0 : t.value || 0, n = u.value.width / (k.value + 1) > s.padding ? s.padding : u.value.width / (k.value + 1);
       return {
         absoluteValue: a,
         period: t.period,
         plotValue: a + x.value,
         toMax: W(a + x.value),
-        x: o.value.start + l * (o.value.width / (g.value + 1) > s.padding ? s.padding : o.value.width / (g.value + 1)),
-        y: o.value.bottom - o.value.height * W(a + x.value),
+        x: u.value.start + l * (n > u.value.width / 12 ? u.value.width / 12 : n),
+        y: u.value.bottom - u.value.height * W(a + x.value),
         id: `plot_${p.value}_${l}`,
-        color: w.value ? e.value.style.bar.color : e.value.style.area.useGradient ? I(e.value.style.line.color, 0.05 * (1 - l / g.value)) : e.value.style.line.color,
-        width: o.value.width / (g.value + 1) > s.padding ? s.padding : o.value.width / (g.value + 1)
+        color: $.value ? e.value.style.bar.color : e.value.style.area.useGradient ? I(e.value.style.line.color, 0.05 * (1 - l / k.value)) : e.value.style.line.color,
+        width: n > u.value.width / 12 ? u.value.width / 12 : n
       };
     })), ue = c(() => {
       const t = { x: d.value[0].x || 0, y: (s.value.height || 0) - 6 }, l = { x: d.value[d.value.length - 1].x || 0, y: (s.value.height || 0) - 6 }, a = [];
       return d.value.forEach((n) => {
         a.push(`${n.x || 0},${n.y || 0} `);
       }), [t.x, t.y, ...a, l.x, l.y].toString();
-    }), y = b(void 0);
+    }), y = m(void 0);
     function oe(t, l) {
-      y.value = t, z("hoverIndex", { index: l });
+      y.value = t, A("hoverIndex", { index: l });
     }
     function ne() {
-      y.value = void 0, z("hoverIndex", { index: void 0 });
+      y.value = void 0, A("hoverIndex", { index: void 0 });
     }
-    const m = c(() => {
-      if ($.value) {
+    const g = c(() => {
+      if (N.value) {
         const t = d.value.map((a) => a.absoluteValue), l = t.reduce((a, n) => a + n, 0);
         return {
           latest: d.value[d.value.length - 1].absoluteValue,
           sum: l,
           average: l / d.value.length,
           median: ke(t),
-          trend: be(d.value.map(({ x: a, y: n, absoluteValue: R }) => ({
+          trend: be(d.value.map(({ x: a, y: n, absoluteValue: U }) => ({
             x: a,
             y: n,
-            value: R
+            value: U
           }))).trend
         };
       } else
@@ -198,41 +198,41 @@ const Ce = ["id"], Me = ["xmlns", "viewBox"], Ie = ["width", "height"], Ve = ["i
           median: null,
           trend: null
         };
-    }), j = c(() => $.value ? e.value.style.dataLabel.valueType === "latest" ? m.value.latest : e.value.style.dataLabel.valueType === "sum" ? m.value.sum : e.value.style.dataLabel.valueType === "average" ? m.value.average : 0 : 0), w = c(() => e.value.type && e.value.type === "bar");
+    }), j = c(() => N.value ? e.value.style.dataLabel.valueType === "latest" ? g.value.latest : e.value.style.dataLabel.valueType === "sum" ? g.value.sum : e.value.style.dataLabel.valueType === "average" ? g.value.average : 0 : 0), $ = c(() => e.value.type && e.value.type === "bar");
     function re(t, l) {
-      z("selectDatapoint", { datapoint: t, index: l });
+      A("selectDatapoint", { datapoint: t, index: l });
     }
     return (t, l) => (r(), i("div", {
       ref_key: "sparklineChart",
       ref: S,
       class: "vue-ui-sparkline",
       id: p.value,
-      style: C(`width:100%;font-family:${e.value.style.fontFamily};`)
+      style: M(`width:100%;font-family:${e.value.style.fontFamily};`)
     }, [
-      M(t.$slots, "before", ve(ce({
+      C(t.$slots, "before", ve(ce({
         selected: y.value,
-        latest: m.value.latest,
-        sum: m.value.sum,
-        average: m.value.average,
-        median: m.value.median,
-        trend: m.value.trend
+        latest: g.value.latest,
+        sum: g.value.sum,
+        average: g.value.average,
+        median: g.value.median,
+        trend: g.value.trend
       })), void 0, !0),
       e.value.style.title.show && _.showInfo ? (r(), i("div", {
         key: 0,
         ref_key: "chartTitle",
         ref: F,
         class: "vue-ui-sparkline-title",
-        style: C(`display:flex;align-items:center;width:100%;color:${e.value.style.title.color};background:${e.value.style.backgroundColor};justify-content:${e.value.style.title.textAlign === "left" ? "flex-start" : e.value.style.title.textAlign === "right" ? "flex-end" : "center"};height:${e.value.style.title.fontSize * 2}px;font-size:${e.value.style.title.fontSize}px;font-weight:${e.value.style.title.bold ? "bold" : "normal"};`)
+        style: M(`display:flex;align-items:center;width:100%;color:${e.value.style.title.color};background:${e.value.style.backgroundColor};justify-content:${e.value.style.title.textAlign === "left" ? "flex-start" : e.value.style.title.textAlign === "right" ? "flex-end" : "center"};height:${e.value.style.title.fontSize * 2}px;font-size:${e.value.style.title.fontSize}px;font-weight:${e.value.style.title.bold ? "bold" : "normal"};`)
       }, [
         f("span", {
-          style: C(`padding:${e.value.style.title.textAlign === "left" ? "0 0 0 12px" : e.value.style.title.textAlign === "right" ? "0 12px 0 0" : "0"}`)
-        }, X(y.value ? y.value.period : e.value.style.title.text), 5)
+          style: M(`padding:${e.value.style.title.textAlign === "left" ? "0 0 0 12px" : e.value.style.title.textAlign === "right" ? "0 12px 0 0" : "0"}`)
+        }, q(y.value ? y.value.period : e.value.style.title.text), 5)
       ], 4)) : h("", !0),
-      $.value ? (r(), i("svg", {
+      N.value ? (r(), i("svg", {
         key: 1,
         xmlns: v(_e),
         viewBox: `0 0 ${s.value.width} ${s.value.height}`,
-        style: C(`background:${e.value.style.backgroundColor};overflow:visible`)
+        style: M(`background:${e.value.style.backgroundColor};overflow:visible`)
       }, [
         he(Le),
         t.$slots["chart-background"] ? (r(), i("foreignObject", {
@@ -245,8 +245,8 @@ const Ce = ["id"], Me = ["xmlns", "viewBox"], Ie = ["width", "height"], Ve = ["i
             pointerEvents: "none"
           }
         }, [
-          M(t.$slots, "chart-background", {}, void 0, !0)
-        ], 8, Ie)) : h("", !0),
+          C(t.$slots, "chart-background", {}, void 0, !0)
+        ], 8, Ve)) : h("", !0),
         f("defs", null, [
           f("linearGradient", {
             x1: "0%",
@@ -258,12 +258,12 @@ const Ce = ["id"], Me = ["xmlns", "viewBox"], Ie = ["width", "height"], Ve = ["i
             f("stop", {
               offset: "0%",
               "stop-color": v(V)(v(I)(e.value.style.area.color, 0.05), e.value.style.area.opacity)
-            }, null, 8, Se),
+            }, null, 8, Ae),
             f("stop", {
               offset: "100%",
               "stop-color": v(V)(e.value.style.area.color, e.value.style.area.opacity)
             }, null, 8, ze)
-          ], 8, Ve),
+          ], 8, Se),
           f("linearGradient", {
             x2: "0%",
             y2: "100%",
@@ -272,12 +272,12 @@ const Ce = ["id"], Me = ["xmlns", "viewBox"], Ie = ["width", "height"], Ve = ["i
             f("stop", {
               offset: "0%",
               "stop-color": e.value.style.bar.color
-            }, null, 8, We),
+            }, null, 8, De),
             f("stop", {
               offset: "100%",
               "stop-color": v(I)(e.value.style.bar.color, 0.05)
-            }, null, 8, De)
-          ], 8, Ae),
+            }, null, 8, Pe)
+          ], 8, We),
           f("linearGradient", {
             x2: "0%",
             y2: "100%",
@@ -286,79 +286,75 @@ const Ce = ["id"], Me = ["xmlns", "viewBox"], Ie = ["width", "height"], Ve = ["i
             f("stop", {
               offset: "0%",
               "stop-color": v(I)(e.value.style.bar.color, 0.05)
-            }, null, 8, Te),
+            }, null, 8, Fe),
             f("stop", {
               offset: "100%",
               "stop-color": e.value.style.bar.color
-            }, null, 8, Fe)
-          ], 8, Pe)
+            }, null, 8, Oe)
+          ], 8, Te)
         ]),
-        e.value.style.area.show && !w.value && d.value[0] ? (r(), i("g", Oe, [
+        e.value.style.area.show && !$.value && d.value[0] ? (r(), i("g", Be, [
           e.value.style.line.smooth ? (r(), i("path", {
             key: 0,
-            d: `M ${d.value[0].x},${o.value.bottom} ${v(H)(d.value)} L ${d.value.at(-1).x},${o.value.bottom} Z`,
+            d: `M ${d.value[0].x},${u.value.bottom} ${v(Y)(d.value)} L ${d.value.at(-1).x},${u.value.bottom} Z`,
             fill: e.value.style.area.useGradient ? `url(#sparkline_gradient_${p.value})` : v(V)(e.value.style.area.color, e.value.style.area.opacity)
-          }, null, 8, Be)) : (r(), i("path", {
+          }, null, 8, Ee)) : (r(), i("path", {
             key: 1,
             d: `M${ue.value}Z`,
             fill: e.value.style.area.useGradient ? `url(#sparkline_gradient_${p.value})` : v(V)(e.value.style.area.color, e.value.style.area.opacity)
-          }, null, 8, Ee))
+          }, null, 8, Ge))
         ])) : h("", !0),
-        e.value.style.line.smooth && !w.value ? (r(), i("path", {
+        e.value.style.line.smooth && !$.value ? (r(), i("path", {
           key: 2,
-          d: `M ${v(H)(d.value)}`,
+          d: `M ${v(Y)(d.value)}`,
           stroke: e.value.style.line.color,
           fill: "none",
           "stroke-width": e.value.style.line.strokeWidth,
           "stroke-linecap": "round"
-        }, null, 8, Ge)) : h("", !0),
+        }, null, 8, Re)) : h("", !0),
+        !e.value.style.line.smooth && !$.value ? (r(), i("path", {
+          key: 3,
+          d: `M ${v(we)(d.value)}`,
+          stroke: e.value.style.line.color,
+          fill: "none",
+          "stroke-width": e.value.style.line.strokeWidth,
+          "stroke-linecap": "round"
+        }, null, 8, je)) : h("", !0),
         (r(!0), i(D, null, P(d.value, (a, n) => (r(), i("g", null, [
-          n < d.value.length - 1 && !e.value.style.line.smooth && !w.value ? (r(), i("line", {
+          $.value ? (r(), i("rect", {
             key: 0,
-            x1: a.x,
-            x2: d.value[n + 1].x,
-            y1: a.y || 0,
-            y2: d.value[n + 1].y || 0,
-            stroke: a.color,
-            "stroke-width": e.value.style.line.strokeWidth,
-            "stroke-linecap": "round",
-            "stroke-linejoin": "round",
-            "shape-rendering": "geometricPrecision"
-          }, null, 8, je)) : h("", !0),
-          w.value ? (r(), i("rect", {
-            key: 1,
             x: a.x - a.width / 2,
-            y: a.absoluteValue > 0 ? a.y : N.value,
+            y: isNaN(a.absoluteValue > 0 ? a.y : w.value) ? 0 : a.absoluteValue > 0 ? a.y : w.value,
             width: a.width,
-            height: Math.abs(a.y - N.value),
+            height: isNaN(Math.abs(a.y - w.value)) ? 0 : Math.abs(a.y - w.value),
             fill: a.absoluteValue > 0 ? `url(#sparkline_bar_gradient_pos_${p.value})` : `url(#sparkline_bar_gradient_neg_${p.value})`,
             rx: e.value.style.bar.borderRadius
-          }, null, 8, Re)) : h("", !0),
+          }, null, 8, Ue)) : h("", !0),
           e.value.style.verticalIndicator.show && (y.value && a.id === y.value.id || _.selectedIndex === n) ? (r(), i("line", {
-            key: 2,
+            key: 1,
             x1: a.x,
             x2: a.x,
-            y1: o.value.top - 6,
-            y2: o.value.bottom,
+            y1: u.value.top - 6,
+            y2: u.value.bottom,
             stroke: e.value.style.verticalIndicator.color || a.color,
             "stroke-width": e.value.style.verticalIndicator.strokeWidth,
             "stroke-linecap": "round",
             "stroke-dasharray": e.value.style.verticalIndicator.strokeDasharray || 0
-          }, null, 8, Ue)) : h("", !0)
+          }, null, 8, Xe)) : h("", !0)
         ]))), 256)),
-        A.value < 0 ? (r(), i("line", {
-          key: 3,
-          x1: o.value.start,
-          x2: o.value.start + o.value.width - 16,
-          y1: v(Y)(N.value, o.value.bottom),
-          y2: v(Y)(N.value, o.value.bottom),
+        z.value < 0 ? (r(), i("line", {
+          key: 4,
+          x1: u.value.start,
+          x2: u.value.start + u.value.width - 16,
+          y1: v(J)(w.value, u.value.bottom),
+          y2: v(J)(w.value, u.value.bottom),
           stroke: e.value.style.zeroLine.color,
           "stroke-dasharray": e.value.style.zeroLine.strokeWidth * 2,
           "stroke-width": e.value.style.zeroLine.strokeWidth,
           "stroke-linecap": "round"
-        }, null, 8, Xe)) : h("", !0),
-        e.value.style.plot.show ? (r(!0), i(D, { key: 4 }, P(d.value, (a, n) => (r(), i("g", null, [
-          y.value && a.id === y.value.id || _.selectedIndex === n ? (r(), i("circle", {
+        }, null, 8, qe)) : h("", !0),
+        e.value.style.plot.show ? (r(!0), i(D, { key: 5 }, P(d.value, (a, n) => (r(), i("g", null, [
+          y.value && a.id === y.value.id || _.selectedIndex === n || _.dataset.length === 1 ? (r(), i("circle", {
             key: 0,
             cx: a.x,
             cy: a.y,
@@ -366,46 +362,46 @@ const Ce = ["id"], Me = ["xmlns", "viewBox"], Ie = ["width", "height"], Ve = ["i
             fill: a.color,
             stroke: e.value.style.plot.stroke,
             "stroke-width": e.value.style.plot.strokeWidth
-          }, null, 8, qe)) : h("", !0)
+          }, null, 8, Ze)) : h("", !0)
         ]))), 256)) : h("", !0),
         _.showInfo && e.value.style.dataLabel.show ? (r(), i("text", {
-          key: 5,
-          x: e.value.style.dataLabel.position === "left" ? 12 + e.value.style.dataLabel.offsetX : o.value.width + 12 + e.value.style.dataLabel.offsetX,
+          key: 6,
+          x: e.value.style.dataLabel.position === "left" ? 12 + e.value.style.dataLabel.offsetX : u.value.width + 12 + e.value.style.dataLabel.offsetX,
           y: s.value.height / 2 + e.value.style.dataLabel.fontSize / 2.5 + e.value.style.dataLabel.offsetY,
           "font-size": e.value.style.dataLabel.fontSize,
           "font-weight": e.value.style.dataLabel.bold ? "bold" : "normal",
           fill: e.value.style.dataLabel.color
-        }, X(y.value ? v(J)(
+        }, q(y.value ? v(K)(
           e.value.style.dataLabel.formatter,
           y.value.absoluteValue,
-          v(K)({ p: e.value.style.dataLabel.prefix, v: y.value.absoluteValue, s: e.value.style.dataLabel.suffix, r: e.value.style.dataLabel.roundingValue }),
+          v(Q)({ p: e.value.style.dataLabel.prefix, v: y.value.absoluteValue, s: e.value.style.dataLabel.suffix, r: e.value.style.dataLabel.roundingValue }),
           { datapoint: y.value }
-        ) : v(J)(
+        ) : v(K)(
           e.value.style.dataLabel.formatter,
           j.value,
-          v(K)({ p: e.value.style.dataLabel.prefix, v: j.value, s: e.value.style.dataLabel.suffix, r: e.value.style.dataLabel.roundingValue })
-        )), 9, Ze)) : h("", !0),
+          v(Q)({ p: e.value.style.dataLabel.prefix, v: j.value, s: e.value.style.dataLabel.suffix, r: e.value.style.dataLabel.roundingValue })
+        )), 9, He)) : h("", !0),
         (r(!0), i(D, null, P(d.value, (a, n) => (r(), i("rect", {
-          x: a.x - (o.value.width / (g.value + 1) > s.value.padding ? s.value.padding : o.value.width / (g.value + 1)) / 2,
-          y: o.value.top - 6,
-          height: o.value.height + 6,
-          width: o.value.width / (g.value + 1) > s.value.padding ? s.value.padding : o.value.width / (g.value + 1),
+          x: a.x - (u.value.width / (k.value + 1) > s.value.padding ? s.value.padding : u.value.width / (k.value + 1)) / 2,
+          y: u.value.top - 6,
+          height: u.value.height + 6,
+          width: u.value.width / (k.value + 1) > s.value.padding ? s.value.padding : u.value.width / (k.value + 1),
           fill: "transparent",
-          onMouseenter: (R) => oe(a, n),
+          onMouseenter: (U) => oe(a, n),
           onMouseleave: ne,
           onClick: () => re(a, n)
-        }, null, 40, He))), 256)),
-        M(t.$slots, "svg", { svg: s.value }, void 0, !0)
-      ], 12, Me)) : h("", !0),
+        }, null, 40, Ye))), 256)),
+        C(t.$slots, "svg", { svg: s.value }, void 0, !0)
+      ], 12, Ie)) : h("", !0),
       t.$slots.source ? (r(), i("div", {
         key: 2,
         ref_key: "source",
         ref: O,
         dir: "auto"
       }, [
-        M(t.$slots, "source", {}, void 0, !0)
+        C(t.$slots, "source", {}, void 0, !0)
       ], 512)) : h("", !0),
-      $.value ? h("", !0) : (r(), de(xe, {
+      N.value ? h("", !0) : (r(), de(xe, {
         key: 3,
         config: {
           type: "sparkline",
@@ -419,7 +415,7 @@ const Ce = ["id"], Me = ["xmlns", "viewBox"], Ie = ["width", "height"], Ve = ["i
       }, null, 8, ["config"]))
     ], 12, Ce));
   }
-}, st = /* @__PURE__ */ Ne(Ye, [["__scopeId", "data-v-db8c64e5"]]);
+}, ut = /* @__PURE__ */ Me(Je, [["__scopeId", "data-v-e25baba2"]]);
 export {
-  st as default
+  ut as default
 };

package/dist/{vue-ui-sparkstackbar-CQFec5Ni.js → vue-ui-sparkstackbar-Cu4aG9PB.js}

@@ -1,9 +1,9 @@
 import { useSlots as ue, onMounted as Y, computed as m, ref as d, watch as G, createElementBlock as r, openBlock as s, normalizeStyle as v, createCommentVNode as y, createBlock as ie, createVNode as q, createElementVNode as p, toDisplayString as w, unref as C, Fragment as x, renderList as $, normalizeClass as F, withCtx as H, renderSlot as U, normalizeProps as X, guardReactiveProps as J } from "vue";
-import { u as ce, c as K, t as de, p as i, a as ve, d as N, b as pe, o as ge, e as Q, g as fe, f as V, X as he, s as ye, w as me, i as Z, x as ke } from "./index-y7ebFPbO.js";
-import { u as ee } from "./useNestedProp-BWzyGJZ8.js";
-import be from "./vue-ui-skeleton-DOahsJXV.js";
-import { _ as _e } from "./PackageVersion-C5hOoj_p.js";
-import { _ as we } from "./Tooltip-C6qF6AOJ.js";
+import { u as ce, c as K, t as de, p as i, a as ve, d as N, b as pe, o as ge, e as Q, g as fe, f as V, X as he, s as ye, w as me, i as Z, x as ke } from "./index-DLCyjPV0.js";
+import { u as ee } from "./useNestedProp-q86V3_LA.js";
+import be from "./vue-ui-skeleton-D6ojufhb.js";
+import { _ as _e } from "./PackageVersion-PZr4BkQ5.js";
+import { _ as we } from "./Tooltip-C9lPh5bN.js";
 import { _ as Ce } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 const xe = ["xmlns", "viewBox"], $e = ["id"], Se = ["stop-color"], ze = ["stop-color"], Pe = ["stop-color"], De = {
   id: "stackPill",
@@ -184,10 +184,12 @@ const xe = ["xmlns", "viewBox"], $e = ["id"], Se = ["stop-color"], ze = ["stop-c
         style: v(`width:calc(100% - 12px);background:transparent;margin:0 auto;margin:${e.value.style.title.margin};padding: 0 6px;text-align:${e.value.style.title.textAlign}`)
       }, [
         p("div", {
+          class: "atom-title",
           style: v(`font-size:${e.value.style.title.fontSize}px;color:${e.value.style.title.color};font-weight:${e.value.style.title.bold ? "bold" : "normal"}`)
         }, w(e.value.style.title.text), 5),
         e.value.style.title.subtitle.text ? (s(), r("div", {
           key: 0,
+          class: "atom-subtitle",
           style: v(`font-size:${e.value.style.title.subtitle.fontSize}px;color:${e.value.style.title.subtitle.color};font-weight:${e.value.style.title.subtitle.bold ? "bold" : "normal"}`)
         }, w(e.value.style.title.subtitle.text), 5)) : y("", !0)
       ], 4)) : y("", !0),
@@ -373,7 +375,7 @@ const xe = ["xmlns", "viewBox"], $e = ["id"], Se = ["stop-color"], ze = ["stop-c
       ], 512)) : y("", !0)
     ], 4));
   }
-}, Xe = /* @__PURE__ */ Ce(Te, [["__scopeId", "data-v-c37627ff"]]);
+}, Xe = /* @__PURE__ */ Ce(Te, [["__scopeId", "data-v-17984a02"]]);
 export {
   Xe as default
 };