monobill-mintui 0.6.618 → 0.6.619

package/dist/components/chart/index.js

@@ -346,12 +346,14 @@ var t = class e extends HTMLElement {
 		let e = document.createElement("canvas").getContext("2d");
 		if (!e) return 60;
 		e.font = "12px system-ui, -apple-system, sans-serif";
-		let t = this._showLegend ? Math.max(this._legendHeight, 60) : 0, n = this._height - t, r = Math.floor(n / 35), i = Math.min(5, r), a = 0;
+		let t = this._showLegend ? Math.max(this._legendHeight, 60) : 0, n = this._height - t, r = Math.floor(n / 35), i = Math.max(1, Math.min(5, r)), a = this._getYRange();
+		if (this._hasOnlyZeroValues()) return Math.ceil(e.measureText(this._formatYAxisValue(0)).width) + 20;
+		let o = 0;
 		for (let t = 0; t <= i; t++) {
-			let n = this._getYRange(), r = n.max - (n.max - n.min) / i * t, o = this._formatYAxisValue(r), s = e.measureText(o);
-			a = Math.max(a, s.width);
+			let n = a.max - (a.max - a.min) / i * t, r = this._formatYAxisValue(n), s = e.measureText(r);
+			o = Math.max(o, s.width);
 		}
-		return Math.ceil(a) + 20;
+		return Math.ceil(o) + 20;
 	}
 	_getChartBounds() {
 		let e = this._calculateMaxYAxisLabelWidth(), t = `${this._width}-${this._height}-${this._showGrid}-${this._showLegend}-${this._legendHeight}-${e}-${this._rotatedLabelHeight}`;
@@ -386,6 +388,10 @@ var t = class e extends HTMLElement {
 			this._isDatasetVisible(t, n) && e.push(...t.data);
 		}), e;
 	}
+	_hasOnlyZeroValues() {
+		let e = this._getAllDataPoints();
+		return e.length > 0 && e.every((e) => e.y === 0);
+	}
 	_getXValues() {
 		if (!this._chartData) return [];
 		let e = JSON.stringify(this._chartData.labels) + JSON.stringify(this._chartData.datasets.map((e) => e.data.map((e) => e.x)));
@@ -754,7 +760,7 @@ var t = class e extends HTMLElement {
 	}
 	_scaleY(e, t) {
 		let n = this._getYRange();
-		if (n.max === n.min) return t.y + t.height / 2;
+		if (n.max === n.min) return n.min === 0 ? t.y + t.height : t.y + t.height / 2;
 		let r = (e - n.min) / (n.max - n.min);
 		return t.y + t.height - r * t.height;
 	}
@@ -801,116 +807,117 @@ var t = class e extends HTMLElement {
 		}
 	}
 	_renderGrid(e) {
-		if (!this._svg || !this._showGrid) return;
-		let t = document.createElementNS("http://www.w3.org/2000/svg", "g");
-		t.setAttribute("class", "chart-grid");
-		let n = this._getYRange(), r = Math.floor(e.height / 35), i = Math.min(5, r);
-		for (let r = 0; r <= i; r++) {
-			let a = e.y + e.height / i * r, o = document.createElementNS("http://www.w3.org/2000/svg", "line");
-			o.setAttribute("x1", e.x.toString()), o.setAttribute("y1", a.toString()), o.setAttribute("x2", (e.x + e.width).toString()), o.setAttribute("y2", a.toString()), o.setAttribute("stroke", "#e5e7eb"), o.setAttribute("stroke-width", "1"), o.setAttribute("stroke-dasharray", "2,2"), document.documentElement.classList.contains("dark") && o.setAttribute("stroke", "#374151"), t.appendChild(o);
-			let s = n.max - (n.max - n.min) / i * r, c = document.createElementNS("http://www.w3.org/2000/svg", "text"), l = a + 4;
-			r === 0 && (l = a + 12), c.setAttribute("x", "5"), c.setAttribute("y", l.toString()), c.setAttribute("text-anchor", "start"), c.setAttribute("fill", "#6b7280"), c.setAttribute("font-size", "12"), c.textContent = this._formatYAxisValue(s), document.documentElement.classList.contains("dark") && c.setAttribute("fill", "#9ca3af"), t.appendChild(c);
+		let t = this._chartType !== "pie" && this._hasOnlyZeroValues();
+		if (!this._svg || !this._showGrid && !t) return;
+		let n = document.createElementNS("http://www.w3.org/2000/svg", "g");
+		n.setAttribute("class", "chart-grid");
+		let r = this._getYRange(), i = Math.floor(e.height / 35), a = t ? 0 : Math.max(1, Math.min(5, i));
+		for (let i = 0; i <= a; i++) {
+			let o = t ? e.y + e.height : e.y + e.height / a * i, s = document.createElementNS("http://www.w3.org/2000/svg", "line");
+			if (s.setAttribute("x1", e.x.toString()), s.setAttribute("y1", o.toString()), s.setAttribute("x2", (e.x + e.width).toString()), s.setAttribute("y2", o.toString()), s.setAttribute("stroke", t ? "#9ca3af" : "#e5e7eb"), s.setAttribute("stroke-width", "1"), t || s.setAttribute("stroke-dasharray", "2,2"), document.documentElement.classList.contains("dark") && s.setAttribute("stroke", "#374151"), n.appendChild(s), t && !this._showGrid) continue;
+			let c = t ? 0 : r.max - (r.max - r.min) / a * i, l = document.createElementNS("http://www.w3.org/2000/svg", "text"), u = o + 4;
+			i === 0 && (u = o + 12), l.setAttribute("x", "5"), l.setAttribute("y", u.toString()), l.setAttribute("text-anchor", "start"), l.setAttribute("fill", "#6b7280"), l.setAttribute("font-size", "12"), l.textContent = this._formatYAxisValue(c), document.documentElement.classList.contains("dark") && l.setAttribute("fill", "#9ca3af"), n.appendChild(l);
 		}
-		let a = this._getXValues();
-		if (a.length === 0) {
-			this._svg.appendChild(t);
+		let o = this._getXValues();
+		if (o.length === 0) {
+			this._svg.appendChild(n);
 			return;
 		}
-		let o = this._chartType === "bar", s = [];
-		a.forEach((t) => {
-			let n = o ? this._scaleXForBarChart(t, e) : this._scaleX(t, e);
-			s.push(n);
+		let s = this._chartType === "bar", c = [];
+		o.forEach((t) => {
+			let n = s ? this._scaleXForBarChart(t, e) : this._scaleX(t, e);
+			c.push(n);
 		});
-		let c = document.createElement("canvas").getContext("2d"), l = !1, u = Array(a.length).fill(!0);
-		if (c && a.length > 1) {
-			c.font = "12px system-ui, -apple-system, sans-serif";
+		let l = document.createElement("canvas").getContext("2d"), u = !1, d = Array(o.length).fill(!0);
+		if (l && o.length > 1) {
+			l.font = "12px system-ui, -apple-system, sans-serif";
 			let e = [];
-			a.forEach((t) => {
-				let n = this._formatXAxisValue(t), r = c.measureText(n);
+			o.forEach((t) => {
+				let n = this._formatXAxisValue(t), r = l.measureText(n);
 				e.push(r.width);
 			});
 			let t = !0;
-			for (let n = 1; n < a.length; n++) {
-				let r = s[n] - s[n - 1], i = e[n - 1] / 2 + e[n] / 2 + 10;
+			for (let n = 1; n < o.length; n++) {
+				let r = c[n] - c[n - 1], i = e[n - 1] / 2 + e[n] / 2 + 10;
 				if (r < Math.max(i, 80)) {
 					t = !1;
 					break;
 				}
 			}
 			if (!t) {
-				l = !0;
+				u = !0;
 				let t = 12 * 1.2;
 				if (this._rotatedLabelHeight === 0) {
 					let n = (Math.max(...e) + t) * .707;
 					this._rotatedLabelHeight = Math.ceil(n) + 10;
 				}
 				let n = t * 1.5, r = !0;
-				for (let e = 1; e < a.length; e++) if (s[e] - s[e - 1] < n) {
+				for (let e = 1; e < o.length; e++) if (c[e] - c[e - 1] < n) {
 					r = !1;
 					break;
 				}
 				if (!r) {
 					let e = n;
-					u = Array(a.length).fill(!1);
+					d = Array(o.length).fill(!1);
 					let t = -Infinity;
-					a.length > 0 && (u[0] = !0, t = s[0]);
-					for (let n = 1; n < a.length - 1; n++) {
-						let r = s[n];
-						r - t >= e && (u[n] = !0, t = r);
+					o.length > 0 && (d[0] = !0, t = c[0]);
+					for (let n = 1; n < o.length - 1; n++) {
+						let r = c[n];
+						r - t >= e && (d[n] = !0, t = r);
 					}
-					if (a.length > 1) {
-						let n = s[a.length - 1];
-						if (n - t >= e) u[a.length - 1] = !0;
+					if (o.length > 1) {
+						let n = c[o.length - 1];
+						if (n - t >= e) d[o.length - 1] = !0;
 						else {
 							for (; n - t < e;) {
 								let e = !1;
-								for (let n = a.length - 2; n >= 0; n--) if (u[n]) {
-									if (u[n] = !1, n > 0) {
-										for (let r = n - 1; r >= 0; r--) if (u[r]) {
-											t = s[r], e = !0;
+								for (let n = o.length - 2; n >= 0; n--) if (d[n]) {
+									if (d[n] = !1, n > 0) {
+										for (let r = n - 1; r >= 0; r--) if (d[r]) {
+											t = c[r], e = !0;
 											break;
 										}
-										e || (t = s[0]);
-									} else t = s[0];
+										e || (t = c[0]);
+									} else t = c[0];
 									e = !0;
 									break;
 								}
 								if (!e) break;
 							}
-							n - t >= e && (u[a.length - 1] = !0);
+							n - t >= e && (d[o.length - 1] = !0);
 						}
 					}
 				}
 			}
-		} else u = Array(a.length).fill(!1), a.length > 0 && (u[0] = !0), a.length > 1 && (u[a.length - 1] = !0), this._rotatedLabelHeight = 0;
-		l || (this._rotatedLabelHeight = 0), a.forEach((n, r) => {
-			if (u[r]) {
-				let i = s[r], o = document.createElementNS("http://www.w3.org/2000/svg", "line");
-				o.setAttribute("x1", i.toString()), o.setAttribute("y1", e.y.toString()), o.setAttribute("x2", i.toString()), o.setAttribute("y2", (e.y + e.height).toString()), o.setAttribute("stroke", "#e5e7eb"), o.setAttribute("stroke-width", "1"), o.setAttribute("stroke-dasharray", "2,2"), document.documentElement.classList.contains("dark") && o.setAttribute("stroke", "#374151"), t.appendChild(o);
-				let c = document.createElementNS("http://www.w3.org/2000/svg", "text"), u = i, d = "middle";
-				if (!l) {
+		} else d = Array(o.length).fill(!1), o.length > 0 && (d[0] = !0), o.length > 1 && (d[o.length - 1] = !0), this._rotatedLabelHeight = 0;
+		u || (this._rotatedLabelHeight = 0), o.forEach((t, r) => {
+			if (d[r]) {
+				let i = c[r], a = document.createElementNS("http://www.w3.org/2000/svg", "line");
+				a.setAttribute("x1", i.toString()), a.setAttribute("y1", e.y.toString()), a.setAttribute("x2", i.toString()), a.setAttribute("y2", (e.y + e.height).toString()), a.setAttribute("stroke", "#e5e7eb"), a.setAttribute("stroke-width", "1"), a.setAttribute("stroke-dasharray", "2,2"), document.documentElement.classList.contains("dark") && a.setAttribute("stroke", "#374151"), n.appendChild(a);
+				let s = document.createElementNS("http://www.w3.org/2000/svg", "text"), l = i, d = "middle";
+				if (!u) {
 					if (r === 0) {
 						let t = e.x;
-						u = Math.max(i, t), d = "start";
-					} else if (r === a.length - 1) {
+						l = Math.max(i, t), d = "start";
+					} else if (r === o.length - 1) {
 						let t = e.x + e.width;
-						u = Math.min(i, t), d = "end";
+						l = Math.min(i, t), d = "end";
 					}
-				} else if (d = "end", r === a.length - 1) {
-					let t = document.createElement("canvas").getContext("2d");
-					if (t) {
-						t.font = "12px system-ui, -apple-system, sans-serif";
-						let r = this._formatXAxisValue(n), a = t.measureText(r).width * .707, o = e.x + e.width + 100;
-						u = Math.min(i, o - a);
+				} else if (d = "end", r === o.length - 1) {
+					let n = document.createElement("canvas").getContext("2d");
+					if (n) {
+						n.font = "12px system-ui, -apple-system, sans-serif";
+						let r = this._formatXAxisValue(t), a = n.measureText(r).width * .707, o = e.x + e.width + 100;
+						l = Math.min(i, o - a);
 					}
 				}
-				c.setAttribute("x", u.toString());
+				s.setAttribute("x", l.toString());
 				let f = (this._rotatedLabelHeight > 0 ? 30 : 20) + this._rotatedLabelHeight + 12, p = f;
 				this._showLegend && (p = f + 20 + Math.max(this._legendHeight, 60));
-				let m = (this._height - e.y - e.height) / p, h = (l ? 30 : 20) * m, g = e.y + e.height + h;
-				c.setAttribute("y", g.toString()), c.setAttribute("text-anchor", d), c.setAttribute("fill", "#6b7280"), c.setAttribute("font-size", "12"), l && c.setAttribute("transform", `rotate(-45 ${u} ${g})`), c.textContent = this._formatXAxisValue(n), document.documentElement.classList.contains("dark") && c.setAttribute("fill", "#9ca3af"), t.appendChild(c);
+				let m = (this._height - e.y - e.height) / p, h = (u ? 30 : 20) * m, g = e.y + e.height + h;
+				s.setAttribute("y", g.toString()), s.setAttribute("text-anchor", d), s.setAttribute("fill", "#6b7280"), s.setAttribute("font-size", "12"), u && s.setAttribute("transform", `rotate(-45 ${l} ${g})`), s.textContent = this._formatXAxisValue(t), document.documentElement.classList.contains("dark") && s.setAttribute("fill", "#9ca3af"), n.appendChild(s);
 			}
-		}), this._svg.appendChild(t);
+		}), this._svg.appendChild(n);
 	}
 	_buildMonotoneXLinePathD(e) {
 		let t = (e) => e < 0 ? -1 : 1, n = (e, n, r, i, a, o) => {
@@ -979,26 +986,26 @@ var t = class e extends HTMLElement {
 	}
 	_renderLineChart() {
 		if (!this._svg || !this._chartData) return;
-		let e = this._getChartBounds();
+		let e = this._getChartBounds(), t = this._hasOnlyZeroValues();
 		this._renderGrid(e);
-		let t = document.createElementNS("http://www.w3.org/2000/svg", "g");
-		t.setAttribute("class", "chart-data");
-		let n = document.createDocumentFragment();
-		this._chartData.datasets.forEach((t, r) => {
-			if (!this._isDatasetVisible(t, r)) return;
-			let i = this._getDatasetColor(t, r), a = document.createElementNS("http://www.w3.org/2000/svg", "path"), o = t.data.map((t) => ({
+		let n = document.createElementNS("http://www.w3.org/2000/svg", "g");
+		n.setAttribute("class", "chart-data");
+		let r = document.createDocumentFragment();
+		this._chartData.datasets.forEach((n, i) => {
+			if (!this._isDatasetVisible(n, i)) return;
+			let a = this._getDatasetColor(n, i), o = document.createElementNS("http://www.w3.org/2000/svg", "path"), s = n.data.map((t) => ({
 				x: this._scaleX(t.x, e),
 				y: this._scaleY(t.y, e)
 			}));
-			o.length !== 0 && (a.setAttribute("d", this._buildSmoothLinePathD(o)), a.setAttribute("fill", "none"), a.setAttribute("stroke", i), a.setAttribute("stroke-width", "2"), a.setAttribute("stroke-linecap", "round"), a.setAttribute("stroke-linejoin", "round"), n.appendChild(a), t.data.forEach((a) => {
-				let o = document.createElementNS("http://www.w3.org/2000/svg", "circle"), s = this._scaleX(a.x, e), c = this._scaleY(a.y, e);
-				o.setAttribute("cx", s.toString()), o.setAttribute("cy", c.toString()), o.setAttribute("r", "4"), o.setAttribute("fill", i);
+			s.length !== 0 && (t || (o.setAttribute("d", this._buildSmoothLinePathD(s)), o.setAttribute("fill", "none"), o.setAttribute("stroke", a), o.setAttribute("stroke-width", "2"), o.setAttribute("stroke-linecap", "round"), o.setAttribute("stroke-linejoin", "round"), r.appendChild(o)), n.data.forEach((t) => {
+				let o = document.createElementNS("http://www.w3.org/2000/svg", "circle"), s = this._scaleX(t.x, e), c = this._scaleY(t.y, e);
+				o.setAttribute("cx", s.toString()), o.setAttribute("cy", c.toString()), o.setAttribute("r", "4"), o.setAttribute("fill", a);
 				let l = document.documentElement.classList.contains("dark");
-				o.setAttribute("stroke", l ? "#1f2937" : "#fff"), o.setAttribute("stroke-width", "2"), o.setAttribute("class", "chart-point"), o.setAttribute("data-dataset", r.toString()), o.setAttribute("data-x", String(a.x)), o.setAttribute("data-y", a.y.toString()), o.setAttribute("data-name", t.name), o.style.opacity = "0", o.style.pointerEvents = "none";
-				let u = String(a.x);
-				this._plotPoints.has(u) || this._plotPoints.set(u, []), this._plotPoints.get(u).push(o), n.appendChild(o);
+				o.setAttribute("stroke", l ? "#1f2937" : "#fff"), o.setAttribute("stroke-width", "2"), o.setAttribute("class", "chart-point"), o.setAttribute("data-dataset", i.toString()), o.setAttribute("data-x", String(t.x)), o.setAttribute("data-y", t.y.toString()), o.setAttribute("data-name", n.name), o.style.opacity = "0", o.style.pointerEvents = "none";
+				let u = String(t.x);
+				this._plotPoints.has(u) || this._plotPoints.set(u, []), this._plotPoints.get(u).push(o), r.appendChild(o);
 			}));
-		}), t.appendChild(n), this._svg.appendChild(t);
+		}), n.appendChild(r), this._svg.appendChild(n);
 	}
 	_scaleXForBarChart(e, t) {
 		let n = this._getXValues();
@@ -1051,30 +1058,34 @@ var t = class e extends HTMLElement {
 	}
 	_renderAreaChart() {
 		if (!this._svg || !this._chartData) return;
-		let e = this._getChartBounds();
+		let e = this._getChartBounds(), t = this._hasOnlyZeroValues();
 		this._renderGrid(e);
-		let t = document.createElementNS("http://www.w3.org/2000/svg", "g");
-		t.setAttribute("class", "chart-data");
-		let n = document.createDocumentFragment();
-		this._chartData.datasets.forEach((t, r) => {
-			if (!this._isDatasetVisible(t, r)) return;
-			let i = this._getDatasetColor(t, r), a = t.data.map((t) => ({
+		let n = document.createElementNS("http://www.w3.org/2000/svg", "g");
+		n.setAttribute("class", "chart-data");
+		let r = document.createDocumentFragment();
+		this._chartData.datasets.forEach((n, i) => {
+			if (!this._isDatasetVisible(n, i)) return;
+			let a = this._getDatasetColor(n, i), o = n.data.map((t) => ({
 				x: this._scaleX(t.x, e),
 				y: this._scaleY(t.y, e)
 			}));
-			if (a.length === 0) return;
-			let o = e.y + e.height, s = document.createElementNS("http://www.w3.org/2000/svg", "path");
-			s.setAttribute("d", this._buildAreaFillPathD(a, o)), s.setAttribute("fill", i), s.setAttribute("fill-opacity", "0.3"), n.appendChild(s);
-			let c = document.createElementNS("http://www.w3.org/2000/svg", "path");
-			c.setAttribute("d", this._buildSmoothLinePathD(a)), c.setAttribute("fill", "none"), c.setAttribute("stroke", i), c.setAttribute("stroke-width", "2"), c.setAttribute("stroke-linecap", "round"), c.setAttribute("stroke-linejoin", "round"), n.appendChild(c), t.data.forEach((a) => {
-				let o = document.createElementNS("http://www.w3.org/2000/svg", "circle"), s = this._scaleX(a.x, e), c = this._scaleY(a.y, e);
-				o.setAttribute("cx", s.toString()), o.setAttribute("cy", c.toString()), o.setAttribute("r", "4"), o.setAttribute("fill", i);
-				let l = document.documentElement.classList.contains("dark");
-				o.setAttribute("stroke", l ? "#1f2937" : "#fff"), o.setAttribute("stroke-width", "2"), o.setAttribute("class", "chart-point"), o.setAttribute("data-dataset", r.toString()), o.setAttribute("data-x", String(a.x)), o.setAttribute("data-y", a.y.toString()), o.setAttribute("data-name", t.name), o.style.opacity = "0", o.style.pointerEvents = "none";
-				let u = String(a.x);
-				this._plotPoints.has(u) || this._plotPoints.set(u, []), this._plotPoints.get(u).push(o), n.appendChild(o);
-			});
-		}), t.appendChild(n), this._svg.appendChild(t);
+			if (o.length !== 0) {
+				if (!t) {
+					let t = e.y + e.height, n = document.createElementNS("http://www.w3.org/2000/svg", "path");
+					n.setAttribute("d", this._buildAreaFillPathD(o, t)), n.setAttribute("fill", a), n.setAttribute("fill-opacity", "0.3"), r.appendChild(n);
+					let i = document.createElementNS("http://www.w3.org/2000/svg", "path");
+					i.setAttribute("d", this._buildSmoothLinePathD(o)), i.setAttribute("fill", "none"), i.setAttribute("stroke", a), i.setAttribute("stroke-width", "2"), i.setAttribute("stroke-linecap", "round"), i.setAttribute("stroke-linejoin", "round"), r.appendChild(i);
+				}
+				n.data.forEach((t) => {
+					let o = document.createElementNS("http://www.w3.org/2000/svg", "circle"), s = this._scaleX(t.x, e), c = this._scaleY(t.y, e);
+					o.setAttribute("cx", s.toString()), o.setAttribute("cy", c.toString()), o.setAttribute("r", "4"), o.setAttribute("fill", a);
+					let l = document.documentElement.classList.contains("dark");
+					o.setAttribute("stroke", l ? "#1f2937" : "#fff"), o.setAttribute("stroke-width", "2"), o.setAttribute("class", "chart-point"), o.setAttribute("data-dataset", i.toString()), o.setAttribute("data-x", String(t.x)), o.setAttribute("data-y", t.y.toString()), o.setAttribute("data-name", n.name), o.style.opacity = "0", o.style.pointerEvents = "none";
+					let u = String(t.x);
+					this._plotPoints.has(u) || this._plotPoints.set(u, []), this._plotPoints.get(u).push(o), r.appendChild(o);
+				});
+			}
+		}), n.appendChild(r), this._svg.appendChild(n);
 	}
 	_renderPieChart() {
 		if (!this._svg || !this._chartData) return;