@agions/taroviz 1.7.0 → 1.9.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;
 }();
 
@@ -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) {
@@ -56695,7 +56976,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);