@agions/taroviz 1.11.1 → 2.0.3

package/src/core/components/ErrorBoundary.tsx

@@ -84,11 +84,22 @@ export class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundarySt
             fontFamily: 'var(--tv-font-family, sans-serif)',
           }}
         >
-          <div style={{ fontSize: '48px', marginBottom: '16px' }} aria-hidden="true">⚠️</div>
-          <h3 style={{ margin: '0 0 12px', color: 'var(--tv-error-color, #ff4d4f)', fontWeight: 700 }}>
+          <div style={{ fontSize: '48px', marginBottom: '16px' }} aria-hidden="true">
+            ⚠️
+          </div>
+          <h3
+            style={{ margin: '0 0 12px', color: 'var(--tv-error-color, #ff4d4f)', fontWeight: 700 }}
+          >
             图表渲染失败
           </h3>
-          <p style={{ margin: '0 0 16px', color: 'var(--tv-text-color-secondary, #666)', textAlign: 'center', maxWidth: '320px' }}>
+          <p
+            style={{
+              margin: '0 0 16px',
+              color: 'var(--tv-text-color-secondary, #666)',
+              textAlign: 'center',
+              maxWidth: '320px',
+            }}
+          >
             图表在渲染过程中遇到错误，请检查数据配置是否正确
           </p>
           {showDetails && (
@@ -104,7 +115,9 @@ export class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundarySt
                 maxHeight: '150px',
               }}
             >
-              <summary style={{ cursor: 'pointer', marginBottom: '8px', fontWeight: 600 }}>错误详情</summary>
+              <summary style={{ cursor: 'pointer', marginBottom: '8px', fontWeight: 600 }}>
+                错误详情
+              </summary>
               <pre style={{ margin: 0, whiteSpace: 'pre-wrap', wordBreak: 'break-all' }}>
                 {error.message}
                 {'\n\n'}

package/src/core/components/LazyChart.tsx

@@ -5,32 +5,53 @@
 import React, { Suspense, lazy, ComponentType } from 'react';
 import type { BaseChartProps } from '../../charts/types';
 
-// 懒加载各个图表组件
-const LazyLineChart = lazy(() => import('../../charts/line'));
-const LazyBarChart = lazy(() => import('../../charts/bar'));
-const LazyPieChart = lazy(() => import('../../charts/pie'));
-const LazyScatterChart = lazy(() => import('../../charts/scatter'));
-const LazyRadarChart = lazy(() => import('../../charts/radar'));
-const LazyHeatmapChart = lazy(() => import('../../charts/heatmap'));
-const LazyGaugeChart = lazy(() => import('../../charts/gauge'));
-const LazyFunnelChart = lazy(() => import('../../charts/funnel'));
-const LazyTreeMapChart = lazy(() => import('../../charts/treemap'));
-const LazySunburstChart = lazy(() => import('../../charts/sunburst'));
-const LazySankeyChart = lazy(() => import('../../charts/sankey'));
+/**
+ * 图表类型到懒加载组件的映射
+ * 统一定义，避免重复
+ */
+const LAZY_CHART_REGISTRY: Record<string, ComponentType<BaseChartProps>> = {};
+
+/**
+ * 创建懒加载组件
+ */
+function createLazyComponent(name: string): ComponentType<BaseChartProps> {
+  if (!LAZY_CHART_REGISTRY[name]) {
+    LAZY_CHART_REGISTRY[name] = lazy(() =>
+      import('../../charts').then((m) => ({
+        default: m[name as keyof typeof m] as ComponentType<BaseChartProps>,
+      }))
+    );
+  }
+  return LAZY_CHART_REGISTRY[name];
+}
 
-// 统一的图表类型到懒加载组件映射
-const LAZY_CHART_MODULES: Record<string, () => Promise<{ default: ComponentType<BaseChartProps> }>> = {
-  line: () => import('../../charts/line'),
-  bar: () => import('../../charts/bar'),
-  pie: () => import('../../charts/pie'),
-  scatter: () => import('../../charts/scatter'),
-  radar: () => import('../../charts/radar'),
-  heatmap: () => import('../../charts/heatmap'),
-  gauge: () => import('../../charts/gauge'),
-  funnel: () => import('../../charts/funnel'),
-  treemap: () => import('../../charts/treemap'),
-  sunburst: () => import('../../charts/sunburst'),
-  sankey: () => import('../../charts/sankey'),
+// 预创建常用图表的懒加载组件
+export const LazyLineChart = createLazyComponent('LineChart');
+export const LazyBarChart = createLazyComponent('BarChart');
+export const LazyPieChart = createLazyComponent('PieChart');
+export const LazyScatterChart = createLazyComponent('ScatterChart');
+export const LazyRadarChart = createLazyComponent('RadarChartCustom');
+export const LazyHeatmapChart = createLazyComponent('HeatmapChart');
+export const LazyFunnelChart = createLazyComponent('FunnelChart');
+export const LazyTreeMapChart = createLazyComponent('TreeMapChart');
+export const LazySunburstChart = createLazyComponent('SunburstChart');
+export const LazySankeyChart = createLazyComponent('SankeyChart');
+
+/**
+ * 图表类型到懒加载模块的映射
+ * 用于预加载功能
+ */
+const LAZY_CHART_MODULES: Record<string, () => Promise<{ default: React.ComponentType<any> }>> = {
+  line: () => import('../../charts').then((m) => ({ default: m.LineChart })),
+  bar: () => import('../../charts').then((m) => ({ default: m.BarChart })),
+  pie: () => import('../../charts').then((m) => ({ default: m.PieChart })),
+  scatter: () => import('../../charts').then((m) => ({ default: m.ScatterChart })),
+  radar: () => import('../../charts').then((m) => ({ default: m.RadarChartCustom })),
+  heatmap: () => import('../../charts').then((m) => ({ default: m.HeatmapChart })),
+  funnel: () => import('../../charts').then((m) => ({ default: m.FunnelChart })),
+  treemap: () => import('../../charts').then((m) => ({ default: m.TreeMapChart })),
+  sunburst: () => import('../../charts').then((m) => ({ default: m.SunburstChart })),
+  sankey: () => import('../../charts').then((m) => ({ default: m.SankeyChart })),
 };
 
 export const LAZY_CHART_TYPES = Object.keys(LAZY_CHART_MODULES);
@@ -94,7 +115,12 @@ const DefaultLoadingFallback: React.FC<{ text?: string }> = ({ text = '加载中
       >
         {text}
       </span>
-      <span style={{ color: 'var(--tv-text-color-secondary, #666)', fontSize: 'var(--tv-font-size, 14px)' }}>
+      <span
+        style={{
+          color: 'var(--tv-text-color-secondary, #666)',
+          fontSize: 'var(--tv-font-size, 14px)',
+        }}
+      >
         {text}
       </span>
     </div>
@@ -164,21 +190,8 @@ export function preloadAllCharts(): Promise<void[]> {
  * 用于动态导入图表
  */
 export function createLazyChart(chartType: string): ComponentType<BaseChartProps> | null {
-  const lazyCharts: Record<string, ComponentType<BaseChartProps>> = {
-    line: LazyLineChart,
-    bar: LazyBarChart,
-    pie: LazyPieChart,
-    scatter: LazyScatterChart,
-    radar: LazyRadarChart,
-    heatmap: LazyHeatmapChart,
-    gauge: LazyGaugeChart,
-    funnel: LazyFunnelChart,
-    treemap: LazyTreeMapChart,
-    sunburst: LazySunburstChart,
-    sankey: LazySankeyChart,
-  };
-
-  return lazyCharts[chartType] || null;
+  const chartName = `${chartType.charAt(0).toUpperCase() + chartType.slice(1)}Chart`;
+  return LAZY_CHART_REGISTRY[chartName] || null;
 }
 
 /**
@@ -198,17 +211,3 @@ export const LazyChartRegistry = {
     return preloadAllCharts();
   },
 };
-
-export {
-  LazyLineChart,
-  LazyBarChart,
-  LazyPieChart,
-  LazyScatterChart,
-  LazyRadarChart,
-  LazyHeatmapChart,
-  LazyGaugeChart,
-  LazyFunnelChart,
-  LazyTreeMapChart,
-  LazySunburstChart,
-  LazySankeyChart,
-};

package/src/core/components/hooks/index.ts

@@ -16,5 +16,9 @@ export type {
 export { useVirtualScroll } from './useVirtualScroll';
 export type { UseVirtualScrollOptions, VirtualScrollState } from './useVirtualScroll';
 
-export { usePerformance } from './usePerformance';
-export type { PerformanceData, UsePerformanceOptions } from './usePerformance';
+export { useChartPerformanceMetrics, usePerformance } from './usePerformance';
+export type {
+  PerformanceData,
+  UseChartPerformanceMetricsOptions,
+  UsePerformanceOptions,
+} from './usePerformance';

package/src/core/components/hooks/useChartInit.ts

@@ -36,6 +36,8 @@ export function useChartInit(
     let adapter: Adapter | null = null;
 
     const initChart = async () => {
+      if (!mounted) return;
+
       try {
         adapter = await getAdapter({
           width: options.width,
@@ -47,14 +49,15 @@ export function useChartInit(
           direction: options.direction,
         });
 
-        if (!mounted) return;
-        if (!adapter) return;
+        if (!mounted || !adapter) return;
 
         adapterRef.current = adapter;
         isReadyRef.current = true;
         adapter.init();
       } catch (error) {
-        console.error('[TaroViz] Failed to initialize chart:', error);
+        if (mounted) {
+          console.error('[TaroViz] Failed to initialize chart:', error);
+        }
       }
     };
 

package/src/core/components/hooks/usePerformance.ts

@@ -13,12 +13,15 @@ export interface PerformanceData {
   dataSize: number;
 }
 
-export interface UsePerformanceOptions {
+export interface UseChartPerformanceMetricsOptions {
   enabled?: boolean;
   onPerformance?: (data: PerformanceData) => void;
 }
 
-export function usePerformance(options: UsePerformanceOptions = {}) {
+/** @deprecated Use `UseChartPerformanceMetricsOptions` instead */
+export type UsePerformanceOptions = UseChartPerformanceMetricsOptions;
+
+export function useChartPerformanceMetrics(options: UseChartPerformanceMetricsOptions = {}) {
   const { enabled = false, onPerformance } = options;
 
   const analyzerRef = useRef<PerformanceAnalyzer | null>(null);
@@ -184,3 +187,6 @@ export function usePerformance(options: UsePerformanceOptions = {}) {
     dispose,
   };
 }
+
+/** @deprecated Use `useChartPerformanceMetrics` instead */
+export const usePerformance = useChartPerformanceMetrics;

package/src/core/components/hooks/useVirtualScroll.ts

@@ -4,6 +4,7 @@
  */
 import { useRef, useCallback } from 'react';
 import type { EChartsOption } from 'echarts';
+import { deepClone } from '../../../core/utils/deepClone';
 
 export interface UseVirtualScrollOptions {
   enabled?: boolean;
@@ -71,7 +72,7 @@ export function useVirtualScroll(options: UseVirtualScrollOptions = {}) {
       }
 
       // 深拷贝避免修改原始数据
-      const processedOption = JSON.parse(JSON.stringify(originalOption)) as EChartsOption;
+      const processedOption = deepClone(originalOption) as EChartsOption;
 
       (processedOption.series as unknown[]).forEach((seriesItem: unknown, _index: number) => {
         const s = seriesItem as { data?: unknown[] };

package/src/core/index.ts

@@ -19,4 +19,4 @@ export { default as echarts } from './echarts';
  * 库信息
  */
 export const name = 'taroviz';
-export const version = '1.2.0';
+export { VERSION as version, versionInfo } from './version';

package/src/core/themes/ThemeManager.ts

@@ -248,7 +248,7 @@ const PRESET_THEMES: Record<PresetThemeName, ThemeConfig> = {
       '--tv-bg-color-secondary': '#f5f7fa',
       '--tv-text-color': '#1a1a1a',
       '--tv-text-color-secondary': '#666666',
-      '--tv-primary-color': '#277 ace',
+      '--tv-primary-color': '#277ace',
       '--tv-primary-color-hover': '#3a8ee6',
       '--tv-primary-color-active': '#146bb3',
       '--tv-success-color': '#2fc25b',

package/src/core/types/common.ts

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
 /**
  * ECharts 类型定义
  */
@@ -120,7 +121,7 @@ export type EChartsEventParams =
 /**
  * 图表事件监听器
  */
-export type ChartEventListener = Record<string, (params: ChartEventParams) => void>;
+export type _ChartEventListener = Record<string, (_params: ChartEventParams) => void>;
 
 /**
  * 图表渲染器类型

package/src/core/types/index.ts

@@ -123,18 +123,6 @@ export interface ThemeType {
   [key: string]: unknown;
 }
 
-/**
- * 渲染性能优化配置
- */
-export interface RenderOptimizationConfig {
-  progressive?: boolean;
-  progressiveThreshold?: number;
-  lazyUpdate?: boolean;
-  animation?: boolean;
-  hardwareAcceleration?: boolean;
-  frameRate?: number;
-}
-
 /**
  * 适配器配置选项
  */

package/src/core/types/platform.ts

@@ -1,10 +1,8 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
 /**
  * 支持的平台类型
  */
-import type {
-  EChartsType,
-  EChartsOption,
-} from 'echarts';
+import type { EChartsType, EChartsOption } from 'echarts';
 import type { CSSProperties } from 'react';
 import type { ChartEventParams } from './common';
 
@@ -115,7 +113,7 @@ export interface HarmonyAdapterOptions extends AdapterOptions {
 export interface Adapter {
   init(options?: object): EChartsType;
   getInstance(): EChartsType | null;
-  setOption(option: EChartsOption, opts?: object): void;
+  setOption(option: EChartsOption, notMerge?: boolean, lazyUpdate?: boolean): void;
   getWidth(): number;
   getHeight(): number;
   getDom(): HTMLElement | null;

package/src/core/utils/__tests__/deepClone.test.ts

@@ -0,0 +1,317 @@
+import { deepClone, deepMerge } from '../deepClone';
+
+describe('deepClone', () => {
+  // Primitives
+  it('clones primitives', () => {
+    expect(deepClone(42)).toBe(42);
+    expect(deepClone('hello')).toBe('hello');
+    expect(deepClone(true)).toBe(true);
+    expect(deepClone(false)).toBe(false);
+    expect(deepClone(0)).toBe(0);
+    expect(deepClone(-1)).toBe(-1);
+    expect(deepClone(3.14)).toBe(3.14);
+  });
+
+  it('handles null and undefined', () => {
+    expect(deepClone(null)).toBe(null);
+    expect(deepClone(undefined)).toBe(undefined);
+  });
+
+  // Objects
+  it('clones plain objects', () => {
+    const obj = { a: 1, b: 'two', c: true };
+    const clone = deepClone(obj);
+    expect(clone).toEqual(obj);
+    expect(clone).not.toBe(obj);
+  });
+
+  it('clones nested objects', () => {
+    const obj = { a: { b: { c: { d: 42 } } } };
+    const clone = deepClone(obj);
+    expect(clone).toEqual(obj);
+    expect(clone).not.toBe(obj);
+    expect(clone.a).not.toBe(obj.a);
+    expect(clone.a.b).not.toBe(obj.a.b);
+  });
+
+  // Arrays
+  it('clones arrays', () => {
+    const arr = [1, 2, 3, [4, 5]];
+    const clone = deepClone(arr);
+    expect(clone).toEqual(arr);
+    expect(clone).not.toBe(arr);
+    expect(clone[3]).not.toBe(arr[3]);
+  });
+
+  it('clones arrays of objects', () => {
+    const arr = [{ a: 1 }, { b: 2 }];
+    const clone = deepClone(arr);
+    expect(clone).toEqual(arr);
+    expect(clone[0]).not.toBe(arr[0]);
+  });
+
+  // Date
+  it('clones Date objects', () => {
+    const date = new Date('2024-01-15');
+    const clone = deepClone(date);
+    expect(clone).toEqual(date);
+    expect(clone).not.toBe(date);
+    expect(clone.getTime()).toBe(date.getTime());
+  });
+
+  // RegExp
+  it('clones RegExp objects', () => {
+    const re = /foo/gi;
+    const clone = deepClone(re);
+    expect(clone.source).toBe('foo');
+    expect(clone.flags).toBe('gi');
+    expect(clone).not.toBe(re);
+  });
+
+  // Functions
+  it('preserves function references', () => {
+    const fn = (x: number) => x * 2;
+    expect(deepClone(fn)).toBe(fn);
+  });
+
+  it('preserves nested function references', () => {
+    const fn = () => 'hello';
+    const obj = { formatter: fn, nested: { callback: fn } };
+    const clone = deepClone(obj);
+    expect(clone.formatter).toBe(fn);
+    expect(clone.nested.callback).toBe(fn);
+    expect(clone).not.toBe(obj);
+    expect(clone.nested).not.toBe(obj.nested);
+  });
+
+  // Map
+  it('clones Map objects', () => {
+    const map = new Map<string, number>([
+      ['a', 1],
+      ['b', 2],
+    ]);
+    const clone = deepClone(map);
+    expect(clone).not.toBe(map);
+    expect(clone.get('a')).toBe(1);
+    expect(clone.get('b')).toBe(2);
+    expect(clone.size).toBe(2);
+  });
+
+  it('clones Map with object keys and values', () => {
+    const key = { id: 1 };
+    const val = { name: 'test' };
+    const map = new Map([[key, val]]);
+    const clone = deepClone(map);
+    expect(clone).not.toBe(map);
+    // Keys are cloned, so we can't look up with the original key
+    const clonedEntries = Array.from(clone.entries());
+    expect(clonedEntries).toHaveLength(1);
+    expect(clonedEntries[0][0]).toEqual(key);
+    expect(clonedEntries[0][0]).not.toBe(key);
+    expect(clonedEntries[0][1]).toEqual(val);
+    expect(clonedEntries[0][1]).not.toBe(val);
+  });
+
+  // Set
+  it('clones Set objects', () => {
+    const set = new Set([1, 2, 3]);
+    const clone = deepClone(set);
+    expect(clone).not.toBe(set);
+    expect(clone.size).toBe(3);
+    expect(clone.has(1)).toBe(true);
+    expect(clone.has(2)).toBe(true);
+    expect(clone.has(3)).toBe(true);
+  });
+
+  it('clones Set with object values', () => {
+    const obj = { a: 1 };
+    const set = new Set([obj]);
+    const clone = deepClone(set);
+    const clonedValues = Array.from(clone.values());
+    expect(clonedValues[0]).toEqual(obj);
+    expect(clonedValues[0]).not.toBe(obj);
+  });
+
+  // Circular references
+  it('handles circular references in objects', () => {
+    const obj: Record<string, unknown> = { a: 1 };
+    obj.self = obj;
+    const clone = deepClone(obj);
+    expect(clone.a).toBe(1);
+    expect(clone.self).toBe(clone);
+    expect(clone).not.toBe(obj);
+  });
+
+  it('handles circular references in arrays', () => {
+    const arr: unknown[] = [1, 2];
+    arr.push(arr);
+    const clone = deepClone(arr);
+    expect(clone[0]).toBe(1);
+    expect(clone[1]).toBe(2);
+    expect(clone[2]).toBe(clone);
+    expect(clone).not.toBe(arr);
+  });
+
+  it('handles cross-reference between objects', () => {
+    const shared = { value: 42 };
+    const obj = { a: shared, b: shared };
+    const clone = deepClone(obj);
+    expect(clone.a).toEqual(shared);
+    expect(clone.b).toEqual(shared);
+    // Both references should point to the same clone
+    expect(clone.a).toBe(clone.b);
+    expect(clone.a).not.toBe(shared);
+  });
+
+  // ECharts-like option objects
+  it('clones ECharts-like option objects', () => {
+    const formatter = (params: { value: number }) => `${params.value}%`;
+    const options = {
+      title: {
+        text: 'Sales',
+        subtext: '2024',
+      },
+      tooltip: {
+        trigger: 'axis' as const,
+        formatter,
+      },
+      xAxis: {
+        type: 'category' as const,
+        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri'],
+      },
+      yAxis: {
+        type: 'value' as const,
+      },
+      series: [
+        {
+          name: 'Sales',
+          type: 'line' as const,
+          data: [150, 230, 224, 218, 135],
+          label: {
+            show: true,
+            formatter: (params: { value: number }) => `${params.value}`,
+          },
+        },
+      ],
+    };
+
+    const clone = deepClone(options);
+
+    // Structure equality
+    expect(clone).toEqual(options);
+    // Deep copy
+    expect(clone).not.toBe(options);
+    expect(clone.title).not.toBe(options.title);
+    expect(clone.series).not.toBe(options.series);
+    expect(clone.series[0]).not.toBe(options.series[0]);
+    // Function preserved
+    expect(clone.tooltip.formatter).toBe(formatter);
+    expect(clone.series[0].label.formatter).toBe(options.series[0].label.formatter);
+  });
+
+  // Mixed types
+  it('clones complex mixed structures', () => {
+    const obj = {
+      str: 'hello',
+      num: 42,
+      bool: true,
+      nil: null,
+      undef: undefined,
+      date: new Date('2024-06-01'),
+      regex: /test/gi,
+      arr: [1, [2, 3], { a: 4 }],
+      fn: () => 'test',
+      map: new Map([['key', { nested: true }]]),
+      set: new Set([{ x: 1 }, { x: 2 }]),
+      nested: {
+        deep: {
+          deeper: {
+            value: 'bottom',
+          },
+        },
+      },
+    };
+
+    const clone = deepClone(obj);
+
+    expect(clone.str).toBe('hello');
+    expect(clone.num).toBe(42);
+    expect(clone.bool).toBe(true);
+    expect(clone.nil).toBe(null);
+    expect(clone.undef).toBe(undefined);
+    expect(clone.date).toEqual(obj.date);
+    expect(clone.date).not.toBe(obj.date);
+    expect(clone.regex.source).toBe('test');
+    expect(clone.regex).not.toBe(obj.regex);
+    expect(clone.arr).toEqual([1, [2, 3], { a: 4 }]);
+    expect(clone.arr).not.toBe(obj.arr);
+    expect(clone.fn).toBe(obj.fn);
+    expect(clone.map).not.toBe(obj.map);
+    expect(clone.set).not.toBe(obj.set);
+    expect(clone.nested.deep.deeper.value).toBe('bottom');
+    expect(clone.nested).not.toBe(obj.nested);
+  });
+});
+
+describe('deepMerge', () => {
+  it('merges flat objects', () => {
+    const target = { a: 1, b: 2 };
+    const source = { b: 3, c: 4 };
+    const result = deepMerge(target, source);
+    expect(result).toEqual({ a: 1, b: 3, c: 4 });
+  });
+
+  it('merges nested objects recursively', () => {
+    const target = { a: { x: 1, y: 2 }, b: 1 };
+    const source = { a: { y: 3, z: 4 } };
+    const result = deepMerge(target, source);
+    expect(result).toEqual({ a: { x: 1, y: 3, z: 4 }, b: 1 });
+  });
+
+  it('replaces arrays instead of merging them', () => {
+    const target = { arr: [1, 2, 3] };
+    const source = { arr: [4, 5] };
+    const result = deepMerge(target, source);
+    expect(result.arr).toEqual([4, 5]);
+  });
+
+  it('replaces primitives with source values', () => {
+    const target = { a: 1, b: 'old' };
+    const source = { a: 2, b: 'new' };
+    const result = deepMerge(target, source);
+    expect(result).toEqual({ a: 2, b: 'new' });
+  });
+
+  it('preserves function references from source', () => {
+    const fn = () => 'hello';
+    const target = { a: 1 };
+    const source = { formatter: fn };
+    const result = deepMerge(target, source);
+    expect(result.formatter).toBe(fn);
+  });
+
+  it('does not mutate target or source', () => {
+    const target = { a: { x: 1 } };
+    const source = { a: { y: 2 } };
+    deepMerge(target, source);
+    expect(target).toEqual({ a: { x: 1 } });
+    expect(source).toEqual({ a: { y: 2 } });
+  });
+
+  it('merges ECharts-like option objects', () => {
+    const target = {
+      title: { text: 'Chart' },
+      tooltip: { trigger: 'axis' as const },
+      series: [{ type: 'line' as const, data: [1, 2, 3] }],
+    };
+    const source = {
+      title: { subtext: 'Sub' },
+      tooltip: { formatter: (p: { value: number }) => `${p.value}%` },
+    };
+    const result = deepMerge(target, source);
+    expect(result.title).toEqual({ text: 'Chart', subtext: 'Sub' });
+    expect(result.tooltip.trigger).toBe('axis');
+    expect(typeof result.tooltip.formatter).toBe('function');
+    expect(result.series).toEqual([{ type: 'line', data: [1, 2, 3] }]);
+  });
+});

package/src/core/utils/__tests__/index.test.ts

@@ -92,7 +92,8 @@ describe('Data Processing Utilities', () => {
 
     it('should limit execution to once per interval', () => {
       const mockFn = jest.fn();
-      const throttledFn = throttle(mockFn, 100);
+      // 使用 leading=true, trailing=false 来匹配简单 throttle 行为
+      const throttledFn = throttle(mockFn, 100, { leading: true, trailing: false });
 
       throttledFn();
       expect(mockFn).toHaveBeenCalledTimes(1);

package/src/core/utils/chartInstances.ts

@@ -83,3 +83,16 @@ export function resizeAllCharts(): void {
     }
   });
 }
+
+/**
+ * Dispose and remove stale chart instances (those whose DOM container is gone)
+ * Call periodically or from ErrorBoundary componentDidCatch
+ */
+export function disposeStaleCharts(): void {
+  Object.keys(CHART_INSTANCES).forEach((id) => {
+    const instance = CHART_INSTANCES[id];
+    if (!instance || instance.isDisposed()) {
+      delete CHART_INSTANCES[id];
+    }
+  });
+}