@agions/taroviz 1.7.0 → 1.10.0

package/dist/esm/index.js

@@ -346,6 +346,21 @@ var H5Adapter = /** @class */function () {
       this.instance = null;
     }
   };
+  /**
+   * 触发图表行为
+   */
+  H5Adapter.prototype.dispatchAction = function (payload) {
+    if (this.instance) {
+      this.instance.dispatchAction(payload);
+    }
+  };
+  /**
+   * 获取DataURL
+   */
+  H5Adapter.prototype.getDataURL = function (opts) {
+    var _a;
+    return (_a = this.instance) === null || _a === void 0 ? void 0 : _a.getDataURL(opts);
+  };
   /**
    * 处理图表大小变化
    */
@@ -685,16 +700,12 @@ var ChartEventType;
   ChartEventType["BRUSHSELECTED"] = "brushselected";
   ChartEventType["RENDERED"] = "rendered";
   ChartEventType["FINISHED"] = "finished";
-  // 自定义事件
   ChartEventType["CHART_READY"] = "chartReady";
   ChartEventType["CHART_RESIZE"] = "chartResize";
   ChartEventType["CHART_ERROR"] = "chartError";
   ChartEventType["CHART_DISPOSE"] = "chartDispose";
 })(ChartEventType || (ChartEventType = {}));
 ;// ./src/core/types/platform.ts
-/**
- * 支持的平台类型
- */
 var PlatformType;
 (function (PlatformType) {
   PlatformType["H5"] = "h5";
@@ -1579,43 +1590,171 @@ var __generator = undefined && undefined.__generator || function (thisArg, body)
 /**
  * 基础图表包装组件
  * 提供统一的图表初始化、渲染和生命周期管理
+ *
+ * 无障碍支持 (WCAG):
+ * - role="application" + keyboard navigation for zoom/pan
+ * - Hidden data table with aria-live for screen readers
+ * - Respects prefers-reduced-motion
  */
 
 
 
 
-/**
- * 基础图表包装组件
- * 提供统一的图表初始化、渲染和生命周期管理
- */
+/** Extract series data from an ECharts option for screen reader exposure */
+function extractSeriesData(option) {
+  var opt = option;
+  if (!(opt === null || opt === void 0 ? void 0 : opt.series) || !Array.isArray(opt.series)) return [];
+  return opt.series.filter(function (s) {
+    return (s === null || s === void 0 ? void 0 : s.data) && Array.isArray(s.data);
+  }).map(function (s) {
+    return {
+      name: s.name || '系列',
+      data: s.data
+    };
+  });
+}
+/** Build a human-readable aria-label from chart option */
+function buildAriaLabel(chartType, option) {
+  var seriesData = extractSeriesData(option);
+  if (!seriesData.length) {
+    return chartType === 'chart' ? '空图表' : "".concat(chartType, " \u7A7A\u56FE\u8868");
+  }
+  var totalPoints = seriesData.reduce(function (sum, s) {
+    return sum + s.data.length;
+  }, 0);
+  var seriesNames = seriesData.map(function (s) {
+    return s.name;
+  }).join('、');
+  return "".concat(chartType, "\u56FE\u8868\uFF0C\u5305\u542B").concat(seriesData.length, "\u4E2A\u7CFB\u5217\uFF08").concat(seriesNames, "\uFF09\uFF0C\u5171").concat(totalPoints, "\u4E2A\u6570\u636E\u70B9");
+}
+// ─── Keyboard navigation step sizes ───────────────────────────────────────
+var ZOOM_STEP = 5; // % per key press
+var PAN_STEP = 10; // % pan per arrow key
 var BaseChartWrapper = function (_a) {
+  var _b, _c;
   var option = _a.option,
-    _b = _a.width,
-    width = _b === void 0 ? '100%' : _b,
-    _c = _a.height,
-    height = _c === void 0 ? '300px' : _c,
+    _d = _a.width,
+    width = _d === void 0 ? '100%' : _d,
+    _e = _a.height,
+    height = _e === void 0 ? '300px' : _e,
     theme = _a.theme,
-    _d = _a.style,
-    style = _d === void 0 ? {} : _d,
-    _e = _a.className,
-    className = _e === void 0 ? '' : _e,
-    _f = _a.autoResize,
-    autoResize = _f === void 0 ? true : _f,
-    _g = _a.loading,
-    loading = _g === void 0 ? false : _g,
+    _f = _a.style,
+    style = _f === void 0 ? {} : _f,
+    _g = _a.className,
+    className = _g === void 0 ? '' : _g,
+    _h = _a.autoResize,
+    autoResize = _h === void 0 ? true : _h,
+    _j = _a.loading,
+    loading = _j === void 0 ? false : _j,
     loadingOption = _a.loadingOption,
     onChartInit = _a.onChartInit,
     onChartReady = _a.onChartReady,
-    _h = _a.renderer,
-    renderer = _h === void 0 ? 'canvas' : _h,
-    _j = _a.onEvents,
-    onEvents = _j === void 0 ? {} : _j,
-    _k = _a.chartType,
-    chartType = _k === void 0 ? 'chart' : _k;
+    _k = _a.renderer,
+    renderer = _k === void 0 ? 'canvas' : _k,
+    _l = _a.onEvents,
+    onEvents = _l === void 0 ? {} : _l,
+    _m = _a.chartType,
+    chartType = _m === void 0 ? 'chart' : _m;
   var chartId = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)("".concat(chartType, "-").concat((0,_core_utils__WEBPACK_IMPORTED_MODULE_2__/* .uuid */ .uR)()));
   var chartInstance = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);
   var containerRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);
-  // 使用 useMemo 缓存适配器配置，并处理类型问题
+  var isMountedRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(true);
+  var cleanupRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);
+  var tableId = (0,react__WEBPACK_IMPORTED_MODULE_0__.useId)(); // unique id for aria-describedby
+  var seriesData = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(function () {
+    return extractSeriesData(option);
+  }, [option]);
+  var ariaLabel = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(function () {
+    return buildAriaLabel(chartType, option);
+  }, [chartType, option]);
+  // Keyboard handler for zoom/pan — attached to the chart container
+  var handleKeyDown = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function (e) {
+    var _a, _b, _c, _d, _e, _f;
+    var instance = chartInstance.current;
+    if (!instance) return;
+    // ECharts dataZoom dispatch — works for any chart with dataZoom axis
+    var dispatchZoom = function (startDelta, endDelta) {
+      instance.dispatchAction({
+        type: 'dataZoom',
+        startDelta: startDelta,
+        endDelta: endDelta
+      });
+    };
+    // Home = reset zoom to full range
+    if (e.key === 'Home') {
+      e.preventDefault();
+      instance.dispatchAction({
+        type: 'dataZoom',
+        start: 0,
+        end: 100
+      });
+      return;
+    }
+    switch (e.key) {
+      case '+':
+      case '=':
+        {
+          e.preventDefault();
+          // Zoom in (narrow range) — decrease end by ZOOM_STEP
+          var end = instance.getOption();
+          var dz = (_a = end === null || end === void 0 ? void 0 : end.dataZoom) === null || _a === void 0 ? void 0 : _a[0];
+          if (dz) {
+            var newEnd = Math.max(0, ((_b = dz.end) !== null && _b !== void 0 ? _b : 100) - ZOOM_STEP);
+            var newStart = Math.max(0, ((_c = dz.start) !== null && _c !== void 0 ? _c : 0) - ZOOM_STEP);
+            instance.dispatchAction({
+              type: 'dataZoom',
+              start: newStart,
+              end: newEnd
+            });
+          }
+          break;
+        }
+      case '-':
+      case '_':
+        {
+          e.preventDefault();
+          // Zoom out (expand range) — increase end by ZOOM_STEP
+          var end = instance.getOption();
+          var dz = (_d = end === null || end === void 0 ? void 0 : end.dataZoom) === null || _d === void 0 ? void 0 : _d[0];
+          if (dz) {
+            var newEnd = Math.min(100, ((_e = dz.end) !== null && _e !== void 0 ? _e : 100) + ZOOM_STEP);
+            var newStart = Math.min(((_f = dz.start) !== null && _f !== void 0 ? _f : 0) + ZOOM_STEP, newEnd);
+            instance.dispatchAction({
+              type: 'dataZoom',
+              start: newStart,
+              end: newEnd
+            });
+          }
+          break;
+        }
+      case 'ArrowLeft':
+        {
+          e.preventDefault();
+          dispatchZoom(-PAN_STEP, 0);
+          break;
+        }
+      case 'ArrowRight':
+        {
+          e.preventDefault();
+          dispatchZoom(PAN_STEP, 0);
+          break;
+        }
+      case 'ArrowUp':
+        {
+          e.preventDefault();
+          dispatchZoom(0, -PAN_STEP);
+          break;
+        }
+      case 'ArrowDown':
+        {
+          e.preventDefault();
+          dispatchZoom(0, PAN_STEP);
+          break;
+        }
+      // No default — let other keys pass through for accessibility tools
+    }
+  }, []);
+  // Use memo to cache adapter config
   var adapterConfig = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(function () {
     return (0,_utils__WEBPACK_IMPORTED_MODULE_3__/* .processAdapterConfig */ .X)({
       canvasId: chartId.current,
@@ -1628,8 +1767,9 @@ var BaseChartWrapper = function (_a) {
       option: option
     });
   }, [width, height, theme, autoResize, renderer, option]);
-  // 处理图表初始化
+  // Handle chart initialization
   (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {
+    isMountedRef.current = true;
     var initChart = function () {
       return __awaiter(void 0, void 0, void 0, function () {
         var initConfig, adapter;
@@ -1638,18 +1778,21 @@ var BaseChartWrapper = function (_a) {
             case 0:
               initConfig = (0,_utils__WEBPACK_IMPORTED_MODULE_3__/* .processAdapterConfig */ .X)(__assign(__assign({}, adapterConfig), {
                 onInit: function (instance) {
+                  if (!isMountedRef.current) {
+                    instance.dispose();
+                    return;
+                  }
                   chartInstance.current = instance;
-                  // 绑定事件
                   if (onEvents) {
-                    Object.keys(onEvents).forEach(function (eventName) {
-                      instance.on(eventName, onEvents[eventName]);
+                    Object.entries(onEvents).forEach(function (_a) {
+                      var eventName = _a[0],
+                        handler = _a[1];
+                      instance.on(eventName, handler);
                     });
                   }
-                  // 初始化回调
                   if (onChartInit) {
                     onChartInit(instance);
                   }
-                  // 准备好回调
                   if (onChartReady) {
                     onChartReady(instance);
                   }
@@ -1658,41 +1801,43 @@ var BaseChartWrapper = function (_a) {
               return [4 /*yield*/, (0,_adapters__WEBPACK_IMPORTED_MODULE_1__/* .getAdapter */ .cK)(initConfig)];
             case 1:
               adapter = _a.sent();
+              if (!isMountedRef.current) {
+                return [2 /*return*/];
+              }
               adapter.init();
-              // 返回清理函数
-              return [2 /*return*/, function () {
+              cleanupRef.current = function () {
                 if (chartInstance.current) {
-                  // 解绑事件
                   if (onEvents) {
-                    Object.keys(onEvents).forEach(function (eventName) {
-                      var _a;
-                      (_a = chartInstance.current) === null || _a === void 0 ? void 0 : _a.off(eventName);
+                    Object.entries(onEvents).forEach(function (_a) {
+                      var eventName = _a[0];
+                      chartInstance.current.off(eventName);
                     });
                   }
                   chartInstance.current.dispose();
                   chartInstance.current = null;
                 }
-              }];
+              };
+              return [2 /*return*/];
           }
         });
       });
     };
-    // 执行异步初始化并获取清理函数
-    var cleanupPromise = initChart();
-    // 返回清理函数
+    initChart();
     return function () {
-      cleanupPromise.then(function (cleanup) {
-        return cleanup === null || cleanup === void 0 ? void 0 : cleanup();
-      });
+      isMountedRef.current = false;
+      if (cleanupRef.current) {
+        cleanupRef.current();
+        cleanupRef.current = null;
+      }
     };
   }, [adapterConfig, onChartInit, onChartReady, onEvents]);
-  // 更新配置
+  // Update config
   (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {
     if (chartInstance.current && option) {
       chartInstance.current.setOption(option, true);
     }
   }, [option]);
-  // 控制加载状态
+  // Loading state
   (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {
     if (chartInstance.current) {
       if (loading) {
@@ -1702,16 +1847,51 @@ var BaseChartWrapper = function (_a) {
       }
     }
   }, [loading, loadingOption]);
-  // 自定义样式
+  // Merged style
   var mergedStyle = __assign({
     width: typeof width === 'number' ? "".concat(width, "px") : width,
     height: typeof height === 'number' ? "".concat(height, "px") : height
   }, style);
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("table", {
+    id: tableId,
+    "aria-label": "".concat(chartType, " \u56FE\u8868\u6570\u636E"),
+    style: {
+      position: 'absolute',
+      width: 1,
+      height: 1,
+      overflow: 'hidden',
+      clip: 'rect(0,0,0,0)',
+      clipPath: 'inset(50%)',
+      whiteSpace: 'nowrap'
+    },
+    "aria-live": "polite",
+    "aria-atomic": "false"
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("caption", null, ariaLabel), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("thead", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("tr", null, seriesData.map(function (s, i) {
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("th", {
+      key: i,
+      scope: "col"
+    }, s.name);
+  }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("tbody", null, Array.from({
+    length: Math.min(20, (_c = (_b = seriesData[0]) === null || _b === void 0 ? void 0 : _b.data.length) !== null && _c !== void 0 ? _c : 0)
+  }).map(function (_, rowIdx) {
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("tr", {
+      key: rowIdx
+    }, seriesData.map(function (s, colIdx) {
+      var _a;
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("td", {
+        key: colIdx
+      }, String((_a = s.data[rowIdx]) !== null && _a !== void 0 ? _a : ''));
+    }));
+  }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
     className: "taroviz-".concat(chartType, " ").concat(className),
     style: mergedStyle,
-    ref: containerRef
-  });
+    ref: containerRef,
+    role: "application",
+    "aria-label": ariaLabel,
+    "aria-describedby": tableId,
+    tabIndex: 0,
+    onKeyDown: handleKeyDown
+  }));
 };
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (BaseChartWrapper);
 
@@ -2212,20 +2392,31 @@ var __assign = undefined && undefined.__assign || function () {
   return __assign.apply(this, arguments);
 };
 /**
- * 动画预设集合
+ * Checks the OS/browser prefers-reduced-motion setting.
+ * Returns true if the user has requested reduced motion.
+ */
+function prefersReducedMotion() {
+  if (typeof window === 'undefined') return false;
+  return window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+}
+/**
+ * Professional animation presets following frontend-design-pro skill guidelines:
+ * - Easing: cubic-bezier(0.16, 1, 0.3, 1) ("cubicOut") for natural deceleration
+ * - Durations: 100-200ms micro, 300-500ms transitions, never >600ms
+ * - NO bounce/elastic — anti-patterns that feel廉价 (cheap)
  */
 var DEFAULT_ANIMATION_PRESETS = [{
   name: 'default',
-  description: '默认动画配置',
+  description: '默认动画配置 — 专业级 (300-500ms, cubicOut)',
   config: {
     enabled: true,
-    duration: 1000,
+    duration: 400,
     easing: 'cubicOut',
-    appearDuration: 1200,
+    appearDuration: 450,
     appearEasing: 'cubicOut',
-    updateDuration: 800,
+    updateDuration: 300,
     updateEasing: 'cubicOut',
-    disappearDuration: 600,
+    disappearDuration: 250,
     disappearEasing: 'cubicIn',
     threshold: 1000,
     progressive: true,
@@ -2233,70 +2424,76 @@ var DEFAULT_ANIMATION_PRESETS = [{
   }
 }, {
   name: 'fast',
-  description: '快速动画配置',
+  description: '快速动画配置 — 微交互 (150-200ms)',
   config: {
     enabled: true,
-    duration: 500,
-    easing: 'linear',
-    appearDuration: 600,
-    appearEasing: 'linear',
-    updateDuration: 400,
-    updateEasing: 'linear',
-    disappearDuration: 300,
-    disappearEasing: 'linear',
+    duration: 150,
+    easing: 'cubicOut',
+    appearDuration: 200,
+    appearEasing: 'cubicOut',
+    updateDuration: 150,
+    updateEasing: 'cubicOut',
+    disappearDuration: 100,
+    disappearEasing: 'cubicIn',
     threshold: 2000,
     progressive: true,
     progressiveStep: 1000
   }
 }, {
   name: 'slow',
-  description: '慢速动画配置',
+  description: '慢速动画配置 — 页面过渡 (500-600ms, capped)',
   config: {
     enabled: true,
-    duration: 2000,
+    duration: 500,
     easing: 'cubicInOut',
-    appearDuration: 2400,
+    appearDuration: 600,
     appearEasing: 'cubicInOut',
-    updateDuration: 1600,
+    updateDuration: 400,
     updateEasing: 'cubicInOut',
-    disappearDuration: 1200,
+    disappearDuration: 300,
     disappearEasing: 'cubicInOut',
     threshold: 500,
     progressive: true,
     progressiveStep: 250
   }
-}, {
+},
+// DEPRECATED — bounce is an anti-pattern per frontend-design-pro skill
+{
   name: 'bounce',
-  description: '弹跳动画配置',
+  description: '[已废弃] 弹跳动画 — 请使用 default 或 fast',
   config: {
-    enabled: true,
-    duration: 1500,
-    easing: 'bounceOut',
-    appearDuration: 1800,
-    appearEasing: 'bounceOut',
-    updateDuration: 1200,
-    updateEasing: 'bounceOut',
-    disappearDuration: 900,
-    disappearEasing: 'bounceIn',
+    enabled: false,
+    // disabled by default — anti-pattern
+    duration: 0,
+    easing: 'cubicOut',
+    appearDuration: 0,
+    appearEasing: 'cubicOut',
+    updateDuration: 0,
+    updateEasing: 'cubicOut',
+    disappearDuration: 0,
+    disappearEasing: 'cubicIn',
     threshold: 500,
-    progressive: true,
+    progressive: false,
     progressiveStep: 250
   }
-}, {
+},
+// DEPRECATED — elastic is an anti-pattern per frontend-design-pro skill
+{
   name: 'elastic',
-  description: '弹性动画配置',
+  description: '[已废弃] 弹性动画 — 请使用 default 或 fast',
   config: {
-    enabled: true,
-    duration: 1500,
-    easing: 'elasticOut',
-    appearDuration: 1800,
-    appearEasing: 'elasticOut',
-    updateDuration: 1200,
-    updateEasing: 'elasticOut',
-    disappearDuration: 900,
-    disappearEasing: 'elasticIn',
+    enabled: false,
+    // disabled by default — anti-pattern
+    duration: 0,
+    easing: 'cubicOut',
+    appearDuration: 0,
+    appearEasing: 'cubicOut',
+    updateDuration: 0,
+    updateEasing: 'cubicOut',
+    disappearDuration: 0,
+    disappearEasing: 'cubicIn',
     threshold: 500,
-    progressive: true,
+    progressive: false,
     progressiveStep: 250
   }
 }];
@@ -2392,6 +2589,7 @@ var AnimationManager = /** @class */function () {
   };
   /**
    * 根据数据量和动画类型获取优化后的动画配置
+   * 尊重 prefers-reduced-motion 无障碍设置
    */
   AnimationManager.prototype.getOptimizedConfig = function (config, dataLength) {
     if (config === void 0) {
@@ -2402,6 +2600,16 @@ var AnimationManager = /** @class */function () {
     }
     // 合并配置：用户配置 > 默认配置
     var mergedConfig = __assign(__assign({}, this.defaultConfig), config);
+    // Respect OS/browser prefers-reduced-motion setting (WCAG)
+    if (prefersReducedMotion()) {
+      return __assign(__assign({}, mergedConfig), {
+        enabled: false,
+        duration: 0,
+        appearDuration: 0,
+        updateDuration: 0,
+        disappearDuration: 0
+      });
+    }
     // 根据数据量优化动画
     if (mergedConfig.threshold && dataLength > mergedConfig.threshold) {
       mergedConfig.enabled = false;
@@ -48788,9 +48996,18 @@ var PerformanceAnalyzer = /** @class */function () {
     }
   }
   /**
-   * 获取单例实例
+   * 获取实例
+   * - 传入 chartId 时：每个 chartId 获得独立实例（指标隔离）
+   * - 不传 chartId 时：全局单例（向后兼容）
    */
   PerformanceAnalyzer.getInstance = function (config) {
+    if (config === null || config === void 0 ? void 0 : config.chartId) {
+      if (!PerformanceAnalyzer.instances.has(config.chartId)) {
+        PerformanceAnalyzer.instances.set(config.chartId, new PerformanceAnalyzer(config));
+      }
+      return PerformanceAnalyzer.instances.get(config.chartId);
+    }
+    // Legacy: global singleton
     if (!PerformanceAnalyzer.instance) {
       PerformanceAnalyzer.instance = new PerformanceAnalyzer(config);
     }
@@ -48805,6 +49022,16 @@ var PerformanceAnalyzer = /** @class */function () {
       PerformanceAnalyzer.instance = null;
     }
   };
+  /**
+   * 重置所有图表实例（用于测试/清理）
+   */
+  PerformanceAnalyzer.resetAllInstances = function () {
+    PerformanceAnalyzer.resetInstance();
+    PerformanceAnalyzer.instances.forEach(function (analyzer) {
+      return analyzer.stop();
+    });
+    PerformanceAnalyzer.instances.clear();
+  };
   /**
    * 注册事件处理器
    */
@@ -49215,6 +49442,8 @@ var PerformanceAnalyzer = /** @class */function () {
     return this.analyze().score;
   };
   PerformanceAnalyzer.instance = null;
+  // Per-chart isolated instances
+  PerformanceAnalyzer.instances = new Map();
   return PerformanceAnalyzer;
 }();
 
@@ -49264,12 +49493,12 @@ function calculateDataLength(option) {
 function filterDataByKeys(data, filters) {
   if (!filters || Object.keys(filters).length === 0) return data;
   return data.filter(function (item) {
-    var _a, _b;
-    for (var _i = 0, _c = Object.entries(filters); _i < _c.length; _i++) {
-      var _d = _c[_i],
-        key = _d[0],
-        value = _d[1];
-      if (item[key] !== value && !((_b = (_a = item[key]) === null || _a === void 0 ? void 0 : _a.includes) === null || _b === void 0 ? void 0 : _b.call(_a, value))) return false;
+    for (var _i = 0, _a = Object.entries(filters); _i < _a.length; _i++) {
+      var _b = _a[_i],
+        key = _b[0],
+        value = _b[1];
+      var itemVal = item[key];
+      if (itemVal !== value && !(Array.isArray(itemVal) && itemVal.includes(value))) return false;
     }
     return true;
   });
@@ -49287,6 +49516,15 @@ var BaseChart_assign = undefined && undefined.__assign || function () {
   };
   return BaseChart_assign.apply(this, arguments);
 };
+var BaseChart_spreadArray = undefined && undefined.__spreadArray || function (to, from, pack) {
+  if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+    if (ar || !(i in from)) {
+      if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+      ar[i] = from[i];
+    }
+  }
+  return to.concat(ar || Array.prototype.slice.call(from));
+};
 /**
  * TaroViz 基础图表组件
  * 所有图表组件的基类
@@ -49420,11 +49658,30 @@ var BaseChart = function (props) {
         });
       }
     }
+    // Inject dataZoom when enableZoom is true (keyboard-accessible zoom)
+    if (_enableZoom) {
+      processed = JSON.parse(JSON.stringify(processed));
+      // Avoid duplicate dataZoom entries
+      var existingDzArr = Array.isArray(processed.dataZoom) ? processed.dataZoom : processed.dataZoom ? [processed.dataZoom] : [];
+      if (!existingDzArr.some(function (dz) {
+        return (dz === null || dz === void 0 ? void 0 : dz.type) === 'inside';
+      })) {
+        processed.dataZoom = BaseChart_spreadArray(BaseChart_spreadArray([], existingDzArr || [], true), [
+        // Inside (mouse wheel + keyboard) — wired to keyboard nav in BaseChartWrapper
+        {
+          type: 'inside',
+          start: 0,
+          end: 100,
+          zoomOnMouseWheel: true,
+          moveOnMouseMove: false
+        }], false);
+      }
+    }
     // Apply animation config
     var dataLength = calculateDataLength(processed);
     var animConfig = (0,core_animation/* generateEChartsAnimationConfig */.ek)(animation, dataLength);
     return BaseChart_assign(BaseChart_assign({}, processed), animConfig);
-  }, [option, animation, enableDataFiltering, filters, virtualScroll, virtualScrollPageSize, virtualScrollPreloadSize, onDataFiltered]);
+  }, [option, animation, _enableZoom, enableDataFiltering, filters, virtualScroll, virtualScrollPageSize, virtualScrollPreloadSize, onDataFiltered]);
   // Internal chartInit that wraps the user's callback
   var handleChartInit = (0,external_react_.useCallback)(function (instance) {
     var _a;
@@ -49433,6 +49690,7 @@ var BaseChart = function (props) {
     // Performance monitoring init
     if (enablePerformanceMonitoring) {
       performanceAnalyzerRef.current = PerformanceAnalyzer.getInstance({
+        chartId: chartId,
         enabled: true,
         metrics: ['initTime', 'renderTime', 'updateTime', 'dataSize', 'frameRate'],
         sampleInterval: 1000,
@@ -49588,15 +49846,36 @@ var BaseChart = function (props) {
       });
     }
   }, [option, onPerformance]);
-  // Data update callback
+  // Data update callback — supports debounce
+  var debounceTimerRef = (0,external_react_.useRef)(null);
   (0,external_react_.useEffect)(function () {
-    if (onDataUpdate && (dataUpdateOptions === null || dataUpdateOptions === void 0 ? void 0 : dataUpdateOptions.enabled) !== false) {
+    var _a;
+    if (!onDataUpdate || (dataUpdateOptions === null || dataUpdateOptions === void 0 ? void 0 : dataUpdateOptions.enabled) === false) return;
+    var delay = (_a = dataUpdateOptions === null || dataUpdateOptions === void 0 ? void 0 : dataUpdateOptions.debounceDelay) !== null && _a !== void 0 ? _a : 0;
+    if (debounceTimerRef.current) {
+      clearTimeout(debounceTimerRef.current);
+    }
+    if (delay > 0) {
+      debounceTimerRef.current = setTimeout(function () {
+        var oldOpt = oldOptionRef.current;
+        if (oldOpt !== option) {
+          onDataUpdate(oldOpt, option);
+          oldOptionRef.current = option;
+        }
+      }, delay);
+    } else {
       var oldOpt = oldOptionRef.current;
       if (oldOpt !== option) {
         onDataUpdate(oldOpt, option);
         oldOptionRef.current = option;
       }
     }
+    return function () {
+      if (debounceTimerRef.current) {
+        clearTimeout(debounceTimerRef.current);
+        debounceTimerRef.current = null;
+      }
+    };
   }, [option, onDataUpdate, dataUpdateOptions]);
   // Cleanup on unmount
   (0,external_react_.useEffect)(function () {
@@ -50957,8 +51236,10 @@ var LiquidChart = /*#__PURE__*/(0,external_react_.memo)(function (props) {
                   chartInstance.current = instance;
                   // 绑定事件
                   if (onEvents) {
-                    Object.keys(onEvents).forEach(function (eventName) {
-                      instance.on(eventName, onEvents[eventName]);
+                    Object.entries(onEvents).forEach(function (_a) {
+                      var eventName = _a[0],
+                        handler = _a[1];
+                      instance.on(eventName, handler);
                     });
                   }
                   if (onChartInit) {
@@ -52205,6 +52486,38 @@ var ThemeManager = /** @class */function () {
   ThemeManager.prototype.isDarkMode = function () {
     return this.currentTheme.isDark || this.currentTheme.type === 'dark';
   };
+  /**
+   * 检测系统 prefers-color-scheme 是否为暗色
+   */
+  ThemeManager.prototype.getSystemPrefersDark = function () {
+    if (typeof window === 'undefined') return false;
+    return window.matchMedia('(prefers-color-scheme: dark)').matches;
+  };
+  /**
+   * 订阅系统主题变化，自动切换匹配的主题
+   * @returns 取消订阅的函数
+   */
+  ThemeManager.prototype.watchSystemTheme = function () {
+    var _this = this;
+    if (typeof window === 'undefined') return function () {};
+    var mq = window.matchMedia('(prefers-color-scheme: dark)');
+    var handler = function (e) {
+      // 当系统主题切换时，自动应用对应主题
+      _this.setTheme(e.matches ? 'dark' : 'default');
+    };
+    mq.addEventListener('change', handler);
+    return function () {
+      return mq.removeEventListener('change', handler);
+    };
+  };
+  /**
+   * 应用初始主题（根据系统偏好自动选择 dark/default）
+   * 必须在 DOM 加载后调用
+   */
+  ThemeManager.prototype.applyInitialTheme = function () {
+    var prefersDark = this.getSystemPrefersDark();
+    this.setTheme(prefersDark ? 'dark' : 'default');
+  };
   /**
    * 注册主题变更监听器
    */
@@ -53561,51 +53874,58 @@ var ErrorBoundary = /** @class */function (_super) {
       if (fallback) {
         return fallback(error, this.handleReset);
       }
-      // 默认错误展示
+      // 默认错误展示（使用 CSS 变量，与 ThemeManager 对齐）
       return /*#__PURE__*/external_react_default().createElement("div", {
+        role: "alert",
+        "aria-live": "assertive",
         style: {
           display: 'flex',
           flexDirection: 'column',
           alignItems: 'center',
           justifyContent: 'center',
-          padding: '20px',
-          backgroundColor: '#fff',
-          border: '1px solid #ff4d4f',
-          borderRadius: '8px',
-          color: '#333',
-          minHeight: '200px'
+          padding: 'var(--tv-border-radius, 16px)',
+          backgroundColor: 'var(--tv-bg-color, #fff)',
+          border: '1px solid var(--tv-error-color, #ff4d4f)',
+          borderRadius: 'var(--tv-border-radius, 8px)',
+          color: 'var(--tv-text-color, #333)',
+          minHeight: '200px',
+          fontFamily: 'var(--tv-font-family, sans-serif)'
         }
       }, /*#__PURE__*/external_react_default().createElement("div", {
         style: {
           fontSize: '48px',
           marginBottom: '16px'
-        }
+        },
+        "aria-hidden": "true"
       }, "\u26A0\uFE0F"), /*#__PURE__*/external_react_default().createElement("h3", {
         style: {
           margin: '0 0 12px',
-          color: '#ff4d4f'
+          color: 'var(--tv-error-color, #ff4d4f)',
+          fontWeight: 700
         }
       }, "\u56FE\u8868\u6E32\u67D3\u5931\u8D25"), /*#__PURE__*/external_react_default().createElement("p", {
         style: {
           margin: '0 0 16px',
-          color: '#666',
-          textAlign: 'center'
+          color: 'var(--tv-text-color-secondary, #666)',
+          textAlign: 'center',
+          maxWidth: '320px'
         }
       }, "\u56FE\u8868\u5728\u6E32\u67D3\u8FC7\u7A0B\u4E2D\u9047\u5230\u9519\u8BEF\uFF0C\u8BF7\u68C0\u67E5\u6570\u636E\u914D\u7F6E\u662F\u5426\u6B63\u786E"), showDetails && (/*#__PURE__*/external_react_default().createElement("details", {
         style: {
           width: '100%',
           padding: '12px',
-          backgroundColor: '#f5f5f5',
-          borderRadius: '4px',
-          fontSize: '12px',
-          fontFamily: 'monospace',
+          backgroundColor: 'var(--tv-bg-color-secondary, #f5f5f5)',
+          borderRadius: 'var(--tv-border-radius-small, 4px)',
+          fontSize: 'var(--tv-font-size-small, 12px)',
+          fontFamily: 'var(--tv-font-family, monospace)',
           overflow: 'auto',
           maxHeight: '150px'
         }
       }, /*#__PURE__*/external_react_default().createElement("summary", {
         style: {
           cursor: 'pointer',
-          marginBottom: '8px'
+          marginBottom: '8px',
+          fontWeight: 600
         }
       }, "\u9519\u8BEF\u8BE6\u60C5"), /*#__PURE__*/external_react_default().createElement("pre", {
         style: {
@@ -53618,12 +53938,20 @@ var ErrorBoundary = /** @class */function (_super) {
         style: {
           marginTop: '16px',
           padding: '8px 24px',
-          backgroundColor: '#1890ff',
+          backgroundColor: 'var(--tv-primary-color, #1890ff)',
           color: '#fff',
           border: 'none',
-          borderRadius: '4px',
+          borderRadius: 'var(--tv-border-radius-small, 4px)',
           cursor: 'pointer',
-          fontSize: '14px'
+          fontSize: 'var(--tv-font-size, 14px)',
+          fontWeight: 600,
+          transition: 'background-color var(--tv-transition-duration, 0.3s)'
+        },
+        onMouseEnter: function (e) {
+          e.currentTarget.style.backgroundColor = 'var(--tv-primary-color-hover, #40a9ff)';
+        },
+        onMouseLeave: function (e) {
+          e.currentTarget.style.backgroundColor = 'var(--tv-primary-color, #1890ff)';
         }
       }, "\u91CD\u8BD5"));
     }
@@ -53742,12 +54070,14 @@ var LAZY_CHART_MODULES = {
 };
 var LAZY_CHART_TYPES = Object.keys(LAZY_CHART_MODULES);
 /**
- * 默认加载状态组件
+ * 默认加载状态组件（使用 CSS 变量，与 ThemeManager 对齐）
  */
 var DefaultLoadingFallback = function (_a) {
   var _b = _a.text,
     text = _b === void 0 ? '加载中...' : _b;
   return /*#__PURE__*/external_react_default().createElement("div", {
+    role: "status",
+    "aria-label": text,
     style: {
       display: 'flex',
       alignItems: 'center',
@@ -53755,8 +54085,8 @@ var DefaultLoadingFallback = function (_a) {
       width: '100%',
       height: '100%',
       minHeight: '200px',
-      backgroundColor: '#f5f5f5',
-      borderRadius: '8px'
+      backgroundColor: 'var(--tv-bg-color-secondary, #f5f5f5)',
+      borderRadius: 'var(--tv-border-radius, 8px)'
     }
   }, /*#__PURE__*/external_react_default().createElement("div", {
     style: {
@@ -53766,16 +54096,17 @@ var DefaultLoadingFallback = function (_a) {
     style: {
       width: '40px',
       height: '40px',
-      border: '3px solid #1890ff',
+      border: '3px solid var(--tv-primary-color, #1890ff)',
       borderTopColor: 'transparent',
       borderRadius: '50%',
       animation: 'taroviz-spin 1s linear infinite',
       margin: '0 auto 12px'
-    }
+    },
+    "aria-hidden": "true"
   }), /*#__PURE__*/external_react_default().createElement("style", null, "\n          @keyframes taroviz-spin {\n            to { transform: rotate(360deg); }\n          }\n        "), /*#__PURE__*/external_react_default().createElement("span", {
     style: {
-      color: '#666',
-      fontSize: '14px'
+      color: 'var(--tv-text-color-secondary, #666)',
+      fontSize: 'var(--tv-font-size, 14px)'
     }
   }, text)));
 };
@@ -55868,6 +56199,491 @@ function useChartDownload(instance, options) {
 // 导出
 // ============================================================================
 /* harmony default export */ const hooks_useChartDownload = ((/* unused pure expression or super */ null && (useChartDownload)));
+;// ./src/hooks/useChartHistory.ts
+var useChartHistory_spreadArray = undefined && undefined.__spreadArray || function (to, from, pack) {
+  if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+    if (ar || !(i in from)) {
+      if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+      ar[i] = from[i];
+    }
+  }
+  return to.concat(ar || Array.prototype.slice.call(from));
+};
+/**
+ * useChartHistory - 图表 Undo/Redo Hook
+ * 追踪图表配置历史，支持撤销/重做操作和键盘快捷键
+ *
+ * 特性：
+ * - 最多保存 50 条历史记录（可配置）
+ * - 自动绑定 Ctrl+Z / Ctrl+Y 键盘快捷键
+ * - 支持 ignoreKeys 忽略特定配置字段（如动画、时间戳）
+ * - 暴露 canUndo / canRedo 状态
+ */
+
+// ============================================================================
+// 工具函数
+// ============================================================================
+/** 深度省略指定键后比较两个配置是否相等 */
+function omitAndCompare(a, b, ignoreKeys) {
+  if (a === b) return true;
+  if (typeof a !== 'object' || a === null || typeof b !== 'object' || b === null) {
+    return a === b;
+  }
+  var aObj = a;
+  var bObj = b;
+  var aKeys = Object.keys(aObj).filter(function (k) {
+    return !ignoreKeys.has(k);
+  });
+  var bKeys = Object.keys(bObj).filter(function (k) {
+    return !ignoreKeys.has(k);
+  });
+  if (aKeys.length !== bKeys.length) return false;
+  for (var _i = 0, aKeys_1 = aKeys; _i < aKeys_1.length; _i++) {
+    var key = aKeys_1[_i];
+    if (!bObj.hasOwnProperty(key)) return false;
+    if (!omitAndCompare(aObj[key], bObj[key], ignoreKeys)) return false;
+  }
+  return true;
+}
+// ============================================================================
+// Hook 实现
+// ============================================================================
+/**
+ * 使用图表历史记录（Undo/Redo）
+ * @param chartInstance 图表实例
+ * @param options 配置选项
+ * @returns 历史记录控制接口
+ */
+function useChartHistory(chartInstance, options) {
+  if (options === void 0) {
+    options = {};
+  }
+  var _a = options.maxHistorySize,
+    maxHistorySize = _a === void 0 ? 50 : _a,
+    _b = options.ignoreKeys,
+    ignoreKeys = _b === void 0 ? ['animation', 'animationDuration', 'animationEasing', 'animationFrame'] : _b,
+    _c = options.enableKeyboard,
+    enableKeyboard = _c === void 0 ? true : _c,
+    _d = options.clearOnUnmount,
+    clearOnUnmount = _d === void 0 ? false : _d;
+  // 忽略键集合
+  var ignoreKeySet = (0,external_react_.useRef)(new Set(ignoreKeys));
+  // 历史栈（每次 setOption 快照）
+  var historyStack = (0,external_react_.useRef)([]);
+  // 当前索引
+  var _e = (0,external_react_.useState)(-1),
+    currentIndex = _e[0],
+    setCurrentIndex = _e[1];
+  // Chart instance ref
+  var chartRef = (0,external_react_.useRef)(null);
+  chartRef.current = chartInstance;
+  // 是否正在执行 undo/redo（避免 push 时重复记录）
+  var isApplyingRef = (0,external_react_.useRef)(false);
+  // 拦截 chart.setOption，记录历史
+  (0,external_react_.useEffect)(function () {
+    var chart = chartRef.current;
+    if (!chart) return;
+    var originalSetOption = chart.setOption.bind(chart);
+    chart.setOption = function (option, notMerge, lazyUpdate) {
+      // 如果正在执行 undo/redo，跳过历史记录
+      if (isApplyingRef.current) {
+        return originalSetOption(option, notMerge, lazyUpdate);
+      }
+      var stack = historyStack.current;
+      var idx = currentIndex;
+      // 如果当前索引不在栈顶，丢弃redo历史（类似 Git 行为）
+      var newStack = idx < stack.length - 1 ? stack.slice(0, idx + 1) : useChartHistory_spreadArray([], stack, true);
+      // 检查是否与上一次配置相同（忽略动画字段）
+      var lastOption = newStack[newStack.length - 1];
+      if (lastOption && omitAndCompare(lastOption, option, ignoreKeySet.current)) {
+        // 配置没变，直接应用
+        return originalSetOption(option, notMerge, lazyUpdate);
+      }
+      // 入栈
+      newStack.push(option);
+      // 裁剪超出 maxHistorySize
+      if (newStack.length > maxHistorySize) {
+        newStack.shift();
+      } else {
+        // 更新索引
+        setCurrentIndex(newStack.length - 1);
+      }
+      historyStack.current = newStack;
+      return originalSetOption(option, notMerge, lazyUpdate);
+    };
+    return function () {
+      // 恢复原始 setOption
+      chart.setOption = originalSetOption;
+    };
+  }, [chartInstance, currentIndex, maxHistorySize]);
+  // 键盘快捷键：Ctrl+Z 撤销，Ctrl+Y / Ctrl+Shift+Z 重做
+  (0,external_react_.useEffect)(function () {
+    if (!enableKeyboard) return;
+    var handleKeyDown = function (e) {
+      var isMod = e.ctrlKey || e.metaKey;
+      if (!isMod) return;
+      if (e.key === 'z' && !e.shiftKey) {
+        e.preventDefault();
+        undo();
+      } else if (e.key === 'y' || e.key === 'z' && e.shiftKey) {
+        e.preventDefault();
+        redo();
+      }
+    };
+    window.addEventListener('keydown', handleKeyDown);
+    return function () {
+      return window.removeEventListener('keydown', handleKeyDown);
+    };
+  }, [enableKeyboard]); // eslint-disable-line react-hooks/exhaustive-deps
+  // 组件卸载时清空
+  (0,external_react_.useEffect)(function () {
+    return function () {
+      if (clearOnUnmount) {
+        historyStack.current = [];
+        setCurrentIndex(-1);
+      }
+    };
+  }, [clearOnUnmount]);
+  // ─── Public API ───────────────────────────────────────────────────────────
+  var undo = (0,external_react_.useCallback)(function () {
+    var chart = chartRef.current;
+    if (!chart || currentIndex <= 0) return;
+    var idx = currentIndex - 1;
+    isApplyingRef.current = true;
+    chart.setOption(historyStack.current[idx], true, true);
+    isApplyingRef.current = false;
+    setCurrentIndex(idx);
+  }, [currentIndex]);
+  var redo = (0,external_react_.useCallback)(function () {
+    var chart = chartRef.current;
+    if (!chart || currentIndex >= historyStack.current.length - 1) return;
+    var idx = currentIndex + 1;
+    isApplyingRef.current = true;
+    chart.setOption(historyStack.current[idx], true, true);
+    isApplyingRef.current = false;
+    setCurrentIndex(idx);
+  }, [currentIndex]);
+  var goTo = (0,external_react_.useCallback)(function (index) {
+    var chart = chartRef.current;
+    if (!chart) return;
+    if (index < 0 || index >= historyStack.current.length) return;
+    if (index === currentIndex) return;
+    isApplyingRef.current = true;
+    chart.setOption(historyStack.current[index], true, true);
+    isApplyingRef.current = false;
+    setCurrentIndex(index);
+  }, [currentIndex]);
+  var push = (0,external_react_.useCallback)(function (option) {
+    var stack = historyStack.current;
+    var idx = currentIndex;
+    var newStack = idx < stack.length - 1 ? stack.slice(0, idx + 1) : useChartHistory_spreadArray([], stack, true);
+    newStack.push(option);
+    if (newStack.length > maxHistorySize) newStack.shift();
+    historyStack.current = newStack;
+    setCurrentIndex(newStack.length - 1);
+  }, [currentIndex, maxHistorySize]);
+  var clear = (0,external_react_.useCallback)(function () {
+    historyStack.current = [];
+    setCurrentIndex(-1);
+  }, []);
+  return {
+    canUndo: currentIndex > 0,
+    canRedo: currentIndex < historyStack.current.length - 1,
+    currentIndex: currentIndex,
+    historyCount: historyStack.current.length,
+    undo: undo,
+    redo: redo,
+    goTo: goTo,
+    push: push,
+    clear: clear
+  };
+}
+/* harmony default export */ const hooks_useChartHistory = ((/* unused pure expression or super */ null && (useChartHistory)));
+;// ./src/hooks/useChartSelection.ts
+var useChartSelection_spreadArray = undefined && undefined.__spreadArray || function (to, from, pack) {
+  if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+    if (ar || !(i in from)) {
+      if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+      ar[i] = from[i];
+    }
+  }
+  return to.concat(ar || Array.prototype.slice.call(from));
+};
+/**
+ * useChartSelection - 图表数据点选择/高亮 Hook
+ * 支持单个/批量选择、反选、清除选择，配合 ECharts select 事件
+ *
+ * 特性：
+ * - 支持按 seriesIndex + dataIndex 选择
+ * - 支持按 dataIndex 跨系列批量选择
+ * - 支持反选（invertSelection）
+ * - 支持多选模式（multi）
+ * - 自动绑定图表 select/unselect 事件
+ */
+
+// ============================================================================
+// 工具函数
+// ============================================================================
+/** 生成唯一键字符串 */
+function keyToString(key) {
+  return "".concat(key.seriesIndex, ":").concat(key.dataIndex);
+}
+function stringToKey(str) {
+  var _a = str.split(':').map(Number),
+    seriesIndex = _a[0],
+    dataIndex = _a[1];
+  return {
+    seriesIndex: seriesIndex,
+    dataIndex: dataIndex
+  };
+}
+// ============================================================================
+// Hook 实现
+// ============================================================================
+/**
+ * 使用图表数据点选择功能
+ * @param chartInstance 图表实例
+ * @param options 配置选项
+ * @returns 选择控制接口
+ */
+function useChartSelection(chartInstance, options) {
+  if (options === void 0) {
+    options = {};
+  }
+  var _a = options.mode,
+    mode = _a === void 0 ? 'multiple' : _a,
+    _b = options.clearOnUnmount,
+    clearOnUnmount = _b === void 0 ? true : _b,
+    _c = options.enableCtrlMultiSelect,
+    enableCtrlMultiSelect = _c === void 0 ? true : _c,
+    _d = options.enableShiftRangeSelect,
+    enableShiftRangeSelect = _d === void 0 ? true : _d,
+    onSelectionChange = options.onSelectionChange;
+  // 选中点集合（字符串键）
+  var _e = (0,external_react_.useState)([]),
+    selectedPoints = _e[0],
+    setSelectedPoints = _e[1];
+  // Chart instance ref
+  var chartRef = (0,external_react_.useRef)(null);
+  chartRef.current = chartInstance;
+  // 上一次 shift+click 的数据索引（用于范围选择）
+  var lastShiftIndexRef = (0,external_react_.useRef)(null);
+  // 当前模式 ref（用于事件处理）
+  var modeRef = (0,external_react_.useRef)(mode);
+  modeRef.current = mode;
+  // 绑定图表 select/unselect 事件
+  (0,external_react_.useEffect)(function () {
+    var chart = chartRef.current;
+    if (!chart || !chart.on) return;
+    var handleSelect = function (params) {
+      // ECharts 内置 select 会同步更新 legend
+      // 这里我们用 dispatchAction 来实现纯数据点选择
+    };
+    // 单击 legend 时清除数据点选择（保持一致性）
+    var handleLegendSelectChanged = function (params) {
+      // 清除选择时的视觉反馈
+    };
+    chart.on('selectchanged', function (params) {
+      // 当图表内部选择变化时同步状态
+      var p = params;
+      if (p.isFromClick) {
+        // 用户点击了图例，清除所有数据点选择
+        setSelectedPoints([]);
+        onSelectionChange === null || onSelectionChange === void 0 ? void 0 : onSelectionChange({
+          selected: [],
+          unselected: []
+        });
+      }
+    });
+    return function () {
+      if (chart.off) {
+        chart.off('selectchanged');
+      }
+    };
+  }, [onSelectionChange]);
+  // 组件卸载时清除选择
+  (0,external_react_.useEffect)(function () {
+    return function () {
+      if (clearOnUnmount) {
+        var chart = chartRef.current;
+        if (chart === null || chart === void 0 ? void 0 : chart.dispatchAction) {
+          // 清除所有系列的选择状态
+          chart.dispatchAction({
+            type: 'unselect'
+          });
+        }
+      }
+    };
+  }, [clearOnUnmount]);
+  // ─── 私有方法 ───────────────────────────────────────────────────────────────
+  /** 触发选择变化回调 */
+  var notifyChange = (0,external_react_.useCallback)(function (selected, unselected) {
+    onSelectionChange === null || onSelectionChange === void 0 ? void 0 : onSelectionChange({
+      selected: selected,
+      unselected: unselected
+    });
+  }, [onSelectionChange]);
+  /** 执行 ECharts dispatchAction */
+  var dispatchSelect = (0,external_react_.useCallback)(function (key, select) {
+    var chart = chartRef.current;
+    if (!(chart === null || chart === void 0 ? void 0 : chart.dispatchAction)) return;
+    chart.dispatchAction({
+      type: select ? 'select' : 'unselect',
+      seriesIndex: key.seriesIndex,
+      dataIndex: key.dataIndex
+    });
+  }, []);
+  // ─── Public API ───────────────────────────────────────────────────────────
+  var select = (0,external_react_.useCallback)(function (key) {
+    setSelectedPoints(function (prev) {
+      var str = keyToString(key);
+      if (prev.some(function (p) {
+        return keyToString(p) === str;
+      })) return prev;
+      var next = mode === 'single' ? [key] : useChartSelection_spreadArray(useChartSelection_spreadArray([], prev, true), [key], false);
+      notifyChange(next, []);
+      return next;
+    });
+    dispatchSelect(key, true);
+  }, [mode, notifyChange, dispatchSelect]);
+  var deselect = (0,external_react_.useCallback)(function (key) {
+    setSelectedPoints(function (prev) {
+      var str = keyToString(key);
+      var removed = prev.filter(function (p) {
+        return keyToString(p) !== str;
+      });
+      notifyChange([], removed);
+      return removed;
+    });
+    dispatchSelect(key, false);
+  }, [notifyChange, dispatchSelect]);
+  var toggle = (0,external_react_.useCallback)(function (key) {
+    var str = keyToString(key);
+    if (selectedPoints.some(function (p) {
+      return keyToString(p) === str;
+    })) {
+      deselect(key);
+    } else {
+      select(key);
+    }
+  }, [selectedPoints, select, deselect]);
+  var selectMultiple = (0,external_react_.useCallback)(function (keys) {
+    setSelectedPoints(function (prev) {
+      var newPoints = mode === 'single' ? keys : useChartSelection_spreadArray(useChartSelection_spreadArray([], prev, true), keys.filter(function (k) {
+        return !prev.some(function (p) {
+          return keyToString(p) === keyToString(k);
+        });
+      }), true);
+      notifyChange(newPoints, []);
+      return newPoints;
+    });
+    keys.forEach(function (key) {
+      return dispatchSelect(key, true);
+    });
+  }, [mode, notifyChange, dispatchSelect]);
+  var deselectMultiple = (0,external_react_.useCallback)(function (keys) {
+    setSelectedPoints(function (prev) {
+      var keySet = new Set(keys.map(keyToString));
+      var removed = prev.filter(function (p) {
+        return keySet.has(keyToString(p));
+      });
+      var remaining = prev.filter(function (p) {
+        return !keySet.has(keyToString(p));
+      });
+      notifyChange([], removed);
+      return remaining;
+    });
+    keys.forEach(function (key) {
+      return dispatchSelect(key, false);
+    });
+  }, [notifyChange, dispatchSelect]);
+  var invertSelection = (0,external_react_.useCallback)(function (seriesIndex, dataIndices) {
+    setSelectedPoints(function (prev) {
+      var selectedSet = new Set(prev.filter(function (p) {
+        return p.seriesIndex === seriesIndex;
+      }).map(function (p) {
+        return p.dataIndex;
+      }));
+      var toSelect = [];
+      var toDeselect = [];
+      dataIndices.forEach(function (dataIndex) {
+        var key = {
+          seriesIndex: seriesIndex,
+          dataIndex: dataIndex
+        };
+        var str = keyToString(key);
+        if (selectedSet.has(dataIndex)) {
+          toDeselect.push(key);
+        } else {
+          toSelect.push(key);
+        }
+      });
+      toDeselect.forEach(function (k) {
+        return dispatchSelect(k, false);
+      });
+      toSelect.forEach(function (k) {
+        return dispatchSelect(k, true);
+      });
+      var newSelected = prev.filter(function (p) {
+        return !(p.seriesIndex === seriesIndex && selectedSet.has(p.dataIndex));
+      }).concat(toSelect);
+      notifyChange(toSelect, toDeselect);
+      return newSelected;
+    });
+  }, [notifyChange, dispatchSelect]);
+  var selectAll = (0,external_react_.useCallback)(function (seriesIndex, dataIndices) {
+    var keys = dataIndices.map(function (dataIndex) {
+      return {
+        seriesIndex: seriesIndex,
+        dataIndex: dataIndex
+      };
+    });
+    setSelectedPoints(function (prev) {
+      var newPoints = mode === 'single' ? keys : useChartSelection_spreadArray(useChartSelection_spreadArray([], prev, true), keys.filter(function (k) {
+        return !prev.some(function (p) {
+          return keyToString(p) === keyToString(k);
+        });
+      }), true);
+      notifyChange(newPoints, []);
+      return newPoints;
+    });
+    keys.forEach(function (key) {
+      return dispatchSelect(key, true);
+    });
+  }, [mode, notifyChange, dispatchSelect]);
+  var clearSelection = (0,external_react_.useCallback)(function () {
+    var chart = chartRef.current;
+    if (chart === null || chart === void 0 ? void 0 : chart.dispatchAction) {
+      chart.dispatchAction({
+        type: 'unselect'
+      });
+    }
+    var prev = selectedPoints;
+    setSelectedPoints([]);
+    notifyChange([], prev);
+  }, [selectedPoints, notifyChange]);
+  var isSelected = (0,external_react_.useCallback)(function (key) {
+    var str = keyToString(key);
+    return selectedPoints.some(function (p) {
+      return keyToString(p) === str;
+    });
+  }, [selectedPoints]);
+  return {
+    selectedPoints: selectedPoints,
+    hasSelection: selectedPoints.length > 0,
+    selectionCount: selectedPoints.length,
+    select: select,
+    deselect: deselect,
+    selectMultiple: selectMultiple,
+    deselectMultiple: deselectMultiple,
+    toggle: toggle,
+    invertSelection: invertSelection,
+    selectAll: selectAll,
+    clearSelection: clearSelection,
+    isSelected: isSelected
+  };
+}
+/* harmony default export */ const hooks_useChartSelection = ((/* unused pure expression or super */ null && (useChartSelection)));
 ;// ./src/hooks/useDataTransform.ts
 var useDataTransform_assign = undefined && undefined.__assign || function () {
   useDataTransform_assign = Object.assign || function (t) {
@@ -56459,6 +57275,8 @@ var hooks_spreadArray = undefined && undefined.__spreadArray || function (to, fr
 
 
 
+
+
 // ============================================================================
 // Hooks
 // ============================================================================
@@ -56695,7 +57513,7 @@ function useChartTheme(theme, darkMode) {
  */
 function useChartData(data, transformer) {
   return (0,external_react_.useMemo)(function () {
-    if (!data) {
+    if (!data || Array.isArray(data) && data.length === 0) {
       return {};
     }
     return transformer(data);
@@ -57061,6 +57879,10 @@ function useChartTools(instance) {
 
 // 图表下载 Hook
 
+// 图表历史记录 Hook (Undo/Redo)
+
+// 图表选择 Hook
+
 // ============================================================================
 // 导出
 // ============================================================================
@@ -57084,7 +57906,9 @@ var hooks_version = '1.7.0';
   // v1.7.0 新增
   useDataZoom: useDataZoom,
   useChartConnect: useChartConnect,
-  useChartDownload: useChartDownload
+  useChartDownload: useChartDownload,
+  useChartHistory: useChartHistory,
+  useChartSelection: useChartSelection
 });
 ;// ./src/index.ts
 /**