@fileverse-dev/fortune-react 1.1.0 → 1.1.2

package/es/components/LinkEidtCard/index.js

@@ -0,0 +1,238 @@
+var __assign = this && this.__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+import React, { useContext, useState, useMemo, useCallback, useLayoutEffect } from "react";
+import { locale, saveHyperlink, removeHyperlink, replaceHtml, goToLink, isLinkValid } from "@fileverse-dev/fortune-core";
+import { Button, TextField, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, LucideIcon } from "@fileverse/ui";
+import "./index.css";
+import _ from "lodash";
+import WorkbookContext from "../../context";
+import SVGIcon from "../SVGIcon";
+export var LinkEditCard = function LinkEditCard(_a) {
+  var r = _a.r,
+    c = _a.c,
+    rc = _a.rc,
+    originText = _a.originText,
+    originType = _a.originType,
+    originAddress = _a.originAddress,
+    isEditing = _a.isEditing,
+    position = _a.position;
+  var _b = useContext(WorkbookContext),
+    context = _b.context,
+    setContext = _b.setContext,
+    refs = _b.refs;
+  var _c = useState(originText),
+    linkText = _c[0],
+    setLinkText = _c[1];
+  var _d = useState(originAddress),
+    linkAddress = _d[0],
+    setLinkAddress = _d[1];
+  var _e = useState(originType),
+    linkType = _e[0],
+    setLinkType = _e[1];
+  var _f = locale(context),
+    insertLink = _f.insertLink,
+    linkTypeList = _f.linkTypeList;
+  var isLinkAddressValid = isLinkValid(context, linkType, linkAddress);
+  var isButtonDisabled = useMemo(function () {
+    if (!linkText.trim()) return true;
+    if (linkType === "webpage") {
+      return !linkAddress.trim() || !isLinkAddressValid.isValid;
+    }
+    if (linkType === "sheet") {
+      return !linkAddress.trim();
+    }
+    return false;
+  }, [linkText, linkAddress, linkType, isLinkAddressValid.isValid]);
+  var hideLinkCard = useCallback(function () {
+    _.set(refs.globalCache, "linkCard.mouseEnter", false);
+    setContext(function (draftCtx) {
+      draftCtx.linkCard = undefined;
+    });
+  }, [refs.globalCache, setContext]);
+  var containerEvent = useMemo(function () {
+    return {
+      onMouseEnter: function onMouseEnter() {
+        return _.set(refs.globalCache, "linkCard.mouseEnter", true);
+      },
+      onMouseLeave: function onMouseLeave() {
+        return _.set(refs.globalCache, "linkCard.mouseEnter", false);
+      },
+      onMouseDown: function onMouseDown(e) {
+        return e.stopPropagation();
+      },
+      onMouseMove: function onMouseMove(e) {
+        return e.stopPropagation();
+      },
+      onMouseUp: function onMouseUp(e) {
+        return e.stopPropagation();
+      },
+      onKeyDown: function onKeyDown(e) {
+        return e.stopPropagation();
+      },
+      onDoubleClick: function onDoubleClick(e) {
+        return e.stopPropagation();
+      }
+    };
+  }, [refs.globalCache]);
+  var renderToolbarButton = useCallback(function (iconId, onClick) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "fortune-toolbar-button",
+      onClick: onClick,
+      tabIndex: 0
+    }, /*#__PURE__*/React.createElement(SVGIcon, {
+      name: iconId,
+      style: {
+        width: 16,
+        height: 16
+      }
+    }));
+  }, []);
+  useLayoutEffect(function () {
+    setLinkAddress(originAddress);
+    setLinkText(originText);
+    setLinkType(originType);
+  }, [rc, originAddress, originText, originType]);
+  if (!isEditing) {
+    return /*#__PURE__*/React.createElement("div", __assign({}, containerEvent, {
+      onKeyDown: function onKeyDown(e) {
+        e.stopPropagation();
+      },
+      className: "fortune-link-modify-modal link-toolbar",
+      style: {
+        left: position.cellLeft + 20,
+        top: position.cellBottom - 5
+      }
+    }), /*#__PURE__*/React.createElement("div", {
+      className: "link-content",
+      onClick: function onClick() {
+        setContext(function (draftCtx) {
+          return goToLink(draftCtx, r, c, linkType, linkAddress, refs.scrollbarX.current, refs.scrollbarY.current);
+        });
+      },
+      tabIndex: 0
+    }, linkType === "webpage" ? insertLink.openLink : replaceHtml(insertLink.goTo, {
+      linkAddress: linkAddress
+    })), context.allowEdit === true && /*#__PURE__*/React.createElement("div", {
+      className: "divider"
+    }), context.allowEdit === true && linkType === "webpage" && renderToolbarButton("copy", function () {
+      navigator.clipboard.writeText(originAddress);
+      hideLinkCard();
+    }), context.allowEdit === true && renderToolbarButton("pencil", function () {
+      return setContext(function (draftCtx) {
+        if (draftCtx.linkCard != null && draftCtx.allowEdit) {
+          draftCtx.linkCard.isEditing = true;
+        }
+      });
+    }), context.allowEdit === true && /*#__PURE__*/React.createElement("div", {
+      className: "divider"
+    }), context.allowEdit === true && renderToolbarButton("unlink", function () {
+      return setContext(function (draftCtx) {
+        _.set(refs.globalCache, "linkCard.mouseEnter", false);
+        removeHyperlink(draftCtx, r, c);
+      });
+    }));
+  }
+  return /*#__PURE__*/React.createElement("div", __assign({
+    className: "fortune-link-card",
+    style: {
+      left: position.cellLeft + 20,
+      top: position.cellBottom
+    }
+  }, containerEvent), /*#__PURE__*/React.createElement(Select, {
+    value: linkType,
+    onValueChange: function onValueChange(value) {
+      if (value === "sheet") {
+        if (!linkText) {
+          setLinkText(context.luckysheetfile[0].name);
+        }
+        setLinkAddress(context.luckysheetfile[0].name);
+      } else {
+        setLinkAddress("");
+      }
+      setLinkType(value);
+    }
+  }, /*#__PURE__*/React.createElement(SelectTrigger, {
+    className: "fortune-link-type-select"
+  }, /*#__PURE__*/React.createElement(SelectValue, null)), /*#__PURE__*/React.createElement(SelectContent, {
+    className: "fortune-link-type-dropdown"
+  }, linkTypeList.filter(function (type) {
+    return type.value !== "cellrange";
+  }).map(function (type) {
+    return /*#__PURE__*/React.createElement(SelectItem, {
+      key: type.value,
+      value: type.value
+    }, type.text);
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: "fortune-input-with-icon"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "input-icon"
+  }, /*#__PURE__*/React.createElement(LucideIcon, {
+    name: "ALargeSmall"
+  })), /*#__PURE__*/React.createElement(TextField, {
+    placeholder: "Display text",
+    value: linkText,
+    onChange: function onChange(e) {
+      return setLinkText(e.target.value);
+    },
+    className: "fortune-link-input"
+  })), linkType === "webpage" && (/*#__PURE__*/React.createElement("div", {
+    className: "fortune-input-with-icon"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "input-icon"
+  }, /*#__PURE__*/React.createElement(SVGIcon, {
+    name: "link",
+    width: 16,
+    height: 16
+  })), /*#__PURE__*/React.createElement(TextField, {
+    placeholder: "Paste URL",
+    value: linkAddress,
+    onChange: function onChange(e) {
+      return setLinkAddress(e.target.value);
+    },
+    className: "fortune-link-input ".concat(!linkAddress || isLinkAddressValid.isValid ? "" : "error-input")
+  }))), linkType === "sheet" && (/*#__PURE__*/React.createElement("div", {
+    className: "fortune-input-with-icon"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "input-icon"
+  }, /*#__PURE__*/React.createElement(SVGIcon, {
+    name: "link",
+    width: 16,
+    height: 16
+  })), /*#__PURE__*/React.createElement(Select, {
+    onValueChange: function onValueChange(value) {
+      if (!linkText) setLinkText(value);
+      setLinkAddress(value);
+    },
+    value: linkAddress
+  }, /*#__PURE__*/React.createElement(SelectTrigger, {
+    className: "fortune-sheet-select"
+  }, /*#__PURE__*/React.createElement(SelectValue, {
+    placeholder: "[Sheet name]"
+  })), /*#__PURE__*/React.createElement(SelectContent, {
+    className: "fortune-sheet-dropdown"
+  }, context.luckysheetfile.map(function (sheet) {
+    return /*#__PURE__*/React.createElement(SelectItem, {
+      key: sheet.id,
+      value: sheet.name
+    }, sheet.name);
+  }))))), /*#__PURE__*/React.createElement(Button, {
+    className: "fortune-insert-button",
+    disabled: isButtonDisabled,
+    onClick: function onClick() {
+      if (isButtonDisabled) return;
+      _.set(refs.globalCache, "linkCard.mouseEnter", false);
+      setContext(function (draftCtx) {
+        return saveHyperlink(draftCtx, r, c, linkText, linkType, linkAddress);
+      });
+    }
+  }, "Insert link"));
+};
+export default LinkEditCard;

package/es/components/LocationCondition/index.css

@@ -0,0 +1,74 @@
+label {
+  cursor: default;
+}
+#fortune-location-condition {
+  min-width: 500px;
+}
+#fortune-location-condition .title {
+  background-color: #fff;
+  color: #000;
+  cursor: default;
+  font-size: 16px;
+  font-weight: normal;
+  line-height: 48px;
+}
+#fortune-location-condition .listbox {
+  border: 1px solid #dfdfdf;
+  padding: 10px;
+  font-size: 14px;
+  color: #000;
+}
+#fortune-location-condition .listbox .listItem {
+  padding: 5px 0;
+}
+#fortune-location-condition .listbox .listItem input[type="radio"] {
+  float: left;
+  margin-top: 5px;
+}
+#fortune-location-condition .listItem {
+  padding: 5px 0;
+}
+#fortune-location-condition .listItem .subItem {
+  height: 30px;
+  padding: 0 10px;
+  display: block;
+}
+#fortune-location-condition input[type="radio"] {
+  float: left;
+  margin-top: 3px;
+}
+#fortune-location-condition .listbox .listItem .subbox {
+  height: 30px;
+  padding: 0 10px;
+}
+#fortune-location-condition .listbox .listItem .subbox .subItem {
+  float: left;
+  margin-right: 5px;
+}
+#fortune-location-condition .button-basic {
+  display: inline-block;
+  margin-bottom: 0;
+  font-weight: 400;
+  text-align: center;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  white-space: nowrap;
+  padding: 4px 8px;
+  font-size: 14px;
+  line-height: 1.42857143;
+  border-radius: 2px;
+  user-select: none;
+  margin-top: 10px;
+}
+#fortune-location-condition .button-primary {
+  background: #0188fb;
+  border: 1px solid #0188fb;
+  color: #fff;
+  margin-right: 10px;
+}
+#fortune-location-condition .button-close {
+  color: #333;
+  background-color: #fff;
+  border: 1px solid #ccc;
+}

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

@@ -1,3 +1,3 @@
-import React from "react";
-import "./index.css";
-export declare const LocationCondition: React.FC<{}>;
+import React from "react";
+import "./index.css";
+export declare const LocationCondition: React.FC<{}>;

package/es/components/LocationCondition/index.js

@@ -0,0 +1,195 @@
+import { applyLocation, getFlowdata, getOptionValue, getSelectRange, locale } from "@fileverse-dev/fortune-core";
+import produce from "immer";
+import _ from "lodash";
+import React, { useContext, useState, useCallback } from "react";
+import WorkbookContext from "../../context";
+import { useDialog } from "../../hooks/useDialog";
+import "./index.css";
+export var LocationCondition = function LocationCondition() {
+  var _a = useContext(WorkbookContext),
+    context = _a.context,
+    setContext = _a.setContext;
+  var _b = useDialog(),
+    showDialog = _b.showDialog,
+    hideDialog = _b.hideDialog;
+  var _c = locale(context),
+    findAndReplace = _c.findAndReplace,
+    button = _c.button;
+  var _d = useState("locationConstant"),
+    conditionType = _d[0],
+    setConditionType = _d[1];
+  var _e = useState({
+      locationDate: true,
+      locationDigital: true,
+      locationString: true,
+      locationBool: true,
+      locationError: true
+    }),
+    constants = _e[0],
+    setConstants = _e[1];
+  var _f = useState({
+      locationDate: true,
+      locationDigital: true,
+      locationString: true,
+      locationBool: true,
+      locationError: true
+    }),
+    formulas = _f[0],
+    setFormulas = _f[1];
+  var onConfirm = useCallback(function () {
+    var _a, _b, _c, _d, _e, _f;
+    if (conditionType === "locationConstant") {
+      var value_1 = getOptionValue(constants);
+      var selectRange_1 = getSelectRange(context);
+      setContext(function (ctx) {
+        var rangeArr = applyLocation(selectRange_1, conditionType, value_1, ctx);
+        if (rangeArr.length === 0) showDialog(findAndReplace.locationTipNotFindCell, "ok");
+      });
+    } else if (conditionType === "locationFormula") {
+      var value_2 = getOptionValue(formulas);
+      var selectRange_2 = getSelectRange(context);
+      setContext(function (ctx) {
+        var rangeArr = applyLocation(selectRange_2, conditionType, value_2, ctx);
+        if (rangeArr.length === 0) showDialog(findAndReplace.locationTipNotFindCell, "ok");
+      });
+    } else if (conditionType === "locationRowSpan") {
+      if (((_a = context.luckysheet_select_save) === null || _a === void 0 ? void 0 : _a.length) === 0 || ((_b = context.luckysheet_select_save) === null || _b === void 0 ? void 0 : _b.length) === 1 && context.luckysheet_select_save[0].row[0] === context.luckysheet_select_save[0].row[1]) {
+        showDialog(findAndReplace.locationTiplessTwoRow, "ok");
+        return;
+      }
+      var selectRange_3 = _.assignIn([], context.luckysheet_select_save);
+      setContext(function (ctx) {
+        var rangeArr = applyLocation(selectRange_3, conditionType, undefined, ctx);
+        if (rangeArr.length === 0) showDialog(findAndReplace.locationTipNotFindCell, "ok");
+      });
+    } else if (conditionType === "locationColumnSpan") {
+      if (((_c = context.luckysheet_select_save) === null || _c === void 0 ? void 0 : _c.length) === 0 || ((_d = context.luckysheet_select_save) === null || _d === void 0 ? void 0 : _d.length) === 1 && context.luckysheet_select_save[0].column[0] === context.luckysheet_select_save[0].column[1]) {
+        showDialog(findAndReplace.locationTiplessTwoColumn, "ok");
+        return;
+      }
+      var selectRange_4 = _.assignIn([], context.luckysheet_select_save);
+      setContext(function (ctx) {
+        var rangeArr = applyLocation(selectRange_4, conditionType, undefined, ctx);
+        if (rangeArr.length === 0) showDialog(findAndReplace.locationTipNotFindCell, "ok");
+      });
+    } else {
+      var selectRange_5;
+      if (((_e = context.luckysheet_select_save) === null || _e === void 0 ? void 0 : _e.length) === 0 || ((_f = context.luckysheet_select_save) === null || _f === void 0 ? void 0 : _f.length) === 1 && context.luckysheet_select_save[0].row[0] === context.luckysheet_select_save[0].row[1] && context.luckysheet_select_save[0].column[0] === context.luckysheet_select_save[0].column[1]) {
+        var flowdata = getFlowdata(context, context.currentSheetId);
+        selectRange_5 = [{
+          row: [0, flowdata.length - 1],
+          column: [0, flowdata[0].length - 1]
+        }];
+      } else {
+        selectRange_5 = _.assignIn([], context.luckysheet_select_save);
+      }
+      setContext(function (ctx) {
+        var rangeArr = applyLocation(selectRange_5, conditionType, undefined, ctx);
+        if (rangeArr.length === 0) showDialog(findAndReplace.locationTipNotFindCell, "ok");
+      });
+    }
+  }, [conditionType, constants, context, findAndReplace.locationTipNotFindCell, findAndReplace.locationTiplessTwoColumn, findAndReplace.locationTiplessTwoRow, formulas, setContext, showDialog]);
+  var isSelect = useCallback(function (currentType) {
+    return conditionType === currentType;
+  }, [conditionType]);
+  return /*#__PURE__*/React.createElement("div", {
+    id: "fortune-location-condition"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "title"
+  }, findAndReplace.location), /*#__PURE__*/React.createElement("div", {
+    className: "listbox"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "listItem"
+  }, /*#__PURE__*/React.createElement("input", {
+    type: "radio",
+    name: "locationType",
+    id: "locationConstant",
+    checked: isSelect("locationConstant"),
+    onChange: function onChange() {
+      setConditionType("locationConstant");
+    }
+  }), /*#__PURE__*/React.createElement("label", {
+    htmlFor: "locationConstant"
+  }, findAndReplace.locationConstant), /*#__PURE__*/React.createElement("div", {
+    className: "subbox"
+  }, ["locationDate", "locationDigital", "locationString", "locationBool", "locationError"].map(function (v) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "subItem",
+      key: v
+    }, /*#__PURE__*/React.createElement("input", {
+      type: "checkbox",
+      disabled: !isSelect("locationConstant"),
+      checked: constants[v],
+      onChange: function onChange() {
+        setConstants(produce(function (draft) {
+          _.set(draft, v, !draft[v]);
+        }));
+      }
+    }), /*#__PURE__*/React.createElement("label", {
+      htmlFor: v,
+      style: {
+        color: isSelect("locationConstant") ? "#000" : "#666"
+      }
+    }, findAndReplace[v]));
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: "listItem"
+  }, /*#__PURE__*/React.createElement("input", {
+    type: "radio",
+    name: "locationType",
+    id: "locationFormula",
+    checked: isSelect("locationFormula"),
+    onChange: function onChange() {
+      setConditionType("locationFormula");
+    }
+  }), /*#__PURE__*/React.createElement("label", {
+    htmlFor: "locationFormula"
+  }, findAndReplace.locationFormula), /*#__PURE__*/React.createElement("div", {
+    className: "subbox"
+  }, ["locationDate", "locationDigital", "locationString", "locationBool", "locationError"].map(function (v) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "subItem",
+      key: v
+    }, /*#__PURE__*/React.createElement("input", {
+      type: "checkbox",
+      disabled: !isSelect("locationFormula"),
+      checked: formulas[v],
+      onChange: function onChange() {
+        setFormulas(produce(function (draft) {
+          _.set(draft, v, !draft[v]);
+        }));
+      }
+    }), /*#__PURE__*/React.createElement("label", {
+      htmlFor: v,
+      style: {
+        color: isSelect("locationFormula") ? "#000" : "#666"
+      }
+    }, findAndReplace[v]));
+  }))), ["locationNull", "locationRowSpan", "locationColumnSpan"].map(function (v) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "listItem",
+      key: v
+    }, /*#__PURE__*/React.createElement("input", {
+      type: "radio",
+      name: v,
+      checked: isSelect(v),
+      onChange: function onChange() {
+        setConditionType(v);
+      }
+    }), /*#__PURE__*/React.createElement("label", {
+      htmlFor: v
+    }, findAndReplace[v]));
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "button-basic button-primary",
+    onClick: function onClick() {
+      hideDialog();
+      onConfirm();
+    },
+    tabIndex: 0
+  }, button.confirm), /*#__PURE__*/React.createElement("div", {
+    className: "button-basic button-close",
+    onClick: function onClick() {
+      hideDialog();
+    },
+    tabIndex: 0
+  }, button.cancel));
+};

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

@@ -1,9 +1,9 @@
-import React from "react";
-type Props = {
-    type: "ok" | "yesno";
-    onOk?: () => void;
-    onCancel?: () => void;
-    children?: React.ReactNode;
-};
-declare const MessageBox: React.FC<Props>;
-export default MessageBox;
+import React from "react";
+type Props = {
+    type: "ok" | "yesno";
+    onOk?: () => void;
+    onCancel?: () => void;
+    children?: React.ReactNode;
+};
+declare const MessageBox: React.FC<Props>;
+export default MessageBox;

package/es/components/MessageBox/index.js

@@ -0,0 +1,16 @@
+import React from "react";
+import Dialog from "../Dialog";
+var MessageBox = function MessageBox(_a) {
+  var _b = _a.type,
+    type = _b === void 0 ? "yesno" : _b,
+    onOk = _a.onOk,
+    onCancel = _a.onCancel,
+    children = _a.children;
+  return /*#__PURE__*/React.createElement(Dialog, {
+    type: type,
+    onOk: onOk,
+    onCancel: onCancel,
+    title: type === "yesno" ? "Confirmation" : undefined
+  }, children);
+};
+export default MessageBox;

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

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

package/es/components/NotationBoxes/index.js

@@ -0,0 +1,105 @@
+import React, { useContext, useEffect } from "react";
+import { getFlowdata, onCommentBoxMoveStart, setEditingComment, showComments } from "@fileverse-dev/fortune-core";
+import _ from "lodash";
+import WorkbookContext from "../../context";
+var NotationBoxes = function NotationBoxes() {
+  var _a;
+  var _b = useContext(WorkbookContext),
+    context = _b.context,
+    setContext = _b.setContext,
+    refs = _b.refs,
+    settings = _b.settings;
+  var flowdata = getFlowdata(context);
+  useEffect(function () {
+    var _a;
+    if (flowdata) {
+      var psShownCells_1 = [];
+      for (var i = 0; i < flowdata.length; i += 1) {
+        for (var j = 0; j < flowdata[i].length; j += 1) {
+          var cell = flowdata[i][j];
+          if (!cell) continue;
+          if ((_a = cell.ps) === null || _a === void 0 ? void 0 : _a.isShow) {
+            psShownCells_1.push({
+              r: i,
+              c: j
+            });
+          }
+        }
+      }
+      setContext(function (ctx) {
+        return showComments(ctx, psShownCells_1);
+      });
+    }
+  }, [flowdata, setContext]);
+  return /*#__PURE__*/React.createElement("div", {
+    id: "luckysheet-postil-showBoxs"
+  }, _.concat((_a = context.commentBoxes) === null || _a === void 0 ? void 0 : _a.filter(function (v) {
+    var _a;
+    return (v === null || v === void 0 ? void 0 : v.rc) !== ((_a = context.editingCommentBox) === null || _a === void 0 ? void 0 : _a.rc);
+  }), [context.editingCommentBox, context.hoveredCommentBox]).map(function (commentBox, index) {
+    var _a, _b;
+    if (!commentBox) return null;
+    var r = commentBox.r,
+      c = commentBox.c,
+      rc = commentBox.rc,
+      left = commentBox.left,
+      top = commentBox.top,
+      width = commentBox.width,
+      height = commentBox.height,
+      size = commentBox.size;
+    var isEditing = ((_a = context.editingCommentBox) === null || _a === void 0 ? void 0 : _a.rc) === rc;
+    var commentId = "comment-box-".concat(rc);
+    return /*#__PURE__*/React.createElement("div", {
+      key: rc + index
+    }, /*#__PURE__*/React.createElement("canvas", {
+      id: "arrowCanvas-".concat(rc),
+      className: "arrowCanvas",
+      width: size.width,
+      height: size.height,
+      style: {
+        position: "absolute",
+        left: size.left,
+        top: size.top,
+        zIndex: 100,
+        pointerEvents: "none"
+      }
+    }), /*#__PURE__*/React.createElement("div", {
+      id: commentId,
+      className: "luckysheet-postil-show-main",
+      style: {
+        width: width,
+        height: height,
+        color: "#000",
+        padding: 5,
+        border: "1px solid #000",
+        backgroundColor: "rgb(255,255,225)",
+        position: "absolute",
+        left: left,
+        top: top,
+        boxSizing: "border-box",
+        zIndex: isEditing ? 200 : 100
+      },
+      onMouseDown: function onMouseDown(e) {
+        var nativeEvent = e.nativeEvent;
+        setContext(function (draftContext) {
+          if (flowdata) {
+            setEditingComment(draftContext, flowdata, r, c);
+          }
+        });
+        onCommentBoxMoveStart(context, refs.globalCache, nativeEvent, {
+          r: r,
+          c: c,
+          rc: rc
+        }, commentId);
+        e.stopPropagation();
+      }
+    }, /*#__PURE__*/React.createElement("div", {
+      style: {
+        width: "100%",
+        height: "100%",
+        overflow: "hidden"
+      }
+    }, (_b = settings.getCommentCellUI) === null || _b === void 0 ? void 0 : _b.call(settings, r, c))));
+  }));
+};
+export default NotationBoxes;

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

@@ -1,2 +1,2 @@
-import React from "react";
-export declare const ResetColumnWidth: React.FC<{}>;
+import React from "react";
+export declare const ResetColumnWidth: React.FC<{}>;