@ctzhian/tiptap 1.5.2 → 1.5.3

package/dist/util/structuredDiff.js

@@ -0,0 +1,550 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+import { generateJSON } from '@tiptap/html';
+import DiffMatchPatch from 'diff-match-patch';
+
+// 创建diff-match-patch实例
+var dmp = new DiffMatchPatch();
+
+// 类型定义
+
+/**
+ * 将HTML转换为ProseMirror文档结构
+ * @param {string} html - HTML字符串
+ * @param {Array} extensions - Tiptap扩展数组
+ * @returns {Object} ProseMirror文档对象
+ */
+export function parseHtmlToDoc(html, extensions) {
+  return generateJSON(html, extensions);
+}
+function haveSameMarks(a, b) {
+  var arrA = a || [];
+  var arrB = b || [];
+  if (arrA.length !== arrB.length) return false;
+  var serialize = function serialize(m) {
+    return "".concat(m.type, ":").concat(JSON.stringify(m.attrs || {}));
+  };
+  var setA = new Set(arrA.map(serialize));
+  var _iterator = _createForOfIteratorHelper(arrB),
+    _step;
+  try {
+    for (_iterator.s(); !(_step = _iterator.n()).done;) {
+      var m = _step.value;
+      if (!setA.has(serialize(m))) return false;
+    }
+  } catch (err) {
+    _iterator.e(err);
+  } finally {
+    _iterator.f();
+  }
+  return true;
+}
+
+/**
+ * 对比两个ProseMirror文档节点
+ * @param {Object} nodeA - 旧文档节点
+ * @param {Object} nodeB - 新文档节点
+ * @param {Array} path - 当前节点路径
+ * @returns {Array} 差异数组
+ */
+function compareNodes(nodeA, nodeB) {
+  var path = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+  var diffs = [];
+
+  // 如果节点类型不同，标记整个节点为变更
+  if ((nodeA === null || nodeA === void 0 ? void 0 : nodeA.type) !== (nodeB === null || nodeB === void 0 ? void 0 : nodeB.type)) {
+    if (nodeA) {
+      diffs.push({
+        type: 'delete',
+        path: _toConsumableArray(path),
+        node: nodeA
+      });
+    }
+    if (nodeB) {
+      diffs.push({
+        type: 'insert',
+        path: _toConsumableArray(path),
+        node: nodeB
+      });
+    }
+    return diffs;
+  }
+
+  // 如果是文本节点，进行文本级别的diff
+  if ((nodeA === null || nodeA === void 0 ? void 0 : nodeA.type) === 'text' && (nodeB === null || nodeB === void 0 ? void 0 : nodeB.type) === 'text') {
+    if (nodeA.text !== nodeB.text) {
+      // 计算文本差异
+      var textDiffs = dmp.diff_main(nodeA.text || '', nodeB.text || '');
+      dmp.diff_cleanupSemantic(textDiffs);
+
+      // 检查是否有文本差异
+      // if (textDiffs.length > 1) {
+      //   console.log('发现文本差异:', { oldText: nodeA.text, newText: nodeB.text, path });
+      // }
+
+      var textOffset = 0; // offset in the NEW text node
+
+      textDiffs.forEach(function (_ref) {
+        var _ref2 = _slicedToArray(_ref, 2),
+          operation = _ref2[0],
+          text = _ref2[1];
+        if (operation === -1) {
+          // Delete
+          // The widget should be placed at the current position in the new text.
+          var diffItem = {
+            type: 'delete',
+            path: _toConsumableArray(path),
+            textDiff: {
+              offset: textOffset,
+              length: text.length,
+              text: text,
+              operation: operation
+            }
+          };
+          diffs.push(diffItem);
+          // DO NOT advance textOffset
+        } else if (operation === 1) {
+          // Insert
+          var _diffItem = {
+            type: 'insert',
+            path: _toConsumableArray(path),
+            textDiff: {
+              offset: textOffset,
+              length: text.length,
+              text: text,
+              operation: operation
+            }
+          };
+          diffs.push(_diffItem);
+          textOffset += text.length; // DO advance textOffset
+        } else {
+          // Equal
+          textOffset += text.length; // DO advance textOffset
+        }
+      });
+    }
+    // 文本相等或不相等时都可检查 marks 差异（粗粒度：节点级）
+    if (!haveSameMarks(nodeA.marks, nodeB.marks)) {
+      diffs.push({
+        type: 'modify',
+        path: _toConsumableArray(path),
+        attrChange: {
+          key: 'marks',
+          oldValue: nodeA.marks || [],
+          newValue: nodeB.marks || []
+        }
+      });
+    }
+    return diffs;
+  }
+
+  // 优先：段落/标题等内联容器执行字符级 diff 和 marks 区间对比
+  if (nodeA && nodeB && isInlineContainer(nodeA) && isInlineContainer(nodeB)) {
+    // 文本与 marks 的字符级 diff
+    diffs.push.apply(diffs, _toConsumableArray(compareInlineContainer(nodeA, nodeB, path)));
+    // 非文本内联节点（如行内数学、行内公式等）的结构化对比
+    diffs.push.apply(diffs, _toConsumableArray(compareInlineContainerChildren(nodeA, nodeB, path)));
+    return diffs;
+  }
+
+  // 对比节点属性
+  var attrsA = (nodeA === null || nodeA === void 0 ? void 0 : nodeA.attrs) || {};
+  var attrsB = (nodeB === null || nodeB === void 0 ? void 0 : nodeB.attrs) || {};
+  var allAttrKeys = new Set([].concat(_toConsumableArray(Object.keys(attrsA)), _toConsumableArray(Object.keys(attrsB))));
+  for (var _i = 0, _Array$from = Array.from(allAttrKeys); _i < _Array$from.length; _i++) {
+    var key = _Array$from[_i];
+    if (attrsA[key] !== attrsB[key]) {
+      diffs.push({
+        type: 'modify',
+        path: _toConsumableArray(path),
+        attrChange: {
+          key: key,
+          oldValue: attrsA[key],
+          newValue: attrsB[key]
+        }
+      });
+    }
+  }
+
+  // 使用 LCS 对齐子节点，减少错配
+  var contentA = (nodeA === null || nodeA === void 0 ? void 0 : nodeA.content) || [];
+  var contentB = (nodeB === null || nodeB === void 0 ? void 0 : nodeB.content) || [];
+  var pairs = lcsAlign(contentA, contentB, nodesEqualForAlign);
+  var ai = 0;
+  var bi = 0;
+  for (var _i2 = 0, _pairs = pairs; _i2 < _pairs.length; _i2++) {
+    var _pairs$_i = _slicedToArray(_pairs[_i2], 2),
+      i = _pairs$_i[0],
+      j = _pairs$_i[1];
+    // 先处理 A 中未匹配（删除），以 B 的当前位置作为锚点
+    while (ai < i) {
+      var delNode = contentA[ai];
+      diffs.push({
+        type: 'delete',
+        path: [].concat(_toConsumableArray(path), [bi]),
+        node: delNode
+      });
+      ai++;
+    }
+    // 再处理 B 中未匹配（插入）
+    while (bi < j) {
+      var insNode = contentB[bi];
+      diffs.push({
+        type: 'insert',
+        path: [].concat(_toConsumableArray(path), [bi]),
+        node: insNode
+      });
+      bi++;
+    }
+    // 匹配上的成对递归，路径以新文档索引为准
+    var childA = contentA[i];
+    var childB = contentB[j];
+    diffs.push.apply(diffs, _toConsumableArray(compareNodes(childA, childB, [].concat(_toConsumableArray(path), [j]))));
+    ai = i + 1;
+    bi = j + 1;
+  }
+  // 处理尾部剩余未匹配项
+  while (ai < contentA.length) {
+    var _delNode = contentA[ai];
+    diffs.push({
+      type: 'delete',
+      path: [].concat(_toConsumableArray(path), [bi]),
+      node: _delNode
+    });
+    ai++;
+  }
+  while (bi < contentB.length) {
+    var _insNode = contentB[bi];
+    diffs.push({
+      type: 'insert',
+      path: [].concat(_toConsumableArray(path), [bi]),
+      node: _insNode
+    });
+    bi++;
+  }
+  return diffs;
+}
+function isInlineContainer(node) {
+  return node.type === 'paragraph' || node.type === 'heading';
+}
+function extractInlineTextAndMarks(node) {
+  var resultChars = [];
+  var marksMap = [];
+  var content = node.content || [];
+  var _iterator2 = _createForOfIteratorHelper(content),
+    _step2;
+  try {
+    for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+      var child = _step2.value;
+      if (child.type === 'text') {
+        var t = child.text || '';
+        for (var i = 0; i < t.length; i++) {
+          resultChars.push(t[i]);
+          marksMap.push((child.marks || []).slice());
+        }
+      }
+    }
+  } catch (err) {
+    _iterator2.e(err);
+  } finally {
+    _iterator2.f();
+  }
+  return {
+    text: resultChars.join(''),
+    marksMap: marksMap
+  };
+}
+function compareInlineContainer(nodeA, nodeB, path) {
+  var diffs = [];
+  var _extractInlineTextAnd = extractInlineTextAndMarks(nodeA),
+    oldText = _extractInlineTextAnd.text,
+    oldMarks = _extractInlineTextAnd.marksMap;
+  var _extractInlineTextAnd2 = extractInlineTextAndMarks(nodeB),
+    newText = _extractInlineTextAnd2.text,
+    newMarks = _extractInlineTextAnd2.marksMap;
+  var blocks = dmp.diff_main(oldText, newText);
+  dmp.diff_cleanupSemantic(blocks);
+  var oldOffset = 0;
+  var newOffset = 0;
+  for (var _i3 = 0, _arr = blocks; _i3 < _arr.length; _i3++) {
+    var _arr$_i = _slicedToArray(_arr[_i3], 2),
+      operation = _arr$_i[0],
+      text = _arr$_i[1];
+    var len = text.length;
+    if (operation === -1) {
+      // 删除：在新文本当前位置放置删除widget
+      diffs.push({
+        type: 'delete',
+        path: _toConsumableArray(path),
+        textDiff: {
+          offset: newOffset,
+          length: len,
+          text: text,
+          operation: operation
+        }
+      });
+      oldOffset += len;
+    } else if (operation === 1) {
+      // 插入：直接在新文本当前位置标注
+      diffs.push({
+        type: 'insert',
+        path: _toConsumableArray(path),
+        textDiff: {
+          offset: newOffset,
+          length: len,
+          text: text,
+          operation: operation
+        }
+      });
+      newOffset += len;
+    } else {
+      // 相等：检测 marks 差异并生成区间级 modify
+      var runStart = null;
+      for (var i = 0; i < len; i++) {
+        var oldIdx = oldOffset + i;
+        var newIdx = newOffset + i;
+        var same = haveSameMarks(oldMarks[oldIdx] || [], newMarks[newIdx] || []);
+        if (!same) {
+          if (runStart === null) runStart = i;
+        } else if (runStart !== null) {
+          diffs.push({
+            type: 'modify',
+            path: _toConsumableArray(path),
+            attrChange: {
+              key: 'marks',
+              oldValue: oldMarks.slice(oldOffset + runStart, oldOffset + i),
+              newValue: newMarks.slice(newOffset + runStart, newOffset + i),
+              fromOffset: newOffset + runStart,
+              toOffset: newOffset + i
+            }
+          });
+          runStart = null;
+        }
+      }
+      if (runStart !== null) {
+        var _i4 = len;
+        diffs.push({
+          type: 'modify',
+          path: _toConsumableArray(path),
+          attrChange: {
+            key: 'marks',
+            oldValue: oldMarks.slice(oldOffset + runStart, oldOffset + _i4),
+            newValue: newMarks.slice(newOffset + runStart, newOffset + _i4),
+            fromOffset: newOffset + runStart,
+            toOffset: newOffset + _i4
+          }
+        });
+      }
+      oldOffset += len;
+      newOffset += len;
+    }
+  }
+  return diffs;
+}
+function nodesEqualForAlign(a, b) {
+  if (!a || !b) return false;
+  if (a.type !== b.type) return false;
+  // 对部分结构节点使用关键属性辅助匹配
+  if (a.type === 'heading') {
+    var _a$attrs$level, _a$attrs, _b$attrs$level, _b$attrs;
+    return ((_a$attrs$level = (_a$attrs = a.attrs) === null || _a$attrs === void 0 ? void 0 : _a$attrs.level) !== null && _a$attrs$level !== void 0 ? _a$attrs$level : null) === ((_b$attrs$level = (_b$attrs = b.attrs) === null || _b$attrs === void 0 ? void 0 : _b$attrs.level) !== null && _b$attrs$level !== void 0 ? _b$attrs$level : null);
+  }
+  if (a.type === 'codeBlock' || a.type === 'code_block') {
+    var _ref3, _a$attrs$language, _a$attrs2, _a$attrs3, _ref4, _b$attrs$language, _b$attrs2, _b$attrs3;
+    var langA = (_ref3 = (_a$attrs$language = (_a$attrs2 = a.attrs) === null || _a$attrs2 === void 0 ? void 0 : _a$attrs2.language) !== null && _a$attrs$language !== void 0 ? _a$attrs$language : (_a$attrs3 = a.attrs) === null || _a$attrs3 === void 0 ? void 0 : _a$attrs3.lang) !== null && _ref3 !== void 0 ? _ref3 : null;
+    var langB = (_ref4 = (_b$attrs$language = (_b$attrs2 = b.attrs) === null || _b$attrs2 === void 0 ? void 0 : _b$attrs2.language) !== null && _b$attrs$language !== void 0 ? _b$attrs$language : (_b$attrs3 = b.attrs) === null || _b$attrs3 === void 0 ? void 0 : _b$attrs3.lang) !== null && _ref4 !== void 0 ? _ref4 : null;
+    return langA === langB;
+  }
+  if (a.type === 'table_cell' || a.type === 'tableHeader' || a.type === 'table_header') {
+    var _a$attrs$colspan, _a$attrs4, _b$attrs$colspan, _b$attrs4, _a$attrs$rowspan, _a$attrs5, _b$attrs$rowspan, _b$attrs5;
+    var colspanA = (_a$attrs$colspan = (_a$attrs4 = a.attrs) === null || _a$attrs4 === void 0 ? void 0 : _a$attrs4.colspan) !== null && _a$attrs$colspan !== void 0 ? _a$attrs$colspan : 1;
+    var colspanB = (_b$attrs$colspan = (_b$attrs4 = b.attrs) === null || _b$attrs4 === void 0 ? void 0 : _b$attrs4.colspan) !== null && _b$attrs$colspan !== void 0 ? _b$attrs$colspan : 1;
+    var rowspanA = (_a$attrs$rowspan = (_a$attrs5 = a.attrs) === null || _a$attrs5 === void 0 ? void 0 : _a$attrs5.rowspan) !== null && _a$attrs$rowspan !== void 0 ? _a$attrs$rowspan : 1;
+    var rowspanB = (_b$attrs$rowspan = (_b$attrs5 = b.attrs) === null || _b$attrs5 === void 0 ? void 0 : _b$attrs5.rowspan) !== null && _b$attrs$rowspan !== void 0 ? _b$attrs$rowspan : 1;
+    return colspanA === colspanB && rowspanA === rowspanB;
+  }
+  // 默认仅按类型
+  return true;
+}
+function compareInlineContainerChildren(nodeA, nodeB, path) {
+  var diffs = [];
+  var aList = (nodeA.content || []).map(function (n, idx) {
+    return {
+      n: n,
+      idx: idx
+    };
+  }).filter(function (x) {
+    return x.n.type !== 'text';
+  });
+  var bList = (nodeB.content || []).map(function (n, idx) {
+    return {
+      n: n,
+      idx: idx
+    };
+  }).filter(function (x) {
+    return x.n.type !== 'text';
+  });
+  var equals = function equals(x, y) {
+    if (!x || !y) return false;
+    // 仅按类型对齐，属性差异作为 modify 处理
+    return x.n.type === y.n.type;
+  };
+  var pairs = lcsAlign(aList, bList, equals);
+  var ai = 0,
+    bi = 0;
+  for (var _i5 = 0, _pairs2 = pairs; _i5 < _pairs2.length; _i5++) {
+    var _pairs2$_i = _slicedToArray(_pairs2[_i5], 2),
+      i = _pairs2$_i[0],
+      j = _pairs2$_i[1];
+    // 删除：使用新文档当前位置作为锚点路径
+    while (ai < i) {
+      var del = aList[ai];
+      var anchorIdx = bi < bList.length ? bList[bi].idx : nodeB.content ? nodeB.content.length : 0;
+      diffs.push({
+        type: 'delete',
+        path: [].concat(_toConsumableArray(path), [anchorIdx]),
+        node: del.n
+      });
+      ai++;
+    }
+    // 插入：直接使用新文档该节点的实际索引
+    while (bi < j) {
+      var ins = bList[bi];
+      diffs.push({
+        type: 'insert',
+        path: [].concat(_toConsumableArray(path), [ins.idx]),
+        node: ins.n
+      });
+      bi++;
+    }
+    // modify：同类型节点进行属性对比，路径指向新文档该内联节点索引
+    var aItem = aList[i];
+    var bItem = bList[j];
+    if (aItem && bItem) {
+      var oldAttrs = aItem.n.attrs || {};
+      var newAttrs = bItem.n.attrs || {};
+      if (JSON.stringify(oldAttrs) !== JSON.stringify(newAttrs)) {
+        diffs.push({
+          type: 'modify',
+          path: [].concat(_toConsumableArray(path), [bItem.idx]),
+          attrChange: {
+            key: 'attrs',
+            oldValue: oldAttrs,
+            newValue: newAttrs
+          }
+        });
+      }
+    }
+    ai = i + 1;
+    bi = j + 1;
+  }
+
+  // 尾部删除
+  while (ai < aList.length) {
+    var _del = aList[ai++];
+    var _anchorIdx = bi < bList.length ? bList[bi].idx : nodeB.content ? nodeB.content.length : 0;
+    diffs.push({
+      type: 'delete',
+      path: [].concat(_toConsumableArray(path), [_anchorIdx]),
+      node: _del.n
+    });
+  }
+  // 尾部插入
+  while (bi < bList.length) {
+    var _ins = bList[bi++];
+    diffs.push({
+      type: 'insert',
+      path: [].concat(_toConsumableArray(path), [_ins.idx]),
+      node: _ins.n
+    });
+  }
+  return diffs;
+}
+function lcsAlign(a, b, equals) {
+  var n = a.length;
+  var m = b.length;
+  var dp = Array.from({
+    length: n + 1
+  }, function () {
+    return Array(m + 1).fill(0);
+  });
+  for (var _i6 = n - 1; _i6 >= 0; _i6--) {
+    for (var _j = m - 1; _j >= 0; _j--) {
+      dp[_i6][_j] = equals(a[_i6], b[_j]) ? 1 + dp[_i6 + 1][_j + 1] : Math.max(dp[_i6 + 1][_j], dp[_i6][_j + 1]);
+    }
+  }
+  var pairs = [];
+  var i = 0,
+    j = 0;
+  while (i < n && j < m) {
+    if (equals(a[i], b[j])) {
+      pairs.push([i, j]);
+      i++;
+      j++;
+    } else if (dp[i + 1][j] >= dp[i][j + 1]) {
+      i++;
+    } else {
+      j++;
+    }
+  }
+  return pairs;
+}
+
+/**
+ * 对比两个HTML文档并生成结构化差异
+ * @param {string} oldHtml - 旧HTML
+ * @param {string} newHtml - 新HTML
+ * @param {Array} extensions - Tiptap扩展数组
+ * @returns {Object} 包含差异信息的对象
+ */
+export function compareDocuments(oldHtml, newHtml, extensions) {
+  var docA = parseHtmlToDoc(oldHtml, extensions);
+  var docB = parseHtmlToDoc(newHtml, extensions);
+  var diffs = compareNodes(docA, docB);
+  return {
+    oldDoc: docA,
+    newDoc: docB,
+    diffs: diffs,
+    hasChanges: diffs.length > 0
+  };
+}
+
+/**
+ * 将路径转换为ProseMirror位置
+ * @param {Array} path - 节点路径
+ * @param {Object} doc - ProseMirror文档
+ * @returns {number} 文档位置
+ */
+export function pathToPos(path, doc) {
+  var pos = 0;
+  var current = doc;
+  for (var i = 0; i < path.length; i++) {
+    var _current$childCount;
+    var index = path[i];
+    var contentStartOffset = current.type.name === 'doc' ? 0 : 1;
+    var resolvedPos = pos + contentStartOffset;
+    var childCount = (_current$childCount = current.childCount) !== null && _current$childCount !== void 0 ? _current$childCount : 0;
+    var effectiveIndex = Math.min(index, childCount);
+    for (var j = 0; j < effectiveIndex; j++) {
+      var child = current.child(j);
+      resolvedPos += child.nodeSize;
+    }
+    pos = resolvedPos;
+    if (index < childCount) {
+      current = current.child(index);
+    } else {
+      // Path points past the end in this doc (likely a deletion). Stop descending
+      break;
+    }
+  }
+  return pos;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ctzhian/tiptap",
-  "version": "1.5.2",
+  "version": "1.5.3",
   "description": "基于 Tiptap 二次开发的编辑器组件",
   "main": "dist/index.js",
   "module": "dist/index.js",