@underverse-ui/underverse 1.0.185 → 1.0.186

package/api-reference.json

@@ -1,6 +1,6 @@
 {
   "package": "@underverse-ui/underverse",
-  "version": "1.0.185",
+  "version": "1.0.186",
   "sourceEntry": "src/index.ts",
   "totalExports": 248,
   "exports": [

package/dist/index.cjs

@@ -42461,6 +42461,9 @@ function getFormulaEditingTableContext(view) {
     if (!tableNode || tableNode.type.name !== "table") return null;
     const tableDom = cellDom.closest("table");
     if (!(tableDom instanceof HTMLTableElement)) return null;
+    const tableMap = import_tables7.TableMap.get(tableNode);
+    const tableStart = $from.start(tableDepth);
+    const formulaCellRect = tableMap.findCell(cellPos - tableStart);
     return {
       cellContentEnd: $from.end(depth),
       cellContentStart: $from.start(depth),
@@ -42468,11 +42471,50 @@ function getFormulaEditingTableContext(view) {
       formula: getCellText2(node),
       tableDom,
       tableNode,
-      tablePos: $from.before(tableDepth)
+      tablePos: $from.before(tableDepth),
+      formulaCellLabel: `${indexToColumnName(formulaCellRect.left)}${formulaCellRect.top + 1}`
     };
   }
   return null;
 }
+function collectTableFormulaCells(tableNode) {
+  const tableMap = import_tables7.TableMap.get(tableNode);
+  const formulas = [];
+  tableNode.forEach((rowNode, rowOffset) => {
+    rowNode.forEach((cellNode, cellOffset) => {
+      const formula = typeof cellNode.attrs.formula === "string" ? cellNode.attrs.formula.trim() : "";
+      if (!formula) return;
+      const rect = tableMap.findCell(rowOffset + 1 + cellOffset);
+      formulas.push({
+        label: `${indexToColumnName(rect.left)}${rect.top + 1}`,
+        formula
+      });
+    });
+  });
+  return formulas;
+}
+function getFormulaCycleBlockedLabels(tableNode, formulaCellLabel) {
+  const graph = buildTableFormulaDependencyGraph(collectTableFormulaCells(tableNode));
+  const blocked = /* @__PURE__ */ new Set();
+  const queue = [formulaCellLabel.toUpperCase()];
+  for (let index = 0; index < queue.length; index += 1) {
+    const label = queue[index];
+    if (!label || blocked.has(label)) continue;
+    blocked.add(label);
+    for (const dependent of graph.dependents.get(label) ?? []) {
+      if (!blocked.has(dependent)) queue.push(dependent);
+    }
+  }
+  return blocked;
+}
+function getReferenceLabels(reference) {
+  const range = parseTableCellRange(reference);
+  return range ? getTableCellRangeLabels(range) : [reference.toUpperCase()];
+}
+function isBlockedFormulaReference(tableNode, formulaCellLabel, reference) {
+  const blockedLabels = getFormulaCycleBlockedLabels(tableNode, formulaCellLabel);
+  return getReferenceLabels(reference).some((label) => blockedLabels.has(label));
+}
 function cancelFormulaEditing(view) {
   const context = getFormulaEditingTableContext(view);
   if (!context) return false;
@@ -42536,10 +42578,20 @@ function normalizeFormulaRangeLabel(fromLabel, toLabel) {
   return fromLabel === toLabel ? fromLabel : `${fromLabel}:${toLabel}`;
 }
 function replacePickedLabel(view, pickState, nextLabel, currentCell) {
-  if (nextLabel === pickState.currentLabel && currentCell === pickState.currentCell) return pickState;
+  const formulaContext = getFormulaEditingTableContext(view);
+  const blocked = formulaContext ? isBlockedFormulaReference(formulaContext.tableNode, pickState.formulaCellLabel, nextLabel) : false;
+  if (blocked) {
+    return {
+      ...pickState,
+      blocked: true,
+      currentCell
+    };
+  }
+  if (nextLabel === pickState.currentLabel && currentCell === pickState.currentCell && !pickState.blocked) return pickState;
   if (nextLabel === pickState.currentLabel) {
     return {
       ...pickState,
+      blocked: false,
       currentCell
     };
   }
@@ -42549,6 +42601,7 @@ function replacePickedLabel(view, pickState, nextLabel, currentCell) {
   view.dispatch(tr);
   return {
     ...pickState,
+    blocked: false,
     insertedTo: nextTo,
     currentLabel: nextLabel,
     currentCell
@@ -42560,6 +42613,22 @@ function beginFormulaRangePick(view, event) {
   if (!formulaCell) return null;
   const picked = getFormulaTableCellInfo(view, event.target, formulaCell.tablePos);
   if (!picked || picked.cell === formulaCell.cellDom) return null;
+  const blocked = isBlockedFormulaReference(formulaCell.tableNode, formulaCell.formulaCellLabel, picked.label);
+  if (blocked) {
+    event.preventDefault();
+    event.stopPropagation();
+    return {
+      anchorLabel: picked.label,
+      anchorCell: picked.cell,
+      tablePos: formulaCell.tablePos,
+      insertedFrom: view.state.selection.from,
+      insertedTo: view.state.selection.from,
+      currentLabel: "",
+      currentCell: picked.cell,
+      blocked: true,
+      formulaCellLabel: formulaCell.formulaCellLabel
+    };
+  }
   const { from, to } = view.state.selection;
   const prefix = from === to ? getReferenceInsertionPrefix(view, formulaCell.cellContentStart, from) : "";
   const insertedText = `${prefix}${picked.label}`;
@@ -42577,7 +42646,9 @@ function beginFormulaRangePick(view, event) {
     insertedFrom,
     insertedTo: insertedFrom + picked.label.length,
     currentLabel: picked.label,
-    currentCell: picked.cell
+    currentCell: picked.cell,
+    blocked: false,
+    formulaCellLabel: formulaCell.formulaCellLabel
   };
 }
 function updateFormulaRangePick(view, pickState, event) {
@@ -42605,7 +42676,8 @@ function getFormulaRangePickHighlight(container, pickState) {
     left,
     top,
     width: Math.max(0, right - left),
-    height: Math.max(0, bottom - top)
+    height: Math.max(0, bottom - top),
+    blocked: pickState.blocked
   };
 }
 
@@ -42629,6 +42701,12 @@ function createReferenceHighlight(label) {
   element.className = "pointer-events-none absolute z-[21] rounded-[2px] border-2 border-emerald-500 bg-emerald-500/15";
   return element;
 }
+function createBlockedReferenceHighlight(label) {
+  const element = document.createElement("span");
+  element.dataset.ueditorFormulaBlockedReference = label;
+  element.className = "pointer-events-none absolute z-[22] rounded-[2px] border-2 border-destructive/80 bg-destructive/10";
+  return element;
+}
 function useFormulaCoordinateOverlay(editor, containerRef, labels) {
   const overlayRef = (0, import_react77.useRef)(null);
   (0, import_react77.useEffect)(() => {
@@ -42640,6 +42718,7 @@ function useFormulaCoordinateOverlay(editor, containerRef, labels) {
     let activeTable = null;
     let activeTablePos = null;
     let hoverLabel = null;
+    const scrollListenerOptions = { passive: true, capture: true };
     const clearOverlay = () => {
       activeTable = null;
       activeTablePos = null;
@@ -42699,10 +42778,12 @@ function useFormulaCoordinateOverlay(editor, containerRef, labels) {
       actions.dataset.ueditorFormulaActions = "";
       actions.className = "pointer-events-auto absolute z-50 flex items-center gap-1 rounded-md border border-border bg-background p-1 shadow-md";
       const formulaCellRect = context.cellDom.getBoundingClientRect();
+      const formulaActionsHeight = 34;
+      const formulaActionsTop = formulaCellRect.bottom + 4 + formulaActionsHeight > tableRect.bottom ? Math.max(containerRect.top + 4, formulaCellRect.top - formulaActionsHeight - 4) : formulaCellRect.bottom + 4;
       setPosition(
         actions,
         formulaCellRect.left - containerRect.left + container.scrollLeft,
-        formulaCellRect.bottom - containerRect.top + container.scrollTop + 4
+        formulaActionsTop - containerRect.top + container.scrollTop
       );
       const applyButton = document.createElement("button");
       applyButton.type = "button";
@@ -42754,10 +42835,12 @@ function useFormulaCoordinateOverlay(editor, containerRef, labels) {
         children.push(label);
       }
       const references = new Set(getTableFormulaReferences(context.formula));
+      const blockedReferences = getFormulaCycleBlockedLabels(context.tableNode, context.formulaCellLabel);
       for (const info of cellInfos) {
-        if (!info || !references.has(info.label)) continue;
+        if (!info) continue;
         const cellRect = info.cell.getBoundingClientRect();
-        const highlight = createReferenceHighlight(info.label);
+        const highlight = info.label !== context.formulaCellLabel && blockedReferences.has(info.label) ? createBlockedReferenceHighlight(info.label) : references.has(info.label) ? createReferenceHighlight(info.label) : null;
+        if (!highlight) continue;
         setPosition(
           highlight,
           cellRect.left - containerRect.left + container.scrollLeft + 2,
@@ -42812,6 +42895,7 @@ function useFormulaCoordinateOverlay(editor, containerRef, labels) {
     editor.view.dom.addEventListener("mousemove", handleMouseMove2);
     editor.view.dom.addEventListener("mouseleave", handleMouseLeave2);
     container.addEventListener(UEDITOR_TABLE_LAYOUT_CHANGE_EVENT, scheduleSync);
+    container.addEventListener("scroll", scheduleSync, scrollListenerOptions);
     window.addEventListener("resize", scheduleSync);
     scheduleSync();
     return () => {
@@ -42822,6 +42906,7 @@ function useFormulaCoordinateOverlay(editor, containerRef, labels) {
       editor.view.dom.removeEventListener("mousemove", handleMouseMove2);
       editor.view.dom.removeEventListener("mouseleave", handleMouseLeave2);
       container.removeEventListener(UEDITOR_TABLE_LAYOUT_CHANGE_EVENT, scheduleSync);
+      container.removeEventListener("scroll", scheduleSync, scrollListenerOptions);
       window.removeEventListener("resize", scheduleSync);
       if (animationFrame != null) window.cancelAnimationFrame(animationFrame);
       clearOverlay();
@@ -44238,7 +44323,7 @@ var UEditor = import_react82.default.forwardRef(({
                 {
                   ref: formulaCoordinateOverlayRef,
                   "data-ueditor-formula-coordinate-overlay": "",
-                  className: "pointer-events-none absolute inset-0 z-[21] hidden overflow-visible"
+                  className: "pointer-events-none absolute inset-0 z-[35] hidden overflow-visible"
                 }
               ),
               formulaRangeHighlight && /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
@@ -44246,7 +44331,11 @@ var UEditor = import_react82.default.forwardRef(({
                 {
                   "aria-hidden": "true",
                   "data-ueditor-formula-range-highlight": "",
-                  className: "pointer-events-none absolute z-20 rounded-[2px] border-2 border-primary bg-primary/10",
+                  "data-ueditor-formula-range-blocked": formulaRangeHighlight.blocked ? "true" : void 0,
+                  className: cn(
+                    "pointer-events-none absolute z-20 rounded-[2px] border-2",
+                    formulaRangeHighlight.blocked ? "border-destructive bg-destructive/15" : "border-primary bg-primary/10"
+                  ),
                   style: {
                     left: formulaRangeHighlight.left,
                     top: formulaRangeHighlight.top,