@excalidraw/excalidraw 0.18.0-6d870b1c8 → 0.18.0-7876ee524

package/dist/dev/data/{image-WMAXQLTI.js → image-IWGLHPIX.js}

@@ -2,7 +2,7 @@ import {
   decodePngMetadata,
   encodePngMetadata,
   getTEXtChunk
-} from "../chunk-D5WIFFIO.js";
+} from "../chunk-CRKRRBMD.js";
 import "../chunk-CP5DND7P.js";
 import "../chunk-XDFCUUT6.js";
 export {
@@ -10,4 +10,4 @@ export {
   encodePngMetadata,
   getTEXtChunk
 };
-//# sourceMappingURL=image-WMAXQLTI.js.map
+//# sourceMappingURL=image-IWGLHPIX.js.map

package/dist/dev/index.js

@@ -69,7 +69,7 @@ import {
   serializeLibraryAsJSON,
   strokeEllipseWithRotation,
   strokeRectWithRotation
-} from "./chunk-D5WIFFIO.js";
+} from "./chunk-CRKRRBMD.js";
 import {
   define_import_meta_env_default
 } from "./chunk-CP5DND7P.js";
@@ -204,7 +204,7 @@ import {
   updateBoundElements as updateBoundElements3,
   getSuggestedBindingsForArrows,
   LinearElementEditor as LinearElementEditor12,
-  newElementWith as newElementWith10,
+  newElementWith as newElementWith11,
   newFrameElement as newFrameElement3,
   newFreeDrawElement,
   newEmbeddableElement,
@@ -319,7 +319,8 @@ import {
   CaptureUpdateAction as CaptureUpdateAction37,
   hitElementBoundingBox as hitElementBoundingBox2,
   isLineElement as isLineElement7,
-  isSimpleArrow
+  isSimpleArrow,
+  StoreDelta as StoreDelta2
 } from "@excalidraw/element";
 
 // actions/actionDeleteSelected.tsx
@@ -7805,7 +7806,11 @@ import {
   bindOrUnbindLinearElement,
   isBindingEnabled
 } from "@excalidraw/element/binding";
-import { isValidPolygon, LinearElementEditor as LinearElementEditor5 } from "@excalidraw/element";
+import {
+  isValidPolygon,
+  LinearElementEditor as LinearElementEditor5,
+  newElementWith as newElementWith4
+} from "@excalidraw/element";
 import {
   isBindingElement,
   isFreeDrawElement,
@@ -7850,7 +7855,14 @@ var actionFinalize = register({
       if (linearElementEditor !== appState.selectedLinearElement) {
         let newElements2 = elements;
         if (element2 && isInvisiblySmallElement(element2)) {
-          newElements2 = newElements2.filter((el) => el.id !== element2.id);
+          newElements2 = newElements2.map((el) => {
+            if (el.id === element2.id) {
+              return newElementWith4(el, {
+                isDeleted: true
+              });
+            }
+            return el;
+          });
         }
         return {
           elements: newElements2,
@@ -7883,7 +7895,12 @@ var actionFinalize = register({
           });
         }
         return {
-          elements: element2.points.length < 2 || isInvisiblySmallElement(element2) ? elements.filter((el) => el.id !== element2.id) : void 0,
+          elements: element2.points.length < 2 || isInvisiblySmallElement(element2) ? elements.map((el) => {
+            if (el.id === element2.id) {
+              return newElementWith4(el, { isDeleted: true });
+            }
+            return el;
+          }) : void 0,
           appState: {
             ...appState,
             cursorButton: "up",
@@ -7925,7 +7942,12 @@ var actionFinalize = register({
         }
       }
       if (element && isInvisiblySmallElement(element)) {
-        newElements = newElements.filter((el) => el.id !== element.id);
+        newElements = newElements.map((el) => {
+          if (el.id === element?.id) {
+            return newElementWith4(el, { isDeleted: true });
+          }
+          return el;
+        });
       }
       if (isLinearElement3(element) || isFreeDrawElement(element)) {
         const isLoop = isPathALoop(element.points, appState.zoom.value);
@@ -8937,7 +8959,7 @@ var exportCanvas = async (type, elements, appState, files, {
     let blob = canvasToBlob(tempCanvas);
     if (appState.exportEmbedScene) {
       blob = blob.then(
-        (blob2) => import("./data/image-WMAXQLTI.js").then(
+        (blob2) => import("./data/image-IWGLHPIX.js").then(
           ({ encodePngMetadata: encodePngMetadata2 }) => encodePngMetadata2({
             blob: blob2,
             metadata: serializeAsJSON(elements, appState, files, "local")
@@ -9278,7 +9300,7 @@ import {
   KEYS as KEYS16,
   getLineHeight as getLineHeight2
 } from "@excalidraw/common";
-import { newElementWith as newElementWith4 } from "@excalidraw/element";
+import { newElementWith as newElementWith5 } from "@excalidraw/element";
 import {
   hasBoundTextElement,
   canApplyRoundnessTypeToElement,
@@ -9349,7 +9371,7 @@ var actionPasteStyles = register({
           if (!elementStylesToCopyFrom) {
             return element;
           }
-          let newElement6 = newElementWith4(element, {
+          let newElement6 = newElementWith5(element, {
             backgroundColor: elementStylesToCopyFrom?.backgroundColor,
             strokeWidth: elementStylesToCopyFrom?.strokeWidth,
             strokeColor: elementStylesToCopyFrom?.strokeColor,
@@ -9365,7 +9387,7 @@ var actionPasteStyles = register({
           if (isTextElement3(newElement6)) {
             const fontSize = elementStylesToCopyFrom.fontSize || DEFAULT_FONT_SIZE3;
             const fontFamily = elementStylesToCopyFrom.fontFamily || DEFAULT_FONT_FAMILY3;
-            newElement6 = newElementWith4(newElement6, {
+            newElement6 = newElementWith5(newElement6, {
               fontSize,
               fontFamily,
               textAlign: elementStylesToCopyFrom.textAlign || DEFAULT_TEXT_ALIGN,
@@ -9380,13 +9402,13 @@ var actionPasteStyles = register({
             redrawTextBoundingBox2(newElement6, container, app.scene);
           }
           if (newElement6.type === "arrow" && isArrowElement2(elementStylesToCopyFrom)) {
-            newElement6 = newElementWith4(newElement6, {
+            newElement6 = newElementWith5(newElement6, {
               startArrowhead: elementStylesToCopyFrom.startArrowhead,
               endArrowhead: elementStylesToCopyFrom.endArrowhead
             });
           }
           if (isFrameLikeElement4(element)) {
-            newElement6 = newElementWith4(newElement6, {
+            newElement6 = newElementWith5(newElement6, {
               roundness: null,
               backgroundColor: "transparent"
             });
@@ -9480,7 +9502,7 @@ var actionShortcuts = register({
 
 // actions/actionGroup.tsx
 import { getNonDeletedElements as getNonDeletedElements9 } from "@excalidraw/element";
-import { newElementWith as newElementWith5 } from "@excalidraw/element";
+import { newElementWith as newElementWith6 } from "@excalidraw/element";
 import { isBoundToContainer as isBoundToContainer3 } from "@excalidraw/element";
 import {
   frameAndChildrenSelectedTogether,
@@ -9584,7 +9606,7 @@ var actionGroup = register({
       if (!selectElementIds.get(element.id)) {
         return element;
       }
-      return newElementWith5(element, {
+      return newElementWith6(element, {
         groupIds: addToGroup(
           element.groupIds,
           newGroupId,
@@ -9661,7 +9683,7 @@ var actionUngroup = register({
       if (nextGroupIds.length === element.groupIds.length) {
         return element;
       }
-      return newElementWith5(element, {
+      return newElementWith6(element, {
         groupIds: nextGroupIds
       });
     });
@@ -10460,7 +10482,7 @@ import {
   isBindingEnabled as isBindingEnabled2
 } from "@excalidraw/element";
 import { getCommonBoundingBox } from "@excalidraw/element";
-import { newElementWith as newElementWith6 } from "@excalidraw/element";
+import { newElementWith as newElementWith7 } from "@excalidraw/element";
 import { deepCopyElement as deepCopyElement3 } from "@excalidraw/element";
 import { resizeMultipleElements } from "@excalidraw/element";
 import {
@@ -10546,7 +10568,7 @@ var flipElements = (selectedElements, elementsMap, appState, flipDirection, app)
   )) {
     return selectedElements.map((element) => {
       const _element = element;
-      return newElementWith6(_element, {
+      return newElementWith7(_element, {
         startArrowhead: _element.endArrowhead,
         endArrowhead: _element.startArrowhead
       });
@@ -11617,7 +11639,7 @@ var actionLink = register({
 import { KEYS as KEYS29, arrayToMap as arrayToMap11, randomId as randomId4 } from "@excalidraw/common";
 import {
   elementsAreInSameGroup,
-  newElementWith as newElementWith7,
+  newElementWith as newElementWith8,
   selectGroupsFromGivenElements
 } from "@excalidraw/element";
 import { CaptureUpdateAction as CaptureUpdateAction25 } from "@excalidraw/element";
@@ -11678,7 +11700,7 @@ var actionToggleElementLock = register({
           (groupId) => !appState.lockedMultiSelections[groupId]
         );
       }
-      return newElementWith7(element, {
+      return newElementWith8(element, {
         locked: nextLockState,
         // do not recreate the array unncessarily
         groupIds: nextGroupIds.length !== element.groupIds.length ? nextGroupIds : element.groupIds
@@ -11727,7 +11749,7 @@ var actionUnlockAllElements = register({
         const nextGroupIds = element.groupIds.filter(
           (gid) => !appState.lockedMultiSelections[gid]
         );
-        return newElementWith7(element, {
+        return newElementWith8(element, {
           locked: false,
           groupIds: (
             // do not recreate the array unncessarily
@@ -12844,7 +12866,7 @@ var exportToCanvas2 = ({
     { elements, appState },
     null,
     null,
-    { deleteEmptyTextElements: true }
+    { deleteInvisibleElements: true }
   );
   const { exportBackground, viewBackgroundColor } = restoredAppState;
   return exportToCanvas(
@@ -12939,7 +12961,7 @@ var exportToSvg2 = async ({
     { elements, appState },
     null,
     null,
-    { deleteEmptyTextElements: true }
+    { deleteInvisibleElements: true }
   );
   const exportAppState = {
     ...restoredAppState,
@@ -18228,7 +18250,7 @@ var generateElbowArrowShape = (points, radius) => {
 };
 
 // ../element/src/mutateElement.ts
-var newElementWith8 = (element, updates, force = false) => {
+var newElementWith9 = (element, updates, force = false) => {
   let didChange = false;
   for (const key in updates) {
     const value = updates[key];
@@ -18357,7 +18379,7 @@ var actionTogglePolygon = register({
         if (!targetElementsMap.has(element.id) || !isLineElement4(element)) {
           return element;
         }
-        return newElementWith8(element, {
+        return newElementWith9(element, {
           backgroundColor: nextPolygonState ? element.backgroundColor : "transparent",
           ...toggleLinePolygonState3(element, nextPolygonState)
         });
@@ -18949,7 +18971,7 @@ var createRedoAction = (history) => ({
 
 // actions/actionTextAutoResize.ts
 import { getFontString as getFontString6 } from "@excalidraw/common";
-import { newElementWith as newElementWith9 } from "@excalidraw/element";
+import { newElementWith as newElementWith10 } from "@excalidraw/element";
 import { measureText as measureText4 } from "@excalidraw/element";
 import { isTextElement as isTextElement9 } from "@excalidraw/element";
 import { CaptureUpdateAction as CaptureUpdateAction34 } from "@excalidraw/element";
@@ -18973,7 +18995,7 @@ var actionTextAutoResize = register({
             getFontString6(element),
             element.lineHeight
           );
-          return newElementWith9(element, {
+          return newElementWith10(element, {
             autoResize: true,
             width: metrics.width,
             height: metrics.height,
@@ -31603,7 +31625,7 @@ var App = class _App extends React43.Component {
             this.updateScene({
               elements: this.scene.getElementsIncludingDeleted().map((el) => {
                 if (this.state.selectedElementIds[el.id]) {
-                  return newElementWith10(el, {
+                  return newElementWith11(el, {
                     [shouldUpdateStrokeColor ? "strokeColor" : "backgroundColor"]: color
                   });
                 }
@@ -31769,7 +31791,7 @@ var App = class _App extends React43.Component {
       }
       const scene = restore(initialData, null, null, {
         repairBindings: true,
-        deleteEmptyTextElements: true
+        deleteInvisibleElements: true
       });
       scene.appState = {
         ...scene.appState,
@@ -32091,7 +32113,7 @@ var App = class _App extends React43.Component {
     ));
     __publicField(this, "addElementsFromPasteOrLibrary", (opts) => {
       const elements = restoreElements(opts.elements, null, {
-        deleteEmptyTextElements: true
+        deleteInvisibleElements: true
       });
       const [minX, minY, maxX, maxY] = getCommonBounds12(elements);
       const elementsCenterX = distance2(minX, maxX) / 2;
@@ -32108,7 +32130,7 @@ var App = class _App extends React43.Component {
       const { duplicatedElements } = duplicateElements3({
         type: "everything",
         elements: elements.map((element) => {
-          return newElementWith10(element, {
+          return newElementWith11(element, {
             x: element.x + gridX - minX,
             y: element.y + gridY - minY
           });
@@ -32455,6 +32477,21 @@ var App = class _App extends React43.Component {
         }
       }
     ));
+    __publicField(this, "applyDeltas", (deltas, options) => {
+      if (!deltas.length) {
+        throw new Error("No deltas were passed in!");
+      }
+      const nextElements = new Map(
+        this.scene.getElementsMapIncludingDeleted()
+      );
+      const nextAppState = { ...this.state };
+      const [head, ...tail] = deltas;
+      const mainDelta = StoreDelta2.load(head);
+      for (const delta of tail) {
+        mainDelta.squash(delta);
+      }
+      return StoreDelta2.applyTo(mainDelta, nextElements, nextAppState, options);
+    });
     __publicField(this, "mutateElement", (element, updates, informMutation = true) => {
       return this.scene.mutateElement(element, updates, {
         informMutation,
@@ -33476,7 +33513,7 @@ var App = class _App extends React43.Component {
     __publicField(this, "getTopLayerFrameAtSceneCoords", (sceneCoords) => {
       const elementsMap = this.scene.getNonDeletedElementsMap();
       const frames = this.scene.getNonDeletedFramesLikes().filter(
-        (frame) => isCursorInFrame(sceneCoords, frame, elementsMap)
+        (frame) => !frame.locked && isCursorInFrame(sceneCoords, frame, elementsMap)
       );
       return frames.length ? frames[frames.length - 1] : null;
     });
@@ -34875,7 +34912,7 @@ var App = class _App extends React43.Component {
       const elements = this.scene.getElementsIncludingDeleted().map((ele) => {
         if (this.elementsPendingErasure.has(ele.id) || ele.frameId && this.elementsPendingErasure.has(ele.frameId) || isBoundToContainer8(ele) && this.elementsPendingErasure.has(ele.containerId)) {
           didChange = true;
-          return newElementWith10(ele, { isDeleted: true });
+          return newElementWith11(ele, { isDeleted: true });
         }
         return ele;
       });
@@ -34984,7 +35021,7 @@ var App = class _App extends React43.Component {
      */
     __publicField(this, "getLatestInitializedImageElement", (imagePlaceholder, fileId) => {
       const latestImageElement = this.scene.getElement(imagePlaceholder.id) ?? imagePlaceholder;
-      return newElementWith10(
+      return newElementWith11(
         latestImageElement,
         {
           fileId
@@ -35105,7 +35142,7 @@ var App = class _App extends React43.Component {
         this.scene.replaceAllElements(
           elements.map((element) => {
             if (isInitializedImageElement3(element) && erroredFiles.has(element.fileId)) {
-              return newElementWith10(element, {
+              return newElementWith11(element, {
                 status: "error"
               });
             }
@@ -35849,6 +35886,7 @@ var App = class _App extends React43.Component {
     if (excalidrawAPI) {
       const api = {
         updateScene: this.updateScene,
+        applyDeltas: this.applyDeltas,
         mutateElement: this.mutateElement,
         updateLibrary: this.library.updateLibrary,
         addFiles: this.addFiles,
@@ -37142,7 +37180,7 @@ var App = class _App extends React43.Component {
         // Not sure why we include deleted elements as well hence using deleted elements map
         ...this.scene.getElementsIncludingDeleted().map((_element) => {
           if (_element.id === element.id && isTextElement19(_element)) {
-            return newElementWith10(_element, {
+            return newElementWith11(_element, {
               originalText: nextOriginalText,
               isDeleted: isDeleted ?? _element.isDeleted,
               // returns (wrapped) text and new dimensions
@@ -37954,7 +37992,7 @@ var App = class _App extends React43.Component {
               if (idsOfElementsToDuplicate.has(el.id)) {
                 const origEl = pointerDownState.originalElements.get(el.id);
                 if (origEl) {
-                  return newElementWith10(el, {
+                  return newElementWith11(el, {
                     x: origEl.x,
                     y: origEl.y
                   });
@@ -39405,7 +39443,7 @@ import {
 } from "@excalidraw/common";
 import {
   mutateElement as mutateElement2,
-  newElementWith as newElementWith11,
+  newElementWith as newElementWith12,
   bumpVersion
 } from "@excalidraw/element";
 import { CaptureUpdateAction as CaptureUpdateAction38 } from "@excalidraw/element";
@@ -39656,7 +39694,7 @@ export {
   loadSceneOrLibraryFromBlob,
   mergeLibraryItems,
   mutateElement2 as mutateElement,
-  newElementWith11 as newElementWith,
+  newElementWith12 as newElementWith,
   normalizeLink4 as normalizeLink,
   parseLibraryTokensFromUrl,
   reconcileElements,