@underverse-ui/underverse 1.0.156 → 1.0.157

package/api-reference.json

@@ -1,6 +1,6 @@
 {
   "package": "@underverse-ui/underverse",
-  "version": "1.0.156",
+  "version": "1.0.157",
   "sourceEntry": "src/index.ts",
   "totalExports": 232,
   "exports": [

package/dist/index.cjs

@@ -28978,6 +28978,20 @@ function createEmptyCellNode(cellNode) {
 function createCellCopyForColumnDuplicate(cellNode) {
   return cellNode.type.create(cellNode.attrs, cellNode.content);
 }
+function createCellWithDuplicatedLogicalColumn(cellNode, widthIndex) {
+  const colspan = Math.max(1, Number(cellNode.attrs.colspan) || 1);
+  let nextColwidth = null;
+  if (Array.isArray(cellNode.attrs.colwidth)) {
+    nextColwidth = [...cellNode.attrs.colwidth];
+    const duplicateWidth = nextColwidth[widthIndex];
+    nextColwidth.splice(widthIndex + 1, 0, typeof duplicateWidth === "number" ? duplicateWidth : 0);
+  }
+  return cellNode.type.create({
+    ...cellNode.attrs,
+    colspan: colspan + 1,
+    ...nextColwidth ? { colwidth: nextColwidth } : null
+  }, cellNode.content);
+}
 function getTableRows(tableNode) {
   const rows = [];
   tableNode.forEach((rowNode, rowOffset) => {
@@ -29153,6 +29167,11 @@ function duplicateTableColumnAt(editor, columnIndex, cellPos) {
         return rect && rect.top === rowIndex && rect.left <= columnIndex && columnIndex < rect.right;
       });
       if (!sourceCell) return rowInfo.node;
+      const sourceRect = safeFindCell(map, sourceCell.relativePos);
+      if (sourceRect && (sourceRect.left < columnIndex || sourceRect.right > columnIndex + 1)) {
+        cells[sourceCell.index] = createCellWithDuplicatedLogicalColumn(sourceCell.node, columnIndex - sourceRect.left);
+        return rowInfo.node.type.create(rowInfo.node.attrs, cells);
+      }
       cells.splice(sourceCell.index + 1, 0, createCellCopyForColumnDuplicate(sourceCell.node));
       return rowInfo.node.type.create(rowInfo.node.attrs, cells);
     });
@@ -30452,6 +30471,25 @@ function getTableFormulaRecalculationOrder(graph) {
   }
   return { order, circular };
 }
+function getAffectedTableFormulaLabels(graph, changedLabels) {
+  const affected = /* @__PURE__ */ new Set();
+  const queue = Array.from(changedLabels, (label) => label.toUpperCase());
+  for (const label of queue) {
+    if (graph.formulas.has(label)) {
+      affected.add(label);
+    }
+  }
+  for (let index = 0; index < queue.length; index += 1) {
+    const label = queue[index];
+    if (!label) continue;
+    for (const dependent of graph.dependents.get(label) ?? []) {
+      if (affected.has(dependent)) continue;
+      affected.add(dependent);
+      queue.push(dependent);
+    }
+  }
+  return affected;
+}
 function evaluateBasicTableFormula(formula, getCellValue) {
   const normalized = normalizeTableFormula(formula);
   if (!normalized) {
@@ -30599,10 +30637,19 @@ var FormulaParser = class {
         const range = parseTableCellRange(token.value);
         if (!range) return { value: null, error: "invalid-reference" };
         for (const label of getTableCellRangeLabels(range)) {
+          if (name === "COUNT") {
+            const cellValue2 = this.readOptionalCellNumber(label);
+            if (cellValue2 != null) values.push(cellValue2);
+            continue;
+          }
           const cellValue = this.readCellNumber(label);
           if (cellValue.error) return cellValue;
           values.push(cellValue.value);
         }
+      } else if (name === "COUNT" && token.type === "cell") {
+        this.index += 1;
+        const cellValue = this.readOptionalCellNumber(token.value);
+        if (cellValue != null) values.push(cellValue);
       } else {
         const value = this.parseExpression();
         if (value.error) return value;
@@ -30616,7 +30663,7 @@ var FormulaParser = class {
       }
       return { value: null, error: "invalid-formula" };
     }
-    if (values.length === 0) {
+    if (values.length === 0 && name !== "COUNT") {
       return { value: null, error: "invalid-formula" };
     }
     if (name === "SUM") return { value: values.reduce((sum, value) => sum + value, 0), error: null };
@@ -30634,6 +30681,11 @@ var FormulaParser = class {
     }
     return { value: parsed, error: null };
   }
+  readOptionalCellNumber(label) {
+    const value = this.getCellValue(label);
+    const parsed = typeof value === "number" ? value : Number.parseFloat(String(value ?? "").trim());
+    return Number.isFinite(parsed) ? parsed : null;
+  }
   peekOperator(operators) {
     const token = this.tokens[this.index];
     return token?.type === "operator" && operators.includes(token.value) ? token : null;
@@ -30697,6 +30749,41 @@ function getSelectionTableCellNode(editor) {
   }
   return null;
 }
+function getSelectionTableInfo(editor) {
+  const { $from } = editor.state.selection;
+  for (let depth = $from.depth; depth > 0; depth -= 1) {
+    const node = $from.node(depth);
+    if (node.type.name === "table") {
+      return {
+        node,
+        pos: $from.before(depth)
+      };
+    }
+  }
+  return null;
+}
+function getSelectionTableCellLabel(editor) {
+  const { $from } = editor.state.selection;
+  let cellDepth = -1;
+  let tableDepth = -1;
+  for (let depth = $from.depth; depth > 0; depth -= 1) {
+    const node = $from.node(depth);
+    if (cellDepth < 0 && (node.type.name === "tableCell" || node.type.name === "tableHeader")) {
+      cellDepth = depth;
+    }
+    if (node.type.name === "table") {
+      tableDepth = depth;
+      break;
+    }
+  }
+  if (cellDepth < 0 || tableDepth < 0) return null;
+  const tableNode = $from.node(tableDepth);
+  const tableStart = $from.start(tableDepth);
+  const relativeCellPos = $from.before(cellDepth) - tableStart;
+  const rect = safeFindCell2(import_tables2.TableMap.get(tableNode), relativeCellPos);
+  if (!rect) return null;
+  return `${indexToColumnName(rect.left)}${rect.top + 1}`;
+}
 function isEditingTableFormulaText(editor) {
   const cellNode = getSelectionTableCellNode(editor);
   return Boolean(cellNode && getCellText(cellNode).startsWith("="));
@@ -30708,20 +30795,6 @@ function createCellDisplayContent(cellNode, displayValue) {
   }
   return [paragraphType.create(null, cellNode.type.schema.text(displayValue))];
 }
-function buildTableValueGetter(tableNode) {
-  const map = import_tables2.TableMap.get(tableNode);
-  const values = /* @__PURE__ */ new Map();
-  for (const rowInfo of getTableRows2(tableNode)) {
-    for (const entry of rowInfo.cells) {
-      const rect = safeFindCell2(map, entry.relativePos);
-      if (!rect) continue;
-      const label = `${indexToColumnName(rect.left)}${rect.top + 1}`;
-      const computedValue = entry.node.attrs.computedValue;
-      values.set(label, typeof computedValue === "string" && computedValue.trim() ? computedValue : getCellText(entry.node));
-    }
-  }
-  return (label) => values.get(label.toUpperCase());
-}
 function buildTableValueMap(tableNode) {
   const map = import_tables2.TableMap.get(tableNode);
   const values = /* @__PURE__ */ new Map();
@@ -30736,10 +30809,6 @@ function buildTableValueMap(tableNode) {
   }
   return values;
 }
-function getFormulaComputedValue(formula, tableNode) {
-  const result = evaluateBasicTableFormula(formula, buildTableValueGetter(tableNode));
-  return result.error ? `#${result.error.toUpperCase()}` : String(result.value);
-}
 function normalizeFormulaInput(formula) {
   const trimmed = formula.trim();
   if (!trimmed) return "";
@@ -30750,19 +30819,19 @@ function setSelectedTableCellFormula(editor, formula) {
   const { state, view } = editor;
   if (!normalized) {
     const clearedFormula = (0, import_tables2.setCellAttr)("formula", null)(state, view.dispatch.bind(view));
-    const clearedValue = (0, import_tables2.setCellAttr)("computedValue", null)(editor.state, view.dispatch.bind(view));
-    if (clearedFormula || clearedValue) {
+    const clearedValue2 = (0, import_tables2.setCellAttr)("computedValue", null)(editor.state, view.dispatch.bind(view));
+    if (clearedFormula || clearedValue2) {
+      recalculateActiveTableFormulas(editor);
       view.focus();
       dispatchTableLayoutChange(editor);
       return true;
     }
     return false;
   }
-  const rect = (0, import_tables2.selectedRect)(state);
-  const computedValue = getFormulaComputedValue(normalized, rect.table);
   const appliedFormula = (0, import_tables2.setCellAttr)("formula", normalized)(state, view.dispatch.bind(view));
-  const appliedValue = (0, import_tables2.setCellAttr)("computedValue", computedValue)(editor.state, view.dispatch.bind(view));
-  if (appliedFormula || appliedValue) {
+  const clearedValue = (0, import_tables2.setCellAttr)("computedValue", null)(editor.state, view.dispatch.bind(view));
+  if (appliedFormula || clearedValue) {
+    recalculateActiveTableFormulas(editor);
     view.focus();
     dispatchTableLayoutChange(editor);
     return true;
@@ -30844,7 +30913,7 @@ function promoteFormulaTextInTableNode(tableNode) {
     changed
   };
 }
-function recalculateTableNode(tableNode) {
+function recalculateTableNode(tableNode, options) {
   const promoted = promoteFormulaTextInTableNode(tableNode);
   tableNode = promoted.tableNode;
   const map = import_tables2.TableMap.get(tableNode);
@@ -30874,13 +30943,16 @@ function recalculateTableNode(tableNode) {
     }))
   );
   const { order, circular } = getTableFormulaRecalculationOrder(graph);
+  const affectedLabels = options?.changedLabels ? getAffectedTableFormulaLabels(graph, options.changedLabels) : null;
   const computedValues = /* @__PURE__ */ new Map();
   const getCellValue = (label) => values.get(label.toUpperCase());
   for (const label of circular) {
+    if (affectedLabels && !affectedLabels.has(label)) continue;
     computedValues.set(label, formatFormulaError("circular-reference"));
     values.set(label, formatFormulaError("circular-reference"));
   }
   for (const label of order) {
+    if (affectedLabels && !affectedLabels.has(label)) continue;
     const entry = formulaEntries.get(label);
     if (!entry) continue;
     const result = evaluateBasicTableFormula(entry.formula, getCellValue);
@@ -30925,6 +30997,22 @@ function recalculateSelectedTable(editor) {
   dispatchTableLayoutChange(editor);
   return true;
 }
+function recalculateActiveTableFormulas(editor) {
+  const tableInfo = getSelectionTableInfo(editor);
+  if (!tableInfo) {
+    return recalculateAllTableFormulas(editor);
+  }
+  const activeCellLabel = getSelectionTableCellLabel(editor);
+  const nextTable = recalculateTableNode(tableInfo.node, {
+    changedLabels: activeCellLabel ? [activeCellLabel] : null
+  });
+  if (!nextTable) return false;
+  editor.view.dispatch(
+    editor.state.tr.replaceWith(tableInfo.pos, tableInfo.pos + tableInfo.node.nodeSize, nextTable).setMeta(UEDITOR_TABLE_FORMULA_RECALCULATE_META, true)
+  );
+  dispatchTableLayoutChange(editor);
+  return true;
+}
 function recalculateAllTableFormulas(editor) {
   const replacements = [];
   editor.state.doc.descendants((node, pos) => {
@@ -38921,6 +39009,146 @@ var MenuBar = ({
   ] });
 };
 
+// src/components/UEditor/table-formula-range-picker.ts
+var import_state9 = require("@tiptap/pm/state");
+var import_tables4 = require("@tiptap/pm/tables");
+function getCellText2(cellNode) {
+  return cellNode.textBetween(0, cellNode.content.size, "\n").trim();
+}
+function findSelectionFormulaCell(view) {
+  const { $from } = view.state.selection;
+  for (let depth = $from.depth; depth > 0; depth -= 1) {
+    const node = $from.node(depth);
+    if (node.type.name !== "tableCell" && node.type.name !== "tableHeader") continue;
+    if (!getCellText2(node).startsWith("=")) return null;
+    const cellPos = $from.before(depth);
+    const cellDom = view.nodeDOM(cellPos);
+    const tableDepth = depth - 2;
+    const tableNode = tableDepth > 0 ? $from.node(tableDepth) : null;
+    if (!tableNode || tableNode.type.name !== "table") return null;
+    return {
+      cellDom: cellDom instanceof HTMLTableCellElement ? cellDom : null,
+      tablePos: $from.before(tableDepth)
+    };
+  }
+  return null;
+}
+function findTableForPos(view, pos) {
+  const $pos = view.state.doc.resolve(pos);
+  for (let depth = $pos.depth; depth > 0; depth -= 1) {
+    const node = $pos.node(depth);
+    if (node.type.name === "table") {
+      return {
+        node,
+        pos: $pos.before(depth),
+        start: $pos.start(depth)
+      };
+    }
+  }
+  return null;
+}
+function getCellRelativePosFromDomPos2(map, tableStart, domPos) {
+  const relativeDomPos = domPos - tableStart;
+  const seen = /* @__PURE__ */ new Set();
+  for (const relativeCellPos of map.map) {
+    if (seen.has(relativeCellPos)) continue;
+    seen.add(relativeCellPos);
+    if (relativeDomPos === relativeCellPos || relativeDomPos === relativeCellPos + 1) {
+      return relativeCellPos;
+    }
+  }
+  return null;
+}
+function getPickedCellLabel(view, target, tablePos) {
+  const element = resolveEventElement(target);
+  const cell = element?.closest?.("th,td");
+  if (!(cell instanceof HTMLTableCellElement)) return null;
+  const domPos = view.posAtDOM(cell, 0);
+  const tableInfo = findTableForPos(view, domPos);
+  if (!tableInfo || tableInfo.pos !== tablePos) return null;
+  const map = import_tables4.TableMap.get(tableInfo.node);
+  const relativeCellPos = getCellRelativePosFromDomPos2(map, tableInfo.start, domPos);
+  if (relativeCellPos == null) return null;
+  const rect = map.findCell(relativeCellPos);
+  return {
+    cell,
+    label: `${indexToColumnName(rect.left)}${rect.top + 1}`
+  };
+}
+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;
+  if (nextLabel === pickState.currentLabel) {
+    return {
+      ...pickState,
+      currentCell
+    };
+  }
+  let tr = view.state.tr.insertText(nextLabel, pickState.insertedFrom, pickState.insertedTo);
+  const nextTo = pickState.insertedFrom + nextLabel.length;
+  tr = tr.setSelection(import_state9.TextSelection.create(tr.doc, nextTo));
+  view.dispatch(tr);
+  return {
+    ...pickState,
+    insertedTo: nextTo,
+    currentLabel: nextLabel,
+    currentCell
+  };
+}
+function beginFormulaRangePick(view, event) {
+  if (event.button !== 0) return null;
+  const formulaCell = findSelectionFormulaCell(view);
+  if (!formulaCell) return null;
+  const picked = getPickedCellLabel(view, event.target, formulaCell.tablePos);
+  if (!picked || picked.cell === formulaCell.cellDom) return null;
+  const { from, to } = view.state.selection;
+  let tr = view.state.tr.insertText(picked.label, from, to);
+  tr = tr.setSelection(import_state9.TextSelection.create(tr.doc, from + picked.label.length));
+  view.dispatch(tr);
+  view.focus();
+  event.preventDefault();
+  event.stopPropagation();
+  return {
+    anchorLabel: picked.label,
+    anchorCell: picked.cell,
+    tablePos: formulaCell.tablePos,
+    insertedFrom: from,
+    insertedTo: from + picked.label.length,
+    currentLabel: picked.label,
+    currentCell: picked.cell
+  };
+}
+function updateFormulaRangePick(view, pickState, event) {
+  const picked = getPickedCellLabel(view, event.target, pickState.tablePos);
+  if (!picked) return pickState;
+  event.preventDefault();
+  event.stopPropagation();
+  return replacePickedLabel(
+    view,
+    pickState,
+    normalizeFormulaRangeLabel(pickState.anchorLabel, picked.label),
+    picked.cell
+  );
+}
+function getFormulaRangePickHighlight(container, pickState) {
+  if (!container.contains(pickState.anchorCell) || !container.contains(pickState.currentCell)) return null;
+  const containerRect = container.getBoundingClientRect();
+  const anchorRect = pickState.anchorCell.getBoundingClientRect();
+  const currentRect = pickState.currentCell.getBoundingClientRect();
+  const left = Math.min(anchorRect.left, currentRect.left) - containerRect.left + container.scrollLeft;
+  const top = Math.min(anchorRect.top, currentRect.top) - containerRect.top + container.scrollTop;
+  const right = Math.max(anchorRect.right, currentRect.right) - containerRect.left + container.scrollLeft;
+  const bottom = Math.max(anchorRect.bottom, currentRect.bottom) - containerRect.top + container.scrollTop;
+  return {
+    left,
+    top,
+    width: Math.max(0, right - left),
+    height: Math.max(0, bottom - top)
+  };
+}
+
 // src/components/UEditor/UEditor.tsx
 var import_jsx_runtime95 = require("react/jsx-runtime");
 var UEditor = import_react71.default.forwardRef(({
@@ -38965,6 +39193,9 @@ var UEditor = import_react71.default.forwardRef(({
   const inFlightPrepareRef = (0, import_react71.useRef)(null);
   const lastAppliedContentRef = (0, import_react71.useRef)(content ?? "");
   const scheduledFormulaRecalculateRef = (0, import_react71.useRef)(false);
+  const formulaRangePickRef = (0, import_react71.useRef)(null);
+  const formulaRangeSurfaceRef = (0, import_react71.useRef)(null);
+  const [formulaRangeHighlight, setFormulaRangeHighlight] = import_react71.default.useState(null);
   const scheduleFormulaRecalculate = import_react71.default.useCallback((editor2, options) => {
     if (editor2.isDestroyed || scheduledFormulaRecalculateRef.current) return;
     if (!options?.force && isEditingTableFormulaText(editor2)) return;
@@ -38972,7 +39203,7 @@ var UEditor = import_react71.default.forwardRef(({
     queueMicrotask(() => {
       scheduledFormulaRecalculateRef.current = false;
       if (!editor2.isDestroyed && (options?.force || !isEditingTableFormulaText(editor2))) {
-        recalculateAllTableFormulas(editor2);
+        recalculateActiveTableFormulas(editor2);
       }
     });
   }, []);
@@ -39005,6 +39236,10 @@ var UEditor = import_react71.default.forwardRef(({
     ],
     [effectivePlaceholder, t, maxCharacters, uploadImage, resolvedUploadFile, imageInsertMode, maxImageFileSize, allowedImageMimeTypes, fallbackToDataUrl, editable, fetchMetadata, extraExtensions]
   );
+  const syncFormulaRangeHighlight = import_react71.default.useCallback((pickState) => {
+    const container = formulaRangeSurfaceRef.current;
+    setFormulaRangeHighlight(container && pickState ? getFormulaRangePickHighlight(container, pickState) : null);
+  }, []);
   const editor = (0, import_react72.useEditor)({
     immediatelyRender: false,
     extensions,
@@ -39013,6 +39248,37 @@ var UEditor = import_react71.default.forwardRef(({
     autofocus,
     editorProps: {
       handleDOMEvents: {
+        mousedown: (view, event) => {
+          if (!(event instanceof MouseEvent)) return false;
+          const pickState = beginFormulaRangePick(view, event);
+          if (!pickState) return false;
+          formulaRangePickRef.current = pickState;
+          syncFormulaRangeHighlight(pickState);
+          return true;
+        },
+        mousemove: (view, event) => {
+          if (!(event instanceof MouseEvent)) return false;
+          const pickState = formulaRangePickRef.current;
+          if (!pickState) return false;
+          if (event.buttons === 0) {
+            formulaRangePickRef.current = null;
+            syncFormulaRangeHighlight(null);
+            return false;
+          }
+          const nextPickState = updateFormulaRangePick(view, pickState, event);
+          formulaRangePickRef.current = nextPickState;
+          syncFormulaRangeHighlight(nextPickState);
+          return true;
+        },
+        mouseup: (_view, event) => {
+          if (!(event instanceof MouseEvent)) return false;
+          if (!formulaRangePickRef.current) return false;
+          formulaRangePickRef.current = null;
+          syncFormulaRangeHighlight(null);
+          event.preventDefault();
+          event.stopPropagation();
+          return true;
+        },
         keydown: (_view, event) => {
           if (!(event instanceof KeyboardEvent)) return false;
           if (event.key === "ArrowLeft" || event.key === "ArrowRight" || event.key === "ArrowUp" || event.key === "ArrowDown") {
@@ -39178,7 +39444,10 @@ var UEditor = import_react71.default.forwardRef(({
         /* @__PURE__ */ (0, import_jsx_runtime95.jsxs)(
           "div",
           {
-            ref: editorContentRef,
+            ref: (node) => {
+              editorContentRef.current = node;
+              formulaRangeSurfaceRef.current = node;
+            },
             className: "relative flex-1 overflow-y-auto",
             style: {
               minHeight: editable ? minHeight : void 0,
@@ -39210,6 +39479,20 @@ var UEditor = import_react71.default.forwardRef(({
                   className: "pointer-events-none hidden absolute z-20 rounded-[2px] border-2 border-primary bg-primary/10"
                 }
               ),
+              formulaRangeHighlight && /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
+                "span",
+                {
+                  "aria-hidden": "true",
+                  "data-ueditor-formula-range-highlight": "",
+                  className: "pointer-events-none absolute z-20 rounded-[2px] border-2 border-primary bg-primary/10",
+                  style: {
+                    left: formulaRangeHighlight.left,
+                    top: formulaRangeHighlight.top,
+                    width: formulaRangeHighlight.width,
+                    height: formulaRangeHighlight.height
+                  }
+                }
+              ),
               editable && /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(TableControls, { editor, containerRef: editorContentRef }),
               /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
                 import_react72.EditorContent,