@zhenliang/sheet 0.2.5-beta.0 → 0.2.5-beta.2

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

@@ -10,5 +10,5 @@ export interface FormulaInputProps {
     options: OptionItem[];
     value?: string;
 }
-export declare const getFormulaInputEditor: (options: OptionItem[]) => SheetType.CellEditor;
+export declare const getFormulaInputEditor: (options: OptionItem[], replaceIndex?: string) => SheetType.CellEditor;
 export default getFormulaInputEditor;

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

@@ -12,7 +12,7 @@ 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; }
 import { Dropdown, Menu, Tooltip } from 'antd';
-import { head, isEmpty, isNil } from 'lodash';
+import { get, head, isEmpty, isNil } from 'lodash';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { InfoCircleOutlined } from '@ant-design/icons';
 import { flattenOptions, getStringDiff, replaceLabelsWithValues, replaceLongestDiff, replaceValuesWithLabels, tokenize, validateVariables, getCursorPositionInSpan } from "./utils";
@@ -32,21 +32,23 @@ var getSpanAtCursor = function getSpanAtCursor(startContainer) {
   }
   return null;
 };
-export var getFormulaInputEditor = function getFormulaInputEditor(options) {
+export var getFormulaInputEditor = function getFormulaInputEditor(options, replaceIndex) {
   var FormulaInputEditor = function FormulaInputEditor(props) {
-    var value = props.value,
+    var _get;
+    var originValue = props.value,
       onChange = props.onChange,
-      isEditing = props.isEditing;
-    var _useState = useState(value),
-      _useState2 = _slicedToArray(_useState, 2),
-      inputValue = _useState2[0],
-      setInputValue = _useState2[1];
+      isEditing = props.isEditing,
+      record = props.record;
+    var calcValue = replaceIndex ? "".concat((_get = get(record, [replaceIndex])) !== null && _get !== void 0 ? _get : '') : originValue;
+    var _useState = useState(calcValue),
+      _useState2 = _slicedToArray(_useState, 1),
+      inputValue = _useState2[0];
     var _useState3 = useState(0),
       _useState4 = _slicedToArray(_useState3, 2),
       offsetX = _useState4[0],
       setOffsetX = _useState4[1];
     // 为了不重新render，再写一个
-    var _useState5 = useState(value),
+    var _useState5 = useState(calcValue),
       _useState6 = _slicedToArray(_useState5, 2),
       containerValue = _useState6[0],
       setContainerValue = _useState6[1];
@@ -132,19 +134,40 @@ export var getFormulaInputEditor = function getFormulaInputEditor(options) {
       var currentSpan = startContainer.nodeType === Node.TEXT_NODE ? startContainer.parentElement : startContainer;
       if (!currentSpan || currentSpan === container) return;
 
-      // 删除 inputAfterDropDownShow
+      // 获取删除 inputAfterDropDownShow 后的前半部分和后半部分
       var spanText = currentSpan.textContent || '';
       var deleteText = inputAfterDropDownShow;
       var deleteIndex = spanText.indexOf(deleteText);
-      if (deleteIndex !== -1) {
-        currentSpan.textContent = spanText.slice(0, deleteIndex) + spanText.slice(deleteIndex + deleteText.length);
+      // 如果找不到 deleteText，用当前光标位置作为 deleteIndex
+      if (deleteIndex === -1 || !deleteText) {
+        deleteIndex = range.startOffset;
       }
+      var beforePart = spanText.slice(0, deleteIndex);
+      var afterPart = spanText.slice(deleteIndex + deleteText.length);
 
-      // 新建 label span，内容为 opt.label，插入到当前 span 后面
+      // 删除当前 span，用三个 span 替换：other（前）、label、other（后）
       var labelSpan = document.createElement('span');
       labelSpan.className = 'formula-editor-token-label';
       labelSpan.textContent = opt.label;
-      currentSpan.after(labelSpan);
+
+      // 创建待插入的 span 列表
+      var spansToInsert = [];
+      if (beforePart) {
+        var beforeSpan = document.createElement('span');
+        beforeSpan.className = 'formula-editor-token-other';
+        beforeSpan.textContent = beforePart;
+        spansToInsert.push(beforeSpan);
+      }
+      spansToInsert.push(labelSpan);
+      if (afterPart) {
+        var afterSpan = document.createElement('span');
+        afterSpan.className = 'formula-editor-token-other';
+        afterSpan.textContent = afterPart;
+        spansToInsert.push(afterSpan);
+      }
+      // 插入所有 span
+      currentSpan.after.apply(currentSpan, spansToInsert);
+      currentSpan.remove();
 
       // 将光标移到下一个 span 的开头
       var allSpans = Array.from(container.querySelectorAll('span'));
@@ -194,7 +217,7 @@ export var getFormulaInputEditor = function getFormulaInputEditor(options) {
       if (open) {
         var _getStringDiff2 = getStringDiff(containerValueSnapShot.current, newValue),
           addedOnSnapShot = _getStringDiff2.added;
-        isBeginWithNumber = /^\d$/.test(head(addedOnSnapShot));
+        isBeginWithNumber = /^\d$/.test(head(addedOnSnapShot.join('').trim()));
         inputStringAfterDropDownShow = addedOnSnapShot.join('');
       }
       if (pressAOperator) {
@@ -265,6 +288,11 @@ export var getFormulaInputEditor = function getFormulaInputEditor(options) {
     }, [closeDorpDown]);
     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();
@@ -344,6 +372,16 @@ export var getFormulaInputEditor = function getFormulaInputEditor(options) {
 
       // 删除键逻辑
       if (e.key !== 'Delete' && e.key !== 'Backspace') return;
+      if (e.key === 'Backspace') {
+        // 检查删除后是否只剩一个空的 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) {
@@ -544,13 +582,13 @@ export var getFormulaInputEditor = function getFormulaInputEditor(options) {
         spellCheck: false,
         children: isEmpty(tokens) ? /*#__PURE__*/_jsx("span", {
           style: {
-            minWidth: 8,
+            minWidth: 1,
             height: 40
           }
         }) : tokens.map(function (token, index) {
           return token.type === 'end' ? /*#__PURE__*/_jsx("span", {
             style: {
-              minWidth: 8,
+              minWidth: 1,
               height: 40
             }
           }, index) : /*#__PURE__*/_jsx("span", {
@@ -614,7 +652,7 @@ export var getFormulaInputEditor = function getFormulaInputEditor(options) {
     if (!validateVariables(expr, flatOptions)) {
       return Infinity;
     }
-    return currentValue;
+    return value;
   };
 
   // parser：粘贴时处理，将 label 转换为 value

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

@@ -4,7 +4,7 @@
   white-space: nowrap;
   overflow: hidden;
   outline: none;
-  min-width: 95%;
+  min-width: 90%;
   max-height: 100%;
   box-shadow: inset 0 -100px 0 rgba(33, 133, 208, 15%);
   position: absolute;

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

@@ -115,6 +115,9 @@ var splitSegmentByLabels = function splitSegmentByLabels(segment, sortedLabels)
  * 有效 label 为 type 'label'，其他为 'other'
  */
 export var tokenize = function tokenize(text, flatOptions) {
+  if (!text) {
+    return [];
+  }
   var tokens = [];
 
   // 将 value 转换为 label

package/dist/core/sheet/Cell.js

@@ -78,11 +78,14 @@ var Cell = function Cell(props) {
       return;
     }
     if (confirm) {
-      var _cell$dataEditor3;
+      var _cell$dataEditor3, _cell$dataEditor5, _cell$dataEditor6, _cell$dataEditor6$che;
       setEventState({
         confirm: false
       });
       var newValue = value;
+      if (newValue === valueRef.current) {
+        return;
+      }
       // 转化一下公式
       if (cell !== null && cell !== void 0 && (_cell$dataEditor3 = cell.dataEditor) !== null && _cell$dataEditor3 !== void 0 && _cell$dataEditor3.formula) {
         var _cell$dataEditor4;
@@ -113,20 +116,17 @@ var Cell = function Cell(props) {
           return;
         }
       }
-      if (newValue !== valueRef.current) {
-        var _cell$dataEditor5, _cell$dataEditor6, _cell$dataEditor6$che;
-        if (cell !== null && cell !== void 0 && (_cell$dataEditor5 = cell.dataEditor) !== null && _cell$dataEditor5 !== void 0 && _cell$dataEditor5.checker && ((_cell$dataEditor6 = cell.dataEditor) === null || _cell$dataEditor6 === void 0 || (_cell$dataEditor6$che = _cell$dataEditor6.checker) === null || _cell$dataEditor6$che === void 0 ? void 0 : _cell$dataEditor6$che.call(_cell$dataEditor6, newValue, cell.record)) === false) {
-          setValue(valueRef.current);
-          return;
-        }
-        eventBus.emit('cell-change', {
-          row: row,
-          col: col,
-          id: cell.id,
-          value: newValue,
-          key: cell.dataIndex
-        });
+      if (cell !== null && cell !== void 0 && (_cell$dataEditor5 = cell.dataEditor) !== null && _cell$dataEditor5 !== void 0 && _cell$dataEditor5.checker && ((_cell$dataEditor6 = cell.dataEditor) === null || _cell$dataEditor6 === void 0 || (_cell$dataEditor6$che = _cell$dataEditor6.checker) === null || _cell$dataEditor6$che === void 0 ? void 0 : _cell$dataEditor6$che.call(_cell$dataEditor6, newValue, cell.record)) === false) {
+        setValue(valueRef.current);
+        return;
       }
+      eventBus.emit('cell-change', {
+        row: row,
+        col: col,
+        id: cell.id,
+        value: newValue,
+        key: cell.dataIndex
+      });
     }
   }, [confirm, eventBus, value, cell]);
   var handleCommit = useCallback(function (value) {

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" | "dataSource" | "rowKey" | "showRemark" | "rowSelection"> & {
+export declare const formatSelectionData: (param: Pick<SheetTableType.TableProps, "columns" | "showRemark" | "rowSelection" | "dataSource" | "rowKey"> & {
     checked: boolean[];
 }) => any[][];

package/dist/example/basic.js

@@ -67,8 +67,7 @@ var columns = [{
   })
 }, {
   title: 'Formula',
-  dataIndex: 'formula',
-  key: 'formula',
+  dataIndex: 'amount',
   width: 200,
   cellConfig: {
     className: 'testCell'
@@ -93,7 +92,7 @@ var columns = [{
       label: '批发价',
       value: 'wholesale'
     }]
-  }])
+  }], 'formula')
 }, {
   title: 'Address',
   editable: false,
@@ -142,17 +141,20 @@ var data = [{
   age: 32,
   address: 'New York No. 1 Lake Park',
   tags: ['nice', 'developer'],
-  formula: '=price*qty'
+  formula: '=price*qty',
+  amount: 100
 }, {
   key: '2',
   name: 'Jim Green',
   age: 42,
   address: 'London No. 1 Lake Park',
   tags: ['loser'],
-  formula: '=price+discount'
+  formula: '=price+discount',
+  amount: 100
 }, {
   key: '3',
   name: 'Joe Black',
+  amount: 100,
   age: 32,
   address: 'Sidney No. 1 Lake Park',
   tags: ['cool', 'teacher'],
@@ -163,14 +165,24 @@ var data = [{
   age: 92,
   address: 'Sidney No. 1 Lake Park',
   tags: ['cool', 'teacher'],
-  formula: '=(123 + 456) * price'
+  formula: '=(123 + 456) * price',
+  amount: 100
 }, {
   key: '5',
   name: 'Joe ll',
   age: 37,
   address: 'Sidney No. 1 Lake Park',
   tags: ['cool', 'teacher'],
-  formula: '=(123 + 456) * price + 888'
+  formula: '=(123 + 456) * price + 888',
+  amount: 100
+}, {
+  key: '6',
+  name: 'Joe 23',
+  age: 41,
+  address: 'Sidney No. 1 Lake Park',
+  tags: ['cool', 'teacher'],
+  formula: null,
+  amount: 100
 }];
 var App = function App() {
   var _useState = useState(data),

package/package.json

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