@fileverse-dev/fortune-react 1.0.2-mod-56 → 1.0.2-mod-57

package/dist/index.js

@@ -4455,26 +4455,25 @@ var Button = function Button(_ref) {
     selected = _ref.selected,
     children = _ref.children,
     style = _ref.style;
-  return /*#__PURE__*/React__default['default'].createElement("div", {
+  return /*#__PURE__*/React__default['default'].createElement(ui.Tooltip, {
+    text: tooltip,
+    placement: "bottom"
+  }, /*#__PURE__*/React__default['default'].createElement("div", {
     className: "fortune-toolbar-button fortune-toolbar-item",
     onClick: onClick,
     tabIndex: 0,
-    "data-tips": tooltip,
     role: "button",
-    "aria-label": tooltip,
     style: selected ? {
       backgroundColor: "#E7E5EB"
     } : style
-  }, /*#__PURE__*/React__default['default'].createElement(SVGIcon, {
-    name: iconId,
+  }, /*#__PURE__*/React__default['default'].createElement(ui.LucideIcon, {
+    name: getLucideIcon(iconId),
     width: 16,
     height: 16,
     style: disabled ? {
       opacity: 0.3
     } : {}
-  }), tooltip && /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "fortune-tooltip"
-  }, tooltip), children);
+  }), children));
 };
 
 var Divider = function Divider() {
@@ -4512,7 +4511,7 @@ var Combo = function Combo(_ref) {
   var popupRef = React.useRef(null);
   var buttonRef = React.useRef(null);
   var isLucideIcon = React.useMemo(function () {
-    return (iconId === null || iconId === void 0 ? void 0 : iconId.startsWith("align-")) || ["text-overflow", "text-wrap", "text-clip"].includes(iconId);
+    return (iconId === null || iconId === void 0 ? void 0 : iconId.startsWith("align-")) || ["text-overflow", "text-wrap", "text-clip", "font-color", "background", "border-all", "merge-all", "format", "conditionFormat", "filter", "comment", "image", "formula-sum", "dune", "template"].includes(iconId);
   }, [iconId]);
   useOutsideClick(popupRef, function () {
     setOpen(false);
@@ -4541,7 +4540,10 @@ var Combo = function Combo(_ref) {
   }, /*#__PURE__*/React__default['default'].createElement("div", {
     ref: buttonRef,
     className: "fortune-toolbar-combo"
-  }, !isLucideIcon ? (/*#__PURE__*/React__default['default'].createElement("div", {
+  }, !isLucideIcon ? (/*#__PURE__*/React__default['default'].createElement(ui.Tooltip, {
+    text: tooltip,
+    placement: "bottom"
+  }, /*#__PURE__*/React__default['default'].createElement("div", {
     className: "fortune-toolbar-combo-button",
     onClick: function onClick(e) {
       if (_onClick) {
@@ -4552,9 +4554,7 @@ var Combo = function Combo(_ref) {
       }
     },
     tabIndex: 0,
-    "data-tips": tooltip,
     role: "button",
-    "aria-label": "".concat(tooltip, ": ").concat(text !== undefined ? text : ""),
     style: style
   }, iconId ? (/*#__PURE__*/React__default['default'].createElement(SVGIcon, {
     name: iconId,
@@ -4562,29 +4562,29 @@ var Combo = function Combo(_ref) {
     height: 16
   })) : (/*#__PURE__*/React__default['default'].createElement("span", {
     className: "fortune-toolbar-combo-text"
-  }, text !== undefined ? text : "")))) : (/*#__PURE__*/React__default['default'].createElement(ui.IconButton, {
-    icon: getIcon(iconId),
+  }, text !== undefined ? text : ""))))) : (/*#__PURE__*/React__default['default'].createElement(ui.Tooltip, {
+    text: tooltip,
+    placement: "bottom"
+  }, /*#__PURE__*/React__default['default'].createElement(ui.IconButton, {
+    icon: getLucideIcon(iconId),
     variant: "ghost",
     onClick: function onClick() {
       return setOpen(!open);
-    }
-  })), showArrow && (/*#__PURE__*/React__default['default'].createElement("div", {
+    },
+    className: showArrow ? "fortune-toolbar-combo-button show-arrow" : ""
+  }))), showArrow && (/*#__PURE__*/React__default['default'].createElement("div", {
     className: "fortune-toolbar-combo-arrow",
     onClick: function onClick() {
       return setOpen(!open);
     },
     tabIndex: 0,
-    "data-tips": tooltip,
     role: "button",
-    "aria-label": tooltip,
     style: style
   }, /*#__PURE__*/React__default['default'].createElement(ui.LucideIcon, {
     name: "ChevronDown",
     width: 14,
     height: 14
-  }))), tooltip && /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "fortune-tooltip"
-  }, tooltip)), open && (/*#__PURE__*/React__default['default'].createElement("div", {
+  })))), open && (/*#__PURE__*/React__default['default'].createElement("div", {
     ref: popupRef,
     className: "fortune-toolbar-combo-popup",
     style: popupPosition
@@ -5268,11 +5268,13 @@ var CustomButton = function CustomButton(_ref) {
     children = _ref.children,
     iconName = _ref.iconName,
     icon = _ref.icon;
-  return /*#__PURE__*/React__default['default'].createElement("div", {
+  return /*#__PURE__*/React__default['default'].createElement(ui.Tooltip, {
+    text: tooltip,
+    placement: "bottom"
+  }, /*#__PURE__*/React__default['default'].createElement("div", {
     className: "fortune-toolbar-button fortune-toolbar-item",
     onClick: onClick,
     tabIndex: 0,
-    "data-tips": tooltip,
     role: "button",
     style: selected ? {
       backgroundColor: "#E7E5EB"
@@ -5282,9 +5284,7 @@ var CustomButton = function CustomButton(_ref) {
     height: 16,
     iconName: iconName,
     content: icon
-  }), tooltip && /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "fortune-tooltip"
-  }, tooltip), children);
+  }), children));
 };
 
 var palette = [["#000000", "#444444", "#666666", "#999999", "#B7B7B7", "#cccccc", "#D9D9D9", "#EFEFEF", "#f3f3f3", "#ffffff"], ["#970007", "#FE0012", "#FE9728", "#FFFD40", "#27FD3C", "#21FFFF", "#4A89E4", "#0027F9", "#9726FA", "#FD23FA"], ["#E6B8B0", "#f4cccc", "#FCE5CF", "#FFF1CF", "#DAEAD4", "#D0E0E3", "#C9DBF7", "#CFE3F2", "#D9D3E8", "#EAD1DC"], ["#DC7D6D", "#E9999A", "#F9CAA0", "#FFE49F", "#B7D6AB", "#A3C4C9", "#A4C3F2", "#A0C6E6", "#B4A8D4", "#D5A7BC"], ["#CB402B", "#DF6668", "#F6B171", "#FFD871", "#95C382", "#77A6AF", "#6DA0E8", "#70AADA", "#8E7EC0", "#C17C9F"], ["#A51A0A", "#CB000C", "#E59043", "#F1C046", "#6CA756", "#46828D", "#3C7BD4", "#3E87C3", "#6651A4", "#A54E78"], ["#841F11", "#980007", "#B35E19", "#BF8F22", "#3A7527", "#15505B", "#0E5AC8", "#0B5592", "#0B5592", "#731C46"], ["#5B0E03", "#660003", "#783E0E", "#7F5F13", "#284E19", "#0D343D", "#1C4785", "#073961", "#1F154B", "#4C112F"]];
@@ -5550,8 +5550,33 @@ var DuneChartsInputModal = function DuneChartsInputModal(_ref) {
   }, submitText)))));
 };
 
-var getIcon = function getIcon(title) {
+var MoreItemsContaier = function MoreItemsContaier(_ref) {
+  var onClose = _ref.onClose,
+    children = _ref.children;
+  var containerRef = React.useRef(null);
+  useOutsideClick(containerRef, function () {
+    onClose === null || onClose === void 0 ? void 0 : onClose();
+  }, [containerRef, onClose]);
+  return /*#__PURE__*/React__default['default'].createElement("div", {
+    ref: containerRef,
+    className: "fortune-toolbar-more-container"
+  }, children);
+};
+
+var getLucideIcon = function getLucideIcon(title) {
   switch (title) {
+    case "undo":
+      return "Undo";
+    case "redo":
+      return "Redo";
+    case "bold":
+      return "Bold";
+    case "italic":
+      return "Italic";
+    case "strike-through":
+      return "Strikethrough";
+    case "underline":
+      return "Underline";
     case "align-left":
       return "AlignLeft";
     case "align-center":
@@ -5570,6 +5595,44 @@ var getIcon = function getIcon(title) {
       return "WrapText";
     case "text-clip":
       return "TextClip";
+    case "font-color":
+      return "Baseline";
+    case "background":
+      return "PaintBucket";
+    case "border-all":
+      return "Border";
+    case "merge-all":
+      return "MergeHorizontal";
+    case "format":
+      return "JapaneseYen";
+    case "currency-format":
+      return "JapaneseYen";
+    case "percentage-format":
+      return "Percent";
+    case "number-decrease":
+      return "DecimalsArrowLeft";
+    case "number-increase":
+      return "DecimalsArrowRight";
+    case "conditionFormat":
+      return "PaintbrushVertical";
+    case "filter":
+      return "Filter";
+    case "link":
+      return "Link";
+    case "comment":
+      return "MessageSquarePlus";
+    case "image":
+      return "Image";
+    case "formula-sum":
+      return "Sigma";
+    case "dataVerification":
+      return "ShieldCheck";
+    case "search":
+      return "Search";
+    case "dune":
+      return "DuneChart";
+    case "Ellipsis":
+      return "Ellipsis";
     default:
       return "";
   }
@@ -5577,7 +5640,9 @@ var getIcon = function getIcon(title) {
 var Toolbar = function Toolbar(_ref) {
   var _context$luckysheet_s, _flowdata$row, _settings$customToolb;
   var setMoreItems = _ref.setMoreItems,
-    moreItemsOpen = _ref.moreItemsOpen;
+    moreItemsOpen = _ref.moreItemsOpen,
+    onMoreToolbarItemsClose = _ref.onMoreToolbarItemsClose,
+    moreToolbarItems = _ref.moreToolbarItems;
   var _useContext = React.useContext(WorkbookContext),
     context = _useContext.context,
     setContext = _useContext.setContext,
@@ -5950,7 +6015,7 @@ var Toolbar = function Toolbar(_ref) {
             isActive: ((_$find2 = ___default['default'].find(items, function (item) {
               return "".concat(item.value) === "".concat(cell === null || cell === void 0 ? void 0 : cell.ht);
             })) === null || _$find2 === void 0 ? void 0 : _$find2.title) === title,
-            icon: getIcon(title),
+            icon: getLucideIcon(title),
             variant: "ghost",
             onClick: function onClick() {
               setContext(function (ctx) {
@@ -6003,7 +6068,7 @@ var Toolbar = function Toolbar(_ref) {
             isActive: ((_$find4 = ___default['default'].find(_items, function (item) {
               return "".concat(item.value) === "".concat(cell === null || cell === void 0 ? void 0 : cell.vt);
             })) === null || _$find4 === void 0 ? void 0 : _$find4.title) === title,
-            icon: getIcon(title),
+            icon: getLucideIcon(title),
             variant: "ghost",
             onClick: function onClick() {
               setContext(function (ctx) {
@@ -6595,7 +6660,7 @@ var Toolbar = function Toolbar(_ref) {
           return /*#__PURE__*/React__default['default'].createElement(ui.IconButton, {
             key: value,
             isActive: _curr.value === value,
-            icon: getIcon(iconId),
+            icon: getLucideIcon(iconId),
             variant: "ghost",
             onClick: function onClick() {
               setContext(function (ctx) {
@@ -6747,7 +6812,10 @@ var Toolbar = function Toolbar(_ref) {
         }));
       });
     }
-    return /*#__PURE__*/React__default['default'].createElement(Button, {
+    return /*#__PURE__*/React__default['default'].createElement(ui.Tooltip, {
+      text: tooltip,
+      placement: "bottom"
+    }, /*#__PURE__*/React__default['default'].createElement(Button, {
       iconId: name,
       tooltip: tooltip,
       key: name,
@@ -6758,7 +6826,7 @@ var Toolbar = function Toolbar(_ref) {
           (_toolbarItemClickHand = fortuneCore.toolbarItemClickHandler(name)) === null || _toolbarItemClickHand === void 0 ? void 0 : _toolbarItemClickHand(draftCtx, refs.cellInput.current, refs.globalCache);
         });
       }
-    });
+    }));
   }, [toolbar, cell, setContext, refs.cellInput, refs.fxInput, refs.globalCache, defaultFormat, align, handleUndo, handleRedo, flowdata, formula, showDuneModal, merge, border, freezen, screenshot, sort, textWrap, rotation, filter, splitText, findAndReplace, context.luckysheet_select_save, context.defaultFontSize, context.allowEdit, comment, fontarray, hideSubMenu, showSubMenu, refs.canvas, customColor, customStyle, toolbarFormat.moreCurrency]);
   return /*#__PURE__*/React__default['default'].createElement("div", {
     ref: containerRef,
@@ -6781,7 +6849,7 @@ var Toolbar = function Toolbar(_ref) {
   })) : null, (toolbarWrapIndex === -1 ? settings.toolbarItems : settings.toolbarItems.slice(0, toolbarWrapIndex + 1)).map(function (name, i) {
     return getToolbarItem(name, i);
   }), toolbarWrapIndex !== -1 && toolbarWrapIndex < settings.toolbarItems.length - 1 ? (/*#__PURE__*/React__default['default'].createElement(Button, {
-    iconId: "more",
+    iconId: "Ellipsis",
     tooltip: toolbar.toolMore,
     onClick: function onClick() {
       if (moreItemsOpen) {
@@ -6792,7 +6860,9 @@ var Toolbar = function Toolbar(_ref) {
         }));
       }
     }
-  })) : null), /*#__PURE__*/React__default['default'].createElement("div", {
+  })) : null, moreToolbarItems && (/*#__PURE__*/React__default['default'].createElement(MoreItemsContaier, {
+    onClose: onMoreToolbarItemsClose
+  }, moreToolbarItems))), /*#__PURE__*/React__default['default'].createElement("div", {
     className: "fortune-toolbar-right"
   }, settings.customToolbarItems.filter(function (n) {
     return n.key === "templates";
@@ -6815,7 +6885,7 @@ var Toolbar = function Toolbar(_ref) {
       iconName: n.iconName
     }, n.children);
   }), /*#__PURE__*/React__default['default'].createElement(Button, {
-    iconId: "dune-logo",
+    iconId: "dune",
     tooltip: "Insert Dune Chart",
     key: "dune-charts",
     onClick: function onClick() {
@@ -7531,11 +7601,11 @@ var ResetColumnWidth = function ResetColumnWidth() {
     if (data) {
       for (var i = 0; i < data.length; i += 1) {
         var cellD = data[i][col];
-        if (typeof cellD === 'string') {
+        if (typeof cellD === "string") {
           if (cellD.length * 7 > maxWidth) {
             maxWidth = cellD.length * 7;
           }
-        } else if (_typeof(cellD) === 'object' && cellD !== null) {
+        } else if (_typeof(cellD) === "object" && cellD !== null) {
           console.log(cellD, "cellD");
           var cellText = cellD.v || cellD.m;
           if (cellText.length * 7 > maxWidth) {
@@ -8345,21 +8415,16 @@ var ContextMenu = function ContextMenu() {
       }), "px")))) : null;
     }
     if (name === "set-column-width") {
-      var _context$luckysheet_s0, _context$luckysheet_s1;
-      var colWidth = (selection === null || selection === void 0 ? void 0 : selection.width) || context.defaultcollen;
-      var shownColWidth = ((_context$luckysheet_s0 = context.luckysheet_select_save) === null || _context$luckysheet_s0 === void 0 ? void 0 : _context$luckysheet_s0.some(function (section) {
-        return section.width_move !== (colWidth + 1) * (section.column[1] - section.column[0] + 1) - 1;
-      })) ? "" : colWidth;
-      return ((_context$luckysheet_s1 = context.luckysheet_select_save) === null || _context$luckysheet_s1 === void 0 ? void 0 : _context$luckysheet_s1.some(function (section) {
+      var _context$luckysheet_s0;
+      return ((_context$luckysheet_s0 = context.luckysheet_select_save) === null || _context$luckysheet_s0 === void 0 ? void 0 : _context$luckysheet_s0.some(function (section) {
         return section.column_select;
       })) ? (/*#__PURE__*/React__default['default'].createElement(Menu, {
         key: "set-column-width",
-        onClick: function onClick(e, container) {
+        onClick: function onClick() {
           showDialog(/*#__PURE__*/React__default['default'].createElement(ResetColumnWidth, null), undefined, "Resize column");
           setContext(function (draftCtx) {
             draftCtx.contextMenu = {};
           });
-          return;
         }
       }, /*#__PURE__*/React__default['default'].createElement("div", {
         className: "context-item"
@@ -10906,19 +10971,6 @@ var SheetTabContextMenu = function SheetTabContextMenu() {
   }));
 };
 
-var MoreItemsContaier = function MoreItemsContaier(_ref) {
-  var onClose = _ref.onClose,
-    children = _ref.children;
-  var containerRef = React.useRef(null);
-  useOutsideClick(containerRef, function () {
-    onClose === null || onClose === void 0 ? void 0 : onClose();
-  }, [containerRef, onClose]);
-  return /*#__PURE__*/React__default['default'].createElement("div", {
-    ref: containerRef,
-    className: "fortune-toolbar-more-container"
-  }, children);
-};
-
 function generateAPIs(context, setContext, handleUndo, handleRedo, settings, cellInput, scrollbarX, scrollbarY, globalCache) {
   return {
     applyOp: function applyOp(ops) {
@@ -12533,12 +12585,12 @@ var Workbook = /*#__PURE__*/React__default['default'].forwardRef(function (_ref,
     className: "fortune-workarea"
   }, mergedSettings.showToolbar && (/*#__PURE__*/React__default['default'].createElement(Toolbar, {
     moreItemsOpen: moreToolbarItems !== null,
-    setMoreItems: setMoreToolbarItems
+    setMoreItems: setMoreToolbarItems,
+    onMoreToolbarItemsClose: onMoreToolbarItemsClose,
+    moreToolbarItems: moreToolbarItems
   })), mergedSettings.showFormulaBar && /*#__PURE__*/React__default['default'].createElement(FxEditor, null)), /*#__PURE__*/React__default['default'].createElement(Sheet, {
     sheet: sheet
-  }), mergedSettings.showSheetTabs && /*#__PURE__*/React__default['default'].createElement(SheetTab, null), /*#__PURE__*/React__default['default'].createElement(ContextMenu, null), /*#__PURE__*/React__default['default'].createElement(FilterMenu, null), /*#__PURE__*/React__default['default'].createElement(SheetTabContextMenu, null), context.showSheetList && /*#__PURE__*/React__default['default'].createElement(SheetList, null), moreToolbarItems && (/*#__PURE__*/React__default['default'].createElement(MoreItemsContaier, {
-    onClose: onMoreToolbarItemsClose
-  }, moreToolbarItems)), !___default['default'].isEmpty(context.contextMenu) && (/*#__PURE__*/React__default['default'].createElement("div", {
+  }), mergedSettings.showSheetTabs && /*#__PURE__*/React__default['default'].createElement(SheetTab, null), /*#__PURE__*/React__default['default'].createElement(ContextMenu, null), /*#__PURE__*/React__default['default'].createElement(FilterMenu, null), /*#__PURE__*/React__default['default'].createElement(SheetTabContextMenu, null), context.showSheetList && /*#__PURE__*/React__default['default'].createElement(SheetList, null), !___default['default'].isEmpty(context.contextMenu) && (/*#__PURE__*/React__default['default'].createElement("div", {
     onMouseDown: function onMouseDown() {
       setContextWithProduce(function (draftCtx) {
         draftCtx.contextMenu = {};

package/dist/index.umd.css

@@ -2250,11 +2250,12 @@ input[type="number"].condition-rules-project-input {
   flex-direction: row;
   /* background: #fafafc; */
   position: relative;
-  padding: 10px 0px 8px 15px;
+  padding: 4px 8px;
   border-bottom: 1px solid #d4d4d4;
   white-space: nowrap;
   align-items: center;
   gap: 4px;
+  justify-content: space-between;
 }
 
 .fortune-toolbar-divider {
@@ -2313,8 +2314,11 @@ input[type="number"].condition-rules-project-input {
   align-items: center;
 }
 
-.fortune-toolbar-button:hover,
-.fortune-toolbar-combo:hover {
+.fortune-toolbar-combo-button.show-arrow {
+  border-radius: 4px 0px 0px 4px;
+}
+
+.fortune-toolbar-button:hover {
   background-color: #f2f4f5;
   cursor: pointer;
 }
@@ -2322,6 +2326,8 @@ input[type="number"].condition-rules-project-input {
 .fortune-toolbar-combo-arrow:hover {
   background-color: #f2f4f5;
   cursor: pointer;
+  height: 30px;
+  border-radius: 0px 4px 4px 0px;
 }
 
 .fortune-toolbar-button:active,
@@ -2452,8 +2458,8 @@ input[type="number"].condition-rules-project-input {
   flex-direction: row;
   align-items: center;
   align-self: flex-end;
-  margin-right: 40px;
   top: 40px;
+  right: 0px;
   max-width: 348px;
   box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
   background: white;
@@ -2641,6 +2647,7 @@ input[type="number"].condition-rules-project-input {
   flex-direction: row;
   align-items: center;
   gap: 4px;
+  position: relative;
 }
 
 .fortune-toolbar-right {