@zhenliang/sheet 0.2.5-beta.10 → 0.2.5-beta.11

package/dist/core/editor/InputOptionsEditor/DropMenu.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import type { OptionItem } from './utils';
+import './index.less';
+interface DropMenuProps {
+    options: OptionItem[];
+    onOptionClick: (opt: OptionItem) => void;
+    style?: React.CSSProperties;
+}
+declare const DropMenu: ({ options, onOptionClick, style }: DropMenuProps) => JSX.Element;
+export default DropMenu;

package/dist/core/editor/InputOptionsEditor/DropMenu.js

@@ -0,0 +1,52 @@
+import { InfoCircleOutlined } from '@ant-design/icons';
+import { Menu, Tooltip } from 'antd';
+import "./index.less";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var renderMenuItems = function renderMenuItems(items, onOptionClick) {
+  return items.map(function (opt) {
+    if (opt.children && opt.children.length > 0) {
+      return /*#__PURE__*/_jsx(Menu.SubMenu, {
+        title: opt.label,
+        className: "formula-editor-dropdown-submenu",
+        children: renderMenuItems(opt.children, onOptionClick)
+      }, opt.value);
+    }
+    return /*#__PURE__*/_jsxs(Menu.Item, {
+      className: "formula-editor-dropdown-item",
+      onClick: function onClick() {
+        return onOptionClick(opt);
+      },
+      children: [opt.label, opt.info ? /*#__PURE__*/_jsx(Tooltip, {
+        title: opt.info,
+        children: /*#__PURE__*/_jsx(InfoCircleOutlined, {
+          style: {
+            color: '#FF9900',
+            marginLeft: 4
+          }
+        })
+      }) : null]
+    }, opt.value);
+  });
+};
+var DropMenu = function DropMenu(_ref) {
+  var options = _ref.options,
+    onOptionClick = _ref.onOptionClick,
+    style = _ref.style;
+  return /*#__PURE__*/_jsx(Menu, {
+    className: "formula-editor-dropdown",
+    style: style,
+    onMouseDown: function onMouseDown(e) {
+      e.preventDefault();
+      e.stopPropagation();
+    },
+    children: options.length === 0 ? /*#__PURE__*/_jsx(Menu.Item, {
+      disabled: true,
+      children: /*#__PURE__*/_jsx("span", {
+        className: "formula-editor-dropdown-no-data",
+        children: "\u6682\u65E0\u6570\u636E"
+      })
+    }, "no-data") : renderMenuItems(options, onOptionClick)
+  });
+};
+export default DropMenu;

package/dist/core/editor/InputOptionsEditor/index.d.ts

@@ -1,5 +1,5 @@
 import type { SheetType } from "../../../type";
 import './index.less';
-import { OptionItem, inputProps } from './utils';
+import { inputProps, OptionItem } from './utils';
 export declare const getFormulaInputEditor: (options: OptionItem[], replaceIndex?: string, extraProps?: inputProps, getExtraProps?: ((props: SheetType.CellEditorProps) => inputProps) | undefined, choseEditor?: ((record: any) => boolean) | undefined) => SheetType.CellEditor;
 export default getFormulaInputEditor;

package/dist/core/editor/InputOptionsEditor/index.js

@@ -4,7 +4,6 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
 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); }
-function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
@@ -12,34 +11,19 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function _objectDestructuringEmpty(obj) { if (obj == null) throw new TypeError("Cannot destructure " + obj); }
-import { InfoCircleOutlined } from '@ant-design/icons';
-import { Dropdown, Input, Menu, Tooltip } from 'antd';
+import { Dropdown, Input } from 'antd';
 import { get, head, isEmpty, isNil } from 'lodash';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { formulaString } from "../numberEditor";
+import DropMenu from "./DropMenu";
 import "./index.less";
-import { flattenOptions, getCursorPositionInSpan, getSpanAtCursor, getStringDiff, moveCursorToSpan, replaceLabelsWithValues, replaceLongestDiff, replaceValuesWithLabels, tokenize, validateVariables } from "./utils";
+import { useKeyEventEffect } from "./keyEventEffect";
+import { createSpan, flattenOptions, getStringDiff, moveCursorToSpan, replaceLabelsWithValues, replaceLongestDiff, replaceValuesWithLabels, SpanType, tokenize, validateVariables } from "./utils";
 import validateCalculationExpr from "./vaildFormula";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
 var OPERATORS = ['=', '+', '-', '*', '/', '('];
-
-// // 创建 label span
-// const createLabelSpan = (label: string): HTMLElement => {
-//   const span = document.createElement('span');
-//   span.className = 'formula-editor-token-label';
-//   span.textContent = label;
-//   return span;
-// };
-
-// // 创建 empty other span
-// const createEmptyOtherSpan = (): HTMLElement => {
-//   const span = document.createElement('span');
-//   span.className = 'formula-editor-token-other';
-//   span.textContent = '';
-//   return span;
-// };
-
+var LABEL = SpanType.LABEL,
+  OTHER = SpanType.OTHER;
 export var getFormulaInputEditor = function getFormulaInputEditor(options, replaceIndex, extraProps, getExtraProps, choseEditor) {
   var _ref = extraProps || {},
     warnMethod = _ref.warnMethod,
@@ -94,39 +78,7 @@ export var getFormulaInputEditor = function getFormulaInputEditor(options, repla
       return tokenize(inputValue, flatOptions);
     }, [inputValue, flatOptions]);
     // 根据搜索文本获取筛选后的层级选项（保持层级结构）
-    var filteredHierarchyOptions = useMemo(function () {
-      var searchText = inputAfterDropDownShow.trim();
-      // 如果搜索文本为空，显示所有选项（保持层级）
-      if (!searchText) {
-        return options;
-      }
 
-      // 根据搜索文本筛选，保持层级结构
-      var filterWithHierarchy = function filterWithHierarchy(items) {
-        var result = [];
-        var _iterator = _createForOfIteratorHelper(items),
-          _step;
-        try {
-          for (_iterator.s(); !(_step = _iterator.n()).done;) {
-            var item = _step.value;
-            var labelMatch = item.label.includes(searchText);
-            // 筛选 children
-            var filteredChildren = item.children ? filterWithHierarchy(item.children) : [];
-            if (labelMatch || filteredChildren.length > 0) {
-              result.push(_objectSpread(_objectSpread({}, item), {}, {
-                children: filteredChildren.length > 0 ? filteredChildren : item.children
-              }));
-            }
-          }
-        } catch (err) {
-          _iterator.e(err);
-        } finally {
-          _iterator.f();
-        }
-        return result;
-      };
-      return filterWithHierarchy(options);
-    }, [inputAfterDropDownShow]);
     useEffect(function () {
       if (!open) {
         containerValueSnapShot.current = '';
@@ -159,9 +111,7 @@ export var getFormulaInputEditor = function getFormulaInputEditor(options, repla
         var replacedIndex = _allSpans.indexOf(replacedSpan);
         var _targetSpan = _allSpans[replacedIndex + 1];
         if (!_targetSpan || _targetSpan.classList.contains('formula-editor-token-label')) {
-          _targetSpan = document.createElement('span');
-          _targetSpan.className = 'formula-editor-token-other';
-          _targetSpan.textContent = '';
+          _targetSpan = createSpan(OTHER, '');
           replacedSpan.after(_targetSpan);
         }
         moveCursorToSpan(_targetSpan, true, selection);
@@ -196,23 +146,17 @@ export var getFormulaInputEditor = function getFormulaInputEditor(options, repla
       var afterPart = spanText.slice(deleteIndex + deleteText.length);
 
       // 删除当前 span，用三个 span 替换：other（前）、label、other（后）
-      var labelSpan = document.createElement('span');
-      labelSpan.className = 'formula-editor-token-label';
-      labelSpan.textContent = opt.label;
+      var labelSpan = createSpan(LABEL, opt.label);
 
       // 创建待插入的 span 列表
       var spansToInsert = [];
       if (beforePart) {
-        var beforeSpan = document.createElement('span');
-        beforeSpan.className = 'formula-editor-token-other';
-        beforeSpan.textContent = beforePart;
+        var beforeSpan = createSpan(OTHER, beforePart);
         spansToInsert.push(beforeSpan);
       }
       spansToInsert.push(labelSpan);
       if (afterPart) {
-        var afterSpan = document.createElement('span');
-        afterSpan.className = 'formula-editor-token-other';
-        afterSpan.textContent = afterPart;
+        var afterSpan = createSpan(OTHER, afterPart);
         spansToInsert.push(afterSpan);
       }
       // 插入所有 span
@@ -226,9 +170,7 @@ export var getFormulaInputEditor = function getFormulaInputEditor(options, repla
 
       // 如果下一个 span 是 label 类型或没有下一个 span，则插入一个空 span
       if (!targetSpan || targetSpan.classList.contains('formula-editor-token-label')) {
-        targetSpan = document.createElement('span');
-        targetSpan.className = 'formula-editor-token-other';
-        targetSpan.textContent = '';
+        targetSpan = createSpan(OTHER, '');
         labelSpan.after(targetSpan);
       }
       moveCursorToSpan(targetSpan, true, selection);
@@ -294,6 +236,18 @@ export var getFormulaInputEditor = function getFormulaInputEditor(options, repla
       setInputAfterDropDownShow(inputStringAfterDropDownShow);
       onChange(valueExpr);
     }, [containerValue, open]);
+    var _useKeyEventEffect = useKeyEventEffect({
+        closeDorpDown: closeDorpDown,
+        setOffsetX: setOffsetX,
+        setOpen: setOpen,
+        containerRef: containerRef,
+        tempSpanRef: tempSpanRef,
+        inputAfterDropDownShow: inputAfterDropDownShow,
+        options: options
+      }),
+      handleMouseUp = _useKeyEventEffect.handleMouseUp,
+      handleKeyDown = _useKeyEventEffect.handleKeyDown,
+      filteredHierarchyOptions = _useKeyEventEffect.filteredHierarchyOptions;
 
     // 编辑状态时自动聚焦
     useEffect(function () {
@@ -302,314 +256,6 @@ export var getFormulaInputEditor = function getFormulaInputEditor(options, repla
         (_containerRef$current2 = containerRef.current) === null || _containerRef$current2 === void 0 || _containerRef$current2.focus();
       }
     }, [isEditing]);
-
-    // 鼠标释放时，如果光标在 label span 内，打开下拉框并记录 tempSpan
-    var handleMouseUp = useCallback(function () {
-      var div = containerRef.current;
-      if (!div) return;
-      closeDorpDown();
-      var selection = window.getSelection();
-      if (!selection || selection.rangeCount === 0) return;
-      var range = selection.getRangeAt(0);
-      var startContainer = range.startContainer;
-      var currentSpan = getSpanAtCursor(startContainer);
-      if (!currentSpan || currentSpan === div) return;
-      var isLabelSpan = currentSpan.classList.contains('formula-editor-token-label');
-
-      // 如果在 label span 内，打开下拉框并记录 tempSpan
-      if (isLabelSpan) {
-        // 更新 offsetX 位置
-        var containerRect = div.getBoundingClientRect();
-        var cursorRect = range.getBoundingClientRect();
-        var cursorDistance = cursorRect ? cursorRect.left - containerRect.left : 0;
-        setOffsetX(cursorDistance < 150 ? 0 : cursorDistance - 8);
-
-        // 记录当前 label span 作为 tempSpan
-        tempSpanRef.current = currentSpan;
-
-        // 打开下拉框
-        setOpen(true);
-        // 移动到下一个 span 的开头
-        var allSpans = Array.from(div.querySelectorAll('span'));
-        var currentIndex = allSpans.indexOf(currentSpan);
-        if (currentIndex < allSpans.length - 1) {
-          var nextSpan = allSpans[currentIndex + 1];
-          var newRange = document.createRange();
-          newRange.selectNodeContents(nextSpan);
-          newRange.collapse(true);
-          selection.removeAllRanges();
-          selection.addRange(newRange);
-        }
-      }
-    }, [closeDorpDown, setOffsetX, setOpen]);
-    var handleKeyDown = useCallback(function (e) {
-      var _currentSpan$textCont, _currentSpan$textCont2;
-      if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {
-        e.preventDefault();
-        e.stopPropagation();
-        return;
-      }
-      var div = containerRef.current;
-      if (!div) return;
-      var selection = window.getSelection();
-      if (!selection || selection.rangeCount === 0) return;
-      var range = selection.getRangeAt(0);
-      var startContainer = range.startContainer,
-        startOffset = range.startOffset;
-      var currentSpan = getSpanAtCursor(startContainer);
-      if (!currentSpan || currentSpan === div) return;
-      var allSpans = Array.from(div.querySelectorAll('span'));
-      var currentIndex = allSpans.indexOf(currentSpan);
-      var textLen = (_currentSpan$textCont = (_currentSpan$textCont2 = currentSpan.textContent) === null || _currentSpan$textCont2 === void 0 ? void 0 : _currentSpan$textCont2.length) !== null && _currentSpan$textCont !== void 0 ? _currentSpan$textCont : 0;
-
-      // 方向键：跳过 label span
-      if (e.key === 'ArrowRight' || e.key === 'ArrowLeft') {
-        var position = getCursorPositionInSpan(currentSpan);
-        var isAtEnd = startOffset >= textLen;
-        var isAtStart = startOffset === 0;
-        var isAlmostEnd = startOffset >= textLen - 1;
-        var isAlmostStart = position === 1;
-        if (e.key === 'ArrowRight' && isAtEnd) {
-          closeDorpDown();
-          // 向右 + 在末尾 -> 跳到下一个 span 的开头（跳过 label span）
-          var targetIndex = currentIndex + 1;
-          while (targetIndex < allSpans.length && allSpans[targetIndex].classList.contains('formula-editor-token-label')) {
-            targetIndex++;
-          }
-          if (targetIndex < allSpans.length && targetIndex !== currentIndex + 1) {
-            e.preventDefault();
-            var targetSpan = allSpans[targetIndex];
-            moveCursorToSpan(targetSpan, true, selection);
-          }
-        } else if (e.key === 'ArrowRight' && isAlmostEnd) {
-          closeDorpDown();
-          var _targetIndex = currentIndex + 1;
-          if (_targetIndex < allSpans.length && !allSpans[_targetIndex].classList.contains('formula-editor-token-label')) {
-            e.preventDefault();
-            var _targetSpan2 = allSpans[_targetIndex];
-            moveCursorToSpan(_targetSpan2, true, selection);
-          }
-        } else if (e.key === 'ArrowLeft' && isAtStart) {
-          closeDorpDown();
-          // 向左 + 在开头 -> 跳到上一个 span 的末尾（跳过 label span）
-          var _targetIndex2 = currentIndex - 1;
-          while (_targetIndex2 >= 0 && allSpans[_targetIndex2].classList.contains('formula-editor-token-label')) {
-            _targetIndex2--;
-          }
-          if (_targetIndex2 >= 0 && _targetIndex2 !== currentIndex - 1) {
-            e.preventDefault();
-            var _targetSpan3 = allSpans[_targetIndex2];
-            moveCursorToSpan(_targetSpan3, false, selection);
-          }
-        } else if (e.key === 'ArrowLeft' && isAlmostStart) {
-          closeDorpDown();
-          var _targetIndex3 = currentIndex - 1;
-          if (_targetIndex3 >= 0 && !allSpans[_targetIndex3].classList.contains('formula-editor-token-label')) {
-            e.preventDefault();
-            var _targetSpan4 = allSpans[_targetIndex3];
-            moveCursorToSpan(_targetSpan4, false, selection);
-          }
-        }
-        return;
-      }
-
-      // 删除键逻辑
-      if (e.key !== 'Delete' && e.key !== 'Backspace') return;
-      if (e.key === 'Backspace' || e.key === 'Delete') {
-        if (tempSpanRef.current) {
-          closeDorpDown();
-        }
-        // 检查删除后是否只剩一个空的 span
-        var allSpansNow = Array.from(div.querySelectorAll('span'));
-        var isOnlyOneEmptySpan = allSpansNow.length === 1 && allSpansNow[0].textContent === '';
-        if (isOnlyOneEmptySpan) {
-          e.preventDefault();
-          e.stopPropagation();
-          return;
-        }
-      }
-
-      // 不在 label span 内，在 span 开头且前一个是 label 时，删除整个 label span
-      if (startOffset === 0 && e.key === 'Backspace' && currentIndex > 0) {
-        var prevSpan = allSpans[currentIndex - 1];
-        if (prevSpan.classList.contains('formula-editor-token-label')) {
-          e.preventDefault();
-          e.stopPropagation();
-          prevSpan.remove();
-          var newRange = document.createRange();
-
-          // 如果当前 span 有内容，光标放在开头；否则找最近的有内容的 span
-          if (currentSpan.textContent !== '') {
-            newRange.selectNodeContents(currentSpan);
-            newRange.collapse(true);
-          } else {
-            // 找前一个最近的有内容的 span
-            var _targetSpan5;
-            for (var i = currentIndex - 2; i >= 0; i--) {
-              if (allSpans[i].textContent !== '') {
-                _targetSpan5 = allSpans[i];
-                break;
-              }
-            }
-            if (_targetSpan5) {
-              newRange.selectNodeContents(_targetSpan5);
-              newRange.collapse(false);
-            } else {
-              newRange.selectNodeContents(div);
-              newRange.collapse(true);
-            }
-          }
-          selection.removeAllRanges();
-          selection.addRange(newRange);
-          return;
-        }
-      }
-
-      // 在 span 开头 + Delete 键，光标移到前一个 span 的末尾
-      if (startOffset === 0 && e.key === 'Backspace' && currentIndex > 0) {
-        var _prevSpan = allSpans[currentIndex - 1];
-        // 前一个 span 是非 label span 时，光标移到其末尾
-        if (!_prevSpan.classList.contains('formula-editor-token-label')) {
-          e.preventDefault();
-          e.stopPropagation();
-          var prevText = _prevSpan.textContent || '';
-          if (prevText.length > 0) {
-            _prevSpan.textContent = prevText.slice(0, -1);
-          }
-          var _newRange = document.createRange();
-          _newRange.selectNodeContents(_prevSpan);
-          _newRange.collapse(false);
-          selection.removeAllRanges();
-          selection.addRange(_newRange);
-        }
-      }
-
-      // 其他情况：等待浏览器完成默认删除后，检查当前 span 是否为空
-      setTimeout(function () {
-        var currentSpanNow = getSpanAtCursor(startContainer);
-        var allSpansNow = Array.from(div.querySelectorAll('span'));
-
-        // 如果 currentSpanNow 不在 allSpansNow 里（被浏览器删除了）
-        // 且还有 span 存在，用按下删除键时的 currentSpan 位置往前找
-        if (allSpansNow.length > 0 && !allSpansNow.includes(currentSpanNow)) {
-          // 如果光标在 span 开头 + Delete 键，currentIndex 指向的是被删 span 的后一个，所以要 -1
-          var searchIndex = startOffset === 0 ? currentIndex - 1 : currentIndex;
-          // 从 searchIndex 位置往前找
-          var _targetSpan6;
-          for (var _i = searchIndex; _i >= 0; _i--) {
-            var span = allSpansNow[_i];
-            if (span.textContent !== '') {
-              _targetSpan6 = span;
-              break;
-            }
-          }
-          // 如果找到的有内容 span 是 label，则把光标放在 label span 的后一个 span 的开头
-          if (_targetSpan6 && _targetSpan6.classList.contains('formula-editor-token-label')) {
-            var labelIndex = allSpansNow.indexOf(_targetSpan6);
-            if (labelIndex < allSpansNow.length - 1) {
-              var nextSpan = allSpansNow[labelIndex + 1];
-              var _newRange2 = document.createRange();
-              _newRange2.selectNodeContents(nextSpan);
-              _newRange2.collapse(true);
-              selection.removeAllRanges();
-              selection.addRange(_newRange2);
-              return;
-            }
-          }
-
-          // 否则把光标放在找到的 span 的末尾
-          if (_targetSpan6) {
-            var _newRange3 = document.createRange();
-            _newRange3.selectNodeContents(_targetSpan6);
-            _newRange3.collapse(false);
-            selection.removeAllRanges();
-            selection.addRange(_newRange3);
-            return;
-          }
-        }
-        if (!currentSpanNow || currentSpanNow === div) return;
-        if (currentSpanNow.textContent === '') {
-          var currentIndexNow = allSpansNow.indexOf(currentSpanNow);
-          var _newRange4 = document.createRange();
-          if (currentIndexNow > 0) {
-            // 移到前一个 span 的末尾，但如果前一个 span 是 label，则移到后一个 span 的开头
-            var _targetSpan7 = allSpansNow[currentIndexNow - 1];
-            if (_targetSpan7.classList.contains('formula-editor-token-label')) {
-              // 移到 label span 的后一个 span 的开头
-              if (currentIndexNow < allSpansNow.length - 1) {
-                var _nextSpan = allSpansNow[currentIndexNow + 1];
-                _newRange4.selectNodeContents(_nextSpan);
-                _newRange4.collapse(true);
-              } else {
-                _newRange4.selectNodeContents(div);
-                _newRange4.collapse(false);
-              }
-            } else {
-              _newRange4.selectNodeContents(_targetSpan7);
-              _newRange4.collapse(false);
-            }
-            currentSpanNow.remove();
-          } else if (allSpansNow.length > 1) {
-            // 第一个 span 为空，移到下一个 span 的开头
-            var _nextSpan2 = allSpansNow[currentIndexNow + 1];
-            _newRange4.selectNodeContents(_nextSpan2);
-            _newRange4.collapse(true);
-            currentSpanNow.remove();
-          } else {
-            // 只有一个空 span，保持空
-            _newRange4.selectNodeContents(div);
-            _newRange4.collapse(true);
-          }
-          selection.removeAllRanges();
-          selection.addRange(_newRange4);
-        }
-      }, 0);
-    }, []);
-
-    // 递归渲染多级菜单
-    var renderMenuItems = function renderMenuItems(items) {
-      return items.map(function (opt) {
-        if (opt.children && opt.children.length > 0) {
-          return /*#__PURE__*/_jsx(Menu.SubMenu, {
-            title: opt.label,
-            className: "formula-editor-dropdown-submenu",
-            children: renderMenuItems(opt.children)
-          }, opt.value);
-        }
-        return /*#__PURE__*/_jsxs(Menu.Item, {
-          className: "formula-editor-dropdown-item",
-          onClick: function onClick() {
-            return handleOptionClick(opt);
-          },
-          children: [opt.label, opt.info ? /*#__PURE__*/_jsx(Tooltip, {
-            title: opt.info,
-            children: /*#__PURE__*/_jsx(InfoCircleOutlined, {
-              style: {
-                color: '#FF9900',
-                marginLeft: 4
-              }
-            })
-          }) : null]
-        }, opt.value);
-      });
-    };
-    var dropdownContent = /*#__PURE__*/_jsx(Menu, {
-      className: "formula-editor-dropdown",
-      style: {
-        transform: "translateX(".concat(offsetX, "px)")
-      },
-      onMouseDown: function onMouseDown(e) {
-        e.preventDefault();
-        e.stopPropagation();
-      },
-      children: filteredHierarchyOptions.length === 0 ? /*#__PURE__*/_jsx(Menu.Item, {
-        disabled: true,
-        children: /*#__PURE__*/_jsx("span", {
-          className: "formula-editor-dropdown-no-data",
-          children: "\u6682\u65E0\u6570\u636E"
-        })
-      }, "no-data") : renderMenuItems(filteredHierarchyOptions)
-    });
     var handleChange = useCallback(function (value) {
       onChange(!isNil(value) ? value : null);
     }, [onChange]);
@@ -643,7 +289,13 @@ export var getFormulaInputEditor = function getFormulaInputEditor(options, repla
     }
     return /*#__PURE__*/_jsx(Dropdown, {
       overlayClassName: "dropDownOffset",
-      overlay: dropdownContent,
+      overlay: /*#__PURE__*/_jsx(DropMenu, {
+        options: filteredHierarchyOptions,
+        onOptionClick: handleOptionClick,
+        style: {
+          transform: "translateX(".concat(offsetX, "px)")
+        }
+      }),
       open: open,
       children: /*#__PURE__*/_jsx("div", {
         ref: containerRef,

package/dist/core/editor/InputOptionsEditor/keyEventEffect.d.ts

@@ -0,0 +1,16 @@
+import type { KeyboardEvent as ReactKeyboardEvent } from 'react';
+import { OptionItem } from './utils';
+declare const useKeyEventEffect: ({ closeDorpDown, setOffsetX, setOpen, containerRef, tempSpanRef, inputAfterDropDownShow, options }: {
+    closeDorpDown: () => void;
+    setOffsetX: (value: React.SetStateAction<number>) => void;
+    setOpen: (value: React.SetStateAction<boolean>) => void;
+    containerRef: React.RefObject<HTMLDivElement>;
+    tempSpanRef: React.MutableRefObject<HTMLElement | null>;
+    inputAfterDropDownShow: string;
+    options: OptionItem[];
+}) => {
+    handleMouseUp: () => void;
+    handleKeyDown: (e: ReactKeyboardEvent<HTMLDivElement>) => void;
+    filteredHierarchyOptions: OptionItem[];
+};
+export { useKeyEventEffect };

package/dist/core/editor/InputOptionsEditor/keyEventEffect.js

@@ -0,0 +1,305 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+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); }
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+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; }
+import { useCallback, useMemo } from 'react';
+import { getCursorPositionInSpan, getSpanAtCursor, moveCursorToSpan } from "./utils";
+var useKeyEventEffect = function useKeyEventEffect(_ref) {
+  var closeDorpDown = _ref.closeDorpDown,
+    setOffsetX = _ref.setOffsetX,
+    setOpen = _ref.setOpen,
+    containerRef = _ref.containerRef,
+    tempSpanRef = _ref.tempSpanRef,
+    inputAfterDropDownShow = _ref.inputAfterDropDownShow,
+    options = _ref.options;
+  // 鼠标释放时，如果光标在 label span 内，打开下拉框并记录 tempSpan
+  var handleMouseUp = useCallback(function () {
+    var div = containerRef.current;
+    if (!div) return;
+    closeDorpDown();
+    var selection = window.getSelection();
+    if (!selection || selection.rangeCount === 0) return;
+    var range = selection.getRangeAt(0);
+    var startContainer = range.startContainer;
+    var currentSpan = getSpanAtCursor(startContainer);
+    if (!currentSpan || currentSpan === div) return;
+    var isLabelSpan = currentSpan.classList.contains('formula-editor-token-label');
+
+    // 如果在 label span 内，打开下拉框并记录 tempSpan
+    if (isLabelSpan) {
+      // 更新 offsetX 位置
+      var containerRect = div.getBoundingClientRect();
+      var cursorRect = range.getBoundingClientRect();
+      var cursorDistance = cursorRect ? cursorRect.left - containerRect.left : 0;
+      setOffsetX(cursorDistance < 150 ? 0 : cursorDistance - 8);
+
+      // 记录当前 label span 作为 tempSpan
+      tempSpanRef.current = currentSpan;
+
+      // 打开下拉框
+      setOpen(true);
+      // 移动到下一个 span 的开头
+      var allSpans = Array.from(div.querySelectorAll('span'));
+      var currentIndex = allSpans.indexOf(currentSpan);
+      if (currentIndex < allSpans.length - 1) {
+        var nextSpan = allSpans[currentIndex + 1];
+        moveCursorToSpan(nextSpan, true, selection);
+      }
+    }
+  }, [closeDorpDown, setOffsetX, setOpen]);
+  var handleKeyDown = useCallback(function (e) {
+    var _currentSpan$textCont, _currentSpan$textCont2;
+    if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {
+      e.preventDefault();
+      e.stopPropagation();
+      return;
+    }
+    var div = containerRef.current;
+    if (!div) return;
+    var selection = window.getSelection();
+    if (!selection || selection.rangeCount === 0) return;
+    var range = selection.getRangeAt(0);
+    var startContainer = range.startContainer,
+      startOffset = range.startOffset;
+    var currentSpan = getSpanAtCursor(startContainer);
+    if (!currentSpan || currentSpan === div) return;
+    var allSpans = Array.from(div.querySelectorAll('span'));
+    var currentIndex = allSpans.indexOf(currentSpan);
+    var textLen = (_currentSpan$textCont = (_currentSpan$textCont2 = currentSpan.textContent) === null || _currentSpan$textCont2 === void 0 ? void 0 : _currentSpan$textCont2.length) !== null && _currentSpan$textCont !== void 0 ? _currentSpan$textCont : 0;
+
+    // 方向键：跳过 label span
+    if (e.key === 'ArrowRight' || e.key === 'ArrowLeft') {
+      var position = getCursorPositionInSpan(currentSpan);
+      var isAtEnd = startOffset >= textLen;
+      var isAtStart = startOffset === 0;
+      var isAlmostEnd = startOffset >= textLen - 1;
+      var isAlmostStart = position === 1;
+      if (e.key === 'ArrowRight' && isAtEnd) {
+        closeDorpDown();
+        // 向右 + 在末尾 -> 跳到下一个 span 的开头（跳过 label span）
+        var targetIndex = currentIndex + 1;
+        while (targetIndex < allSpans.length && allSpans[targetIndex].classList.contains('formula-editor-token-label')) {
+          targetIndex++;
+        }
+        if (targetIndex < allSpans.length && targetIndex !== currentIndex + 1) {
+          e.preventDefault();
+          var targetSpan = allSpans[targetIndex];
+          moveCursorToSpan(targetSpan, true, selection);
+        }
+      } else if (e.key === 'ArrowRight' && isAlmostEnd) {
+        closeDorpDown();
+        var _targetIndex = currentIndex + 1;
+        if (_targetIndex < allSpans.length && !allSpans[_targetIndex].classList.contains('formula-editor-token-label')) {
+          e.preventDefault();
+          var _targetSpan = allSpans[_targetIndex];
+          moveCursorToSpan(_targetSpan, true, selection);
+        }
+      } else if (e.key === 'ArrowLeft' && isAtStart) {
+        closeDorpDown();
+        // 向左 + 在开头 -> 跳到上一个 span 的末尾（跳过 label span）
+        var _targetIndex2 = currentIndex - 1;
+        while (_targetIndex2 >= 0 && allSpans[_targetIndex2].classList.contains('formula-editor-token-label')) {
+          _targetIndex2--;
+        }
+        if (_targetIndex2 >= 0 && _targetIndex2 !== currentIndex - 1) {
+          e.preventDefault();
+          var _targetSpan2 = allSpans[_targetIndex2];
+          moveCursorToSpan(_targetSpan2, false, selection);
+        }
+      } else if (e.key === 'ArrowLeft' && isAlmostStart) {
+        closeDorpDown();
+        var _targetIndex3 = currentIndex - 1;
+        if (_targetIndex3 >= 0 && !allSpans[_targetIndex3].classList.contains('formula-editor-token-label')) {
+          e.preventDefault();
+          var _targetSpan3 = allSpans[_targetIndex3];
+          moveCursorToSpan(_targetSpan3, false, selection);
+        }
+      }
+      return;
+    }
+
+    // 删除键逻辑
+    if (e.key !== 'Delete' && e.key !== 'Backspace') return;
+    if (e.key === 'Backspace' || e.key === 'Delete') {
+      if (tempSpanRef.current) {
+        closeDorpDown();
+      }
+      // 检查删除后是否只剩一个空的 span
+      var allSpansNow = Array.from(div.querySelectorAll('span'));
+      var isOnlyOneEmptySpan = allSpansNow.length === 1 && allSpansNow[0].textContent === '';
+      if (isOnlyOneEmptySpan) {
+        e.preventDefault();
+        e.stopPropagation();
+        return;
+      }
+    }
+
+    // 不在 label span 内，在 span 开头且前一个是 label 时，删除整个 label span
+    if (startOffset === 0 && e.key === 'Backspace' && currentIndex > 0) {
+      var prevSpan = allSpans[currentIndex - 1];
+      if (prevSpan.classList.contains('formula-editor-token-label')) {
+        e.preventDefault();
+        e.stopPropagation();
+        prevSpan.remove();
+        var newRange = document.createRange();
+
+        // 如果当前 span 有内容，光标放在开头；否则找最近的有内容的 span
+        if (currentSpan.textContent !== '') {
+          newRange.selectNodeContents(currentSpan);
+          newRange.collapse(true);
+        } else {
+          // 找前一个最近的有内容的 span
+          var _targetSpan4;
+          for (var i = currentIndex - 2; i >= 0; i--) {
+            if (allSpans[i].textContent !== '') {
+              _targetSpan4 = allSpans[i];
+              break;
+            }
+          }
+          if (_targetSpan4) {
+            newRange.selectNodeContents(_targetSpan4);
+            newRange.collapse(false);
+          } else {
+            newRange.selectNodeContents(div);
+            newRange.collapse(true);
+          }
+        }
+        selection.removeAllRanges();
+        selection.addRange(newRange);
+        return;
+      }
+    }
+
+    // 在 span 开头 + Delete 键，光标移到前一个 span 的末尾
+    if (startOffset === 0 && e.key === 'Backspace' && currentIndex > 0) {
+      var _prevSpan = allSpans[currentIndex - 1];
+      // 前一个 span 是非 label span 时，光标移到其末尾
+      if (!_prevSpan.classList.contains('formula-editor-token-label')) {
+        e.preventDefault();
+        e.stopPropagation();
+        var prevText = _prevSpan.textContent || '';
+        if (prevText.length > 0) {
+          _prevSpan.textContent = prevText.slice(0, -1);
+        }
+        moveCursorToSpan(_prevSpan, false, selection);
+      }
+    }
+
+    // 其他情况：等待浏览器完成默认删除后，检查当前 span 是否为空
+    setTimeout(function () {
+      var currentSpanNow = getSpanAtCursor(startContainer);
+      var allSpansNow = Array.from(div.querySelectorAll('span'));
+
+      // 如果 currentSpanNow 不在 allSpansNow 里（被浏览器删除了）
+      // 且还有 span 存在，用按下删除键时的 currentSpan 位置往前找
+      if (allSpansNow.length > 0 && !allSpansNow.includes(currentSpanNow)) {
+        // 如果光标在 span 开头 + Delete 键，currentIndex 指向的是被删 span 的后一个，所以要 -1
+        var searchIndex = startOffset === 0 ? currentIndex - 1 : currentIndex;
+        // 从 searchIndex 位置往前找
+        var _targetSpan5;
+        for (var _i = searchIndex; _i >= 0; _i--) {
+          var span = allSpansNow[_i];
+          if (span.textContent !== '') {
+            _targetSpan5 = span;
+            break;
+          }
+        }
+        // 如果找到的有内容 span 是 label，则把光标放在 label span 的后一个 span 的开头
+        if (_targetSpan5 && _targetSpan5.classList.contains('formula-editor-token-label')) {
+          var labelIndex = allSpansNow.indexOf(_targetSpan5);
+          if (labelIndex < allSpansNow.length - 1) {
+            var nextSpan = allSpansNow[labelIndex + 1];
+            moveCursorToSpan(nextSpan, true, selection);
+            return;
+          }
+        }
+
+        // 否则把光标放在找到的 span 的末尾
+        if (_targetSpan5) {
+          moveCursorToSpan(_targetSpan5, false, selection);
+          return;
+        }
+      }
+      if (!currentSpanNow || currentSpanNow === div) return;
+      if (currentSpanNow.textContent === '') {
+        var currentIndexNow = allSpansNow.indexOf(currentSpanNow);
+        var _newRange = document.createRange();
+        if (currentIndexNow > 0) {
+          // 移到前一个 span 的末尾，但如果前一个 span 是 label，则移到后一个 span 的开头
+          var _targetSpan6 = allSpansNow[currentIndexNow - 1];
+          if (_targetSpan6.classList.contains('formula-editor-token-label')) {
+            // 移到 label span 的后一个 span 的开头
+            if (currentIndexNow < allSpansNow.length - 1) {
+              var _nextSpan = allSpansNow[currentIndexNow + 1];
+              _newRange.selectNodeContents(_nextSpan);
+              _newRange.collapse(true);
+            } else {
+              _newRange.selectNodeContents(div);
+              _newRange.collapse(false);
+            }
+          } else {
+            _newRange.selectNodeContents(_targetSpan6);
+            _newRange.collapse(false);
+          }
+          currentSpanNow.remove();
+        } else if (allSpansNow.length > 1) {
+          // 第一个 span 为空，移到下一个 span 的开头
+          var _nextSpan2 = allSpansNow[currentIndexNow + 1];
+          _newRange.selectNodeContents(_nextSpan2);
+          _newRange.collapse(true);
+          currentSpanNow.remove();
+        } else {
+          // 只有一个空 span，保持空
+          _newRange.selectNodeContents(div);
+          _newRange.collapse(true);
+        }
+        selection.removeAllRanges();
+        selection.addRange(_newRange);
+      }
+    }, 0);
+  }, [closeDorpDown, containerRef.current]);
+  var filteredHierarchyOptions = useMemo(function () {
+    var searchText = inputAfterDropDownShow.trim();
+    // 如果搜索文本为空，显示所有选项（保持层级）
+    if (!searchText) {
+      return options;
+    }
+
+    // 根据搜索文本筛选，保持层级结构
+    var filterWithHierarchy = function filterWithHierarchy(items) {
+      var result = [];
+      var _iterator = _createForOfIteratorHelper(items),
+        _step;
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var item = _step.value;
+          var labelMatch = item.label.includes(searchText);
+          // 筛选 children
+          var filteredChildren = item.children ? filterWithHierarchy(item.children) : [];
+          if (labelMatch || filteredChildren.length > 0) {
+            result.push(_objectSpread(_objectSpread({}, item), {}, {
+              children: filteredChildren.length > 0 ? filteredChildren : item.children
+            }));
+          }
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+      return result;
+    };
+    return filterWithHierarchy(options);
+  }, [inputAfterDropDownShow]);
+  return {
+    handleMouseUp: handleMouseUp,
+    handleKeyDown: handleKeyDown,
+    filteredHierarchyOptions: filteredHierarchyOptions
+  };
+};
+export { useKeyEventEffect };

package/dist/core/editor/InputOptionsEditor/utils.d.ts

@@ -73,3 +73,8 @@ export type inputProps = Partial<Pick<InputNumberProps, 'max' | 'min' | 'addonBe
 }>;
 export declare const getSpanAtCursor: (startContainer: any) => HTMLElement | null;
 export declare const moveCursorToSpan: (targetSpan: HTMLElement, atStart: boolean | undefined, selection: any) => void;
+export declare enum SpanType {
+    LABEL = "label",
+    OTHER = "other"
+}
+export declare const createSpan: (type: string, content: string) => HTMLElement;

package/dist/core/editor/InputOptionsEditor/utils.js

@@ -5,6 +5,8 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
 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; }
+import { get } from "lodash";
+
 // 运算符列表
 export var OPERATORS = ['+', '-', '*', '/'];
 
@@ -360,4 +362,19 @@ export var moveCursorToSpan = function moveCursorToSpan(targetSpan) {
   newRange.collapse(atStart);
   selection.removeAllRanges();
   selection.addRange(newRange);
+};
+export var SpanType = /*#__PURE__*/function (SpanType) {
+  SpanType["LABEL"] = "label";
+  SpanType["OTHER"] = "other";
+  return SpanType;
+}({});
+var spanTypeStyle = {
+  label: 'formula-editor-token-label',
+  other: 'formula-editor-token-other'
+};
+export var createSpan = function createSpan(type, content) {
+  var span = document.createElement('span');
+  span.className = get(spanTypeStyle, [type]);
+  span.textContent = content;
+  return span;
 };

package/dist/core/table/useRowSelection.d.ts

@@ -1,5 +1,5 @@
 import { SheetTableType } from "../..";
 export declare const useRowSelection: (dataSource: Record<string, unknown>[], rowSelection?: SheetTableType.TableRowSelection, hasChildren?: boolean) => [boolean[], (value: boolean[]) => void];
-export declare const formatSelectionData: (param: Pick<SheetTableType.TableProps, "columns" | "showRemark" | "rowSelection" | "dataSource" | "rowKey"> & {
+export declare const formatSelectionData: (param: Pick<SheetTableType.TableProps, "columns" | "dataSource" | "rowKey" | "showRemark" | "rowSelection"> & {
     checked: boolean[];
 }) => any[][];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zhenliang/sheet",
-  "version": "0.2.5-beta.10",
+  "version": "0.2.5-beta.11",
   "description": "A react library developed with dumi",
   "license": "MIT",
   "module": "dist/index.js",