@leankylin-sheet/react 5.2.29 → 5.2.30

package/dist/index.js

@@ -3726,6 +3726,133 @@ var CellTipRender = function CellTipRender() {
   }));
 };
 
+var CircularReferenceDialog = function CircularReferenceDialog() {
+  var _useContext = React.useContext(WorkbookContext),
+    context = _useContext.context,
+    setContext = _useContext.setContext;
+  var _locale = core.locale(context),
+    formulaMore = _locale.formulaMore;
+  var cells = context.circularReference || [];
+  var _useState = React.useState({
+      x: 0,
+      y: 0
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    offset = _useState2[0],
+    setOffset = _useState2[1];
+  var dragRef = React.useRef({
+    dragging: false,
+    startX: 0,
+    startY: 0,
+    initialOffsetX: 0,
+    initialOffsetY: 0
+  });
+  var handleDragStart = React.useCallback(function (e) {
+    dragRef.current = {
+      dragging: true,
+      startX: e.pageX,
+      startY: e.pageY,
+      initialOffsetX: offset.x,
+      initialOffsetY: offset.y
+    };
+  }, [offset]);
+  var handleDragMove = React.useCallback(function (e) {
+    if (!dragRef.current.dragging) return;
+    var dx = e.pageX - dragRef.current.startX;
+    var dy = e.pageY - dragRef.current.startY;
+    setOffset({
+      x: dragRef.current.initialOffsetX + dx,
+      y: dragRef.current.initialOffsetY + dy
+    });
+  }, []);
+  var handleDragEnd = React.useCallback(function () {
+    dragRef.current.dragging = false;
+  }, []);
+  var handleNavigate = function handleNavigate(r, c, sheetId) {
+    setContext(function (draftCtx) {
+      if (sheetId !== draftCtx.currentSheetId) {
+        core.changeSheet(draftCtx, sheetId);
+      }
+      draftCtx.luckysheet_select_save = core.normalizeSelection(draftCtx, [{
+        row: [r, r],
+        column: [c, c]
+      }]);
+      core.scrollToHighlightCell(draftCtx, r, c);
+    });
+  };
+  var handleDismiss = function handleDismiss() {
+    setContext(function (ctx) {
+      delete ctx.circularReference;
+    });
+  };
+  return /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "leankylin-circular-ref-dialog",
+    style: {
+      transform: "translate(".concat(offset.x, "px, ").concat(offset.y, "px)")
+    },
+    onMouseMove: handleDragMove,
+    onMouseUp: handleDragEnd,
+    onMouseLeave: handleDragEnd,
+    onWheelCapture: function onWheelCapture(e) {
+      return e.stopPropagation();
+    }
+  }, /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "leankylin-circular-ref-dialog-title",
+    onMouseDown: handleDragStart
+  }, /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "leankylin-circular-ref-dialog-title-icon"
+  }, /*#__PURE__*/React__default['default'].createElement("svg", {
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }, /*#__PURE__*/React__default['default'].createElement("circle", {
+    cx: "12",
+    cy: "12",
+    r: "10"
+  }), /*#__PURE__*/React__default['default'].createElement("line", {
+    x1: "12",
+    y1: "8",
+    x2: "12",
+    y2: "12"
+  }), /*#__PURE__*/React__default['default'].createElement("line", {
+    x1: "12",
+    y1: "16",
+    x2: "12.01",
+    y2: "16"
+  }))), /*#__PURE__*/React__default['default'].createElement("span", {
+    className: "leankylin-circular-ref-dialog-title-text"
+  }, formulaMore.circularReferenceTitle)), /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "leankylin-circular-ref-dialog-desc"
+  }, formulaMore.circularReferenceDescription), /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "leankylin-circular-ref-dialog-table-wrap"
+  }, /*#__PURE__*/React__default['default'].createElement("table", {
+    className: "leankylin-circular-ref-dialog-table"
+  }, /*#__PURE__*/React__default['default'].createElement("thead", null, /*#__PURE__*/React__default['default'].createElement("tr", null, /*#__PURE__*/React__default['default'].createElement("th", null, formulaMore.circularReferenceSheet), /*#__PURE__*/React__default['default'].createElement("th", null, formulaMore.circularReferenceCell), /*#__PURE__*/React__default['default'].createElement("th", null, formulaMore.circularReferenceFormula))), /*#__PURE__*/React__default['default'].createElement("tbody", null, cells.map(function (cell, index) {
+    return /*#__PURE__*/React__default['default'].createElement("tr", {
+      key: index,
+      className: "leankylin-circular-ref-dialog-table-row",
+      onClick: function onClick() {
+        return handleNavigate(cell.r, cell.c, cell.sheetId);
+      }
+    }, /*#__PURE__*/React__default['default'].createElement("td", null, /*#__PURE__*/React__default['default'].createElement("span", {
+      className: "leankylin-circular-ref-dialog-table-cell-sheet"
+    }, cell.sheetName || "-")), /*#__PURE__*/React__default['default'].createElement("td", null, /*#__PURE__*/React__default['default'].createElement("span", {
+      className: "leankylin-circular-ref-dialog-table-cell-position"
+    }, cell.cellPosition)), /*#__PURE__*/React__default['default'].createElement("td", null, /*#__PURE__*/React__default['default'].createElement("span", {
+      className: "leankylin-circular-ref-dialog-table-cell-formula"
+    }, cell.formulaContent)));
+  })))), /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "leankylin-circular-ref-dialog-footer"
+  }, /*#__PURE__*/React__default['default'].createElement("button", {
+    type: "button",
+    className: "leankylin-circular-ref-dialog-footer-btn",
+    onClick: handleDismiss
+  }, core.locale(context).button.confirm)));
+};
+
 var SheetOverlay = function SheetOverlay() {
   var _refs$cellArea$curren, _refs$cellArea$curren2, _context$luckysheet_s, _context$luckysheet_s2, _context$luckysheet_s3, _context$luckysheet_s4, _context$luckysheet_s5, _context$luckysheet_s6, _context$presences$le, _context$presences, _context$linkCard, _context$rangeDialog;
   var _useContext = React.useContext(WorkbookContext),
@@ -4228,7 +4355,21 @@ var SheetOverlay = function SheetOverlay() {
     style: {
       left: context.scrollLeft
     }
-  }, settings.Footer)))))));
+  }, settings.Footer)))))), context.circularReference && context.circularReference.length > 0 && ( /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "leankylin-circular-ref-overlay",
+    onMouseDown: function onMouseDown(e) {
+      return e.stopPropagation();
+    },
+    onMouseMove: function onMouseMove(e) {
+      return e.stopPropagation();
+    },
+    onMouseUp: function onMouseUp(e) {
+      return e.stopPropagation();
+    },
+    onContextMenu: function onContextMenu(e) {
+      return e.stopPropagation();
+    }
+  }, /*#__PURE__*/React__default['default'].createElement(CircularReferenceDialog, null))));
 };
 
 var Sheet = function Sheet(_ref) {

package/dist/index.umd.css

@@ -2303,6 +2303,207 @@ html::-webkit-scrollbar-button {
 .leankylin-cell-tip-item{
     pointer-events: none;
 }
+.leankylin-circular-ref-overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 1004;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  pointer-events: none;
+}
+
+.leankylin-circular-ref-dialog {
+  min-width: 520px;
+  max-width: 650px;
+  max-height: 480px;
+  background: #fff;
+  border-radius: 6px;
+  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.05);
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  padding: 24px;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+  pointer-events: all;
+}
+
+.leankylin-circular-ref-dialog-title {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding-bottom: 12px;
+  border-bottom: 1px solid #f0f0f0;
+  margin-bottom: 14px;
+  cursor: move;
+}
+
+.leankylin-circular-ref-dialog-title-icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 28px;
+  height: 28px;
+  border-radius: 50%;
+  background: #fff3e0;
+  flex-shrink: 0;
+}
+
+.leankylin-circular-ref-dialog-title-icon svg {
+  width: 16px;
+  height: 16px;
+  color: #e65100;
+}
+
+.leankylin-circular-ref-dialog-title-text {
+  font-size: 16px;
+  font-weight: 600;
+  color: #1a1a1a;
+  line-height: 1.4;
+}
+
+.leankylin-circular-ref-dialog-desc {
+  font-size: 13px;
+  color: #666;
+  line-height: 1.7;
+  margin-bottom: 16px;
+  padding: 10px 14px;
+  background: #fff8e1;
+  border-radius: 6px;
+  border-left: 3px solid #ffb300;
+}
+
+.leankylin-circular-ref-dialog-table-wrap {
+  max-height: 280px;
+  overflow-y: auto;
+  border: 1px solid #e8e8e8;
+  border-radius: 8px;
+}
+
+.leankylin-circular-ref-dialog-table-wrap::-webkit-scrollbar {
+  width: 6px;
+}
+
+.leankylin-circular-ref-dialog-table-wrap::-webkit-scrollbar-thumb {
+  background: #d0d0d0;
+  border-radius: 3px;
+}
+
+.leankylin-circular-ref-dialog-table-wrap::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.leankylin-circular-ref-dialog-table {
+  width: 100%;
+  border-collapse: collapse;
+  table-layout: auto;
+}
+
+.leankylin-circular-ref-dialog-table thead th {
+  position: sticky;
+  top: 0;
+  background: #fafafa;
+  color: #555;
+  font-size: 12px;
+  font-weight: 600;
+  text-transform: none;
+  padding: 10px 14px;
+  text-align: left;
+  border-bottom: 2px solid #e8e8e8;
+  letter-spacing: 0.3px;
+}
+
+.leankylin-circular-ref-dialog-table thead th:first-child {
+  width: 25%;
+}
+
+.leankylin-circular-ref-dialog-table thead th:nth-child(2) {
+  width: 18%;
+}
+
+.leankylin-circular-ref-dialog-table thead th:last-child {
+  width: 57%;
+}
+
+.leankylin-circular-ref-dialog-table tbody td {
+  padding: 10px 14px;
+  font-size: 13px;
+  color: #333;
+  border-bottom: 1px solid #f5f5f5;
+  vertical-align: middle;
+}
+
+.leankylin-circular-ref-dialog-table tbody tr:last-child td {
+  border-bottom: none;
+}
+
+.leankylin-circular-ref-dialog-table tbody tr:hover {
+  background: #f9fafb;
+}
+
+.leankylin-circular-ref-dialog-table-row {
+  cursor: pointer;
+  transition: background 0.15s;
+}
+
+.leankylin-circular-ref-dialog-table-row:hover {
+  background: #e8f0fe !important;
+}
+
+.leankylin-circular-ref-dialog-table-cell-sheet {
+  color: #888;
+  font-style: italic;
+}
+
+.leankylin-circular-ref-dialog-table-cell-position {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  padding: 2px 8px;
+  background: #e3f2fd;
+  color: #1565c0;
+  border-radius: 3px;
+  font-weight: 600;
+  font-family: "SF Mono", "Menlo", "Monaco", "Consolas", monospace;
+  font-size: 12px;
+}
+
+.leankylin-circular-ref-dialog-table-cell-formula {
+  font-family: "SF Mono", "Menlo", "Monaco", "Consolas", monospace;
+  font-size: 12px;
+  color: #555;
+  word-break: break-all;
+}
+
+.leankylin-circular-ref-dialog-footer {
+  display: flex;
+  justify-content: flex-end;
+  margin-top: 16px;
+  padding-top: 12px;
+  border-top: 1px solid #f0f0f0;
+}
+
+.leankylin-circular-ref-dialog-footer-btn {
+  display: inline-flex;
+  align-items: center;
+  padding: 7px 20px;
+  font-size: 13px;
+  font-weight: 500;
+  border: none;
+  border-radius: 5px;
+  cursor: pointer;
+  background: #0188FB;
+  color: #fff;
+  transition: background 0.15s;
+}
+
+.leankylin-circular-ref-dialog-footer-btn:hover {
+  background: #006fd6;
+}
+
 .leankylin-toolbar {
   display: flex;
   flex-direction: row;