@nous-excalidraw/excalidraw 0.18.3 → 0.18.4-beta.2

package/dist/dev/{chunk-GDIPPJNS.js → chunk-2C5KXBJQ.js}

@@ -1,7 +1,7 @@
 // <define:import.meta.env>
-var define_import_meta_env_default = { MODE: "development", VITE_APP_BACKEND_V2_GET_URL: "https://json-dev.excalidraw.com/api/v2/", VITE_APP_BACKEND_V2_POST_URL: "https://json-dev.excalidraw.com/api/v2/post/", VITE_APP_LIBRARY_URL: "https://libraries.excalidraw.com", VITE_APP_LIBRARY_BACKEND: "https://us-central1-excalidraw-room-persistence.cloudfunctions.net/libraries", VITE_APP_WS_SERVER_URL: "http://localhost:3002", VITE_APP_PLUS_LP: "https://plus.excalidraw.com", VITE_APP_PLUS_APP: "http://localhost:3000", VITE_APP_AI_BACKEND: "http://localhost:3016", VITE_APP_FIREBASE_CONFIG: '{"apiKey":"AIzaSyCMkxA60XIW8KbqMYL7edC4qT5l4qHX2h8","authDomain":"excalidraw-oss-dev.firebaseapp.com","projectId":"excalidraw-oss-dev","storageBucket":"excalidraw-oss-dev.appspot.com","messagingSenderId":"664559512677","appId":"1:664559512677:web:a385181f2928d328a7aa8c"}', VITE_APP_DEV_DISABLE_LIVE_RELOAD: "", VITE_APP_ENABLE_TRACKING: "true", FAST_REFRESH: "false", VITE_APP_PORT: "3001", VITE_APP_DEBUG_ENABLE_TEXT_CONTAINER_BOUNDING_BOX: "", VITE_APP_COLLAPSE_OVERLAY: "true", VITE_APP_ENABLE_ESLINT: "true", VITE_APP_ENABLE_PWA: "false", VITE_APP_PLUS_EXPORT_PUBLIC_KEY: "MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAm2g5T+Rub6Kbf1Mf57t0\n7r2zeHuVg4dla3r5ryXMswtzz6x767octl6oLThn33mQsPSy3GKglFZoCTXJR4ij\nba8SxB04sL/N8eRrKja7TFWjCVtRwTTfyy771NYYNFVJclkxHyE5qw4m27crHF1y\nUNWEjuqNMi/lwAErS9fFa2oJlWyT8U7zzv/5kQREkxZI6y9v0AF3qcbsy2731FnD\ns9ChJvOUW9toIab2gsIdrKW8ZNpu084ZFVKb6LNjvIXI1Se4oMTHeszXzNptzlot\nkdxxjOoaQMAyfljFSot1F1FlU6MQlag7UnFGvFjRHN1JI5q4K+n3a67DX+TMyRqS\nHQIDAQAB", VITE_APP_DISABLE_PREVENT_UNLOAD: "", PKG_NAME: "@nous-excalidraw/excalidraw", PKG_VERSION: "0.18.2-beta.1", DEV: true };
+var define_import_meta_env_default = { MODE: "development", VITE_APP_BACKEND_V2_GET_URL: "https://json-dev.excalidraw.com/api/v2/", VITE_APP_BACKEND_V2_POST_URL: "https://json-dev.excalidraw.com/api/v2/post/", VITE_APP_LIBRARY_URL: "https://libraries.excalidraw.com", VITE_APP_LIBRARY_BACKEND: "https://us-central1-excalidraw-room-persistence.cloudfunctions.net/libraries", VITE_APP_WS_SERVER_URL: "http://localhost:3002", VITE_APP_PLUS_LP: "https://plus.excalidraw.com", VITE_APP_PLUS_APP: "http://localhost:3000", VITE_APP_AI_BACKEND: "http://localhost:3016", VITE_APP_FIREBASE_CONFIG: '{"apiKey":"AIzaSyCMkxA60XIW8KbqMYL7edC4qT5l4qHX2h8","authDomain":"excalidraw-oss-dev.firebaseapp.com","projectId":"excalidraw-oss-dev","storageBucket":"excalidraw-oss-dev.appspot.com","messagingSenderId":"664559512677","appId":"1:664559512677:web:a385181f2928d328a7aa8c"}', VITE_APP_DEV_DISABLE_LIVE_RELOAD: "", VITE_APP_ENABLE_TRACKING: "true", FAST_REFRESH: "false", VITE_APP_PORT: "3001", VITE_APP_DEBUG_ENABLE_TEXT_CONTAINER_BOUNDING_BOX: "", VITE_APP_COLLAPSE_OVERLAY: "true", VITE_APP_ENABLE_ESLINT: "true", VITE_APP_ENABLE_PWA: "false", VITE_APP_PLUS_EXPORT_PUBLIC_KEY: "MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAm2g5T+Rub6Kbf1Mf57t0\n7r2zeHuVg4dla3r5ryXMswtzz6x767octl6oLThn33mQsPSy3GKglFZoCTXJR4ij\nba8SxB04sL/N8eRrKja7TFWjCVtRwTTfyy771NYYNFVJclkxHyE5qw4m27crHF1y\nUNWEjuqNMi/lwAErS9fFa2oJlWyT8U7zzv/5kQREkxZI6y9v0AF3qcbsy2731FnD\ns9ChJvOUW9toIab2gsIdrKW8ZNpu084ZFVKb6LNjvIXI1Se4oMTHeszXzNptzlot\nkdxxjOoaQMAyfljFSot1F1FlU6MQlag7UnFGvFjRHN1JI5q4K+n3a67DX+TMyRqS\nHQIDAQAB", VITE_APP_DISABLE_PREVENT_UNLOAD: "", PKG_NAME: "@nous-excalidraw/excalidraw", PKG_VERSION: "0.18.4-beta.1", DEV: true };
 
 export {
   define_import_meta_env_default
 };
-//# sourceMappingURL=chunk-GDIPPJNS.js.map
+//# sourceMappingURL=chunk-2C5KXBJQ.js.map

package/dist/dev/{chunk-4Q2BPT5H.js → chunk-SAWRJ2AG.js}

@@ -1,6 +1,6 @@
 import {
   define_import_meta_env_default
-} from "./chunk-GDIPPJNS.js";
+} from "./chunk-2C5KXBJQ.js";
 import {
   __publicField
 } from "./chunk-XDFCUUT6.js";
@@ -5085,7 +5085,7 @@ var parseFileContents = async (blob) => {
   let contents;
   if (blob.type === MIME_TYPES6.png) {
     try {
-      return await (await import("./data/image-X4CDE7NB.js")).decodePngMetadata(blob);
+      return await (await import("./data/image-JEK4DDYJ.js")).decodePngMetadata(blob);
     } catch (error) {
       if (error.message === "INVALID") {
         throw new ImageSceneDataError(
@@ -5519,4 +5519,4 @@ export {
   createFile,
   normalizeFile
 };
-//# sourceMappingURL=chunk-4Q2BPT5H.js.map
+//# sourceMappingURL=chunk-SAWRJ2AG.js.map

package/dist/dev/components/TTDDialog/{CodeMirrorEditor-R36AGSC4.js → CodeMirrorEditor-I72JGFZW.js}

@@ -1,4 +1,4 @@
-import "../../chunk-GDIPPJNS.js";
+import "../../chunk-2C5KXBJQ.js";
 import "../../chunk-XDFCUUT6.js";
 
 // components/TTDDialog/CodeMirrorEditor.tsx
@@ -256,4 +256,4 @@ var CodeMirrorEditor_default = CodeMirrorEditor;
 export {
   CodeMirrorEditor_default as default
 };
-//# sourceMappingURL=CodeMirrorEditor-R36AGSC4.js.map
+//# sourceMappingURL=CodeMirrorEditor-I72JGFZW.js.map

package/dist/dev/data/{image-X4CDE7NB.js → image-JEK4DDYJ.js}

@@ -2,12 +2,12 @@ import {
   decodePngMetadata,
   encodePngMetadata,
   getTEXtChunk
-} from "../chunk-4Q2BPT5H.js";
-import "../chunk-GDIPPJNS.js";
+} from "../chunk-SAWRJ2AG.js";
+import "../chunk-2C5KXBJQ.js";
 import "../chunk-XDFCUUT6.js";
 export {
   decodePngMetadata,
   encodePngMetadata,
   getTEXtChunk
 };
-//# sourceMappingURL=image-X4CDE7NB.js.map
+//# sourceMappingURL=image-JEK4DDYJ.js.map

package/dist/dev/index.js

@@ -65,10 +65,10 @@ import {
   serializeAsJSON,
   serializeLibraryAsJSON,
   strokeRectWithRotation_simple
-} from "./chunk-4Q2BPT5H.js";
+} from "./chunk-SAWRJ2AG.js";
 import {
   define_import_meta_env_default
-} from "./chunk-GDIPPJNS.js";
+} from "./chunk-2C5KXBJQ.js";
 import {
   en_default
 } from "./chunk-4JOINNOK.js";
@@ -142,7 +142,8 @@ import {
   TOUCH_CTX_MENU_TIMEOUT,
   VERTICAL_ALIGN as VERTICAL_ALIGN5,
   YOUTUBE_STATES,
-  ZOOM_STEP as ZOOM_STEP2,
+  getInteractiveZoomStep as getInteractiveZoomStep2,
+  INITIAL_CANVAS_ZOOM,
   POINTER_EVENTS,
   TOOL_TYPE as TOOL_TYPE3,
   supportsResizeObserver as supportsResizeObserver2,
@@ -7878,6 +7879,8 @@ import {
   MIN_ZOOM,
   THEME as THEME5,
   ZOOM_STEP,
+  getInteractiveZoomStep,
+  getDisplayedZoomValue,
   updateActiveTool as updateActiveTool2,
   CODES as CODES2,
   KEYS as KEYS12
@@ -8140,6 +8143,7 @@ var actionZoomIn = register({
   icon: ZoomInIcon,
   trackEvent: { category: "canvas" },
   perform: (_elements, appState, _, app) => {
+    const displayedZoomValue = getDisplayedZoomValue(appState.zoom.value);
     return {
       appState: {
         ...appState,
@@ -8147,7 +8151,9 @@ var actionZoomIn = register({
           {
             viewportX: appState.width / 2 + appState.offsetLeft,
             viewportY: appState.height / 2 + appState.offsetTop,
-            nextZoom: getNormalizedZoom(appState.zoom.value + ZOOM_STEP)
+            nextZoom: getNormalizedZoom(
+              displayedZoomValue + getInteractiveZoomStep(appState.zoom.value, "in")
+            )
           },
           appState
         ),
@@ -8179,6 +8185,7 @@ var actionZoomOut = register({
   viewMode: true,
   trackEvent: { category: "canvas" },
   perform: (_elements, appState, _, app) => {
+    const displayedZoomValue = getDisplayedZoomValue(appState.zoom.value);
     return {
       appState: {
         ...appState,
@@ -8186,7 +8193,9 @@ var actionZoomOut = register({
           {
             viewportX: appState.width / 2 + appState.offsetLeft,
             viewportY: appState.height / 2 + appState.offsetTop,
-            nextZoom: getNormalizedZoom(appState.zoom.value - ZOOM_STEP)
+            nextZoom: getNormalizedZoom(
+              displayedZoomValue - getInteractiveZoomStep(appState.zoom.value, "out")
+            )
           },
           appState
         ),
@@ -9630,7 +9639,7 @@ var exportCanvas = async (type, elements, appState, files, {
     let blob = canvasToBlob(tempCanvas);
     if (appState.exportEmbedScene) {
       blob = blob.then(
-        (blob2) => import("./data/image-X4CDE7NB.js").then(
+        (blob2) => import("./data/image-JEK4DDYJ.js").then(
           ({ encodePngMetadata: encodePngMetadata2 }) => encodePngMetadata2({
             blob: blob2,
             metadata: serializeAsJSON(elements, appState, files, "local")
@@ -17924,11 +17933,20 @@ var ShapesSwitcher = ({
 var ZoomActions = ({
   renderAction,
   zoom
-}) => /* @__PURE__ */ jsx76(Stack_default.Col, { gap: 1, className: CLASSES5.ZOOM_ACTIONS, children: /* @__PURE__ */ jsxs43(Stack_default.Row, { align: "center", children: [
-  renderAction("zoomOut"),
-  renderAction("resetZoom"),
-  renderAction("zoomIn")
-] }) });
+}) => /* @__PURE__ */ jsx76(
+  "div",
+  {
+    className: CLASSES5.ZOOM_ACTIONS,
+    onPointerDown: (event) => event.stopPropagation(),
+    onClick: (event) => event.stopPropagation(),
+    onDoubleClick: (event) => event.stopPropagation(),
+    children: /* @__PURE__ */ jsx76(Stack_default.Col, { gap: 1, children: /* @__PURE__ */ jsxs43(Stack_default.Row, { align: "center", children: [
+      renderAction("zoomOut"),
+      renderAction("resetZoom"),
+      renderAction("zoomIn")
+    ] }) })
+  }
+);
 var UndoRedoActions = ({
   renderAction,
   className
@@ -28481,7 +28499,7 @@ var TTDDialogInput = ({
         setShowSpinner(true);
       }
     }, SPINNER_DELAY_MS);
-    import("./components/TTDDialog/CodeMirrorEditor-R36AGSC4.js").then((mod) => {
+    import("./components/TTDDialog/CodeMirrorEditor-I72JGFZW.js").then((mod) => {
       if (!cancelled) {
         setEditorState({ type: "ready", component: mod.default });
       }
@@ -38128,6 +38146,37 @@ var App = class _App extends React46.Component {
           })
         };
       }
+      const initialZoomValue = getNormalizedZoom(INITIAL_CANVAS_ZOOM);
+      const nonDeletedRestoredElements = restoredElements.filter(
+        (element) => !element.isDeleted
+      );
+      if (nonDeletedRestoredElements.length) {
+        const { appState: fittedAppState } = zoomToFit({
+          targetElements: nonDeletedRestoredElements,
+          appState: {
+            ...restoredAppState,
+            width: this.state.width,
+            height: this.state.height,
+            offsetTop: this.state.offsetTop,
+            offsetLeft: this.state.offsetLeft,
+            zoom: { value: initialZoomValue }
+          },
+          fitToViewport: false,
+          maxZoom: initialZoomValue,
+          canvasOffsets: this.getEditorUIOffsets()
+        });
+        restoredAppState = {
+          ...restoredAppState,
+          scrollX: fittedAppState.scrollX,
+          scrollY: fittedAppState.scrollY,
+          zoom: fittedAppState.zoom
+        };
+      } else {
+        restoredAppState = {
+          ...restoredAppState,
+          zoom: { value: initialZoomValue }
+        };
+      }
       this.resetStore();
       this.resetHistory();
       this.syncActionResult({
@@ -39679,6 +39728,21 @@ var App = class _App extends React46.Component {
         event,
         this.state
       );
+      const hitElement = this.getElementAtPosition(sceneX, sceneY);
+      if (hitElement && (isImageElement9(hitElement) || isFrameLikeElement15(hitElement) || isEmbeddableElement4(hitElement))) {
+        this.scrollToContent(hitElement, {
+          animate: true,
+          duration: 500,
+          fitToViewport: true,
+          viewportZoomFactor: 0.6,
+          minZoom: this.state.zoom.value + getInteractiveZoomStep2(this.state.zoom.value, "in"),
+          canvasOffsets: this.getEditorUIOffsets()
+        });
+        return;
+      }
+      if (hitElement) {
+        return;
+      }
       if (selectedElements.length === 1 && isLinearElement12(selectedElements[0])) {
         const selectedLinearElement = selectedElements[0];
         if ((event[KEYS55.CTRL_OR_CMD] && isSimpleArrow(selectedLinearElement) || isLineElement8(selectedLinearElement)) && (!this.state.selectedLinearElement?.isEditing || this.state.selectedLinearElement.elementId !== selectedLinearElement.id)) {
@@ -39739,25 +39803,11 @@ var App = class _App extends React46.Component {
           return;
         }
       }
-      if (selectedElements.length === 1 && isImageElement9(selectedElements[0])) {
-        this.startImageCropping(selectedElements[0]);
-        return;
-      }
-      if (selectedElements.length === 1 && isFrameLikeElement15(selectedElements[0])) {
-        this.scrollToContent(selectedElements[0], {
-          animate: true,
-          duration: 500,
-          viewportZoomFactor: 0.6,
-          fitToViewport: true,
-          canvasOffsets: this.getEditorUIOffsets()
-        });
-        return;
-      }
       resetCursor(this.interactiveCanvas);
       const selectedGroupIds = getSelectedGroupIds4(this.state);
       if (selectedGroupIds.length > 0) {
-        const hitElement = this.getElementAtPosition(sceneX, sceneY);
-        const selectedGroupId = hitElement && getSelectedGroupIdForElement(hitElement, this.state.selectedGroupIds);
+        const hitElement2 = this.getElementAtPosition(sceneX, sceneY);
+        const selectedGroupId = hitElement2 && getSelectedGroupIdForElement(hitElement2, this.state.selectedGroupIds);
         if (selectedGroupId) {
           this.store.scheduleCapture();
           this.setState((prevState) => ({
@@ -39765,7 +39815,7 @@ var App = class _App extends React46.Component {
             ...selectGroupsForSelectedElements7(
               {
                 editingGroupId: selectedGroupId,
-                selectedElementIds: { [hitElement.id]: true }
+                selectedElementIds: { [hitElement2.id]: true }
               },
               this.scene.getNonDeletedElements(),
               prevState,
@@ -39777,10 +39827,10 @@ var App = class _App extends React46.Component {
       }
       resetCursor(this.interactiveCanvas);
       if (!event[KEYS55.CTRL_OR_CMD] && !this.state.viewModeEnabled) {
-        const hitElement = this.getElementAtPosition(sceneX, sceneY);
-        if (isIframeLikeElement2(hitElement)) {
+        const hitElement2 = this.getElementAtPosition(sceneX, sceneY);
+        if (isIframeLikeElement2(hitElement2)) {
           this.setState({
-            activeEmbeddable: { element: hitElement, state: "active" }
+            activeEmbeddable: { element: hitElement2, state: "active" }
           });
           return;
         }
@@ -42510,7 +42560,10 @@ var App = class _App extends React46.Component {
         const { deltaX, deltaY } = event;
         if (event.metaKey || event.ctrlKey) {
           const sign = Math.sign(deltaY);
-          const MAX_STEP = ZOOM_STEP2 * 100;
+          const MAX_STEP = getInteractiveZoomStep2(
+            this.state.zoom.value,
+            sign > 0 ? "out" : "in"
+          ) * 100;
           const absDelta = Math.abs(deltaY);
           let delta = deltaY;
           if (absDelta > MAX_STEP) {