@hsu-react/ui 0.0.12 → 0.0.14

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 VitaHsu
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,5 +1,8 @@
 # @hsu-react/ui
 
+[![npm version](https://img.shields.io/npm/v/@hsu-react/ui.svg)](https://www.npmjs.com/package/@hsu-react/ui)
+[![license](https://img.shields.io/npm/l/@hsu-react/ui.svg)](./LICENSE)
+
 一套基于 **React + Ant Design** 的中后台业务组件库，把「列表 + 搜索 + 表单弹窗 + CRUD」这类重复劳动沉淀为页面级组件，并内置 Markdown / CodeMirror / Spreadsheet / Chart / Editor 等内容组件。
 
 📖 **文档与在线示例：https://vitatsui.github.io/hsu-ui**
@@ -54,3 +57,11 @@ yarn docs:build  # 构建文档站静态产物
 反馈 `Modal` · AI `Chat`
 
 详见文档站。
+
+## 贡献
+
+日常开发在 `develop` 分支进行（feature 分支合入 `develop`），`main` 只接受来自 `develop` 的 PR；合入 `main` 后按 `package.json` 版本自动打 tag 并发布 npm。PR 标题遵循 [Conventional Commits](https://www.conventionalcommits.org/)。
+
+## License
+
+[MIT](./LICENSE) © VitaHsu

package/es/components/Button/index.js

@@ -14,8 +14,8 @@ import classNames from "classnames";
 import styles from "./index.module.scss";
 import ChakraButton from "./ChakraButton";
 import { jsx as _jsx } from "react/jsx-runtime";
-// forwardRef：被 Tooltip / Popconfirm 等浮层组件包裹时可直接拿到按钮 DOM，
-// 避免 rc 库退回 findDOMNode 触发 React 弃用警告
+// forwardRef: when wrapped by overlay components like Tooltip / Popconfirm, the button DOM can be accessed directly,
+// preventing rc libraries from falling back to findDOMNode and triggering React deprecation warnings
 var InternalButton = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var hasPermi = props.hasPermi,
     hidden = props.hidden,

package/es/components/ChainGraph/ChainGraphServices/Edges/ArrowEdge.js

@@ -27,13 +27,13 @@ export default function ArrowEdge(arrowEdgeProps) {
     var line = group.addShape("path", {
       attrs: _objectSpread({
         path: [
-        // 起始点
+        // Start point
         ["M", startPoint.x, startPoint.y],
-        // 水平向右到中间X位置
+        // Horizontally right to the middle X position
         ["L", (startPoint.x + endPoint.x) / 2, startPoint.y],
-        // 垂直向下/上到终点Y位置
+        // Vertically down/up to the end point's Y position
         ["L", (startPoint.x + endPoint.x) / 2, endPoint.y],
-        // 水平向右到终点
+        // Horizontally right to the end point
         ["L", endPoint.x, endPoint.y]],
         endArrow: {
           path: "M 0,0 L 6,3 L 6,-3 Z",

package/es/components/ChainGraph/ChainGraphServices/NodeEvents.js

@@ -12,7 +12,7 @@ var NodeEvents = /*#__PURE__*/_createClass(function NodeEvents(_ref) {
   _classCallCheck(this, NodeEvents);
   _defineProperty(this, "_graph", null);
   _defineProperty(this, "_onClick", void 0);
-  // ==================== 节点 hover ====================
+  // ==================== Node hover ====================
   _defineProperty(this, "onNodeHover", function () {
     var _this$_graph, _this$_graph3;
     (_this$_graph = _this._graph) === null || _this$_graph === void 0 || _this$_graph.on("node:mouseenter", function (e) {
@@ -30,7 +30,7 @@ var NodeEvents = /*#__PURE__*/_createClass(function NodeEvents(_ref) {
       }
     });
   });
-  // ==================== 折叠展开 ====================
+  // ==================== Collapse/expand ====================
   _defineProperty(this, "onCollapseExpand", function () {
     var _this$_graph5, _this$_graph7;
     (_this$_graph5 = _this._graph) === null || _this$_graph5 === void 0 || _this$_graph5.on("collapse-icon:mouseenter", function () {
@@ -42,7 +42,7 @@ var NodeEvents = /*#__PURE__*/_createClass(function NodeEvents(_ref) {
       (_this$_graph8 = _this._graph) === null || _this$_graph8 === void 0 || _this$_graph8.setMode("default");
     });
   });
-  // ==================== 节点点击 ====================
+  // ==================== Node click ====================
   _defineProperty(this, "onNodeClick", function (shapeName) {
     var _this$_graph9;
     (_this$_graph9 = _this._graph) === null || _this$_graph9 === void 0 || _this$_graph9.on("".concat(shapeName, ":click"), function (e) {

package/es/components/ChainGraph/ChainGraphServices/RootNode.js

@@ -6,17 +6,17 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import G6 from "@antv/g6";
 import { getTextSize } from ".";
-// ==================== 常量定义 ====================
-var DEFAULT_PADDING = 20; // 节点内边距
-var DEFAULT_LINE_HEIGHT = 18; // 行高
-var DEFAULT_LINE_GAP = 2; // 行间距
-var DEFAULT_ICON_RADIUS = 8; // 折叠图标半径
-var DEFAULT_FONT_SIZE = 20; // 根节点默认字体大小
-var DEFAULT_TEXT_COLOR = "#0c0d0e"; // 默认文本颜色
-var DEFAULT_BG_COLOR = "#fff"; // 默认背景颜色
-var DEFAULT_STROKE_COLOR = "#4096ff"; // 默认边框颜色
-var DEFAULT_HOVER_TEXT_COLOR = "#fff"; // 悬停时文本颜色
-var TEXT_WIDTH_TOLERANCE = 0.01; // 文本宽度容差
+// ==================== Constant definitions ====================
+var DEFAULT_PADDING = 20; // Node padding
+var DEFAULT_LINE_HEIGHT = 18; // Line height
+var DEFAULT_LINE_GAP = 2; // Line spacing
+var DEFAULT_ICON_RADIUS = 8; // Collapse icon radius
+var DEFAULT_FONT_SIZE = 20; // Default font size for root node
+var DEFAULT_TEXT_COLOR = "#0c0d0e"; // Default text color
+var DEFAULT_BG_COLOR = "#fff"; // Default background color
+var DEFAULT_STROKE_COLOR = "#4096ff"; // Default border color
+var DEFAULT_HOVER_TEXT_COLOR = "#fff"; // Text color on hover
+var TEXT_WIDTH_TOLERANCE = 0.01; // Text width tolerance
 
 export default function RootNode(rootNodeProps) {
   var _ref = rootNodeProps || {},
@@ -47,7 +47,7 @@ export default function RootNode(rootNodeProps) {
     maxWidth = _ref2.maxWidth,
     render = _ref2.render;
 
-  // ==================== 文本样式 ====================
+  // ==================== Text styles ====================
   var _textStyle = _objectSpread({
     fill: DEFAULT_TEXT_COLOR,
     fontSize: DEFAULT_FONT_SIZE,
@@ -60,7 +60,7 @@ export default function RootNode(rootNodeProps) {
     fill: DEFAULT_HOVER_TEXT_COLOR
   }, textHoverStyle);
 
-  // ==================== 背景样式 ====================
+  // ==================== Background styles ====================
   var _bgStyle = _objectSpread({
     fill: DEFAULT_BG_COLOR,
     stroke: DEFAULT_STROKE_COLOR,
@@ -74,19 +74,19 @@ export default function RootNode(rootNodeProps) {
     fill: DEFAULT_STROKE_COLOR
   }, hoverBgStyle);
 
-  // ==================== 展开折叠Icon样式 ====================
+  // ==================== Expand/collapse icon style ====================
   var _collapseIconStyle = _objectSpread({
     stroke: DEFAULT_STROKE_COLOR,
     lineWidth: 1,
     fill: DEFAULT_BG_COLOR
   }, collapseIconStyle);
 
-  // ==================== 配置 ====================
+  // ==================== Options ====================
   var options = {
     styles: {}
   };
 
-  // ==================== 获取颜色配置 ====================
+  // ==================== Get color config ====================
   var getColorConfig = function getColorConfig(item) {
     var _item$_cfg;
     var index = ((_item$_cfg = item._cfg) === null || _item$_cfg === void 0 || (_item$_cfg = _item$_cfg.model) === null || _item$_cfg === void 0 ? void 0 : _item$_cfg.level) - rootLevel;
@@ -97,7 +97,7 @@ export default function RootNode(rootNodeProps) {
     };
   };
 
-  // ==================== 设置状态 ====================
+  // ==================== Set state ====================
   var setState = function setState(name, value, item) {
     if (!item) return;
     var group = item.get("group");
@@ -113,7 +113,7 @@ export default function RootNode(rootNodeProps) {
       hoverColor = _getColorConfig.hoverColor,
       selectedColor = _getColorConfig.selectedColor;
 
-    // 处理折叠状态
+    // Handle collapse state
     if (name === "collapse") {
       collapseShape === null || collapseShape === void 0 || collapseShape.attr({
         symbol: value ? G6.Marker.collapse : G6.Marker.expand
@@ -121,7 +121,7 @@ export default function RootNode(rootNodeProps) {
       return;
     }
 
-    // 处理悬停状态
+    // Handle hover state
     if (name === "hover" && !item.hasState("click") && hasHover) {
       var _ref3, _currentColor$bg, _ref4, _currentColor$stroke, _ref5, _currentColor$text;
       var isHover = Boolean(value);
@@ -139,7 +139,7 @@ export default function RootNode(rootNodeProps) {
       return;
     }
 
-    // 处理选中状态
+    // Handle selected state
     if (name === "click" && hasSelected) {
       var _ref6, _currentColor$bg2, _ref7, _currentColor$stroke2, _ref8, _currentColor$text2;
       var isSelected = Boolean(value);
@@ -157,7 +157,7 @@ export default function RootNode(rootNodeProps) {
     }
   };
 
-  // ==================== 文本换行处理 ====================
+  // ==================== Text wrapping ====================
   var wrapText = function wrapText(label, maxWidth) {
     var lines = [];
     var currentLine = "";
@@ -179,7 +179,7 @@ export default function RootNode(rootNodeProps) {
     return lines.length > 0 ? lines : [label];
   };
 
-  // ==================== 计算节点尺寸 ====================
+  // ==================== Calculate node size ====================
   var calculateNodeSize = function calculateNodeSize(label, fontSize) {
     var _getTextSize2 = getTextSize(label, _textStyle),
       width = _getTextSize2.width,
@@ -196,7 +196,7 @@ export default function RootNode(rootNodeProps) {
     };
   };
 
-  // ==================== 绘制 ====================
+  // ==================== Draw ====================
   var draw = function draw(cfg, group) {
     var _textStyle$fontSize, _color$bg, _color$stroke;
     var renderStyle = render === null || render === void 0 ? void 0 : render(cfg, "default");
@@ -214,7 +214,7 @@ export default function RootNode(rootNodeProps) {
     cfg.height = nodeHeight;
     cfg.line = lineCount;
 
-    // 绘制背景
+    // Draw background
     var node = group.addShape("rect", {
       attrs: _objectSpread(_objectSpread(_objectSpread({}, _bgStyle), {}, {
         fill: (_color$bg = color === null || color === void 0 ? void 0 : color.bg) !== null && _color$bg !== void 0 ? _color$bg : _bgStyle.fill,
@@ -228,7 +228,7 @@ export default function RootNode(rootNodeProps) {
       name: "rect-shape"
     });
 
-    // 绘制文本
+    // Draw text
     lines === null || lines === void 0 || lines.forEach(function (line, lineIndex) {
       var _color$text;
       var _getTextSize3 = getTextSize(line, _textStyle),
@@ -248,7 +248,7 @@ export default function RootNode(rootNodeProps) {
       });
     });
 
-    // 绘制展开折叠图标
+    // Draw expand/collapse icon
     var hasChildren = cfg.children && cfg.children.length > 0;
     if (hasChildren) {
       var iconX = nodeWidth / 2;
@@ -266,7 +266,7 @@ export default function RootNode(rootNodeProps) {
       });
     }
 
-    // 自定义形状
+    // Custom shapes
     if (addShape) {
       addShape(group, cfg);
     }

package/es/components/ChainGraph/ChainGraphServices/TreeNode.js

@@ -6,19 +6,19 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import G6 from "@antv/g6";
 import { getTextSize } from ".";
-// ==================== 常量定义 ====================
-var DEFAULT_PADDING = 20; // 节点内边距
-var DEFAULT_LINE_HEIGHT = 18; // 行高
-var DEFAULT_LINE_GAP = 2; // 行间距
-var DEFAULT_ICON_RADIUS = 8; // 折叠图标半径
-var DEFAULT_PORT_WIDTH = 3; // 连接桩宽度
-var DEFAULT_PORT_HEIGHT = 18; // 连接桩高度
-var DEFAULT_FONT_SIZE = 16; // 树节点默认字体大小
-var DEFAULT_TEXT_COLOR = "#0c0d0e"; // 默认文本颜色
-var DEFAULT_BG_COLOR = "#fff"; // 默认背景颜色
-var DEFAULT_STROKE_COLOR = "#4096ff"; // 默认边框颜色
-var DEFAULT_HOVER_TEXT_COLOR = "#fff"; // 悬停时文本颜色
-var TEXT_WIDTH_TOLERANCE = 0.01; // 文本宽度容差
+// ==================== Constant definitions ====================
+var DEFAULT_PADDING = 20; // Node padding
+var DEFAULT_LINE_HEIGHT = 18; // Line height
+var DEFAULT_LINE_GAP = 2; // Line spacing
+var DEFAULT_ICON_RADIUS = 8; // Collapse icon radius
+var DEFAULT_PORT_WIDTH = 3; // Connection port width
+var DEFAULT_PORT_HEIGHT = 18; // Connection port height
+var DEFAULT_FONT_SIZE = 16; // Default font size for tree node
+var DEFAULT_TEXT_COLOR = "#0c0d0e"; // Default text color
+var DEFAULT_BG_COLOR = "#fff"; // Default background color
+var DEFAULT_STROKE_COLOR = "#4096ff"; // Default border color
+var DEFAULT_HOVER_TEXT_COLOR = "#fff"; // Text color on hover
+var TEXT_WIDTH_TOLERANCE = 0.01; // Text width tolerance
 
 export default function TreeNode(treeNodeProps) {
   var _ref = treeNodeProps || {},
@@ -51,7 +51,7 @@ export default function TreeNode(treeNodeProps) {
     maxWidth = _ref2.maxWidth,
     render = _ref2.render;
 
-  // ==================== 文本样式 ====================
+  // ==================== Text styles ====================
   var _textStyle = _objectSpread({
     fill: DEFAULT_TEXT_COLOR,
     fontSize: DEFAULT_FONT_SIZE
@@ -63,7 +63,7 @@ export default function TreeNode(treeNodeProps) {
     fill: DEFAULT_HOVER_TEXT_COLOR
   }, textHoverStyle);
 
-  // ==================== 背景样式 ====================
+  // ==================== Background styles ====================
   var _bgStyle = _objectSpread({
     fill: DEFAULT_BG_COLOR,
     stroke: DEFAULT_STROKE_COLOR,
@@ -77,24 +77,24 @@ export default function TreeNode(treeNodeProps) {
     fill: DEFAULT_STROKE_COLOR
   }, hoverBgStyle);
 
-  // ==================== 展开折叠Icon样式 ====================
+  // ==================== Expand/collapse icon style ====================
   var _collapseIconStyle = _objectSpread({
     stroke: DEFAULT_STROKE_COLOR,
     lineWidth: 1,
     fill: DEFAULT_BG_COLOR
   }, collapseIconStyle);
 
-  // ==================== 连接桩样式 ====================
+  // ==================== Connection port style ====================
   var _portStyle = {
     fill: DEFAULT_STROKE_COLOR
   };
 
-  // ==================== 配置 ====================
+  // ==================== Options ====================
   var options = {
     styles: {}
   };
 
-  // ==================== 获取颜色配置 ====================
+  // ==================== Get color config ====================
   var getColorConfig = function getColorConfig(item) {
     var _item$_cfg;
     var index = ((_item$_cfg = item._cfg) === null || _item$_cfg === void 0 || (_item$_cfg = _item$_cfg.model) === null || _item$_cfg === void 0 ? void 0 : _item$_cfg.level) - rootLevel;
@@ -106,7 +106,7 @@ export default function TreeNode(treeNodeProps) {
     };
   };
 
-  // ==================== 设置状态 ====================
+  // ==================== Set state ====================
   var setState = function setState(name, value, item) {
     if (!item) return;
     var group = item.get("group");
@@ -122,7 +122,7 @@ export default function TreeNode(treeNodeProps) {
       hoverColor = _getColorConfig.hoverColor,
       selectedColor = _getColorConfig.selectedColor;
 
-    // 处理折叠状态
+    // Handle collapse state
     if (name === "collapse") {
       collapseShape === null || collapseShape === void 0 || collapseShape.attr({
         symbol: value ? G6.Marker.collapse : G6.Marker.expand
@@ -130,7 +130,7 @@ export default function TreeNode(treeNodeProps) {
       return;
     }
 
-    // 处理悬停状态
+    // Handle hover state
     if (name === "hover" && !item.hasState("click") && hasHover) {
       var _ref3, _currentColor$bg, _ref4, _currentColor$stroke;
       var isHover = Boolean(value);
@@ -151,7 +151,7 @@ export default function TreeNode(treeNodeProps) {
       return;
     }
 
-    // 处理选中状态
+    // Handle selected state
     if (name === "click" && hasSelected) {
       var _ref6, _currentColor$bg2, _ref7, _currentColor$stroke2;
       var isSelected = Boolean(value);
@@ -172,7 +172,7 @@ export default function TreeNode(treeNodeProps) {
     }
   };
 
-  // ==================== 文本换行处理 ====================
+  // ==================== Text wrapping ====================
   var wrapText = function wrapText(label, maxWidth) {
     var lines = [];
     var currentLine = "";
@@ -194,7 +194,7 @@ export default function TreeNode(treeNodeProps) {
     return lines.length > 0 ? lines : [label || ""];
   };
 
-  // ==================== 计算节点尺寸 ====================
+  // ==================== Calculate node size ====================
   var calculateNodeSize = function calculateNodeSize(label, fontSize) {
     var _getTextSize2 = getTextSize(label, _textStyle),
       width = _getTextSize2.width,
@@ -211,7 +211,7 @@ export default function TreeNode(treeNodeProps) {
     };
   };
 
-  // ==================== 计算文本位置 ====================
+  // ==================== Calculate text position ====================
   var calculateTextPosition = function calculateTextPosition(lineWidth, nodeWidth, direction) {
     if (textAlign === "center") {
       return -lineWidth / 2;
@@ -222,7 +222,7 @@ export default function TreeNode(treeNodeProps) {
     return -lineWidth + nodeWidth / 2 - DEFAULT_PADDING;
   };
 
-  // ==================== 绘制 ====================
+  // ==================== Draw ====================
   var draw = function draw(cfg, group) {
     var _textStyle$fontSize, _color$bg, _color$stroke;
     var renderStyle = render === null || render === void 0 ? void 0 : render(cfg, "default");
@@ -242,7 +242,7 @@ export default function TreeNode(treeNodeProps) {
     cfg.height = nodeHeight;
     cfg.line = lineCount;
 
-    // 绘制背景
+    // Draw background
     var node = group.addShape("rect", {
       attrs: _objectSpread(_objectSpread(_objectSpread({}, _bgStyle), {}, {
         fill: (_color$bg = color === null || color === void 0 ? void 0 : color.bg) !== null && _color$bg !== void 0 ? _color$bg : _bgStyle.fill,
@@ -256,7 +256,7 @@ export default function TreeNode(treeNodeProps) {
       name: "rect-shape"
     });
 
-    // 绘制文本
+    // Draw text
     lines === null || lines === void 0 || lines.forEach(function (line, lineIndex) {
       var _color$text;
       var _getTextSize3 = getTextSize(line, _textStyle),
@@ -276,7 +276,7 @@ export default function TreeNode(treeNodeProps) {
       });
     });
 
-    // 绘制展开折叠图标
+    // Draw expand/collapse icon
     var hasChildren = cfg.children && cfg.children.length > 0;
     if (hasChildren) {
       var iconX = direction === "right" ? nodeWidth / 2 : -nodeWidth / 2;
@@ -294,7 +294,7 @@ export default function TreeNode(treeNodeProps) {
       });
     }
 
-    // 绘制连接桩
+    // Draw connection port
     if (showPort) {
       var _color$port;
       var portX = direction === "right" ? -nodeWidth / 2 - DEFAULT_PORT_WIDTH : nodeWidth / 2;
@@ -313,7 +313,7 @@ export default function TreeNode(treeNodeProps) {
       });
     }
 
-    // 自定义形状
+    // Custom shapes
     if (addShape) {
       addShape(group, cfg);
     }

package/es/components/ChainGraph/ChainGraphServices/index.js

@@ -15,10 +15,10 @@ import { deepCopy } from "hsu-utils";
 import NodeEvents from "./NodeEvents";
 import { findAncestorsOfNode, getTextSize, rootTextStyle, nodeTextStyle, edgeStyle } from "../_utils";
 
-// 重新导出 getTextSize 以保持向后兼容
+// Re-export getTextSize for backward compatibility
 export { getTextSize };
 
-// ==================== 链图服务 ====================
+// ==================== Chain graph service ====================
 var ChainGraphServices = /*#__PURE__*/function () {
   function ChainGraphServices(options) {
     var _this = this;
@@ -34,7 +34,7 @@ var ChainGraphServices = /*#__PURE__*/function () {
     _defineProperty(this, "_fitLeft", false);
     _defineProperty(this, "_paddingLeft", 0);
     _defineProperty(this, "_layout", {});
-    // ==================== 调整大小 ====================
+    // ==================== Resize ====================
     _defineProperty(this, "_resize", function (containerId) {
       var graph = _this._graph;
       var container = document.getElementById(containerId);
@@ -73,7 +73,7 @@ var ChainGraphServices = /*#__PURE__*/function () {
         }
       }
     });
-    // ==================== 设置MiniMap ====================
+    // ==================== Set MiniMap ====================
     _defineProperty(this, "setMiniMap", function (showMiniMap) {
       if (!_this._minimap) return;
       var graph = _this._graph;
@@ -83,7 +83,7 @@ var ChainGraphServices = /*#__PURE__*/function () {
         graph === null || graph === void 0 || graph.removePlugin(_this._minimap);
       }
     });
-    // ==================== 设置数据 ====================
+    // ==================== Set data ====================
     _defineProperty(this, "setData", function (_ref) {
       var data = _ref.data,
         _ref$level = _ref.level,
@@ -153,7 +153,7 @@ var ChainGraphServices = /*#__PURE__*/function () {
       });
       _this._data = data;
     });
-    // ==================== 搜索 ====================
+    // ==================== Search ====================
     _defineProperty(this, "onSearch", function (searchVal) {
       if (!_this._graph || _this._graph.destroyed || !_this._data || searchVal === _this._searchVal) {
         return;
@@ -177,7 +177,7 @@ var ChainGraphServices = /*#__PURE__*/function () {
         (_this$_nodeEvents = _this._nodeEvents) === null || _this$_nodeEvents === void 0 || _this$_nodeEvents.setNodeState(node);
       }
     });
-    // ==================== 展开所有节点 ====================
+    // ==================== Expand all nodes ====================
     _defineProperty(this, "expandAll", function (_ref2) {
       var allExpand = _ref2.allExpand,
         _ref2$level = _ref2.level,
@@ -211,7 +211,7 @@ var ChainGraphServices = /*#__PURE__*/function () {
         _graph.fitCenter();
       }
     });
-    // ==================== 修改布局 ====================
+    // ==================== Change layout ====================
     _defineProperty(this, "changeLayout", function (octopus) {
       var rootLevel = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
       var getImage = arguments.length > 2 ? arguments[2] : undefined;
@@ -315,7 +315,7 @@ var ChainGraphServices = /*#__PURE__*/function () {
         maxWidth: 260
       }, node);
 
-      /** 注册根节点 */
+      /** Register root node */
       G6.registerNode("root-node", RootNode({
         styles: _root,
         colors: colors,
@@ -324,7 +324,7 @@ var ChainGraphServices = /*#__PURE__*/function () {
         hasSelected: hasSelected,
         addShape: addShape
       }), "rect");
-      /** 注册树节点 */
+      /** Register tree node */
       G6.registerNode("tree-node", TreeNode({
         styles: _node,
         showPort: showPort,
@@ -334,7 +334,7 @@ var ChainGraphServices = /*#__PURE__*/function () {
         hasSelected: hasSelected,
         addShape: addShape
       }), "rect");
-      /** 注册箭头边 */
+      /** Register arrow edge */
       G6.registerEdge("arrow-edge", ArrowEdge({
         styles: edge === null || edge === void 0 ? void 0 : edge.style
       }));

package/es/components/ChainGraph/_components/SearchSelect/index.module.scss

@@ -1,5 +1,5 @@
-// 定位容器给定 32px 固定高度，Select 通过 height:100% 填满它，
-// 避免 Select 根的 height:100% 直接相对图谱（绝对定位祖先）解析成整图高度而被拉伸。
+// The positioning container is given a fixed 32px height, and the Select fills it via height:100%,
+// preventing the Select root's height:100% from resolving against the graph (its absolutely positioned ancestor) and being stretched to the full graph height.
 .wrapper {
   position: absolute;
   top: 20px;

package/es/components/ChainGraph/_utils/findAncestorsOfNode.d.ts

@@ -1,9 +1,9 @@
 import { TreeGraphData } from "..";
 /**
- * 树结构找节点所有父节点
- * @param tree 树数据
- * @param targetNodeId 目标节点ID
- * @param childrenKey 子节点键名，默认为 "children"
- * @returns 祖先节点ID数组
+ * Find all ancestor nodes of a node in a tree structure
+ * @param tree Tree data
+ * @param targetNodeId Target node ID
+ * @param childrenKey Key name for child nodes, defaults to "children"
+ * @returns Array of ancestor node IDs
  */
 export declare function findAncestorsOfNode(tree: TreeGraphData, targetNodeId: string, childrenKey?: string): string[];

package/es/components/ChainGraph/_utils/findAncestorsOfNode.js

@@ -5,33 +5,33 @@ function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symb
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 /**
- * 树结构找节点所有父节点
- * @param tree 树数据
- * @param targetNodeId 目标节点ID
- * @param childrenKey 子节点键名，默认为 "children"
- * @returns 祖先节点ID数组
+ * Find all ancestor nodes of a node in a tree structure
+ * @param tree Tree data
+ * @param targetNodeId Target node ID
+ * @param childrenKey Key name for child nodes, defaults to "children"
+ * @returns Array of ancestor node IDs
  */
 export function findAncestorsOfNode(tree, targetNodeId) {
   var childrenKey = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : "children";
   var ancestors = [];
   function traverse(node) {
     if (node.id === targetNodeId) {
-      // 找到目标节点
-      ancestors = [].concat(_toConsumableArray(ancestors), [node.id]); // 将目标节点添加到祖先列表中（可选，取决于是否需要包含目标节点自身）
-      return true; // 停止遍历
+      // Target node found
+      ancestors = [].concat(_toConsumableArray(ancestors), [node.id]); // Add the target node to the ancestor list (optional, depending on whether the target node itself should be included)
+      return true; // Stop traversal
     }
 
-    // 递归遍历子节点
+    // Recursively traverse child nodes
     if (node[childrenKey] && node[childrenKey].length) {
       var _node$childrenKey;
       (_node$childrenKey = node[childrenKey]) === null || _node$childrenKey === void 0 || _node$childrenKey.forEach(function (child) {
         if (traverse(child)) {
-          ancestors.push(node.id); // 如果子节点中找到了目标节点，将当前节点添加到祖先列表
-          return true; // 停止遍历
+          ancestors.push(node.id); // If the target node was found among the children, add the current node to the ancestor list
+          return true; // Stop traversal
         }
       });
     }
-    return false; // 未找到目标节点
+    return false; // Target node not found
   }
   traverse(tree);
   return ancestors;

package/es/components/ChainGraph/_utils/getTextSize.d.ts

@@ -1,9 +1,9 @@
 import { ShapeStyle } from "@antv/g6";
 /**
- * 获取文字大小
- * @param text 文本内容
- * @param textStyle 文本样式
- * @returns 文本的宽度和高度
+ * Get text size
+ * @param text Text content
+ * @param textStyle Text style
+ * @returns Width and height of the text
  */
 export declare const getTextSize: (text: string, textStyle: ShapeStyle) => {
     width: number;

package/es/components/ChainGraph/_utils/getTextSize.js

@@ -1,10 +1,10 @@
 import { get_string_size } from "hsu-utils";
 
 /**
- * 获取文字大小
- * @param text 文本内容
- * @param textStyle 文本样式
- * @returns 文本的宽度和高度
+ * Get text size
+ * @param text Text content
+ * @param textStyle Text style
+ * @returns Width and height of the text
  */
 export var getTextSize = function getTextSize(text, textStyle) {
   var _textStyle$fontWeight;