@pixerate/editor 0.24.0 → 0.25.0

package/dist/{chunk-5S3Z4PPF.js → chunk-UAKDG62Z.js}

@@ -264,6 +264,7 @@ var INSERTION_MARK_NAME = "insertion";
 var DELETION_MARK_NAME = "deletion";
 var FORMAT_CHANGE_MARK_NAME = "formatChange";
 var BLOCK_CHANGE_ATTRIBUTE = "blockChange";
+var MOVE_ID_ATTRIBUTE = "moveId";
 var REVIEW_MARK_NAMES = /* @__PURE__ */ new Set([
   INSERTION_MARK_NAME,
   DELETION_MARK_NAME,
@@ -337,6 +338,15 @@ var sharedAttributes = () => ({
     renderHTML: (attrs) => ({ "data-created-at": String(attrs.createdAt) })
   }
 });
+var moveAttribute = () => ({
+  [MOVE_ID_ATTRIBUTE]: {
+    default: null,
+    parseHTML: (el) => el.getAttribute("data-move-id"),
+    renderHTML: (attrs) => attrs[MOVE_ID_ATTRIBUTE] ? { "data-move-id": attrs[MOVE_ID_ATTRIBUTE] } : {}
+  }
+});
+var MOVE_TO_CLASS = "pixerate-move-to underline decoration-double decoration-emerald-600 text-emerald-700 dark:text-emerald-400";
+var MOVE_FROM_CLASS = "pixerate-move-from line-through decoration-double decoration-emerald-600 text-emerald-700 dark:text-emerald-400";
 var TrackedInsertion = Mark.create({
   name: INSERTION_MARK_NAME,
   inclusive: false,
@@ -344,20 +354,22 @@ var TrackedInsertion = Mark.create({
     return {
       HTMLAttributes: {
         class: "pixerate-insertion underline decoration-emerald-500 text-emerald-700 dark:text-emerald-400"
-      }
+      },
+      moveHTMLAttributes: { class: MOVE_TO_CLASS }
     };
   },
   addStorage() {
     return { markdown: { serialize: { open: "", close: "" }, parse: {} } };
   },
-  addAttributes: sharedAttributes,
+  addAttributes: () => ({ ...sharedAttributes(), ...moveAttribute() }),
   parseHTML() {
     return [{ tag: 'ins[data-change-type="insertion"]', priority: 100 }];
   },
-  renderHTML({ HTMLAttributes }) {
+  renderHTML({ mark, HTMLAttributes }) {
+    const base = mark.attrs[MOVE_ID_ATTRIBUTE] ? this.options.moveHTMLAttributes : this.options.HTMLAttributes;
     return [
       "ins",
-      mergeAttributes(this.options.HTMLAttributes, HTMLAttributes, {
+      mergeAttributes(base, HTMLAttributes, {
         "data-change-type": "insertion"
       }),
       0
@@ -371,7 +383,8 @@ var TrackedDeletion = Mark.create({
     return {
       HTMLAttributes: {
         class: "pixerate-deletion line-through decoration-red-500 text-red-600 dark:text-red-400"
-      }
+      },
+      moveHTMLAttributes: { class: MOVE_FROM_CLASS }
     };
   },
   addStorage() {
@@ -382,14 +395,15 @@ var TrackedDeletion = Mark.create({
       }
     };
   },
-  addAttributes: sharedAttributes,
+  addAttributes: () => ({ ...sharedAttributes(), ...moveAttribute() }),
   parseHTML() {
     return [{ tag: 'del[data-change-type="deletion"]', priority: 100 }];
   },
-  renderHTML({ HTMLAttributes }) {
+  renderHTML({ mark, HTMLAttributes }) {
+    const base = mark.attrs[MOVE_ID_ATTRIBUTE] ? this.options.moveHTMLAttributes : this.options.HTMLAttributes;
     return [
       "del",
-      mergeAttributes(this.options.HTMLAttributes, HTMLAttributes, {
+      mergeAttributes(base, HTMLAttributes, {
         "data-change-type": "deletion"
       }),
       0
@@ -539,6 +553,8 @@ function describeBlockChange(previous, current, ignoredAttributes = ["id"]) {
     keys.forEach((key) => {
       if (key === "textAlign") {
         parts.push(`Changed alignment to ${humanize(String(current.attrs?.textAlign ?? "default"))}`);
+      } else if (key === "styleId") {
+        parts.push(`Changed style to ${current.attrs?.styleId ?? "default"}`);
       } else {
         parts.push(`Changed ${humanize(key).toLowerCase()} of ${after}`);
       }
@@ -559,6 +575,20 @@ function describeBlockChange(previous, current, ignoredAttributes = ["id"]) {
   }
   return parts.join("; ") || `Changed ${after}`;
 }
+function trackedChangeLabel(change) {
+  switch (change.type) {
+    case "insertion":
+      return "Inserted";
+    case "deletion":
+      return "Deleted";
+    case "format":
+      return "Formatted";
+    case "move":
+      return "Moved";
+    default:
+      return "Changed";
+  }
+}
 function truncate(text, max = 40) {
   return text.length > max ? `${text.slice(0, max - 1)}\u2026` : text;
 }
@@ -657,6 +687,20 @@ function getTrackedChanges(source) {
       if (!isMarkChange(markType)) return;
       const attrs = changeAttributes(mark);
       if (!attrs.changeId) return;
+      const text = node.isText ? node.text ?? "" : "";
+      const moveId = markType !== FORMAT_CHANGE_MARK_NAME ? attrs[MOVE_ID_ATTRIBUTE] : null;
+      if (moveId) {
+        const change2 = add(`move:${moveId}`, "move", { ...attrs, changeId: moveId }, pos, pos + node.nodeSize, text);
+        if (!change2.move) change2.move = { from: [], to: [], fromText: "", toText: "" };
+        const source2 = markType === DELETION_MARK_NAME;
+        const list = source2 ? change2.move.from : change2.move.to;
+        const last = list[list.length - 1];
+        if (last && last.to === pos) last.to = pos + node.nodeSize;
+        else list.push({ from: pos, to: pos + node.nodeSize });
+        if (source2) change2.move.fromText += text;
+        else change2.move.toText += text;
+        return;
+      }
       const type = markType === FORMAT_CHANGE_MARK_NAME ? "format" : markType;
       const change = add(
         `${type}:${attrs.changeId}`,
@@ -664,7 +708,7 @@ function getTrackedChanges(source) {
         attrs,
         pos,
         pos + node.nodeSize,
-        node.isText ? node.text ?? "" : ""
+        text
       );
       if (type === "format") {
         const summary = diffFormatting(mark.attrs.before ?? [], mark.attrs.after ?? []);
@@ -685,6 +729,12 @@ function getTrackedChanges(source) {
       case "format":
         change.description = describeFormatChange(change.format);
         break;
+      case "move": {
+        const move = change.move;
+        change.text = move.toText || move.fromText;
+        change.description = change.text ? `Moved "${truncate(change.text)}"` : "Moved content";
+        break;
+      }
       case "block": {
         const { previous, current, operation } = change.block;
         if (operation) {
@@ -712,7 +762,12 @@ function getTrackedChangeAt(state, pos = state.selection.from, changes = getTrac
   return inline.find((c) => c.ranges.some((r) => r.from < pos && pos < r.to)) ?? inline.find((c) => c.ranges.some((r) => r.from <= pos && pos <= r.to)) ?? blocks.find((c) => c.ranges.some((r) => r.from < pos && pos < r.to)) ?? null;
 }
 function selectionRange(change) {
-  return change.type === "block" ? [change.from + 1, change.to - 1] : [change.from, change.to];
+  if (change.type === "block") return [change.from + 1, change.to - 1];
+  if (change.type === "move" && change.move) {
+    const ranges = change.move.to.length ? change.move.to : change.move.from;
+    if (ranges.length) return [ranges[0].from, ranges[ranges.length - 1].to];
+  }
+  return [change.from, change.to];
 }
 function isTrackChangesEnabled(source) {
   const state = source?.state ?? source;
@@ -982,12 +1037,36 @@ function decideBlocks(tr, changes, decision) {
     }
   });
 }
+function deleteWholeBlock(tr, from, to) {
+  const $from = tr.doc.resolve(from);
+  const block = $from.parent;
+  if ($from.depth !== 1 || !block.isTextblock || from !== $from.start() || to !== $from.end() || tr.doc.childCount < 2) {
+    return false;
+  }
+  try {
+    tr.delete($from.before(), $from.after());
+    return true;
+  } catch {
+    return false;
+  }
+}
 function applyDecision(tr, changes, decision) {
   const schema = tr.doc.type.schema;
   const format = changes.filter((c) => c.type === "format");
   if (format.length) decideFormat(tr, format, decision);
   const deletions = [];
   changes.forEach((change) => {
+    if (change.type === "move" && change.move) {
+      const accept = decision === "accept";
+      const keepType = schema.marks[accept ? INSERTION_MARK_NAME : DELETION_MARK_NAME];
+      (accept ? change.move.to : change.move.from).forEach(({ from, to }) => {
+        if (keepType) tr.removeMark(from, to, keepType);
+      });
+      (accept ? change.move.from : change.move.to).forEach(
+        ({ from, to }) => deletions.push({ from, to, wholeBlocks: true })
+      );
+      return;
+    }
     if (change.type !== "insertion" && change.type !== "deletion") return;
     const markType = schema.marks[change.type];
     if (!markType) return;
@@ -1000,8 +1079,11 @@ function applyDecision(tr, changes, decision) {
       }
     });
   });
-  deletions.sort((a, b) => b.from - a.from).forEach(({ from, to }) => {
-    tr.delete(tr.mapping.map(from), tr.mapping.map(to));
+  deletions.sort((a, b) => b.from - a.from).forEach(({ from, to, wholeBlocks }) => {
+    const start = tr.mapping.map(from);
+    const end = tr.mapping.map(to);
+    if (wholeBlocks && deleteWholeBlock(tr, start, end)) return;
+    tr.delete(start, end);
   });
   const blocks = changes.filter((c) => c.type === "block");
   if (blocks.length) decideBlocks(tr, blocks, decision);
@@ -1059,6 +1141,52 @@ function stripMarks(fragment) {
   });
   return Fragment.fromArray(children);
 }
+var SENTENCE_END = /[.!?…]$/;
+var TRAILING_CLOSERS = /["'”’)]+$/;
+var TRAILING_SPACES = /[  ]+$/;
+function isMoveSized(text) {
+  const trimmed = text.replace(TRAILING_SPACES, "");
+  if (trimmed.includes("\n")) return true;
+  const sentence = trimmed.replace(TRAILING_CLOSERS, "");
+  return SENTENCE_END.test(sentence) && sentence.trim().split(/\s+/).length >= 2;
+}
+var normalizeMoveText = (text) => text.replace(/\s+/g, "");
+function deletedText(slice, ctx) {
+  let text = "";
+  let blocks = 0;
+  slice.content.descendants((node) => {
+    if (node.isTextblock) {
+      if (blocks++ > 0) text += "\n";
+      return true;
+    }
+    if (!node.isText) return true;
+    const insertion = ctx.insertion.isInSet(node.marks);
+    if (insertion && insertion.attrs.authorId === ctx.author.id) return false;
+    if (ctx.deletion.isInSet(node.marks)) return false;
+    text += node.text ?? "";
+    return false;
+  });
+  return text;
+}
+var rangeText = (doc, from, to) => doc.textBetween(from, to, "\n", "");
+function linkMoveSource(tr, pending, ctx) {
+  const segments = [];
+  tr.doc.descendants((node, pos) => {
+    if (!node.isInline) return true;
+    const mark = ctx.deletion.isInSet(node.marks);
+    if (mark && mark.attrs.changeId === pending.id && !mark.attrs[MOVE_ID_ATTRIBUTE]) {
+      segments.push({ from: pos, to: pos + node.nodeSize, mark });
+    }
+    return false;
+  });
+  if (segments.length === 0) return false;
+  const text = segments.map((s) => rangeText(tr.doc, s.from, s.to)).join("");
+  if (normalizeMoveText(text) !== pending.text) return false;
+  segments.forEach(
+    ({ from, to, mark }) => tr.addMark(from, to, ctx.deletion.create({ ...mark.attrs, [MOVE_ID_ATTRIBUTE]: pending.id }))
+  );
+  return true;
+}
 function newAttributes(ctx) {
   return {
     changeId: ctx.generateId(),
@@ -1081,7 +1209,7 @@ function adjacentAttributes(doc, from, to, type, ctx) {
   const candidates = [doc.resolve(from).nodeBefore, doc.resolve(to).nodeAfter];
   for (const node of candidates) {
     const mark = node && type.isInSet(node.marks);
-    if (mark && mark.attrs.authorId === ctx.author.id && mark.attrs.changeId) {
+    if (mark && mark.attrs.authorId === ctx.author.id && mark.attrs.changeId && !mark.attrs[MOVE_ID_ATTRIBUTE]) {
       return changeAttributes(mark);
     }
   }
@@ -1338,18 +1466,51 @@ function trackTransactions(transactions, oldState, newState, ctx) {
   if (blocks.size) {
     changed = trackBlocks(tr, blocks, ctx) || changed;
   }
+  const moves = ctx.moves;
+  let insertAttrs = null;
+  let deleteAttrs = null;
+  const moveAttrs = (id) => ({
+    changeId: id,
+    authorId: ctx.author.id,
+    authorName: ctx.author.name,
+    authorColor: ctx.author.color ?? null,
+    createdAt: ctx.now(),
+    [MOVE_ID_ATTRIBUTE]: id
+  });
+  if (moves && inserted.length) {
+    const insertedText = normalizeMoveText(
+      inserted.map((r) => rangeText(tr.doc, r.from, r.to)).join("")
+    );
+    const pending = moves.pending;
+    if (moves.event === "paste" && pending && pending.authorId === ctx.author.id && insertedText === pending.text && linkMoveSource(tr, pending, ctx)) {
+      insertAttrs = moveAttrs(pending.id);
+    } else if (moves.event === "drop" && restores.length) {
+      const raw = restores.map((r) => deletedText(r.slice, ctx)).join("\n");
+      if (insertedText && normalizeMoveText(raw) === insertedText && moves.isMove(raw)) {
+        insertAttrs = deleteAttrs = moveAttrs(ctx.generateId());
+      }
+    }
+  }
+  if (moves?.event === "cut" && restores.length) {
+    deleteAttrs = newAttributes(ctx);
+    const raw = restores.map((r) => deletedText(r.slice, ctx)).join("\n");
+    if (normalizeMoveText(raw) && moves.isMove(raw)) {
+      moves.cut = { id: deleteAttrs.changeId, text: normalizeMoveText(raw), authorId: ctx.author.id };
+    }
+  }
   inserted.forEach(({ from, to }) => {
     tr.removeMark(from, to, ctx.deletion);
     tr.removeMark(from, to, ctx.insertion);
     if (ctx.format) tr.removeMark(from, to, ctx.format);
-    const attrs = adjacentAttributes(tr.doc, from, to, ctx.insertion, ctx) ?? newAttributes(ctx);
+    const attrs = insertAttrs ?? adjacentAttributes(tr.doc, from, to, ctx.insertion, ctx) ?? newAttributes(ctx);
     tr.addMark(from, to, ctx.insertion.create(attrs));
     changed = true;
   });
+  if (insertAttrs) changed = true;
   let cursor = null;
   restores.sort((a, b) => b.pos - a.pos).forEach((restore) => {
     const pos = tr.mapping.map(restore.pos, -1);
-    const attrs = adjacentAttributes(tr.doc, pos, pos, ctx.deletion, ctx) ?? newAttributes(ctx);
+    const attrs = deleteAttrs ?? adjacentAttributes(tr.doc, pos, pos, ctx.deletion, ctx) ?? newAttributes(ctx);
     const marked = markDeletedSlice(restore.slice, restore.parentType, attrs, ctx);
     if (!marked || !marked.hasContent) return;
     const sizeBefore = tr.doc.content.size;
@@ -1415,7 +1576,10 @@ var TrackChanges = Extension.create({
       trackCodeBlocks: true,
       blockTypes: ["paragraph", "heading", "codeBlock"],
       ignoredMarks: [],
-      ignoredBlockAttributes: ["id"]
+      ignoredBlockAttributes: ["id"],
+      trackMoves: true,
+      isMove: isMoveSized,
+      moveHTMLAttributes: {}
     };
   },
   addStorage() {
@@ -1462,9 +1626,18 @@ var TrackChanges = Extension.create({
     const insertionAttrs = this.options?.insertionHTMLAttributes ?? {};
     const deletionAttrs = this.options?.deletionHTMLAttributes ?? {};
     const formatAttrs = this.options?.formatChangeHTMLAttributes ?? {};
+    const moveAttrs = this.options?.moveHTMLAttributes ?? {};
+    const markOptions = (attrs) => ({
+      ...Object.keys(attrs).length ? { HTMLAttributes: attrs } : {},
+      ...Object.keys(moveAttrs).length ? { moveHTMLAttributes: moveAttrs } : {}
+    });
+    const configured = (mark, attrs) => {
+      const options = markOptions(attrs);
+      return Object.keys(options).length ? mark.configure(options) : mark;
+    };
     return [
-      Object.keys(insertionAttrs).length ? TrackedInsertion.configure({ HTMLAttributes: insertionAttrs }) : TrackedInsertion,
-      Object.keys(deletionAttrs).length ? TrackedDeletion.configure({ HTMLAttributes: deletionAttrs }) : TrackedDeletion,
+      configured(TrackedInsertion, insertionAttrs),
+      configured(TrackedDeletion, deletionAttrs),
       Object.keys(formatAttrs).length ? TrackedFormatChange.configure({ HTMLAttributes: formatAttrs }) : TrackedFormatChange
     ];
   },
@@ -1472,9 +1645,9 @@ var TrackChanges = Extension.create({
     if (this.options.trackCodeBlocks) allowTrackingInCodeBlocks(this.editor.schema);
   },
   addCommands() {
-    const decide = (decision, id) => ({ state, tr, dispatch }) => {
+    const decide = (decision, id, onlyMoves = false) => ({ state, tr, dispatch }) => {
       const all = getTrackedChanges(state.doc);
-      const changes = id === null ? all : all.filter((c) => c.id === id);
+      const changes = id === null ? all : all.filter((c) => c.id === id && (!onlyMoves || c.type === "move"));
       if (changes.length === 0) return false;
       if (dispatch) {
         applyDecision(tr, changes, decision);
@@ -1511,11 +1684,22 @@ var TrackChanges = Extension.create({
         return true;
       },
       acceptChange: (id) => decide("accept", id),
+      acceptMove: (id) => decide("accept", id, true),
+      rejectMove: (id) => decide("reject", id, true),
       rejectChange: (id) => decide("reject", id),
       acceptAllChanges: () => decide("accept", null),
       rejectAllChanges: () => decide("reject", null),
       selectNextChange: () => select(1),
-      selectPreviousChange: () => select(-1)
+      selectPreviousChange: () => select(-1),
+      selectChange: (id) => ({ state, tr, dispatch }) => {
+        const change = getTrackedChanges(state.doc).find((c) => c.id === id);
+        if (!change) return false;
+        if (dispatch) {
+          const [anchor, head] = selectionRange(change);
+          tr.setSelection(TextSelection.create(tr.doc, anchor, head)).scrollIntoView();
+        }
+        return true;
+      }
     };
   },
   addProseMirrorPlugins() {
@@ -1526,6 +1710,8 @@ var TrackChanges = Extension.create({
     let editorView = null;
     let pending = null;
     let flushTimer = null;
+    let pendingMove = null;
+    const isMove = options.isMove ?? isMoveSized;
     const scheduleFlush = () => {
       if (flushTimer) clearTimeout(flushTimer);
       flushTimer = setTimeout(() => {
@@ -1556,7 +1742,10 @@ var TrackChanges = Extension.create({
         appendTransaction: (transactions, oldState, newState) => {
           const plugin = trackChangesPluginKey.getState(oldState);
           const tracking = !!plugin?.enabled;
-          if (!tracking && !pending) return null;
+          if (!tracking && !pending) {
+            if (transactions.some((t) => t.docChanged)) pendingMove = null;
+            return null;
+          }
           if (editorView?.composing && transactions.some((t) => t.docChanged)) {
             if (tracking) {
               if (!pending) pending = { oldState, transactions: [] };
@@ -1573,7 +1762,17 @@ var TrackChanges = Extension.create({
           }
           if (!tracking && trs === transactions) return null;
           const author = plugin?.author ?? options.author;
-          return trackTransactions(trs, fromState, newState, {
+          const userTransactions = trs.filter((t) => !shouldSkip(t));
+          let moves;
+          if (userTransactions.length) {
+            const uiEvent = userTransactions.length === 1 ? userTransactions[0].getMeta("uiEvent") : null;
+            const event = uiEvent === "cut" || uiEvent === "paste" || uiEvent === "drop" ? uiEvent : null;
+            if (options.trackMoves !== false) {
+              moves = { event, pending: event === "paste" ? pendingMove : null, isMove };
+            }
+            pendingMove = null;
+          }
+          const result = trackTransactions(trs, fromState, newState, {
             author,
             now: options.now,
             generateId: options.generateId,
@@ -1582,8 +1781,11 @@ var TrackChanges = Extension.create({
             format: options.trackFormatting !== false ? newState.schema.marks[FORMAT_CHANGE_MARK_NAME] : void 0,
             trackBlocks: options.trackBlocks !== false,
             ignoredMarks,
-            ignoredAttributes
+            ignoredAttributes,
+            moves
           });
+          if (moves?.cut) pendingMove = moves.cut;
+          return result;
         },
         props: {
           transformPasted: (slice, view) => acceptSlice(slice, view.state.schema),
@@ -1625,19 +1827,24 @@ export {
   DELETION_MARK_NAME,
   FORMAT_CHANGE_MARK_NAME,
   BLOCK_CHANGE_ATTRIBUTE,
+  MOVE_ID_ATTRIBUTE,
   TRACK_CHANGES_SKIP_META,
   TrackChangesStore,
   trackChangesPluginKey,
+  MOVE_TO_CLASS,
+  MOVE_FROM_CLASS,
   TrackedInsertion,
   TrackedDeletion,
   TrackedFormatChange,
   describeFormatChange,
   describeBlockChange,
+  trackedChangeLabel,
   getTrackedChanges,
   getTrackedChangeAt,
   isTrackChangesEnabled,
   getTrackChangesStore,
   resolveTrackedChanges,
+  isMoveSized,
   TrackChanges
 };
-//# sourceMappingURL=chunk-5S3Z4PPF.js.map
+//# sourceMappingURL=chunk-UAKDG62Z.js.map