@excalidraw/element 0.18.0-39ce38a0d-200a6bd94 → 0.18.0-508de2f3a

package/dist/dev/index.js

@@ -6619,7 +6619,7 @@ var mutateElement = (element, elementsMap, updates, options) => {
       didChange = true;
     }
   }
-  if (!didChange) {
+  if (!didChange && !options?.force) {
     return element;
   }
   if (typeof updates.height !== "undefined" || typeof updates.width !== "undefined" || typeof fileId != "undefined" || typeof points !== "undefined") {
@@ -13533,10 +13533,12 @@ var StoreDelta = class {
    */
   static load({
     id,
-    elements: { added, removed, updated }
+    elements: { added, removed, updated },
+    appState: { delta: appStateDelta }
   }) {
     const elements = ElementsDelta.create(added, removed, updated);
-    return new this(id, elements, AppStateDelta.empty());
+    const appState = AppStateDelta.create(appStateDelta);
+    return new this(id, elements, appState);
   }
   /**
    * Inverse store delta, creates new instance of `StoreDelta`.
@@ -13547,9 +13549,7 @@ var StoreDelta = class {
   /**
    * Apply the delta to the passed elements and appState, does not modify the snapshot.
    */
-  static applyTo(delta, elements, appState, options = {
-    excludedProperties: /* @__PURE__ */ new Set()
-  }) {
+  static applyTo(delta, elements, appState, options) {
     const [nextElements, elementsContainVisibleChange] = delta.elements.applyTo(
       elements,
       StoreSnapshot.empty().elements,
@@ -13815,14 +13815,13 @@ var getDefaultObservedAppState = () => {
     viewBackgroundColor: COLOR_PALETTE2.white,
     selectedElementIds: {},
     selectedGroupIds: {},
-    activeLinearElement: null,
+    selectedLinearElement: null,
     croppingElementId: null,
     activeLockedId: null,
     lockedMultiSelections: {}
   };
 };
 var getObservedAppState = (appState) => {
-  const selectedLinearElement = appState.selectedLinearElement;
   const observedAppState = {
     name: appState.name,
     editingGroupId: appState.editingGroupId,
@@ -13832,10 +13831,10 @@ var getObservedAppState = (appState) => {
     croppingElementId: appState.croppingElementId,
     activeLockedId: appState.activeLockedId,
     lockedMultiSelections: appState.lockedMultiSelections,
-    activeLinearElement: selectedLinearElement ? {
-      id: selectedLinearElement.elementId,
-      isEditing: !!selectedLinearElement.isEditing
-    } : appState.activeLinearElement ?? null
+    selectedLinearElement: appState.selectedLinearElement ? {
+      elementId: appState.selectedLinearElement.elementId,
+      isEditing: !!appState.selectedLinearElement.isEditing
+    } : null
   };
   Reflect.defineProperty(observedAppState, hiddenObservedAppStateProp, {
     value: true,
@@ -14399,9 +14398,9 @@ var Scene = class {
   getFramesIncludingDeleted() {
     return this.frames;
   }
-  constructor(elements = null) {
+  constructor(elements = null, options) {
     if (elements) {
-      this.replaceAllElements(elements);
+      this.replaceAllElements(elements, options);
     }
   }
   getSelectedElements(opts) {
@@ -14466,10 +14465,12 @@ var Scene = class {
     }
     return didChange;
   }
-  replaceAllElements(nextElements) {
+  replaceAllElements(nextElements, options) {
     const _nextElements = toArray(nextElements);
     const nextFrameLikes = [];
-    validateIndicesThrottled(_nextElements);
+    if (!options?.skipValidation) {
+      validateIndicesThrottled(_nextElements);
+    }
     this.elements = syncInvalidIndices2(_nextElements);
     this.elementsMap.clear();
     this.elements.forEach((element) => {
@@ -14872,6 +14873,9 @@ var AppStateDelta = class _AppStateDelta {
   constructor(delta) {
     this.delta = delta;
   }
+  static create(delta) {
+    return new _AppStateDelta(delta);
+  }
   static calculate(prevAppState, nextAppState) {
     const delta = Delta.calculate(
       prevAppState,
@@ -14900,38 +14904,38 @@ var AppStateDelta = class _AppStateDelta {
   applyTo(appState, nextElements) {
     try {
       const {
-        selectedElementIds: removedSelectedElementIds = {},
-        selectedGroupIds: removedSelectedGroupIds = {}
+        selectedElementIds: deletedSelectedElementIds = {},
+        selectedGroupIds: deletedSelectedGroupIds = {}
       } = this.delta.deleted;
       const {
-        selectedElementIds: addedSelectedElementIds = {},
-        selectedGroupIds: addedSelectedGroupIds = {},
-        activeLinearElement,
+        selectedElementIds: insertedSelectedElementIds = {},
+        selectedGroupIds: insertedSelectedGroupIds = {},
+        selectedLinearElement: insertedSelectedLinearElement,
         ...directlyApplicablePartial
       } = this.delta.inserted;
       const mergedSelectedElementIds = Delta.mergeObjects(
         appState.selectedElementIds,
-        addedSelectedElementIds,
-        removedSelectedElementIds
+        insertedSelectedElementIds,
+        deletedSelectedElementIds
       );
       const mergedSelectedGroupIds = Delta.mergeObjects(
         appState.selectedGroupIds,
-        addedSelectedGroupIds,
-        removedSelectedGroupIds
+        insertedSelectedGroupIds,
+        deletedSelectedGroupIds
       );
-      const selectedLinearElement = activeLinearElement && nextElements.has(activeLinearElement.id) ? new LinearElementEditor(
+      const selectedLinearElement = insertedSelectedLinearElement && nextElements.has(insertedSelectedLinearElement.elementId) ? new LinearElementEditor(
         nextElements.get(
-          activeLinearElement.id
+          insertedSelectedLinearElement.elementId
         ),
         nextElements,
-        activeLinearElement.isEditing
+        insertedSelectedLinearElement.isEditing
       ) : null;
       const nextAppState = {
         ...appState,
         ...directlyApplicablePartial,
         selectedElementIds: mergedSelectedElementIds,
         selectedGroupIds: mergedSelectedGroupIds,
-        selectedLinearElement: typeof activeLinearElement !== "undefined" ? selectedLinearElement : appState.selectedLinearElement
+        selectedLinearElement: typeof insertedSelectedLinearElement !== "undefined" ? selectedLinearElement : appState.selectedLinearElement
       };
       const constainsVisibleChanges = this.filterInvisibleChanges(
         appState,
@@ -15021,9 +15025,8 @@ var AppStateDelta = class _AppStateDelta {
               nextAppState[key] = null;
             }
             break;
-          case "activeLinearElement":
-            const appStateKey = _AppStateDelta.convertToAppStateKey(key);
-            const nextLinearElement = nextAppState[appStateKey];
+          case "selectedLinearElement":
+            const nextLinearElement = nextAppState[key];
             if (!nextLinearElement) {
               visibleDifferenceFlag.value = true;
             } else {
@@ -15031,7 +15034,7 @@ var AppStateDelta = class _AppStateDelta {
               if (element && !element.isDeleted) {
                 visibleDifferenceFlag.value = true;
               } else {
-                nextAppState[appStateKey] = null;
+                nextAppState[key] = null;
               }
             }
             break;
@@ -15060,12 +15063,6 @@ var AppStateDelta = class _AppStateDelta {
     }
     return visibleDifferenceFlag.value;
   }
-  static convertToAppStateKey(key) {
-    switch (key) {
-      case "activeLinearElement":
-        return "selectedLinearElement";
-    }
-  }
   static filterSelectedElements(selectedElementIds, elements, visibleDifferenceFlag) {
     const ids = Object.keys(selectedElementIds);
     if (!ids.length) {
@@ -15104,7 +15101,7 @@ var AppStateDelta = class _AppStateDelta {
       editingGroupId,
       selectedGroupIds,
       selectedElementIds,
-      activeLinearElement,
+      selectedLinearElement,
       croppingElementId,
       lockedMultiSelections,
       activeLockedId,
@@ -15258,7 +15255,7 @@ var ElementsDelta = class _ElementsDelta {
     for (const prevElement of prevElements.values()) {
       const nextElement = nextElements.get(prevElement.id);
       if (!nextElement) {
-        const deleted = { ...prevElement, isDeleted: false };
+        const deleted = { ...prevElement };
         const inserted = {
           isDeleted: true,
           version: prevElement.version + 1,
@@ -15269,7 +15266,9 @@ var ElementsDelta = class _ElementsDelta {
           inserted,
           _ElementsDelta.stripIrrelevantProps
         );
-        removed[prevElement.id] = delta;
+        if (!prevElement.isDeleted) {
+          removed[prevElement.id] = delta;
+        }
       }
     }
     for (const nextElement of nextElements.values()) {
@@ -15281,15 +15280,16 @@ var ElementsDelta = class _ElementsDelta {
           versionNonce: randomInteger4()
         };
         const inserted = {
-          ...nextElement,
-          isDeleted: false
+          ...nextElement
         };
         const delta = Delta.create(
           deleted,
           inserted,
           _ElementsDelta.stripIrrelevantProps
         );
-        added[nextElement.id] = delta;
+        if (!nextElement.isDeleted) {
+          added[nextElement.id] = delta;
+        }
         continue;
       }
       if (prevElement.versionNonce !== nextElement.versionNonce) {
@@ -15310,7 +15310,11 @@ var ElementsDelta = class _ElementsDelta {
           }
           continue;
         }
-        if (!Delta.isEmpty(delta)) {
+        const strippedDeleted = _ElementsDelta.stripVersionProps(delta.deleted);
+        const strippedInserted = _ElementsDelta.stripVersionProps(
+          delta.inserted
+        );
+        if (Delta.isInnerDifferent(strippedDeleted, strippedInserted, true)) {
           updated[nextElement.id] = delta;
         }
       }
@@ -15388,7 +15392,13 @@ var ElementsDelta = class _ElementsDelta {
         } else {
           latestDelta = delta;
         }
-        if (Delta.isInnerDifferent(latestDelta.deleted, latestDelta.inserted)) {
+        const strippedDeleted = _ElementsDelta.stripVersionProps(
+          latestDelta.deleted
+        );
+        const strippedInserted = _ElementsDelta.stripVersionProps(
+          latestDelta.inserted
+        );
+        if (Delta.isInnerDifferent(strippedDeleted, strippedInserted)) {
           modifiedDeltas[id] = latestDelta;
         }
       }
@@ -15402,9 +15412,7 @@ var ElementsDelta = class _ElementsDelta {
       // redistribute the deltas as `isDeleted` could have been updated
     });
   }
-  applyTo(elements, snapshot = StoreSnapshot.empty().elements, options = {
-    excludedProperties: /* @__PURE__ */ new Set()
-  }) {
+  applyTo(elements, snapshot = StoreSnapshot.empty().elements, options) {
     let nextElements = new Map(elements);
     let changedElements;
     const flags = {
@@ -15415,8 +15423,8 @@ var ElementsDelta = class _ElementsDelta {
       const applyDeltas = _ElementsDelta.createApplier(
         nextElements,
         snapshot,
-        options,
-        flags
+        flags,
+        options
       );
       const addedElements = applyDeltas(this.added);
       const removedElements = applyDeltas(this.removed);
@@ -15441,9 +15449,9 @@ var ElementsDelta = class _ElementsDelta {
         changedElements,
         flags
       );
-      const tempScene = new Scene(nextElements);
-      _ElementsDelta.redrawTextBoundingBoxes(tempScene, changedElements);
-      _ElementsDelta.redrawBoundArrows(tempScene, changedElements);
+      if (!options?.skipRedraw) {
+        _ElementsDelta.redrawElements(nextElements, changedElements);
+      }
     } catch (e) {
       console.error(
         `Couldn't mutate elements after applying elements change`,
@@ -15484,7 +15492,7 @@ var ElementsDelta = class _ElementsDelta {
     }
     return this;
   }
-  static createApplier = (nextElements, snapshot, options, flags) => (deltas) => {
+  static createApplier = (nextElements, snapshot, flags, options) => (deltas) => {
     const getElement = _ElementsDelta.createGetter(
       nextElements,
       snapshot,
@@ -15496,8 +15504,8 @@ var ElementsDelta = class _ElementsDelta {
         const newElement2 = _ElementsDelta.applyDelta(
           element,
           delta,
-          options,
-          flags
+          flags,
+          options
         );
         nextElements.set(newElement2.id, newElement2);
         acc.set(newElement2.id, newElement2);
@@ -15525,13 +15533,13 @@ var ElementsDelta = class _ElementsDelta {
     }
     return element;
   };
-  static applyDelta(element, delta, options, flags) {
+  static applyDelta(element, delta, flags, options) {
     const directlyApplicablePartial = {};
     for (const key of Object.keys(delta.inserted)) {
       if (key === "boundElements") {
         continue;
       }
-      if (options.excludedProperties.has(key)) {
+      if (options?.excludedProperties?.has(key)) {
         continue;
       }
       const value = delta.inserted[key];
@@ -15559,7 +15567,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.
@@ -15591,17 +15599,20 @@ var ElementsDelta = class _ElementsDelta {
       if (!nextElement) {
         return;
       }
+      const prevElement = prevElements.get(element.id);
       let affectedElement;
-      if (prevElements.get(element.id) === nextElement) {
+      if (prevElement === nextElement) {
         affectedElement = newElementWith(
           nextElement,
-          updates
+          updates,
+          true
         );
       } else {
         affectedElement = mutateElement(
           nextElement,
           nextElements,
-          updates
+          updates,
+          { force: true }
         );
       }
       nextAffectedElements.set(affectedElement.id, affectedElement);
@@ -15665,6 +15676,20 @@ var ElementsDelta = class _ElementsDelta {
     );
     BindableElement.rebindAffected(nextElements, nextElement(), updater);
   }
+  static redrawElements(nextElements, changedElements) {
+    try {
+      const tempScene = new Scene(nextElements, { skipValidation: true });
+      _ElementsDelta.redrawTextBoundingBoxes(tempScene, changedElements);
+      _ElementsDelta.redrawBoundArrows(tempScene, changedElements);
+    } catch (e) {
+      console.error(`Couldn't redraw elements`, e);
+      if (isTestEnv8() || isDevEnv7()) {
+        throw e;
+      }
+    } finally {
+      return nextElements;
+    }
+  }
   static redrawTextBoundingBoxes(scene, changed) {
     const elements = scene.getNonDeletedElementsMap();
     const boxesToRedraw = /* @__PURE__ */ new Map();
@@ -15753,6 +15778,10 @@ var ElementsDelta = class _ElementsDelta {
     const { id, updated, ...strippedPartial } = partial;
     return strippedPartial;
   }
+  static stripVersionProps(partial) {
+    const { version, versionNonce, ...strippedPartial } = partial;
+    return strippedPartial;
+  }
 };
 
 // src/distribute.ts