@leankylin-sheet/react 7.0.12 → 7.0.13

package/dist/index.css

@@ -3246,6 +3246,42 @@ label {
   background: #e3edfd;
 }
 
+.custom-format-preview {
+  display: flex;
+  align-items: center;
+  margin-top: 10px;
+  padding: 6px 10px;
+  background: #f5f6f7;
+  border-radius: 2px;
+  font-size: 12px;
+}
+
+.custom-format-preview-title {
+  color: #666;
+  flex-shrink: 0;
+}
+
+.custom-format-preview-origin {
+  margin-left: 4px;
+  color: #333;
+}
+
+.custom-format-preview-arrow {
+  margin: 0 8px;
+  color: #999;
+}
+
+.custom-format-preview-result {
+  color: #1a73e8;
+  font-weight: 600;
+  word-break: break-all;
+}
+
+.custom-format-preview-result.invalid {
+  color: #d93025;
+  font-weight: 400;
+}
+
 .leankylin-fx-editor {
   display: flex;
   flex-direction: row;

package/dist/index.esm.css

@@ -3246,6 +3246,42 @@ label {
   background: #e3edfd;
 }
 
+.custom-format-preview {
+  display: flex;
+  align-items: center;
+  margin-top: 10px;
+  padding: 6px 10px;
+  background: #f5f6f7;
+  border-radius: 2px;
+  font-size: 12px;
+}
+
+.custom-format-preview-title {
+  color: #666;
+  flex-shrink: 0;
+}
+
+.custom-format-preview-origin {
+  margin-left: 4px;
+  color: #333;
+}
+
+.custom-format-preview-arrow {
+  margin: 0 8px;
+  color: #999;
+}
+
+.custom-format-preview-result {
+  color: #1a73e8;
+  font-weight: 600;
+  word-break: break-all;
+}
+
+.custom-format-preview-result.invalid {
+  color: #d93025;
+  font-weight: 400;
+}
+
 .leankylin-fx-editor {
   display: flex;
   flex-direction: row;

package/dist/index.esm.js

@@ -1,4 +1,4 @@
-import { defaultContext, defaultSettings, getSheetIndex, colLocationByIndex, fixPositionOnFrozenCells, colLocation, getFlowdata, isAllowEdit, handleColumnHeaderMouseDown, handleColSizeHandleMouseDown, handleColFreezeHandleMouseDown, handleContextMenu, selectTitlesMap, selectTitlesRange, fixColumnStyleOverflowInFreeze, rowLocationByIndex, rowLocation, handleRowHeaderMouseDown, handleRowSizeHandleMouseDown, handleRowFreezeHandleMouseDown, fixRowStyleOverflowInFreeze, functionHTMLGenerate, locale, getCellValue, createRangeHightlight, isInlineStringCell, getInlineStringHTML, valueShowEs, escapeHTMLTag, escapeScriptTag, isShowHidenCR, cancelNormalSelected, moveHighlightCell, updateCell, israngeseleciton, handleFormulaInput, onSearchDialogMoveStart, replaceAll, replace, searchAll, searchNext, changeSheet, normalizeSelection, scrollToHighlightCell, chatatABC, getCellHyperlink, isLinkValid, getRangetxt, goToLink, replaceHtml, removeHyperlink, onRangeSelectionModalMoveStart, saveHyperlink, createFilterOptions, onImageMoveStart, onImageResizeStart, showComments, setEditingComment, onCommentBoxMoveStart, onCommentBoxResizeStart, confirmMessage, getRangeByTxt, getDropdownList, setCellValue, setConditionRules, mergeBorder, setDropcownValue, handleCellAreaMouseDown, handleCellAreaMouseMove, handleCellAreaDragOver, handleCellDrop, handleCellAreaDoubleClick, selectAll, showLinkCard, getCellRowColumn, handleOverlayMouseMove, handleOverlayMouseUp, handleKeydownForZoom, handleOverlayTouchStart, handleOverlayTouchMove, handleOverlayTouchEnd, PAINT_MODEL_CURSOR, onCellsMoveStart, createDropCellRange, handleDropCellDoubleClick, updateContextWithSheetData, updateContextWithCanvas, initFreeze, Canvas, handleGlobalWheel, setCaretPosition, getDataArr, updateMoreCell, getRegStr, getOptionValue, getSelectRange, applyLocation, updateItem, normalizedCellAttr, updateFormat, handleTextSize, handleHorizontalAlign, handleVerticalAlign, handleScreenShot, showImgChooser, insertImage, editComment, deleteComment, showHideComment, showHideAllComments, newComment, handleSum, autoSelectionFormula, handleMerge, handleBorder, handleFreeze, handleSort, createFilter, clearFilter, toolbarItemSelectedFunc, toolbarItemClickHandler, handleTextColor, handleTextBackground, getDataBySelectionNoCopy, getInlineStringNoStyle, rangeHightlightselected, editSheetName, setNextSheet, MAX_ZOOM_RATIO, MIN_ZOOM_RATIO, addSheet, indexToColumnChar, sortSelection, handleCopy, insertRowCol, deleteRowCol, hideSelected, showSelected, api, removeActiveImage, deleteSelectedCellText, jfrefreshgrid, handleLink, deleteSheet, opToPatch, orderbydatafiler, getFilterColumnValues, getFilterColumnColors, saveFilter, cancelActiveImgItem, patchToOp, filterPatch, inverseRowColOptions, ensureSheetIndex, initSheetIndex, handleGlobalKeyDown, handlePasteByLeanklin, groupValuesRefresh } from '@leankylin-sheet/core';
+import { defaultContext, defaultSettings, getSheetIndex, colLocationByIndex, fixPositionOnFrozenCells, colLocation, getFlowdata, isAllowEdit, handleColumnHeaderMouseDown, handleColSizeHandleMouseDown, handleColFreezeHandleMouseDown, handleContextMenu, selectTitlesMap, selectTitlesRange, fixColumnStyleOverflowInFreeze, rowLocationByIndex, rowLocation, handleRowHeaderMouseDown, handleRowSizeHandleMouseDown, handleRowFreezeHandleMouseDown, fixRowStyleOverflowInFreeze, functionHTMLGenerate, locale, getCellValue, createRangeHightlight, isInlineStringCell, getInlineStringHTML, valueShowEs, escapeHTMLTag, escapeScriptTag, isShowHidenCR, cancelNormalSelected, moveHighlightCell, updateCell, israngeseleciton, handleFormulaInput, onSearchDialogMoveStart, replaceAll, replace, searchAll, searchNext, changeSheet, normalizeSelection, scrollToHighlightCell, chatatABC, getCellHyperlink, isLinkValid, getRangetxt, goToLink, replaceHtml, removeHyperlink, onRangeSelectionModalMoveStart, saveHyperlink, createFilterOptions, onImageMoveStart, onImageResizeStart, showComments, setEditingComment, onCommentBoxMoveStart, onCommentBoxResizeStart, confirmMessage, getRangeByTxt, getDropdownList, setCellValue, setConditionRules, mergeBorder, setDropcownValue, handleCellAreaMouseDown, handleCellAreaMouseMove, handleCellAreaDragOver, handleCellDrop, handleCellAreaDoubleClick, selectAll, showLinkCard, getCellRowColumn, handleOverlayMouseMove, handleOverlayMouseUp, handleKeydownForZoom, handleOverlayTouchStart, handleOverlayTouchMove, handleOverlayTouchEnd, PAINT_MODEL_CURSOR, onCellsMoveStart, createDropCellRange, handleDropCellDoubleClick, updateContextWithSheetData, updateContextWithCanvas, initFreeze, Canvas, handleGlobalWheel, setCaretPosition, getDataArr, updateMoreCell, getRegStr, getOptionValue, getSelectRange, applyLocation, updateItem, normalizedCellAttr, update, updateFormat, handleTextSize, handleHorizontalAlign, handleVerticalAlign, handleScreenShot, showImgChooser, insertImage, editComment, deleteComment, showHideComment, showHideAllComments, newComment, handleSum, autoSelectionFormula, handleMerge, handleBorder, handleFreeze, handleSort, createFilter, clearFilter, toolbarItemSelectedFunc, toolbarItemClickHandler, handleTextColor, handleTextBackground, getDataBySelectionNoCopy, getInlineStringNoStyle, rangeHightlightselected, editSheetName, setNextSheet, MAX_ZOOM_RATIO, MIN_ZOOM_RATIO, addSheet, indexToColumnChar, sortSelection, handleCopy, insertRowCol, deleteRowCol, hideSelected, showSelected, api, removeActiveImage, deleteSelectedCellText, jfrefreshgrid, handleLink, deleteSheet, opToPatch, orderbydatafiler, getFilterColumnValues, getFilterColumnColors, saveFilter, cancelActiveImgItem, patchToOp, filterPatch, inverseRowColOptions, ensureSheetIndex, initSheetIndex, handleGlobalKeyDown, handlePasteByLeanklin, groupValuesRefresh } from '@leankylin-sheet/core';
 import { useInViewport, useMemoizedFn, useThrottleFn } from 'ahooks';
 import React, { useContext, useRef, useState, useMemo, useCallback, useEffect, useLayoutEffect, useImperativeHandle } from 'react';
 import produce, { applyPatches, enablePatches, produceWithPatches } from 'immer';
@@ -6507,26 +6507,44 @@ var CustomFormat = function CustomFormat(_ref) {
       var col = firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.column_focus;
       var cell = flowdata != null && row != null && col != null ? (_flowdata$row = flowdata[row]) === null || _flowdata$row === void 0 ? void 0 : _flowdata$row[col] : undefined;
       var ct = cell == null ? undefined : normalizedCellAttr(cell, "ct");
-      return (ct === null || ct === void 0 ? void 0 : ct.fa) != null && ct.fa !== "fmtOtherSelf" ? ct.fa : "#0.00";
+      return {
+        fa: (ct === null || ct === void 0 ? void 0 : ct.fa) != null && ct.fa !== "fmtOtherSelf" ? ct.fa : "#0.00",
+        v: cell === null || cell === void 0 ? void 0 : cell.v
+      };
     }),
-    _useState2 = _slicedToArray(_useState, 2),
-    formatStr = _useState2[0],
-    setFormatStr = _useState2[1];
+    _useState2 = _slicedToArray(_useState, 1),
+    initialState = _useState2[0];
+  var _useState3 = useState(initialState.fa),
+    _useState4 = _slicedToArray(_useState3, 2),
+    formatStr = _useState4[0],
+    setFormatStr = _useState4[1];
   var _locale = locale(context),
     button = _locale.button,
     format = _locale.format,
     defaultFmt = _locale.defaultFmt;
   var _useDialog = useDialog(),
     showDialog = _useDialog.showDialog;
-  var _useState3 = useState(""),
-    _useState4 = _slicedToArray(_useState3, 2),
-    errorMsg = _useState4[0],
-    setErrorMsg = _useState4[1];
+  var _useState5 = useState(""),
+    _useState6 = _slicedToArray(_useState5, 2),
+    errorMsg = _useState6[0],
+    setErrorMsg = _useState6[1];
   var presetFmtList = useMemo(function () {
     return defaultFmt.filter(function (v) {
       return v.value !== "split" && v.value !== "fmtOtherSelf";
     });
   }, [defaultFmt]);
+  var previewValue = useMemo(function () {
+    var fmt = formatStr.trim();
+    var v = initialState.v;
+    if (fmt === "" || fmt === "fmtOtherSelf" || v == null || v === "") {
+      return "";
+    }
+    try {
+      return update(fmt, v);
+    } catch (error) {
+      return "";
+    }
+  }, [formatStr, initialState]);
   var onConfirm = useCallback(function () {
     var fmt = formatStr.trim();
     if (fmt === "" || fmt === "fmtOtherSelf") {
@@ -6578,7 +6596,17 @@ var CustomFormat = function CustomFormat(_ref) {
     onKeyDown: onKeyDown
   })), errorMsg !== "" && ( /*#__PURE__*/React.createElement("div", {
     className: "custom-format-error"
-  }, errorMsg)), /*#__PURE__*/React.createElement("div", {
+  }, errorMsg)), initialState.v != null && initialState.v !== "" && ( /*#__PURE__*/React.createElement("div", {
+    className: "custom-format-preview"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "custom-format-preview-title"
+  }, format.customFormatPreview, "\uFF1A"), /*#__PURE__*/React.createElement("span", {
+    className: "custom-format-preview-origin"
+  }, String(initialState.v)), /*#__PURE__*/React.createElement("span", {
+    className: "custom-format-preview-arrow"
+  }, "\u2192"), /*#__PURE__*/React.createElement("span", {
+    className: "custom-format-preview-result".concat(previewValue === "" ? " invalid" : "")
+  }, previewValue === "" ? format.tipUnsupportedFormat : previewValue))), /*#__PURE__*/React.createElement("div", {
     className: "custom-format-list"
   }, /*#__PURE__*/React.createElement("div", {
     className: "custom-format-list-row custom-format-list-header"

package/dist/index.js

@@ -6517,26 +6517,44 @@ var CustomFormat = function CustomFormat(_ref) {
       var col = firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.column_focus;
       var cell = flowdata != null && row != null && col != null ? (_flowdata$row = flowdata[row]) === null || _flowdata$row === void 0 ? void 0 : _flowdata$row[col] : undefined;
       var ct = cell == null ? undefined : core.normalizedCellAttr(cell, "ct");
-      return (ct === null || ct === void 0 ? void 0 : ct.fa) != null && ct.fa !== "fmtOtherSelf" ? ct.fa : "#0.00";
+      return {
+        fa: (ct === null || ct === void 0 ? void 0 : ct.fa) != null && ct.fa !== "fmtOtherSelf" ? ct.fa : "#0.00",
+        v: cell === null || cell === void 0 ? void 0 : cell.v
+      };
     }),
-    _useState2 = _slicedToArray(_useState, 2),
-    formatStr = _useState2[0],
-    setFormatStr = _useState2[1];
+    _useState2 = _slicedToArray(_useState, 1),
+    initialState = _useState2[0];
+  var _useState3 = React.useState(initialState.fa),
+    _useState4 = _slicedToArray(_useState3, 2),
+    formatStr = _useState4[0],
+    setFormatStr = _useState4[1];
   var _locale = core.locale(context),
     button = _locale.button,
     format = _locale.format,
     defaultFmt = _locale.defaultFmt;
   var _useDialog = useDialog(),
     showDialog = _useDialog.showDialog;
-  var _useState3 = React.useState(""),
-    _useState4 = _slicedToArray(_useState3, 2),
-    errorMsg = _useState4[0],
-    setErrorMsg = _useState4[1];
+  var _useState5 = React.useState(""),
+    _useState6 = _slicedToArray(_useState5, 2),
+    errorMsg = _useState6[0],
+    setErrorMsg = _useState6[1];
   var presetFmtList = React.useMemo(function () {
     return defaultFmt.filter(function (v) {
       return v.value !== "split" && v.value !== "fmtOtherSelf";
     });
   }, [defaultFmt]);
+  var previewValue = React.useMemo(function () {
+    var fmt = formatStr.trim();
+    var v = initialState.v;
+    if (fmt === "" || fmt === "fmtOtherSelf" || v == null || v === "") {
+      return "";
+    }
+    try {
+      return core.update(fmt, v);
+    } catch (error) {
+      return "";
+    }
+  }, [formatStr, initialState]);
   var onConfirm = React.useCallback(function () {
     var fmt = formatStr.trim();
     if (fmt === "" || fmt === "fmtOtherSelf") {
@@ -6588,7 +6606,17 @@ var CustomFormat = function CustomFormat(_ref) {
     onKeyDown: onKeyDown
   })), errorMsg !== "" && ( /*#__PURE__*/React__default['default'].createElement("div", {
     className: "custom-format-error"
-  }, errorMsg)), /*#__PURE__*/React__default['default'].createElement("div", {
+  }, errorMsg)), initialState.v != null && initialState.v !== "" && ( /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "custom-format-preview"
+  }, /*#__PURE__*/React__default['default'].createElement("span", {
+    className: "custom-format-preview-title"
+  }, format.customFormatPreview, "\uFF1A"), /*#__PURE__*/React__default['default'].createElement("span", {
+    className: "custom-format-preview-origin"
+  }, String(initialState.v)), /*#__PURE__*/React__default['default'].createElement("span", {
+    className: "custom-format-preview-arrow"
+  }, "\u2192"), /*#__PURE__*/React__default['default'].createElement("span", {
+    className: "custom-format-preview-result".concat(previewValue === "" ? " invalid" : "")
+  }, previewValue === "" ? format.tipUnsupportedFormat : previewValue))), /*#__PURE__*/React__default['default'].createElement("div", {
     className: "custom-format-list"
   }, /*#__PURE__*/React__default['default'].createElement("div", {
     className: "custom-format-list-row custom-format-list-header"

package/dist/index.umd.css

@@ -3246,6 +3246,42 @@ label {
   background: #e3edfd;
 }
 
+.custom-format-preview {
+  display: flex;
+  align-items: center;
+  margin-top: 10px;
+  padding: 6px 10px;
+  background: #f5f6f7;
+  border-radius: 2px;
+  font-size: 12px;
+}
+
+.custom-format-preview-title {
+  color: #666;
+  flex-shrink: 0;
+}
+
+.custom-format-preview-origin {
+  margin-left: 4px;
+  color: #333;
+}
+
+.custom-format-preview-arrow {
+  margin: 0 8px;
+  color: #999;
+}
+
+.custom-format-preview-result {
+  color: #1a73e8;
+  font-weight: 600;
+  word-break: break-all;
+}
+
+.custom-format-preview-result.invalid {
+  color: #d93025;
+  font-weight: 400;
+}
+
 .leankylin-fx-editor {
   display: flex;
   flex-direction: row;

package/dist/index.umd.js

@@ -25591,26 +25591,44 @@
         var col = firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.column_focus;
         var cell = flowdata != null && row != null && col != null ? (_flowdata$row = flowdata[row]) === null || _flowdata$row === void 0 ? void 0 : _flowdata$row[col] : undefined;
         var ct = cell == null ? undefined : core.normalizedCellAttr(cell, "ct");
-        return (ct === null || ct === void 0 ? void 0 : ct.fa) != null && ct.fa !== "fmtOtherSelf" ? ct.fa : "#0.00";
+        return {
+          fa: (ct === null || ct === void 0 ? void 0 : ct.fa) != null && ct.fa !== "fmtOtherSelf" ? ct.fa : "#0.00",
+          v: cell === null || cell === void 0 ? void 0 : cell.v
+        };
       }),
-      _useState2 = _slicedToArray(_useState, 2),
-      formatStr = _useState2[0],
-      setFormatStr = _useState2[1];
+      _useState2 = _slicedToArray(_useState, 1),
+      initialState = _useState2[0];
+    var _useState3 = React.useState(initialState.fa),
+      _useState4 = _slicedToArray(_useState3, 2),
+      formatStr = _useState4[0],
+      setFormatStr = _useState4[1];
     var _locale = core.locale(context),
       button = _locale.button,
       format = _locale.format,
       defaultFmt = _locale.defaultFmt;
     var _useDialog = useDialog(),
       showDialog = _useDialog.showDialog;
-    var _useState3 = React.useState(""),
-      _useState4 = _slicedToArray(_useState3, 2),
-      errorMsg = _useState4[0],
-      setErrorMsg = _useState4[1];
+    var _useState5 = React.useState(""),
+      _useState6 = _slicedToArray(_useState5, 2),
+      errorMsg = _useState6[0],
+      setErrorMsg = _useState6[1];
     var presetFmtList = React.useMemo(function () {
       return defaultFmt.filter(function (v) {
         return v.value !== "split" && v.value !== "fmtOtherSelf";
       });
     }, [defaultFmt]);
+    var previewValue = React.useMemo(function () {
+      var fmt = formatStr.trim();
+      var v = initialState.v;
+      if (fmt === "" || fmt === "fmtOtherSelf" || v == null || v === "") {
+        return "";
+      }
+      try {
+        return core.update(fmt, v);
+      } catch (error) {
+        return "";
+      }
+    }, [formatStr, initialState]);
     var onConfirm = React.useCallback(function () {
       var fmt = formatStr.trim();
       if (fmt === "" || fmt === "fmtOtherSelf") {
@@ -25662,7 +25680,17 @@
       onKeyDown: onKeyDown
     })), errorMsg !== "" && ( /*#__PURE__*/React__default['default'].createElement("div", {
       className: "custom-format-error"
-    }, errorMsg)), /*#__PURE__*/React__default['default'].createElement("div", {
+    }, errorMsg)), initialState.v != null && initialState.v !== "" && ( /*#__PURE__*/React__default['default'].createElement("div", {
+      className: "custom-format-preview"
+    }, /*#__PURE__*/React__default['default'].createElement("span", {
+      className: "custom-format-preview-title"
+    }, format.customFormatPreview, "\uFF1A"), /*#__PURE__*/React__default['default'].createElement("span", {
+      className: "custom-format-preview-origin"
+    }, String(initialState.v)), /*#__PURE__*/React__default['default'].createElement("span", {
+      className: "custom-format-preview-arrow"
+    }, "\u2192"), /*#__PURE__*/React__default['default'].createElement("span", {
+      className: "custom-format-preview-result".concat(previewValue === "" ? " invalid" : "")
+    }, previewValue === "" ? format.tipUnsupportedFormat : previewValue))), /*#__PURE__*/React__default['default'].createElement("div", {
       className: "custom-format-list"
     }, /*#__PURE__*/React__default['default'].createElement("div", {
       className: "custom-format-list-row custom-format-list-header"