@excalidraw/element 0.18.0-dda3affcb-8fc71066d → 0.18.0-de715913e

package/dist/dev/index.js

@@ -13540,6 +13540,14 @@ var StoreDelta = class {
     const appState = AppStateDelta.create(appStateDelta);
     return new this(id, elements, appState);
   }
+  /**
+   * Squash the passed delta into the current instance.
+   */
+  squash(delta) {
+    this.elements.squash(delta.elements);
+    this.appState.squash(delta.appState);
+    return this;
+  }
   /**
    * Inverse store delta, creates new instance of `StoreDelta`.
    */
@@ -14643,10 +14651,10 @@ var Delta = class _Delta {
   /**
    * Merges two deltas into a new one.
    */
-  static merge(delta1, delta2) {
+  static merge(delta1, delta2, delta3) {
     return _Delta.create(
-      { ...delta1.deleted, ...delta2.deleted },
-      { ...delta1.inserted, ...delta2.inserted }
+      { ...delta1.deleted, ...delta2.deleted, ...delta3?.deleted ?? {} },
+      { ...delta1.inserted, ...delta2.inserted, ...delta3?.inserted ?? {} }
     );
   }
   /**
@@ -14654,7 +14662,7 @@ var Delta = class _Delta {
    */
   static mergeObjects(prev, added, removed) {
     const cloned = { ...prev };
-    for (const key of Object.keys(removed)) {
+    for (const key of Object.keys(removed ?? {})) {
       delete cloned[key];
     }
     return { ...cloned, ...added };
@@ -14898,7 +14906,33 @@ var AppStateDelta = class _AppStateDelta {
     return new _AppStateDelta(inversedDelta);
   }
   squash(delta) {
-    this.delta = Delta.merge(this.delta, delta.delta);
+    const mergedDeletedSelectedElementIds = Delta.mergeObjects(
+      this.delta.deleted.selectedElementIds ?? {},
+      delta.delta.deleted.selectedElementIds ?? {}
+    );
+    const mergedInsertedSelectedElementIds = Delta.mergeObjects(
+      this.delta.inserted.selectedElementIds ?? {},
+      delta.delta.inserted.selectedElementIds ?? {}
+    );
+    const mergedInsertedSelectedGroupIds = Delta.mergeObjects(
+      this.delta.inserted.selectedGroupIds ?? {},
+      delta.delta.inserted.selectedGroupIds ?? {}
+    );
+    const mergedDeletedSelectedGroupIds = Delta.mergeObjects(
+      this.delta.deleted.selectedGroupIds ?? {},
+      delta.delta.deleted.selectedGroupIds ?? {}
+    );
+    const mergedDelta = Delta.create(
+      {
+        selectedElementIds: mergedDeletedSelectedElementIds,
+        selectedGroupIds: mergedDeletedSelectedGroupIds
+      },
+      {
+        selectedElementIds: mergedInsertedSelectedElementIds,
+        selectedGroupIds: mergedInsertedSelectedGroupIds
+      }
+    );
+    this.delta = Delta.merge(this.delta, delta.delta, mergedDelta);
     return this;
   }
   applyTo(appState, nextElements) {
@@ -15417,10 +15451,12 @@ var ElementsDelta = class _ElementsDelta {
     let changedElements;
     const flags = {
       containsVisibleDifference: false,
-      containsZindexDifference: false
+      containsZindexDifference: false,
+      applyDirection: void 0
     };
     try {
       const applyDeltas = _ElementsDelta.createApplier(
+        elements,
         nextElements,
         snapshot,
         flags,
@@ -15429,7 +15465,11 @@ var ElementsDelta = class _ElementsDelta {
       const addedElements = applyDeltas(this.added);
       const removedElements = applyDeltas(this.removed);
       const updatedElements = applyDeltas(this.updated);
-      const affectedElements = this.resolveConflicts(elements, nextElements);
+      const affectedElements = this.resolveConflicts(
+        elements,
+        nextElements,
+        flags.applyDirection
+      );
       changedElements = new Map([
         ...addedElements,
         ...removedElements,
@@ -15449,9 +15489,7 @@ var ElementsDelta = class _ElementsDelta {
         changedElements,
         flags
       );
-      if (!options?.skipRedraw) {
-        _ElementsDelta.redrawElements(nextElements, changedElements);
-      }
+      _ElementsDelta.redrawElements(nextElements, changedElements);
     } catch (e) {
       console.error(
         `Couldn't mutate elements after applying elements change`,
@@ -15466,12 +15504,35 @@ var ElementsDelta = class _ElementsDelta {
   }
   squash(delta) {
     const { added, removed, updated } = delta;
+    function mergeBoundElements(prevDelta, nextDelta) {
+      const mergedDeletedBoundElements = Delta.mergeArrays(
+        prevDelta.deleted.boundElements ?? [],
+        nextDelta.deleted.boundElements ?? [],
+        void 0,
+        (x) => x.id
+      ) ?? [];
+      const mergedInsertedBoundElements = Delta.mergeArrays(
+        prevDelta.inserted.boundElements ?? [],
+        nextDelta.inserted.boundElements ?? [],
+        void 0,
+        (x) => x.id
+      ) ?? [];
+      return Delta.create(
+        {
+          boundElements: mergedDeletedBoundElements
+        },
+        {
+          boundElements: mergedInsertedBoundElements
+        }
+      );
+    }
     for (const [id, nextDelta] of Object.entries(added)) {
       const prevDelta = this.added[id];
       if (!prevDelta) {
         this.added[id] = nextDelta;
       } else {
-        this.added[id] = Delta.merge(prevDelta, nextDelta);
+        const mergedDelta = mergeBoundElements(prevDelta, nextDelta);
+        this.added[id] = Delta.merge(prevDelta, nextDelta, mergedDelta);
       }
     }
     for (const [id, nextDelta] of Object.entries(removed)) {
@@ -15479,7 +15540,8 @@ var ElementsDelta = class _ElementsDelta {
       if (!prevDelta) {
         this.removed[id] = nextDelta;
       } else {
-        this.removed[id] = Delta.merge(prevDelta, nextDelta);
+        const mergedDelta = mergeBoundElements(prevDelta, nextDelta);
+        this.removed[id] = Delta.merge(prevDelta, nextDelta, mergedDelta);
       }
     }
     for (const [id, nextDelta] of Object.entries(updated)) {
@@ -15487,12 +15549,13 @@ var ElementsDelta = class _ElementsDelta {
       if (!prevDelta) {
         this.updated[id] = nextDelta;
       } else {
-        this.updated[id] = Delta.merge(prevDelta, nextDelta);
+        const mergedDelta = mergeBoundElements(prevDelta, nextDelta);
+        this.updated[id] = Delta.merge(prevDelta, nextDelta, mergedDelta);
       }
     }
     return this;
   }
-  static createApplier = (nextElements, snapshot, flags, options) => (deltas) => {
+  static createApplier = (prevElements, nextElements, snapshot, flags, options) => (deltas) => {
     const getElement = _ElementsDelta.createGetter(
       nextElements,
       snapshot,
@@ -15501,14 +15564,20 @@ var ElementsDelta = class _ElementsDelta {
     return Object.entries(deltas).reduce((acc, [id, delta]) => {
       const element = getElement(id, delta.inserted);
       if (element) {
-        const newElement2 = _ElementsDelta.applyDelta(
+        const nextElement = _ElementsDelta.applyDelta(
           element,
           delta,
           flags,
           options
         );
-        nextElements.set(newElement2.id, newElement2);
-        acc.set(newElement2.id, newElement2);
+        nextElements.set(nextElement.id, nextElement);
+        acc.set(nextElement.id, nextElement);
+        if (!flags.applyDirection) {
+          const prevElement = prevElements.get(id);
+          if (prevElement) {
+            flags.applyDirection = prevElement.version > nextElement.version ? "backward" : "forward";
+          }
+        }
       }
       return acc;
     }, /* @__PURE__ */ new Map());
@@ -15567,7 +15636,7 @@ var ElementsDelta = class _ElementsDelta {
     if (!flags.containsZindexDifference) {
       flags.containsZindexDifference = delta.deleted.index !== delta.inserted.index;
     }
-    return newElementWith(element, directlyApplicablePartial);
+    return newElementWith(element, directlyApplicablePartial, true);
   }
   /**
    * Check for visible changes regardless of whether they were removed, added or updated.
@@ -15592,7 +15661,7 @@ var ElementsDelta = class _ElementsDelta {
    *
    * @returns all elements affected by the conflict resolution
    */
-  resolveConflicts(prevElements, nextElements) {
+  resolveConflicts(prevElements, nextElements, applyDirection = "forward") {
     const nextAffectedElements = /* @__PURE__ */ new Map();
     const updater = (element, updates) => {
       const nextElement = nextElements.get(element.id);
@@ -15600,18 +15669,24 @@ var ElementsDelta = class _ElementsDelta {
         return;
       }
       const prevElement = prevElements.get(element.id);
+      const nextVersion = applyDirection === "forward" ? nextElement.version + 1 : nextElement.version - 1;
+      const elementUpdates = updates;
       let affectedElement;
       if (prevElement === nextElement) {
         affectedElement = newElementWith(
           nextElement,
-          updates
+          {
+            ...elementUpdates,
+            version: nextVersion
+          },
+          true
         );
       } else {
-        affectedElement = mutateElement(
-          nextElement,
-          nextElements,
-          updates
-        );
+        affectedElement = mutateElement(nextElement, nextElements, {
+          ...elementUpdates,
+          // don't modify the version further, if it's already different
+          version: prevElement?.version !== nextElement.version ? nextElement.version : nextVersion
+        });
       }
       nextAffectedElements.set(affectedElement.id, affectedElement);
       nextElements.set(affectedElement.id, affectedElement);