@fileverse-dev/fortune-react 1.1.0 → 1.1.1

package/es/components/FormulaSearch/index.js

@@ -0,0 +1,198 @@
+import React, { useContext, useState, useMemo, useCallback } from "react";
+import { cancelNormalSelected, locale, setCaretPosition } from "@fileverse-dev/fortune-core";
+import _ from "lodash";
+import WorkbookContext from "../../context";
+import "./index.css";
+export var FormulaSearch = function FormulaSearch(_a) {
+  var _onCancel = _a.onCancel;
+  var _b = useContext(WorkbookContext),
+    context = _b.context,
+    setContext = _b.setContext,
+    _c = _b.refs,
+    cellInput = _c.cellInput,
+    globalCache = _c.globalCache;
+  var _d = useState(20),
+    selectedType = _d[0],
+    setSelectedType = _d[1];
+  var _e = useState(0),
+    selectedFuncIndex = _e[0],
+    setSelectedFuncIndex = _e[1];
+  var _f = useState(""),
+    searchText = _f[0],
+    setSearchText = _f[1];
+  var _g = locale(context),
+    formulaMore = _g.formulaMore,
+    functionlist = _g.functionlist,
+    button = _g.button;
+  var typeList = useMemo(function () {
+    return [{
+      t: 20,
+      n: formulaMore.Crypto
+    }, {
+      t: 0,
+      n: formulaMore.Math
+    }, {
+      t: 1,
+      n: formulaMore.Statistical
+    }, {
+      t: 2,
+      n: formulaMore.Lookup
+    }, {
+      t: 3,
+      n: formulaMore.luckysheet
+    }, {
+      t: 4,
+      n: formulaMore.dataMining
+    }, {
+      t: 5,
+      n: formulaMore.Database
+    }, {
+      t: 6,
+      n: formulaMore.Date
+    }, {
+      t: 7,
+      n: formulaMore.Filter
+    }, {
+      t: 8,
+      n: formulaMore.Financial
+    }, {
+      t: 9,
+      n: formulaMore.Engineering
+    }, {
+      t: 10,
+      n: formulaMore.Logical
+    }, {
+      t: 11,
+      n: formulaMore.Operator
+    }, {
+      t: 12,
+      n: formulaMore.Text
+    }, {
+      t: 13,
+      n: formulaMore.Parser
+    }, {
+      t: 14,
+      n: formulaMore.Array
+    }, {
+      t: -1,
+      n: formulaMore.other
+    }];
+  }, [formulaMore]);
+  var filteredFunctionList = useMemo(function () {
+    if (searchText) {
+      var list = [];
+      var text = _.cloneDeep(searchText.toUpperCase());
+      for (var i = 0; i < functionlist.length; i += 1) {
+        if (/^[a-zA-Z]+$/.test(text)) {
+          if (functionlist[i].n.indexOf(text) !== -1) {
+            list.push(functionlist[i]);
+          }
+        } else if (functionlist[i].a.indexOf(text) !== -1) {
+          list.push(functionlist[i]);
+        }
+      }
+      return list;
+    }
+    return _.filter(functionlist, function (v) {
+      return v.t === selectedType;
+    });
+  }, [functionlist, selectedType, searchText]);
+  var onConfirm = useCallback(function () {
+    var _a;
+    var last = (_a = context.luckysheet_select_save) === null || _a === void 0 ? void 0 : _a[context.luckysheet_select_save.length - 1];
+    var row_index = last === null || last === void 0 ? void 0 : last.row_focus;
+    var col_index = last === null || last === void 0 ? void 0 : last.column_focus;
+    if (!last) {
+      row_index = 0;
+      col_index = 0;
+    } else {
+      if (row_index == null) {
+        row_index = last.row[0];
+      }
+      if (col_index == null) {
+        col_index = last.column[0];
+      }
+    }
+    var formulaTxt = "<span dir=\"auto\" class=\"luckysheet-formula-text-color\">=</span><span dir=\"auto\" class=\"luckysheet-formula-text-color\">".concat(filteredFunctionList[selectedFuncIndex].n.toUpperCase(), "</span><span dir=\"auto\" class=\"luckysheet-formula-text-color\">(</span>");
+    setContext(function (ctx) {
+      if (cellInput.current != null) {
+        ctx.luckysheetCellUpdate = [row_index, col_index];
+        globalCache.doNotUpdateCell = true;
+        cellInput.current.innerHTML = formulaTxt;
+        var spans = cellInput.current.childNodes;
+        if (!_.isEmpty(spans)) {
+          setCaretPosition(ctx, spans[spans.length - 1], 0, 1);
+        }
+        ctx.functionHint = filteredFunctionList[selectedFuncIndex].n.toUpperCase();
+        ctx.functionCandidates = [];
+        if (_.isEmpty(ctx.formulaCache.functionlistMap)) {
+          for (var i = 0; i < functionlist.length; i += 1) {
+            ctx.formulaCache.functionlistMap[functionlist[i].n] = functionlist[i];
+          }
+        }
+        _onCancel();
+      }
+    });
+  }, [cellInput, context.luckysheet_select_save, filteredFunctionList, globalCache, selectedFuncIndex, setContext, _onCancel, functionlist]);
+  var onCancel = useCallback(function () {
+    setContext(function (ctx) {
+      cancelNormalSelected(ctx);
+      if (cellInput.current) {
+        cellInput.current.innerHTML = "";
+      }
+    });
+    _onCancel();
+  }, [_onCancel, cellInput, setContext]);
+  return /*#__PURE__*/React.createElement("div", {
+    id: "luckysheet-search-formula"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "inpbox"
+  }, /*#__PURE__*/React.createElement("div", null, formulaMore.findFunctionTitle, "\uFF1A"), /*#__PURE__*/React.createElement("input", {
+    className: "formulaInputFocus",
+    id: "searchFormulaListInput",
+    placeholder: formulaMore.tipInputFunctionName,
+    spellCheck: "false",
+    onChange: function onChange(e) {
+      return setSearchText(e.target.value);
+    }
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "selbox"
+  }, /*#__PURE__*/React.createElement("span", null, formulaMore.selectCategory, "\uFF1A"), /*#__PURE__*/React.createElement("select", {
+    id: "formulaTypeSelect",
+    onChange: function onChange(e) {
+      setSelectedType(parseInt(e.target.value, 10));
+      setSelectedFuncIndex(0);
+    }
+  }, typeList.map(function (v) {
+    return /*#__PURE__*/React.createElement("option", {
+      key: v.t,
+      value: v.t
+    }, v.n);
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: "listbox",
+    style: {
+      height: 200
+    }
+  }, /*#__PURE__*/React.createElement("div", null, formulaMore.selectFunctionTitle, "\uFF1A"), /*#__PURE__*/React.createElement("div", {
+    className: "formulaList"
+  }, filteredFunctionList.map(function (v, index) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "listBox".concat(index === selectedFuncIndex ? " on" : ""),
+      key: v.n,
+      onClick: function onClick() {
+        return setSelectedFuncIndex(index);
+      },
+      tabIndex: 0
+    }, /*#__PURE__*/React.createElement("div", null, v.n), /*#__PURE__*/React.createElement("div", null, v.a));
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: "fortune-dialog-box-button-container"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "fortune-message-box-button button-primary",
+    onClick: onConfirm,
+    tabIndex: 0
+  }, button.confirm), /*#__PURE__*/React.createElement("div", {
+    className: "fortune-message-box-button button-default",
+    onClick: onCancel,
+    tabIndex: 0
+  }, button.cancel)));
+};

package/{dist/packages/react/src → es}/components/FxEditor/NameBox.d.ts

@@ -1,3 +1,3 @@
-import React from "react";
-declare const LocationBox: React.FC;
-export default LocationBox;
+import React from "react";
+declare const LocationBox: React.FC;
+export default LocationBox;

package/es/components/FxEditor/NameBox.js

@@ -0,0 +1,29 @@
+import React, { useContext, useMemo } from "react";
+import _ from "lodash";
+import { getRangetxt } from "@fileverse-dev/fortune-core";
+import WorkbookContext from "../../context";
+var LocationBox = function LocationBox() {
+  var context = useContext(WorkbookContext).context;
+  var rangeText = useMemo(function () {
+    var lastSelection = _.last(context.luckysheet_select_save);
+    if (!(lastSelection && lastSelection.row_focus != null && lastSelection.column_focus != null)) return "";
+    var rf = lastSelection.row_focus;
+    var cf = lastSelection.column_focus;
+    if (context.config.merge != null && "".concat(rf, "_").concat(cf) in context.config.merge) {
+      return getRangetxt(context, context.currentSheetId, {
+        column: [cf, cf],
+        row: [rf, rf]
+      });
+    }
+    return getRangetxt(context, context.currentSheetId, lastSelection);
+  }, [context.currentSheetId, context.luckysheet_select_save]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "fortune-name-box-container"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "fortune-name-box",
+    tabIndex: 0,
+    dir: "ltr",
+    "aria-autocomplete": "list"
+  }, rangeText));
+};
+export default LocationBox;

package/es/components/FxEditor/index.css

@@ -0,0 +1,72 @@
+.fortune-fx-editor {
+  display: flex;
+  flex-direction: row;
+  height: 28px;
+  border-bottom: 1px solid #d4d4d4;
+}
+
+.fortune-fx-icon {
+  display: flex;
+  align-items: center;
+  margin: 0 12px;
+}
+
+.fortune-name-box-container {
+  width: 99px;
+  border-right: 1px solid #d4d4d4;
+  font-size: 14px;
+  display: flex;
+  align-items: center;
+}
+
+.fortune-name-box {
+  width: 100%;
+  text-align: center;
+  margin: 0;
+  outline: none;
+  cursor: text;
+  /* -webkit-user-modify: read-write-plaintext-only; */
+  white-space: nowrap;
+  overflow: hidden;
+  -webkit-transform: translateZ(0);
+  background-color: white;
+  word-wrap: break-word;
+  -webkit-nbsp-mode: space;
+  -webkit-line-break: after-white-space;
+}
+
+.fortune-fx-input-container {
+  padding-left: 10px;
+  overflow: visible;
+  padding: 0;
+  flex: 1;
+  display: flex;
+  align-items: center;
+  position: relative;
+  border-left: 1px solid #e5e5e5;
+}
+
+.fortune-fx-input {
+  flex: 1;
+  height: 100%;
+  overflow-y: scroll;
+  padding-left: 2px;
+  font-size: 14px;
+  line-height: 14px;
+  margin: 0;
+  outline: none;
+  cursor: text;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+  -webkit-transform: translateZ(0);
+  -webkit-nbsp-mode: space;
+  -webkit-line-break: after-white-space;
+  background-color: white;
+  padding-top: 7px;
+  box-sizing: border-box;
+  color: black;
+  text-align: left;
+}
+.fortune-fx-input[contenteditable="true"] {
+  -webkit-user-modify: read-write-plaintext-only;
+}

package/{dist/packages/react/src → es}/components/FxEditor/index.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
-import "./index.css";
-declare const FxEditor: React.FC;
-export default FxEditor;
+import React from "react";
+import "./index.css";
+declare const FxEditor: React.FC;
+export default FxEditor;

package/es/components/FxEditor/index.js

@@ -0,0 +1,167 @@
+import { getFlowdata, cancelNormalSelected, getCellValue, updateCell, getInlineStringNoStyle, isInlineStringCell, escapeScriptTag, moveHighlightCell, handleFormulaInput, rangeHightlightselected, valueShowEs, isShowHidenCR, escapeHTMLTag, isAllowEdit } from "@fileverse-dev/fortune-core";
+import React, { useContext, useState, useCallback, useEffect, useRef, useMemo } from "react";
+import "./index.css";
+import _ from "lodash";
+import WorkbookContext from "../../context";
+import SVGIcon from "../SVGIcon";
+import ContentEditable from "../SheetOverlay/ContentEditable";
+import NameBox from "./NameBox";
+import usePrevious from "../../hooks/usePrevious";
+var FxEditor = function FxEditor() {
+  var _a;
+  var _b = useContext(WorkbookContext),
+    context = _b.context,
+    setContext = _b.setContext,
+    refs = _b.refs;
+  var lastKeyDownEventRef = useRef(null);
+  var inputContainerRef = useRef(null);
+  var _c = useState(false),
+    isHidenRC = _c[0],
+    setIsHidenRC = _c[1];
+  var firstSelection = (_a = context.luckysheet_select_save) === null || _a === void 0 ? void 0 : _a[0];
+  var prevFirstSelection = usePrevious(firstSelection);
+  var prevSheetId = usePrevious(context.currentSheetId);
+  var recentText = useRef("");
+  useEffect(function () {
+    var _a;
+    setIsHidenRC(isShowHidenCR(context));
+    if (_.isEqual(prevFirstSelection, firstSelection) && context.currentSheetId === prevSheetId) {
+      return;
+    }
+    var d = getFlowdata(context);
+    var value = "";
+    if (firstSelection) {
+      var r = firstSelection.row_focus;
+      var c = firstSelection.column_focus;
+      if (_.isNil(r) || _.isNil(c)) return;
+      var cell = (_a = d === null || d === void 0 ? void 0 : d[r]) === null || _a === void 0 ? void 0 : _a[c];
+      if (cell) {
+        if (isInlineStringCell(cell)) {
+          value = getInlineStringNoStyle(r, c, d);
+        } else if (cell.f) {
+          value = getCellValue(r, c, d, "f");
+        } else {
+          value = valueShowEs(r, c, d);
+        }
+      }
+      refs.fxInput.current.innerHTML = escapeHTMLTag(escapeScriptTag(value));
+    } else {
+      refs.fxInput.current.innerHTML = "";
+    }
+  }, [context.luckysheetfile, context.currentSheetId, context.luckysheet_select_save]);
+  var onFocus = useCallback(function () {
+    var _a, _b;
+    if (context.allowEdit === false) {
+      return;
+    }
+    if (((_b = (_a = context.luckysheet_select_save) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0) > 0 && !context.luckysheet_cell_selected_move && isAllowEdit(context, context.luckysheet_select_save)) {
+      setContext(function (draftCtx) {
+        var last = draftCtx.luckysheet_select_save[draftCtx.luckysheet_select_save.length - 1];
+        var row_index = last.row_focus;
+        var col_index = last.column_focus;
+        draftCtx.luckysheetCellUpdate = [row_index, col_index];
+        refs.globalCache.doNotFocus = true;
+      });
+    }
+  }, [context.config, context.luckysheet_select_save, context.luckysheetfile, context.currentSheetId, refs.globalCache, setContext]);
+  var onKeyDown = useCallback(function (e) {
+    if (context.allowEdit === false) {
+      return;
+    }
+    lastKeyDownEventRef.current = new KeyboardEvent(e.type, e.nativeEvent);
+    var key = e.key;
+    recentText.current = refs.fxInput.current.innerText;
+    if (key === "ArrowLeft" || key === "ArrowRight") {
+      e.stopPropagation();
+    }
+    setContext(function (draftCtx) {
+      if (context.luckysheetCellUpdate.length > 0) {
+        switch (key) {
+          case "Enter":
+            {
+              var lastCellUpdate = _.clone(draftCtx.luckysheetCellUpdate);
+              updateCell(draftCtx, draftCtx.luckysheetCellUpdate[0], draftCtx.luckysheetCellUpdate[1], refs.fxInput.current);
+              draftCtx.luckysheet_select_save = [{
+                row: [lastCellUpdate[0], lastCellUpdate[0]],
+                column: [lastCellUpdate[1], lastCellUpdate[1]],
+                row_focus: lastCellUpdate[0],
+                column_focus: lastCellUpdate[1]
+              }];
+              moveHighlightCell(draftCtx, "down", 1, "rangeOfSelect");
+              e.preventDefault();
+              e.stopPropagation();
+              break;
+            }
+          case "Escape":
+            {
+              cancelNormalSelected(draftCtx);
+              moveHighlightCell(draftCtx, "down", 0, "rangeOfSelect");
+              e.preventDefault();
+              e.stopPropagation();
+              break;
+            }
+          case "ArrowLeft":
+            {
+              rangeHightlightselected(draftCtx, refs.fxInput.current);
+              break;
+            }
+          case "ArrowRight":
+            {
+              rangeHightlightselected(draftCtx, refs.fxInput.current);
+              break;
+            }
+          default:
+            break;
+        }
+      }
+    });
+  }, [context.allowEdit, context.luckysheetCellUpdate.length, refs.fxInput, setContext]);
+  var onChange = useCallback(function () {
+    var e = lastKeyDownEventRef.current;
+    if (!e) return;
+    var kcode = e.keyCode;
+    if (!kcode) return;
+    if (!(kcode >= 112 && kcode <= 123 || kcode <= 46 || kcode === 144 || kcode === 108 || e.ctrlKey || e.altKey || e.shiftKey && (kcode === 37 || kcode === 38 || kcode === 39 || kcode === 40)) || kcode === 8 || kcode === 32 || kcode === 46 || e.ctrlKey && kcode === 86) {
+      setContext(function (draftCtx) {
+        handleFormulaInput(draftCtx, refs.cellInput.current, refs.fxInput.current, kcode, recentText.current);
+      });
+    }
+  }, [refs.cellInput, refs.fxInput, setContext]);
+  var allowEdit = useMemo(function () {
+    if (context.allowEdit === false) {
+      return false;
+    }
+    if (isHidenRC) {
+      return false;
+    }
+    if (!isAllowEdit(context, context.luckysheet_select_save)) {
+      return false;
+    }
+    return true;
+  }, [context.config, context.luckysheet_select_save, context.luckysheetfile, context.currentSheetId, isHidenRC]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "fortune-fx-editor"
+  }, /*#__PURE__*/React.createElement(NameBox, null), /*#__PURE__*/React.createElement("div", {
+    className: "fortune-fx-icon"
+  }, /*#__PURE__*/React.createElement(SVGIcon, {
+    name: "fx",
+    width: 18,
+    height: 18
+  })), /*#__PURE__*/React.createElement("div", {
+    ref: inputContainerRef,
+    className: "fortune-fx-input-container"
+  }, /*#__PURE__*/React.createElement(ContentEditable, {
+    innerRef: function innerRef(e) {
+      refs.fxInput.current = e;
+    },
+    className: "fortune-fx-input",
+    id: "luckysheet-functionbox-cell",
+    "aria-autocomplete": "list",
+    onFocus: onFocus,
+    onKeyDown: onKeyDown,
+    onChange: onChange,
+    tabIndex: 0,
+    allowEdit: allowEdit
+  })));
+};
+export default FxEditor;

package/es/components/IFrameBoxs/iFrameBoxs.css

@@ -0,0 +1,16 @@
+.luckysheet-modal-dialog-controll {
+  position: absolute;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  top: -40px;
+  left: 0;
+  z-index: 301;
+}
+
+.fortune-iframe-boxes-delete-button {
+  background-color: #ffffff;
+  border: 1px solid #e8ebec;
+  border-radius: 8px;
+  box-shadow: 0px 4px 16px -4px #00000026;
+}

package/{dist/packages/react/src → es}/components/IFrameBoxs/iFrameBoxs.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
-import "./iFrameBoxs.css";
-declare const IframeBoxs: React.FC;
-export default IframeBoxs;
+import React from "react";
+import "./iFrameBoxs.css";
+declare const IframeBoxs: React.FC;
+export default IframeBoxs;

package/es/components/IFrameBoxs/iFrameBoxs.js

@@ -0,0 +1,142 @@
+import React, { useContext, useEffect, useRef, useMemo } from "react";
+import { IconButton } from "@fileverse/ui";
+import { onIframeMoveStart, onIframeResizeStart, onIframeMove, onIframeMoveEnd, onIframeResize, onIframeResizeEnd } from "@fileverse-dev/fortune-core";
+import WorkbookContext from "../../context";
+import "./iFrameBoxs.css";
+var IframeBoxs = function IframeBoxs() {
+  var _a = useContext(WorkbookContext),
+    context = _a.context,
+    setContext = _a.setContext,
+    refs = _a.refs;
+  var containerRef = useRef(null);
+  var currentSheetIframes = useMemo(function () {
+    var currentSheet = context.luckysheetfile.find(function (sheet) {
+      return sheet.id === context.currentSheetId;
+    });
+    return (currentSheet === null || currentSheet === void 0 ? void 0 : currentSheet.iframes) || [];
+  }, [context.luckysheetfile, context.currentSheetId]);
+  useEffect(function () {
+    var handleClickOutside = function handleClickOutside(e) {
+      if (!containerRef.current) return;
+      var iframeBoxes = containerRef.current.querySelectorAll(".luckysheet-modal-dialog-iframe");
+      var clickedInsideSomeIframe = Array.from(iframeBoxes).some(function (el) {
+        return el.contains(e.target);
+      });
+      if (!clickedInsideSomeIframe && context.activeIframe !== undefined) {
+        setContext(function (ctx) {
+          ctx.activeIframe = undefined;
+        });
+      }
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    return function () {
+      document.removeEventListener("mousedown", handleClickOutside);
+    };
+  }, [context.activeIframe, setContext]);
+  return /*#__PURE__*/React.createElement("div", {
+    id: "fortune-iframe-boxes",
+    ref: containerRef
+  }, currentSheetIframes === null || currentSheetIframes === void 0 ? void 0 : currentSheetIframes.map(function (frame) {
+    var isActive = frame.id === context.activeIframe;
+    var style = {
+      width: frame.width * context.zoomRatio,
+      height: frame.height * context.zoomRatio,
+      left: frame.left * context.zoomRatio,
+      top: frame.top * context.zoomRatio,
+      position: "absolute",
+      padding: 0,
+      zIndex: isActive ? 300 : 200
+    };
+    return /*#__PURE__*/React.createElement("div", {
+      key: frame.id,
+      id: isActive ? "fortune-modal-dialog-activeIframe" : frame.id,
+      className: "luckysheet-modal-dialog luckysheet-modal-dialog-iframe",
+      style: style,
+      onClick: function onClick(e) {
+        if (!isActive) {
+          setContext(function (ctx) {
+            ctx.activeIframe = frame.id;
+          });
+        }
+        e.stopPropagation();
+      },
+      onMouseDown: function onMouseDown(e) {
+        if (isActive) {
+          onIframeMoveStart(context, refs.globalCache, e.nativeEvent);
+          var handleMouseMove_1 = function handleMouseMove_1(moveEvent) {
+            onIframeMove(context, refs.globalCache, moveEvent);
+          };
+          var _handleMouseUp_ = function handleMouseUp_1() {
+            onIframeMoveEnd(context, refs.globalCache);
+            document.removeEventListener("mousemove", handleMouseMove_1);
+            document.removeEventListener("mouseup", _handleMouseUp_);
+          };
+          document.addEventListener("mousemove", handleMouseMove_1);
+          document.addEventListener("mouseup", _handleMouseUp_);
+        }
+        e.stopPropagation();
+      }
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "luckysheet-modal-dialog-content",
+      style: {
+        width: "100%",
+        height: "100%",
+        overflow: "hidden"
+      }
+    }, /*#__PURE__*/React.createElement("iframe", {
+      title: "iframe-".concat(frame.id),
+      src: frame.src,
+      style: {
+        width: "100%",
+        height: "100%",
+        border: "none",
+        pointerEvents: "none"
+      }
+    })), /*#__PURE__*/React.createElement("div", {
+      className: "luckysheet-modal-dialog-border"
+    }), isActive && (/*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+      className: "luckysheet-modal-dialog-resize"
+    }, ["lt", "mt", "lm", "rm", "rt", "lb", "mb", "rb"].map(function (v) {
+      return /*#__PURE__*/React.createElement("div", {
+        key: v,
+        className: "luckysheet-modal-dialog-resize-item luckysheet-modal-dialog-resize-item-".concat(v),
+        "data-type": v,
+        onMouseDown: function onMouseDown(e) {
+          onIframeResizeStart(context, refs.globalCache, e.nativeEvent, v);
+          var handleMouseMove = function handleMouseMove(moveEvent) {
+            onIframeResize(context, refs.globalCache, moveEvent);
+          };
+          var _handleMouseUp = function handleMouseUp() {
+            onIframeResizeEnd(context, refs.globalCache);
+            document.removeEventListener("mousemove", handleMouseMove);
+            document.removeEventListener("mouseup", _handleMouseUp);
+          };
+          document.addEventListener("mousemove", handleMouseMove);
+          document.addEventListener("mouseup", _handleMouseUp);
+          e.stopPropagation();
+        }
+      });
+    })), /*#__PURE__*/React.createElement("div", {
+      className: "luckysheet-modal-dialog-controll"
+    }, /*#__PURE__*/React.createElement(IconButton, {
+      icon: "Trash2",
+      onClick: function onClick() {
+        setContext(function (ctx) {
+          var _a;
+          var currentSheet = ctx.luckysheetfile.find(function (sheet) {
+            return sheet.id === ctx.currentSheetId;
+          });
+          if (currentSheet) {
+            currentSheet.iframes = (_a = currentSheet.iframes) === null || _a === void 0 ? void 0 : _a.filter(function (f) {
+              return f.id !== frame.id;
+            });
+          }
+          ctx.activeIframe = undefined;
+        });
+      },
+      variant: "ghost",
+      className: "fortune-iframe-boxes-delete-button"
+    })))));
+  }));
+};
+export default IframeBoxs;

package/{dist/packages/react/src → es}/components/ImgBoxs/index.d.ts

@@ -1,3 +1,3 @@
-import React from "react";
-declare const ImgBoxs: React.FC;
-export default ImgBoxs;
+import React from "react";
+declare const ImgBoxs: React.FC;
+export default ImgBoxs;