@hsu-react/ui 0.0.12 → 0.0.14

package/es/components/Chart/Bubble/index.js

@@ -22,7 +22,7 @@ import styles from "../index.module.scss";
 import * as echarts from "echarts";
 import { defaultBubbleColorList, drawCircles } from "../_utils/bubble";
 
-// 扩展的数据项类型，包含图表需要的所有属性
+// Extended data item type containing all properties the chart needs
 import { jsx as _jsx } from "react/jsx-runtime";
 var Bubble = function Bubble(props) {
   var className = props.className,
@@ -50,19 +50,19 @@ var Bubble = function Bubble(props) {
     containerSize = _useState2[0],
     setContainerSize = _useState2[1];
 
-  // 缓存位置计算结果
+  // Cache the position calculation results
   var positionCacheRef = useRef(null);
 
-  // 生成缓存key，基于数据内容和容器尺寸
+  // Generate a cache key based on data content and container size
   var generateCacheKey = useCallback(function (data, width, height) {
-    // 基于数据的name和value生成key，确保数据变化时能检测到
+    // Build the key from each item's name and value so data changes are detected
     var dataKey = data === null || data === void 0 ? void 0 : data.map(function (item) {
       return "".concat(item.name, ":").concat(item.value);
     }).join("|");
     return "".concat(layoutVersion, "_").concat(dataKey, "_").concat(width, "_").concat(height);
   }, [layoutVersion]);
 
-  // 仅用于布局的半径补偿：当大小差异过大时，给小球增加额外布局半径，避免被大球挤压
+  // Radius compensation used only for layout: when size differences are too large, give small bubbles extra layout radius to avoid being squeezed by big ones
   var getLayoutRadiusList = useCallback(function (rawRadiusList) {
     if (!rawRadiusList.length) return rawRadiusList;
     var validRadiusList = rawRadiusList.filter(function (radius) {
@@ -84,9 +84,9 @@ var Bubble = function Bubble(props) {
     });
   }, []);
 
-  // 处理数据并生成图表配置
+  // Process the data and generate the chart option
   var chartOption = useMemo(function () {
-    // 容器尺寸未获取或数据为空时，返回空配置
+    // Return an empty option when the container size is not yet available or the data is empty
     if (!data || data.length === 0 || containerSize.width === 0 || containerSize.height === 0) {
       return {};
     }
@@ -97,31 +97,31 @@ var Bubble = function Bubble(props) {
       });
     });
 
-    // 计算最大值
+    // Compute the maximum value
     var max = 0;
     countList === null || countList === void 0 || countList.forEach(function (e) {
       if (e.value >= max) max = e.value;
     });
 
-    // 获取容器尺寸
+    // Get the container size
     var graphCanvas = containerSize;
 
-    // 基础气泡大小，根据容器尺寸和数据数量动态调整
+    // Base bubble size, dynamically adjusted by container size and data count
     var containerMin = Math.min(graphCanvas.width, graphCanvas.height);
     var containerArea = graphCanvas.width * graphCanvas.height;
     var dataCount = countList.length;
 
-    // 根据数据数量和容器面积动态调整基础尺寸
-    // 目标：尽量把气泡做大，让一层层外扩时紧贴容器边界；同时为环间隙留出必要空间。
+    // Dynamically adjust the base size by data count and container area
+    // Goal: make bubbles as large as possible so the outward-expanding rings hug the container edge, while leaving necessary space for ring gaps.
     var areaPerBubble = containerArea / dataCount;
-    var estimatedMaxRadius = Math.sqrt(areaPerBubble / Math.PI) * 0.82; // 提高密度系数，气泡更大
+    var estimatedMaxRadius = Math.sqrt(areaPerBubble / Math.PI) * 0.82; // Higher density factor, larger bubbles
 
-    // 数量越多，基础尺寸越小，避免重叠
+    // The more items there are, the smaller the base size, to avoid overlap
     var sizeFactor = Math.max(0.55, 1.35 - dataCount * 0.07);
-    var baseSize = Math.min(170 * sizeFactor, containerMin / (1.9 + dataCount * 0.08), estimatedMaxRadius * 2 // 确保不超过估算的最大半径
+    var baseSize = Math.min(170 * sizeFactor, containerMin / (1.9 + dataCount * 0.08), estimatedMaxRadius * 2 // Ensure it does not exceed the estimated max radius
     );
 
-    // 自适应非线性映射：压缩大值、抬升小值，数据差距仍可读但视觉更饱满
+    // Adaptive non-linear mapping: compress large values and lift small ones, keeping the data gap readable while looking visually fuller
     var minPositiveValue = countList.map(function (item) {
       return item.value;
     }).filter(function (value) {
@@ -132,7 +132,7 @@ var Bubble = function Bubble(props) {
     var safeMinValue = Number.isFinite(minPositiveValue) ? minPositiveValue : 1;
     var valueRatio = max > 0 ? max / safeMinValue : 1;
     var compressPower = valueRatio > 20 ? 0.38 : valueRatio > 10 ? 0.46 : valueRatio > 4 ? 0.56 : 0.7;
-    // 最小气泡的底线提高，避免最小那颗过小难以识别；仍保留与最大值的可见差距
+    // Raise the floor for the smallest bubble so it is not too small to recognize, while keeping a visible gap from the largest value
     var minScale = valueRatio > 20 ? 0.74 : valueRatio > 10 ? 0.68 : valueRatio > 4 ? 0.62 : 0.56;
     var maxScale = 1.1;
     var symbolSizeList = countList.map(function (item) {
@@ -147,31 +147,31 @@ var Bubble = function Bubble(props) {
     });
     var layoutRadiusList = getLayoutRadiusList(rawRadiusList);
 
-    // 生成缓存key
+    // Generate the cache key
     var cacheKey = generateCacheKey(data, graphCanvas.width, graphCanvas.height);
 
-    // 检查缓存，如果数据或容器尺寸没有变化，使用缓存的位置
+    // Check the cache; if neither data nor container size changed, use the cached positions
     var randomCircleArr;
     if (positionCacheRef.current && positionCacheRef.current.cacheKey === cacheKey && positionCacheRef.current.positions.length === layoutRadiusList.length) {
-      // 使用缓存的位置
+      // Use the cached positions
       randomCircleArr = positionCacheRef.current.positions;
     } else {
-      // 重新计算位置
+      // Recalculate positions
       randomCircleArr = drawCircles(layoutRadiusList, graphCanvas.width, graphCanvas.height);
-      // 更新缓存
+      // Update the cache
       positionCacheRef.current = {
         cacheKey: cacheKey,
         positions: randomCircleArr
       };
     }
 
-    // 处理每个数据项
+    // Process each data item
     countList === null || countList === void 0 || countList.forEach(function (e, i) {
       var _symbolSizeList$i;
       var symbolSize = (_symbolSizeList$i = symbolSizeList[i]) !== null && _symbolSizeList$i !== void 0 ? _symbolSizeList$i : baseSize * 0.5;
       var fontSize = propFontSize !== null && propFontSize !== void 0 ? propFontSize : Math.max(12, Math.min(20, symbolSize * 0.28));
 
-      // 先计算 symbolSize，因为 label 的 width 需要用到它
+      // Compute symbolSize first, since the label's width depends on it
       var finalSymbolSize = symbolSize;
       if (randomCircleArr[i]) {
         e.x = randomCircleArr[i].x;
@@ -179,7 +179,7 @@ var Bubble = function Bubble(props) {
         e.symbolSize = symbolSize;
         finalSymbolSize = symbolSize;
       } else {
-        // 兜底：放在容器中心
+        // Fallback: place it at the container center
         e.symbolSize = symbolSize;
         e.x = graphCanvas.width / 2;
         e.y = graphCanvas.height / 2;
@@ -191,10 +191,10 @@ var Bubble = function Bubble(props) {
           color: "#fff",
           fontSize: fontSize,
           width: finalSymbolSize,
-          // 设置宽度为气泡直径
+          // Set the width to the bubble diameter
           overflow: "truncate",
-          // 超出部分截断
-          ellipsis: "..." // 省略号
+          // Truncate overflowing text
+          ellipsis: "..." // Ellipsis
         }
       };
       e.emphasis = {
@@ -204,7 +204,7 @@ var Bubble = function Bubble(props) {
       };
       e.itemStyle = {
         normal: {
-          color: colorList[i % colorListLen] // 使用索引确保颜色一致性
+          color: colorList[i % colorListLen] // Use the index to keep colors consistent
         }
       };
     });
@@ -237,7 +237,7 @@ var Bubble = function Bubble(props) {
     return option;
   }, [data, colorList, chartTitle, propFontSize, title, tooltip, series, coreOption, containerSize, generateCacheKey, getLayoutRadiusList]);
 
-  // 设置 ResizeObserver 监听容器尺寸变化（包括首次获取尺寸）
+  // Set up a ResizeObserver to watch container size changes (including the initial size read)
   useEffect(function () {
     if (!chartRef.current) return;
     var containerElement = chartRef.current.parentElement;
@@ -267,45 +267,45 @@ var Bubble = function Bubble(props) {
     };
   }, []);
 
-  // 处理图表 resize 的回调
+  // Callback for handling chart resize
   var handleResize = useCallback(function () {
     var _chartInstanceRef$cur;
     (_chartInstanceRef$cur = chartInstanceRef.current) === null || _chartInstanceRef$cur === void 0 || _chartInstanceRef$cur.resize();
-    // 重新设置配置以更新气泡位置
+    // Re-apply the option to update bubble positions
     if (chartInstanceRef.current && data && data.length > 0) {
       chartInstanceRef.current.setOption(chartOption, true);
     }
   }, [chartOption, data]);
 
-  // 初始化图表
+  // Initialize the chart
   useEffect(function () {
     if (!chartRef.current) return;
-    // 等待容器尺寸有效后再初始化图表
+    // Wait until the container size is valid before initializing the chart
     if (containerSize.width === 0 || containerSize.height === 0) return;
 
-    // 初始化或获取已存在的实例
+    // Initialize or reuse the existing instance
     var chart = chartInstanceRef.current;
     if (!chart) {
       chart = echarts.init(chartRef.current);
       chartInstanceRef.current = chart;
-      // 首次初始化时调用 onChart 回调
+      // Call the onChart callback on first initialization
       onChart === null || onChart === void 0 || onChart(chart);
     }
 
-    // 先 resize 确保 echarts 获取到正确的容器尺寸，再设置配置
+    // Resize first so echarts picks up the correct container size, then apply the option
     chart.resize();
     chart.setOption(chartOption, true);
 
-    // 添加 window resize 监听
+    // Add window resize listener
     window.addEventListener("resize", handleResize);
 
-    // 添加点击事件
+    // Add click event
     if (onClick) {
       var _chartInstanceRef$cur2;
       (_chartInstanceRef$cur2 = chartInstanceRef.current) === null || _chartInstanceRef$cur2 === void 0 || _chartInstanceRef$cur2.on("click", onClick);
     }
 
-    // 清理函数
+    // Cleanup function
     return function () {
       window.removeEventListener("resize", handleResize);
       if (onClick) {
@@ -315,7 +315,7 @@ var Bubble = function Bubble(props) {
     };
   }, [chartOption, containerSize.width, containerSize.height, handleResize, onChart, onClick]);
 
-  // 组件卸载时清理图表实例
+  // Dispose the chart instance when the component unmounts
   useEffect(function () {
     return function () {
       if (chartInstanceRef.current) {

package/es/components/Chart/Common/index.js

@@ -20,59 +20,59 @@ var Common = function Common(props) {
   var chartInstanceRef = useRef(null);
   var resizeObserverRef = useRef(null);
 
-  // 使用 useMemo 缓存 chart 配置
+  // Cache the chart configuration with useMemo
   var chartOption = useMemo(function () {
     var option = _objectSpread({}, coreOption);
     return option;
   }, [coreOption]);
 
-  // 处理图表 resize 的回调
+  // Callback that handles chart resize
   var handleResize = useCallback(function () {
     var _chartInstanceRef$cur;
     (_chartInstanceRef$cur = chartInstanceRef.current) === null || _chartInstanceRef$cur === void 0 || _chartInstanceRef$cur.resize();
   }, []);
 
-  // 初始化图表
+  // Initialize the chart
   useEffect(function () {
     if (!chartRef.current) return;
 
-    // 初始化或获取已存在的实例
+    // Initialize or reuse an existing instance
     var chart = chartInstanceRef.current;
     if (!chart) {
       chart = echarts.init(chartRef.current);
       chartInstanceRef.current = chart;
     }
 
-    // 设置配置
+    // Apply the configuration
     chart.setOption(chartOption, true);
 
-    // 图表就绪回调（可用于图例自动滚动等）
+    // Chart-ready callback (can be used for legend auto-scroll, etc.)
     onChart === null || onChart === void 0 || onChart(chart);
 
-    // 添加 resize 监听
+    // Add resize listener
     window.addEventListener("resize", handleResize);
 
-    // 添加 ResizeObserver
+    // Add ResizeObserver
     if (chartRef.current && !resizeObserverRef.current) {
       resizeObserverRef.current = new ResizeObserver(handleResize);
       resizeObserverRef.current.observe(chartRef.current);
     }
 
-    // 清理函数
+    // Cleanup function
     return function () {
       window.removeEventListener("resize", handleResize);
     };
   }, [chartOption, handleResize, onChart]);
 
-  // 组件卸载时清理资源
+  // Clean up resources on component unmount
   useEffect(function () {
     return function () {
-      // 清理 ResizeObserver
+      // Clean up ResizeObserver
       if (resizeObserverRef.current) {
         resizeObserverRef.current.disconnect();
         resizeObserverRef.current = null;
       }
-      // 销毁图表实例
+      // Dispose the chart instance
       if (chartInstanceRef.current) {
         chartInstanceRef.current.dispose();
         chartInstanceRef.current = null;

package/es/components/Chart/Gauge/index.js

@@ -33,7 +33,7 @@ var Gauge = function Gauge(props) {
   var chartInstanceRef = useRef(null);
   var resizeObserverRef = useRef(null);
 
-  // 使用 useMemo 缓存 chart 配置
+  // Cache the chart option with useMemo
   var chartOption = useMemo(function () {
     var option = {
       series: _objectSpread({
@@ -80,50 +80,50 @@ var Gauge = function Gauge(props) {
     return option;
   }, [color, pointer, detail, title, axisLine, axisTick, progress, splitLine, axisLabel, seriesData, coreSeries]);
 
-  // 处理图表 resize 的回调
+  // Callback for handling chart resize
   var handleResize = useCallback(function () {
     var _chartInstanceRef$cur;
     (_chartInstanceRef$cur = chartInstanceRef.current) === null || _chartInstanceRef$cur === void 0 || _chartInstanceRef$cur.resize();
   }, []);
 
-  // 初始化图表
+  // Initialize the chart
   useEffect(function () {
     if (!chartRef.current) return;
 
-    // 初始化或获取已存在的实例
+    // Initialize or reuse the existing instance
     var chart = chartInstanceRef.current;
     if (!chart) {
       chart = echarts.init(chartRef.current);
       chartInstanceRef.current = chart;
     }
 
-    // 设置配置
+    // Apply the option
     chart.setOption(chartOption, true);
 
-    // 添加 resize 监听
+    // Add resize listener
     window.addEventListener("resize", handleResize);
 
-    // 添加 ResizeObserver
+    // Add ResizeObserver
     if (chartRef.current && !resizeObserverRef.current) {
       resizeObserverRef.current = new ResizeObserver(handleResize);
       resizeObserverRef.current.observe(chartRef.current);
     }
 
-    // 清理函数
+    // Cleanup function
     return function () {
       window.removeEventListener("resize", handleResize);
     };
   }, [chartOption, handleResize]);
 
-  // 组件卸载时清理资源
+  // Clean up resources when the component unmounts
   useEffect(function () {
     return function () {
-      // 清理 ResizeObserver
+      // Clean up ResizeObserver
       if (resizeObserverRef.current) {
         resizeObserverRef.current.disconnect();
         resizeObserverRef.current = null;
       }
-      // 销毁图表实例
+      // Dispose the chart instance
       if (chartInstanceRef.current) {
         chartInstanceRef.current.dispose();
         chartInstanceRef.current = null;

package/es/components/Chart/Group/index.js

@@ -48,7 +48,7 @@ var ChartGroup = function ChartGroup(props) {
     pageNum && setPageNumDef(pageNum);
   }, [pageSize, pageNum, chartGroup]);
 
-  // 根据pagesize切割图表数组
+  // Split the chart array by pageSize
   useEffect(function () {
     var length = chartGroup.length;
     var slice = 0;

package/es/components/Chart/Heatmap/index.d.ts

@@ -2,31 +2,31 @@ import React from "react";
 import { ChartCommonProps } from "..";
 import * as echarts from "echarts";
 export interface HeatmapDataItem {
-    /** X 轴索引或名称 */
+    /** X-axis index or name */
     x: number | string;
-    /** Y 轴索引或名称 */
+    /** Y-axis index or name */
     y: number | string;
-    /** 热力值（业务实际数值，如 tooltip 应展示此字段） */
+    /** Heat value (the actual business value; e.g. the tooltip should display this field) */
     value: number;
-    /** 可选：仅用于着色与 visualMap，不传则与 value 相同 */
+    /** Optional: used only for coloring and visualMap; defaults to value when omitted */
     visualWeight?: number;
 }
 export interface ChartHeatmapProps extends ChartCommonProps {
-    /** 热力图数据，格式为 [[x, y, value]] 或 HeatmapDataItem[] */
+    /** Heatmap data, in [[x, y, value]] or HeatmapDataItem[] format */
     data: Array<[number, number, number]> | HeatmapDataItem[];
-    /** X 轴数据（类别名称） */
+    /** X-axis data (category names) */
     xAxisData?: string[];
-    /** Y 轴数据（类别名称） */
+    /** Y-axis data (category names) */
     yAxisData?: string[];
-    /** 图表标题 */
+    /** Chart title */
     chartTitle?: string;
-    /** visualMap 配置 */
+    /** visualMap config */
     visualMap?: echarts.VisualMapComponentOption;
-    /** 图表实例回调 */
+    /** Chart instance callback */
     onChart?: (chart: echarts.EChartsType) => void;
-    /** 点击事件 */
+    /** Click event */
     onClick?: (event: echarts.ECElementEvent) => void;
-    /** 0值颜色 */
+    /** Color for zero values */
     zeroColor?: string | false;
     /** inRangeColor */
     inRangeColor?: string[];

package/es/components/Chart/Heatmap/index.js

@@ -42,21 +42,21 @@ var Heatmap = function Heatmap(props) {
   var chartInstanceRef = useRef(null);
   var resizeObserverRef = useRef(null);
 
-  // 处理数据并生成图表配置
+  // Process the data and generate the chart option
   var chartOption = useMemo(function () {
     var _processedData, _processedData2;
     if (!data || data.length === 0) {
       return {};
     }
 
-    // 转换数据格式为 ECharts 需要的格式 [[x, y, value]]
+    // Convert the data to the [[x, y, value]] format ECharts expects
     var processedData;
     if (Array.isArray(data) && data.length > 0) {
       if (Array.isArray(data[0])) {
-        // 已经是 [[x, y, value]] 格式
+        // Already in [[x, y, value]] format
         processedData = data;
       } else {
-        // 是 HeatmapDataItem[] 格式，需要转换
+        // HeatmapDataItem[] format, needs conversion
         processedData = data === null || data === void 0 ? void 0 : data.map(function (item) {
           var _xAxisData$indexOf, _yAxisData$indexOf;
           var xIndex = typeof item.x === "number" ? item.x : (_xAxisData$indexOf = xAxisData === null || xAxisData === void 0 ? void 0 : xAxisData.indexOf(item.x)) !== null && _xAxisData$indexOf !== void 0 ? _xAxisData$indexOf : 0;
@@ -69,14 +69,14 @@ var Heatmap = function Heatmap(props) {
       processedData = [];
     }
 
-    // 计算值的范围用于 visualMap
+    // Compute the value range for visualMap
     var values = (_processedData = processedData) === null || _processedData === void 0 ? void 0 : _processedData.map(function (item) {
       return item[2];
     });
     var minValue = Math.min.apply(Math, _toConsumableArray(values));
     var maxValue = Math.max.apply(Math, _toConsumableArray(values));
 
-    // 默认 visualMap 配置
+    // Default visualMap config
     var defaultVisualMap = {
       min: minValue,
       max: maxValue,
@@ -92,7 +92,7 @@ var Heatmap = function Heatmap(props) {
       }
     };
 
-    // 处理 xAxis 配置
+    // Process xAxis config
     var def_xAxis = createDefaultHeatmapXAxis(xAxisData);
     var processedXAxis = Array.isArray(xAxis) ? xAxis === null || xAxis === void 0 ? void 0 : xAxis.map(function (item) {
       return _objectSpread(_objectSpread({}, def_xAxis), {}, {
@@ -102,7 +102,7 @@ var Heatmap = function Heatmap(props) {
       data: (xAxis === null || xAxis === void 0 ? void 0 : xAxis.type) === "value" ? undefined : xAxisData
     }, xAxis);
 
-    // 处理 yAxis 配置
+    // Process yAxis config
     var def_yAxis = createDefaultHeatmapYAxis(yAxisData);
     var processedYAxis = Array.isArray(yAxis) ? yAxis === null || yAxis === void 0 ? void 0 : yAxis.map(function (item) {
       return _objectSpread(_objectSpread({}, def_yAxis), {}, {
@@ -112,10 +112,10 @@ var Heatmap = function Heatmap(props) {
       data: (yAxis === null || yAxis === void 0 ? void 0 : yAxis.type) === "value" ? undefined : yAxisData
     }, yAxis);
 
-    // 处理 visualMap 配置
+    // Process visualMap config
     var finalVisualMap = _objectSpread(_objectSpread({}, defaultVisualMap), propVisualMap);
 
-    // 计算 grid 配置
+    // Compute grid config
     var gridConfig = {
       height: "95%",
       top: "5%",
@@ -123,7 +123,7 @@ var Heatmap = function Heatmap(props) {
       containLabel: true
     };
 
-    // 根据 visualMap 的显示状态和方向设置 grid 的 right 或 bottom
+    // Set the grid's right or bottom based on visualMap's visibility and orientation
     if (finalVisualMap.show !== false) {
       var orient = finalVisualMap.orient || defaultVisualMap.orient;
       if (orient === "vertical") {
@@ -133,7 +133,7 @@ var Heatmap = function Heatmap(props) {
       }
     }
 
-    // 合并用户传入的 grid 配置
+    // Merge the user-provided grid config
     Object.assign(gridConfig, grid);
     var option = _objectSpread({
       title: _objectSpread({
@@ -172,44 +172,44 @@ var Heatmap = function Heatmap(props) {
     return option;
   }, [data, inRangeColor, xAxisData, xAxis, yAxisData, yAxis, propVisualMap, grid, chartTitle, title, tooltip, series, coreOption, zeroColor]);
 
-  // 处理图表 resize 的回调
+  // Callback for handling chart resize
   var handleResize = useCallback(function () {
     var _chartInstanceRef$cur;
     (_chartInstanceRef$cur = chartInstanceRef.current) === null || _chartInstanceRef$cur === void 0 || _chartInstanceRef$cur.resize();
   }, []);
 
-  // 初始化图表
+  // Initialize the chart
   useEffect(function () {
     if (!chartRef.current) return;
 
-    // 初始化或获取已存在的实例
+    // Initialize or reuse the existing instance
     var chart = chartInstanceRef.current;
     if (!chart) {
       chart = echarts.init(chartRef.current);
       chartInstanceRef.current = chart;
-      // 首次初始化时调用 onChart 回调
+      // Call the onChart callback on first initialization
       onChart === null || onChart === void 0 || onChart(chart);
     }
 
-    // 设置配置
+    // Apply the option
     chart.setOption(chartOption, true);
 
-    // 添加 resize 监听
+    // Add resize listener
     window.addEventListener("resize", handleResize);
 
-    // 添加 ResizeObserver
+    // Add ResizeObserver
     if (chartRef.current && !resizeObserverRef.current) {
       resizeObserverRef.current = new ResizeObserver(handleResize);
       resizeObserverRef.current.observe(chartRef.current);
     }
 
-    // 添加点击事件
+    // Add click event
     if (onClick) {
       var _chartInstanceRef$cur2;
       (_chartInstanceRef$cur2 = chartInstanceRef.current) === null || _chartInstanceRef$cur2 === void 0 || _chartInstanceRef$cur2.on("click", onClick);
     }
 
-    // 清理函数
+    // Cleanup function
     return function () {
       window.removeEventListener("resize", handleResize);
       if (onClick) {
@@ -219,15 +219,15 @@ var Heatmap = function Heatmap(props) {
     };
   }, [chartOption, handleResize, onChart, onClick]);
 
-  // 组件卸载时清理资源
+  // Clean up resources when the component unmounts
   useEffect(function () {
     return function () {
-      // 清理 ResizeObserver
+      // Clean up ResizeObserver
       if (resizeObserverRef.current) {
         resizeObserverRef.current.disconnect();
         resizeObserverRef.current = null;
       }
-      // 销毁图表实例
+      // Dispose the chart instance
       if (chartInstanceRef.current) {
         chartInstanceRef.current.dispose();
         chartInstanceRef.current = null;

package/es/components/Chart/Line/index.d.ts

@@ -10,15 +10,15 @@ export interface ChartLineProps extends ChartCommonProps {
     scrollConfig?: ChartScrollConfig;
     yAxisNameOffsets?: number[];
     onClick?: (event: echarts.ECElementEvent) => void;
-    /** 图例点选变化回调，参数为当前各系列选中状态（配合 legend.selected 可实现坐标轴重算） */
+    /** Legend selection change callback; the argument is the current selected state of each series (combined with legend.selected, enables axis recalculation) */
     onLegendSelectChanged?: (selected: Record<string, boolean>) => void;
-    /** dataZoom 可见窗口变化回调（滑块/滚轮/自动滚动/初始同步均触发），参数为当前可见的 x 轴索引区间（配合 useDataZoomWindow 可按展示部分重算坐标轴） */
+    /** dataZoom visible-window change callback (fired by slider/wheel/auto-scroll/initial sync); the argument is the currently visible x-axis index range (combined with useDataZoomWindow, enables recalculating axes based on the displayed portion) */
     onDataZoomWindowChanged?: (window: DataZoomIndexWindow) => void;
-    /** 是否启用图例自动滚动，默认 false */
+    /** Whether to enable legend auto-scroll, default false */
     enableLegendAutoScroll?: boolean;
-    /** 图例每页可见数量，默认 8 */
+    /** Number of legend items visible per page, default 8 */
     legendVisibleCount?: number;
-    /** 图例滚动间隔时间(ms)，默认 1500 */
+    /** Legend scroll interval (ms), default 1500 */
     legendScrollInterval?: number;
 }
 declare const ChartLine: React.FC<ChartLineProps>;