@fileverse-dev/fortune-react 1.0.2-mod-70 → 1.0.2-mod-67-patch-3

package/dist/index.esm.js

@@ -2,10 +2,9 @@ import { defaultContext, defaultSettings, getSheetIndex, colLocationByIndex, fix
 import React, { useContext, useRef, useState, useMemo, useCallback, useEffect, useLayoutEffect, useImperativeHandle } from 'react';
 import produce, { applyPatches, enablePatches, produceWithPatches } from 'immer';
 import _ from 'lodash';
-import { Tooltip, LucideIcon, TextField, Button as Button$1, cn, IconButton, Checkbox, Divider as Divider$2, Table, TableHeader, TableRow, TableHead, TableBody, TableCell, Select as Select$1, SelectTrigger, SelectValue, SelectContent, SelectItem as SelectItem$1, Popover, PopoverTrigger, PopoverContent, RadioGroup, RadioGroupItem, Label } from '@fileverse/ui';
+import { LucideIcon, TextField, Button as Button$1, cn, IconButton, Checkbox, Divider as Divider$2, Table, TableHeader, TableRow, TableHead, TableBody, TableCell, Select as Select$1, SelectTrigger, SelectValue, SelectContent, SelectItem as SelectItem$1, Tooltip, RadioGroup, RadioGroupItem, Label } from '@fileverse/ui';
 import regeneratorRuntime from 'regenerator-runtime';
 import Tippy from '@tippyjs/react';
-export * from '@fileverse-dev/formulajs/crypto-constants';
 
 function _arrayLikeToArray(r, a) {
   (null == a || a > r.length) && (a = r.length);
@@ -854,9 +853,7 @@ var FormulaSearch = function FormulaSearch(props) {
       style: {
         width: "20px"
       }
-    })), v.API_KEY && (/*#__PURE__*/React.createElement(Tooltip, {
-      text: localStorage.getItem(v.API_KEY) ? "API Key added" : "API Key required"
-    }, /*#__PURE__*/React.createElement("div", {
+    })), v.API_KEY && (/*#__PURE__*/React.createElement("div", {
       style: {
         borderRadius: "4px",
         backgroundColor: "".concat(localStorage.getItem(v.API_KEY) ? "#177E23" : "#e8ebec"),
@@ -871,7 +868,7 @@ var FormulaSearch = function FormulaSearch(props) {
         width: "12px",
         height: "12px"
       }
-    })))))), /*#__PURE__*/React.createElement("div", {
+    }))))), /*#__PURE__*/React.createElement("div", {
       className: "luckysheet-formula-search-detail mt-1 text-helper-text-sm color-text-secondary"
     }, v.d));
   }), /*#__PURE__*/React.createElement("hr", {
@@ -1920,7 +1917,6 @@ var SearchReplace = function SearchReplace(_ref) {
       var _tableContainerRef$cu;
       if (e.target === tableContainerRef.current || ((_tableContainerRef$cu = tableContainerRef.current) === null || _tableContainerRef$cu === void 0 ? void 0 : _tableContainerRef$cu.contains(e.target))) {
         var _tableContainerRef$cu2;
-        e.preventDefault();
         e.stopPropagation();
         (_tableContainerRef$cu2 = tableContainerRef.current) === null || _tableContainerRef$cu2 === void 0 ? void 0 : _tableContainerRef$cu2.focus();
       }
@@ -1929,17 +1925,13 @@ var SearchReplace = function SearchReplace(_ref) {
       e.preventDefault();
       e.stopPropagation();
       if (tableContainerRef.current) {
-        var delta = e.deltaY;
-        var currentScroll = tableContainerRef.current.scrollTop;
-        tableContainerRef.current.scrollTop = currentScroll + delta;
+        tableContainerRef.current.scrollTop += e.deltaY;
       }
     },
     onTouchStart: function onTouchStart(e) {
-      e.preventDefault();
       e.stopPropagation();
     },
     onTouchMove: function onTouchMove(e) {
-      e.preventDefault();
       e.stopPropagation();
     },
     tabIndex: 0
@@ -3714,8 +3706,11 @@ var IframeBoxs = function IframeBoxs() {
       });
     })), /*#__PURE__*/React.createElement("div", {
       className: "luckysheet-modal-dialog-controll"
-    }, /*#__PURE__*/React.createElement(IconButton, {
-      icon: "Trash2",
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "luckysheet-modal-controll-btn luckysheet-modal-controll-del",
+      role: "button",
+      tabIndex: 0,
+      title: "Delete",
       onClick: function onClick() {
         setContext(function (ctx) {
           var currentSheet = ctx.luckysheetfile.find(function (sheet) {
@@ -3729,10 +3724,8 @@ var IframeBoxs = function IframeBoxs() {
           }
           ctx.activeIframe = undefined;
         });
-      },
-      variant: "ghost",
-      className: "fortune-iframe-boxes-delete-button"
-    })))));
+      }
+    }, "DELETE")))));
   }));
 };
 
@@ -4511,11 +4504,45 @@ var Combo = function Combo(_ref) {
     _useState2 = _slicedToArray(_useState, 2),
     open = _useState2[0],
     setOpen = _useState2[1];
+  var _useState3 = useState({
+      left: 0
+    }),
+    _useState4 = _slicedToArray(_useState3, 2),
+    popupPosition = _useState4[0],
+    setPopupPosition = _useState4[1];
+  var popupRef = useRef(null);
   var buttonRef = useRef(null);
   var isLucideIcon = useMemo(function () {
     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]);
-  var trigger = !isLucideIcon ? (/*#__PURE__*/React.createElement(Tooltip, {
+  useOutsideClick(popupRef, function () {
+    setOpen(false);
+  });
+  useLayoutEffect(function () {
+    if (!popupRef.current) {
+      return;
+    }
+    if (!open) {
+      setPopupPosition({
+        left: 0
+      });
+    }
+    var winW = window.innerWidth;
+    var rect = popupRef.current.getBoundingClientRect();
+    var menuW = rect.width;
+    var left = rect.left;
+    if (left + menuW > winW) {
+      setPopupPosition({
+        left: -rect.width + buttonRef.current.clientWidth
+      });
+    }
+  }, [open]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "fortune-toobar-combo-container fortune-toolbar-item"
+  }, /*#__PURE__*/React.createElement("div", {
+    ref: buttonRef,
+    className: "fortune-toolbar-combo"
+  }, !isLucideIcon ? (/*#__PURE__*/React.createElement(Tooltip, {
     text: tooltip,
     placement: "bottom"
   }, /*#__PURE__*/React.createElement("div", {
@@ -4524,6 +4551,8 @@ var Combo = function Combo(_ref) {
       if (_onClick) {
         _onClick(e);
         if (!showArrow) setOpen(!open);
+      } else {
+        setOpen(!open);
       }
     },
     tabIndex: 0,
@@ -4544,23 +4573,23 @@ var Combo = function Combo(_ref) {
     onClick: function onClick() {
       return setOpen(!open);
     },
-    className: "fortune-toolbar-combo-button"
-  })));
-  return /*#__PURE__*/React.createElement("div", {
-    ref: buttonRef
-  }, /*#__PURE__*/React.createElement(Popover, {
-    open: open,
-    onOpenChange: setOpen
-  }, /*#__PURE__*/React.createElement(PopoverTrigger, {
-    asChild: true
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "flex items-center"
-  }, trigger)), /*#__PURE__*/React.createElement(PopoverContent, {
-    align: "start",
-    side: "bottom",
-    sideOffset: 4,
-    alignOffset: -16,
-    className: "fortune-toolbar-combo-popup border-none"
+    className: showArrow ? "fortune-toolbar-combo-button show-arrow" : ""
+  }))), showArrow && (/*#__PURE__*/React.createElement("div", {
+    className: "fortune-toolbar-combo-arrow",
+    onClick: function onClick() {
+      return setOpen(!open);
+    },
+    tabIndex: 0,
+    role: "button",
+    style: style
+  }, /*#__PURE__*/React.createElement(LucideIcon, {
+    name: "ChevronDown",
+    width: 14,
+    height: 14
+  })))), open && (/*#__PURE__*/React.createElement("div", {
+    ref: popupRef,
+    className: "fortune-toolbar-combo-popup",
+    style: popupPosition
   }, children === null || children === void 0 ? void 0 : children(setOpen))));
 };
 
@@ -5438,6 +5467,7 @@ var DuneChartsInputModal = function DuneChartsInputModal(_ref) {
   var isOpen = _ref.isOpen,
     onClose = _ref.onClose,
     onSubmit = _ref.onSubmit,
+    icon = _ref.icon,
     _ref$submitText = _ref.submitText,
     submitText = _ref$submitText === void 0 ? "Submit" : _ref$submitText,
     _ref$placeholder = _ref.placeholder,
@@ -5479,8 +5509,6 @@ var DuneChartsInputModal = function DuneChartsInputModal(_ref) {
     e.stopPropagation();
     if (e.key === "Enter") {
       handleSubmit();
-    } else if (e.key === "Escape") {
-      onClose();
     }
   };
   return /*#__PURE__*/React.createElement("div", {
@@ -5497,8 +5525,8 @@ var DuneChartsInputModal = function DuneChartsInputModal(_ref) {
     onKeyDown: handleKeyDown
   }, /*#__PURE__*/React.createElement("div", {
     className: "modal-header"
-  }, /*#__PURE__*/React.createElement(LucideIcon, {
-    name: "DuneChart"
+  }, /*#__PURE__*/React.createElement(SVGIcon, {
+    name: icon
   }), /*#__PURE__*/React.createElement("input", {
     ref: inputRef,
     className: "modal-input",
@@ -5843,18 +5871,46 @@ var Toolbar = function Toolbar(_ref) {
           if (value === "fmtOtherSelf") {
             return /*#__PURE__*/React.createElement(Option, {
               key: value,
-              onClick: function onClick() {
+              onMouseEnter: function onMouseEnter(e) {
+                return showSubMenu(e, "more-format");
+              },
+              onMouseLeave: function onMouseLeave(e) {
+                return hideSubMenu(e, "more-format");
+              }
+            }, /*#__PURE__*/React.createElement("div", {
+              className: "fortune-toolbar-menu-line"
+            }, /*#__PURE__*/React.createElement("div", null, text), /*#__PURE__*/React.createElement(SVGIcon, {
+              name: "rightArrow",
+              width: 16,
+              height: 16
+            })), /*#__PURE__*/React.createElement("div", {
+              className: "more-format toolbar-item-sub-menu fortune-toolbar-select",
+              style: {
+                display: "none",
+                width: 150,
+                bottom: 10,
+                top: undefined
+              }
+            }, [{
+              text: toolbarFormat.moreCurrency,
+              onclick: function onclick() {
                 showDialog(/*#__PURE__*/React.createElement(FormatSearch, {
                   onCancel: hideDialog,
                   type: "currency"
                 }), undefined, "Currency Format");
                 setOpen(false);
               }
-            }, /*#__PURE__*/React.createElement("div", {
-              className: "fortune-toolbar-menu-line"
-            }, /*#__PURE__*/React.createElement("div", null, text), /*#__PURE__*/React.createElement("div", {
-              className: "fortune-toolbar-subtext"
-            }, example)));
+            }].map(function (v) {
+              return /*#__PURE__*/React.createElement("div", {
+                className: "set-background-item fortune-toolbar-select-option",
+                key: v.text,
+                onClick: function onClick() {
+                  v.onclick();
+                  setOpen(false);
+                },
+                tabIndex: 0
+              }, v.text);
+            })));
           }
           return /*#__PURE__*/React.createElement(Option, {
             key: value,
@@ -6873,6 +6929,7 @@ var Toolbar = function Toolbar(_ref) {
     onClose: function onClose() {
       return setShowDuneModal(false);
     },
+    icon: "dune-logo",
     placeholder: "Add Dune chart link to embed",
     submitText: "Embed Dune chart"
   }))));
@@ -7753,8 +7810,12 @@ var ContextMenu = function ContextMenu() {
         className: "context-item"
       }, /*#__PURE__*/React.createElement(SVGIcon, {
         name: "split-flv",
-        width: 18,
-        height: 18
+        width: 17,
+        height: 17,
+        style: {
+          marginTop: "4px",
+          marginRight: "8px"
+        }
       }), "Split text to columns"));
     }
     if (name === "freeze-row") {
@@ -7776,9 +7837,15 @@ var ContextMenu = function ContextMenu() {
         }
       }, /*#__PURE__*/React.createElement("div", {
         className: "context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "Snowflake"
-      }), /*#__PURE__*/React.createElement("p", null, isFrozen ? "Unfreeze row" : "Freeze upto current row")));
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "freeze-flv",
+        width: 16,
+        height: 16,
+        style: {
+          marginTop: "4px",
+          marginRight: "4px"
+        }
+      }), isFrozen ? "Unfreeze row" : "Freeze to current row"));
     }
     if (name === "freeze-column") {
       var _freezeState = getFreezeState(context);
@@ -7800,9 +7867,15 @@ var ContextMenu = function ContextMenu() {
         }
       }, /*#__PURE__*/React.createElement("div", {
         className: "context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "Snowflake"
-      }), /*#__PURE__*/React.createElement("p", null, _isFrozen ? "Unfreeze column" : "Freeze upto current column")));
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "freeze-flv",
+        width: 18,
+        height: 18,
+        style: {
+          marginTop: "4px",
+          marginRight: "4px"
+        }
+      }), /*#__PURE__*/React.createElement("p", null, _isFrozen ? "Unfreeze column" : "Freeze to current column")));
     }
     if (name === "comment") {
       return /*#__PURE__*/React.createElement(Menu, {
@@ -7815,8 +7888,14 @@ var ContextMenu = function ContextMenu() {
         }
       }, /*#__PURE__*/React.createElement("div", {
         className: "context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "MessageSquarePlus"
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "comment-flv",
+        width: 18,
+        height: 18,
+        style: {
+          marginTop: "4px",
+          marginRight: "8px"
+        }
       }), /*#__PURE__*/React.createElement("p", null, "Comment")));
     }
     if (name === "dataVerification") {
@@ -7831,8 +7910,13 @@ var ContextMenu = function ContextMenu() {
         }
       }, /*#__PURE__*/React.createElement("div", {
         className: "context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "ShieldCheck"
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "dataVerification",
+        width: 20,
+        height: 20,
+        style: {
+          marginRight: "7px"
+        }
       }), /*#__PURE__*/React.createElement("p", null, "Data Verification")));
     }
     if (name === "searchReplace") {
@@ -7848,8 +7932,13 @@ var ContextMenu = function ContextMenu() {
         }
       }, /*#__PURE__*/React.createElement("div", {
         className: "context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "Search"
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "search",
+        width: 20,
+        height: 20,
+        style: {
+          marginRight: "7px"
+        }
       }), /*#__PURE__*/React.createElement("p", null, "Find and Replace")));
     }
     if (name === "copy") {
@@ -7869,8 +7958,14 @@ var ContextMenu = function ContextMenu() {
         }
       }, /*#__PURE__*/React.createElement("div", {
         className: "context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "Copy"
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "copy-flv",
+        width: 21,
+        height: 21,
+        style: {
+          marginTop: "4px",
+          marginRight: "4px"
+        }
       }), /*#__PURE__*/React.createElement("p", null, rightclick.copy)));
     }
     if (name === "cut") {
@@ -7903,8 +7998,13 @@ var ContextMenu = function ContextMenu() {
         }
       }, /*#__PURE__*/React.createElement("div", {
         className: "context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "Scissors"
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "cut-flv",
+        width: 17,
+        height: 17,
+        style: {
+          marginRight: "8px"
+        }
       }), /*#__PURE__*/React.createElement("p", null, "Cut")));
     }
     if (name === "paste" && regeneratorRuntime) {
@@ -7936,8 +8036,13 @@ var ContextMenu = function ContextMenu() {
         }()
       }, /*#__PURE__*/React.createElement("div", {
         className: "context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "Clipboard"
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "paste-flv",
+        width: 17,
+        height: 17,
+        style: {
+          marginRight: "8px"
+        }
       }), /*#__PURE__*/React.createElement("p", null, rightclick.paste)));
     }
     if (name === "insert-column") {
@@ -7969,10 +8074,10 @@ var ContextMenu = function ContextMenu() {
               insertRowColOp: insertRowColOp
             });
           }
-        }, /*#__PURE__*/React.createElement("div", {
-          className: "context-item"
-        }, /*#__PURE__*/React.createElement(LucideIcon, {
-          name: "Plus"
+        }, /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SVGIcon, {
+          name: "insert-flv",
+          width: 18,
+          height: 18
         }), /*#__PURE__*/React.createElement("div", null, "Insert column to the left")));
       });
     }
@@ -8005,10 +8110,10 @@ var ContextMenu = function ContextMenu() {
               insertRowColOp: insertRowColOp
             });
           }
-        }, /*#__PURE__*/React.createElement("div", {
-          className: "context-item"
-        }, /*#__PURE__*/React.createElement(LucideIcon, {
-          name: "Plus"
+        }, /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SVGIcon, {
+          name: "insert-flv",
+          width: 18,
+          height: 18
         }), /*#__PURE__*/React.createElement("div", null, "Insert row below")));
       });
     }
@@ -8055,8 +8160,13 @@ var ContextMenu = function ContextMenu() {
         }
       }, /*#__PURE__*/React.createElement("div", {
         className: "context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "Trash2"
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "delete-flv",
+        width: 18,
+        height: 18,
+        style: {
+          marginRight: "8px"
+        }
       }), /*#__PURE__*/React.createElement("div", null, rightclick.deleteSelected, rightclick.column))));
     }
     if (name === "cell-delete-column") {
@@ -8102,8 +8212,13 @@ var ContextMenu = function ContextMenu() {
         }
       }, /*#__PURE__*/React.createElement("div", {
         className: "context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "Trash2"
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "delete-flv",
+        width: 18,
+        height: 18,
+        style: {
+          marginRight: "8px"
+        }
       }), /*#__PURE__*/React.createElement("div", null, rightclick.deleteSelected, rightclick.column))));
     }
     if (name === "delete-row") {
@@ -8148,8 +8263,13 @@ var ContextMenu = function ContextMenu() {
         }
       }, /*#__PURE__*/React.createElement("div", {
         className: "context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "Trash2"
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "delete-flv",
+        width: 18,
+        height: 18,
+        style: {
+          marginRight: "8px"
+        }
       }), /*#__PURE__*/React.createElement("div", null, rightclick.deleteSelected, rightclick.row))));
     }
     if (name === "cell-delete-row") {
@@ -8194,8 +8314,13 @@ var ContextMenu = function ContextMenu() {
         }
       }, /*#__PURE__*/React.createElement("div", {
         className: "context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "Trash2"
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "delete-flv",
+        width: 18,
+        height: 18,
+        style: {
+          marginRight: "8px"
+        }
       }), /*#__PURE__*/React.createElement("div", null, rightclick.deleteSelected, rightclick.row))));
     }
     if (name === "hide-row") {
@@ -8218,8 +8343,13 @@ var ContextMenu = function ContextMenu() {
           }
         }, /*#__PURE__*/React.createElement("div", {
           className: "context-item"
-        }, /*#__PURE__*/React.createElement(LucideIcon, {
-          name: "EyeOff"
+        }, /*#__PURE__*/React.createElement(SVGIcon, {
+          name: "hide-flv",
+          width: 18,
+          height: 18,
+          style: {
+            marginRight: "8px"
+          }
         }), /*#__PURE__*/React.createElement("div", null, rightclick[item] + rightclick.row)));
       });
     }
@@ -8243,8 +8373,13 @@ var ContextMenu = function ContextMenu() {
           }
         }, /*#__PURE__*/React.createElement("div", {
           className: "context-item"
-        }, /*#__PURE__*/React.createElement(LucideIcon, {
-          name: "EyeOff"
+        }, /*#__PURE__*/React.createElement(SVGIcon, {
+          name: "hide-flv",
+          width: 18,
+          height: 18,
+          style: {
+            marginRight: "8px"
+          }
         }), /*#__PURE__*/React.createElement("div", null, rightclick[item] + rightclick.column)));
       });
     }
@@ -8282,8 +8417,11 @@ var ContextMenu = function ContextMenu() {
         className: "context-item"
       }, /*#__PURE__*/React.createElement(SVGIcon, {
         name: "resize-flv",
-        width: 16,
-        height: 16
+        width: 18,
+        height: 18,
+        style: {
+          marginRight: "8px"
+        }
       }), /*#__PURE__*/React.createElement("div", null, "Resize row height", /*#__PURE__*/React.createElement("input", {
         onClick: function onClick(e) {
           return e.stopPropagation();
@@ -8319,8 +8457,11 @@ var ContextMenu = function ContextMenu() {
         className: "context-item"
       }, /*#__PURE__*/React.createElement(SVGIcon, {
         name: "resize-flv",
-        width: 16,
-        height: 16
+        width: 18,
+        height: 18,
+        style: {
+          marginRight: "8px"
+        }
       }), /*#__PURE__*/React.createElement("div", null, "Resize column width")))) : null;
     }
     if (name === "clear") {
@@ -8348,8 +8489,13 @@ var ContextMenu = function ContextMenu() {
         }
       }, /*#__PURE__*/React.createElement("div", {
         className: "context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "Eraser"
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "clear-flv",
+        width: 17,
+        height: 17,
+        style: {
+          marginRight: "8px"
+        }
       }), /*#__PURE__*/React.createElement("p", null, rightclick.clearContent)));
     }
     if (name === "ascSort") {
@@ -8365,8 +8511,14 @@ var ContextMenu = function ContextMenu() {
         }
       }, /*#__PURE__*/React.createElement("div", {
         className: "context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "ArrowDown01"
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "asc-sort-flv",
+        width: 18,
+        height: 18,
+        style: {
+          marginTop: "4px",
+          marginRight: "8px"
+        }
       }), /*#__PURE__*/React.createElement("p", null, "Ascending sort")));
     }
     if (name === "desSort") {
@@ -8382,8 +8534,14 @@ var ContextMenu = function ContextMenu() {
         }
       }, /*#__PURE__*/React.createElement("div", {
         className: "context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "ArrowDown10"
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "des-sort-flv",
+        width: 18,
+        height: 18,
+        style: {
+          marginTop: "4px",
+          marginRight: "8px"
+        }
       }), /*#__PURE__*/React.createElement("p", null, "Descending sort")));
     }
     if (name === "sort") {
@@ -8417,8 +8575,13 @@ var ContextMenu = function ContextMenu() {
           style: {
             height: "40px"
           }
-        }, /*#__PURE__*/React.createElement(LucideIcon, {
-          name: "ArrowUp"
+        }, /*#__PURE__*/React.createElement(SVGIcon, {
+          name: "sort-asc",
+          width: 24,
+          height: 18,
+          style: {
+            marginRight: "4px"
+          }
         }), /*#__PURE__*/React.createElement("p", null, sort.asc))), /*#__PURE__*/React.createElement(Menu, {
           onClick: function onClick() {
             setContext(function (draftCtx) {
@@ -8431,8 +8594,13 @@ var ContextMenu = function ContextMenu() {
           style: {
             height: "40px"
           }
-        }, /*#__PURE__*/React.createElement(LucideIcon, {
-          name: "ArrowDown"
+        }, /*#__PURE__*/React.createElement(SVGIcon, {
+          name: "sort-desc",
+          width: 24,
+          height: 18,
+          style: {
+            marginRight: "4px"
+          }
         }), /*#__PURE__*/React.createElement("p", null, sort.desc))))),
         trigger: "mouseenter focus",
         hideOnClick: false
@@ -8440,12 +8608,16 @@ var ContextMenu = function ContextMenu() {
         className: "flex items-center justify-between w-full"
       }, /*#__PURE__*/React.createElement("div", {
         className: "context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "ArrowDownUp"
-      }), /*#__PURE__*/React.createElement("p", null, rightclick.sortSelection)), /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "ChevronRight",
-        width: 16,
-        height: 16
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "sort-flv",
+        width: 18,
+        height: 18,
+        style: {
+          marginRight: "8px"
+        }
+      }), /*#__PURE__*/React.createElement("p", null, rightclick.sortSelection)), /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "rightArrow",
+        width: 18
       })))));
     }
     if (name === "filter") {
@@ -8479,8 +8651,13 @@ var ContextMenu = function ContextMenu() {
           style: {
             height: "40px"
           }
-        }, /*#__PURE__*/React.createElement(LucideIcon, {
-          name: "Filter"
+        }, /*#__PURE__*/React.createElement(SVGIcon, {
+          name: "filter",
+          width: 22,
+          height: 22,
+          style: {
+            marginRight: "4px"
+          }
         }), /*#__PURE__*/React.createElement("p", null, filter.filter))), /*#__PURE__*/React.createElement(Menu, {
           onClick: function onClick() {
             setContext(function (draftCtx) {
@@ -8493,8 +8670,14 @@ var ContextMenu = function ContextMenu() {
           style: {
             height: "40px"
           }
-        }, /*#__PURE__*/React.createElement(LucideIcon, {
-          name: "Eraser"
+        }, /*#__PURE__*/React.createElement(SVGIcon, {
+          name: "eraser",
+          width: 22,
+          height: 22,
+          style: {
+            marginRight: "4px",
+            marginLeft: "2px"
+          }
         }), /*#__PURE__*/React.createElement("p", null, filter.clearFilter))))),
         trigger: "mouseenter focus",
         hideOnClick: false
@@ -8502,12 +8685,17 @@ var ContextMenu = function ContextMenu() {
         className: "flex items-center justify-between w-full"
       }, /*#__PURE__*/React.createElement("div", {
         className: "context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "Filter"
-      }), /*#__PURE__*/React.createElement("p", null, rightclick.filterSelection)), /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "ChevronRight",
-        width: 16,
-        height: 16
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "filter",
+        width: 22,
+        height: 22,
+        style: {
+          marginRight: "4px",
+          marginTop: "2px"
+        }
+      }), /*#__PURE__*/React.createElement("p", null, rightclick.filterSelection)), /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "rightArrow",
+        width: 18
       })))));
     }
     if (name === "image") {
@@ -8532,8 +8720,13 @@ var ContextMenu = function ContextMenu() {
         }
       }, /*#__PURE__*/React.createElement("div", {
         className: "context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "Link"
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "link",
+        width: 20,
+        height: 20,
+        style: {
+          marginRight: "7px"
+        }
       }), /*#__PURE__*/React.createElement("p", null, rightclick.link)));
     }
     if (name === "conditionFormat") {
@@ -8564,11 +8757,16 @@ var ContextMenu = function ContextMenu() {
       }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Menu, null, /*#__PURE__*/React.createElement("div", {
         className: "flex items-center justify-between w-full"
       }, /*#__PURE__*/React.createElement("div", {
-        className: "flex items-center gap-2 context-item"
-      }, /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "PaintbrushVertical"
-      }), /*#__PURE__*/React.createElement("p", null, rightclick.conditionFormat || "Conditional Format")), /*#__PURE__*/React.createElement(LucideIcon, {
-        name: "ChevronRight",
+        className: "flex items-center gap-2"
+      }, /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "conditionFormat",
+        width: 16,
+        height: 16,
+        style: {
+          marginRight: "2px"
+        }
+      }), /*#__PURE__*/React.createElement("p", null, rightclick.conditionFormat || "Conditional Format")), /*#__PURE__*/React.createElement(SVGIcon, {
+        name: "rightArrow",
         width: 16,
         height: 16
       })))));
@@ -11885,14 +12083,13 @@ var DunePreview = function DunePreview(_ref) {
     }
   })), /*#__PURE__*/React.createElement("p", null, "Do you want to insert Dune chart?"), /*#__PURE__*/React.createElement("div", {
     className: "fortune-dune-preview-footer"
-  }, /*#__PURE__*/React.createElement("button", {
-    type: "button",
+  }, /*#__PURE__*/React.createElement(Button$1, {
+    variant: "ghost",
     onClick: onKeepAsLink,
-    className: "fortune-dune-preview-button"
-  }, "Keep as Link"), /*#__PURE__*/React.createElement("button", {
-    type: "button",
+    className: "!w-fit px-0"
+  }, "Keep as Link"), /*#__PURE__*/React.createElement(Button$1, {
     onClick: onEmbed,
-    className: "fortune-dune-preview-button primary"
+    className: "!w-fit px-0"
   }, "Embed")));
 };