@agions/taroviz 1.11.5 → 2.0.3

package/src/core/components/Annotation.tsx

@@ -57,7 +57,7 @@ export interface MarkLineConfig {
   label?: {
     show?: boolean;
     position?: 'start' | 'middle' | 'end' | 'insideStartBottom' | 'insideStartTop';
-    formatter?: string | ((value: unknown) => string);
+    formatter?: string | ((_value: unknown) => string);
     color?: string;
     fontSize?: number;
   };
@@ -81,7 +81,7 @@ export interface MarkAreaConfig {
   label?: {
     show?: boolean;
     position?: 'top' | 'bottom' | 'left' | 'right' | 'inside';
-    formatter?: string | ((value: unknown) => string);
+    formatter?: string | ((_value: unknown) => string);
     color?: string;
     fontSize?: number;
   };
@@ -98,7 +98,7 @@ export interface ScatterAnnotationConfig {
   /** 数据点 */
   data: Array<{
     coord: [number | string, number];
-    value?: number;
+    _value?: number;
     name: string;
   }>;
   /** 符号类型 */
@@ -111,7 +111,7 @@ export interface ScatterAnnotationConfig {
   label?: {
     show?: boolean;
     position?: string;
-    formatter?: string | ((value: unknown) => string);
+    formatter?: string | ((_value: unknown) => string);
     color?: string;
   };
 }
@@ -290,8 +290,8 @@ export const AnnotationPresets = {
   }),
 
   /** 警戒线 */
-  thresholdLine: (value: number, color = '#faad14'): MarkLineConfig => ({
-    data: [{ yAxis: value, name: '警戒线' }],
+  thresholdLine: (_value: number, color = '#faad14'): MarkLineConfig => ({
+    data: [{ yAxis: _value, name: '警戒线' }],
     lineStyle: { color, type: 'solid', width: 2 },
     label: { show: true, position: 'start', color },
   }),

package/src/core/components/BaseChart.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
 /**
  * TaroViz 基础图表组件
  * 所有图表组件的基类
@@ -6,20 +7,18 @@
  * 所有具体的图表组件（如折线图、柱状图等）都继承自该组件
  */
 import React, { useEffect, useRef, useMemo, useCallback } from 'react';
+import { deepClone } from '../utils/deepClone';
 
 import { generateEChartsAnimationConfig } from '../animation';
 import { EChartsOption, EChartsType, AnimationConfig } from '../types';
 import type { DataZoomComponentOption } from 'echarts';
 import { registerChart, removeChart, getChart } from '../utils/chartInstances';
-import { DebugPanel, DebugPanelOptions, updateDebugInfo } from '../utils/debug';
 import { PerformanceAnalyzer } from '../utils/performance';
 import { normalizeSize, calculateDataLength, filterDataByKeys } from '../utils/chartUtils';
 import BaseChartWrapper from '../../charts/common/BaseChartWrapper';
 import type { BaseChartProps } from '../../charts/types';
 import type {
   EChartsMouseEventParams,
-  EChartsDataZoomEventParams,
-  EChartsLegendEventParams,
   EChartsTooltipEventParams,
   ChartEventParams,
   ChartExportOptions,
@@ -42,15 +41,14 @@ export interface ChartProps {
   chartId?: string;
   option?: EChartsOption;
   animation?: AnimationConfig;
-  debug?: boolean | DebugPanelOptions;
   width?: number | string;
   height?: number | string;
   theme?: string | object;
   autoResize?: boolean;
   direction?: 'ltr' | 'rtl';
-  onInit?: (instance: EChartsType) => void;
-  onClick?: (params: ChartEventParams) => void;
-  onDataZoom?: (params: ChartEventParams) => void;
+  onInit?: (_instance: EChartsType) => void;
+  onClick?: (_params: ChartEventParams) => void;
+  onDataZoom?: (_params: ChartEventParams) => void;
   style?: React.CSSProperties;
   className?: string;
   children?: React.ReactNode;
@@ -65,30 +63,30 @@ export interface ChartProps {
     dataSize: number;
   }) => void;
   enableZoom?: boolean;
-  onZoom?: (data: { start: number; end: number; dataZoomIndex: number }) => void;
+  onZoom?: (data: { start: number; end: number; _dataZoomIndex: number }) => void;
   enableDataFiltering?: boolean;
-  filters?: Record<string, string | number | boolean | string[] | null>;
-  onDataFiltered?: (filteredData: unknown[], filters: Record<string, unknown>) => void;
+  _filters?: Record<string, string | number | boolean | string[] | null>;
+  onDataFiltered?: (_filteredData: unknown[], _filters: Record<string, unknown>) => void;
   enableLegendInteraction?: boolean;
   legendInteractionMode?: 'single' | 'multiple' | 'all';
-  onLegendSelect?: (params: { name: string; selected: Record<string, boolean> }) => void;
-  onLegendUnselect?: (params: { name: string; selected: Record<string, boolean> }) => void;
-  onLegendSelectAll?: (params: { selected: Record<string, boolean> }) => void;
-  onLegendInverseSelect?: (params: { selected: Record<string, boolean> }) => void;
+  onLegendSelect?: (_params: { name: string; selected: Record<string, boolean> }) => void;
+  onLegendUnselect?: (_params: { name: string; selected: Record<string, boolean> }) => void;
+  onLegendSelectAll?: (_params: { selected: Record<string, boolean> }) => void;
+  onLegendInverseSelect?: (_params: { selected: Record<string, boolean> }) => void;
   enableCustomTooltip?: boolean;
   customTooltipContent?: (
-    params: EChartsMouseEventParams | EChartsMouseEventParams[]
+    _params: EChartsMouseEventParams | EChartsMouseEventParams[]
   ) => React.ReactNode;
   customTooltipStyle?: React.CSSProperties;
-  onTooltipShow?: (params: EChartsTooltipEventParams) => void;
-  onTooltipHide?: (params: EChartsTooltipEventParams) => void;
-  onExport?: (dataURL: string, options: ChartExportOptions) => void;
+  onTooltipShow?: (_params: EChartsTooltipEventParams) => void;
+  onTooltipHide?: (_params: EChartsTooltipEventParams) => void;
+  onExport?: (_dataURL: string, options: ChartExportOptions) => void;
   linkageConfig?: ChartLinkageConfig;
   onDataUpdate?: (
     oldOption: EChartsOption | undefined,
     newOption: EChartsOption | undefined
   ) => void;
-  dataUpdateOptions?: { enabled?: boolean; deepCompare?: boolean; debounceDelay?: number };
+  _dataUpdateOptions?: { enabled?: boolean; deepCompare?: boolean; debounceDelay?: number };
 }
 
 // ============================================================================
@@ -100,7 +98,6 @@ const BaseChart: React.FC<ChartProps> = (props) => {
     chartId,
     option,
     animation,
-    debug,
     width = '100%',
     height = '300px',
     theme,
@@ -120,7 +117,7 @@ const BaseChart: React.FC<ChartProps> = (props) => {
     enableZoom: _enableZoom = false,
     onZoom,
     enableDataFiltering = false,
-    filters = {},
+    _filters = {},
     onDataFiltered,
     enableLegendInteraction = false,
     legendInteractionMode = 'single',
@@ -136,7 +133,7 @@ const BaseChart: React.FC<ChartProps> = (props) => {
     onExport: _onExport,
     linkageConfig = {},
     onDataUpdate,
-    dataUpdateOptions = {},
+    _dataUpdateOptions = {},
   } = props;
 
   // Refs
@@ -159,28 +156,20 @@ const BaseChart: React.FC<ChartProps> = (props) => {
   const adapterRef = useRef<unknown>(null);
   const performanceAnalyzerRef = useRef<PerformanceAnalyzer | null>(null);
 
-  // Debug config
-  const debugConfig = useMemo(() => {
-    if (!debug) return null;
-    return typeof debug === 'boolean'
-      ? { enabled: debug, autoExpand: false }
-      : { enabled: true, ...debug };
-  }, [debug]);
-
-  // Wrapper option that applies virtual scroll + data filtering
+  // Wrapper option that applies virtual scroll + _data filtering
   const wrappedOption = useMemo(() => {
     if (!option) return undefined;
     let processed: Record<string, unknown> = { ...option };
 
-    // Apply data filtering
-    if (enableDataFiltering && filters && Object.keys(filters).length > 0) {
-      processed = JSON.parse(JSON.stringify(processed)) as typeof processed;
+    // Apply _data filtering
+    if (enableDataFiltering && _filters && Object.keys(_filters).length > 0) {
+      processed = deepClone(processed);
       if (processed.series && Array.isArray(processed.series)) {
         processed.series = (processed.series as unknown[]).map((s: unknown) => {
-          const seriesItem = s as { data?: unknown[]; [key: string]: unknown };
-          if (seriesItem.data && Array.isArray(seriesItem.data)) {
-            const filtered = filterDataByKeys(seriesItem.data, filters);
-            if (onDataFiltered) onDataFiltered(filtered, filters);
+          const seriesItem = s as { _data?: unknown[]; [key: string]: unknown };
+          if (seriesItem._data && Array.isArray(seriesItem._data)) {
+            const filtered = filterDataByKeys(seriesItem._data, _filters);
+            if (onDataFiltered) onDataFiltered(filtered, _filters);
             if (virtualScroll) {
               virtualScrollRef.current.totalDataCount = filtered.length;
               virtualScrollRef.current.totalPages = Math.ceil(
@@ -191,26 +180,26 @@ const BaseChart: React.FC<ChartProps> = (props) => {
                 start + virtualScrollPageSize + virtualScrollPreloadSize,
                 filtered.length
               );
-              return { ...seriesItem, data: filtered.slice(start, end) };
+              return { ...seriesItem, _data: filtered.slice(start, end) };
             }
-            return { ...seriesItem, data: filtered };
+            return { ...seriesItem, _data: filtered };
           }
           return seriesItem;
         });
       }
     }
 
-    // Inject dataZoom when enableZoom is true (keyboard-accessible zoom)
+    // Inject _dataZoom when enableZoom is true (keyboard-accessible zoom)
     if (_enableZoom) {
-      processed = JSON.parse(JSON.stringify(processed));
-      // Avoid duplicate dataZoom entries
-      const existingDzArr = Array.isArray(processed.dataZoom)
-        ? (processed.dataZoom as DataZoomComponentOption[])
-        : processed.dataZoom
-          ? [processed.dataZoom as DataZoomComponentOption]
+      processed = deepClone(processed);
+      // Avoid duplicate _dataZoom entries
+      const existingDzArr = Array.isArray(processed._dataZoom)
+        ? (processed._dataZoom as DataZoomComponentOption[])
+        : processed._dataZoom
+          ? [processed._dataZoom as DataZoomComponentOption]
           : [];
       if (!existingDzArr.some((dz) => dz?.type === 'inside')) {
-        processed.dataZoom = [
+        processed._dataZoom = [
           ...(existingDzArr || []),
           // Inside (mouse wheel + keyboard) — wired to keyboard nav in BaseChartWrapper
           { type: 'inside', start: 0, end: 100, zoomOnMouseWheel: true, moveOnMouseMove: false },
@@ -219,15 +208,15 @@ const BaseChart: React.FC<ChartProps> = (props) => {
     }
 
     // Apply animation config
-    const dataLength = calculateDataLength(processed);
-    const animConfig = generateEChartsAnimationConfig(animation, dataLength);
+    const _dataLength = calculateDataLength(processed);
+    const animConfig = generateEChartsAnimationConfig(animation, _dataLength);
     return { ...processed, ...animConfig } as EChartsOption;
   }, [
     option,
     animation,
     _enableZoom,
     enableDataFiltering,
-    filters,
+    _filters,
     virtualScroll,
     virtualScrollPageSize,
     virtualScrollPreloadSize,
@@ -236,9 +225,9 @@ const BaseChart: React.FC<ChartProps> = (props) => {
 
   // Internal chartInit that wraps the user's callback
   const handleChartInit = useCallback(
-    (instance: EChartsType) => {
-      chartInstanceRef.current = instance;
-      adapterRef.current = instance as unknown;
+    (_instance: EChartsType) => {
+      chartInstanceRef.current = _instance;
+      adapterRef.current = _instance as unknown;
 
       // Performance monitoring init
       if (enablePerformanceMonitoring) {
@@ -255,33 +244,33 @@ const BaseChart: React.FC<ChartProps> = (props) => {
       performanceRef.current.initStartTime = Date.now();
 
       // Register for linkage
-      if (chartId) registerChart(chartId, instance);
+      if (chartId) registerChart(chartId, _instance);
 
       // Setup internal event handlers for linkage + virtual scroll
-      if (instance) {
+      if (_instance) {
         // Click linkage
         if (linkageConfig.enableClickLinkage && chartId && linkageConfig.linkedChartIds) {
-          instance.on('click', (params: ECElementEvent) => {
+          _instance.on('click', (_params: ECElementEvent) => {
             linkageConfig.linkedChartIds!.forEach((lid) => {
               const linked = getChart(lid);
-              if (linked) linked.dispatchAction({ type: 'highlight', name: params.name });
+              if (linked) linked.dispatchAction({ type: 'highlight', name: _params.name });
             });
           });
         }
 
         // Zoom + zoom linkage + virtual scroll page update
-        instance.on('datazoom', (params: unknown) => {
-          const p = params as {
+        _instance.on('_datazoom', (_params: unknown) => {
+          const p = _params as {
             start?: number;
             end?: number;
-            dataZoomIndex?: number;
-            batch?: Array<{ start?: number; end?: number; dataZoomIndex?: number }>;
+            _dataZoomIndex?: number;
+            batch?: Array<{ start?: number; end?: number; _dataZoomIndex?: number }>;
           };
           if (onZoom)
             onZoom({
               start: p.start || 0,
               end: p.end || 100,
-              dataZoomIndex: p.dataZoomIndex || 0,
+              _dataZoomIndex: p._dataZoomIndex || 0,
             });
           if (virtualScroll && !virtualScrollRef.current.isScrolling) {
             virtualScrollRef.current.isScrolling = true;
@@ -301,10 +290,10 @@ const BaseChart: React.FC<ChartProps> = (props) => {
               const linked = getChart(lid);
               if (linked)
                 linked.dispatchAction({
-                  type: 'dataZoom',
+                  type: '_dataZoom',
                   start: p.start,
                   end: p.end,
-                  dataZoomIndex: p.dataZoomIndex,
+                  _dataZoomIndex: p._dataZoomIndex,
                 });
             });
           }
@@ -312,8 +301,8 @@ const BaseChart: React.FC<ChartProps> = (props) => {
 
         // Legend interaction
         if (enableLegendInteraction) {
-          instance.on('legendselectchanged', (params: unknown) => {
-            const p = params as { name?: string; selected: Record<string, boolean> };
+          _instance.on('legendselectchanged', (_params: unknown) => {
+            const p = _params as { name?: string; selected: Record<string, boolean> };
             const { name, selected } = p;
             if (linkageConfig.enableLegendLinkage && chartId && linkageConfig.linkedChartIds) {
               linkageConfig.linkedChartIds!.forEach((lid) => {
@@ -326,7 +315,7 @@ const BaseChart: React.FC<ChartProps> = (props) => {
               Object.keys(selected).forEach((k) => {
                 newSelected[k] = k === name;
               });
-              instance.setOption({ legend: { selected: newSelected } });
+              _instance.setOption({ legend: { selected: newSelected } });
               if (name !== undefined) onLegendSelect?.({ name, selected: newSelected });
             } else {
               if (name !== undefined && selected[name]) onLegendSelect?.({ name, selected });
@@ -337,16 +326,16 @@ const BaseChart: React.FC<ChartProps> = (props) => {
 
         // Custom tooltip
         if (enableCustomTooltip && customTooltipContent) {
-          instance.on('tooltipshow', (params: unknown) =>
-            onTooltipShow?.(params as EChartsTooltipEventParams)
+          _instance.on('tooltipshow', (_params: unknown) =>
+            onTooltipShow?.(_params as EChartsTooltipEventParams)
           );
-          instance.on('tooltiphide', (params: unknown) =>
-            onTooltipHide?.(params as EChartsTooltipEventParams)
+          _instance.on('tooltiphide', (_params: unknown) =>
+            onTooltipHide?.(_params as EChartsTooltipEventParams)
           );
-          instance.setOption({
+          _instance.setOption({
             tooltip: {
-              formatter: (params: unknown) =>
-                String(customTooltipContent(params as EChartsMouseEventParams)),
+              formatter: (_params: unknown) =>
+                String(customTooltipContent(_params as EChartsMouseEventParams)),
               ...(customTooltipStyle && {
                 backgroundColor: 'transparent',
                 borderColor: 'transparent',
@@ -357,32 +346,7 @@ const BaseChart: React.FC<ChartProps> = (props) => {
         }
       }
 
-      // Update debug panel
-      if (debugConfig?.enabled) {
-        updateDebugInfo({
-          instance: {
-            id: chartId,
-            type: 'ECharts',
-            renderer: 'canvas',
-            width: typeof width === 'number' ? width : undefined,
-            height: typeof height === 'number' ? height : undefined,
-            platform: 'web',
-          },
-          config: wrappedOption,
-          data: {
-            series: Array.isArray(wrappedOption?.series) ? wrappedOption.series : [],
-            totalDataCount: calculateDataLength(wrappedOption),
-            currentDataCount: calculateDataLength(wrappedOption),
-          },
-          performance: {
-            initTime: 0,
-            renderTime: 0,
-            dataSize: JSON.stringify(wrappedOption).length,
-          },
-        });
-      }
-
-      onInit?.(instance);
+      onInit?.(_instance);
       performanceRef.current.initEndTime = Date.now();
     },
     [
@@ -415,7 +379,7 @@ const BaseChart: React.FC<ChartProps> = (props) => {
         renderTime: p.renderEndTime - p.renderStartTime,
         initTime: p.initEndTime - p.initStartTime,
         updateTime: p.updateEndTime - p.updateStartTime,
-        dataSize: JSON.stringify(option).length,
+        dataSize: estimateDataSize(option),
       });
     }
   }, [option, onPerformance]);
@@ -424,9 +388,9 @@ const BaseChart: React.FC<ChartProps> = (props) => {
   const debounceTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
   useEffect(() => {
-    if (!onDataUpdate || dataUpdateOptions?.enabled === false) return;
+    if (!onDataUpdate || _dataUpdateOptions?.enabled === false) return;
 
-    const delay = dataUpdateOptions?.debounceDelay ?? 0;
+    const delay = _dataUpdateOptions?.debounceDelay ?? 0;
 
     if (debounceTimerRef.current) {
       clearTimeout(debounceTimerRef.current);
@@ -454,7 +418,7 @@ const BaseChart: React.FC<ChartProps> = (props) => {
         debounceTimerRef.current = null;
       }
     };
-  }, [option, onDataUpdate, dataUpdateOptions]);
+  }, [option, onDataUpdate, _dataUpdateOptions]);
 
   // Cleanup on unmount
   useEffect(() => {
@@ -490,38 +454,38 @@ const BaseChart: React.FC<ChartProps> = (props) => {
   return (
     <>
       <BaseChartWrapper {...wrapperProps} />
-      {debugConfig?.enabled && (
-        <DebugPanel
-          options={debugConfig}
-          debugInfo={{
-            instance: {
-              id: chartId,
-              type: 'ECharts',
-              renderer: 'canvas',
-              width: typeof width === 'number' ? width : undefined,
-              height: typeof height === 'number' ? height : undefined,
-              platform: 'web',
-            },
-            config: option,
-            data: {
-              series: Array.isArray(option?.series) ? option.series : [],
-              totalDataCount: calculateDataLength(option),
-              currentDataCount: calculateDataLength(option),
-            },
-            performance: {
-              initTime: performanceRef.current.initEndTime - performanceRef.current.initStartTime,
-              renderTime:
-                performanceRef.current.renderEndTime - performanceRef.current.renderStartTime,
-              updateTime: 0,
-              dataSize: JSON.stringify(option).length,
-            },
-          }}
-        />
-      )}
     </>
   );
 };
 
+/**
+ * Lightweight estimation of option data size without expensive JSON.stringify.
+ * Counts approximate character length by summing string values and array lengths.
+ */
+function estimateDataSize(option: unknown): number {
+  if (option == null) return 0;
+  if (typeof option === 'string') return option.length;
+  if (typeof option !== 'object') return 8; // number/boolean approximation
+
+  let size = 0;
+  const obj = option as Record<string, unknown>;
+  for (const key in obj) {
+    if (!Object.prototype.hasOwnProperty.call(obj, key)) continue;
+    size += key.length + 1; // key + colon
+    const val = obj[key];
+    if (typeof val === 'string') {
+      size += val.length + 2; // quotes
+    } else if (Array.isArray(val)) {
+      size += val.length * 4; // rough per-element estimate
+    } else if (typeof val === 'object' && val !== null) {
+      size += estimateDataSize(val);
+    } else {
+      size += 8; // number/boolean
+    }
+  }
+  return size;
+}
+
 function normalizeSizeObject(
   width: number | string,
   height: number | string,

package/src/core/components/LazyChart.tsx

@@ -30,9 +30,8 @@ export const LazyLineChart = createLazyComponent('LineChart');
 export const LazyBarChart = createLazyComponent('BarChart');
 export const LazyPieChart = createLazyComponent('PieChart');
 export const LazyScatterChart = createLazyComponent('ScatterChart');
-export const LazyRadarChart = createLazyComponent('RadarChart');
+export const LazyRadarChart = createLazyComponent('RadarChartCustom');
 export const LazyHeatmapChart = createLazyComponent('HeatmapChart');
-export const LazyGaugeChart = createLazyComponent('GaugeChart');
 export const LazyFunnelChart = createLazyComponent('FunnelChart');
 export const LazyTreeMapChart = createLazyComponent('TreeMapChart');
 export const LazySunburstChart = createLazyComponent('SunburstChart');
@@ -42,17 +41,13 @@ export const LazySankeyChart = createLazyComponent('SankeyChart');
  * 图表类型到懒加载模块的映射
  * 用于预加载功能
  */
-const LAZY_CHART_MODULES: Record<
-  string,
-  () => Promise<{ default: ComponentType<BaseChartProps> }>
-> = {
+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.RadarChart })),
+  radar: () => import('../../charts').then((m) => ({ default: m.RadarChartCustom })),
   heatmap: () => import('../../charts').then((m) => ({ default: m.HeatmapChart })),
-  gauge: () => import('../../charts').then((m) => ({ default: m.GaugeChart })),
   funnel: () => import('../../charts').then((m) => ({ default: m.FunnelChart })),
   treemap: () => import('../../charts').then((m) => ({ default: m.TreeMapChart })),
   sunburst: () => import('../../charts').then((m) => ({ default: m.SunburstChart })),

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/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/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/platform.ts

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
 /**
  * 支持的平台类型
  */