@webority/ui-elements 0.32.0 → 0.33.0

package/dist/ui-chart.js

@@ -32725,8 +32725,8 @@ function Mq(e, t, n, r) {
 var Nq = (e, t) => {
 	let n = e.filter((e) => e != null && Number.isFinite(e));
 	return [Math.min(...t ? [0, ...n] : n), Math.max(...t ? [0, ...n] : n)];
-}, Pq = 24, Fq = 4;
-function Iq(e) {
+}, Pq = 24, Fq = 4, Iq = .6, Lq = (e, t) => String(e).length * t * Iq;
+function Rq(e) {
 	let t = String(e ?? "").trim(), n = /^#([0-9a-f]{3}|[0-9a-f]{6})$/i.exec(t);
 	if (n) {
 		let e = n[1].length === 3 ? [...n[1]].map((e) => e + e).join("") : n[1];
@@ -32739,24 +32739,24 @@ function Iq(e) {
 	let r = /^rgba?\(\s*([\d.]+)[\s,]+([\d.]+)[\s,]+([\d.]+)/i.exec(t);
 	return r ? r.slice(1, 4).map(Number) : null;
 }
-function Lq(e, t) {
-	let n = Iq(e);
+function zq(e, t) {
+	let n = Rq(e);
 	return n ? `rgba(${n.join(",")},${t})` : String(e ?? "").trim();
 }
-function Rq(e, t, n) {
-	let r = Iq(e), i = Iq(t);
+function Bq(e, t, n) {
+	let r = Rq(e), i = Rq(t);
 	return r && i ? `rgb(${r.map((e, t) => Math.round(e + (i[t] - e) * n)).join(",")})` : e;
 }
-var zq = (e) => e.map((e) => e / 255).map((e) => e <= .03928 ? e / 12.92 : ((e + .055) / 1.055) ** 2.4).reduce((e, t, n) => e + t * [
+var Vq = (e) => e.map((e) => e / 255).map((e) => e <= .03928 ? e / 12.92 : ((e + .055) / 1.055) ** 2.4).reduce((e, t, n) => e + t * [
 	.2126,
 	.7152,
 	.0722
-][n], 0), Bq = (e, t) => (Math.max(e, t) + .05) / (Math.min(e, t) + .05);
-function Vq(e, t) {
-	let n = Iq(e), r = Iq(t.text), i = Iq(t.surface);
-	return !n || !r || !i || Bq(zq(n), zq(r)) >= Bq(zq(n), zq(i)) ? t.text : t.surface;
+][n], 0), Hq = (e, t) => (Math.max(e, t) + .05) / (Math.min(e, t) + .05);
+function Uq(e, t) {
+	let n = Rq(e), r = Rq(t.text), i = Rq(t.surface);
+	return !n || !r || !i || Hq(Vq(n), Vq(r)) >= Hq(Vq(n), Vq(i)) ? t.text : t.surface;
 }
-var Hq = (e, t) => ({
+var Wq = (e, t) => ({
 	type: "linear",
 	x: 0,
 	y: 0,
@@ -32764,13 +32764,13 @@ var Hq = (e, t) => ({
 	y2: 1,
 	colorStops: [{
 		offset: 0,
-		color: Lq(e, t)
+		color: zq(e, t)
 	}, {
 		offset: 1,
-		color: Lq(e, 0)
+		color: zq(e, 0)
 	}]
-}), Uq = (e) => e + xG;
-function Wq(e) {
+}), Gq = (e) => e + xG;
+function Kq(e) {
 	let t = e.x.format?.pattern;
 	return (e) => {
 		let n = e - xG;
@@ -32779,7 +32779,7 @@ function Wq(e) {
 		return r.hour || r.minute ? BG(n, { pattern: "time" }) : VG(n);
 	};
 }
-function Gq(e, t, n) {
+function qq(e, t, n) {
 	let r = Fq, i = (e) => n ? e ? [
 		r,
 		0,
@@ -32816,7 +32816,7 @@ function Gq(e, t, n) {
 		return a;
 	});
 }
-function Kq(e, t, n, r) {
+function Jq(e, t, n, r) {
 	let i = n.width < 576, a = r.animation !== !1 && !t.reducedMotion && BK(e) <= 5e3, o = HK(e), s = Object.fromEntries(o.map((e) => [e, !r.hidden.has(e)])), c = {
 		palette: t.palette,
 		neutral: t.neutral,
@@ -32858,9 +32858,9 @@ function Kq(e, t, n, r) {
 		colours: c,
 		compact: i,
 		animate: a
-	}, f = AJ[e.type];
+	}, f = FJ[e.type];
 	if (f) return f(e, t, n, r, d);
-	let p = e.type === "bar", m = e.x.kind === "time", h = e.stack === "percent" ? GK(e, r.hidden) : null, g = p || e.type === "column" ? Gq(e, r.hidden, p) : null, _ = e.series.length === 1, v = r.renderer === "canvas", [y, b] = Nq(e.series.flatMap((t) => e.data.map((n, r) => Q(e, t.key, r))), !0), x = e.stack === "percent" ? Sq(e) : Mq(e.y.format, e.y.min ?? y, e.y.max ?? b, i ? 3 : 4), S = h?.some((e) => Object.values(e).some((e) => e != null && e < 0)) ? -1 : 0, C = e.series.findIndex((e) => !r.hidden.has(e.key)), w = {
+	let p = e.type === "bar", m = e.x.kind === "time", h = e.stack === "percent" ? GK(e, r.hidden) : null, g = p || e.type === "column" ? qq(e, r.hidden, p) : null, _ = e.series.length === 1, v = r.renderer === "canvas", [y, b] = Nq(e.series.flatMap((t) => e.data.map((n, r) => Q(e, t.key, r))), !0), x = e.stack === "percent" ? Sq(e) : Mq(e.y.format, e.y.min ?? y, e.y.max ?? b, i ? 3 : 4), S = h?.some((e) => Object.values(e).some((e) => e != null && e < 0)) ? -1 : 0, C = e.series.findIndex((e) => !r.hidden.has(e.key)), w = {
 		type: m ? "time" : "category",
 		boundaryGap: !m && (e.type === "column" || p),
 		inverse: p,
@@ -32875,7 +32875,7 @@ function Kq(e, t, n, r) {
 			fontSize: 11,
 			margin: 12,
 			hideOverlap: !0,
-			...m ? { formatter: Wq(e) } : {}
+			...m ? { formatter: Kq(e) } : {}
 		},
 		...m ? {} : { data: e.data.map((t, n) => $(e, n)) }
 	}, T = {
@@ -32909,7 +32909,7 @@ function Kq(e, t, n, r) {
 	}, E = e.zoom, D = _ && e.type !== "column" && !p && !i, O = e.series.map((n, r) => {
 		let o = t.palette[r], s = e.data.some((t, r) => Q(e, n.key, r) != null && Q(e, n.key, r - 1) == null && Q(e, n.key, r + 1) == null), c = (t) => {
 			let r = Q(e, n.key, t), i = h ? h[t][n.key] : r;
-			return m ? [Uq(FK(e, t)), i] : i;
+			return m ? [Gq(FK(e, t)), i] : i;
 		}, l = {
 			id: n.key,
 			name: n.key,
@@ -32940,7 +32940,7 @@ function Kq(e, t, n, r) {
 					width: 2,
 					color: o,
 					..._ && !v ? {
-						shadowColor: Lq(o, .35),
+						shadowColor: zq(o, .35),
 						shadowBlur: 10,
 						shadowOffsetY: 6
 					} : {}
@@ -32950,7 +32950,7 @@ function Kq(e, t, n, r) {
 					borderColor: t.surface,
 					borderWidth: 2
 				},
-				areaStyle: n ? { color: Hq(o, n) } : void 0,
+				areaStyle: n ? { color: Wq(o, n) } : void 0,
 				endLabel: D ? {
 					show: !0,
 					formatter: (e) => Z(Array.isArray(e.value) ? e.value[1] : e.value, x),
@@ -32961,7 +32961,7 @@ function Kq(e, t, n, r) {
 					fontFamily: t.font,
 					valueAnimation: a
 				} : void 0,
-				markLine: r === C ? qq(e, t, !1, a) : void 0
+				markLine: r === C ? Yq(e, t, !1, a) : void 0
 			};
 		}
 		return {
@@ -32979,7 +32979,7 @@ function Kq(e, t, n, r) {
 				value: c(t),
 				itemStyle: { borderRadius: g[t][n.key] }
 			})),
-			markLine: r === C ? qq(e, t, p, a) : void 0
+			markLine: r === C ? Yq(e, t, p, a) : void 0
 		};
 	});
 	return {
@@ -32992,7 +32992,7 @@ function Kq(e, t, n, r) {
 			bottom: E ? 44 : 4,
 			outerBoundsMode: "same"
 		},
-		dataZoom: E ? DJ(e, t, t.palette[0], r.zoom) : void 0,
+		dataZoom: E ? MJ(e, t, t.palette[0], r.zoom) : void 0,
 		tooltip: {
 			...l,
 			trigger: "axis",
@@ -33001,7 +33001,7 @@ function Kq(e, t, n, r) {
 				lineStyle: { color: t.axis }
 			} : {
 				type: "shadow",
-				shadowStyle: { color: Lq(t.neutral, t.dark ? .12 : .1) }
+				shadowStyle: { color: zq(t.neutral, t.dark ? .12 : .1) }
 			},
 			formatter: (t) => dq(cq(e, (Array.isArray(t) ? t : [t])[0]?.dataIndex ?? 0, r.hidden, c))
 		},
@@ -33010,7 +33010,7 @@ function Kq(e, t, n, r) {
 		series: O
 	};
 }
-function qq(e, t, n, r) {
+function Yq(e, t, n, r) {
 	if (!e.target) return;
 	let i = e.series[0].format;
 	return {
@@ -33035,7 +33035,7 @@ function qq(e, t, n, r) {
 		data: [n ? { xAxis: e.target.value } : { yAxis: e.target.value }]
 	};
 }
-function Jq(e, t, n, r, { base: i, tooltipBase: a, colours: o, compact: s }) {
+function Xq(e, t, n, r, { base: i, tooltipBase: a, colours: o, compact: s }) {
 	let c = e.series[0], l = e.data.map((t, n) => $(e, n)), u = e.data.reduce((t, n, i) => t + (r.hidden.has(l[i]) ? 0 : Q(e, c.key, i) ?? 0), 0);
 	return {
 		...i,
@@ -33128,15 +33128,15 @@ function Jq(e, t, n, r, { base: i, tooltipBase: a, colours: o, compact: s }) {
 		}]
 	};
 }
-var Yq = (e) => [...new Set(e)], Xq = (e, t) => e.data.map((n, r) => Q(e, t, r));
-function Zq(e, t) {
+var Zq = (e) => [...new Set(e)], Qq = (e, t) => e.data.map((n, r) => Q(e, t, r));
+function $q(e, t) {
 	return {
 		...e,
 		trigger: "item",
 		formatter: (e) => t(e)
 	};
 }
-var Qq = (e, t, n = {}) => ({
+var eJ = (e, t, n = {}) => ({
 	type: "category",
 	data: t,
 	axisLine: { lineStyle: { color: e.axis } },
@@ -33148,7 +33148,7 @@ var Qq = (e, t, n = {}) => ({
 		hideOverlap: !0
 	},
 	...n
-}), $q = (e, t, n = {}) => ({
+}), tJ = (e, t, n = {}) => ({
 	type: "value",
 	splitNumber: 4,
 	axisLine: { show: !1 },
@@ -33165,7 +33165,7 @@ var Qq = (e, t, n = {}) => ({
 	},
 	...n
 });
-function eJ(e, t, n) {
+function nJ(e, t, n) {
 	return {
 		type: "piecewise",
 		orient: "horizontal",
@@ -33192,8 +33192,8 @@ function eJ(e, t, n) {
 		...n
 	};
 }
-function tJ(e, t, n, r, i) {
-	let a = e.series[0], o = Yq(e.data.map((t, n) => $(e, n))), s = zK(e), c = QK(Xq(e, a.key), t.seq);
+function rJ(e, t, n, r, i) {
+	let a = e.series[0], o = Zq(e.data.map((t, n) => $(e, n))), s = zK(e), c = QK(Qq(e, a.key), t.seq);
 	return {
 		...i.base,
 		grid: {
@@ -33203,16 +33203,16 @@ function tJ(e, t, n, r, i) {
 			bottom: 40,
 			outerBoundsMode: "same"
 		},
-		tooltip: Zq(i.tooltipBase, (t) => dq(cq(e, t.dataIndex, r.hidden, i.colours))),
-		xAxis: Qq(t, o, {
+		tooltip: $q(i.tooltipBase, (t) => dq(cq(e, t.dataIndex, r.hidden, i.colours))),
+		xAxis: eJ(t, o, {
 			axisLine: { show: !1 },
 			splitArea: { show: !1 }
 		}),
-		yAxis: Qq(t, s, {
+		yAxis: eJ(t, s, {
 			inverse: !0,
 			axisLine: { show: !1 }
 		}),
-		visualMap: eJ(t, c),
+		visualMap: nJ(t, c),
 		series: [{
 			type: "heatmap",
 			data: e.data.map((t, n) => [
@@ -33234,27 +33234,27 @@ function tJ(e, t, n, r, i) {
 		}]
 	};
 }
-var nJ = 7 * 864e5, rJ = (e) => {
+var iJ = 7 * 864e5, aJ = (e) => {
 	let t = zG(e);
 	return `${t.year}-${String(t.month + 1).padStart(2, "0")}-${String(t.day).padStart(2, "0")}`;
 };
-function iJ(e, t) {
-	let n = e.data.map((t, n) => FK(e, n)).filter(Number.isFinite), r = aJ(n), i = oJ(n), a = Math.ceil((i - r) / nJ) + 1, o = Math.floor((t.height - 62) / 7), s = Math.max(sJ, Math.min(cJ, o, Math.floor((t.width - 44) / a))), c = Math.max(1, Math.floor((t.width - 44) / s));
+function oJ(e, t) {
+	let n = e.data.map((t, n) => FK(e, n)).filter(Number.isFinite), r = sJ(n), i = cJ(n), a = Math.ceil((i - r) / iJ) + 1, o = Math.floor((t.height - 62) / 7), s = Math.max(lJ, Math.min(uJ, o, Math.floor((t.width - 44) / a))), c = Math.max(1, Math.floor((t.width - 44) / s));
 	return {
 		cell: s,
-		from: a > c ? i - (c - 1) * nJ : r,
+		from: a > c ? i - (c - 1) * iJ : r,
 		to: i
 	};
 }
-var aJ = (e) => e.reduce((e, t) => t < e ? t : e, Infinity), oJ = (e) => e.reduce((e, t) => t > e ? t : e, -Infinity), sJ = 9, cJ = 24;
-function lJ(e, t, n, r, i) {
-	let a = e.series[0], { cell: o, from: s, to: c } = iJ(e, n), l = QK(Xq(e, a.key), t.seq);
+var sJ = (e) => e.reduce((e, t) => t < e ? t : e, Infinity), cJ = (e) => e.reduce((e, t) => t > e ? t : e, -Infinity), lJ = 9, uJ = 24;
+function dJ(e, t, n, r, i) {
+	let a = e.series[0], { cell: o, from: s, to: c } = oJ(e, n), l = QK(Qq(e, a.key), t.seq);
 	return {
 		...i.base,
-		tooltip: Zq(i.tooltipBase, (t) => dq(cq(e, t.dataIndex, r.hidden, i.colours))),
-		visualMap: eJ(t, l, { right: 4 }),
+		tooltip: $q(i.tooltipBase, (t) => dq(cq(e, t.dataIndex, r.hidden, i.colours))),
+		visualMap: nJ(t, l, { right: 4 }),
 		calendar: {
-			range: [rJ(s), rJ(c)],
+			range: [aJ(s), aJ(c)],
 			top: 24,
 			left: 34,
 			cellSize: [o, o],
@@ -33291,7 +33291,7 @@ function lJ(e, t, n, r, i) {
 		series: [{
 			type: "heatmap",
 			coordinateSystem: "calendar",
-			data: e.data.map((t, n) => [rJ(FK(e, n)), Q(e, a.key, n) ?? "-"]),
+			data: e.data.map((t, n) => [aJ(FK(e, n)), Q(e, a.key, n) ?? "-"]),
 			itemStyle: {
 				borderRadius: 3,
 				borderColor: t.surface,
@@ -33304,11 +33304,11 @@ function lJ(e, t, n, r, i) {
 		}]
 	};
 }
-function uJ(e, t, n, r, i) {
+function fJ(e, t, n, r, i) {
 	let a = e.series[0], o = eq(e.data.length, t.seq), s = Q(e, a.key, 0);
 	return {
 		...i.base,
-		tooltip: Zq(i.tooltipBase, (t) => dq(cq(e, t.dataIndex, r.hidden, i.colours))),
+		tooltip: $q(i.tooltipBase, (t) => dq(cq(e, t.dataIndex, r.hidden, i.colours))),
 		series: [{
 			type: "funnel",
 			sort: "none",
@@ -33337,7 +33337,7 @@ function uJ(e, t, n, r, i) {
 				lineHeight: 17
 			},
 			data: e.data.map((n, r) => {
-				let i = Vq(o[r], t), c = Q(e, a.key, r), l = r ? `${ZK(c, Q(e, a.key, r - 1))} of previous step` : `${ZK(c, s)} of ${jq($(e, 0))}`;
+				let i = Uq(o[r], t), c = Q(e, a.key, r), l = r ? `${ZK(c, Q(e, a.key, r - 1))} of previous step` : `${ZK(c, s)} of ${jq($(e, 0))}`;
 				return {
 					name: $(e, r),
 					value: c ?? 0,
@@ -33358,7 +33358,7 @@ function uJ(e, t, n, r, i) {
 								fontFamily: t.font
 							},
 							p: {
-								color: Lq(i, .78),
+								color: zq(i, .78),
 								fontSize: 11,
 								fontFamily: t.font
 							}
@@ -33369,11 +33369,11 @@ function uJ(e, t, n, r, i) {
 		}]
 	};
 }
-function dJ(e, t, n, r, i) {
+function pJ(e, t, n, r, i) {
 	let a = e.series[0], { min: o, max: s } = rq(e), c = Q(e, a.key, 0), l = c ?? o, u = c == null ? null : tq(e, c), d = t.palette[0], f = s - o || 1, p = e.bands.length ? e.bands.map((e, n) => [Math.min(1, Math.max(0, (e.upTo - o) / f)), t.seq[1 + Math.min(n, 3)]]) : [[1, t.grid]];
 	return e.bands.length && p[p.length - 1][0] < 1 && p.push([1, t.grid]), {
 		...i.base,
-		tooltip: Zq(i.tooltipBase, () => dq(cq(e, 0, r.hidden, i.colours))),
+		tooltip: $q(i.tooltipBase, () => dq(cq(e, 0, r.hidden, i.colours))),
 		series: [{
 			type: "gauge",
 			startAngle: 215,
@@ -33392,7 +33392,7 @@ function dJ(e, t, n, r, i) {
 				itemStyle: {
 					color: d,
 					shadowBlur: i.animate ? 12 : 0,
-					shadowColor: Lq(d, .35)
+					shadowColor: zq(d, .35)
 				}
 			},
 			axisLine: {
@@ -33460,8 +33460,8 @@ function dJ(e, t, n, r, i) {
 		}]
 	};
 }
-function fJ(e) {
-	let t = oJ(e.map((e) => e.level).concat(e.map((e) => e.from), e.map((e) => e.to))), n = aJ(e.filter((e) => !e.total).map((e) => Math.min(e.from, e.to)).concat(e.filter((e) => e.total).map((e) => e.value))), r = oJ(e.filter((e) => !e.total).map((e) => Math.abs(e.value)));
+function mJ(e) {
+	let t = cJ(e.map((e) => e.level).concat(e.map((e) => e.from), e.map((e) => e.to))), n = sJ(e.filter((e) => !e.total).map((e) => Math.min(e.from, e.to)).concat(e.filter((e) => e.total).map((e) => e.value))), r = cJ(e.filter((e) => !e.total).map((e) => Math.abs(e.value)));
 	if (!(t > 0) || !(n > t * .4) || !(r < t * .15)) return null;
 	let i = 10 ** Math.floor(Math.log10(t)) / 10, a = Math.round(t * .08 / i) * i, o = Math.floor(n * .965 / i) * i;
 	return o > a ? {
@@ -33469,8 +33469,28 @@ function fJ(e) {
 		end: o
 	} : null;
 }
-function pJ(e, t, n, r, i) {
-	let a = e.series[0], o = iq(e), s = Sq(e), c = fJ(o), l = (t) => sq(e, t.index, i.colours), u = o.map((t) => $(e, t.index));
+var hJ = 4, gJ = 72;
+function _J(e, t, n, r) {
+	let i = r ? 10 : 11, a = r ? 10.5 : 12, o = Math.floor(n / Math.max(1, e.length) - hJ);
+	return {
+		nameSize: i,
+		valueSize: a,
+		category: cJ(e.flatMap((e) => String(e).split(/\s+/)).map((e) => Lq(e, i))) <= o ? {
+			interval: 0,
+			width: o,
+			overflow: "break"
+		} : {
+			interval: 0,
+			rotate: 45,
+			width: gJ,
+			overflow: "truncate",
+			hideOverlap: !0
+		},
+		showValues: t.every((e) => Lq(e, a) <= o)
+	};
+}
+function vJ(e, t, n, r, i) {
+	let a = e.series[0], o = iq(e), s = Sq(e), c = mJ(o), l = (t) => sq(e, t.index, i.colours), u = o.map((t) => $(e, t.index)), d = o.map((e) => e.total ? Z(e.value, s) : lq(e.value, s)), f = o.flatMap((e) => [e.from, e.to]), p = Math.max(Lq(Z(cJ(f), s), 11), Lq(Z(sJ(f), s), 11)) + 8, m = _J(u, d, n.width - p - 12, i.compact);
 	return {
 		...i.base,
 		grid: {
@@ -33485,19 +33505,17 @@ function pJ(e, t, n, r, i) {
 			trigger: "axis",
 			axisPointer: {
 				type: "shadow",
-				shadowStyle: { color: Lq(t.neutral, .1) }
+				shadowStyle: { color: zq(t.neutral, .1) }
 			},
 			formatter: (t) => dq(cq(e, (Array.isArray(t) ? t : [t])[0]?.dataIndex ?? 0, r.hidden, i.colours))
 		},
-		xAxis: Qq(t, u, { axisLabel: {
+		xAxis: eJ(t, u, { axisLabel: {
 			color: t.label,
-			fontSize: i.compact ? 10 : 11,
+			fontSize: m.nameSize,
 			margin: 12,
-			interval: 0,
-			width: Math.max(40, Math.floor((n.width - 40) / u.length)),
-			overflow: "break"
+			...m.category
 		} }),
-		yAxis: $q(t, (e) => Z(e, s), {
+		yAxis: tJ(t, (e) => Z(e, s), {
 			min: 0,
 			splitNumber: 5,
 			...c ? {
@@ -33560,17 +33578,14 @@ function pJ(e, t, n, r, i) {
 				} },
 				animationDelay: i.animate ? (e) => e * 140 : 0,
 				label: {
-					show: !0,
+					show: m.showValues,
 					position: "top",
 					distance: 6,
 					fontFamily: t.font,
-					fontSize: i.compact ? 10.5 : 12,
+					fontSize: m.valueSize,
 					fontWeight: 600,
 					color: t.text,
-					formatter: (e) => {
-						let t = o[e.dataIndex];
-						return t.total ? Z(t.value, s) : lq(t.value, s);
-					}
+					formatter: (e) => d[e.dataIndex]
 				},
 				data: o.map((e) => ({
 					value: Math.abs(e.to - e.from),
@@ -33580,16 +33595,19 @@ function pJ(e, t, n, r, i) {
 		]
 	};
 }
-function mJ(e) {
+function yJ(e) {
 	let t = e.series[0].key;
 	return zK(e).map((n) => ({
 		name: n,
 		rows: e.data.map((e, t) => t).filter((t) => IK(e, t) === n).sort((n, r) => Q(e, t, r) - Q(e, t, n) || n - r)
 	}));
 }
-function hJ(e, t, n, r, i) {
-	let a = e.series[0], o = oq(e), s = [...o.values()].reduce((e, t) => e + t, 0), c = (e) => e / s * n.width * n.height * .82 > 5200, l = mJ(e).map(({ name: n, rows: r }, i) => {
-		let s = o.get(n), l = t.palette[i % t.palette.length], u = Vq(l, t);
+function bJ(e, t, n, r, i) {
+	let a = e.series[0], o = oq(e), s = [...o.values()].reduce((e, t) => e + t, 0), c = (e, t) => {
+		let r = e / s * n.width * n.height * .82;
+		return r > 5200 && Math.max(Lq(t[0], 12), Lq(t[1], 11.5)) + 20 <= Math.sqrt(r);
+	}, l = yJ(e).map(({ name: n, rows: r }, i) => {
+		let s = o.get(n), l = t.palette[i % t.palette.length], u = Uq(l, t);
 		return {
 			name: n,
 			value: s,
@@ -33609,20 +33627,20 @@ function hJ(e, t, n, r, i) {
 					},
 					v: {
 						fontSize: 12,
-						color: Lq(u, .8),
+						color: zq(u, .8),
 						fontFamily: t.font
 					}
 				}
 			},
 			children: r.map((n, r) => {
-				let i = Rq(l, t.surface, Math.min(.55, r * .14)), o = Vq(i, t), s = Q(e, a.key, n);
+				let i = Bq(l, t.surface, Math.min(.55, r * .14)), o = Uq(i, t), s = Q(e, a.key, n);
 				return {
 					name: $(e, n),
 					value: s,
 					row: n,
 					itemStyle: { color: i },
 					label: {
-						show: c(s),
+						show: c(s, [$(e, n), Z(s, a.format)]),
 						formatter: `{n|${jq($(e, n))}}\n{v|${jq(Z(s, a.format))}}`,
 						rich: {
 							n: {
@@ -33633,7 +33651,7 @@ function hJ(e, t, n, r, i) {
 								lineHeight: 16
 							},
 							v: {
-								color: Lq(o, .82),
+								color: zq(o, .82),
 								fontSize: 11.5,
 								fontFamily: t.font
 							}
@@ -33645,7 +33663,7 @@ function hJ(e, t, n, r, i) {
 	});
 	return {
 		...i.base,
-		tooltip: Zq(i.tooltipBase, (t) => t.data?.row == null ? dq({
+		tooltip: $q(i.tooltipBase, (t) => t.data?.row == null ? dq({
 			title: t.name,
 			rows: [{
 				color: t.color,
@@ -33707,13 +33725,13 @@ function hJ(e, t, n, r, i) {
 		}]
 	};
 }
-function gJ(e) {
+function xJ(e) {
 	let t = e.data.map((t) => [String(t[e.x.key]), String(t[e.to.key])]), n = new Map(t.flatMap(([e, t]) => [[e, 0], [t, 0]]));
 	for (let e = 0; e < n.size; e += 1) for (let [e, r] of t) n.set(r, Math.max(n.get(r), n.get(e) + 1));
 	return n;
 }
-function _J(e, t, n, r, i) {
-	let a = e.series[0], o = aq(e, t.palette), s = gJ(e), c = oJ([...s.values()]), l = /* @__PURE__ */ new Map(), u = /* @__PURE__ */ new Map();
+function SJ(e, t, n, r, i) {
+	let a = e.series[0], o = aq(e, t.palette), s = xJ(e), c = cJ([...s.values()]), l = /* @__PURE__ */ new Map(), u = /* @__PURE__ */ new Map();
 	e.data.forEach((t, n) => {
 		let r = Q(e, a.key, n) ?? 0;
 		l.set(String(t[e.x.key]), (l.get(String(t[e.x.key])) ?? 0) + r), u.set(String(t[e.to.key]), (u.get(String(t[e.to.key])) ?? 0) + r);
@@ -33740,7 +33758,7 @@ function _J(e, t, n, r, i) {
 	});
 	return {
 		...i.base,
-		tooltip: Zq(i.tooltipBase, (t) => dq(t.dataType === "edge" ? cq(e, t.dataIndex, r.hidden, i.colours) : {
+		tooltip: $q(i.tooltipBase, (t) => dq(t.dataType === "edge" ? cq(e, t.dataIndex, r.hidden, i.colours) : {
 			title: t.name,
 			rows: [{
 				color: t.color,
@@ -33790,23 +33808,23 @@ function _J(e, t, n, r, i) {
 		}]
 	};
 }
-function vJ(e) {
+function CJ(e) {
 	let t = e.length, n = e.reduce((e, t) => e + t[0], 0) / t, r = e.reduce((e, t) => e + t[1], 0) / t, i = e.reduce((e, t) => e + (t[0] - n) ** 2, 0);
 	if (!t || !i) return null;
-	let a = e.reduce((e, t) => e + (t[0] - n) * (t[1] - r), 0) / i, o = aJ(e.map((e) => e[1])), s = oJ(e.map((e) => e[1])), c = (e) => {
+	let a = e.reduce((e, t) => e + (t[0] - n) * (t[1] - r), 0) / i, o = sJ(e.map((e) => e[1])), s = cJ(e.map((e) => e[1])), c = (e) => {
 		let t = r + a * (e - n);
 		return t < o ? [e + (o - t) / a, o] : t > s ? [e + (s - t) / a, s] : [e, t];
 	};
-	return [c(aJ(e.map((e) => e[0]))), c(oJ(e.map((e) => e[0])))];
+	return [c(sJ(e.map((e) => e[0]))), c(cJ(e.map((e) => e[0])))];
 }
-var yJ = 44, bJ = 28, xJ = 8;
-function SJ(e, t, n, r, i) {
-	let a = e.series[0], o = zK(e), s = e.type === "bubble", c = oJ(s ? e.data.map((t) => t[e.size.key]) : []), l = (e) => Math.max(xJ, (i.compact ? bJ : yJ) * Math.sqrt(e / c)), u = (t) => e.data.map((e, t) => t).filter((n) => !e.group || IK(e, n) === t), d = (e.group ? o : [null]).filter((e) => e == null || !r.hidden.has(e)).flatMap((e) => u(e)), f = e.trend ? vJ(d.map((t) => [e.data[t][e.x.key], Q(e, a.key, t)])) : null, p = e.data.map((t) => t[e.x.key]), m = e.data.map((t, n) => Q(e, a.key, n)), [h, g] = Nq(p, !1), [_, v] = Nq(m, !1), y = Mq(e.y.format, e.y.min ?? _, e.y.max ?? v, 4), b = Mq(e.x.format, h, g, 4), x = (e.group ? o : [null]).map((n, r) => ({
+var wJ = 44, TJ = 28, EJ = 8;
+function DJ(e, t, n, r, i) {
+	let a = e.series[0], o = zK(e), s = e.type === "bubble", c = cJ(s ? e.data.map((t) => t[e.size.key]) : []), l = (e) => Math.max(EJ, (i.compact ? TJ : wJ) * Math.sqrt(e / c)), u = (t) => e.data.map((e, t) => t).filter((n) => !e.group || IK(e, n) === t), d = (e.group ? o : [null]).filter((e) => e == null || !r.hidden.has(e)).flatMap((e) => u(e)), f = e.trend ? CJ(d.map((t) => [e.data[t][e.x.key], Q(e, a.key, t)])) : null, p = e.data.map((t) => t[e.x.key]), m = e.data.map((t, n) => Q(e, a.key, n)), [h, g] = Nq(p, !1), [_, v] = Nq(m, !1), y = Mq(e.y.format, e.y.min ?? _, e.y.max ?? v, 4), b = Mq(e.x.format, h, g, 4), x = (e.group ? o : [null]).map((n, r) => ({
 		name: n ?? a.key,
 		type: "scatter",
 		symbolSize: s ? (e) => l(e[2]) : i.compact ? 8 : 10,
 		itemStyle: {
-			color: Lq(t.palette[r], .85),
+			color: zq(t.palette[r], .85),
 			borderColor: t.surface,
 			borderWidth: 1.5
 		},
@@ -33857,8 +33875,8 @@ function SJ(e, t, n, r, i) {
 			bottom: e.x.label ? 24 : 4,
 			outerBoundsMode: "same"
 		},
-		tooltip: Zq(i.tooltipBase, (t) => t.data?.row == null ? "" : dq(cq(e, t.data.row, r.hidden, i.colours))),
-		xAxis: $q(t, (e) => Z(e, b), {
+		tooltip: $q(i.tooltipBase, (t) => t.data?.row == null ? "" : dq(cq(e, t.data.row, r.hidden, i.colours))),
+		xAxis: tJ(t, (e) => Z(e, b), {
 			scale: !0,
 			splitLine: { show: !1 },
 			axisLine: {
@@ -33876,7 +33894,7 @@ function SJ(e, t, n, r, i) {
 				}
 			} : {}
 		}),
-		yAxis: $q(t, (e) => Z(e, y), {
+		yAxis: tJ(t, (e) => Z(e, y), {
 			min: e.y.min,
 			max: e.y.max,
 			...e.y.label ? {
@@ -33894,10 +33912,10 @@ function SJ(e, t, n, r, i) {
 		series: x
 	};
 }
-var CJ = 32, wJ = 8, TJ = 26;
-function EJ(e, t, n, r, i) {
-	let a = e.x.kind === "time", o = e.series.length, s = (n.height - 6 - TJ) / o, c = s - CJ - wJ, l = t.palette[0], u = e.data.map((t, n) => $(e, n)), d = e.series.flatMap((n, r) => {
-		let i = Xq(e, n.key).filter((e) => e != null).pop();
+var OJ = 32, kJ = 8, AJ = 26;
+function jJ(e, t, n, r, i) {
+	let a = e.x.kind === "time", o = e.series.length, s = (n.height - 6 - AJ) / o, c = s - OJ - kJ, l = t.palette[0], u = e.data.map((t, n) => $(e, n)), d = e.series.flatMap((n, r) => {
+		let i = Qq(e, n.key).filter((e) => e != null).pop();
 		return [{
 			text: n.label,
 			left: 0,
@@ -33921,7 +33939,7 @@ function EJ(e, t, n, r, i) {
 		}];
 	}), f = (t, n) => {
 		let r = Q(e, t.key, n);
-		return a ? [Uq(FK(e, n)), r] : r;
+		return a ? [Gq(FK(e, n)), r] : r;
 	};
 	return {
 		...i.base,
@@ -33930,7 +33948,7 @@ function EJ(e, t, n, r, i) {
 		grid: e.series.map((e, t) => ({
 			left: 52,
 			right: 8,
-			top: 6 + t * s + CJ,
+			top: 6 + t * s + OJ,
 			height: c
 		})),
 		axisPointer: {
@@ -33948,7 +33966,7 @@ function EJ(e, t, n, r, i) {
 			formatter: (t) => dq(cq(e, (Array.isArray(t) ? t : [t])[0]?.dataIndex ?? 0, r.hidden, i.colours))
 		},
 		xAxis: e.series.map((n, r) => ({
-			...a ? { type: "time" } : Qq(t, u, { boundaryGap: !1 }),
+			...a ? { type: "time" } : eJ(t, u, { boundaryGap: !1 }),
 			gridIndex: r,
 			axisLine: { lineStyle: { color: r === o - 1 ? t.axis : t.grid } },
 			axisTick: { show: !1 },
@@ -33959,12 +33977,12 @@ function EJ(e, t, n, r, i) {
 				fontSize: 11,
 				hideOverlap: !0,
 				margin: 10,
-				...a ? { formatter: Wq(e) } : {}
+				...a ? { formatter: Kq(e) } : {}
 			}
 		})),
 		yAxis: e.series.map((n, r) => {
-			let [i, a] = Nq(Xq(e, n.key), !1), o = Mq(n.format, e.y.min ?? i, e.y.max ?? a, 2);
-			return $q(t, (e) => Z(e, o), {
+			let [i, a] = Nq(Qq(e, n.key), !1), o = Mq(n.format, e.y.min ?? i, e.y.max ?? a, 2);
+			return tJ(t, (e) => Z(e, o), {
 				gridIndex: r,
 				splitNumber: 2,
 				scale: e.y.min == null,
@@ -33997,13 +34015,13 @@ function EJ(e, t, n, r, i) {
 				borderColor: t.surface,
 				borderWidth: 2
 			},
-			areaStyle: { color: Hq(l, t.dark ? .26 : .16) },
+			areaStyle: { color: Wq(l, t.dark ? .26 : .16) },
 			animationDelay: i.animate ? r * 160 : 0,
 			emphasis: { disabled: !0 }
 		}))
 	};
 }
-function DJ(e, t, n, r) {
+function MJ(e, t, n, r) {
 	let i = r?.start ?? (e.data.length > 5e3 ? 70 : 0), a = r?.end ?? 100;
 	return [{
 		type: "inside",
@@ -34020,7 +34038,7 @@ function DJ(e, t, n, r) {
 		borderColor: "transparent",
 		backgroundColor: t.grid,
 		borderRadius: 6,
-		fillerColor: Lq(n, t.dark ? .22 : .12),
+		fillerColor: zq(n, t.dark ? .22 : .12),
 		handleStyle: {
 			color: t.surface,
 			borderColor: t.axis
@@ -34032,14 +34050,14 @@ function DJ(e, t, n, r) {
 				color: t.axis,
 				width: .75
 			},
-			areaStyle: { color: Lq(t.neutral, .15) }
+			areaStyle: { color: zq(t.neutral, .15) }
 		},
 		selectedDataBackground: {
 			lineStyle: {
 				color: n,
 				width: .75
 			},
-			areaStyle: { color: Lq(n, .18) }
+			areaStyle: { color: zq(n, .18) }
 		},
 		textStyle: {
 			color: t.label,
@@ -34048,7 +34066,7 @@ function DJ(e, t, n, r) {
 		}
 	}];
 }
-function OJ(e, t, n) {
+function NJ(e, t, n) {
 	switch (e.type) {
 		case "scatter":
 		case "bubble": {
@@ -34074,7 +34092,7 @@ function OJ(e, t, n) {
 		};
 		case "treemap": {
 			let t = 1;
-			for (let r of mJ(e)) {
+			for (let r of yJ(e)) {
 				let e = r.rows.indexOf(n);
 				if (e >= 0) return {
 					seriesIndex: 0,
@@ -34101,7 +34119,7 @@ function OJ(e, t, n) {
 		};
 	}
 }
-function kJ(e, t) {
+function PJ(e, t) {
 	switch (e.type) {
 		case "scatter":
 		case "bubble": return t.data?.row == null ? null : {
@@ -34134,20 +34152,20 @@ function kJ(e, t) {
 		};
 	}
 }
-var AJ = {
-	donut: Jq,
-	heatmap: tJ,
-	calendar: lJ,
-	funnel: uJ,
-	gauge: dJ,
-	waterfall: pJ,
-	treemap: hJ,
-	sankey: _J,
-	scatter: SJ,
-	bubble: SJ,
-	multiples: EJ
+var FJ = {
+	donut: Xq,
+	heatmap: rJ,
+	calendar: dJ,
+	funnel: fJ,
+	gauge: pJ,
+	waterfall: vJ,
+	treemap: bJ,
+	sankey: SJ,
+	scatter: DJ,
+	bubble: DJ,
+	multiples: jJ
 };
-function jJ(e, t, n, r, { pixelRatio: i = 2 } = {}) {
+function IJ(e, t, n, r, { pixelRatio: i = 2 } = {}) {
 	let a = document.createElement("div");
 	a.style.cssText = `position:fixed;left:-10000px;top:0;width:${n.width}px;height:${n.height}px;`, document.body.append(a);
 	let o = _j(a, null, {
@@ -34157,7 +34175,7 @@ function jJ(e, t, n, r, { pixelRatio: i = 2 } = {}) {
 		height: n.height
 	});
 	try {
-		return o.setOption(Kq(e, t, n, {
+		return o.setOption(Jq(e, t, n, {
 			...r,
 			renderer: "canvas",
 			animation: !1
@@ -34170,7 +34188,7 @@ function jJ(e, t, n, r, { pixelRatio: i = 2 } = {}) {
 		o.dispose(), a.remove();
 	}
 }
-function MJ(e, { renderer: t }) {
+function LJ(e, { renderer: t }) {
 	let n = _j(e, null, { renderer: t }), r = !1, i = null;
 	return {
 		renderer: t,
@@ -34178,14 +34196,14 @@ function MJ(e, { renderer: t }) {
 			let c = r && !s ? n.getOption()?.dataZoom?.[0] : null, l = Number.isFinite(c?.start) && Number.isFinite(c?.end) ? {
 				start: c.start,
 				end: c.end
-			} : null, u = Kq(e, t, a, {
+			} : null, u = Jq(e, t, a, {
 				...o,
 				zoom: l
 			});
 			i = e, n.setOption(u, s || !r ? { notMerge: !0 } : { replaceMerge: Aq }), r = !0;
 		},
 		focusPoint(e, t) {
-			let { tip: r = !0, ...a } = OJ(i, e, t);
+			let { tip: r = !0, ...a } = NJ(i, e, t);
 			n.dispatchAction({ type: "downplay" }), n.dispatchAction({
 				type: "highlight",
 				...a
@@ -34203,7 +34221,7 @@ function MJ(e, { renderer: t }) {
 		onSelect(e) {
 			n.on("click", (t) => {
 				if (t.componentType !== "series") return;
-				let n = kJ(i, t);
+				let n = PJ(i, t);
 				n && e({
 					seriesIndex: n.series,
 					dataIndex: n.row
@@ -34220,7 +34238,7 @@ function MJ(e, { renderer: t }) {
 }
 //#endregion
 //#region src/elementBase.js
-var NJ = typeof HTMLElement > "u" ? class {} : HTMLElement, PJ = "wui-chart:select", FJ = "wui-chart:legend-change", IJ = "wui-chart:ready", LJ = [
+var RJ = typeof HTMLElement > "u" ? class {} : HTMLElement, zJ = "wui-chart:select", BJ = "wui-chart:legend-change", VJ = "wui-chart:ready", HJ = [
 	"ArrowLeft",
 	"ArrowRight",
 	"ArrowUp",
@@ -34228,8 +34246,8 @@ var NJ = typeof HTMLElement > "u" ? class {} : HTMLElement, PJ = "wui-chart:sele
 	"Home",
 	"End",
 	"Escape"
-], RJ = "(prefers-color-scheme: dark)", zJ = "(prefers-reduced-motion: reduce)", BJ = (e) => typeof window.matchMedia == "function" ? window.matchMedia(e) : null, VJ = !1;
-function HJ(e) {
+], UJ = "(prefers-color-scheme: dark)", WJ = "(prefers-reduced-motion: reduce)", GJ = (e) => typeof window.matchMedia == "function" ? window.matchMedia(e) : null, KJ = !1;
+function qJ(e) {
 	let t = getComputedStyle(e), n = (e) => t.getPropertyValue(e).trim(), r = e.closest("[data-bs-theme], [data-theme]") ?? document.documentElement, i = r.getAttribute("data-bs-theme") || r.getAttribute("data-theme"), a = {
 		palette: [
 			1,
@@ -34260,16 +34278,16 @@ function HJ(e) {
 		textMuted: n("--color-text-muted"),
 		shadow: n("--wui-shadow-overlay"),
 		font: t.fontFamily,
-		dark: i === "dark" || i === "auto" && !!BJ(RJ)?.matches,
-		reducedMotion: !!BJ(zJ)?.matches
+		dark: i === "dark" || i === "auto" && !!GJ(UJ)?.matches,
+		reducedMotion: !!GJ(WJ)?.matches
 	};
-	return !a.palette[0] && !VJ && (VJ = !0, console.warn("[@webority/ui-elements] <wui-chart> found no --wui-chart-* colours: load @webority/theme on the page.")), a;
+	return !a.palette[0] && !KJ && (KJ = !0, console.warn("[@webority/ui-elements] <wui-chart> found no --wui-chart-* colours: load @webority/theme on the page.")), a;
 }
-var UJ = /* @__PURE__ */ new Set(), WJ = null;
-function GJ(e) {
-	if (UJ.add(e), WJ) return;
+var JJ = /* @__PURE__ */ new Set(), YJ = null;
+function XJ(e) {
+	if (JJ.add(e), YJ) return;
 	let t = () => {
-		for (let e of UJ) e._themeChanged();
+		for (let e of JJ) e._themeChanged();
 	}, n = new MutationObserver(t);
 	n.observe(document.documentElement, {
 		attributes: !0,
@@ -34285,30 +34303,30 @@ function GJ(e) {
 		subtree: !0,
 		attributeFilter: ["data-theme", "data-bs-theme"]
 	});
-	let i = [BJ(RJ), BJ(zJ)].filter(Boolean);
+	let i = [GJ(UJ), GJ(WJ)].filter(Boolean);
 	for (let e of i) e.addEventListener?.("change", t);
-	WJ = () => {
+	YJ = () => {
 		n.disconnect(), r.disconnect();
 		for (let e of i) e.removeEventListener?.("change", t);
-		WJ = null;
+		YJ = null;
 	};
 }
-function KJ(e) {
-	UJ.delete(e), UJ.size || WJ?.();
+function ZJ(e) {
+	JJ.delete(e), JJ.size || YJ?.();
 }
-function qJ(e, t) {
+function QJ(e, t) {
 	let n = document.createElement("a");
 	n.href = e, n.download = t, document.body.append(n), n.click(), n.remove();
 }
-var JJ = (e, t, n) => {
+var $J = (e, t, n) => {
 	let r = document.createElement(e);
 	return t && (r.className = t), n != null && (r.textContent = n), r;
-}, YJ = 0, XJ = class extends NJ {
+}, eY = 0, tY = class extends RJ {
 	static get observedAttributes() {
 		return ["view"];
 	}
 	constructor() {
-		super(), YJ += 1, this.uid = `wui-chart-${YJ}`, this._spec = null, this._normal = null, this._hidden = /* @__PURE__ */ new Set(), this._focus = null;
+		super(), eY += 1, this.uid = `wui-chart-${eY}`, this._spec = null, this._normal = null, this._hidden = /* @__PURE__ */ new Set(), this._focus = null;
 	}
 	get spec() {
 		return this._spec;
@@ -34329,12 +34347,12 @@ var JJ = (e, t, n) => {
 		}
 		this._spec ??= this._readScript(), this._spec == null && !this.querySelector(":scope > script[type='application/json']") && (this._awaitingSpec = !0, queueMicrotask(() => {
 			this._awaitingSpec = !1, this._parts && this._update();
-		})), this._build(), GJ(this), this._theme = HJ(this), this._width = this.clientWidth, this._resizeObserver = new ResizeObserver(() => this._resized()), this._resizeObserver.observe(this), typeof IntersectionObserver == "function" ? (this._visible = !1, this._intersection = new IntersectionObserver((e) => {
+		})), this._build(), XJ(this), this._theme = qJ(this), this._width = this.clientWidth, this._resizeObserver = new ResizeObserver(() => this._resized()), this._resizeObserver.observe(this), typeof IntersectionObserver == "function" ? (this._visible = !1, this._intersection = new IntersectionObserver((e) => {
 			e.some((e) => e.isIntersecting) && (this._intersection.disconnect(), this._visible = !0, this._update());
 		}, { threshold: .05 }), this._intersection.observe(this)) : this._visible = !0, this._update();
 	}
 	disconnectedCallback() {
-		KJ(this), this._resizeObserver?.disconnect(), this._intersection?.disconnect(), this._engine?.dispose(), this._engine = null, this._drawn = !1, this._parts = null;
+		ZJ(this), this._resizeObserver?.disconnect(), this._intersection?.disconnect(), this._engine?.dispose(), this._engine = null, this._drawn = !1, this._parts = null;
 	}
 	attributeChangedCallback(e, t, n) {
 		t === n || !this._parts || (TK("view", n, JG), this._update());
@@ -34345,18 +34363,18 @@ var JJ = (e, t, n) => {
 	}
 	toPng() {
 		let { spec: e } = this._normalized();
-		return e ? jJ(e, this._theme ?? HJ(this), this._size(e), {
+		return e ? IJ(e, this._theme ?? qJ(this), this._size(e), {
 			hidden: this._hidden,
 			renderer: VK(e)
 		}) : "";
 	}
 	exportCsv(e) {
 		let t = URL.createObjectURL(new Blob([this.toCsv()], { type: "text/csv;charset=utf-8" }));
-		qJ(t, e ?? `${vq(this._normalized().spec)}.csv`), setTimeout(() => URL.revokeObjectURL(t), 2e3);
+		QJ(t, e ?? `${vq(this._normalized().spec)}.csv`), setTimeout(() => URL.revokeObjectURL(t), 2e3);
 	}
 	exportPng(e) {
 		let t = this.toPng();
-		t && qJ(t, e ?? `${vq(this._normalized().spec)}.png`);
+		t && QJ(t, e ?? `${vq(this._normalized().spec)}.png`);
 	}
 	_readScript() {
 		let e = this.querySelector(":scope > script[type=\"application/json\"]");
@@ -34371,20 +34389,20 @@ var JJ = (e, t, n) => {
 		return this._normal ??= AK(this._spec), this._normal;
 	}
 	_build() {
-		let e = JJ("div", "wui-chart-legend");
+		let e = $J("div", "wui-chart-legend");
 		e.setAttribute("role", "group"), e.setAttribute("aria-label", "Legend"), e.hidden = !0, e.addEventListener("click", (e) => {
 			let t = e.target.closest?.(".wui-chart-legend-item");
 			t && this._toggle(t.dataset.key);
 		});
-		let t = JJ("div", "wui-chart-surface");
+		let t = $J("div", "wui-chart-surface");
 		t.tabIndex = 0, t.setAttribute("role", "group"), t.setAttribute("aria-roledescription", "chart"), t.addEventListener("keydown", (e) => this._onKey(e)), t.addEventListener("blur", () => this._clearFocus());
-		let n = JJ("div", "wui-chart-canvas");
+		let n = $J("div", "wui-chart-canvas");
 		n.setAttribute("aria-hidden", "true"), t.append(n);
-		let r = JJ("div", "wui-chart-state");
+		let r = $J("div", "wui-chart-state");
 		r.setAttribute("role", "status"), r.hidden = !0;
-		let i = JJ("div", "wui-chart-table-wrap visually-hidden"), a = JJ("p", "visually-hidden");
+		let i = $J("div", "wui-chart-table-wrap visually-hidden"), a = $J("p", "visually-hidden");
 		a.id = `${this.uid}-summary`;
-		let o = JJ("div", "visually-hidden");
+		let o = $J("div", "visually-hidden");
 		o.setAttribute("aria-live", "polite"), this.replaceChildren(e, t, r, i, a, o), this.setAttribute("role", "figure"), this.setAttribute("aria-describedby", a.id), this._parts = {
 			legend: e,
 			surface: t,
@@ -34421,7 +34439,7 @@ var JJ = (e, t, n) => {
 			i.replaceChildren();
 			return;
 		}
-		i.style.height = n, e === "loading" ? i.replaceChildren(JJ("div", "skeleton wui-chart-skeleton"), JJ("span", "visually-hidden", "Loading chart")) : i.replaceChildren(JJ("p", "wui-chart-state-text", t));
+		i.style.height = n, e === "loading" ? i.replaceChildren($J("div", "skeleton wui-chart-skeleton"), $J("span", "visually-hidden", "Loading chart")) : i.replaceChildren($J("p", "wui-chart-state-text", t));
 	}
 	_colour(e, t) {
 		return e.type === "donut" ? sq(e, t, this._theme) : this._theme.palette[t];
@@ -34436,40 +34454,40 @@ var JJ = (e, t, n) => {
 			o
 		]);
 		s !== this._legendSignature && (this._legendSignature = s, n.replaceChildren(...r.map((t, n) => {
-			let r = JJ("button", "wui-chart-legend-item");
+			let r = $J("button", "wui-chart-legend-item");
 			r.type = "button", r.dataset.key = t;
-			let i = JJ("span", e.type === "line" ? "wui-chart-legend-swatch wui-chart-legend-swatch-line" : "wui-chart-legend-swatch");
-			return i.style.background = o[n], r.append(i, JJ("span", "wui-chart-legend-label", a[n])), r;
+			let i = $J("span", e.type === "line" ? "wui-chart-legend-swatch wui-chart-legend-swatch-line" : "wui-chart-legend-swatch");
+			return i.style.background = o[n], r.append(i, $J("span", "wui-chart-legend-label", a[n])), r;
 		})));
 		for (let e of n.children) e.setAttribute("aria-pressed", String(!this._hidden.has(e.dataset.key)));
 	}
 	_renderTable(e) {
 		if (this._tableSpec === e) return;
 		this._tableSpec = e;
-		let t = mq(e), n = JJ("table", "wui-chart-table");
-		n.append(JJ("caption", "visually-hidden", t.caption));
-		let r = JJ("tr");
+		let t = mq(e), n = $J("table", "wui-chart-table");
+		n.append($J("caption", "visually-hidden", t.caption));
+		let r = $J("tr");
 		t.head.forEach((e, t) => {
-			let n = JJ("th", t ? "wui-chart-num" : null, e);
+			let n = $J("th", t ? "wui-chart-num" : null, e);
 			n.scope = "col", r.append(n);
 		});
-		let i = JJ("thead");
+		let i = $J("thead");
 		i.append(r), n.append(i);
-		let a = JJ("tbody");
+		let a = $J("tbody");
 		for (let e of t.rows) {
-			let t = JJ("tr"), n = JJ("th", null, e.head);
-			n.scope = "row", t.append(n, ...e.cells.map((e) => JJ("td", "wui-chart-num", e))), a.append(t);
+			let t = $J("tr"), n = $J("th", null, e.head);
+			n.scope = "row", t.append(n, ...e.cells.map((e) => $J("td", "wui-chart-num", e))), a.append(t);
 		}
 		n.append(a);
 		let o = [n];
-		t.truncated && o.push(JJ("p", "wui-chart-table-note", `Showing the first ${t.rows.length} of ${t.total} rows. Download the CSV for all of them.`)), this._parts.tableWrap.replaceChildren(...o);
+		t.truncated && o.push($J("p", "wui-chart-table-note", `Showing the first ${t.rows.length} of ${t.total} rows. Download the CSV for all of them.`)), this._parts.tableWrap.replaceChildren(...o);
 	}
 	_draw() {
 		let { spec: e } = this._normalized(), t = VK(e), n = e.type !== this._drawnType;
 		this._engine && this._engine.renderer !== t && (this._engine.dispose(), this._engine = null);
 		let r = `${e.height}px`, i = this._parts.canvas.style.height !== r;
-		this._parts.canvas.style.height = r, i && this._engine?.resize(), this._engine || (this._engine = MJ(this._parts.canvas, { renderer: t }), this._engine.onSelect(({ seriesIndex: e, dataIndex: t }) => this._select(e, t)), this._engine.onFinished(() => {
-			this._announcedReady || (this._announcedReady = !0, this.dispatchEvent(new CustomEvent(IJ, {
+		this._parts.canvas.style.height = r, i && this._engine?.resize(), this._engine || (this._engine = LJ(this._parts.canvas, { renderer: t }), this._engine.onSelect(({ seriesIndex: e, dataIndex: t }) => this._select(e, t)), this._engine.onFinished(() => {
+			this._announcedReady || (this._announcedReady = !0, this.dispatchEvent(new CustomEvent(VJ, {
 				bubbles: !0,
 				detail: { renderer: t }
 			})));
@@ -34480,7 +34498,7 @@ var JJ = (e, t, n) => {
 	}
 	_themeChanged() {
 		if (!this._parts) return;
-		let e = HJ(this);
+		let e = qJ(this);
 		JSON.stringify(e) !== JSON.stringify(this._theme) && (this._theme = e, this._update());
 	}
 	_resized() {
@@ -34492,7 +34510,7 @@ var JJ = (e, t, n) => {
 		if (!t || e == null) return;
 		this._hidden.has(e) ? this._hidden.delete(e) : this._hidden.add(e), this._clearFocus(), this._update();
 		let n = Object.fromEntries(HK(t).map((e) => [e, !this._hidden.has(e)]));
-		this.dispatchEvent(new CustomEvent(FJ, {
+		this.dispatchEvent(new CustomEvent(BJ, {
 			bubbles: !0,
 			detail: { visible: n }
 		}));
@@ -34505,7 +34523,7 @@ var JJ = (e, t, n) => {
 			e.preventDefault(), this._select(this._focus.series, this._focus.index);
 			return;
 		}
-		if (!LJ.includes(e.key) || e.key === "Escape" && !this._focus) return;
+		if (!HJ.includes(e.key) || e.key === "Escape" && !this._focus) return;
 		e.preventDefault();
 		let n = Oq(t, this._focus, e.key, this._hidden);
 		if (!n) {
@@ -34525,7 +34543,7 @@ var JJ = (e, t, n) => {
 		let { spec: n } = this._normalized(), r = n?.series[iK(n.type) ? 0 : e];
 		if (!r) return;
 		let i = n.data[t] ?? null;
-		this.dispatchEvent(new CustomEvent(PJ, {
+		this.dispatchEvent(new CustomEvent(zJ, {
 			bubbles: !0,
 			detail: {
 				series: r.key,
@@ -34540,6 +34558,6 @@ var JJ = (e, t, n) => {
 };
 //#endregion
 //#region src/chart.js
-typeof customElements < "u" && !customElements.get("wui-chart") && customElements.define("wui-chart", XJ);
+typeof customElements < "u" && !customElements.get("wui-chart") && customElements.define("wui-chart", tY);
 //#endregion
-export { qG as CHART_STATES, UG as CHART_TYPES, JG as CHART_VIEWS, YG as MAX_SERIES, XG as MAX_SLICES, KG as RENDERERS, WG as STACK_MODES, XJ as WuiChart, GG as X_KINDS, Z as formatValue, AK as normalizeSpec };
+export { qG as CHART_STATES, UG as CHART_TYPES, JG as CHART_VIEWS, YG as MAX_SERIES, XG as MAX_SLICES, KG as RENDERERS, WG as STACK_MODES, tY as WuiChart, GG as X_KINDS, Z as formatValue, AK as normalizeSpec };