@wil-works/evoke-charts 0.4.0 → 0.6.0

package/dist/index.mjs

@@ -1,4 +1,4 @@
-import { A as xToCategoryIndex, B as INTERACTION, C as computeBins, D as computePieMaxRadius, E as buildPieSlices, F as resolveTickExtendedRange, H as pickTooltipRows, I as updateAnimation, L as CHART_PALETTES, M as getPadding, N as getTheme, O as getLegendBounds, P as isMissingValue, R as resolveChartPalette, S as sunburstValue, T as getHeatmapCategories, U as resolveCursor, V as applyWheelZoom, _ as getSliderGeometry, b as zoomToSlice, f as chartOptionsSchema, g as getDataZoomConfig, h as createSvgRecorder, j as createAnimation, k as getToolboxBounds, m as renderChart, n as buildChartPrompt, p as validateOptions, s as generateChartSpec, t as lintChartSpec, u as parseDataTable, v as windowToX, w as squarifyTreemap, x as computeSunburstGeometry, y as xToPercent, z as DEFAULT_I18N_ZH } from "./ai-BdpMydhW.js";
+import { $ as resolveChartPalette, A as squarifyTreemap, B as getToolboxBounds, C as chordHitTest, D as computeSunburstGeometry, E as boxplotHitTest, F as doughnutInnerRadius, G as createAnimation, H as funnelStepColor, I as matrixFieldExtent, J as isMissingValue, K as getPadding, L as scatterGroupColors, M as computeFacetGrids, N as computeMatrixCells, O as sunburstValue, P as computePieMaxRadius, Q as CHART_PALETTES, R as scatterPointPositions, S as arcHitTest, T as vennHitTest, U as getHeatmapCategories, V as calendarHitTest, W as xToCategoryIndex, X as updateAnimation, Y as resolveTickExtendedRange, Z as waterfallSteps, _ as getSliderGeometry, at as INTERACTION, b as zoomToSlice, ct as resolveCursor, et as DEFAULT_I18N_ZH, f as chartOptionsSchema, g as getDataZoomConfig, h as createSvgRecorder, it as minOf, j as buildPieSlices, k as computeBins, m as renderChart, n as buildChartPrompt, ot as applyWheelZoom, p as validateOptions, q as getTheme, rt as maxOf, s as generateChartSpec, st as pickTooltipRows, t as lintChartSpec, u as parseDataTable, v as windowToX, w as sankeyHitTest, x as ganttHitTest, y as xToPercent, z as getLegendBounds } from "./ai-B5Fk3lBQ.js";
 import { Fragment, Transition, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, h, inject, nextTick, normalizeClass, normalizeStyle, onMounted, onUnmounted, openBlock, provide, ref, renderList, renderSlot, resolveDynamicComponent, toDisplayString, watch, withCtx } from "vue";
 //#region src/connect.js
 var connectGroups = /* @__PURE__ */ new Map();
@@ -30,7 +30,7 @@ var _plugin_vue_export_helper_default = (sfc, props) => {
 };
 //#endregion
 //#region src/chart.vue
-var _hoisted_1 = ["aria-label"];
+var _hoisted_1 = ["tabindex", "aria-label"];
 var _hoisted_2 = {
 	key: 1,
 	class: "ev-chart__overlay"
@@ -121,11 +121,12 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			switch (opt.type) {
 				case "pie":
 				case "doughnut":
-				case "rose": return !opt.pieData || opt.pieData.length === 0;
+				case "rose": return !opt.pieData || opt.pieData.length === 0 || opt.pieData.every((d) => !(d.value > 0));
 				case "scatter": return !opt.scatterData || opt.scatterData.length === 0;
 				case "funnel": return !opt.funnelData || opt.funnelData.length === 0;
 				case "gauge": return !opt.gauge;
 				case "heatmap": return !opt.heatmapData || opt.heatmapData.length === 0;
+				case "calendar-heatmap": return !opt.calendarData || opt.calendarData.length === 0;
 				case "candle": return !opt.candleData || opt.candleData.length === 0;
 				case "bullet": return !opt.bulletData || opt.bulletData.length === 0;
 				case "treemap": return !opt.treemapData || opt.treemapData.length === 0;
@@ -136,6 +137,17 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 				case "bin": return !opt.series || opt.series.length === 0 || opt.series.every((s) => !s.data || s.data.length === 0);
 				case "sparkline": return !opt.series || opt.series.length === 0 || !opt.series[0]?.data?.length;
 				case "radar": return !opt.radarIndicators?.length || !opt.radarSeries?.length;
+				case "sankey":
+				case "chord":
+				case "arc": return !(opt.sankeyData || opt.chordData || opt.arcData)?.nodes?.length;
+				case "venn":
+					if (!opt.vennData || opt.vennData.length === 0) return true;
+					{
+						const circles = opt.vennData.filter((d) => !d.sets || d.sets.length === 1);
+						return circles.length === 0 || circles.length > 3;
+					}
+				case "gantt": return !opt.ganttData || opt.ganttData.length === 0;
+				case "scatter-matrix": return !opt.matrixFields?.length || !opt.matrixData?.length;
 				default: return !opt.labels?.length || !opt.series?.length;
 			}
 		});
@@ -159,6 +171,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 		let hoverIndex = -1;
 		let hoverAnimProgress = 0;
 		let hoverAnimFrameId = null;
+		let hoverAnimDone = null;
 		const hiddenSeries = ref(/* @__PURE__ */ new Set());
 		const focusSeries = ref(null);
 		const emphasisSeriesName = computed(() => {
@@ -228,11 +241,20 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 					data: s.data.slice(startIdx, endIdx)
 				}));
 				if (base.candleData) sliced.candleData = base.candleData.slice(startIdx, endIdx);
+				if (base.volumeData) sliced.volumeData = base.volumeData.slice(startIdx, endIdx);
 				sliced.__sliceStart = startIdx;
+			} else if (base.candleData) {
+				const cn = base.candleData.length;
+				if (cn > 0) {
+					const { startIdx, endIdx } = zoomToSlice(range, cn);
+					sliced.candleData = base.candleData.slice(startIdx, endIdx);
+					if (base.volumeData) sliced.volumeData = base.volumeData.slice(startIdx, endIdx);
+					sliced.__sliceStart = startIdx;
+				}
 			} else if (base.scatterData && base.scatterData.length > 0) {
 				const xs = base.scatterData.map((d) => d.x);
-				const xMin = Math.min(...xs);
-				const span = Math.max(...xs) - xMin || 1;
+				const xMin = minOf(xs);
+				const span = maxOf(xs) - xMin || 1;
 				const lo = xMin + range.start / 100 * span;
 				const hi = xMin + range.end / 100 * span;
 				const filtered = base.scatterData.filter((d) => d.x >= lo && d.x <= hi);
@@ -326,11 +348,11 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			const el = tooltipRef.value;
 			const tw = el?.offsetWidth || 120;
 			const th = el?.offsetHeight || 40;
-			const gap = 12;
+			const gap = INTERACTION.tooltip.cursorGap;
 			const margin = 2;
 			let legendBottom = margin;
 			const legend = props.options.legend || {};
-			if (legend.show !== false && (legend.position || "bottom") === "top") legendBottom = getPadding(props.options, containerRect.width).top;
+			if (legend.show !== false && (legend.position || "bottom") === "top") legendBottom = paddingFor(props.options, containerRect.width).top;
 			const spaceRight = containerRect.width - relX - gap;
 			const spaceLeft = relX - gap;
 			let left;
@@ -400,7 +422,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 				lastHeight = height;
 				canvas.width = width * dpr.value;
 				canvas.height = height * dpr.value;
-				const overlayPadding = getPadding(effectiveOptions.value, width);
+				const overlayPadding = paddingFor(effectiveOptions.value, width);
 				overlayInfo.value = {
 					plotArea: {
 						x: overlayPadding.left,
@@ -443,15 +465,47 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 				mouseY,
 				showCrosshair: hoverIndex >= 0,
 				hoverAnimProgress,
+				focusAnimProgress,
 				zoomRange: isZoomEnabled() ? zoomRange.value : void 0,
 				brushRect: brushRect.value,
 				focusSeries: focusSeries.value,
 				hoveredToolbox: hoveredToolbox.value
 			};
 		}
+		let focusAnimProgress = emphasisSeriesName.value ? 1 : 0;
+		let focusAnimFrameId = null;
+		function animateFocusProgress() {
+			if (focusAnimFrameId !== null) {
+				cancelAnimationFrame(focusAnimFrameId);
+				focusAnimFrameId = null;
+			}
+			const target = focusSeries.value ? 1 : 0;
+			if (props.options.animation?.enabled === false || target === focusAnimProgress) {
+				focusAnimProgress = target;
+				redraw();
+				return;
+			}
+			const start = focusAnimProgress;
+			const startTime = performance.now();
+			const duration = 180;
+			function frame(now) {
+				const tRaw = Math.min((now - startTime) / duration, 1);
+				focusAnimProgress = start + (target - start) * (1 - Math.pow(1 - tRaw, 3));
+				redraw();
+				if (tRaw < 1) focusAnimFrameId = requestAnimationFrame(frame);
+				else focusAnimFrameId = null;
+			}
+			focusAnimFrameId = requestAnimationFrame(frame);
+		}
+		function stopFocusAnimation() {
+			if (focusAnimFrameId !== null) {
+				cancelAnimationFrame(focusAnimFrameId);
+				focusAnimFrameId = null;
+			}
+		}
 		function snapshotSeriesData(opt) {
 			const map = /* @__PURE__ */ new Map();
-			(opt.series || []).forEach((s) => map.set(s.name, s.data.map((v) => isMissingValue(v) ? 0 : v)));
+			(opt.series || []).forEach((s) => map.set(s.name, (s.data || []).map((v) => isMissingValue(v) ? 0 : v)));
 			return map;
 		}
 		function sameStructure(a, b) {
@@ -465,7 +519,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			const series = (next.series || []).map((s) => {
 				const old = prev.get(s.name);
 				if (!old) return s;
-				const data = s.data.map((v, i) => {
+				const data = (s.data || []).map((v, i) => {
 					if (isMissingValue(v)) return v;
 					const from = old[i + offset] ?? 0;
 					return from + (v - from) * t;
@@ -481,7 +535,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			};
 		}
 		function dataSignature(opt) {
-			const total = (opt.series || []).reduce((sum, s) => sum + s.data.reduce((acc, v) => acc + (isMissingValue(v) ? 0 : v), 0), 0);
+			const total = (opt.series || []).reduce((sum, s) => sum + (s.data || []).reduce((acc, v) => acc + (isMissingValue(v) ? 0 : v), 0), 0);
 			return `${(opt.series || []).length}\u7CFB\u5217/${(opt.labels || []).length}\u7C7B\u76EE/\u03A3${Math.round(total)}`;
 		}
 		function stopTweenAnimation() {
@@ -499,7 +553,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			if (!(nextOptions.series || []).some((s) => {
 				const old = prevSnapshot.get(s.name);
 				if (!old) return false;
-				return s.data.some((v, i) => (isMissingValue(v) ? 0 : v) !== (old[i] ?? 0));
+				return (s.data || []).some((v, i) => (isMissingValue(v) ? 0 : v) !== (old[i] ?? 0));
 			})) return false;
 			stopAnimation();
 			stopHoverAnimation();
@@ -564,31 +618,72 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 				cancelAnimationFrame(hoverAnimFrameId);
 				hoverAnimFrameId = null;
 			}
+			if (hoverRedrawFrameId !== null) {
+				cancelAnimationFrame(hoverRedrawFrameId);
+				hoverRedrawFrameId = null;
+			}
+			hoverAnimDone = null;
+		}
+		let hoverRedrawFrameId = null;
+		function scheduleHoverRedraw() {
+			if (hoverRedrawFrameId !== null) return;
+			hoverRedrawFrameId = requestAnimationFrame(() => {
+				hoverRedrawFrameId = null;
+				redraw();
+			});
 		}
 		function usesHoverAnimation() {
 			const t = props.options.type;
-			return t === "pie" || t === "doughnut" || t === "rose" || t === "sunburst" || t === "treemap";
+			return t === "pie" || t === "doughnut" || t === "rose" || t === "sunburst" || t === "treemap" || t === "radar";
+		}
+		function animatesHoverEnter() {
+			const t = props.options.type;
+			return [
+				"pie",
+				"doughnut",
+				"rose",
+				"radar",
+				"venn",
+				"sankey",
+				"chord",
+				"arc",
+				"bar",
+				"stacked-bar",
+				"horizontal-bar",
+				"waterfall",
+				"mixed",
+				"boxplot",
+				"candle",
+				"heatmap",
+				"calendar-heatmap",
+				"funnel",
+				"gantt"
+			].includes(t);
 		}
 		function clearHover() {
 			if (hoverIndex === -1) return false;
-			hoverIndex = -1;
-			const t = props.options.type;
-			if (t === "pie" || t === "doughnut" || t === "rose") startHoverAnimation(-1);
+			if (animatesHoverEnter()) startHoverAnimation(-1, () => {
+				hoverIndex = -1;
+				redraw();
+			});
 			else {
+				hoverIndex = -1;
 				stopHoverAnimation();
 				hoverAnimProgress = 0;
 				redraw();
 			}
 			return true;
 		}
-		function startHoverAnimation(dir) {
-			if (!usesHoverAnimation()) return;
+		function startHoverAnimation(dir, onDone) {
+			if (!animatesHoverEnter()) return;
 			if (props.options.animation?.enabled === false) {
 				hoverAnimProgress = dir > 0 ? 1 : 0;
 				redraw();
+				if (onDone) onDone();
 				return;
 			}
 			stopHoverAnimation();
+			hoverAnimDone = onDone || null;
 			const duration = 220;
 			const startTime = performance.now();
 			const startProgress = hoverAnimProgress;
@@ -604,7 +699,12 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 				}
 				renderChart(canvasRef.value, buildRenderParams(1));
 				if (tRaw < 1) hoverAnimFrameId = requestAnimationFrame(frame);
-				else hoverAnimFrameId = null;
+				else {
+					hoverAnimFrameId = null;
+					const done = hoverAnimDone;
+					hoverAnimDone = null;
+					if (done) done();
+				}
 			}
 			hoverAnimFrameId = requestAnimationFrame(frame);
 		}
@@ -624,7 +724,12 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			"rose",
 			"radar",
 			"funnel",
-			"scatter"
+			"scatter",
+			"sankey",
+			"chord",
+			"arc",
+			"venn",
+			"candle"
 		];
 		function checkLegendHit(x, y) {
 			const canvas = canvasRef.value;
@@ -636,15 +741,14 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			const theme = getTheme(isDark, props.options.theme, props.options.palette);
 			const width = rect.width;
 			const height = rect.height;
-			const padding = getPadding(effectiveOptions.value, width);
+			const padding = paddingFor(effectiveOptions.value, width);
 			const plotArea = {
 				x: padding.left,
 				y: padding.top,
 				width: width - padding.left - padding.right,
 				height: height - padding.top - padding.bottom
 			};
-			const ctx2d = canvas.getContext("2d");
-			const bounds = getLegendBounds(ctx2d, effectiveOptions.value, plotArea, width, height, theme, hiddenSeries.value);
+			const bounds = legendBoundsFor(canvas.getContext("2d"), effectiveOptions.value, plotArea, width, height, theme, hiddenSeries.value, isDark);
 			for (const bound of bounds) if (canvasX >= bound.x && canvasX <= bound.x + bound.width && canvasY >= bound.y && canvasY <= bound.y + bound.height) return bound.name;
 			return null;
 		}
@@ -689,7 +793,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			const options = effectiveOptions.value;
 			const width = rect.width;
 			const height = rect.height;
-			const padding = getPadding(options, width);
+			const padding = paddingFor(options, width);
 			const plotArea = {
 				x: padding.left,
 				y: padding.top,
@@ -711,12 +815,12 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 				const dx = canvasX - centerX;
 				const dy = canvasY - centerY;
 				const distance = Math.sqrt(dx * dx + dy * dy);
-				const innerRadius = options.type === "doughnut" ? Math.max(0, Math.min(baseRadius - 5, baseRadius * (options.innerRadius || .6))) : 0;
+				const innerRadius = options.type === "doughnut" ? doughnutInnerRadius(baseRadius, options) : 0;
 				let angle = Math.atan2(dy, dx) + Math.PI / 2;
 				if (angle < 0) angle += Math.PI * 2;
 				const total = slices.reduce((sum, d) => sum + d.value, 0);
 				let currentAngle = 0;
-				const maxVal = Math.max(...slices.map((d) => d.value));
+				const maxVal = maxOf(slices.map((d) => d.value));
 				for (let i = 0; i < slices.length; i++) {
 					const sliceAngle = slices[i].value / total * Math.PI * 2;
 					if (angle >= currentAngle && angle < currentAngle + sliceAngle) {
@@ -751,7 +855,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 				const i = Math.floor(relativeY / stepHeight);
 				if (i < 0 || i >= drawData.length) return null;
 				const data = drawData[i];
-				const color = data.color || theme.colors[allFunnel.indexOf(data) % theme.colors.length];
+				const color = funnelStepColor(data, allFunnel.indexOf(data) < 0 ? i : allFunnel.indexOf(data), theme);
 				return {
 					index: i,
 					params: {
@@ -772,14 +876,10 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 				const i = Math.floor((canvasX - plotArea.x) / categoryWidth);
 				if (i < 0 || i >= labels2.length) return null;
 				const wf = options.waterfall || {};
-				const totalIdx = new Set(wf.totalIndices || []);
-				const v = deltas[i] || 0;
-				let cumulative = 0;
-				for (let k = 0; k <= i; k++) {
-					const vk = deltas[k] || 0;
-					cumulative = totalIdx.has(k) ? vk : cumulative + vk;
-				}
-				const isTotal = totalIdx.has(i);
+				const step = waterfallSteps(deltas, wf.totalIndices)[i];
+				const v = step.value;
+				const cumulative = step.to;
+				const isTotal = step.isTotal;
 				const color = isTotal ? wf.totalColor || theme.colors[0] : v >= 0 ? wf.increaseColor || "#dc2626" : wf.decreaseColor || "#16a34a";
 				return {
 					index: i,
@@ -794,27 +894,68 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 				};
 			}
 			if (options.type === "boxplot") {
-				const boxData = options.boxData || [];
-				if (boxData.length === 0) return null;
-				const categoryWidth = plotArea.width / boxData.length;
-				const i = Math.floor((canvasX - plotArea.x) / categoryWidth);
-				if (i < 0 || i >= boxData.length) return null;
-				const b = boxData[i];
-				const color = b.color || theme.colors[i % theme.colors.length];
+				const visible = (options.boxData || []).filter((b) => !(b.group && hiddenSeries.value.has(b.group)) && !hiddenSeries.value.has(b.label));
+				if (visible.length === 0) return null;
+				const showOutliers = options.showOutliers !== false;
+				const allValues = visible.flatMap((b) => [
+					b.min,
+					b.max,
+					...showOutliers ? b.outliers || [] : []
+				]);
+				const axisCfg = options.boxHorizontal ? options.xAxis || {} : options.yAxis || {};
+				const ext = resolveTickExtendedRange(axisCfg.min ?? minOf(allValues), axisCfg.max ?? maxOf(allValues), axisCfg.ticks || 5);
+				return boxplotHitTest(canvasX, canvasY, plotArea, options, theme, hiddenSeries.value, {
+					min: ext.min,
+					max: ext.max
+				});
+			}
+			if (options.type === "calendar-heatmap") return calendarHitTest(canvasX, canvasY, plotArea, options, theme);
+			if (options.type === "sankey") return sankeyHitTest(canvasX, canvasY, plotArea, options, theme, hiddenSeries.value, sankeyLayoutFor(plotArea, options, theme, hiddenSeries.value, isDark));
+			if (options.type === "venn") return vennHitTest(canvasX, canvasY, plotArea, options, theme, hiddenSeries.value);
+			if (options.type === "chord") return chordHitTest(canvasX, canvasY, plotArea, options, theme, hiddenSeries.value);
+			if (options.type === "arc") {
+				if (options.arcCircular === true) return chordHitTest(canvasX, canvasY, plotArea, {
+					...options,
+					chordData: options.arcData,
+					chordMode: "curve"
+				}, theme, hiddenSeries.value);
+				return arcHitTest(canvasX, canvasY, plotArea, options, theme, hiddenSeries.value);
+			}
+			if (options.type === "gantt") return ganttHitTest(canvasX, canvasY, plotArea, options, theme, hiddenSeries.value, ganttLayoutFor(plotArea, options, theme, hiddenSeries.value, isDark));
+			if (options.type === "scatter-matrix") {
+				const fields = options.matrixFields || [];
+				const records = options.matrixData || [];
+				if (fields.length === 0 || records.length === 0) return null;
+				const cells = computeMatrixCells(plotArea, fields);
+				const cell = cells.find((c) => canvasX >= c.x && canvasX <= c.x + c.width && canvasY >= c.y && canvasY <= c.y + c.height);
+				if (!cell || cell.row === cell.col) return null;
+				const extX = matrixFieldExtent(records, cell.xField);
+				const extY = matrixFieldExtent(records, cell.yField);
+				const px = (v) => cell.x + 5 + (v - extX.min) / (extX.max - extX.min) * (cell.width - 10);
+				const py = (v) => cell.y + cell.height - 5 - (v - extY.min) / (extY.max - extY.min) * (cell.height - 10);
+				let nearest = -1;
+				let minDist = Infinity;
+				records.forEach((record, ri) => {
+					const xv = record[cell.xField];
+					const yv = record[cell.yField];
+					if (typeof xv !== "number" || typeof yv !== "number") return;
+					const dist = Math.sqrt((canvasX - px(xv)) ** 2 + (canvasY - py(yv)) ** 2);
+					if (dist < minDist) {
+						minDist = dist;
+						nearest = ri;
+					}
+				});
+				if (nearest < 0 || minDist > 18) return null;
+				const record = records[nearest];
+				const cellIndex = cells.indexOf(cell);
 				return {
-					index: i,
+					index: cellIndex,
 					params: {
-						seriesName: b.label,
-						name: `${b.label}\uFF08\u4E2D\u4F4D\u6570 ${b.median}\uFF09`,
-						value: [
-							b.min,
-							b.q1,
-							b.median,
-							b.q3,
-							b.max
-						],
-						color,
-						dataIndex: i + sliceStartOffset(),
+						seriesName: record.label || `${cell.yField} × ${cell.xField}`,
+						name: `${cell.xField}=${record[cell.xField]}, ${cell.yField}=${record[cell.yField]}`,
+						value: record[cell.yField],
+						color: record.color || theme.colors[0],
+						dataIndex: cellIndex,
 						seriesIndex: 0
 					}
 				};
@@ -886,22 +1027,56 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			if (options.type === "scatter") {
 				const scatterData = options.scatterData || [];
 				if (scatterData.length === 0) return null;
-				const xValues = scatterData.map((d) => d.x);
-				const xMin = Math.min(...xValues);
-				const xRange = Math.max(...xValues) - xMin || 1;
-				const xPadding = xRange * .05;
-				const yValues = scatterData.map((d) => d.y);
+				if (options.facet === true) {
+					const grid = computeFacetGrids(scatterData, plotArea, options);
+					if (!grid) return null;
+					for (const facet of grid.facets) {
+						const a = facet.area;
+						if (canvasX < a.x || canvasX > a.x + a.width || canvasY < a.y || canvasY > a.y + a.height) continue;
+						let nearestLocal = -1;
+						let minDistance = Infinity;
+						facet.data.forEach((point, i) => {
+							const ppx = facet.toX(point.x);
+							const ppy = facet.toY(point.y);
+							const dist = Math.sqrt((canvasX - ppx) ** 2 + (canvasY - ppy) ** 2);
+							if (dist < minDistance) {
+								minDistance = dist;
+								nearestLocal = i;
+							}
+						});
+						if (nearestLocal < 0 || minDistance > 24) return null;
+						const point = facet.data[nearestLocal];
+						const globalIdx = scatterData.indexOf(point);
+						const color = point.color || theme.colors[globalIdx % theme.colors.length];
+						return {
+							index: globalIdx,
+							params: {
+								seriesName: point.group || point.label || `Point ${globalIdx + 1}`,
+								name: `(${point.x}, ${point.y})`,
+								value: point.y,
+								color,
+								dataIndex: globalIdx,
+								seriesIndex: 0
+							}
+						};
+					}
+					return null;
+				}
+				const yValues = scatterData.map((d) => d.y).filter((v) => typeof v === "number" && Number.isFinite(v));
 				const axisConfig = options.yAxis || {};
-				const rawMin = axisConfig.min ?? Math.min(...yValues);
-				const rawMax = axisConfig.max ?? Math.max(...yValues);
+				const rawMin = axisConfig.min ?? (yValues.length ? minOf(yValues) : 0);
+				const rawMax = axisConfig.max ?? (yValues.length ? maxOf(yValues) : 1);
 				const yExt = resolveTickExtendedRange(rawMin, rawMax, axisConfig.ticks || 5);
-				const yPadding = (yExt.max - yExt.min) * .05;
+				const positions = scatterPositionsFor(scatterData, {
+					min: yExt.min,
+					max: yExt.max
+				}, plotArea, options);
+				const groupColors = scatterGroupColors(scatterData, theme);
 				let nearestIndex = -1;
 				let minDistance = Infinity;
 				scatterData.forEach((point, i) => {
-					const px = plotArea.x + (point.x - xMin + xPadding) / (xRange + xPadding * 2) * plotArea.width;
-					const normalizedY = (point.y - yExt.min + yPadding) / (yExt.max - yExt.min + yPadding * 2);
-					const py = plotArea.y + plotArea.height - normalizedY * plotArea.height;
+					if (hiddenSeries.value.has(point.label || `P${i + 1}`) || point.group && hiddenSeries.value.has(point.group)) return;
+					const [px, py] = positions[i];
 					const dist = Math.sqrt((canvasX - px) ** 2 + (canvasY - py) ** 2);
 					if (dist < minDistance) {
 						minDistance = dist;
@@ -910,11 +1085,11 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 				});
 				if (nearestIndex >= 0 && minDistance < 30) {
 					const point = scatterData[nearestIndex];
-					const color = point.color || theme.colors[nearestIndex % theme.colors.length];
+					const color = point.color || (point.group && groupColors.has(point.group) ? groupColors.get(point.group) : theme.colors[nearestIndex % theme.colors.length]);
 					return {
 						index: nearestIndex,
 						params: {
-							seriesName: point.label || `Point ${nearestIndex + 1}`,
+							seriesName: point.label || point.group || `Point ${nearestIndex + 1}`,
 							name: `(${point.x}, ${point.y})`,
 							value: point.y,
 							color,
@@ -944,6 +1119,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 							candle.high,
 							candle.low
 						],
+						volume: (options.volumeData || [])[i],
 						color,
 						dataIndex: i,
 						seriesIndex: 0
@@ -1062,13 +1238,23 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 				const centerY = plotArea.y + plotArea.height / 2;
 				const radius = Math.max(40, Math.min(plotArea.width, plotArea.height) / 2 - 30);
 				const angleStep = Math.PI * 2 / indicators.length;
+				const labelOffset = options.radarLabelOffset ?? 12;
+				let labelHit = -1;
+				indicators.forEach((indicator, i) => {
+					if (labelHit >= 0) return;
+					const angle = i * angleStep - Math.PI / 2;
+					const lx = centerX + Math.cos(angle) * (radius + labelOffset);
+					const ly = centerY + Math.sin(angle) * (radius + labelOffset);
+					if (Math.sqrt((canvasX - lx) ** 2 + (canvasY - ly) ** 2) <= 18) labelHit = i;
+				});
+				if (labelHit >= 0) return radarAxisHover(labelHit, indicators, series, options, theme);
 				let nearestIndex = -1;
 				let minDist = Infinity;
 				indicators.forEach((_, i) => {
 					const angle = i * angleStep - Math.PI / 2;
 					const ind = indicators[i];
 					const span = ind.max - (ind.min || 0);
-					const maxR = span > 0 ? Math.max(...series.map((s) => radius * (Math.max(0, (s.data[i] || 0) - (ind.min || 0)) / span))) : 0;
+					const maxR = span > 0 ? maxOf(series.map((s) => radius * (Math.max(0, (s.data[i] || 0) - (ind.min || 0)) / span))) : 0;
 					const px = centerX + Math.cos(angle) * maxR;
 					const py = centerY + Math.sin(angle) * maxR;
 					const dist = Math.sqrt((canvasX - px) ** 2 + (canvasY - py) ** 2);
@@ -1078,18 +1264,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 					}
 				});
 				if (nearestIndex < 0 || minDist > 30) return null;
-				const params = series.map((s, sIdx) => ({
-					seriesName: s.name,
-					name: indicators[nearestIndex].name,
-					value: s.data[nearestIndex],
-					color: s.color || theme.colors[options.series.indexOf(s) % theme.colors.length],
-					dataIndex: nearestIndex,
-					seriesIndex: sIdx
-				}));
-				return {
-					index: nearestIndex,
-					params
-				};
+				return radarAxisHover(nearestIndex, indicators, series, options, theme);
 			}
 			const labels = options.labels || [];
 			if (labels.length === 0) return null;
@@ -1097,6 +1272,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			if (dataIndex < 0 || dataIndex >= labels.length) return null;
 			const visibleSeries = (options.series || []).filter((s) => !hiddenSeries.value.has(s.name));
 			if (visibleSeries.length === 0) return null;
+			const volume = (options.volumeData || [])[dataIndex];
 			if (props.options.tooltip?.showAllSeries !== false && visibleSeries.length > 1) {
 				if (visibleSeries.every((s) => isMissingValue(s.data[dataIndex]))) return null;
 				return {
@@ -1105,6 +1281,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 						seriesName: s.name,
 						name: labels[dataIndex],
 						value: s.data[dataIndex],
+						volume,
 						color: s.color || theme.colors[options.series.indexOf(s) % theme.colors.length],
 						dataIndex: dataIndex + sliceStartOffset(),
 						seriesIndex: sIdx
@@ -1120,6 +1297,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 						seriesName: series.name,
 						name: labels[dataIndex],
 						value: series.data[dataIndex],
+						volume,
 						color,
 						dataIndex: dataIndex + sliceStartOffset(),
 						seriesIndex: 0
@@ -1127,6 +1305,20 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 				};
 			}
 		}
+		/** 雷达轴悬浮：返回该维度上全部可见系列的 tooltip 行 */
+		function radarAxisHover(axisIndex, indicators, series, options, theme) {
+			return {
+				index: axisIndex,
+				params: series.map((s, sIdx) => ({
+					seriesName: s.name,
+					name: indicators[axisIndex].name,
+					value: s.data[axisIndex],
+					color: s.color || theme.colors[(options.radarSeries || []).indexOf(s) % theme.colors.length],
+					dataIndex: axisIndex,
+					seriesIndex: sIdx
+				}))
+			};
+		}
 		function setZoomRange(next) {
 			const minSpan = INTERACTION.zoom.minSpan;
 			let { start, end } = next;
@@ -1153,7 +1345,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			const canvas = canvasRef.value;
 			if (!canvas) return null;
 			const rect = canvas.getBoundingClientRect();
-			const padding = getPadding(effectiveOptions.value, rect.width);
+			const padding = paddingFor(effectiveOptions.value, rect.width);
 			const plotArea = {
 				x: padding.left,
 				y: padding.top,
@@ -1217,7 +1409,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 					const rect = canvas.getBoundingClientRect();
 					const x = e.clientX - rect.left;
 					const y = e.clientY - rect.top;
-					const padding = getPadding(effectiveOptions.value, rect.width);
+					const padding = paddingFor(effectiveOptions.value, rect.width);
 					if (x >= padding.left && x <= padding.left + (rect.width - padding.left - padding.right) && y >= padding.top && y <= padding.top + (rect.height - padding.top - padding.bottom)) {
 						touchPanning = true;
 						touchPanStartX = x;
@@ -1240,7 +1432,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			const x = e.clientX - rect.left;
 			const y = e.clientY - rect.top;
 			if (props.options.brush?.enabled === true) {
-				const padding = getPadding(effectiveOptions.value, rect.width);
+				const padding = paddingFor(effectiveOptions.value, rect.width);
 				const plotArea = {
 					x: padding.left,
 					y: padding.top,
@@ -1335,7 +1527,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 					const labels = options.labels || [];
 					if (canvas && labels.length > 0) {
 						const rect = canvas.getBoundingClientRect();
-						const padding = getPadding(options, rect.width);
+						const padding = paddingFor(options, rect.width);
 						const plotArea = {
 							x: padding.left,
 							y: padding.top,
@@ -1378,7 +1570,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			const rect = canvas.getBoundingClientRect();
 			const x = e.clientX - rect.left;
 			const y = e.clientY - rect.top;
-			const padding = getPadding(effectiveOptions.value, rect.width);
+			const padding = paddingFor(effectiveOptions.value, rect.width);
 			const plotArea = {
 				x: padding.left,
 				y: padding.top,
@@ -1444,7 +1636,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 				const nextFocus = props.options.legend?.hoverEmphasis !== false && legendName ? legendName : null;
 				if (nextFocus !== focusSeries.value) {
 					focusSeries.value = nextFocus;
-					redraw();
+					animateFocusProgress();
 				}
 			}
 			if (legendName) {
@@ -1454,13 +1646,13 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			}
 			if (e.pointerType === "touch") return;
 			const result = getHoveredData(e.clientX, e.clientY);
-			const isPieLike = props.options.type === "pie" || props.options.type === "doughnut" || props.options.type === "rose";
+			const enterAnimated = animatesHoverEnter();
 			if (result && props.options.tooltip?.show !== false) {
 				const newIndex = result.index;
 				if (newIndex !== hoverIndex) {
 					const prevIndex = hoverIndex;
 					hoverIndex = newIndex;
-					if (isPieLike) {
+					if (enterAnimated) {
 						if (prevIndex === -1) startHoverAnimation(1);
 						else {
 							stopHoverAnimation();
@@ -1470,8 +1662,8 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 					} else if (usesHoverAnimation()) {
 						stopHoverAnimation();
 						hoverAnimProgress = 1;
-						redraw();
-					} else redraw();
+						scheduleHoverRedraw();
+					} else scheduleHoverRedraw();
 					if (prevIndex === -1) {
 						const emitParams = Array.isArray(result.params) ? result.params[0] : result.params;
 						emit("hover", {
@@ -1484,7 +1676,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 						});
 						ariaLiveText.value = `${emitParams.seriesName}: ${formatTooltipValue(emitParams.value)}`;
 					}
-				}
+				} else if (enterAnimated && hoverAnimProgress < 1) startHoverAnimation(1);
 				applyTooltipContent(result.params);
 				if (props.options.tooltip?.trigger === "click") return;
 				lastMouseClientX = e.clientX;
@@ -1531,6 +1723,9 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			}
 			return Number.isInteger(value) ? value.toString() : parseFloat(value.toFixed(4)).toString();
 		}
+		function escapeHtml(value) {
+			return String(value).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
+		}
 		function applyTooltipContent(params) {
 			const formatter = props.options.tooltip?.formatter;
 			if (formatter) {
@@ -1541,23 +1736,23 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 				const title = params[0]?.name || "";
 				const rows = pickTooltipRows(params).map((p) => `
       <div class="ev-chart__tooltip-item">
-        <span class="ev-chart__tooltip-dot" style="background: ${p.color}"></span>
-        <span class="ev-chart__tooltip-name">${p.seriesName}</span>
-        <span class="ev-chart__tooltip-value">${formatTooltipValue(p.value)}</span>
+        <span class="ev-chart__tooltip-dot" style="background: ${escapeHtml(p.color)}"></span>
+        <span class="ev-chart__tooltip-name">${escapeHtml(p.seriesName)}</span>
+        <span class="ev-chart__tooltip-value">${escapeHtml(formatTooltipValue(p.value))}</span>
       </div>
     `).join("");
 				tooltipContent.value = `
-      <div class="ev-chart__tooltip-title">${title}</div>
+      <div class="ev-chart__tooltip-title">${escapeHtml(title)}</div>
       ${rows}
     `;
 			} else {
 				const p = params;
 				tooltipContent.value = `
-      <div class="ev-chart__tooltip-title">${p.name}</div>
+      <div class="ev-chart__tooltip-title">${escapeHtml(p.name)}</div>
       <div class="ev-chart__tooltip-item">
-        <span class="ev-chart__tooltip-dot" style="background: ${p.color}"></span>
-        <span class="ev-chart__tooltip-name">${p.seriesName}</span>
-        <span class="ev-chart__tooltip-value">${formatTooltipValue(p.value)}</span>
+        <span class="ev-chart__tooltip-dot" style="background: ${escapeHtml(p.color)}"></span>
+        <span class="ev-chart__tooltip-name">${escapeHtml(p.seriesName)}</span>
+        <span class="ev-chart__tooltip-value">${escapeHtml(formatTooltipValue(p.value))}</span>
       </div>
     `;
 			}
@@ -1574,7 +1769,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			else if (checkToolboxHit(e.clientX, e.clientY)) zone = "toolbox";
 			else if (checkLegendHit(e.clientX, e.clientY)) zone = "legend";
 			else {
-				const padding = getPadding(effectiveOptions.value, rect.width);
+				const padding = paddingFor(effectiveOptions.value, rect.width);
 				if (x >= padding.left && x <= rect.width - padding.right && y >= padding.top && y <= rect.height - padding.bottom) zone = "plot";
 				else {
 					const slider = getSliderGeo();
@@ -1615,6 +1810,67 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 				ariaLiveText.value = "";
 			}
 		}
+		const KEYNAV_TYPES = /* @__PURE__ */ new Set([
+			"line",
+			"area",
+			"bar",
+			"stacked-bar",
+			"waterfall",
+			"mixed",
+			"horizontal-bar"
+		]);
+		let keyboardClientX = -1;
+		let keyboardClientY = -1;
+		function handleChartKeydown(e) {
+			const options = props.options;
+			if (!KEYNAV_TYPES.has(options.type)) return;
+			const count = (options.labels || []).length;
+			if (count === 0) return;
+			if (e.key === "Enter" || e.key === " ") {
+				e.preventDefault();
+				if (hoverIndex < 0 || keyboardClientX < 0) return;
+				const result = getHoveredData(keyboardClientX, keyboardClientY);
+				if (result) {
+					const params = Array.isArray(result.params) ? result.params[0] : result.params;
+					emit("click", params);
+				}
+				return;
+			}
+			const horizontal = options.type === "horizontal-bar";
+			let i = hoverIndex;
+			if (e.key === "Home") i = 0;
+			else if (e.key === "End") i = count - 1;
+			else if (horizontal && e.key === "ArrowUp") i = hoverIndex < 0 ? 0 : Math.min(count - 1, hoverIndex + 1);
+			else if (horizontal && e.key === "ArrowDown") i = hoverIndex < 0 ? 0 : Math.max(0, hoverIndex - 1);
+			else if (!horizontal && e.key === "ArrowRight") i = hoverIndex < 0 ? 0 : Math.min(count - 1, hoverIndex + 1);
+			else if (!horizontal && e.key === "ArrowLeft") i = hoverIndex < 0 ? 0 : Math.max(0, hoverIndex - 1);
+			else return;
+			e.preventDefault();
+			if (i === hoverIndex) return;
+			const canvas = canvasRef.value;
+			if (!canvas) return;
+			const rect = canvas.getBoundingClientRect();
+			const padding = paddingFor(effectiveOptions.value, rect.width);
+			const plotWidth = rect.width - padding.left - padding.right;
+			const plotHeight = rect.height - padding.top - padding.bottom;
+			const clientX = horizontal ? rect.left + padding.left + plotWidth / 2 : rect.left + padding.left + (i + .5) * (plotWidth / count);
+			const clientY = horizontal ? rect.top + padding.top + plotHeight - (i + .5) * (plotHeight / count) : rect.top + padding.top + plotHeight / 2;
+			keyboardClientX = clientX;
+			keyboardClientY = clientY;
+			mouseX = clientX - rect.left;
+			mouseY = clientY - rect.top;
+			handlePointerMove({
+				clientX,
+				clientY,
+				pointerType: "mouse"
+			});
+		}
+		function handleFocusOut() {
+			if (clearTransientState()) {
+				emit("unhover");
+				ariaLiveText.value = "";
+			}
+		}
 		let resizeObserver = null;
 		function setupResizeObserver() {
 			if (!props.responsive) return;
@@ -1662,7 +1918,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 				labels: [...opt.labels || []],
 				series: (opt.series || []).map((s) => ({
 					...s,
-					data: [...s.data]
+					data: [...s.data || []]
 				}))
 			};
 		}
@@ -1691,9 +1947,17 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 		watch(() => props.options, (next) => {
 			cachedDataExtent = null;
 			cachedPlotArea = null;
+			cachedPadding = null;
+			scatterHitCache = null;
+			legendBoundsCache = null;
+			ganttLayoutCache = null;
+			sankeyLayoutCache = null;
 			internalError.value = null;
 			runDevValidation();
-			focusSeries.value = emphasisSeriesName.value;
+			if (focusSeries.value !== emphasisSeriesName.value) {
+				focusSeries.value = emphasisSeriesName.value;
+				animateFocusProgress();
+			}
 			syncScenes();
 			const zoom = getDataZoomConfig(props.options);
 			const zoomKey = zoom ? JSON.stringify({
@@ -1747,6 +2011,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 		};
 		let unregisterConnector = null;
 		onMounted(() => {
+			focusSeries.value = emphasisSeriesName.value;
 			render(true);
 			syncScenes();
 			setupResizeObserver();
@@ -1771,6 +2036,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			stopHoverAnimation();
 			stopTweenAnimation();
 			stopSceneTimer();
+			stopFocusAnimation();
 			if (tooltipRafId !== null) {
 				cancelAnimationFrame(tooltipRafId);
 				tooltipRafId = null;
@@ -1779,11 +2045,98 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 		});
 		let cachedDataExtent = null;
 		let cachedPlotArea = null;
+		let cachedPadding = null;
+		function paddingFor(options, width) {
+			if (cachedPadding && cachedPadding.options === options && cachedPadding.width === width) return cachedPadding.value;
+			const value = getPadding(options, width);
+			cachedPadding = {
+				options,
+				width,
+				value
+			};
+			return value;
+		}
+		let scatterHitCache = null;
+		function scatterPositionsFor(scatterData, yRange, plotArea, options) {
+			const c = scatterHitCache;
+			if (c && c.scatterData === scatterData && c.options === options && c.yMin === yRange.min && c.yMax === yRange.max && c.px === plotArea.x && c.py === plotArea.y && c.pw === plotArea.width && c.ph === plotArea.height) return c.positions;
+			const positions = scatterPointPositions(scatterData, yRange, plotArea, options);
+			scatterHitCache = {
+				scatterData,
+				options,
+				yMin: yRange.min,
+				yMax: yRange.max,
+				px: plotArea.x,
+				py: plotArea.y,
+				pw: plotArea.width,
+				ph: plotArea.height,
+				positions
+			};
+			return positions;
+		}
+		let legendBoundsCache = null;
+		function legendBoundsFor(ctx2d, options, plotArea, width, height, theme, hiddenSeries, isDark) {
+			const c = legendBoundsCache;
+			if (c && c.options === options && c.width === width && c.height === height && c.dark === isDark && c.hidden === hiddenSeries && c.px === plotArea.x && c.py === plotArea.y && c.pw === plotArea.width && c.ph === plotArea.height) return c.bounds;
+			const bounds = getLegendBounds(ctx2d, options, plotArea, width, height, theme, hiddenSeries);
+			legendBoundsCache = {
+				options,
+				width,
+				height,
+				dark: isDark,
+				hidden: hiddenSeries,
+				px: plotArea.x,
+				py: plotArea.y,
+				pw: plotArea.width,
+				ph: plotArea.height,
+				bounds
+			};
+			return bounds;
+		}
+		let ganttLayoutCache = null;
+		function ganttLayoutFor(plotArea, options, theme, hiddenSeries, isDark) {
+			const c = ganttLayoutCache;
+			if (c && c.options === options && c.dark === isDark && c.hidden === hiddenSeries && c.px === plotArea.x && c.py === plotArea.y && c.pw === plotArea.width && c.ph === plotArea.height) return c.layout;
+			const layout = computeGanttLayout(plotArea, options, theme, hiddenSeries);
+			ganttLayoutCache = {
+				options,
+				dark: isDark,
+				hidden: hiddenSeries,
+				px: plotArea.x,
+				py: plotArea.y,
+				pw: plotArea.width,
+				ph: plotArea.height,
+				layout
+			};
+			return layout;
+		}
+		let sankeyLayoutCache = null;
+		function sankeyLayoutFor(plotArea, options, theme, hiddenSeries, isDark) {
+			const c = sankeyLayoutCache;
+			if (c && c.options === options && c.dark === isDark && c.hidden === hiddenSeries && c.px === plotArea.x && c.py === plotArea.y && c.pw === plotArea.width && c.ph === plotArea.height) return c.layout;
+			const layout = computeSankeyLayout(plotArea, options, theme, hiddenSeries);
+			sankeyLayoutCache = {
+				options,
+				dark: isDark,
+				hidden: hiddenSeries,
+				px: plotArea.x,
+				py: plotArea.y,
+				pw: plotArea.width,
+				ph: plotArea.height,
+				layout
+			};
+			return layout;
+		}
 		__expose({
 			refresh: () => render(true),
 			update(newOptions) {
 				Object.assign(props.options, newOptions);
 				cachedDataExtent = null;
+				cachedPadding = null;
+				scatterHitCache = null;
+				legendBoundsCache = null;
+				ganttLayoutCache = null;
+				sankeyLayoutCache = null;
 				specVersion.value++;
 				debouncedRender(true);
 			},
@@ -1793,9 +2146,18 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			destroy() {
 				cleanupResizeObserver();
 				cleanupDarkModeObserver();
+				window.removeEventListener("pointerup", onWindowPointerUp);
+				window.removeEventListener("keydown", handleEscapeKey);
+				containerRef.value?.removeEventListener("wheel", handleWheel);
+				if (unregisterConnector) {
+					unregisterConnector();
+					unregisterConnector = null;
+				}
 				stopAnimation();
 				stopHoverAnimation();
+				stopTweenAnimation();
 				stopSceneTimer();
+				stopFocusAnimation();
 				if (tooltipRafId !== null) {
 					cancelAnimationFrame(tooltipRafId);
 					tooltipRafId = null;
@@ -1871,7 +2233,7 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 				};
 				const width = canvas.width / dpr.value;
 				const height = canvas.height / dpr.value;
-				const padding = getPadding(effectiveOptions.value, width);
+				const padding = paddingFor(effectiveOptions.value, width);
 				cachedPlotArea = {
 					x: padding.left,
 					y: padding.top,
@@ -2005,7 +2367,10 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 				class: "ev-chart",
 				style: normalizeStyle([containerStyle.value, { cursor: cursorStyle.value }]),
 				role: "img",
-				"aria-label": props.options.ariaLabel || ariaLabelText.value
+				tabindex: isEmpty.value || internalError.value ? -1 : 0,
+				"aria-label": props.options.ariaLabel || ariaLabelText.value,
+				onKeydown: handleChartKeydown,
+				onFocusout: handleFocusOut
 			}, [
 				!isEmpty.value && !internalError.value ? (openBlock(), createElementBlock("canvas", {
 					key: 0,
@@ -2084,10 +2449,10 @@ var chart_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 					_: 1
 				}),
 				createElementVNode("div", _hoisted_11, toDisplayString(ariaLiveText.value), 1)
-			], 12, _hoisted_1);
+			], 44, _hoisted_1);
 		};
 	}
-}), [["__scopeId", "data-v-04ce6a3d"]]);
+}), [["__scopeId", "data-v-62da63e1"]]);
 //#endregion
 //#region src/useChart.js
 var USE_CHART_KEY = /* @__PURE__ */ Symbol("ev-chart-context");