feat: experiment with a diff shift locking behavior

.github/workflows/autorelease-excalidraw.yml

@@ -24,4 +24,4 @@ jobs:
       - name: Auto release
         run: |
           yarn add @actions/core -W
-          yarn release --tag=next --non-interactive
+          yarn autorelease

.github/workflows/autorelease-preview.yml

@@ -0,0 +1,55 @@
+name: Auto release excalidraw preview
+on:
+  issue_comment:
+    types: [created, edited]
+
+jobs:
+  Auto-release-excalidraw-preview:
+    name: Auto release preview
+    if: github.event.comment.body == '@excalibot trigger release' && github.event.issue.pull_request
+    runs-on: ubuntu-latest
+    steps:
+      - name: React to release comment
+        uses: peter-evans/create-or-update-comment@v1
+        with:
+          token: ${{ secrets.PUSH_TRANSLATIONS_COVERAGE_PAT }}
+          comment-id: ${{ github.event.comment.id }}
+          reactions: "+1"
+      - name: Get PR SHA
+        id: sha
+        uses: actions/github-script@v4
+        with:
+          result-encoding: string
+          script: |
+            const { owner, repo, number } = context.issue;
+            const pr = await github.pulls.get({
+              owner,
+              repo,
+              pull_number: number,
+            });
+            return pr.data.head.sha
+      - uses: actions/checkout@v2
+        with:
+          ref: ${{ steps.sha.outputs.result }}
+          fetch-depth: 2
+      - name: Setup Node.js 18.x
+        uses: actions/setup-node@v2
+        with:
+          node-version: 18.x
+      - name: Set up publish access
+        run: |
+          npm config set //registry.npmjs.org/:_authToken ${NPM_TOKEN}
+        env:
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+      - name: Auto release preview
+        id: "autorelease"
+        run: |
+          yarn add @actions/core -W
+          yarn autorelease preview ${{ github.event.issue.number }}
+      - name: Post comment post release
+        if: always()
+        uses: peter-evans/create-or-update-comment@v1
+        with:
+          token: ${{ secrets.PUSH_TRANSLATIONS_COVERAGE_PAT }}
+          issue-number: ${{ github.event.issue.number }}
+          body: "@${{ github.event.comment.user.login }} ${{ steps.autorelease.outputs.result }}"

.github/workflows/playwright.yml

@@ -1,27 +0,0 @@
-name: Playwright Tests
-on:
-  push:
-    branches: [ main, master ]
-  pull_request:
-    branches: [ main, master ]
-jobs:
-  test:
-    timeout-minutes: 60
-    runs-on: ubuntu-latest
-    steps:
-    - uses: actions/checkout@v4
-    - uses: actions/setup-node@v4
-      with:
-        node-version: lts/*
-    - name: Install dependencies
-      run: npm install -g yarn && yarn
-    - name: Install Playwright Browsers
-      run: yarn playwright install --with-deps
-    - name: Run Playwright tests
-      run: yarn playwright test
-    - uses: actions/upload-artifact@v4
-      if: ${{ !cancelled() }}
-      with:
-        name: playwright-report
-        path: playwright-report/
-        retention-days: 30

.gitignore

@@ -27,9 +27,3 @@ dev-dist
 html
 meta*.json
 .claude
-
-# Playwright
-/test-results/
-/playwright-report/
-/blob-report/
-/playwright/.cache/

dev-docs/docs/@excalidraw/excalidraw/development.mdx

@@ -28,12 +28,32 @@ To start the example app using the `@excalidraw/excalidraw` package, follow the
 
 ## Releasing
 
+### Create a test release
+
+You can create a test release by posting the below comment in your pull request:
+
+```bash
+@excalibot trigger release
+```
+
+Once the version is released `@excalibot` will post a comment with the release version.
+
 ### Creating a production release
 
 To release the next stable version follow the below steps:
 
 ```bash
-yarn release --tag=latest --version=0.19.0
+yarn prerelease:excalidraw
 ```
 
-You will need to pass the `latest` tag with `version` for which you want to create the release. This will make the changes needed before publishing the packages into NPM, like updating dependencies of all `@excalidraw/*` packages, generating new entries in `CHANGELOG.md` and more.
+You need to pass the `version` for which you want to create the release. This will make the changes needed before making the release like updating `package.json`, `changelog` and more.
+
+The next step is to run the `release` script:
+
+```bash
+yarn release:excalidraw
+```
+
+This will publish the package.
+
+Right now there are two steps to create a production release but once this works fine these scripts will be combined and more automation will be done.

dev-docs/src/theme/ReactLiveScope/index.js

@@ -33,7 +33,6 @@ const ExcalidrawScope = {
   initialData,
   useI18n: ExcalidrawComp.useI18n,
   convertToExcalidrawElements: ExcalidrawComp.convertToExcalidrawElements,
-  CaptureUpdateAction: ExcalidrawComp.CaptureUpdateAction,
 };
 
 export default ExcalidrawScope;

examples/with-nextjs/package.json

@@ -3,8 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "build:packages": "yarn --cwd ../../ build:packages",
-    "build:workspace": "yarn build:packages && yarn copy:assets",
+    "build:workspace": "yarn workspace @excalidraw/excalidraw run build:esm && yarn copy:assets",
     "copy:assets": "cp -r ../../packages/excalidraw/dist/prod/fonts ./public",
     "dev": "yarn build:workspace && next dev -p 3005",
     "build": "yarn build:workspace && next build",

examples/with-script-in-browser/package.json

@@ -17,6 +17,6 @@
     "build": "vite build",
     "preview": "vite preview --port 5002",
     "build:preview": "yarn build && yarn preview",
-    "build:packages": "yarn --cwd ../../ build:packages"
+    "build:package": "yarn workspace @excalidraw/excalidraw run build:esm"
   }
 }

examples/with-script-in-browser/vercel.json

@@ -1,5 +1,5 @@
 {
   "outputDirectory": "dist",
   "installCommand": "yarn install",
-  "buildCommand": "yarn build:packages && yarn build"
+  "buildCommand": "yarn build:package && yarn build"
 }

excalidraw-app/App.tsx

@@ -74,7 +74,6 @@ import type {
 import type { ResolutionType } from "@excalidraw/common/utility-types";
 import type { ResolvablePromise } from "@excalidraw/common/utils";
 
-import "./record";
 import CustomStats from "./CustomStats";
 import {
   Provider,

excalidraw-app/components/DebugCanvas.tsx

@@ -9,7 +9,7 @@ import {
 } from "@excalidraw/excalidraw/renderer/helpers";
 import { type AppState } from "@excalidraw/excalidraw/types";
 import { throttleRAF } from "@excalidraw/common";
-import { useCallback } from "react";
+import { useCallback, useImperativeHandle, useRef } from "react";
 
 import {
   isLineSegment,
@@ -18,12 +18,10 @@ import {
 } from "@excalidraw/math";
 import { isCurve } from "@excalidraw/math/curve";
 
-import React from "react";
+import type { DebugElement } from "@excalidraw/excalidraw/visualdebug";
 
 import type { Curve } from "@excalidraw/math";
 
-import type { DebugElement } from "@excalidraw/utils/visualdebug";
-
 import { STORAGE_KEYS } from "../app_constants";
 
 const renderLine = (
@@ -115,6 +113,10 @@ const _debugRenderer = (
     scale,
   );
 
+  if (appState.height !== canvas.height || appState.width !== canvas.width) {
+    refresh();
+  }
+
   const context = bootstrapCanvas({
     canvas,
     scale,
@@ -312,29 +314,35 @@ export const DebugFooter = ({ onChange }: { onChange: () => void }) => {
 interface DebugCanvasProps {
   appState: AppState;
   scale: number;
+  ref?: React.Ref<HTMLCanvasElement>;
 }
 
-const DebugCanvas = React.forwardRef<HTMLCanvasElement, DebugCanvasProps>(
-  ({ appState, scale }, ref) => {
-    const { width, height } = appState;
+const DebugCanvas = ({ appState, scale, ref }: DebugCanvasProps) => {
+  const { width, height } = appState;
 
-    return (
-      <canvas
-        style={{
-          width,
-          height,
-          position: "absolute",
-          zIndex: 2,
-          pointerEvents: "none",
-        }}
-        width={width * scale}
-        height={height * scale}
-        ref={ref}
-      >
-        Debug Canvas
-      </canvas>
-    );
-  },
-);
+  const canvasRef = useRef<HTMLCanvasElement>(null);
+  useImperativeHandle<HTMLCanvasElement | null, HTMLCanvasElement | null>(
+    ref,
+    () => canvasRef.current,
+    [canvasRef],
+  );
+
+  return (
+    <canvas
+      style={{
+        width,
+        height,
+        position: "absolute",
+        zIndex: 2,
+        pointerEvents: "none",
+      }}
+      width={width * scale}
+      height={height * scale}
+      ref={canvasRef}
+    >
+      Debug Canvas
+    </canvas>
+  );
+};
 
 export default DebugCanvas;

excalidraw-app/data/firebase.ts

@@ -259,9 +259,7 @@ export const loadFromFirebase = async (
   }
   const storedScene = docSnap.data() as FirebaseStoredScene;
   const elements = getSyncableElements(
-    restoreElements(await decryptElements(storedScene, roomKey), null, {
-      deleteInvisibleElements: true,
-    }),
+    restoreElements(await decryptElements(storedScene, roomKey), null),
   );
 
   if (socket) {

excalidraw-app/data/index.ts

@@ -258,16 +258,11 @@ export const loadScene = async (
       await importFromBackend(id, privateKey),
       localDataState?.appState,
       localDataState?.elements,
-      {
-        repairBindings: true,
-        refreshDimensions: false,
-        deleteInvisibleElements: true,
-      },
+      { repairBindings: true, refreshDimensions: false },
     );
   } else {
     data = restore(localDataState || null, null, null, {
       repairBindings: true,
-      deleteInvisibleElements: true,
     });
   }
 

excalidraw-app/index.html

@@ -2,9 +2,7 @@
 <html lang="en">
   <head>
     <meta charset="utf-8" />
-    <title>
-      Free, collaborative whiteboard • Hand-drawn look & feel | Excalidraw
-    </title>
+    <title>Excalidraw | Hand-drawn look & feel • Collaborative • Secure</title>
     <meta
       name="viewport"
       content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover, shrink-to-fit=no"
@@ -16,7 +14,7 @@
     <!-- Primary Meta Tags -->
     <meta
       name="title"
-      content="Free, collaborative whiteboard • Hand-drawn look & feel | Excalidraw"
+      content="Excalidraw — Collaborative whiteboarding made easy"
     />
     <meta
       name="description"

excalidraw-app/package.json

@@ -46,7 +46,6 @@
     "build:version": "node ../scripts/build-version.js",
     "build": "yarn build:app && yarn build:version",
     "start": "yarn && vite",
-    "start:test": "yarn && vite --mode test",
     "start:production": "yarn build && yarn serve",
     "serve": "npx http-server build -a localhost -p 5001 -o",
     "build:preview": "yarn build && vite preview --port 5000"

excalidraw-app/record.ts

@@ -1,270 +0,0 @@
-import { isDevEnv } from "@excalidraw/common";
-
-declare global {
-  interface Window {
-    record: typeof Record;
-  }
-}
-
-export class Record {
-  private static recording: boolean = false;
-  private static events: string = "";
-  private static timestamp: number = 0;
-
-  public static get isRecording() {
-    return Record.recording;
-  }
-
-  private static header() {
-    Record.events += "  await page.addInitScript(() => {\n";
-    Record.events += "    Math.random = () => 0.42;\n\n";
-
-    // Capture LocalStorage, which is essential to re-establish state
-    for (let i = 0; i < localStorage.length; i++) {
-      const key = localStorage.key(i);
-      if (key != null) {
-        const value = JSON.stringify(localStorage.getItem(key));
-        Record.events += `    localStorage.getItem("${key}");\n`;
-        Record.events += `    localStorage.setItem("${key}", ${value});\n`;
-      }
-    }
-    Record.events += "  });\n";
-    Record.events += `  await page.setViewportSize({ width: ${window.innerWidth}, height: ${window.innerHeight} });\n`;
-    Record.events += `  await page.goto("http://localhost:3000");\n`;
-    Record.events += `  await page.waitForLoadState("load");\n`;
-  }
-
-  public static restart() {
-    if (!Record.recording) {
-      Record.start();
-      return;
-    }
-
-    Record.events += `});\n\n`;
-    Record.events += `test("${
-      Date.now() + Math.floor(Math.random() * Date.now()).toString(36)
-    }", async ({ page }) => {\n`;
-
-    Record.header();
-  }
-
-  public static start() {
-    Record.recording = true;
-
-    // Record header
-    this.header();
-
-    // Set up the events
-    Record.timestamp = performance.now();
-
-    window.addEventListener("mousemove", this.onMouseMove);
-    window.addEventListener("mousedown", this.onMouseDown);
-    window.addEventListener("mouseup", this.onMouseUp);
-    window.addEventListener("keydown", this.onKeyDown);
-    window.addEventListener("keyup", this.onKeyUp);
-  }
-
-  public static stop() {
-    window.removeEventListener("mousemove", this.onMouseMove);
-    window.removeEventListener("mousedown", this.onMouseDown);
-    window.removeEventListener("mouseup", this.onMouseUp);
-    window.removeEventListener("keydown", this.onKeyDown);
-    window.removeEventListener("keyup", this.onKeyUp);
-    Record.recording = false;
-  }
-
-  /// Displays a window as an absolutely positioned DIV with the generated
-  /// events within <pre> tags as formatted JSON, so it can be copied easily.
-  public static showGeneratedEvents() {
-    if (Record.recording) {
-      Record.stop();
-    }
-
-    const div = document.createElement("div");
-    div.style.position = "absolute";
-    div.style.top = "10px";
-    div.style.right = "10px";
-    div.style.left = "10px";
-    div.style.height = "60vh";
-    div.style.backgroundColor = "gray";
-    div.style.padding = "10px";
-    div.style.zIndex = "10000";
-
-    const pre = document.createElement("pre");
-
-    let textContent = `import { expect, test } from "@playwright/test";\n\n`;
-    textContent += `test("${
-      Date.now() + Math.floor(Math.random() * Date.now()).toString(36)
-    }", async ({ page }) => {\n`;
-    textContent += Record.events;
-    textContent += `});\n`;
-
-    pre.textContent = textContent;
-    //pre.textContent = Record.events;
-
-    pre.style.marginTop = "18px";
-    pre.style.maxHeight = "60vh";
-    pre.style.overflow = "auto";
-    div.appendChild(pre);
-
-    const copyBtn = document.createElement("button");
-    copyBtn.textContent = "Copy";
-    copyBtn.title = "Copy generated events to clipboard";
-    copyBtn.setAttribute("aria-label", "Copy generated events to clipboard");
-    copyBtn.style.position = "absolute";
-    copyBtn.style.top = "4px";
-    copyBtn.style.left = "4px";
-    copyBtn.style.border = "none";
-    copyBtn.style.background = "transparent";
-    copyBtn.style.fontSize = "12px";
-    copyBtn.style.lineHeight = "1";
-    copyBtn.style.cursor = "pointer";
-    copyBtn.style.padding = "4px 8px";
-    copyBtn.addEventListener("click", async () => {
-      const text = pre.textContent ?? "";
-      try {
-        if (navigator.clipboard && navigator.clipboard.writeText) {
-          await navigator.clipboard.writeText(text);
-        } else {
-          const ta = document.createElement("textarea");
-          ta.value = text;
-          document.body.appendChild(ta);
-          ta.select();
-          document.execCommand("copy");
-          document.body.removeChild(ta);
-        }
-        const orig = copyBtn.textContent;
-        copyBtn.textContent = "Copied";
-        setTimeout(() => (copyBtn.textContent = orig), 1000);
-      } catch {}
-    });
-    div.appendChild(copyBtn);
-
-    const closeBtn = document.createElement("button");
-    closeBtn.textContent = "×";
-    closeBtn.title = "Close";
-    closeBtn.style.position = "absolute";
-    closeBtn.style.top = "4px";
-    closeBtn.style.right = "4px";
-    closeBtn.style.border = "none";
-    closeBtn.style.background = "transparent";
-    closeBtn.style.fontSize = "18px";
-    closeBtn.style.lineHeight = "1";
-    closeBtn.style.cursor = "pointer";
-    closeBtn.addEventListener("click", () => {
-      // remove the dialog from DOM
-      if (div.parentNode) {
-        div.parentNode.removeChild(div);
-      }
-    });
-    div.appendChild(closeBtn);
-
-    document.body.appendChild(div);
-  }
-
-  private static onMouseMove(event: MouseEvent) {
-    if (
-      event.clientX < 0 ||
-      event.clientX > window.innerWidth ||
-      event.clientY < 0 ||
-      event.clientY > window.innerHeight
-    ) {
-      return;
-    }
-
-    const now = event.timeStamp || performance.now();
-    const delay = now - Record.timestamp;
-    Record.timestamp = now;
-
-    if (delay > 0) {
-      Record.events += `  await page.waitForTimeout(${delay});\n`;
-    }
-    Record.events += `  await page.mouse.move(${event.clientX}, ${event.clientY});\n`;
-  }
-
-  private static onMouseDown(event: MouseEvent) {
-    const now = event.timeStamp || performance.now();
-    const delay = now - Record.timestamp;
-    Record.timestamp = now;
-
-    if (delay > 0) {
-      Record.events += `  await page.waitForTimeout(${delay});\n`;
-    }
-    const button =
-      event.button === 0 ? "left" : event.button === 1 ? "middle" : "right";
-    Record.events += `  await page.mouse.down({ button: "${button}" });\n`;
-  }
-
-  private static onMouseUp(event: MouseEvent) {
-    const now = event.timeStamp || performance.now();
-    const delay = now - Record.timestamp;
-    Record.timestamp = now;
-
-    if (delay > 0) {
-      Record.events += `  await page.waitForTimeout(${delay});\n`;
-    }
-    const button =
-      event.button === 0 ? "left" : event.button === 1 ? "middle" : "right";
-    Record.events += `  await page.mouse.up({ button: "${button}" });\n`;
-
-    Record.events += "  await expect(page).toHaveScreenshot({\n";
-    Record.events += "    maxDiffPixels: 100,\n";
-    Record.events += "    maxDiffPixelRatio: 0.01,\n";
-    Record.events += "  });\n";
-  }
-
-  private static onKeyDown(event: KeyboardEvent) {
-    // Only record if the recording key is not pressed
-    if (event.key !== "F2") {
-      const now = event.timeStamp || performance.now();
-      const delay = now - Record.timestamp;
-      Record.timestamp = now;
-
-      if (delay > 0) {
-        Record.events += `  await page.waitForTimeout(${delay});\n`;
-      }
-      Record.events += `  await page.keyboard.down("${event.key}");\n`;
-    }
-  }
-
-  private static onKeyUp(event: KeyboardEvent) {
-    // Only record if the recording key is not pressed
-    if (event.key !== "F2") {
-      const now = event.timeStamp || performance.now();
-      const delay = now - Record.timestamp;
-      Record.timestamp = now;
-
-      if (delay > 0) {
-        Record.events += `  await page.waitForTimeout(${delay});\n`;
-      }
-      Record.events += `  await page.keyboard.up("${event.key}");\n`;
-
-      Record.events += "  await expect(page).toHaveScreenshot({\n";
-      Record.events += "    maxDiffPixels: 100,\n";
-      Record.events += "    maxDiffPixelRatio: 0.01,\n";
-      Record.events += "  });\n";
-    }
-  }
-}
-
-if (isDevEnv()) {
-  window.record = Record;
-
-  window.addEventListener("keyup", (event) => {
-    if (event.key === "F2") {
-      if (Record.isRecording) {
-        if (event.ctrlKey) {
-          console.info("Stopping Playwright recording");
-          Record.stop();
-        } else {
-          Record.restart();
-        }
-      } else {
-        console.info("Starting Playwright recording");
-        Record.start();
-      }
-    } else if (event.key === "Enter" && event.ctrlKey) {
-      Record.showGeneratedEvents();
-    }
-  });
-}

excalidraw-app/tests/regression/binding.spec.ts

@@ -1,716 +0,0 @@
-import { expect, test } from "@playwright/test";
-
-test("17562123239901g67cqde", async ({ page }) => {
-  await page.addInitScript(() => {
-    Math.random = () => 0.42;
-
-    localStorage.getItem("i18nextLng");
-    localStorage.setItem("i18nextLng", "en");
-    localStorage.getItem("excalidraw-collab");
-    localStorage.setItem("excalidraw-collab", '{"username":""}');
-    localStorage.getItem("excalidraw-debug");
-    localStorage.setItem("excalidraw-debug", '{"enabled":true}');
-    localStorage.getItem("excalidraw-theme");
-    localStorage.setItem("excalidraw-theme", "dark");
-    localStorage.getItem("version-files");
-    localStorage.setItem("version-files", "1756212319038");
-    localStorage.getItem("version-dataState");
-    localStorage.setItem("version-dataState", "1756212319038");
-    localStorage.getItem("excalidraw-state");
-    localStorage.setItem(
-      "excalidraw-state",
-      '{"showWelcomeScreen":true,"theme":"dark","currentChartType":"bar","currentItemBackgroundColor":"#a5d8ff","currentItemEndArrowhead":"arrow","currentItemFillStyle":"solid","currentItemFontFamily":5,"currentItemFontSize":20,"currentItemOpacity":100,"currentItemRoughness":2,"currentItemStartArrowhead":null,"currentItemStrokeColor":"#1e1e1e","currentItemRoundness":"round","currentItemArrowType":"round","currentItemStrokeStyle":"solid","currentItemStrokeWidth":2,"currentItemTextAlign":"left","cursorButton":"up","editingGroupId":null,"activeTool":{"type":"arrow","customType":null,"locked":false,"fromSelection":false,"lastActiveTool":null},"penMode":false,"penDetected":false,"exportBackground":true,"exportScale":1,"exportEmbedScene":false,"exportWithDarkMode":false,"gridSize":20,"gridStep":5,"gridModeEnabled":false,"defaultSidebarDockedPreference":false,"lastPointerDownWith":"mouse","name":"Untitled-2025-07-28-1603","openMenu":null,"openSidebar":null,"previousSelectedElementIds":{},"scrolledOutside":false,"scrollX":688.1079394457738,"scrollY":349.585883261872,"selectedElementIds":{},"selectedGroupIds":{},"shouldCacheIgnoreZoom":false,"stats":{"open":true,"panels":3},"viewBackgroundColor":"#ffffff","zenModeEnabled":false,"zoom":{"value":1.331666},"selectedLinearElement":null,"objectsSnapModeEnabled":false,"lockedMultiSelections":{}}',
-    );
-    localStorage.getItem("excalidraw");
-    localStorage.setItem(
-      "excalidraw",
-      '[{"id":"hJuTw4QcwTsFtadNNnkLj","type":"rectangle","x":-100,"y":-100,"width":200,"height":200,"angle":0,"strokeColor":"#1e1e1e","backgroundColor":"#a5d8ff","fillStyle":"solid","strokeWidth":2,"strokeStyle":"solid","roughness":1,"opacity":100,"groupIds":[],"frameId":null,"index":"a1","roundness":{"type":3},"seed":43277494,"version":839,"versionNonce":1923298088,"isDeleted":false,"boundElements":[{"id":"0xSZCPMN8RzKiJOpvGaKB","type":"arrow"}],"updated":1756212298830,"link":null,"locked":false},{"id":"qXw5KqKvAjHRr5uwPi9B-","type":"rectangle","x":-523.1841597523046,"y":-129.52451989693097,"width":200,"height":200,"angle":0,"strokeColor":"#1e1e1e","backgroundColor":"#a5d8ff","fillStyle":"solid","strokeWidth":2,"strokeStyle":"solid","roughness":1,"opacity":100,"groupIds":[],"frameId":null,"index":"a2","roundness":{"type":3},"seed":392633439,"version":963,"versionNonce":210394408,"isDeleted":false,"boundElements":[{"id":"0xSZCPMN8RzKiJOpvGaKB","type":"arrow"}],"updated":1756212298830,"link":null,"locked":false}]',
-    );
-  });
-  await page.setViewportSize({ width: 1280, height: 1001 });
-  await page.goto("http://localhost:3000");
-  await page.waitForLoadState("load");
-  await page.waitForTimeout(3.599999999627471);
-  await page.mouse.move(425, 390);
-  await page.waitForTimeout(9.900000000372529);
-  await page.mouse.move(424, 390);
-  await page.waitForTimeout(51.09999999962747);
-  await page.mouse.move(423, 390);
-  await page.waitForTimeout(1);
-  await page.mouse.move(423, 392);
-  await page.waitForTimeout(1);
-  await page.mouse.move(422, 392);
-  await page.waitForTimeout(2);
-  await page.mouse.move(420, 393);
-  await page.waitForTimeout(1);
-  await page.mouse.move(420, 395);
-  await page.waitForTimeout(1);
-  await page.mouse.move(418, 395);
-  await page.waitForTimeout(6);
-  await page.mouse.move(417, 396);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(416, 396);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(416, 397);
-  await page.waitForTimeout(1);
-  await page.mouse.move(414, 397);
-  await page.waitForTimeout(1);
-  await page.mouse.move(414, 399);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(413, 399);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(413, 401);
-  await page.waitForTimeout(1);
-  await page.mouse.move(413, 402);
-  await page.waitForTimeout(3);
-  await page.mouse.move(411, 402);
-  await page.waitForTimeout(3);
-  await page.mouse.move(411, 403);
-  await page.waitForTimeout(32);
-  await page.mouse.move(412, 403);
-  await page.waitForTimeout(3);
-  await page.mouse.move(412, 403);
-  await page.waitForTimeout(4);
-  await page.mouse.move(412, 402);
-  await page.waitForTimeout(1);
-  await page.mouse.move(413, 402);
-  await page.waitForTimeout(0.900000000372529);
-  await page.mouse.move(413, 400);
-  await page.waitForTimeout(1.099999999627471);
-  await page.mouse.move(415, 400);
-  await page.waitForTimeout(7);
-  await page.mouse.move(416, 400);
-  await page.waitForTimeout(71);
-  await page.mouse.move(417, 400);
-  await page.waitForTimeout(450);
-  await page.mouse.move(417, 399);
-  await page.waitForTimeout(6);
-  await page.mouse.move(418, 399);
-  await page.waitForTimeout(6.1000000005587935);
-  await page.mouse.move(419, 399);
-  await page.mouse.down({ button: "left" });
-  await page.waitForTimeout(11.899999999441206);
-  await page.mouse.move(420, 399);
-  await page.waitForTimeout(69);
-  await page.mouse.move(421, 399);
-  await page.waitForTimeout(13);
-  await page.mouse.move(422, 399);
-  await page.waitForTimeout(7.1000000005587935);
-  await page.mouse.move(423, 399);
-  await page.waitForTimeout(5.3999999994412065);
-  await page.mouse.move(425, 399);
-  await page.waitForTimeout(0.5);
-  await page.mouse.move(427, 401);
-  await page.waitForTimeout(4);
-  await page.mouse.move(428, 401);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(428, 403);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(430, 403);
-  await page.waitForTimeout(1);
-  await page.mouse.move(432, 403);
-  await page.waitForTimeout(1);
-  await page.mouse.move(432, 404);
-  await page.waitForTimeout(2.1000000005587935);
-  await page.mouse.move(433, 404);
-  await page.waitForTimeout(1.8999999994412065);
-  await page.mouse.move(434, 404);
-  await page.waitForTimeout(1);
-  await page.mouse.move(436, 406);
-  await page.waitForTimeout(3);
-  await page.mouse.move(437, 406);
-  await page.waitForTimeout(2);
-  await page.mouse.move(438, 407);
-  await page.waitForTimeout(1);
-  await page.mouse.move(440, 407);
-  await page.waitForTimeout(1);
-  await page.mouse.move(442, 407);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(443, 409);
-  await page.waitForTimeout(1);
-  await page.mouse.move(445, 409);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(447, 411);
-  await page.waitForTimeout(1);
-  await page.mouse.move(451, 411);
-  await page.waitForTimeout(1);
-  await page.mouse.move(455, 411);
-  await page.waitForTimeout(1);
-  await page.mouse.move(457, 413);
-  await page.waitForTimeout(1);
-  await page.mouse.move(459, 413);
-  await page.waitForTimeout(1);
-  await page.mouse.move(461, 415);
-  await page.waitForTimeout(1);
-  await page.mouse.move(463, 417);
-  await page.waitForTimeout(1);
-  await page.mouse.move(467, 419);
-  await page.waitForTimeout(1);
-  await page.mouse.move(469, 419);
-  await page.waitForTimeout(1);
-  await page.mouse.move(471, 420);
-  await page.waitForTimeout(1);
-  await page.mouse.move(473, 424);
-  await page.waitForTimeout(1);
-  await page.mouse.move(477, 424);
-  await page.waitForTimeout(1);
-  await page.mouse.move(477, 426);
-  await page.waitForTimeout(1);
-  await page.mouse.move(478, 426);
-  await page.waitForTimeout(1);
-  await page.mouse.move(482, 428);
-  await page.waitForTimeout(1);
-  await page.mouse.move(484, 430);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(486, 430);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(488, 430);
-  await page.waitForTimeout(1);
-  await page.mouse.move(488, 432);
-  await page.waitForTimeout(1);
-  await page.mouse.move(489, 432);
-  await page.waitForTimeout(1);
-  await page.mouse.move(491, 432);
-  await page.waitForTimeout(1);
-  await page.mouse.move(493, 434);
-  await page.waitForTimeout(1);
-  await page.mouse.move(495, 434);
-  await page.waitForTimeout(1);
-  await page.mouse.move(499, 436);
-  await page.waitForTimeout(1);
-  await page.mouse.move(501, 436);
-  await page.waitForTimeout(1);
-  await page.mouse.move(502, 436);
-  await page.waitForTimeout(1);
-  await page.mouse.move(504, 438);
-  await page.waitForTimeout(1);
-  await page.mouse.move(506, 440);
-  await page.waitForTimeout(1);
-  await page.mouse.move(508, 440);
-  await page.waitForTimeout(1);
-  await page.mouse.move(510, 442);
-  await page.waitForTimeout(1);
-  await page.mouse.move(512, 444);
-  await page.waitForTimeout(1);
-  await page.mouse.move(514, 444);
-  await page.waitForTimeout(2.1000000005587935);
-  await page.mouse.move(514, 445);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(515, 445);
-  await page.waitForTimeout(1);
-  await page.mouse.move(517, 445);
-  await page.waitForTimeout(1);
-  await page.mouse.move(517, 447);
-  await page.waitForTimeout(1);
-  await page.mouse.move(519, 448);
-  await page.waitForTimeout(1);
-  await page.mouse.move(521, 448);
-  await page.waitForTimeout(1);
-  await page.mouse.move(522, 450);
-  await page.waitForTimeout(2.1000000005587935);
-  await page.mouse.move(524, 450);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(525, 450);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(527, 450);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(529, 450);
-  await page.waitForTimeout(1);
-  await page.mouse.move(530, 450);
-  await page.waitForTimeout(3);
-  await page.mouse.move(532, 450);
-  await page.waitForTimeout(2);
-  await page.mouse.move(533, 451);
-  await page.waitForTimeout(6);
-  await page.mouse.move(534, 451);
-  await page.waitForTimeout(3.1000000005587935);
-  await page.mouse.move(535, 451);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(535, 453);
-  await page.waitForTimeout(1);
-  await page.mouse.move(537, 453);
-  await page.waitForTimeout(1);
-  await page.mouse.move(538, 453);
-  await page.waitForTimeout(3);
-  await page.mouse.move(540, 453);
-  await page.waitForTimeout(1);
-  await page.mouse.move(540, 454);
-  await page.waitForTimeout(2);
-  await page.mouse.move(541, 454);
-  await page.waitForTimeout(2);
-  await page.mouse.move(542, 454);
-  await page.waitForTimeout(2);
-  await page.mouse.move(543, 454);
-  await page.waitForTimeout(3);
-  await page.mouse.move(544, 454);
-  await page.waitForTimeout(1);
-  await page.mouse.move(544, 455);
-  await page.waitForTimeout(1);
-  await page.mouse.move(546, 455);
-  await page.waitForTimeout(2);
-  await page.mouse.move(547, 455);
-  await page.waitForTimeout(2.1000000005587935);
-  await page.mouse.move(548, 455);
-  await page.waitForTimeout(2);
-  await page.mouse.move(549, 455);
-  await page.waitForTimeout(1.8999999994412065);
-  await page.mouse.move(551, 455);
-  await page.waitForTimeout(1);
-  await page.mouse.move(552, 455);
-  await page.waitForTimeout(1);
-  await page.mouse.move(554, 455);
-  await page.waitForTimeout(1);
-  await page.mouse.move(555, 455);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(557, 455);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(559, 457);
-  await page.waitForTimeout(2);
-  await page.mouse.move(560, 457);
-  await page.waitForTimeout(1);
-  await page.mouse.move(562, 459);
-  await page.waitForTimeout(1);
-  await page.mouse.move(564, 459);
-  await page.waitForTimeout(1);
-  await page.mouse.move(566, 459);
-  await page.waitForTimeout(1);
-  await page.mouse.move(567, 459);
-  await page.waitForTimeout(1);
-  await page.mouse.move(569, 459);
-  await page.waitForTimeout(1);
-  await page.mouse.move(570, 459);
-  await page.waitForTimeout(3);
-  await page.mouse.move(574, 460);
-  await page.waitForTimeout(3);
-  await page.mouse.move(575, 460);
-  await page.waitForTimeout(1);
-  await page.mouse.move(575, 462);
-  await page.waitForTimeout(1);
-  await page.mouse.move(577, 464);
-  await page.waitForTimeout(1);
-  await page.mouse.move(578, 464);
-  await page.waitForTimeout(1);
-  await page.mouse.move(580, 464);
-  await page.waitForTimeout(1);
-  await page.mouse.move(582, 465);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(584, 465);
-  await page.waitForTimeout(1.8999999994412065);
-  await page.mouse.move(585, 465);
-  await page.waitForTimeout(3);
-  await page.mouse.move(586, 465);
-  await page.waitForTimeout(1);
-  await page.mouse.move(588, 467);
-  await page.waitForTimeout(1);
-  await page.mouse.move(590, 467);
-  await page.waitForTimeout(2);
-  await page.mouse.move(591, 467);
-  await page.waitForTimeout(3);
-  await page.mouse.move(591, 468);
-  await page.waitForTimeout(2);
-  await page.mouse.move(594, 468);
-  await page.waitForTimeout(1);
-  await page.mouse.move(595, 468);
-  await page.waitForTimeout(1);
-  await page.mouse.move(597, 468);
-  await page.waitForTimeout(2.7000000001862645);
-  await page.mouse.move(601, 470);
-  await page.waitForTimeout(1.400000000372529);
-  await page.mouse.move(602, 470);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(603, 470);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(605, 470);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(607, 470);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(608, 470);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(610, 470);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(612, 470);
-  await page.waitForTimeout(2.8999999994412065);
-  await page.mouse.move(613, 470);
-  await page.waitForTimeout(1.2000000001862645);
-  await page.mouse.move(613, 471);
-  await page.waitForTimeout(1.7999999998137355);
-  await page.mouse.move(614, 471);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(616, 473);
-  await page.waitForTimeout(1);
-  await page.mouse.move(618, 473);
-  await page.waitForTimeout(1.8999999994412065);
-  await page.mouse.move(621, 473);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(623, 473);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(625, 473);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(626, 473);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(628, 473);
-  await page.waitForTimeout(2);
-  await page.mouse.move(629, 473);
-  await page.waitForTimeout(1);
-  await page.mouse.move(631, 473);
-  await page.waitForTimeout(1);
-  await page.mouse.move(634, 475);
-  await page.waitForTimeout(2);
-  await page.mouse.move(636, 475);
-  await page.waitForTimeout(1);
-  await page.mouse.move(638, 475);
-  await page.waitForTimeout(2.1000000005587935);
-  await page.mouse.move(639, 475);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(640, 475);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(642, 475);
-  await page.waitForTimeout(1.8999999994412065);
-  await page.mouse.move(644, 475);
-  await page.waitForTimeout(1);
-  await page.mouse.move(647, 475);
-  await page.waitForTimeout(2.1000000005587935);
-  await page.mouse.move(649, 475);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(650, 475);
-  await page.waitForTimeout(2.1000000005587935);
-  await page.mouse.move(652, 475);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(653, 475);
-  await page.waitForTimeout(1);
-  await page.mouse.move(655, 475);
-  await page.waitForTimeout(2);
-  await page.mouse.move(656, 476);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(658, 476);
-  await page.waitForTimeout(2);
-  await page.mouse.move(659, 476);
-  await page.waitForTimeout(1.8999999994412065);
-  await page.mouse.move(660, 476);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(662, 476);
-  await page.waitForTimeout(2);
-  await page.mouse.move(663, 476);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(664, 476);
-  await page.waitForTimeout(1);
-  await page.mouse.move(666, 474);
-  await page.waitForTimeout(1);
-  await page.mouse.move(668, 474);
-  await page.waitForTimeout(1);
-  await page.mouse.move(670, 474);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(671, 474);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(673, 476);
-  await page.waitForTimeout(3);
-  await page.mouse.move(675, 476);
-  await page.waitForTimeout(1);
-  await page.mouse.move(678, 476);
-  await page.waitForTimeout(1);
-  await page.mouse.move(680, 476);
-  await page.waitForTimeout(1);
-  await page.mouse.move(682, 476);
-  await page.waitForTimeout(4);
-  await page.mouse.move(683, 476);
-  await page.waitForTimeout(1);
-  await page.mouse.move(684, 476);
-  await page.waitForTimeout(1);
-  await page.mouse.move(686, 476);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(690, 476);
-  await page.waitForTimeout(1);
-  await page.mouse.move(694, 478);
-  await page.waitForTimeout(1);
-  await page.mouse.move(696, 478);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(698, 478);
-  await page.waitForTimeout(1);
-  await page.mouse.move(699, 478);
-  await page.waitForTimeout(1);
-  await page.mouse.move(703, 478);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(705, 478);
-  await page.waitForTimeout(1);
-  await page.mouse.move(707, 478);
-  await page.waitForTimeout(2);
-  await page.mouse.move(708, 478);
-  await page.waitForTimeout(1.8999999994412065);
-  await page.mouse.move(711, 478);
-  await page.waitForTimeout(1);
-  await page.mouse.move(713, 478);
-  await page.waitForTimeout(1);
-  await page.mouse.move(714, 478);
-  await page.waitForTimeout(1);
-  await page.mouse.move(716, 478);
-  await page.waitForTimeout(2);
-  await page.mouse.move(717, 478);
-  await page.waitForTimeout(1);
-  await page.mouse.move(719, 478);
-  await page.waitForTimeout(2);
-  await page.mouse.move(722, 478);
-  await page.waitForTimeout(1);
-  await page.mouse.move(724, 478);
-  await page.waitForTimeout(2.1000000005587935);
-  await page.mouse.move(725, 478);
-  await page.waitForTimeout(1.8999999994412065);
-  await page.mouse.move(726, 478);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(727, 478);
-  await page.waitForTimeout(3);
-  await page.mouse.move(733, 480);
-  await page.waitForTimeout(2.8999999994412065);
-  await page.mouse.move(734, 480);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(735, 480);
-  await page.waitForTimeout(1);
-  await page.mouse.move(737, 480);
-  await page.waitForTimeout(1);
-  await page.mouse.move(739, 480);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(740, 480);
-  await page.waitForTimeout(1);
-  await page.mouse.move(742, 480);
-  await page.waitForTimeout(1);
-  await page.mouse.move(744, 480);
-  await page.waitForTimeout(1);
-  await page.mouse.move(744, 482);
-  await page.waitForTimeout(1);
-  await page.mouse.move(745, 482);
-  await page.waitForTimeout(2);
-  await page.mouse.move(747, 482);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(748, 482);
-  await page.waitForTimeout(4);
-  await page.mouse.move(749, 482);
-  await page.waitForTimeout(3);
-  await page.mouse.move(751, 482);
-  await page.waitForTimeout(1);
-  await page.mouse.move(753, 482);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(755, 482);
-  await page.waitForTimeout(1);
-  await page.mouse.move(758, 482);
-  await page.waitForTimeout(2.1000000005587935);
-  await page.mouse.move(760, 482);
-  await page.waitForTimeout(6);
-  await page.mouse.move(761, 483);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(763, 484);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(765, 484);
-  await page.waitForTimeout(2.8999999994412065);
-  await page.mouse.move(766, 485);
-  await page.waitForTimeout(2);
-  await page.mouse.move(767, 485);
-  await page.waitForTimeout(11);
-  await page.mouse.move(768, 485);
-  await page.waitForTimeout(12.100000000558794);
-  await page.mouse.move(769, 485);
-  await page.waitForTimeout(51.89999999944121);
-  await page.mouse.move(770, 485);
-  await page.waitForTimeout(9);
-  await page.mouse.move(771, 485);
-  await page.waitForTimeout(3.1000000005587935);
-  await page.mouse.move(772, 485);
-  await page.waitForTimeout(5);
-  await page.mouse.move(773, 485);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(774, 485);
-  await page.waitForTimeout(2);
-  await page.mouse.move(776, 487);
-  await page.waitForTimeout(4);
-  await page.mouse.move(777, 487);
-  await page.waitForTimeout(4.1000000005587935);
-  await page.mouse.move(778, 487);
-  await page.waitForTimeout(1.8999999994412065);
-  await page.mouse.move(779, 487);
-  await page.waitForTimeout(2.1000000005587935);
-  await page.mouse.move(780, 488);
-  await page.waitForTimeout(2.8999999994412065);
-  await page.mouse.move(781, 488);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(782, 488);
-  await page.waitForTimeout(1.8999999994412065);
-  await page.mouse.move(784, 488);
-  await page.waitForTimeout(3);
-  await page.mouse.move(785, 488);
-  await page.waitForTimeout(1);
-  await page.mouse.move(786, 488);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(788, 488);
-  await page.waitForTimeout(8.899999999441206);
-  await page.mouse.move(789, 488);
-  await page.waitForTimeout(3);
-  await page.mouse.move(790, 488);
-  await page.waitForTimeout(5);
-  await page.mouse.move(791, 488);
-  await page.waitForTimeout(4);
-  await page.mouse.move(792, 488);
-  await page.waitForTimeout(6.1000000005587935);
-  await page.mouse.move(793, 488);
-  await page.waitForTimeout(3.8999999994412065);
-  await page.mouse.move(793, 489);
-  await page.waitForTimeout(6);
-  await page.mouse.move(794, 489);
-  await page.waitForTimeout(4.1000000005587935);
-  await page.mouse.move(795, 489);
-  await page.waitForTimeout(7.599999999627471);
-  await page.mouse.move(796, 489);
-  await page.waitForTimeout(3.400000000372529);
-  await page.mouse.move(797, 489);
-  await page.waitForTimeout(3);
-  await page.mouse.move(798, 489);
-  await page.waitForTimeout(3);
-  await page.mouse.move(799, 489);
-  await page.waitForTimeout(2);
-  await page.mouse.move(800, 489);
-  await page.waitForTimeout(3);
-  await page.mouse.move(801, 489);
-  await page.waitForTimeout(2);
-  await page.mouse.move(802, 489);
-  await page.waitForTimeout(1.8999999994412065);
-  await page.mouse.move(803, 489);
-  await page.waitForTimeout(3);
-  await page.mouse.move(804, 489);
-  await page.waitForTimeout(2.1000000005587935);
-  await page.mouse.move(805, 489);
-  await page.waitForTimeout(5.8999999994412065);
-  await page.mouse.move(806, 490);
-  await page.waitForTimeout(3);
-  await page.mouse.move(807, 490);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(809, 490);
-  await page.waitForTimeout(1);
-  await page.mouse.move(810, 490);
-  await page.waitForTimeout(1);
-  await page.mouse.move(812, 490);
-  await page.waitForTimeout(1.8999999994412065);
-  await page.mouse.move(813, 490);
-  await page.waitForTimeout(1);
-  await page.mouse.move(815, 490);
-  await page.waitForTimeout(2);
-  await page.mouse.move(816, 492);
-  await page.waitForTimeout(1);
-  await page.mouse.move(818, 492);
-  await page.waitForTimeout(2.1000000005587935);
-  await page.mouse.move(819, 492);
-  await page.waitForTimeout(1);
-  await page.mouse.move(820, 492);
-  await page.waitForTimeout(1);
-  await page.mouse.move(822, 492);
-  await page.waitForTimeout(2);
-  await page.mouse.move(823, 492);
-  await page.waitForTimeout(3);
-  await page.mouse.move(825, 492);
-  await page.waitForTimeout(2.8999999994412065);
-  await page.mouse.move(826, 492);
-  await page.waitForTimeout(1.1000000005587935);
-  await page.mouse.move(827, 492);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(828, 492);
-  await page.waitForTimeout(3);
-  await page.mouse.move(830, 492);
-  await page.waitForTimeout(3);
-  await page.mouse.move(831, 492);
-  await page.waitForTimeout(2.1000000005587935);
-  await page.mouse.move(832, 492);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(833, 493);
-  await page.waitForTimeout(6.1000000005587935);
-  await page.mouse.move(835, 493);
-  await page.waitForTimeout(1);
-  await page.mouse.move(836, 493);
-  await page.waitForTimeout(1);
-  await page.mouse.move(838, 493);
-  await page.waitForTimeout(0.8999999994412065);
-  await page.mouse.move(839, 493);
-  await page.waitForTimeout(4.1000000005587935);
-  await page.mouse.move(841, 493);
-  await page.waitForTimeout(2);
-  await page.mouse.move(842, 493);
-  await page.waitForTimeout(3.8999999994412065);
-  await page.mouse.move(843, 493);
-  await page.waitForTimeout(2);
-  await page.mouse.move(843, 492);
-  await page.waitForTimeout(4.1000000005587935);
-  await page.mouse.move(844, 492);
-  await page.waitForTimeout(4);
-  await page.mouse.move(844, 493);
-  await page.waitForTimeout(1);
-  await page.mouse.move(845, 493);
-  await page.waitForTimeout(3);
-  await page.mouse.move(846, 493);
-  await page.waitForTimeout(4);
-  await page.mouse.move(847, 494);
-  await page.waitForTimeout(24.899999999441206);
-  await page.mouse.move(847, 495);
-  await page.waitForTimeout(29.100000000558794);
-  await page.mouse.move(848, 495);
-  await page.waitForTimeout(297.8999999994412);
-  await page.mouse.move(848, 495);
-  await page.waitForTimeout(5.7000000001862645);
-  await page.mouse.up({ button: "left" });
-  await expect(page).toHaveScreenshot({
-    maxDiffPixels: 100,
-    maxDiffPixelRatio: 0.01,
-  });
-  await page.waitForTimeout(11.299999999813735);
-  await page.mouse.move(847, 495);
-  await page.waitForTimeout(199.1000000005588);
-  await page.mouse.move(847, 495);
-  await page.waitForTimeout(249.29999999981374);
-  await page.mouse.move(846, 495);
-  await page.waitForTimeout(5.7000000001862645);
-  await page.mouse.move(846, 496);
-  await page.waitForTimeout(6);
-  await page.mouse.move(845, 496);
-  await page.waitForTimeout(1);
-  await page.mouse.move(845, 497);
-  await page.waitForTimeout(9);
-  await page.mouse.move(845, 498);
-  await page.waitForTimeout(3.8999999994412065);
-  await page.mouse.move(844, 498);
-  await page.waitForTimeout(1);
-  await page.mouse.move(844, 500);
-  await page.waitForTimeout(8);
-  await page.mouse.move(844, 501);
-  await page.waitForTimeout(3.1000000005587935);
-  await page.mouse.move(843, 501);
-  await page.waitForTimeout(137);
-  await page.mouse.move(844, 501);
-  await page.waitForTimeout(68.09999999962747);
-  await page.mouse.move(845, 501);
-  await page.waitForTimeout(7.7999999998137355);
-  await page.mouse.move(845, 500);
-  await page.waitForTimeout(1);
-  await page.mouse.move(846, 500);
-  await page.waitForTimeout(4);
-  await page.mouse.move(847, 500);
-  await page.waitForTimeout(2);
-  await page.mouse.move(848, 500);
-  await page.waitForTimeout(3.1000000005587935);
-  await page.mouse.move(849, 500);
-  await page.waitForTimeout(3);
-  await page.mouse.move(850, 500);
-  await page.waitForTimeout(5);
-  await page.mouse.move(851, 500);
-  await page.waitForTimeout(2);
-  await page.mouse.move(852, 499);
-  await page.waitForTimeout(3);
-  await page.mouse.move(854, 499);
-  await page.waitForTimeout(5);
-  await page.mouse.move(855, 499);
-  await page.waitForTimeout(3);
-  await page.mouse.move(856, 499);
-  await page.waitForTimeout(6);
-  await page.mouse.move(857, 499);
-  await page.waitForTimeout(12);
-  await page.mouse.move(858, 499);
-  await page.waitForTimeout(24);
-  await page.mouse.move(858, 498);
-  await page.waitForTimeout(4);
-  await page.mouse.move(858, 498);
-  await page.waitForTimeout(59.200000000186265);
-  await page.keyboard.down("Control");
-});

package.json

@@ -11,11 +11,9 @@
     "@babel/preset-env": "7.26.9",
     "@excalidraw/eslint-config": "1.0.3",
     "@excalidraw/prettier-config": "1.0.2",
-    "@playwright/test": "1.55.0",
     "@types/chai": "4.3.0",
     "@types/jest": "27.4.0",
     "@types/lodash.throttle": "4.1.7",
-    "@types/node": "24.3.0",
     "@types/react": "19.0.10",
     "@types/react-dom": "19.0.4",
     "@types/socket.io-client": "3.0.0",
@@ -54,18 +52,13 @@
     "build-node": "node ./scripts/build-node.js",
     "build:app:docker": "yarn --cwd ./excalidraw-app build:app:docker",
     "build:app": "yarn --cwd ./excalidraw-app build:app",
-    "build:common": "yarn --cwd ./packages/common build:esm",
-    "build:element": "yarn --cwd ./packages/element build:esm",
-    "build:excalidraw": "yarn --cwd ./packages/excalidraw build:esm",
-    "build:math": "yarn --cwd ./packages/math build:esm",
-    "build:packages": "yarn build:common && yarn build:math && yarn build:element && yarn build:excalidraw",
+    "build:package": "yarn --cwd ./packages/excalidraw build:esm",
     "build:version": "yarn --cwd ./excalidraw-app build:version",
     "build": "yarn --cwd ./excalidraw-app build",
     "build:preview": "yarn --cwd ./excalidraw-app build:preview",
     "start": "yarn --cwd ./excalidraw-app start",
     "start:production": "yarn --cwd ./excalidraw-app start:production",
-    "start:test": "yarn --cwd ./excalidraw-app start:test",
-    "start:example": "yarn build:packages && yarn --cwd ./examples/with-script-in-browser start",
+    "start:example": "yarn build:package && yarn --cwd ./examples/with-script-in-browser start",
     "test:all": "yarn test:typecheck && yarn test:code && yarn test:other && yarn test:app --watch=false",
     "test:app": "vitest",
     "test:code": "eslint --max-warnings=0 --ext .js,.ts,.tsx .",
@@ -83,10 +76,9 @@
     "locales-coverage:description": "node scripts/locales-coverage-description.js",
     "prepare": "husky install",
     "prettier": "prettier \"**/*.{css,scss,json,md,html,yml}\" --ignore-path=.eslintignore",
-    "release": "node scripts/release.js",
-    "release:test": "node scripts/release.js --tag=test",
-    "release:next": "node scripts/release.js --tag=next",
-    "release:latest": "node scripts/release.js --tag=latest",
+    "autorelease": "node scripts/autorelease.js",
+    "prerelease:excalidraw": "node scripts/prerelease.js",
+    "release:excalidraw": "node scripts/release.js",
     "rm:build": "rimraf --glob excalidraw-app/build excalidraw-app/dist excalidraw-app/dev-dist packages/*/dist packages/*/build examples/*/build examples/*/dist",
     "rm:node_modules": "rimraf --glob node_modules excalidraw-app/node_modules packages/*/node_modules",
     "clean-install": "yarn rm:node_modules && yarn install"

packages/common/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@excalidraw/common",
-  "version": "0.18.0",
+  "version": "0.1.0",
   "type": "module",
   "types": "./dist/types/common/src/index.d.ts",
   "main": "./dist/prod/index.js",
@@ -13,10 +13,7 @@
       "default": "./dist/prod/index.js"
     },
     "./*": {
-      "types": "./dist/types/common/src/*.d.ts",
-      "development": "./dist/dev/index.js",
-      "production": "./dist/prod/index.js",
-      "default": "./dist/prod/index.js"
+      "types": "./dist/types/common/src/*.d.ts"
     }
   },
   "files": [

packages/common/src/constants.ts

@@ -18,22 +18,13 @@ export const isChrome = navigator.userAgent.indexOf("Chrome") !== -1;
 export const isSafari =
   !isChrome && navigator.userAgent.indexOf("Safari") !== -1;
 export const isIOS =
-  /iPad|iPhone/i.test(navigator.platform) ||
+  /iPad|iPhone/.test(navigator.platform) ||
   // iPadOS 13+
   (navigator.userAgent.includes("Mac") && "ontouchend" in document);
 // keeping function so it can be mocked in test
 export const isBrave = () =>
   (navigator as any).brave?.isBrave?.name === "isBrave";
 
-export const isMobile =
-  isIOS ||
-  /android|webos|ipod|blackberry|iemobile|opera mini/i.test(
-    navigator.userAgent.toLowerCase(),
-  ) ||
-  /android|ios|ipod|blackberry|windows phone/i.test(
-    navigator.platform.toLowerCase(),
-  );
-
 export const supportsResizeObserver =
   typeof window !== "undefined" && "ResizeObserver" in window;
 
@@ -45,7 +36,6 @@ export const APP_NAME = "Excalidraw";
 // (happens a lot with fast clicks with the text tool)
 export const TEXT_AUTOWRAP_THRESHOLD = 36; // px
 export const DRAGGING_THRESHOLD = 10; // px
-export const MINIMUM_ARROW_SIZE = 20; // px
 export const LINE_CONFIRM_THRESHOLD = 8; // px
 export const ELEMENT_SHIFT_TRANSLATE_AMOUNT = 5;
 export const ELEMENT_TRANSLATE_AMOUNT = 1;

packages/element/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@excalidraw/element",
-  "version": "0.18.0",
+  "version": "0.1.0",
   "type": "module",
   "types": "./dist/types/element/src/index.d.ts",
   "main": "./dist/prod/index.js",
@@ -13,10 +13,7 @@
       "default": "./dist/prod/index.js"
     },
     "./*": {
-      "types": "./dist/types/element/src/*.d.ts",
-      "development": "./dist/dev/index.js",
-      "production": "./dist/prod/index.js",
-      "default": "./dist/prod/index.js"
+      "types": "./dist/types/element/src/*.d.ts"
     }
   },
   "files": [
@@ -55,9 +52,5 @@
   "scripts": {
     "gen:types": "rimraf types && tsc",
     "build:esm": "rimraf dist && node ../../scripts/buildBase.js && yarn gen:types"
-  },
-  "dependencies": {
-    "@excalidraw/common": "0.18.0",
-    "@excalidraw/math": "0.18.0"
   }
 }

packages/element/src/Scene.ts

@@ -164,14 +164,9 @@ export class Scene {
     return this.frames;
   }
 
-  constructor(
-    elements: ElementsMapOrArray | null = null,
-    options?: {
-      skipValidation?: true;
-    },
-  ) {
+  constructor(elements: ElementsMapOrArray | null = null) {
     if (elements) {
-      this.replaceAllElements(elements, options);
+      this.replaceAllElements(elements);
     }
   }
 
@@ -268,19 +263,12 @@ export class Scene {
     return didChange;
   }
 
-  replaceAllElements(
-    nextElements: ElementsMapOrArray,
-    options?: {
-      skipValidation?: true;
-    },
-  ) {
+  replaceAllElements(nextElements: ElementsMapOrArray) {
     // we do trust the insertion order on the map, though maybe we shouldn't and should prefer order defined by fractional indices
     const _nextElements = toArray(nextElements);
     const nextFrameLikes: ExcalidrawFrameLikeElement[] = [];
 
-    if (!options?.skipValidation) {
-      validateIndicesThrottled(_nextElements);
-    }
+    validateIndicesThrottled(_nextElements);
 
     this.elements = syncInvalidIndices(_nextElements);
     this.elementsMap.clear();

packages/element/src/align.ts

@@ -1,8 +1,6 @@
-import type { AppState } from "@excalidraw/excalidraw/types";
-
 import { updateBoundElements } from "./binding";
 import { getCommonBoundingBox } from "./bounds";
-import { getSelectedElementsByGroup } from "./groups";
+import { getMaximumGroups } from "./groups";
 
 import type { Scene } from "./Scene";
 
@@ -18,12 +16,11 @@ export const alignElements = (
   selectedElements: ExcalidrawElement[],
   alignment: Alignment,
   scene: Scene,
-  appState: Readonly<AppState>,
 ): ExcalidrawElement[] => {
-  const groups: ExcalidrawElement[][] = getSelectedElementsByGroup(
+  const elementsMap = scene.getNonDeletedElementsMap();
+  const groups: ExcalidrawElement[][] = getMaximumGroups(
     selectedElements,
-    scene.getNonDeletedElementsMap(),
-    appState,
+    elementsMap,
   );
   const selectionBoundingBox = getCommonBoundingBox(selectedElements);
 

packages/element/src/delta.ts

@@ -55,10 +55,10 @@ import { getNonDeletedGroupIds } from "./groups";
 
 import { orderByFractionalIndex, syncMovedIndices } from "./fractionalIndex";
 
-import { StoreSnapshot } from "./store";
-
 import { Scene } from "./Scene";
 
+import { StoreSnapshot } from "./store";
+
 import type { BindableProp, BindingProp } from "./binding";
 
 import type { ElementUpdate } from "./mutateElement";
@@ -150,27 +150,13 @@ export class Delta<T> {
     );
   }
 
-  /**
-   * Merges two deltas into a new one.
-   */
-  public static merge<T>(
-    delta1: Delta<T>,
-    delta2: Delta<T>,
-    delta3: Delta<T> = Delta.empty(),
-  ) {
-    return Delta.create(
-      { ...delta1.deleted, ...delta2.deleted, ...delta3.deleted },
-      { ...delta1.inserted, ...delta2.inserted, ...delta3.inserted },
-    );
-  }
-
   /**
    * Merges deleted and inserted object partials.
    */
   public static mergeObjects<T extends { [key: string]: unknown }>(
     prev: T,
     added: T,
-    removed: T = {} as T,
+    removed: T,
   ) {
     const cloned = { ...prev };
 
@@ -510,11 +496,6 @@ export interface DeltaContainer<T> {
    */
   applyTo(previous: T, ...options: unknown[]): [T, boolean];
 
-  /**
-   * Squashes the current delta with the given one.
-   */
-  squash(delta: DeltaContainer<T>): this;
-
   /**
    * Checks whether all `Delta`s are empty.
    */
@@ -522,11 +503,7 @@ export interface DeltaContainer<T> {
 }
 
 export class AppStateDelta implements DeltaContainer<AppState> {
-  private constructor(public delta: Delta<ObservedAppState>) {}
-
-  public static create(delta: Delta<ObservedAppState>): AppStateDelta {
-    return new AppStateDelta(delta);
-  }
+  private constructor(public readonly delta: Delta<ObservedAppState>) {}
 
   public static calculate<T extends ObservedAppState>(
     prevAppState: T,
@@ -557,124 +534,53 @@ export class AppStateDelta implements DeltaContainer<AppState> {
     return new AppStateDelta(inversedDelta);
   }
 
-  public squash(delta: AppStateDelta): this {
-    if (delta.isEmpty()) {
-      return this;
-    }
-
-    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 mergedDeletedSelectedGroupIds = Delta.mergeObjects(
-      this.delta.deleted.selectedGroupIds ?? {},
-      delta.delta.deleted.selectedGroupIds ?? {},
-    );
-
-    const mergedInsertedSelectedGroupIds = Delta.mergeObjects(
-      this.delta.inserted.selectedGroupIds ?? {},
-      delta.delta.inserted.selectedGroupIds ?? {},
-    );
-
-    const mergedDeletedLockedMultiSelections = Delta.mergeObjects(
-      this.delta.deleted.lockedMultiSelections ?? {},
-      delta.delta.deleted.lockedMultiSelections ?? {},
-    );
-
-    const mergedInsertedLockedMultiSelections = Delta.mergeObjects(
-      this.delta.inserted.lockedMultiSelections ?? {},
-      delta.delta.inserted.lockedMultiSelections ?? {},
-    );
-
-    const mergedInserted: Partial<ObservedAppState> = {};
-    const mergedDeleted: Partial<ObservedAppState> = {};
-
-    if (
-      Object.keys(mergedDeletedSelectedElementIds).length ||
-      Object.keys(mergedInsertedSelectedElementIds).length
-    ) {
-      mergedDeleted.selectedElementIds = mergedDeletedSelectedElementIds;
-      mergedInserted.selectedElementIds = mergedInsertedSelectedElementIds;
-    }
-
-    if (
-      Object.keys(mergedDeletedSelectedGroupIds).length ||
-      Object.keys(mergedInsertedSelectedGroupIds).length
-    ) {
-      mergedDeleted.selectedGroupIds = mergedDeletedSelectedGroupIds;
-      mergedInserted.selectedGroupIds = mergedInsertedSelectedGroupIds;
-    }
-
-    if (
-      Object.keys(mergedDeletedLockedMultiSelections).length ||
-      Object.keys(mergedInsertedLockedMultiSelections).length
-    ) {
-      mergedDeleted.lockedMultiSelections = mergedDeletedLockedMultiSelections;
-      mergedInserted.lockedMultiSelections =
-        mergedInsertedLockedMultiSelections;
-    }
-
-    this.delta = Delta.merge(
-      this.delta,
-      delta.delta,
-      Delta.create(mergedDeleted, mergedInserted),
-    );
-
-    return this;
-  }
-
   public applyTo(
     appState: AppState,
     nextElements: SceneElementsMap,
   ): [AppState, boolean] {
     try {
       const {
-        selectedElementIds: deletedSelectedElementIds = {},
-        selectedGroupIds: deletedSelectedGroupIds = {},
-        lockedMultiSelections: deletedLockedMultiSelections = {},
+        selectedElementIds: removedSelectedElementIds = {},
+        selectedGroupIds: removedSelectedGroupIds = {},
       } = this.delta.deleted;
 
       const {
-        selectedElementIds: insertedSelectedElementIds = {},
-        selectedGroupIds: insertedSelectedGroupIds = {},
-        lockedMultiSelections: insertedLockedMultiSelections = {},
-        selectedLinearElement: insertedSelectedLinearElement,
+        selectedElementIds: addedSelectedElementIds = {},
+        selectedGroupIds: addedSelectedGroupIds = {},
+        selectedLinearElementId,
+        editingLinearElementId,
         ...directlyApplicablePartial
       } = this.delta.inserted;
 
       const mergedSelectedElementIds = Delta.mergeObjects(
         appState.selectedElementIds,
-        insertedSelectedElementIds,
-        deletedSelectedElementIds,
+        addedSelectedElementIds,
+        removedSelectedElementIds,
       );
 
       const mergedSelectedGroupIds = Delta.mergeObjects(
         appState.selectedGroupIds,
-        insertedSelectedGroupIds,
-        deletedSelectedGroupIds,
-      );
-
-      const mergedLockedMultiSelections = Delta.mergeObjects(
-        appState.lockedMultiSelections,
-        insertedLockedMultiSelections,
-        deletedLockedMultiSelections,
+        addedSelectedGroupIds,
+        removedSelectedGroupIds,
       );
 
       const selectedLinearElement =
-        insertedSelectedLinearElement &&
-        nextElements.has(insertedSelectedLinearElement.elementId)
+        selectedLinearElementId && nextElements.has(selectedLinearElementId)
           ? new LinearElementEditor(
               nextElements.get(
-                insertedSelectedLinearElement.elementId,
+                selectedLinearElementId,
+              ) as NonDeleted<ExcalidrawLinearElement>,
+              nextElements,
+            )
+          : null;
+
+      const editingLinearElement =
+        editingLinearElementId && nextElements.has(editingLinearElementId)
+          ? new LinearElementEditor(
+              nextElements.get(
+                editingLinearElementId,
               ) as NonDeleted<ExcalidrawLinearElement>,
               nextElements,
-              insertedSelectedLinearElement.isEditing,
             )
           : null;
 
@@ -683,11 +589,14 @@ export class AppStateDelta implements DeltaContainer<AppState> {
         ...directlyApplicablePartial,
         selectedElementIds: mergedSelectedElementIds,
         selectedGroupIds: mergedSelectedGroupIds,
-        lockedMultiSelections: mergedLockedMultiSelections,
         selectedLinearElement:
-          typeof insertedSelectedLinearElement !== "undefined"
-            ? selectedLinearElement
-            : appState.selectedLinearElement,
+          typeof selectedLinearElementId !== "undefined"
+            ? selectedLinearElement // element was either inserted or deleted
+            : appState.selectedLinearElement, // otherwise assign what we had before
+        editingLinearElement:
+          typeof editingLinearElementId !== "undefined"
+            ? editingLinearElement // element was either inserted or deleted
+            : appState.editingLinearElement, // otherwise assign what we had before
       };
 
       const constainsVisibleChanges = this.filterInvisibleChanges(
@@ -816,53 +725,52 @@ export class AppStateDelta implements DeltaContainer<AppState> {
             }
 
             break;
-          case "selectedLinearElement":
-            const nextLinearElement = nextAppState[key];
+          case "selectedLinearElementId":
+          case "editingLinearElementId":
+            const appStateKey = AppStateDelta.convertToAppStateKey(key);
+            const linearElement = nextAppState[appStateKey];
 
-            if (!nextLinearElement) {
+            if (!linearElement) {
               // previously there was a linear element (assuming visible), now there is none
               visibleDifferenceFlag.value = true;
             } else {
-              const element = nextElements.get(nextLinearElement.elementId);
+              const element = nextElements.get(linearElement.elementId);
 
               if (element && !element.isDeleted) {
                 // previously there wasn't a linear element, now there is one which is visible
                 visibleDifferenceFlag.value = true;
               } else {
                 // there was assigned a linear element now, but it's deleted
-                nextAppState[key] = null;
+                nextAppState[appStateKey] = null;
               }
             }
 
             break;
-          case "lockedMultiSelections":
+          case "lockedMultiSelections": {
             const prevLockedUnits = prevAppState[key] || {};
             const nextLockedUnits = nextAppState[key] || {};
 
-            // TODO: this seems wrong, we are already doing this comparison generically above,
-            // hence instead we should check whether elements are actually visible,
-            // so that once these changes are applied they actually result in a visible change to the user
             if (!isShallowEqual(prevLockedUnits, nextLockedUnits)) {
               visibleDifferenceFlag.value = true;
             }
             break;
-          case "activeLockedId":
+          }
+          case "activeLockedId": {
             const prevHitLockedId = prevAppState[key] || null;
             const nextHitLockedId = nextAppState[key] || null;
 
-            // TODO: this seems wrong, we are already doing this comparison generically above,
-            // hence instead we should check whether elements are actually visible,
-            // so that once these changes are applied they actually result in a visible change to the user
             if (prevHitLockedId !== nextHitLockedId) {
               visibleDifferenceFlag.value = true;
             }
             break;
-          default:
+          }
+          default: {
             assertNever(
               key,
               `Unknown ObservedElementsAppState's key "${key}"`,
               true,
             );
+          }
         }
       }
     }
@@ -870,6 +778,20 @@ export class AppStateDelta implements DeltaContainer<AppState> {
     return visibleDifferenceFlag.value;
   }
 
+  private static convertToAppStateKey(
+    key: keyof Pick<
+      ObservedElementsAppState,
+      "selectedLinearElementId" | "editingLinearElementId"
+    >,
+  ): keyof Pick<AppState, "selectedLinearElement" | "editingLinearElement"> {
+    switch (key) {
+      case "selectedLinearElementId":
+        return "selectedLinearElement";
+      case "editingLinearElementId":
+        return "editingLinearElement";
+    }
+  }
+
   private static filterSelectedElements(
     selectedElementIds: AppState["selectedElementIds"],
     elements: SceneElementsMap,
@@ -934,7 +856,8 @@ export class AppStateDelta implements DeltaContainer<AppState> {
       editingGroupId,
       selectedGroupIds,
       selectedElementIds,
-      selectedLinearElement,
+      editingLinearElementId,
+      selectedLinearElementId,
       croppingElementId,
       lockedMultiSelections,
       activeLockedId,
@@ -988,6 +911,12 @@ export class AppStateDelta implements DeltaContainer<AppState> {
         "lockedMultiSelections",
         (prevValue) => (prevValue ?? {}) as ValueOf<T["lockedMultiSelections"]>,
       );
+      Delta.diffObjects(
+        deleted,
+        inserted,
+        "activeLockedId",
+        (prevValue) => (prevValue ?? null) as ValueOf<T["activeLockedId"]>,
+      );
     } catch (e) {
       // if postprocessing fails it does not make sense to bubble up, but let's make sure we know about it
       console.error(`Couldn't postprocess appstate change deltas.`);
@@ -1016,13 +945,12 @@ type ElementPartial<TElement extends ExcalidrawElement = ExcalidrawElement> =
   Omit<Partial<Ordered<TElement>>, "id" | "updated" | "seed">;
 
 export type ApplyToOptions = {
-  excludedProperties?: Set<keyof ElementPartial>;
+  excludedProperties: Set<keyof ElementPartial>;
 };
 
 type ApplyToFlags = {
   containsVisibleDifference: boolean;
   containsZindexDifference: boolean;
-  applyDirection: "forward" | "backward" | undefined;
 };
 
 /**
@@ -1123,15 +1051,6 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
       deleted.version !== inserted.version
     );
 
-  private static satisfiesUniqueInvariants = (
-    elementsDelta: ElementsDelta,
-    id: string,
-  ) => {
-    const { added, removed, updated } = elementsDelta;
-    // it's required that there is only one unique delta type per element
-    return [added[id], removed[id], updated[id]].filter(Boolean).length === 1;
-  };
-
   private static validate(
     elementsDelta: ElementsDelta,
     type: "added" | "removed" | "updated",
@@ -1140,7 +1059,6 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
     for (const [id, delta] of Object.entries(elementsDelta[type])) {
       if (
         !this.satisfiesCommmonInvariants(delta) ||
-        !this.satisfiesUniqueInvariants(elementsDelta, id) ||
         !satifiesSpecialInvariants(delta)
       ) {
         console.error(
@@ -1177,7 +1095,7 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
       const nextElement = nextElements.get(prevElement.id);
 
       if (!nextElement) {
-        const deleted = { ...prevElement } as ElementPartial;
+        const deleted = { ...prevElement, isDeleted: false } as ElementPartial;
 
         const inserted = {
           isDeleted: true,
@@ -1191,10 +1109,7 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
           ElementsDelta.stripIrrelevantProps,
         );
 
-        // ignore updates which would "delete" already deleted element
-        if (!prevElement.isDeleted) {
-          removed[prevElement.id] = delta;
-        }
+        removed[prevElement.id] = delta;
       }
     }
 
@@ -1210,6 +1125,7 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
 
         const inserted = {
           ...nextElement,
+          isDeleted: false,
         } as ElementPartial;
 
         const delta = Delta.create(
@@ -1218,10 +1134,7 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
           ElementsDelta.stripIrrelevantProps,
         );
 
-        // ignore updates which would "delete" already deleted element
-        if (!nextElement.isDeleted) {
-          added[nextElement.id] = delta;
-        }
+        added[nextElement.id] = delta;
 
         continue;
       }
@@ -1250,13 +1163,8 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
           continue;
         }
 
-        const strippedDeleted = ElementsDelta.stripVersionProps(delta.deleted);
-        const strippedInserted = ElementsDelta.stripVersionProps(
-          delta.inserted,
-        );
-
-        // making sure there are at least some changes and only changed version & versionNonce does not count!
-        if (Delta.isInnerDifferent(strippedDeleted, strippedInserted, true)) {
+        // making sure there are at least some changes
+        if (!Delta.isEmpty(delta)) {
           updated[nextElement.id] = delta;
         }
       }
@@ -1273,8 +1181,8 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
     const inverseInternal = (deltas: Record<string, Delta<ElementPartial>>) => {
       const inversedDeltas: Record<string, Delta<ElementPartial>> = {};
 
-      for (const [id, { inserted, deleted }] of Object.entries(deltas)) {
-        inversedDeltas[id] = Delta.create({ ...inserted }, { ...deleted });
+      for (const [id, delta] of Object.entries(deltas)) {
+        inversedDeltas[id] = Delta.create(delta.inserted, delta.deleted);
       }
 
       return inversedDeltas;
@@ -1372,15 +1280,8 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
           latestDelta = delta;
         }
 
-        const strippedDeleted = ElementsDelta.stripVersionProps(
-          latestDelta.deleted,
-        );
-        const strippedInserted = ElementsDelta.stripVersionProps(
-          latestDelta.inserted,
-        );
-
         // it might happen that after applying latest changes the delta itself does not contain any changes
-        if (Delta.isInnerDifferent(strippedDeleted, strippedInserted)) {
+        if (Delta.isInnerDifferent(latestDelta.deleted, latestDelta.inserted)) {
           modifiedDeltas[id] = latestDelta;
         }
       }
@@ -1400,7 +1301,9 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
   public applyTo(
     elements: SceneElementsMap,
     snapshot: StoreSnapshot["elements"] = StoreSnapshot.empty().elements,
-    options?: ApplyToOptions,
+    options: ApplyToOptions = {
+      excludedProperties: new Set(),
+    },
   ): [SceneElementsMap, boolean] {
     let nextElements = new Map(elements) as SceneElementsMap;
     let changedElements: Map<string, OrderedExcalidrawElement>;
@@ -1408,28 +1311,22 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
     const flags: ApplyToFlags = {
       containsVisibleDifference: false,
       containsZindexDifference: false,
-      applyDirection: undefined,
     };
 
     // mimic a transaction by applying deltas into `nextElements` (always new instance, no mutation)
     try {
       const applyDeltas = ElementsDelta.createApplier(
-        elements,
         nextElements,
         snapshot,
-        flags,
         options,
+        flags,
       );
 
       const addedElements = applyDeltas(this.added);
       const removedElements = applyDeltas(this.removed);
       const updatedElements = applyDeltas(this.updated);
 
-      const affectedElements = this.resolveConflicts(
-        elements,
-        nextElements,
-        flags.applyDirection,
-      );
+      const affectedElements = this.resolveConflicts(elements, nextElements);
 
       // TODO: #7348 validate elements semantically and syntactically the changed elements, in case they would result data integrity issues
       changedElements = new Map([
@@ -1453,15 +1350,22 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
     }
 
     try {
-      // the following reorder performs mutations, but only on new instances of changed elements,
-      // unless something goes really bad and it fallbacks to fixing all invalid indices
+      // the following reorder performs also mutations, but only on new instances of changed elements
+      // (unless something goes really bad and it fallbacks to fixing all invalid indices)
       nextElements = ElementsDelta.reorderElements(
         nextElements,
         changedElements,
         flags,
       );
 
-      ElementsDelta.redrawElements(nextElements, changedElements);
+      // we don't have an up-to-date scene, as we can be just in the middle of applying history entry
+      // we also don't have a scene on the server
+      // so we are creating a temp scene just to query and mutate elements
+      const tempScene = new Scene(nextElements);
+
+      ElementsDelta.redrawTextBoundingBoxes(tempScene, changedElements);
+      // Need ordered nextElements to avoid z-index binding issues
+      ElementsDelta.redrawBoundArrows(tempScene, changedElements);
     } catch (e) {
       console.error(
         `Couldn't mutate elements after applying elements change`,
@@ -1476,113 +1380,12 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
     }
   }
 
-  public squash(delta: ElementsDelta): this {
-    if (delta.isEmpty()) {
-      return this;
-    }
-
-    const { added, removed, updated } = delta;
-
-    const mergeBoundElements = (
-      prevDelta: Delta<ElementPartial>,
-      nextDelta: Delta<ElementPartial>,
-    ) => {
-      const mergedDeletedBoundElements =
-        Delta.mergeArrays(
-          prevDelta.deleted.boundElements ?? [],
-          nextDelta.deleted.boundElements ?? [],
-          undefined,
-          (x) => x.id,
-        ) ?? [];
-
-      const mergedInsertedBoundElements =
-        Delta.mergeArrays(
-          prevDelta.inserted.boundElements ?? [],
-          nextDelta.inserted.boundElements ?? [],
-          undefined,
-          (x) => x.id,
-        ) ?? [];
-
-      if (
-        !mergedDeletedBoundElements.length &&
-        !mergedInsertedBoundElements.length
-      ) {
-        return;
-      }
-
-      return Delta.create(
-        {
-          boundElements: mergedDeletedBoundElements,
-        },
-        {
-          boundElements: mergedInsertedBoundElements,
-        },
-      );
-    };
-
-    for (const [id, nextDelta] of Object.entries(added)) {
-      const prevDelta = this.added[id] ?? this.removed[id] ?? this.updated[id];
-
-      if (!prevDelta) {
-        this.added[id] = nextDelta;
-      } else {
-        const mergedDelta = mergeBoundElements(prevDelta, nextDelta);
-        delete this.removed[id];
-        delete this.updated[id];
-
-        this.added[id] = Delta.merge(prevDelta, nextDelta, mergedDelta);
-      }
-    }
-
-    for (const [id, nextDelta] of Object.entries(removed)) {
-      const prevDelta = this.added[id] ?? this.removed[id] ?? this.updated[id];
-
-      if (!prevDelta) {
-        this.removed[id] = nextDelta;
-      } else {
-        const mergedDelta = mergeBoundElements(prevDelta, nextDelta);
-        delete this.added[id];
-        delete this.updated[id];
-
-        this.removed[id] = Delta.merge(prevDelta, nextDelta, mergedDelta);
-      }
-    }
-
-    for (const [id, nextDelta] of Object.entries(updated)) {
-      const prevDelta = this.added[id] ?? this.removed[id] ?? this.updated[id];
-
-      if (!prevDelta) {
-        this.updated[id] = nextDelta;
-      } else {
-        const mergedDelta = mergeBoundElements(prevDelta, nextDelta);
-        const updatedDelta = Delta.merge(prevDelta, nextDelta, mergedDelta);
-
-        if (prevDelta === this.added[id]) {
-          this.added[id] = updatedDelta;
-        } else if (prevDelta === this.removed[id]) {
-          this.removed[id] = updatedDelta;
-        } else {
-          this.updated[id] = updatedDelta;
-        }
-      }
-    }
-
-    if (isTestEnv() || isDevEnv()) {
-      ElementsDelta.validate(this, "added", ElementsDelta.satisfiesAddition);
-      ElementsDelta.validate(this, "removed", ElementsDelta.satisfiesRemoval);
-      ElementsDelta.validate(this, "updated", ElementsDelta.satisfiesUpdate);
-    }
-
-    return this;
-  }
-
   private static createApplier =
     (
-      prevElements: SceneElementsMap,
       nextElements: SceneElementsMap,
       snapshot: StoreSnapshot["elements"],
+      options: ApplyToOptions,
       flags: ApplyToFlags,
-      options?: ApplyToOptions,
     ) =>
     (deltas: Record<string, Delta<ElementPartial>>) => {
       const getElement = ElementsDelta.createGetter(
@@ -1595,26 +1398,15 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
         const element = getElement(id, delta.inserted);
 
         if (element) {
-          const nextElement = ElementsDelta.applyDelta(
+          const newElement = ElementsDelta.applyDelta(
             element,
             delta,
-            flags,
             options,
+            flags,
           );
 
-          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";
-            }
-          }
+          nextElements.set(newElement.id, newElement);
+          acc.set(newElement.id, newElement);
         }
 
         return acc;
@@ -1659,8 +1451,8 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
   private static applyDelta(
     element: OrderedExcalidrawElement,
     delta: Delta<ElementPartial>,
+    options: ApplyToOptions,
     flags: ApplyToFlags,
-    options?: ApplyToOptions,
   ) {
     const directlyApplicablePartial: Mutable<ElementPartial> = {};
 
@@ -1674,7 +1466,7 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
         continue;
       }
 
-      if (options?.excludedProperties?.has(key)) {
+      if (options.excludedProperties.has(key)) {
         continue;
       }
 
@@ -1714,7 +1506,7 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
         delta.deleted.index !== delta.inserted.index;
     }
 
-    return newElementWith(element, directlyApplicablePartial, true);
+    return newElementWith(element, directlyApplicablePartial);
   }
 
   /**
@@ -1754,7 +1546,6 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
   private resolveConflicts(
     prevElements: SceneElementsMap,
     nextElements: SceneElementsMap,
-    applyDirection: "forward" | "backward" = "forward",
   ) {
     const nextAffectedElements = new Map<string, OrderedExcalidrawElement>();
     const updater = (
@@ -1766,36 +1557,21 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
         return;
       }
 
-      const prevElement = prevElements.get(element.id);
-      const nextVersion =
-        applyDirection === "forward"
-          ? nextElement.version + 1
-          : nextElement.version - 1;
-
-      const elementUpdates = updates as ElementUpdate<OrderedExcalidrawElement>;
-
       let affectedElement: OrderedExcalidrawElement;
 
-      if (prevElement === nextElement) {
+      if (prevElements.get(element.id) === nextElement) {
         // create the new element instance in case we didn't modify the element yet
         // so that we won't end up in an incosistent state in case we would fail in the middle of mutations
         affectedElement = newElementWith(
           nextElement,
-          {
-            ...elementUpdates,
-            version: nextVersion,
-          },
-          true,
+          updates as ElementUpdate<OrderedExcalidrawElement>,
         );
       } else {
-        affectedElement = mutateElement(nextElement, nextElements, {
-          ...elementUpdates,
-          // don't modify the version further, if it's already different
-          version:
-            prevElement?.version !== nextElement.version
-              ? nextElement.version
-              : nextVersion,
-        });
+        affectedElement = mutateElement(
+          nextElement,
+          nextElements,
+          updates as ElementUpdate<OrderedExcalidrawElement>,
+        );
       }
 
       nextAffectedElements.set(affectedElement.id, affectedElement);
@@ -1833,12 +1609,25 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
       Array.from(prevElements).filter(([id]) => nextAffectedElements.has(id)),
     );
 
-    // calculate complete deltas for affected elements, and squash them back to the current deltas
-    this.squash(
-      // technically we could do better here if perf. would become an issue
-      ElementsDelta.calculate(prevAffectedElements, nextAffectedElements),
+    // calculate complete deltas for affected elements, and assign them back to all the deltas
+    // technically we could do better here if perf. would become an issue
+    const { added, removed, updated } = ElementsDelta.calculate(
+      prevAffectedElements,
+      nextAffectedElements,
     );
 
+    for (const [id, delta] of Object.entries(added)) {
+      this.added[id] = delta;
+    }
+
+    for (const [id, delta] of Object.entries(removed)) {
+      this.removed[id] = delta;
+    }
+
+    for (const [id, delta] of Object.entries(updated)) {
+      this.updated[id] = delta;
+    }
+
     return nextAffectedElements;
   }
 
@@ -1900,31 +1689,6 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
     BindableElement.rebindAffected(nextElements, nextElement(), updater);
   }
 
-  public static redrawElements(
-    nextElements: SceneElementsMap,
-    changedElements: Map<string, OrderedExcalidrawElement>,
-  ) {
-    try {
-      // we don't have an up-to-date scene, as we can be just in the middle of applying history entry
-      // we also don't have a scene on the server
-      // so we are creating a temp scene just to query and mutate elements
-      const tempScene = new Scene(nextElements, { skipValidation: true });
-
-      ElementsDelta.redrawTextBoundingBoxes(tempScene, changedElements);
-
-      // needs ordered nextElements to avoid z-index binding issues
-      ElementsDelta.redrawBoundArrows(tempScene, changedElements);
-    } catch (e) {
-      console.error(`Couldn't redraw elements`, e);
-
-      if (isTestEnv() || isDevEnv()) {
-        throw e;
-      }
-    } finally {
-      return nextElements;
-    }
-  }
-
   private static redrawTextBoundingBoxes(
     scene: Scene,
     changed: Map<string, OrderedExcalidrawElement>,
@@ -1979,7 +1743,6 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
   ) {
     for (const element of changed.values()) {
       if (!element.isDeleted && isBindableElement(element)) {
-        // TODO: with precise bindings this is quite expensive, so consider optimisation so it's only triggered when the arrow does not intersect (imprecise) element bounds
         updateBoundElements(element, scene, {
           changedElements: changed,
         });
@@ -2075,12 +1838,4 @@ export class ElementsDelta implements DeltaContainer<SceneElementsMap> {
 
     return strippedPartial;
   }
-
-  private static stripVersionProps(
-    partial: Partial<OrderedExcalidrawElement>,
-  ): ElementPartial {
-    const { version, versionNonce, ...strippedPartial } = partial;
-
-    return strippedPartial;
-  }
 }

packages/element/src/distribute.ts

@@ -1,9 +1,7 @@
-import type { AppState } from "@excalidraw/excalidraw/types";
-
 import { getCommonBoundingBox } from "./bounds";
 import { newElementWith } from "./mutateElement";
 
-import { getSelectedElementsByGroup } from "./groups";
+import { getMaximumGroups } from "./groups";
 
 import type { ElementsMap, ExcalidrawElement } from "./types";
 
@@ -16,7 +14,6 @@ export const distributeElements = (
   selectedElements: ExcalidrawElement[],
   elementsMap: ElementsMap,
   distribution: Distribution,
-  appState: Readonly<AppState>,
 ): ExcalidrawElement[] => {
   const [start, mid, end, extent] =
     distribution.axis === "x"
@@ -24,11 +21,7 @@ export const distributeElements = (
       : (["minY", "midY", "maxY", "height"] as const);
 
   const bounds = getCommonBoundingBox(selectedElements);
-  const groups = getSelectedElementsByGroup(
-    selectedElements,
-    elementsMap,
-    appState,
-  )
+  const groups = getMaximumGroups(selectedElements, elementsMap)
     .map((group) => [group, getCommonBoundingBox(group)] as const)
     .sort((a, b) => a[1][mid] - b[1][mid]);
 

packages/element/src/embeddable.ts

@@ -23,7 +23,7 @@ type IframeDataWithSandbox = MarkRequired<IframeData, "sandbox">;
 const embeddedLinkCache = new Map<string, IframeDataWithSandbox>();
 
 const RE_YOUTUBE =
-  /^(?:http(?:s)?:\/\/)?(?:www\.)?youtu(?:be\.com|\.be)\/(embed\/|watch\?v=|shorts\/|playlist\?list=|embed\/videoseries\?list=)?([a-zA-Z0-9_-]+)/;
+  /^(?:http(?:s)?:\/\/)?(?:www\.)?youtu(?:be\.com|\.be)\/(embed\/|watch\?v=|shorts\/|playlist\?list=|embed\/videoseries\?list=)?([a-zA-Z0-9_-]+)(?:\?t=|&t=|\?start=|&start=)?([a-zA-Z0-9_-]+)?[^\s]*$/;
 
 const RE_VIMEO =
   /^(?:http(?:s)?:\/\/)?(?:(?:w){3}\.)?(?:player\.)?vimeo\.com\/(?:video\/)?([^?\s]+)(?:\?.*)?$/;
@@ -56,35 +56,6 @@ const RE_REDDIT =
 const RE_REDDIT_EMBED =
   /^<blockquote[\s\S]*?\shref=["'](https?:\/\/(?:www\.)?reddit\.com\/[^"']*)/i;
 
-const parseYouTubeTimestamp = (url: string): number => {
-  let timeParam: string | null | undefined;
-
-  try {
-    const urlObj = new URL(url.startsWith("http") ? url : `https://${url}`);
-    timeParam =
-      urlObj.searchParams.get("t") || urlObj.searchParams.get("start");
-  } catch (error) {
-    const timeMatch = url.match(/[?&#](?:t|start)=([^&#\s]+)/);
-    timeParam = timeMatch?.[1];
-  }
-
-  if (!timeParam) {
-    return 0;
-  }
-
-  if (/^\d+$/.test(timeParam)) {
-    return parseInt(timeParam, 10);
-  }
-
-  const timeMatch = timeParam.match(/^(?:(\d+)h)?(?:(\d+)m)?(?:(\d+)s)?$/);
-  if (!timeMatch) {
-    return 0;
-  }
-
-  const [, hours = "0", minutes = "0", seconds = "0"] = timeMatch;
-  return parseInt(hours) * 3600 + parseInt(minutes) * 60 + parseInt(seconds);
-};
-
 const ALLOWED_DOMAINS = new Set([
   "youtube.com",
   "youtu.be",
@@ -142,8 +113,7 @@ export const getEmbedLink = (
   let aspectRatio = { w: 560, h: 840 };
   const ytLink = link.match(RE_YOUTUBE);
   if (ytLink?.[2]) {
-    const startTime = parseYouTubeTimestamp(originalLink);
-    const time = startTime > 0 ? `&start=${startTime}` : ``;
+    const time = ytLink[3] ? `&start=${ytLink[3]}` : ``;
     const isPortrait = link.includes("shorts");
     type = "video";
     switch (ytLink[1]) {

packages/element/src/groups.ts

@@ -7,8 +7,6 @@ import type { Mutable } from "@excalidraw/common/utility-types";
 
 import { getBoundTextElement } from "./textElement";
 
-import { isBoundToContainer } from "./typeChecks";
-
 import { makeNextSelectedElementIds, getSelectedElements } from "./selection";
 
 import type {
@@ -404,78 +402,3 @@ export const getNewGroupIdsForDuplication = (
 
   return copy;
 };
-
-// given a list of selected elements, return the element grouped by their immediate group selected state
-// in the case if only one group is selected and all elements selected are within the group, it will respect group hierarchy in accordance to their nested grouping order
-export const getSelectedElementsByGroup = (
-  selectedElements: ExcalidrawElement[],
-  elementsMap: ElementsMap,
-  appState: Readonly<AppState>,
-): ExcalidrawElement[][] => {
-  const selectedGroupIds = getSelectedGroupIds(appState);
-  const unboundElements = selectedElements.filter(
-    (element) => !isBoundToContainer(element),
-  );
-  const groups: Map<string, ExcalidrawElement[]> = new Map();
-  const elements: Map<string, ExcalidrawElement[]> = new Map();
-
-  // helper function to add an element to the elements map
-  const addToElementsMap = (element: ExcalidrawElement) => {
-    // elements
-    const currentElementMembers = elements.get(element.id) || [];
-    const boundTextElement = getBoundTextElement(element, elementsMap);
-
-    if (boundTextElement) {
-      currentElementMembers.push(boundTextElement);
-    }
-    elements.set(element.id, [...currentElementMembers, element]);
-  };
-
-  // helper function to add an element to the groups map
-  const addToGroupsMap = (element: ExcalidrawElement, groupId: string) => {
-    // groups
-    const currentGroupMembers = groups.get(groupId) || [];
-    const boundTextElement = getBoundTextElement(element, elementsMap);
-
-    if (boundTextElement) {
-      currentGroupMembers.push(boundTextElement);
-    }
-    groups.set(groupId, [...currentGroupMembers, element]);
-  };
-
-  // helper function to handle the case where a single group is selected
-  // and all elements selected are within the group, it will respect group hierarchy in accordance to
-  // their nested grouping order
-  const handleSingleSelectedGroupCase = (
-    element: ExcalidrawElement,
-    selectedGroupId: GroupId,
-  ) => {
-    const indexOfSelectedGroupId = element.groupIds.indexOf(selectedGroupId, 0);
-    const nestedGroupCount = element.groupIds.slice(
-      0,
-      indexOfSelectedGroupId,
-    ).length;
-    return nestedGroupCount > 0
-      ? addToGroupsMap(element, element.groupIds[indexOfSelectedGroupId - 1])
-      : addToElementsMap(element);
-  };
-
-  const isAllInSameGroup = selectedElements.every((element) =>
-    isSelectedViaGroup(appState, element),
-  );
-
-  unboundElements.forEach((element) => {
-    const selectedGroupId = getSelectedGroupIdForElement(
-      element,
-      appState.selectedGroupIds,
-    );
-    if (!selectedGroupId) {
-      addToElementsMap(element);
-    } else if (selectedGroupIds.length === 1 && isAllInSameGroup) {
-      handleSingleSelectedGroupCase(element, selectedGroupId);
-    } else {
-      addToGroupsMap(element, selectedGroupId);
-    }
-  });
-  return Array.from(groups.values()).concat(Array.from(elements.values()));
-};

packages/element/src/linearElementEditor.ts

@@ -149,12 +149,10 @@ export class LinearElementEditor {
   public readonly segmentMidPointHoveredCoords: GlobalPoint | null;
   public readonly elbowed: boolean;
   public readonly customLineAngle: number | null;
-  public readonly isEditing: boolean;
 
   constructor(
     element: NonDeleted<ExcalidrawLinearElement>,
     elementsMap: ElementsMap,
-    isEditing: boolean = false,
   ) {
     this.elementId = element.id as string & {
       _brand: "excalidrawLinearElementId";
@@ -189,7 +187,6 @@ export class LinearElementEditor {
     this.segmentMidPointHoveredCoords = null;
     this.elbowed = isElbowArrow(element) && element.elbowed;
     this.customLineAngle = null;
-    this.isEditing = isEditing;
   }
 
   // ---------------------------------------------------------------------------
@@ -197,7 +194,6 @@ export class LinearElementEditor {
   // ---------------------------------------------------------------------------
 
   static POINT_HANDLE_SIZE = 10;
-
   /**
    * @param id the `elementId` from the instance of this class (so that we can
    *  statically guarantee this method returns an ExcalidrawLinearElement)
@@ -219,14 +215,11 @@ export class LinearElementEditor {
     setState: React.Component<any, AppState>["setState"],
     elementsMap: NonDeletedSceneElementsMap,
   ) {
-    if (
-      !appState.selectedLinearElement?.isEditing ||
-      !appState.selectionElement
-    ) {
+    if (!appState.editingLinearElement || !appState.selectionElement) {
       return false;
     }
-    const { selectedLinearElement } = appState;
-    const { selectedPointsIndices, elementId } = selectedLinearElement;
+    const { editingLinearElement } = appState;
+    const { selectedPointsIndices, elementId } = editingLinearElement;
 
     const element = LinearElementEditor.getElement(elementId, elementsMap);
     if (!element) {
@@ -267,8 +260,8 @@ export class LinearElementEditor {
       });
 
     setState({
-      selectedLinearElement: {
-        ...selectedLinearElement,
+      editingLinearElement: {
+        ...editingLinearElement,
         selectedPointsIndices: nextSelectedPoints.length
           ? nextSelectedPoints
           : null,
@@ -486,6 +479,9 @@ export class LinearElementEditor {
 
       return {
         ...app.state,
+        editingLinearElement: app.state.editingLinearElement
+          ? newLinearElementEditor
+          : null,
         selectedLinearElement: newLinearElementEditor,
         suggestedBindings,
       };
@@ -622,7 +618,7 @@ export class LinearElementEditor {
     // Since its not needed outside editor unless 2 pointer lines or bound text
     if (
       !isElbowArrow(element) &&
-      !appState.selectedLinearElement?.isEditing &&
+      !appState.editingLinearElement &&
       element.points.length > 2 &&
       !boundText
     ) {
@@ -688,7 +684,7 @@ export class LinearElementEditor {
     );
     if (
       points.length >= 3 &&
-      !appState.selectedLinearElement?.isEditing &&
+      !appState.editingLinearElement &&
       !isElbowArrow(element)
     ) {
       return null;
@@ -885,7 +881,7 @@ export class LinearElementEditor {
         segmentMidpoint,
         elementsMap,
       );
-    } else if (event.altKey && appState.selectedLinearElement?.isEditing) {
+    } else if (event.altKey && appState.editingLinearElement) {
       if (linearElementEditor.lastUncommittedPoint == null) {
         scene.mutateElement(element, {
           points: [
@@ -1027,14 +1023,14 @@ export class LinearElementEditor {
     app: AppClassProperties,
   ): LinearElementEditor | null {
     const appState = app.state;
-    if (!appState.selectedLinearElement?.isEditing) {
+    if (!appState.editingLinearElement) {
       return null;
     }
-    const { elementId, lastUncommittedPoint } = appState.selectedLinearElement;
+    const { elementId, lastUncommittedPoint } = appState.editingLinearElement;
     const elementsMap = app.scene.getNonDeletedElementsMap();
     const element = LinearElementEditor.getElement(elementId, elementsMap);
     if (!element) {
-      return appState.selectedLinearElement;
+      return appState.editingLinearElement;
     }
 
     const { points } = element;
@@ -1044,12 +1040,10 @@ export class LinearElementEditor {
       if (lastPoint === lastUncommittedPoint) {
         LinearElementEditor.deletePoints(element, app, [points.length - 1]);
       }
-      return appState.selectedLinearElement?.lastUncommittedPoint
-        ? {
-            ...appState.selectedLinearElement,
-            lastUncommittedPoint: null,
-          }
-        : appState.selectedLinearElement;
+      return {
+        ...appState.editingLinearElement,
+        lastUncommittedPoint: null,
+      };
     }
 
     let newPoint: LocalPoint;
@@ -1073,8 +1067,8 @@ export class LinearElementEditor {
       newPoint = LinearElementEditor.createPointAt(
         element,
         elementsMap,
-        scenePointerX - appState.selectedLinearElement.pointerOffset.x,
-        scenePointerY - appState.selectedLinearElement.pointerOffset.y,
+        scenePointerX - appState.editingLinearElement.pointerOffset.x,
+        scenePointerY - appState.editingLinearElement.pointerOffset.y,
         event[KEYS.CTRL_OR_CMD] || isElbowArrow(element)
           ? null
           : app.getEffectiveGridSize(),
@@ -1098,7 +1092,7 @@ export class LinearElementEditor {
       LinearElementEditor.addPoints(element, app.scene, [newPoint]);
     }
     return {
-      ...appState.selectedLinearElement,
+      ...appState.editingLinearElement,
       lastUncommittedPoint: element.points[element.points.length - 1],
     };
   }
@@ -1257,12 +1251,12 @@ export class LinearElementEditor {
   // ---------------------------------------------------------------------------
   static duplicateSelectedPoints(appState: AppState, scene: Scene): AppState {
     invariant(
-      appState.selectedLinearElement?.isEditing,
+      appState.editingLinearElement,
       "Not currently editing a linear element",
     );
 
     const elementsMap = scene.getNonDeletedElementsMap();
-    const { selectedPointsIndices, elementId } = appState.selectedLinearElement;
+    const { selectedPointsIndices, elementId } = appState.editingLinearElement;
     const element = LinearElementEditor.getElement(elementId, elementsMap);
 
     invariant(
@@ -1324,8 +1318,8 @@ export class LinearElementEditor {
 
     return {
       ...appState,
-      selectedLinearElement: {
-        ...appState.selectedLinearElement,
+      editingLinearElement: {
+        ...appState.editingLinearElement,
         selectedPointsIndices: nextSelectedIndices,
       },
     };
@@ -1337,9 +1331,8 @@ export class LinearElementEditor {
     pointIndices: readonly number[],
   ) {
     const isUncommittedPoint =
-      app.state.selectedLinearElement?.isEditing &&
-      app.state.selectedLinearElement?.lastUncommittedPoint ===
-        element.points[element.points.length - 1];
+      app.state.editingLinearElement?.lastUncommittedPoint ===
+      element.points[element.points.length - 1];
 
     const nextPoints = element.points.filter((_, idx) => {
       return !pointIndices.includes(idx);
@@ -1512,7 +1505,7 @@ export class LinearElementEditor {
       pointFrom(pointerCoords.x, pointerCoords.y),
     );
     if (
-      !appState.selectedLinearElement?.isEditing &&
+      !appState.editingLinearElement &&
       dist < DRAGGING_THRESHOLD / appState.zoom.value
     ) {
       return false;

packages/element/src/renderElement.ts

@@ -106,11 +106,6 @@ const getCanvasPadding = (element: ExcalidrawElement) => {
       return element.strokeWidth * 12;
     case "text":
       return element.fontSize / 2;
-    case "arrow":
-      if (element.endArrowhead || element.endArrowhead) {
-        return 40;
-      }
-      return 20;
     default:
       return 20;
   }

packages/element/src/shape.ts

@@ -21,7 +21,6 @@ import {
   assertNever,
   COLOR_PALETTE,
   LINE_POLYGON_POINT_MERGE_DISTANCE,
-  isTestEnv,
 } from "@excalidraw/common";
 
 import { RoughGenerator } from "roughjs/bin/generator";
@@ -183,7 +182,7 @@ export const generateRoughOptions = (
   continuousPath = false,
 ): Options => {
   const options: Options = {
-    seed: isTestEnv() ? 1 : element.seed,
+    seed: element.seed,
     strokeLineDash:
       element.strokeStyle === "dashed"
         ? getDashArrayDashed(element.strokeWidth)

packages/element/src/store.ts

@@ -27,8 +27,6 @@ import {
   isImageElement,
 } from "./index";
 
-import type { ApplyToOptions } from "./delta";
-
 import type {
   ExcalidrawElement,
   OrderedExcalidrawElement,
@@ -76,9 +74,8 @@ type MicroActionsQueue = (() => void)[];
  * Store which captures the observed changes and emits them as `StoreIncrement` events.
  */
 export class Store {
-  // for internal use by history
+  // internally used by history
   public readonly onDurableIncrementEmitter = new Emitter<[DurableIncrement]>();
-  // for public use as part of onIncrement API
   public readonly onStoreIncrementEmitter = new Emitter<
     [DurableIncrement | EphemeralIncrement]
   >();
@@ -240,6 +237,7 @@ export class Store {
     if (!storeDelta.isEmpty()) {
       const increment = new DurableIncrement(storeChange, storeDelta);
 
+      // Notify listeners with the increment
       this.onDurableIncrementEmitter.trigger(increment);
       this.onStoreIncrementEmitter.trigger(increment);
     }
@@ -552,26 +550,10 @@ export class StoreDelta {
   public static load({
     id,
     elements: { added, removed, updated },
-    appState: { delta: appStateDelta },
   }: DTO<StoreDelta>) {
     const elements = ElementsDelta.create(added, removed, updated);
-    const appState = AppStateDelta.create(appStateDelta);
 
-    return new this(id, elements, appState);
-  }
-
-  /**
-   * Squash the passed deltas into the aggregated delta instance.
-   */
-  public static squash(...deltas: StoreDelta[]) {
-    const aggregatedDelta = StoreDelta.empty();
-
-    for (const delta of deltas) {
-      aggregatedDelta.elements.squash(delta.elements);
-      aggregatedDelta.appState.squash(delta.appState);
-    }
-
-    return aggregatedDelta;
+    return new this(id, elements, AppStateDelta.empty());
   }
 
   /**
@@ -588,13 +570,9 @@ export class StoreDelta {
     delta: StoreDelta,
     elements: SceneElementsMap,
     appState: AppState,
-    options?: ApplyToOptions,
   ): [SceneElementsMap, AppState, boolean] {
-    const [nextElements, elementsContainVisibleChange] = delta.elements.applyTo(
-      elements,
-      StoreSnapshot.empty().elements,
-      options,
-    );
+    const [nextElements, elementsContainVisibleChange] =
+      delta.elements.applyTo(elements);
 
     const [nextAppState, appStateContainsVisibleChange] =
       delta.appState.applyTo(appState, nextElements);
@@ -627,10 +605,6 @@ export class StoreDelta {
     );
   }
 
-  public static empty() {
-    return StoreDelta.create(ElementsDelta.empty(), AppStateDelta.empty());
-  }
-
   public isEmpty() {
     return this.elements.isEmpty() && this.appState.isEmpty();
   }
@@ -996,7 +970,8 @@ const getDefaultObservedAppState = (): ObservedAppState => {
     viewBackgroundColor: COLOR_PALETTE.white,
     selectedElementIds: {},
     selectedGroupIds: {},
-    selectedLinearElement: null,
+    editingLinearElementId: null,
+    selectedLinearElementId: null,
     croppingElementId: null,
     activeLockedId: null,
     lockedMultiSelections: {},
@@ -1015,12 +990,14 @@ export const getObservedAppState = (
     croppingElementId: appState.croppingElementId,
     activeLockedId: appState.activeLockedId,
     lockedMultiSelections: appState.lockedMultiSelections,
-    selectedLinearElement: appState.selectedLinearElement
-      ? {
-          elementId: appState.selectedLinearElement.elementId,
-          isEditing: !!appState.selectedLinearElement.isEditing,
-        }
-      : null,
+    editingLinearElementId:
+      (appState as AppState).editingLinearElement?.elementId ?? // prefer app state, as it's likely newer
+      (appState as ObservedAppState).editingLinearElementId ?? // fallback to observed app state, as it's likely older coming from a previous snapshot
+      null,
+    selectedLinearElementId:
+      (appState as AppState).selectedLinearElement?.elementId ??
+      (appState as ObservedAppState).selectedLinearElementId ??
+      null,
   };
 
   Reflect.defineProperty(observedAppState, hiddenObservedAppStateProp, {

packages/element/src/transformHandles.ts

@@ -330,7 +330,7 @@ export const shouldShowBoundingBox = (
   elements: readonly NonDeletedExcalidrawElement[],
   appState: InteractiveCanvasAppState,
 ) => {
-  if (appState.selectedLinearElement?.isEditing) {
+  if (appState.editingLinearElement) {
     return false;
   }
   if (elements.length > 1) {

packages/element/tests/align.test.tsx

@@ -589,424 +589,4 @@ describe("aligning", () => {
     expect(API.getSelectedElements()[2].x).toEqual(250);
     expect(API.getSelectedElements()[3].x).toEqual(150);
   });
-
-  const createGroupAndSelectInEditGroupMode = () => {
-    UI.clickTool("rectangle");
-    mouse.down();
-    mouse.up(100, 100);
-
-    UI.clickTool("rectangle");
-    mouse.down(0, 0);
-    mouse.up(100, 100);
-
-    // select the first element.
-    // The second rectangle is already reselected because it was the last element created
-    mouse.reset();
-    Keyboard.withModifierKeys({ shift: true }, () => {
-      mouse.moveTo(10, 0);
-      mouse.click();
-    });
-
-    API.executeAction(actionGroup);
-    mouse.reset();
-    mouse.moveTo(10, 0);
-    mouse.doubleClick();
-
-    Keyboard.withModifierKeys({ shift: true }, () => {
-      mouse.click();
-      mouse.moveTo(100, 100);
-      mouse.click();
-    });
-  };
-
-  it("aligns elements within a group while in group edit mode correctly to the top", () => {
-    createGroupAndSelectInEditGroupMode();
-
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(100);
-
-    API.executeAction(actionAlignTop);
-
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(0);
-  });
-  it("aligns elements within a group while in group edit mode correctly to the bottom", () => {
-    createGroupAndSelectInEditGroupMode();
-
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(100);
-
-    API.executeAction(actionAlignBottom);
-
-    expect(API.getSelectedElements()[0].y).toEqual(100);
-    expect(API.getSelectedElements()[1].y).toEqual(100);
-  });
-  it("aligns elements within a group while in group edit mode correctly to the left", () => {
-    createGroupAndSelectInEditGroupMode();
-
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(100);
-
-    API.executeAction(actionAlignLeft);
-
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(0);
-  });
-  it("aligns elements within a group while in group edit mode correctly to the right", () => {
-    createGroupAndSelectInEditGroupMode();
-
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(100);
-
-    API.executeAction(actionAlignRight);
-
-    expect(API.getSelectedElements()[0].x).toEqual(100);
-    expect(API.getSelectedElements()[1].x).toEqual(100);
-  });
-  it("aligns elements within a group while in group edit mode correctly to the vertical center", () => {
-    createGroupAndSelectInEditGroupMode();
-
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(100);
-
-    API.executeAction(actionAlignVerticallyCentered);
-
-    expect(API.getSelectedElements()[0].y).toEqual(50);
-    expect(API.getSelectedElements()[1].y).toEqual(50);
-  });
-  it("aligns elements within a group while in group edit mode correctly to the horizontal center", () => {
-    createGroupAndSelectInEditGroupMode();
-
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(100);
-
-    API.executeAction(actionAlignHorizontallyCentered);
-
-    expect(API.getSelectedElements()[0].x).toEqual(50);
-    expect(API.getSelectedElements()[1].x).toEqual(50);
-  });
-
-  const createNestedGroupAndSelectInEditGroupMode = () => {
-    UI.clickTool("rectangle");
-    mouse.down();
-    mouse.up(100, 100);
-
-    UI.clickTool("rectangle");
-    mouse.down(0, 0);
-    mouse.up(100, 100);
-
-    // Select the first element.
-    // The second rectangle is already reselected because it was the last element created
-    mouse.reset();
-    Keyboard.withModifierKeys({ shift: true }, () => {
-      mouse.moveTo(10, 0);
-      mouse.click();
-    });
-
-    API.executeAction(actionGroup);
-
-    mouse.reset();
-    mouse.moveTo(200, 200);
-    // create third element
-    UI.clickTool("rectangle");
-    mouse.down(0, 0);
-    mouse.up(100, 100);
-
-    // third element is already selected, select the initial group and group together
-    mouse.reset();
-
-    Keyboard.withModifierKeys({ shift: true }, () => {
-      mouse.moveTo(10, 0);
-      mouse.click();
-    });
-
-    API.executeAction(actionGroup);
-
-    // double click to enter edit mode
-    mouse.doubleClick();
-
-    // select nested group and other element within the group
-    Keyboard.withModifierKeys({ shift: true }, () => {
-      mouse.moveTo(200, 200);
-      mouse.click();
-    });
-  };
-
-  it("aligns element and nested group while in group edit mode correctly to the top", () => {
-    createNestedGroupAndSelectInEditGroupMode();
-
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(100);
-    expect(API.getSelectedElements()[2].y).toEqual(200);
-
-    API.executeAction(actionAlignTop);
-
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(100);
-    expect(API.getSelectedElements()[2].y).toEqual(0);
-  });
-  it("aligns element and nested group while in group edit mode correctly to the bottom", () => {
-    createNestedGroupAndSelectInEditGroupMode();
-
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(100);
-    expect(API.getSelectedElements()[2].y).toEqual(200);
-
-    API.executeAction(actionAlignBottom);
-
-    expect(API.getSelectedElements()[0].y).toEqual(100);
-    expect(API.getSelectedElements()[1].y).toEqual(200);
-    expect(API.getSelectedElements()[2].y).toEqual(200);
-  });
-  it("aligns element and nested group while in group edit mode correctly to the left", () => {
-    createNestedGroupAndSelectInEditGroupMode();
-
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(100);
-    expect(API.getSelectedElements()[2].x).toEqual(200);
-
-    API.executeAction(actionAlignLeft);
-
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(100);
-    expect(API.getSelectedElements()[2].x).toEqual(0);
-  });
-  it("aligns element and nested group while in group edit mode correctly to the right", () => {
-    createNestedGroupAndSelectInEditGroupMode();
-
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(100);
-    expect(API.getSelectedElements()[2].x).toEqual(200);
-
-    API.executeAction(actionAlignRight);
-
-    expect(API.getSelectedElements()[0].x).toEqual(100);
-    expect(API.getSelectedElements()[1].x).toEqual(200);
-    expect(API.getSelectedElements()[2].x).toEqual(200);
-  });
-  it("aligns element and nested group while in group edit mode correctly to the vertical center", () => {
-    createNestedGroupAndSelectInEditGroupMode();
-
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(100);
-    expect(API.getSelectedElements()[2].y).toEqual(200);
-
-    API.executeAction(actionAlignVerticallyCentered);
-
-    expect(API.getSelectedElements()[0].y).toEqual(50);
-    expect(API.getSelectedElements()[1].y).toEqual(150);
-    expect(API.getSelectedElements()[2].y).toEqual(100);
-  });
-  it("aligns elements and nested group within a group while in group edit mode correctly to the horizontal center", () => {
-    createNestedGroupAndSelectInEditGroupMode();
-
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(100);
-    expect(API.getSelectedElements()[2].x).toEqual(200);
-
-    API.executeAction(actionAlignHorizontallyCentered);
-
-    expect(API.getSelectedElements()[0].x).toEqual(50);
-    expect(API.getSelectedElements()[1].x).toEqual(150);
-    expect(API.getSelectedElements()[2].x).toEqual(100);
-  });
-
-  const createAndSelectSingleGroup = () => {
-    UI.clickTool("rectangle");
-    mouse.down();
-    mouse.up(100, 100);
-
-    UI.clickTool("rectangle");
-    mouse.down(0, 0);
-    mouse.up(100, 100);
-
-    // Select the first element.
-    // The second rectangle is already reselected because it was the last element created
-    mouse.reset();
-    Keyboard.withModifierKeys({ shift: true }, () => {
-      mouse.moveTo(10, 0);
-      mouse.click();
-    });
-
-    API.executeAction(actionGroup);
-  };
-
-  it("aligns elements within a single-selected group correctly to the top", () => {
-    createAndSelectSingleGroup();
-
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(100);
-
-    API.executeAction(actionAlignTop);
-
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(0);
-  });
-  it("aligns elements within a single-selected group correctly to the bottom", () => {
-    createAndSelectSingleGroup();
-
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(100);
-
-    API.executeAction(actionAlignBottom);
-
-    expect(API.getSelectedElements()[0].y).toEqual(100);
-    expect(API.getSelectedElements()[1].y).toEqual(100);
-  });
-  it("aligns elements within a single-selected group correctly to the left", () => {
-    createAndSelectSingleGroup();
-
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(100);
-
-    API.executeAction(actionAlignLeft);
-
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(0);
-  });
-  it("aligns elements within a single-selected group correctly to the right", () => {
-    createAndSelectSingleGroup();
-
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(100);
-
-    API.executeAction(actionAlignRight);
-
-    expect(API.getSelectedElements()[0].x).toEqual(100);
-    expect(API.getSelectedElements()[1].x).toEqual(100);
-  });
-  it("aligns elements within a single-selected group correctly to the vertical center", () => {
-    createAndSelectSingleGroup();
-
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(100);
-
-    API.executeAction(actionAlignVerticallyCentered);
-
-    expect(API.getSelectedElements()[0].y).toEqual(50);
-    expect(API.getSelectedElements()[1].y).toEqual(50);
-  });
-  it("aligns elements within a single-selected group correctly to the horizontal center", () => {
-    createAndSelectSingleGroup();
-
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(100);
-
-    API.executeAction(actionAlignHorizontallyCentered);
-
-    expect(API.getSelectedElements()[0].x).toEqual(50);
-    expect(API.getSelectedElements()[1].x).toEqual(50);
-  });
-
-  const createAndSelectSingleGroupWithNestedGroup = () => {
-    UI.clickTool("rectangle");
-    mouse.down();
-    mouse.up(100, 100);
-
-    UI.clickTool("rectangle");
-    mouse.down(0, 0);
-    mouse.up(100, 100);
-
-    // Select the first element.
-    // The second rectangle is already reselected because it was the last element created
-    mouse.reset();
-    Keyboard.withModifierKeys({ shift: true }, () => {
-      mouse.moveTo(10, 0);
-      mouse.click();
-    });
-
-    API.executeAction(actionGroup);
-
-    mouse.reset();
-    UI.clickTool("rectangle");
-    mouse.down(200, 200);
-    mouse.up(100, 100);
-
-    // Add group to current selection
-    mouse.restorePosition(10, 0);
-    Keyboard.withModifierKeys({ shift: true }, () => {
-      mouse.click();
-    });
-
-    // Create the nested group
-    API.executeAction(actionGroup);
-  };
-  it("aligns elements within a single-selected group containing a nested group correctly to the top", () => {
-    createAndSelectSingleGroupWithNestedGroup();
-
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(100);
-    expect(API.getSelectedElements()[2].y).toEqual(200);
-
-    API.executeAction(actionAlignTop);
-
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(100);
-    expect(API.getSelectedElements()[2].y).toEqual(0);
-  });
-  it("aligns elements within a single-selected group containing a nested group correctly to the bottom", () => {
-    createAndSelectSingleGroupWithNestedGroup();
-
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(100);
-    expect(API.getSelectedElements()[2].y).toEqual(200);
-
-    API.executeAction(actionAlignBottom);
-
-    expect(API.getSelectedElements()[0].y).toEqual(100);
-    expect(API.getSelectedElements()[1].y).toEqual(200);
-    expect(API.getSelectedElements()[2].y).toEqual(200);
-  });
-  it("aligns elements within a single-selected group containing a nested group correctly to the left", () => {
-    createAndSelectSingleGroupWithNestedGroup();
-
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(100);
-    expect(API.getSelectedElements()[2].x).toEqual(200);
-
-    API.executeAction(actionAlignLeft);
-
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(100);
-    expect(API.getSelectedElements()[2].x).toEqual(0);
-  });
-  it("aligns elements within a single-selected group containing a nested group correctly to the right", () => {
-    createAndSelectSingleGroupWithNestedGroup();
-
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(100);
-    expect(API.getSelectedElements()[2].x).toEqual(200);
-
-    API.executeAction(actionAlignRight);
-
-    expect(API.getSelectedElements()[0].x).toEqual(100);
-    expect(API.getSelectedElements()[1].x).toEqual(200);
-    expect(API.getSelectedElements()[2].x).toEqual(200);
-  });
-  it("aligns elements within a single-selected group containing a nested group correctly to the vertical center", () => {
-    createAndSelectSingleGroupWithNestedGroup();
-
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(100);
-    expect(API.getSelectedElements()[2].y).toEqual(200);
-
-    API.executeAction(actionAlignVerticallyCentered);
-
-    expect(API.getSelectedElements()[0].y).toEqual(50);
-    expect(API.getSelectedElements()[1].y).toEqual(150);
-    expect(API.getSelectedElements()[2].y).toEqual(100);
-  });
-  it("aligns elements within a single-selected group containing a nested group correctly to the horizontal center", () => {
-    createAndSelectSingleGroupWithNestedGroup();
-
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(100);
-    expect(API.getSelectedElements()[2].x).toEqual(200);
-
-    API.executeAction(actionAlignHorizontallyCentered);
-
-    expect(API.getSelectedElements()[0].x).toEqual(50);
-    expect(API.getSelectedElements()[1].x).toEqual(150);
-    expect(API.getSelectedElements()[2].x).toEqual(100);
-  });
 });

packages/element/tests/binding.test.tsx

@@ -155,10 +155,10 @@ describe("element binding", () => {
       // NOTE this mouse down/up + await needs to be done in order to repro
       // the issue, due to https://github.com/excalidraw/excalidraw/blob/46bff3daceb602accf60c40a84610797260fca94/src/components/App.tsx#L740
       mouse.reset();
-      expect(h.state.selectedLinearElement?.isEditing).toBe(true);
+      expect(h.state.editingLinearElement).not.toBe(null);
       mouse.down(0, 0);
       await new Promise((r) => setTimeout(r, 100));
-      expect(h.state.selectedLinearElement?.isEditing).toBe(false);
+      expect(h.state.editingLinearElement).toBe(null);
       expect(API.getSelectedElement().type).toBe("rectangle");
       mouse.up();
       expect(API.getSelectedElement().type).toBe("rectangle");

packages/element/tests/delta.test.tsx

@@ -1,328 +1,13 @@
-import { API } from "@excalidraw/excalidraw/tests/helpers/api";
-
 import type { ObservedAppState } from "@excalidraw/excalidraw/types";
 import type { LinearElementEditor } from "@excalidraw/element";
-import type { SceneElementsMap } from "@excalidraw/element/types";
 
-import { AppStateDelta, Delta, ElementsDelta } from "../src/delta";
-
-describe("ElementsDelta", () => {
-  describe("elements delta calculation", () => {
-    it("should not create removed delta when element gets removed but was already deleted", () => {
-      const element = API.createElement({
-        type: "rectangle",
-        x: 100,
-        y: 100,
-        isDeleted: true,
-      });
-
-      const prevElements = new Map([[element.id, element]]);
-      const nextElements = new Map();
-
-      const delta = ElementsDelta.calculate(prevElements, nextElements);
-
-      expect(delta.isEmpty()).toBeTruthy();
-    });
-
-    it("should not create added delta when adding element as already deleted", () => {
-      const element = API.createElement({
-        type: "rectangle",
-        x: 100,
-        y: 100,
-        isDeleted: true,
-      });
-
-      const prevElements = new Map();
-      const nextElements = new Map([[element.id, element]]);
-
-      const delta = ElementsDelta.calculate(prevElements, nextElements);
-
-      expect(delta.isEmpty()).toBeTruthy();
-    });
-
-    it("should not create updated delta when there is only version and versionNonce change", () => {
-      const baseElement = API.createElement({
-        type: "rectangle",
-        x: 100,
-        y: 100,
-        strokeColor: "#000000",
-        backgroundColor: "#ffffff",
-      });
-
-      const modifiedElement = {
-        ...baseElement,
-        version: baseElement.version + 1,
-        versionNonce: baseElement.versionNonce + 1,
-      };
-
-      // Create maps for the delta calculation
-      const prevElements = new Map([[baseElement.id, baseElement]]);
-      const nextElements = new Map([[modifiedElement.id, modifiedElement]]);
-
-      // Calculate the delta
-      const delta = ElementsDelta.calculate(
-        prevElements as SceneElementsMap,
-        nextElements as SceneElementsMap,
-      );
-
-      expect(delta.isEmpty()).toBeTruthy();
-    });
-  });
-
-  describe("squash", () => {
-    it("should not squash when second delta is empty", () => {
-      const updatedDelta = Delta.create(
-        { x: 100, version: 1, versionNonce: 1 },
-        { x: 200, version: 2, versionNonce: 2 },
-      );
-
-      const elementsDelta1 = ElementsDelta.create(
-        {},
-        {},
-        { id1: updatedDelta },
-      );
-      const elementsDelta2 = ElementsDelta.empty();
-      const elementsDelta = elementsDelta1.squash(elementsDelta2);
-
-      expect(elementsDelta.isEmpty()).toBeFalsy();
-      expect(elementsDelta).toBe(elementsDelta1);
-      expect(elementsDelta.updated.id1).toBe(updatedDelta);
-    });
-
-    it("should squash mutually exclusive delta types", () => {
-      const addedDelta = Delta.create(
-        { x: 100, version: 1, versionNonce: 1, isDeleted: true },
-        { x: 200, version: 2, versionNonce: 2, isDeleted: false },
-      );
-
-      const removedDelta = Delta.create(
-        { x: 100, version: 1, versionNonce: 1, isDeleted: false },
-        { x: 200, version: 2, versionNonce: 2, isDeleted: true },
-      );
-
-      const updatedDelta = Delta.create(
-        { x: 100, version: 1, versionNonce: 1 },
-        { x: 200, version: 2, versionNonce: 2 },
-      );
-
-      const elementsDelta1 = ElementsDelta.create(
-        { id1: addedDelta },
-        { id2: removedDelta },
-        {},
-      );
-
-      const elementsDelta2 = ElementsDelta.create(
-        {},
-        {},
-        { id3: updatedDelta },
-      );
-
-      const elementsDelta = elementsDelta1.squash(elementsDelta2);
-
-      expect(elementsDelta.isEmpty()).toBeFalsy();
-      expect(elementsDelta).toBe(elementsDelta1);
-      expect(elementsDelta.added.id1).toBe(addedDelta);
-      expect(elementsDelta.removed.id2).toBe(removedDelta);
-      expect(elementsDelta.updated.id3).toBe(updatedDelta);
-    });
-
-    it("should squash the same delta types", () => {
-      const elementsDelta1 = ElementsDelta.create(
-        {
-          id1: Delta.create(
-            { x: 100, version: 1, versionNonce: 1, isDeleted: true },
-            { x: 200, version: 2, versionNonce: 2, isDeleted: false },
-          ),
-        },
-        {
-          id2: Delta.create(
-            { x: 100, version: 1, versionNonce: 1, isDeleted: false },
-            { x: 200, version: 2, versionNonce: 2, isDeleted: true },
-          ),
-        },
-        {
-          id3: Delta.create(
-            { x: 100, version: 1, versionNonce: 1 },
-            { x: 200, version: 2, versionNonce: 2 },
-          ),
-        },
-      );
-
-      const elementsDelta2 = ElementsDelta.create(
-        {
-          id1: Delta.create(
-            { y: 100, version: 2, versionNonce: 2, isDeleted: true },
-            { y: 200, version: 3, versionNonce: 3, isDeleted: false },
-          ),
-        },
-        {
-          id2: Delta.create(
-            { y: 100, version: 2, versionNonce: 2, isDeleted: false },
-            { y: 200, version: 3, versionNonce: 3, isDeleted: true },
-          ),
-        },
-        {
-          id3: Delta.create(
-            { y: 100, version: 2, versionNonce: 2 },
-            { y: 200, version: 3, versionNonce: 3 },
-          ),
-        },
-      );
-
-      const elementsDelta = elementsDelta1.squash(elementsDelta2);
-
-      expect(elementsDelta.isEmpty()).toBeFalsy();
-      expect(elementsDelta).toBe(elementsDelta1);
-      expect(elementsDelta.added.id1).toEqual(
-        Delta.create(
-          { x: 100, y: 100, version: 2, versionNonce: 2, isDeleted: true },
-          { x: 200, y: 200, version: 3, versionNonce: 3, isDeleted: false },
-        ),
-      );
-      expect(elementsDelta.removed.id2).toEqual(
-        Delta.create(
-          { x: 100, y: 100, version: 2, versionNonce: 2, isDeleted: false },
-          { x: 200, y: 200, version: 3, versionNonce: 3, isDeleted: true },
-        ),
-      );
-      expect(elementsDelta.updated.id3).toEqual(
-        Delta.create(
-          { x: 100, y: 100, version: 2, versionNonce: 2 },
-          { x: 200, y: 200, version: 3, versionNonce: 3 },
-        ),
-      );
-    });
-
-    it("should squash different delta types ", () => {
-      // id1: added   -> updated => added
-      // id2: removed -> added   => added
-      // id3: updated -> removed => removed
-      const elementsDelta1 = ElementsDelta.create(
-        {
-          id1: Delta.create(
-            { x: 100, version: 1, versionNonce: 1, isDeleted: true },
-            { x: 101, version: 2, versionNonce: 2, isDeleted: false },
-          ),
-        },
-        {
-          id2: Delta.create(
-            { x: 200, version: 1, versionNonce: 1, isDeleted: false },
-            { x: 201, version: 2, versionNonce: 2, isDeleted: true },
-          ),
-        },
-        {
-          id3: Delta.create(
-            { x: 300, version: 1, versionNonce: 1 },
-            { x: 301, version: 2, versionNonce: 2 },
-          ),
-        },
-      );
-
-      const elementsDelta2 = ElementsDelta.create(
-        {
-          id2: Delta.create(
-            { y: 200, version: 2, versionNonce: 2, isDeleted: true },
-            { y: 201, version: 3, versionNonce: 3, isDeleted: false },
-          ),
-        },
-        {
-          id3: Delta.create(
-            { y: 300, version: 2, versionNonce: 2, isDeleted: false },
-            { y: 301, version: 3, versionNonce: 3, isDeleted: true },
-          ),
-        },
-        {
-          id1: Delta.create(
-            { y: 100, version: 2, versionNonce: 2 },
-            { y: 101, version: 3, versionNonce: 3 },
-          ),
-        },
-      );
-
-      const elementsDelta = elementsDelta1.squash(elementsDelta2);
-
-      expect(elementsDelta.isEmpty()).toBeFalsy();
-      expect(elementsDelta).toBe(elementsDelta1);
-      expect(elementsDelta.added).toEqual({
-        id1: Delta.create(
-          { x: 100, y: 100, version: 2, versionNonce: 2, isDeleted: true },
-          { x: 101, y: 101, version: 3, versionNonce: 3, isDeleted: false },
-        ),
-        id2: Delta.create(
-          { x: 200, y: 200, version: 2, versionNonce: 2, isDeleted: true },
-          { x: 201, y: 201, version: 3, versionNonce: 3, isDeleted: false },
-        ),
-      });
-      expect(elementsDelta.removed).toEqual({
-        id3: Delta.create(
-          { x: 300, y: 300, version: 2, versionNonce: 2, isDeleted: false },
-          { x: 301, y: 301, version: 3, versionNonce: 3, isDeleted: true },
-        ),
-      });
-      expect(elementsDelta.updated).toEqual({});
-    });
-
-    it("should squash bound elements", () => {
-      const elementsDelta1 = ElementsDelta.create(
-        {},
-        {},
-        {
-          id1: Delta.create(
-            {
-              version: 1,
-              versionNonce: 1,
-              boundElements: [{ id: "t1", type: "text" }],
-            },
-            {
-              version: 2,
-              versionNonce: 2,
-              boundElements: [{ id: "t2", type: "text" }],
-            },
-          ),
-        },
-      );
-
-      const elementsDelta2 = ElementsDelta.create(
-        {},
-        {},
-        {
-          id1: Delta.create(
-            {
-              version: 2,
-              versionNonce: 2,
-              boundElements: [{ id: "a1", type: "arrow" }],
-            },
-            {
-              version: 3,
-              versionNonce: 3,
-              boundElements: [{ id: "a2", type: "arrow" }],
-            },
-          ),
-        },
-      );
-
-      const elementsDelta = elementsDelta1.squash(elementsDelta2);
-
-      expect(elementsDelta.updated.id1.deleted.boundElements).toEqual([
-        { id: "t1", type: "text" },
-        { id: "a1", type: "arrow" },
-      ]);
-      expect(elementsDelta.updated.id1.inserted.boundElements).toEqual([
-        { id: "t2", type: "text" },
-        { id: "a2", type: "arrow" },
-      ]);
-    });
-  });
-});
+import { AppStateDelta } from "../src/delta";
 
 describe("AppStateDelta", () => {
   describe("ensure stable delta properties order", () => {
     it("should maintain stable order for root properties", () => {
       const name = "untitled scene";
-      const selectedLinearElement = {
-        elementId: "id1" as LinearElementEditor["elementId"],
-        isEditing: false,
-      };
+      const selectedLinearElementId = "id1" as LinearElementEditor["elementId"];
 
       const commonAppState = {
         viewBackgroundColor: "#ffffff",
@@ -331,7 +16,6 @@ describe("AppStateDelta", () => {
         editingGroupId: null,
         croppingElementId: null,
         editingLinearElementId: null,
-        selectedLinearElementIsEditing: null,
         lockedMultiSelections: {},
         activeLockedId: null,
       };
@@ -339,23 +23,23 @@ describe("AppStateDelta", () => {
       const prevAppState1: ObservedAppState = {
         ...commonAppState,
         name: "",
-        selectedLinearElement: null,
+        selectedLinearElementId: null,
       };
 
       const nextAppState1: ObservedAppState = {
         ...commonAppState,
         name,
-        selectedLinearElement,
+        selectedLinearElementId,
       };
 
       const prevAppState2: ObservedAppState = {
-        selectedLinearElement: null,
+        selectedLinearElementId: null,
         name: "",
         ...commonAppState,
       };
 
       const nextAppState2: ObservedAppState = {
-        selectedLinearElement,
+        selectedLinearElementId,
         name,
         ...commonAppState,
       };
@@ -373,7 +57,8 @@ describe("AppStateDelta", () => {
         selectedGroupIds: {},
         editingGroupId: null,
         croppingElementId: null,
-        selectedLinearElement: null,
+        selectedLinearElementId: null,
+        editingLinearElementId: null,
         activeLockedId: null,
         lockedMultiSelections: {},
       };
@@ -419,7 +104,8 @@ describe("AppStateDelta", () => {
         selectedElementIds: {},
         editingGroupId: null,
         croppingElementId: null,
-        selectedLinearElement: null,
+        selectedLinearElementId: null,
+        editingLinearElementId: null,
         activeLockedId: null,
         lockedMultiSelections: {},
       };
@@ -460,97 +146,4 @@ describe("AppStateDelta", () => {
       expect(JSON.stringify(delta1)).toBe(JSON.stringify(delta2));
     });
   });
-
-  describe("squash", () => {
-    it("should not squash when second delta is empty", () => {
-      const delta = Delta.create(
-        { name: "untitled scene" },
-        { name: "titled scene" },
-      );
-
-      const appStateDelta1 = AppStateDelta.create(delta);
-      const appStateDelta2 = AppStateDelta.empty();
-      const appStateDelta = appStateDelta1.squash(appStateDelta2);
-
-      expect(appStateDelta.isEmpty()).toBeFalsy();
-      expect(appStateDelta).toBe(appStateDelta1);
-      expect(appStateDelta.delta).toBe(delta);
-    });
-
-    it("should squash exclusive properties", () => {
-      const delta1 = Delta.create(
-        { name: "untitled scene" },
-        { name: "titled scene" },
-      );
-      const delta2 = Delta.create(
-        { viewBackgroundColor: "#ffffff" },
-        { viewBackgroundColor: "#000000" },
-      );
-
-      const appStateDelta1 = AppStateDelta.create(delta1);
-      const appStateDelta2 = AppStateDelta.create(delta2);
-      const appStateDelta = appStateDelta1.squash(appStateDelta2);
-
-      expect(appStateDelta.isEmpty()).toBeFalsy();
-      expect(appStateDelta).toBe(appStateDelta1);
-      expect(appStateDelta.delta).toEqual(
-        Delta.create(
-          { name: "untitled scene", viewBackgroundColor: "#ffffff" },
-          { name: "titled scene", viewBackgroundColor: "#000000" },
-        ),
-      );
-    });
-
-    it("should squash selectedElementIds, selectedGroupIds and lockedMultiSelections", () => {
-      const delta1 = Delta.create<Partial<ObservedAppState>>(
-        {
-          name: "untitled scene",
-          selectedElementIds: { id1: true },
-          selectedGroupIds: {},
-          lockedMultiSelections: { g1: true },
-        },
-        {
-          name: "titled scene",
-          selectedElementIds: { id2: true },
-          selectedGroupIds: { g1: true },
-          lockedMultiSelections: {},
-        },
-      );
-      const delta2 = Delta.create<Partial<ObservedAppState>>(
-        {
-          selectedElementIds: { id3: true },
-          selectedGroupIds: { g1: true },
-          lockedMultiSelections: {},
-        },
-        {
-          selectedElementIds: { id2: true },
-          selectedGroupIds: { g2: true, g3: true },
-          lockedMultiSelections: { g3: true },
-        },
-      );
-
-      const appStateDelta1 = AppStateDelta.create(delta1);
-      const appStateDelta2 = AppStateDelta.create(delta2);
-      const appStateDelta = appStateDelta1.squash(appStateDelta2);
-
-      expect(appStateDelta.isEmpty()).toBeFalsy();
-      expect(appStateDelta).toBe(appStateDelta1);
-      expect(appStateDelta.delta).toEqual(
-        Delta.create<Partial<ObservedAppState>>(
-          {
-            name: "untitled scene",
-            selectedElementIds: { id1: true, id3: true },
-            selectedGroupIds: { g1: true },
-            lockedMultiSelections: { g1: true },
-          },
-          {
-            name: "titled scene",
-            selectedElementIds: { id2: true },
-            selectedGroupIds: { g1: true, g2: true, g3: true },
-            lockedMultiSelections: { g3: true },
-          },
-        ),
-      );
-    });
-  });
 });

packages/element/tests/distribute.test.tsx

@@ -1,128 +0,0 @@
-import {
-  distributeHorizontally,
-  distributeVertically,
-} from "@excalidraw/excalidraw/actions";
-import { defaultLang, setLanguage } from "@excalidraw/excalidraw/i18n";
-import { Excalidraw } from "@excalidraw/excalidraw";
-
-import { API } from "@excalidraw/excalidraw/tests/helpers/api";
-import { UI, Pointer, Keyboard } from "@excalidraw/excalidraw/tests/helpers/ui";
-import {
-  act,
-  unmountComponent,
-  render,
-} from "@excalidraw/excalidraw/tests/test-utils";
-
-const mouse = new Pointer("mouse");
-
-// Scenario: three rectangles that will be distributed with gaps
-const createAndSelectThreeRectanglesWithGap = () => {
-  UI.clickTool("rectangle");
-  mouse.down();
-  mouse.up(100, 100);
-  mouse.reset();
-
-  UI.clickTool("rectangle");
-  mouse.down(10, 10);
-  mouse.up(100, 100);
-  mouse.reset();
-
-  UI.clickTool("rectangle");
-  mouse.down(300, 300);
-  mouse.up(100, 100);
-  mouse.reset();
-
-  // Last rectangle is selected by default
-  Keyboard.withModifierKeys({ shift: true }, () => {
-    mouse.click(0, 10);
-    mouse.click(10, 0);
-  });
-};
-
-// Scenario: three rectangles that will be distributed by their centers
-const createAndSelectThreeRectanglesWithoutGap = () => {
-  UI.clickTool("rectangle");
-  mouse.down();
-  mouse.up(100, 100);
-  mouse.reset();
-
-  UI.clickTool("rectangle");
-  mouse.down(10, 10);
-  mouse.up(200, 200);
-  mouse.reset();
-
-  UI.clickTool("rectangle");
-  mouse.down(200, 200);
-  mouse.up(100, 100);
-  mouse.reset();
-
-  // Last rectangle is selected by default
-  Keyboard.withModifierKeys({ shift: true }, () => {
-    mouse.click(0, 10);
-    mouse.click(10, 0);
-  });
-};
-
-describe("distributing", () => {
-  beforeEach(async () => {
-    unmountComponent();
-    mouse.reset();
-
-    await act(() => {
-      return setLanguage(defaultLang);
-    });
-    await render(<Excalidraw handleKeyboardGlobally={true} />);
-  });
-
-  it("should distribute selected elements horizontally", async () => {
-    createAndSelectThreeRectanglesWithGap();
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(10);
-    expect(API.getSelectedElements()[2].x).toEqual(300);
-
-    API.executeAction(distributeHorizontally);
-
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(150);
-    expect(API.getSelectedElements()[2].x).toEqual(300);
-  });
-
-  it("should distribute selected elements vertically", async () => {
-    createAndSelectThreeRectanglesWithGap();
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(10);
-    expect(API.getSelectedElements()[2].y).toEqual(300);
-
-    API.executeAction(distributeVertically);
-
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(150);
-    expect(API.getSelectedElements()[2].y).toEqual(300);
-  });
-
-  it("should distribute selected elements horizontally based on their centers", async () => {
-    createAndSelectThreeRectanglesWithoutGap();
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(10);
-    expect(API.getSelectedElements()[2].x).toEqual(200);
-
-    API.executeAction(distributeHorizontally);
-
-    expect(API.getSelectedElements()[0].x).toEqual(0);
-    expect(API.getSelectedElements()[1].x).toEqual(50);
-    expect(API.getSelectedElements()[2].x).toEqual(200);
-  });
-
-  it("should distribute selected elements vertically with based on their centers", async () => {
-    createAndSelectThreeRectanglesWithoutGap();
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(10);
-    expect(API.getSelectedElements()[2].y).toEqual(200);
-
-    API.executeAction(distributeVertically);
-
-    expect(API.getSelectedElements()[0].y).toEqual(0);
-    expect(API.getSelectedElements()[1].y).toEqual(50);
-    expect(API.getSelectedElements()[2].y).toEqual(200);
-  });
-});

packages/element/tests/embeddable.test.ts

@@ -1,153 +0,0 @@
-import { getEmbedLink } from "../src/embeddable";
-
-describe("YouTube timestamp parsing", () => {
-  it("should parse YouTube URLs with timestamp in seconds", () => {
-    const testCases = [
-      {
-        url: "https://www.youtube.com/watch?v=dQw4w9WgXcQ&t=90",
-        expectedStart: 90,
-      },
-      {
-        url: "https://youtu.be/dQw4w9WgXcQ?t=120",
-        expectedStart: 120,
-      },
-      {
-        url: "https://www.youtube.com/watch?v=dQw4w9WgXcQ&start=150",
-        expectedStart: 150,
-      },
-    ];
-
-    testCases.forEach(({ url, expectedStart }) => {
-      const result = getEmbedLink(url);
-      expect(result).toBeTruthy();
-      expect(result?.type).toBe("video");
-      if (result?.type === "video" || result?.type === "generic") {
-        expect(result.link).toContain(`start=${expectedStart}`);
-      }
-    });
-  });
-
-  it("should parse YouTube URLs with timestamp in time format", () => {
-    const testCases = [
-      {
-        url: "https://www.youtube.com/watch?v=dQw4w9WgXcQ&t=1m30s",
-        expectedStart: 90, // 1*60 + 30
-      },
-      {
-        url: "https://youtu.be/dQw4w9WgXcQ?t=2m45s",
-        expectedStart: 165, // 2*60 + 45
-      },
-      {
-        url: "https://www.youtube.com/watch?v=dQw4w9WgXcQ&t=1h2m3s",
-        expectedStart: 3723, // 1*3600 + 2*60 + 3
-      },
-      {
-        url: "https://www.youtube.com/watch?v=dQw4w9WgXcQ&t=45s",
-        expectedStart: 45,
-      },
-      {
-        url: "https://www.youtube.com/watch?v=dQw4w9WgXcQ&t=5m",
-        expectedStart: 300, // 5*60
-      },
-      {
-        url: "https://www.youtube.com/watch?v=dQw4w9WgXcQ&t=2h",
-        expectedStart: 7200, // 2*3600
-      },
-    ];
-
-    testCases.forEach(({ url, expectedStart }) => {
-      const result = getEmbedLink(url);
-      expect(result).toBeTruthy();
-      expect(result?.type).toBe("video");
-      if (result?.type === "video" || result?.type === "generic") {
-        expect(result.link).toContain(`start=${expectedStart}`);
-      }
-    });
-  });
-
-  it("should handle YouTube URLs without timestamps", () => {
-    const testCases = [
-      "https://www.youtube.com/watch?v=dQw4w9WgXcQ",
-      "https://youtu.be/dQw4w9WgXcQ",
-      "https://www.youtube.com/embed/dQw4w9WgXcQ",
-    ];
-
-    testCases.forEach((url) => {
-      const result = getEmbedLink(url);
-      expect(result).toBeTruthy();
-      expect(result?.type).toBe("video");
-      if (result?.type === "video" || result?.type === "generic") {
-        expect(result.link).not.toContain("start=");
-      }
-    });
-  });
-
-  it("should handle YouTube shorts URLs with timestamps", () => {
-    const url = "https://www.youtube.com/shorts/dQw4w9WgXcQ?t=30";
-    const result = getEmbedLink(url);
-
-    expect(result).toBeTruthy();
-    expect(result?.type).toBe("video");
-    if (result?.type === "video" || result?.type === "generic") {
-      expect(result.link).toContain("start=30");
-    }
-    // Shorts should have portrait aspect ratio
-    expect(result?.intrinsicSize).toEqual({ w: 315, h: 560 });
-  });
-
-  it("should handle playlist URLs with timestamps", () => {
-    const url =
-      "https://www.youtube.com/playlist?list=PLrAXtmRdnEQy1KbG5lbfgQ0-PKQY6FKYZ&t=60";
-    const result = getEmbedLink(url);
-
-    expect(result).toBeTruthy();
-    expect(result?.type).toBe("video");
-    if (result?.type === "video" || result?.type === "generic") {
-      expect(result.link).toContain("start=60");
-      expect(result.link).toContain("list=PLrAXtmRdnEQy1KbG5lbfgQ0-PKQY6FKYZ");
-    }
-  });
-
-  it("should handle malformed or edge case timestamps", () => {
-    const testCases = [
-      {
-        url: "https://www.youtube.com/watch?v=dQw4w9WgXcQ&t=abc",
-        expectedStart: 0, // Invalid timestamp should default to 0
-      },
-      {
-        url: "https://www.youtube.com/watch?v=dQw4w9WgXcQ&t=",
-        expectedStart: 0, // Empty timestamp should default to 0
-      },
-      {
-        url: "https://www.youtube.com/watch?v=dQw4w9WgXcQ&t=0",
-        expectedStart: 0, // Zero timestamp should be handled
-      },
-    ];
-
-    testCases.forEach(({ url, expectedStart }) => {
-      const result = getEmbedLink(url);
-      expect(result).toBeTruthy();
-      expect(result?.type).toBe("video");
-      if (result?.type === "video" || result?.type === "generic") {
-        if (expectedStart === 0) {
-          expect(result.link).not.toContain("start=");
-        } else {
-          expect(result.link).toContain(`start=${expectedStart}`);
-        }
-      }
-    });
-  });
-
-  it("should preserve other URL parameters", () => {
-    const url =
-      "https://www.youtube.com/watch?v=dQw4w9WgXcQ&t=90&feature=youtu.be&list=PLtest";
-    const result = getEmbedLink(url);
-
-    expect(result).toBeTruthy();
-    expect(result?.type).toBe("video");
-    if (result?.type === "video" || result?.type === "generic") {
-      expect(result.link).toContain("start=90");
-      expect(result.link).toContain("enablejsapi=1");
-    }
-  });
-});

packages/element/tests/linearElementEditor.test.tsx

@@ -136,8 +136,7 @@ describe("Test Linear Elements", () => {
     Keyboard.withModifierKeys({ ctrl: true }, () => {
       Keyboard.keyPress(KEYS.ENTER);
     });
-    expect(h.state.selectedLinearElement?.isEditing).toBe(true);
-    expect(h.state.selectedLinearElement?.elementId).toEqual(line.id);
+    expect(h.state.editingLinearElement?.elementId).toEqual(line.id);
   };
 
   const drag = (startPoint: GlobalPoint, endPoint: GlobalPoint) => {
@@ -254,82 +253,75 @@ describe("Test Linear Elements", () => {
     });
     fireEvent.click(queryByText(contextMenu as HTMLElement, "Edit line")!);
 
-    expect(h.state.selectedLinearElement?.isEditing).toBe(true);
-    expect(h.state.selectedLinearElement?.elementId).toEqual(h.elements[0].id);
+    expect(h.state.editingLinearElement?.elementId).toEqual(h.elements[0].id);
   });
 
   it("should enter line editor via enter (line)", () => {
     createTwoPointerLinearElement("line");
-    expect(h.state.selectedLinearElement?.isEditing).toBe(false);
+    expect(h.state.editingLinearElement?.elementId).toBeUndefined();
 
     mouse.clickAt(midpoint[0], midpoint[1]);
     Keyboard.keyPress(KEYS.ENTER);
-    expect(h.state.selectedLinearElement?.isEditing).toBe(true);
-    expect(h.state.selectedLinearElement?.elementId).toEqual(h.elements[0].id);
+    expect(h.state.editingLinearElement?.elementId).toEqual(h.elements[0].id);
   });
 
   // ctrl+enter alias (to align with arrows)
   it("should enter line editor via ctrl+enter (line)", () => {
     createTwoPointerLinearElement("line");
-    expect(h.state.selectedLinearElement?.isEditing).toBe(false);
+    expect(h.state.editingLinearElement?.elementId).toBeUndefined();
 
     mouse.clickAt(midpoint[0], midpoint[1]);
     Keyboard.withModifierKeys({ ctrl: true }, () => {
       Keyboard.keyPress(KEYS.ENTER);
     });
-    expect(h.state.selectedLinearElement?.isEditing).toBe(true);
-    expect(h.state.selectedLinearElement?.elementId).toEqual(h.elements[0].id);
+    expect(h.state.editingLinearElement?.elementId).toEqual(h.elements[0].id);
   });
 
   it("should enter line editor via ctrl+enter (arrow)", () => {
     createTwoPointerLinearElement("arrow");
-    expect(h.state.selectedLinearElement?.isEditing).toBe(false);
+    expect(h.state.editingLinearElement?.elementId).toBeUndefined();
 
     mouse.clickAt(midpoint[0], midpoint[1]);
     Keyboard.withModifierKeys({ ctrl: true }, () => {
       Keyboard.keyPress(KEYS.ENTER);
     });
-    expect(h.state.selectedLinearElement?.isEditing).toBe(true);
-    expect(h.state.selectedLinearElement?.elementId).toEqual(h.elements[0].id);
+    expect(h.state.editingLinearElement?.elementId).toEqual(h.elements[0].id);
   });
 
   it("should enter line editor on ctrl+dblclick (simple arrow)", () => {
     createTwoPointerLinearElement("arrow");
-    expect(h.state.selectedLinearElement?.isEditing).toBe(false);
+    expect(h.state.editingLinearElement?.elementId).toBeUndefined();
 
     Keyboard.withModifierKeys({ ctrl: true }, () => {
       mouse.doubleClick();
     });
-    expect(h.state.selectedLinearElement?.isEditing).toBe(true);
-    expect(h.state.selectedLinearElement?.elementId).toEqual(h.elements[0].id);
+    expect(h.state.editingLinearElement?.elementId).toEqual(h.elements[0].id);
   });
 
   it("should enter line editor on ctrl+dblclick (line)", () => {
     createTwoPointerLinearElement("line");
-    expect(h.state.selectedLinearElement?.isEditing).toBe(false);
+    expect(h.state.editingLinearElement?.elementId).toBeUndefined();
 
     Keyboard.withModifierKeys({ ctrl: true }, () => {
       mouse.doubleClick();
     });
-    expect(h.state.selectedLinearElement?.isEditing).toBe(true);
-    expect(h.state.selectedLinearElement?.elementId).toEqual(h.elements[0].id);
+    expect(h.state.editingLinearElement?.elementId).toEqual(h.elements[0].id);
   });
 
   it("should enter line editor on dblclick (line)", () => {
     createTwoPointerLinearElement("line");
-    expect(h.state.selectedLinearElement?.isEditing).toBe(false);
+    expect(h.state.editingLinearElement?.elementId).toBeUndefined();
 
     mouse.doubleClick();
-    expect(h.state.selectedLinearElement?.isEditing).toBe(true);
-    expect(h.state.selectedLinearElement?.elementId).toEqual(h.elements[0].id);
+    expect(h.state.editingLinearElement?.elementId).toEqual(h.elements[0].id);
   });
 
   it("should not enter line editor on dblclick (arrow)", async () => {
     createTwoPointerLinearElement("arrow");
-    expect(h.state.selectedLinearElement?.isEditing).toBe(false);
+    expect(h.state.editingLinearElement?.elementId).toBeUndefined();
 
     mouse.doubleClick();
-    expect(h.state.selectedLinearElement).toBe(null);
+    expect(h.state.editingLinearElement).toEqual(null);
     await getTextEditor();
   });
 
@@ -338,12 +330,10 @@ describe("Test Linear Elements", () => {
     const arrow = h.elements[0] as ExcalidrawLinearElement;
     enterLineEditingMode(arrow);
 
-    expect(h.state.selectedLinearElement?.isEditing).toBe(true);
-    expect(h.state.selectedLinearElement?.elementId).toEqual(arrow.id);
+    expect(h.state.editingLinearElement?.elementId).toEqual(arrow.id);
 
     mouse.doubleClick();
-    expect(h.state.selectedLinearElement?.isEditing).toBe(true);
-    expect(h.state.selectedLinearElement?.elementId).toEqual(arrow.id);
+    expect(h.state.editingLinearElement?.elementId).toEqual(arrow.id);
     expect(h.elements.length).toEqual(1);
 
     expect(document.querySelector(TEXT_EDITOR_SELECTOR)).toBe(null);
@@ -377,7 +367,7 @@ describe("Test Linear Elements", () => {
       // drag line from midpoint
       drag(midpoint, pointFrom(midpoint[0] + delta, midpoint[1] + delta));
       expect(renderInteractiveScene.mock.calls.length).toMatchInlineSnapshot(
-        `11`,
+        `12`,
       );
       expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`6`);
 
@@ -479,7 +469,7 @@ describe("Test Linear Elements", () => {
       drag(startPoint, endPoint);
 
       expect(renderInteractiveScene.mock.calls.length).toMatchInlineSnapshot(
-        `11`,
+        `12`,
       );
       expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`7`);
 
@@ -547,7 +537,7 @@ describe("Test Linear Elements", () => {
         );
 
         expect(renderInteractiveScene.mock.calls.length).toMatchInlineSnapshot(
-          `14`,
+          `16`,
         );
         expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`7`);
 
@@ -598,7 +588,7 @@ describe("Test Linear Elements", () => {
         drag(hitCoords, pointFrom(hitCoords[0] - delta, hitCoords[1] - delta));
 
         expect(renderInteractiveScene.mock.calls.length).toMatchInlineSnapshot(
-          `11`,
+          `12`,
         );
         expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`6`);
 
@@ -639,7 +629,7 @@ describe("Test Linear Elements", () => {
         drag(hitCoords, pointFrom(hitCoords[0] + delta, hitCoords[1] + delta));
 
         expect(renderInteractiveScene.mock.calls.length).toMatchInlineSnapshot(
-          `11`,
+          `12`,
         );
         expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`6`);
 
@@ -687,7 +677,7 @@ describe("Test Linear Elements", () => {
         deletePoint(points[2]);
         expect(line.points.length).toEqual(3);
         expect(renderInteractiveScene.mock.calls.length).toMatchInlineSnapshot(
-          `17`,
+          `18`,
         );
         expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`7`);
 
@@ -745,7 +735,7 @@ describe("Test Linear Elements", () => {
           ),
         );
         expect(renderInteractiveScene.mock.calls.length).toMatchInlineSnapshot(
-          `14`,
+          `16`,
         );
         expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`7`);
         expect(line.points.length).toEqual(5);
@@ -843,7 +833,7 @@ describe("Test Linear Elements", () => {
         drag(hitCoords, pointFrom(hitCoords[0] + delta, hitCoords[1] + delta));
 
         expect(renderInteractiveScene.mock.calls.length).toMatchInlineSnapshot(
-          `11`,
+          `12`,
         );
         expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`6`);
 

packages/excalidraw/actions/actionAlign.tsx

@@ -10,8 +10,6 @@ import { alignElements } from "@excalidraw/element";
 
 import { CaptureUpdateAction } from "@excalidraw/element";
 
-import { getSelectedElementsByGroup } from "@excalidraw/element";
-
 import type { ExcalidrawElement } from "@excalidraw/element/types";
 
 import type { Alignment } from "@excalidraw/element";
@@ -40,11 +38,7 @@ export const alignActionsPredicate = (
 ) => {
   const selectedElements = app.scene.getSelectedElements(appState);
   return (
-    getSelectedElementsByGroup(
-      selectedElements,
-      app.scene.getNonDeletedElementsMap(),
-      appState as Readonly<AppState>,
-    ).length > 1 &&
+    selectedElements.length > 1 &&
     // TODO enable aligning frames when implemented properly
     !selectedElements.some((el) => isFrameLikeElement(el))
   );
@@ -58,12 +52,7 @@ const alignSelectedElements = (
 ) => {
   const selectedElements = app.scene.getSelectedElements(appState);
 
-  const updatedElements = alignElements(
-    selectedElements,
-    alignment,
-    app.scene,
-    appState,
-  );
+  const updatedElements = alignElements(selectedElements, alignment, app.scene);
 
   const updatedElementsMap = arrayToMap(updatedElements);
 

packages/excalidraw/actions/actionCanvas.tsx

@@ -121,7 +121,7 @@ export const actionClearCanvas = register({
         pasteDialog: appState.pasteDialog,
         activeTool:
           appState.activeTool.type === "image"
-            ? { ...appState.activeTool, type: app.defaultSelectionTool }
+            ? { ...appState.activeTool, type: "selection" }
             : appState.activeTool,
       },
       captureUpdate: CaptureUpdateAction.IMMEDIATELY,
@@ -494,13 +494,13 @@ export const actionToggleEraserTool = register({
   name: "toggleEraserTool",
   label: "toolBar.eraser",
   trackEvent: { category: "toolbar" },
-  perform: (elements, appState, _, app) => {
+  perform: (elements, appState) => {
     let activeTool: AppState["activeTool"];
 
     if (isEraserActive(appState)) {
       activeTool = updateActiveTool(appState, {
         ...(appState.activeTool.lastActiveTool || {
-          type: app.defaultSelectionTool,
+          type: "selection",
         }),
         lastActiveToolBeforeEraser: null,
       });
@@ -530,9 +530,6 @@ export const actionToggleLassoTool = register({
   label: "toolBar.lasso",
   icon: LassoIcon,
   trackEvent: { category: "toolbar" },
-  predicate: (elements, appState, props, app) => {
-    return app.defaultSelectionTool !== "lasso";
-  },
   perform: (elements, appState, _, app) => {
     let activeTool: AppState["activeTool"];
 

packages/excalidraw/actions/actionDeleteSelected.tsx

@@ -205,19 +205,16 @@ export const actionDeleteSelected = register({
   icon: TrashIcon,
   trackEvent: { category: "element", action: "delete" },
   perform: (elements, appState, formData, app) => {
-    if (appState.selectedLinearElement?.isEditing) {
+    if (appState.editingLinearElement) {
       const {
         elementId,
         selectedPointsIndices,
         startBindingElement,
         endBindingElement,
-      } = appState.selectedLinearElement;
+      } = appState.editingLinearElement;
       const elementsMap = app.scene.getNonDeletedElementsMap();
-      const linearElement = LinearElementEditor.getElement(
-        elementId,
-        elementsMap,
-      );
-      if (!linearElement) {
+      const element = LinearElementEditor.getElement(elementId, elementsMap);
+      if (!element) {
         return false;
       }
       // case: no point selected → do nothing, as deleting the whole element
@@ -228,10 +225,10 @@ export const actionDeleteSelected = register({
         return false;
       }
 
-      // case: deleting all points
-      if (selectedPointsIndices.length >= linearElement.points.length) {
+      // case: deleting last remaining point
+      if (element.points.length < 2) {
         const nextElements = elements.map((el) => {
-          if (el.id === linearElement.id) {
+          if (el.id === element.id) {
             return newElementWith(el, { isDeleted: true });
           }
           return el;
@@ -242,7 +239,7 @@ export const actionDeleteSelected = register({
           elements: nextElements,
           appState: {
             ...nextAppState,
-            selectedLinearElement: null,
+            editingLinearElement: null,
           },
           captureUpdate: CaptureUpdateAction.IMMEDIATELY,
         };
@@ -255,24 +252,20 @@ export const actionDeleteSelected = register({
           ? null
           : startBindingElement,
         endBindingElement: selectedPointsIndices?.includes(
-          linearElement.points.length - 1,
+          element.points.length - 1,
         )
           ? null
           : endBindingElement,
       };
 
-      LinearElementEditor.deletePoints(
-        linearElement,
-        app,
-        selectedPointsIndices,
-      );
+      LinearElementEditor.deletePoints(element, app, selectedPointsIndices);
 
       return {
         elements,
         appState: {
           ...appState,
-          selectedLinearElement: {
-            ...appState.selectedLinearElement,
+          editingLinearElement: {
+            ...appState.editingLinearElement,
             ...binding,
             selectedPointsIndices:
               selectedPointsIndices?.[0] > 0
@@ -298,9 +291,7 @@ export const actionDeleteSelected = register({
       elements: nextElements,
       appState: {
         ...nextAppState,
-        activeTool: updateActiveTool(appState, {
-          type: app.defaultSelectionTool,
-        }),
+        activeTool: updateActiveTool(appState, { type: "selection" }),
         multiElement: null,
         activeEmbeddable: null,
         selectedLinearElement: null,

packages/excalidraw/actions/actionDistribute.tsx

@@ -10,8 +10,6 @@ import { distributeElements } from "@excalidraw/element";
 
 import { CaptureUpdateAction } from "@excalidraw/element";
 
-import { getSelectedElementsByGroup } from "@excalidraw/element";
-
 import type { ExcalidrawElement } from "@excalidraw/element/types";
 
 import type { Distribution } from "@excalidraw/element";
@@ -33,11 +31,7 @@ import type { AppClassProperties, AppState } from "../types";
 const enableActionGroup = (appState: AppState, app: AppClassProperties) => {
   const selectedElements = app.scene.getSelectedElements(appState);
   return (
-    getSelectedElementsByGroup(
-      selectedElements,
-      app.scene.getNonDeletedElementsMap(),
-      appState as Readonly<AppState>,
-    ).length > 2 &&
+    selectedElements.length > 1 &&
     // TODO enable distributing frames when implemented properly
     !selectedElements.some((el) => isFrameLikeElement(el))
   );
@@ -55,7 +49,6 @@ const distributeSelectedElements = (
     selectedElements,
     app.scene.getNonDeletedElementsMap(),
     distribution,
-    appState,
   );
 
   const updatedElementsMap = arrayToMap(updatedElements);

packages/excalidraw/actions/actionDuplicateSelection.tsx

@@ -39,7 +39,7 @@ export const actionDuplicateSelection = register({
     }
 
     // duplicate selected point(s) if editing a line
-    if (appState.selectedLinearElement?.isEditing) {
+    if (appState.editingLinearElement) {
       // TODO: Invariants should be checked here instead of duplicateSelectedPoints()
       try {
         const newAppState = LinearElementEditor.duplicateSelectedPoints(

packages/excalidraw/actions/actionFinalize.tsx

@@ -5,11 +5,7 @@ import {
   bindOrUnbindLinearElement,
   isBindingEnabled,
 } from "@excalidraw/element/binding";
-import {
-  isValidPolygon,
-  LinearElementEditor,
-  newElementWith,
-} from "@excalidraw/element";
+import { isValidPolygon, LinearElementEditor } from "@excalidraw/element";
 
 import {
   isBindingElement,
@@ -82,14 +78,7 @@ export const actionFinalize = register({
         let newElements = elements;
         if (element && isInvisiblySmallElement(element)) {
           // TODO: #7348 in theory this gets recorded by the store, so the invisible elements could be restored by the undo/redo, which might be not what we would want
-          newElements = newElements.map((el) => {
-            if (el.id === element.id) {
-              return newElementWith(el, {
-                isDeleted: true,
-              });
-            }
-            return el;
-          });
+          newElements = newElements.filter((el) => el.id !== element!.id);
         }
         return {
           elements: newElements,
@@ -105,9 +94,9 @@ export const actionFinalize = register({
       }
     }
 
-    if (appState.selectedLinearElement?.isEditing) {
+    if (appState.editingLinearElement) {
       const { elementId, startBindingElement, endBindingElement } =
-        appState.selectedLinearElement;
+        appState.editingLinearElement;
       const element = LinearElementEditor.getElement(elementId, elementsMap);
 
       if (element) {
@@ -128,21 +117,12 @@ export const actionFinalize = register({
         return {
           elements:
             element.points.length < 2 || isInvisiblySmallElement(element)
-              ? elements.map((el) => {
-                  if (el.id === element.id) {
-                    return newElementWith(el, { isDeleted: true });
-                  }
-                  return el;
-                })
+              ? elements.filter((el) => el.id !== element.id)
               : undefined,
           appState: {
             ...appState,
             cursorButton: "up",
-            selectedLinearElement: new LinearElementEditor(
-              element,
-              arrayToMap(elementsMap),
-              false, // exit editing mode
-            ),
+            editingLinearElement: null,
           },
           captureUpdate: CaptureUpdateAction.IMMEDIATELY,
         };
@@ -174,7 +154,11 @@ export const actionFinalize = register({
 
     if (element) {
       // pen and mouse have hover
-      if (appState.multiElement && element.type !== "freedraw") {
+      if (
+        appState.multiElement &&
+        element.type !== "freedraw" &&
+        appState.lastPointerDownWith !== "touch"
+      ) {
         const { points, lastCommittedPoint } = element;
         if (
           !lastCommittedPoint ||
@@ -188,12 +172,7 @@ export const actionFinalize = register({
 
       if (element && isInvisiblySmallElement(element)) {
         // TODO: #7348 in theory this gets recorded by the store, so the invisible elements could be restored by the undo/redo, which might be not what we would want
-        newElements = newElements.map((el) => {
-          if (el.id === element?.id) {
-            return newElementWith(el, { isDeleted: true });
-          }
-          return el;
-        });
+        newElements = newElements.filter((el) => el.id !== element!.id);
       }
 
       if (isLinearElement(element) || isFreeDrawElement(element)) {
@@ -261,13 +240,13 @@ export const actionFinalize = register({
     if (appState.activeTool.type === "eraser") {
       activeTool = updateActiveTool(appState, {
         ...(appState.activeTool.lastActiveTool || {
-          type: app.defaultSelectionTool,
+          type: "selection",
         }),
         lastActiveToolBeforeEraser: null,
       });
     } else {
       activeTool = updateActiveTool(appState, {
-        type: app.defaultSelectionTool,
+        type: "selection",
       });
     }
 
@@ -310,7 +289,7 @@ export const actionFinalize = register({
   },
   keyTest: (event, appState) =>
     (event.key === KEYS.ESCAPE &&
-      (appState.selectedLinearElement?.isEditing ||
+      (appState.editingLinearElement !== null ||
         (!appState.newElement && appState.multiElement === null))) ||
     ((event.key === KEYS.ESCAPE || event.key === KEYS.ENTER) &&
       appState.multiElement !== null),

packages/excalidraw/actions/actionLinearEditor.tsx

@@ -1,9 +1,10 @@
+import { LinearElementEditor } from "@excalidraw/element";
 import {
   isElbowArrow,
   isLinearElement,
   isLineElement,
 } from "@excalidraw/element";
-import { arrayToMap, invariant } from "@excalidraw/common";
+import { arrayToMap } from "@excalidraw/common";
 
 import {
   toggleLinePolygonState,
@@ -45,7 +46,7 @@ export const actionToggleLinearEditor = register({
   predicate: (elements, appState, _, app) => {
     const selectedElements = app.scene.getSelectedElements(appState);
     if (
-      !appState.selectedLinearElement?.isEditing &&
+      !appState.editingLinearElement &&
       selectedElements.length === 1 &&
       isLinearElement(selectedElements[0]) &&
       !isElbowArrow(selectedElements[0])
@@ -60,25 +61,14 @@ export const actionToggleLinearEditor = register({
       includeBoundTextElement: true,
     })[0] as ExcalidrawLinearElement;
 
-    invariant(selectedElement, "No selected element found");
-    invariant(
-      appState.selectedLinearElement,
-      "No selected linear element found",
-    );
-    invariant(
-      selectedElement.id === appState.selectedLinearElement.elementId,
-      "Selected element ID and linear editor elementId does not match",
-    );
-
-    const selectedLinearElement = {
-      ...appState.selectedLinearElement,
-      isEditing: !appState.selectedLinearElement.isEditing,
-    };
-
+    const editingLinearElement =
+      appState.editingLinearElement?.elementId === selectedElement.id
+        ? null
+        : new LinearElementEditor(selectedElement, arrayToMap(elements));
     return {
       appState: {
         ...appState,
-        selectedLinearElement,
+        editingLinearElement,
       },
       captureUpdate: CaptureUpdateAction.IMMEDIATELY,
     };

packages/excalidraw/actions/actionSelectAll.ts

@@ -21,7 +21,7 @@ export const actionSelectAll = register({
   trackEvent: { category: "canvas" },
   viewMode: false,
   perform: (elements, appState, value, app) => {
-    if (appState.selectedLinearElement?.isEditing) {
+    if (appState.editingLinearElement) {
       return false;
     }
 

packages/excalidraw/appState.ts

@@ -48,6 +48,7 @@ export const getDefaultAppState = (): Omit<
     newElement: null,
     editingTextElement: null,
     editingGroupId: null,
+    editingLinearElement: null,
     activeTool: {
       type: "selection",
       customType: null,
@@ -123,6 +124,11 @@ export const getDefaultAppState = (): Omit<
     searchMatches: null,
     lockedMultiSelections: {},
     activeLockedId: null,
+    cropPositionMovement: {
+      enabled: false,
+      croppingElementId: undefined,
+      directionLock: null,
+    },
   };
 };
 
@@ -174,6 +180,7 @@ const APP_STATE_STORAGE_CONF = (<
   newElement: { browser: false, export: false, server: false },
   editingTextElement: { browser: false, export: false, server: false },
   editingGroupId: { browser: true, export: false, server: false },
+  editingLinearElement: { browser: false, export: false, server: false },
   activeTool: { browser: true, export: false, server: false },
   penMode: { browser: true, export: false, server: false },
   penDetected: { browser: true, export: false, server: false },
@@ -247,6 +254,7 @@ const APP_STATE_STORAGE_CONF = (<
   searchMatches: { browser: false, export: false, server: false },
   lockedMultiSelections: { browser: true, export: true, server: true },
   activeLockedId: { browser: false, export: false, server: false },
+  cropPositionMovement: { browser: false, export: false, server: false },
 });
 
 const _clearAppStateForStorage = <

packages/excalidraw/components/Actions.tsx

@@ -46,7 +46,7 @@ import {
   hasStrokeWidth,
 } from "../scene";
 
-import { getToolbarTools } from "./shapes";
+import { SHAPES } from "./shapes";
 
 import "./Actions.scss";
 
@@ -140,7 +140,7 @@ export const SelectedShapeActions = ({
     targetElements.length === 1 || isSingleElementBoundContainer;
 
   const showLineEditorAction =
-    !appState.selectedLinearElement?.isEditing &&
+    !appState.editingLinearElement &&
     targetElements.length === 1 &&
     isLinearElement(targetElements[0]) &&
     !isElbowArrow(targetElements[0]);
@@ -295,8 +295,7 @@ export const ShapesSwitcher = ({
 
   const frameToolSelected = activeTool.type === "frame";
   const laserToolSelected = activeTool.type === "laser";
-  const lassoToolSelected =
-    activeTool.type === "lasso" && app.defaultSelectionTool !== "lasso";
+  const lassoToolSelected = activeTool.type === "lasso";
 
   const embeddableToolSelected = activeTool.type === "embeddable";
 
@@ -304,68 +303,63 @@ export const ShapesSwitcher = ({
 
   return (
     <>
-      {getToolbarTools(app).map(
-        ({ value, icon, key, numericKey, fillable }, index) => {
-          if (
-            UIOptions.tools?.[
-              value as Extract<
-                typeof value,
-                keyof AppProps["UIOptions"]["tools"]
-              >
-            ] === false
-          ) {
-            return null;
-          }
+      {SHAPES.map(({ value, icon, key, numericKey, fillable }, index) => {
+        if (
+          UIOptions.tools?.[
+            value as Extract<typeof value, keyof AppProps["UIOptions"]["tools"]>
+          ] === false
+        ) {
+          return null;
+        }
 
-          const label = t(`toolBar.${value}`);
-          const letter =
-            key && capitalizeString(typeof key === "string" ? key : key[0]);
-          const shortcut = letter
-            ? `${letter} ${t("helpDialog.or")} ${numericKey}`
-            : `${numericKey}`;
+        const label = t(`toolBar.${value}`);
+        const letter =
+          key && capitalizeString(typeof key === "string" ? key : key[0]);
+        const shortcut = letter
+          ? `${letter} ${t("helpDialog.or")} ${numericKey}`
+          : `${numericKey}`;
 
-          return (
-            <ToolButton
-              className={clsx("Shape", { fillable })}
-              key={value}
-              type="radio"
-              icon={icon}
-              checked={activeTool.type === value}
-              name="editor-current-shape"
-              title={`${capitalizeString(label)} — ${shortcut}`}
-              keyBindingLabel={numericKey || letter}
-              aria-label={capitalizeString(label)}
-              aria-keyshortcuts={shortcut}
-              data-testid={`toolbar-${value}`}
-              onPointerDown={({ pointerType }) => {
-                if (!appState.penDetected && pointerType === "pen") {
-                  app.togglePenMode(true);
-                }
+        return (
+          <ToolButton
+            className={clsx("Shape", { fillable })}
+            key={value}
+            type="radio"
+            icon={icon}
+            checked={activeTool.type === value}
+            name="editor-current-shape"
+            title={`${capitalizeString(label)} — ${shortcut}`}
+            keyBindingLabel={numericKey || letter}
+            aria-label={capitalizeString(label)}
+            aria-keyshortcuts={shortcut}
+            data-testid={`toolbar-${value}`}
+            onPointerDown={({ pointerType }) => {
+              if (!appState.penDetected && pointerType === "pen") {
+                app.togglePenMode(true);
+              }
 
-                if (value === "selection") {
-                  if (appState.activeTool.type === "selection") {
-                    app.setActiveTool({ type: "lasso" });
-                  } else {
-                    app.setActiveTool({ type: "selection" });
-                  }
-                }
-              }}
-              onChange={({ pointerType }) => {
-                if (appState.activeTool.type !== value) {
-                  trackEvent("toolbar", value, "ui");
-                }
-                if (value === "image") {
-                  app.setActiveTool({
-                    type: value,
-                  });
+              if (value === "selection") {
+                if (appState.activeTool.type === "selection") {
+                  app.setActiveTool({ type: "lasso" });
                 } else {
-                  app.setActiveTool({ type: value });
+                  app.setActiveTool({ type: "selection" });
                 }
-              }}
-            />
-          );
-        },
-      )}
+              }
+            }}
+            onChange={({ pointerType }) => {
+              if (appState.activeTool.type !== value) {
+                trackEvent("toolbar", value, "ui");
+              }
+              if (value === "image") {
+                app.setActiveTool({
+                  type: value,
+                });
+              } else {
+                app.setActiveTool({ type: value });
+              }
+            }}
+          />
+        );
+      })}
       <div className="App-toolbar__divider" />
 
       <DropdownMenu open={isExtraToolsMenuOpen}>
@@ -424,16 +418,14 @@ export const ShapesSwitcher = ({
           >
             {t("toolBar.laser")}
           </DropdownMenu.Item>
-          {app.defaultSelectionTool !== "lasso" && (
-            <DropdownMenu.Item
-              onSelect={() => app.setActiveTool({ type: "lasso" })}
-              icon={LassoIcon}
-              data-testid="toolbar-lasso"
-              selected={lassoToolSelected}
-            >
-              {t("toolBar.lasso")}
-            </DropdownMenu.Item>
-          )}
+          <DropdownMenu.Item
+            onSelect={() => app.setActiveTool({ type: "lasso" })}
+            icon={LassoIcon}
+            data-testid="toolbar-lasso"
+            selected={lassoToolSelected}
+          >
+            {t("toolBar.lasso")}
+          </DropdownMenu.Item>
           <div style={{ margin: "6px 0", fontSize: 14, fontWeight: 600 }}>
             Generate
           </div>
@@ -513,3 +505,15 @@ export const ExitZenModeAction = ({
     {t("buttons.exitZenMode")}
   </button>
 );
+
+export const FinalizeAction = ({
+  renderAction,
+  className,
+}: {
+  renderAction: ActionManager["renderAction"];
+  className?: string;
+}) => (
+  <div className={`finalize-button ${className}`}>
+    {renderAction("finalize", { size: "small" })}
+  </div>
+);

packages/excalidraw/components/CommandPalette/CommandPalette.scss

@@ -108,7 +108,6 @@ $verticalBreakpoint: 861px;
           display: flex;
           align-items: center;
           gap: 0.25rem;
-          overflow: hidden;
         }
       }
 

packages/excalidraw/components/CommandPalette/CommandPalette.tsx

@@ -59,8 +59,6 @@ import { useStableCallback } from "../../hooks/useStableCallback";
 import { activeConfirmDialogAtom } from "../ActiveConfirmDialog";
 import { useStable } from "../../hooks/useStable";
 
-import { Ellipsify } from "../Ellipsify";
-
 import * as defaultItems from "./defaultCommandPaletteItems";
 
 import "./CommandPalette.scss";
@@ -966,7 +964,7 @@ const CommandItem = ({
             }
           />
         )}
-        <Ellipsify>{command.label}</Ellipsify>
+        {command.label}
       </div>
       {showShortcut && command.shortcut && (
         <CommandShortcutHint shortcut={command.shortcut} />

packages/excalidraw/components/Ellipsify.tsx

@@ -1,18 +0,0 @@
-export const Ellipsify = ({
-  children,
-  ...rest
-}: { children: React.ReactNode } & React.HTMLAttributes<HTMLSpanElement>) => {
-  return (
-    <span
-      {...rest}
-      style={{
-        textOverflow: "ellipsis",
-        overflow: "hidden",
-        whiteSpace: "nowrap",
-        ...rest.style,
-      }}
-    >
-      {children}
-    </span>
-  );
-};

packages/excalidraw/components/HintViewer.tsx

@@ -115,7 +115,7 @@ const getHints = ({
       appState.selectionElement &&
       !selectedElements.length &&
       !appState.editingTextElement &&
-      !appState.selectedLinearElement?.isEditing
+      !appState.editingLinearElement
     ) {
       return [t("hints.deepBoxSelect")];
     }
@@ -130,8 +130,8 @@ const getHints = ({
 
     if (selectedElements.length === 1) {
       if (isLinearElement(selectedElements[0])) {
-        if (appState.selectedLinearElement?.isEditing) {
-          return appState.selectedLinearElement.selectedPointsIndices
+        if (appState.editingLinearElement) {
+          return appState.editingLinearElement.selectedPointsIndices
             ? t("hints.lineEditor_pointSelected")
             : t("hints.lineEditor_nothingSelected");
         }

packages/excalidraw/components/InlineIcon.tsx

@@ -7,7 +7,6 @@ export const InlineIcon = ({ icon }: { icon: React.ReactNode }) => {
         display: "inline-block",
         lineHeight: 0,
         verticalAlign: "middle",
-        flex: "0 0 auto",
       }}
     >
       {icon}

packages/excalidraw/components/canvases/InteractiveCanvas.tsx

@@ -192,6 +192,7 @@ const getRelevantAppStateProps = (
   viewModeEnabled: appState.viewModeEnabled,
   openDialog: appState.openDialog,
   editingGroupId: appState.editingGroupId,
+  editingLinearElement: appState.editingLinearElement,
   selectedElementIds: appState.selectedElementIds,
   frameToHighlight: appState.frameToHighlight,
   offsetLeft: appState.offsetLeft,

packages/excalidraw/components/canvases/StaticCanvas.tsx

@@ -34,13 +34,6 @@ const StaticCanvas = (props: StaticCanvasProps) => {
   const wrapperRef = useRef<HTMLDivElement>(null);
   const isComponentMounted = useRef(false);
 
-  useEffect(() => {
-    props.canvas.style.width = `${props.appState.width}px`;
-    props.canvas.style.height = `${props.appState.height}px`;
-    props.canvas.width = props.appState.width * props.scale;
-    props.canvas.height = props.appState.height * props.scale;
-  }, [props.appState.height, props.appState.width, props.canvas, props.scale]);
-
   useEffect(() => {
     const wrapper = wrapperRef.current;
     if (!wrapper) {
@@ -56,6 +49,26 @@ const StaticCanvas = (props: StaticCanvasProps) => {
       canvas.classList.add("excalidraw__canvas", "static");
     }
 
+    const widthString = `${props.appState.width}px`;
+    const heightString = `${props.appState.height}px`;
+    if (canvas.style.width !== widthString) {
+      canvas.style.width = widthString;
+    }
+    if (canvas.style.height !== heightString) {
+      canvas.style.height = heightString;
+    }
+
+    const scaledWidth = props.appState.width * props.scale;
+    const scaledHeight = props.appState.height * props.scale;
+    // setting width/height resets the canvas even if dimensions not changed,
+    // which would cause flicker when we skip frame (due to throttling)
+    if (canvas.width !== scaledWidth) {
+      canvas.width = scaledWidth;
+    }
+    if (canvas.height !== scaledHeight) {
+      canvas.height = scaledHeight;
+    }
+
     renderStaticScene(
       {
         canvas,

packages/excalidraw/components/dropdownMenu/DropdownMenu.scss

@@ -19,8 +19,6 @@
         border-radius: var(--border-radius-lg);
         position: relative;
         transition: box-shadow 0.5s ease-in-out;
-        display: flex;
-        flex-direction: column;
 
         &.zen-mode {
           box-shadow: none;
@@ -102,7 +100,6 @@
       align-items: center;
       cursor: pointer;
       border-radius: var(--border-radius-md);
-      flex: 1 0 auto;
 
       @media screen and (min-width: 1921px) {
         height: 2.25rem;

packages/excalidraw/components/dropdownMenu/DropdownMenuItemContent.tsx

@@ -1,7 +1,5 @@
 import { useDevice } from "../App";
 
-import { Ellipsify } from "../Ellipsify";
-
 import type { JSX } from "react";
 
 const MenuItemContent = ({
@@ -20,7 +18,7 @@ const MenuItemContent = ({
     <>
       {icon && <div className="dropdown-menu-item__icon">{icon}</div>}
       <div style={textStyle} className="dropdown-menu-item__text">
-        <Ellipsify>{children}</Ellipsify>
+        {children}
       </div>
       {shortcut && !device.editor.isMobile && (
         <div className="dropdown-menu-item__shortcut">{shortcut}</div>

packages/excalidraw/components/footer/Footer.tsx

@@ -2,7 +2,13 @@ import clsx from "clsx";
 
 import { actionShortcuts } from "../../actions";
 import { useTunnels } from "../../context/tunnels";
-import { ExitZenModeAction, UndoRedoActions, ZoomActions } from "../Actions";
+import {
+  ExitZenModeAction,
+  FinalizeAction,
+  UndoRedoActions,
+  ZoomActions,
+} from "../Actions";
+import { useDevice } from "../App";
 import { HelpButton } from "../HelpButton";
 import { Section } from "../Section";
 import Stack from "../Stack";
@@ -23,6 +29,10 @@ const Footer = ({
 }) => {
   const { FooterCenterTunnel, WelcomeScreenHelpHintTunnel } = useTunnels();
 
+  const device = useDevice();
+  const showFinalize =
+    !appState.viewModeEnabled && appState.multiElement && device.isTouchScreen;
+
   return (
     <footer
       role="contentinfo"
@@ -50,6 +60,15 @@ const Footer = ({
                 })}
               />
             )}
+            {showFinalize && (
+              <FinalizeAction
+                renderAction={actionManager.renderAction}
+                className={clsx("zen-mode-transition", {
+                  "layer-ui__wrapper__footer-left--transition-left":
+                    appState.zenModeEnabled,
+                })}
+              />
+            )}
           </Section>
         </Stack.Col>
       </div>

packages/excalidraw/components/shapes.tsx

@@ -13,8 +13,6 @@ import {
   EraserIcon,
 } from "./icons";
 
-import type { AppClassProperties } from "../types";
-
 export const SHAPES = [
   {
     icon: SelectionIcon,
@@ -88,23 +86,8 @@ export const SHAPES = [
   },
 ] as const;
 
-export const getToolbarTools = (app: AppClassProperties) => {
-  return app.defaultSelectionTool === "lasso"
-    ? ([
-        {
-          value: "lasso",
-          icon: SelectionIcon,
-          key: KEYS.V,
-          numericKey: KEYS["1"],
-          fillable: true,
-        },
-        ...SHAPES.slice(1),
-      ] as const)
-    : SHAPES;
-};
-
-export const findShapeByKey = (key: string, app: AppClassProperties) => {
-  const shape = getToolbarTools(app).find((shape, index) => {
+export const findShapeByKey = (key: string) => {
+  const shape = SHAPES.find((shape, index) => {
     return (
       (shape.numericKey != null && key === shape.numericKey.toString()) ||
       (shape.key &&

packages/excalidraw/data/blob.ts

@@ -170,11 +170,7 @@ export const loadSceneOrLibraryFromBlob = async (
           },
           localAppState,
           localElements,
-          {
-            repairBindings: true,
-            refreshDimensions: false,
-            deleteInvisibleElements: true,
-          },
+          { repairBindings: true, refreshDimensions: false },
         ),
       };
     } else if (isValidLibrary(data)) {

packages/excalidraw/data/reconcile.ts

@@ -20,7 +20,7 @@ export type ReconciledExcalidrawElement = OrderedExcalidrawElement &
 export type RemoteExcalidrawElement = OrderedExcalidrawElement &
   MakeBrand<"RemoteExcalidrawElement">;
 
-export const shouldDiscardRemoteElement = (
+const shouldDiscardRemoteElement = (
   localAppState: AppState,
   local: OrderedExcalidrawElement | undefined,
   remote: RemoteExcalidrawElement,
@@ -30,7 +30,7 @@ export const shouldDiscardRemoteElement = (
     // local element is being edited
     (local.id === localAppState.editingTextElement?.id ||
       local.id === localAppState.resizingElement?.id ||
-      local.id === localAppState.newElement?.id ||
+      local.id === localAppState.newElement?.id || // TODO: Is this still valid? As newElement is selection element, which is never part of the elements array
       // local element is newer
       local.version > remote.version ||
       // resolve conflicting edits deterministically by taking the one with

packages/excalidraw/data/restore.ts

@@ -241,9 +241,8 @@ const restoreElementWithProperties = <
   return ret;
 };
 
-export const restoreElement = (
+const restoreElement = (
   element: Exclude<ExcalidrawElement, ExcalidrawSelectionElement>,
-  opts?: { deleteInvisibleElements?: boolean },
 ): typeof element | null => {
   element = { ...element };
 
@@ -291,8 +290,7 @@ export const restoreElement = (
 
       // if empty text, mark as deleted. We keep in array
       // for data integrity purposes (collab etc.)
-      if (opts?.deleteInvisibleElements && !text && !element.isDeleted) {
-        // TODO: we should not do this since it breaks sync / versioning when we exchange / apply just deltas and restore the elements (deletion isn't recorded)
+      if (!text && !element.isDeleted) {
         element = { ...element, originalText: text, isDeleted: true };
         element = bumpVersion(element);
       }
@@ -525,13 +523,7 @@ export const restoreElements = (
   elements: ImportedDataState["elements"],
   /** NOTE doesn't serve for reconciliation */
   localElements: readonly ExcalidrawElement[] | null | undefined,
-  opts?:
-    | {
-        refreshDimensions?: boolean;
-        repairBindings?: boolean;
-        deleteInvisibleElements?: boolean;
-      }
-    | undefined,
+  opts?: { refreshDimensions?: boolean; repairBindings?: boolean } | undefined,
 ): OrderedExcalidrawElement[] => {
   // used to detect duplicate top-level element ids
   const existingIds = new Set<string>();
@@ -540,38 +532,24 @@ export const restoreElements = (
     (elements || []).reduce((elements, element) => {
       // filtering out selection, which is legacy, no longer kept in elements,
       // and causing issues if retained
-      if (element.type === "selection") {
-        return elements;
+      if (element.type !== "selection" && !isInvisiblySmallElement(element)) {
+        let migratedElement: ExcalidrawElement | null = restoreElement(element);
+        if (migratedElement) {
+          const localElement = localElementsMap?.get(element.id);
+          if (localElement && localElement.version > migratedElement.version) {
+            migratedElement = bumpVersion(
+              migratedElement,
+              localElement.version,
+            );
+          }
+          if (existingIds.has(migratedElement.id)) {
+            migratedElement = { ...migratedElement, id: randomId() };
+          }
+          existingIds.add(migratedElement.id);
+
+          elements.push(migratedElement);
+        }
       }
-
-      let migratedElement: ExcalidrawElement | null = restoreElement(element, {
-        deleteInvisibleElements: opts?.deleteInvisibleElements,
-      });
-      if (migratedElement) {
-        const localElement = localElementsMap?.get(element.id);
-
-        const shouldMarkAsDeleted =
-          opts?.deleteInvisibleElements && isInvisiblySmallElement(element);
-
-        if (
-          shouldMarkAsDeleted ||
-          (localElement && localElement.version > migratedElement.version)
-        ) {
-          migratedElement = bumpVersion(migratedElement, localElement?.version);
-        }
-
-        if (shouldMarkAsDeleted) {
-          migratedElement = { ...migratedElement, isDeleted: true };
-        }
-
-        if (existingIds.has(migratedElement.id)) {
-          migratedElement = { ...migratedElement, id: randomId() };
-        }
-        existingIds.add(migratedElement.id);
-
-        elements.push(migratedElement);
-      }
-
       return elements;
     }, [] as ExcalidrawElement[]),
   );
@@ -812,11 +790,7 @@ export const restore = (
    */
   localAppState: Partial<AppState> | null | undefined,
   localElements: readonly ExcalidrawElement[] | null | undefined,
-  elementsConfig?: {
-    refreshDimensions?: boolean;
-    repairBindings?: boolean;
-    deleteInvisibleElements?: boolean;
-  },
+  elementsConfig?: { refreshDimensions?: boolean; repairBindings?: boolean },
 ): RestoredDataState => {
   return {
     elements: restoreElements(data?.elements, localElements, elementsConfig),

packages/excalidraw/history.ts

@@ -175,7 +175,7 @@ export class History {
       let nextAppState = appState;
       let containsVisibleChange = false;
 
-      // iterate through the history entries in case they result in no visible changes
+      // iterate through the history entries in case ;they result in no visible changes
       while (historyDelta) {
         try {
           [nextElements, nextAppState, containsVisibleChange] =

packages/excalidraw/index.tsx

@@ -229,7 +229,6 @@ export { defaultLang, useI18n, languages } from "./i18n";
 export {
   restore,
   restoreAppState,
-  restoreElement,
   restoreElements,
   restoreLibraryItems,
 } from "./data/restore";
@@ -282,7 +281,6 @@ export { Sidebar } from "./components/Sidebar/Sidebar";
 export { Button } from "./components/Button";
 export { Footer };
 export { MainMenu };
-export { Ellipsify } from "./components/Ellipsify";
 export { useDevice } from "./components/App";
 export { WelcomeScreen };
 export { LiveCollaborationTrigger };

packages/excalidraw/package.json

@@ -66,22 +66,12 @@
       "last 1 safari version"
     ]
   },
-  "repository": "https://github.com/excalidraw/excalidraw",
-  "bugs": "https://github.com/excalidraw/excalidraw/issues",
-  "homepage": "https://github.com/excalidraw/excalidraw/tree/master/packages/excalidraw",
-  "scripts": {
-    "gen:types": "rimraf types && tsc",
-    "build:esm": "rimraf dist && node ../../scripts/buildPackage.js && yarn gen:types"
-  },
   "peerDependencies": {
     "react": "^17.0.2 || ^18.2.0 || ^19.0.0",
     "react-dom": "^17.0.2 || ^18.2.0 || ^19.0.0"
   },
   "dependencies": {
     "@braintree/sanitize-url": "6.0.2",
-    "@excalidraw/common": "0.18.0",
-    "@excalidraw/element": "0.18.0",
-    "@excalidraw/math": "0.18.0",
     "@excalidraw/laser-pointer": "1.3.1",
     "@excalidraw/mermaid-to-excalidraw": "1.1.2",
     "@excalidraw/random-username": "1.1.0",
@@ -134,5 +124,12 @@
     "harfbuzzjs": "0.3.6",
     "jest-diff": "29.7.0",
     "typescript": "4.9.4"
+  },
+  "repository": "https://github.com/excalidraw/excalidraw",
+  "bugs": "https://github.com/excalidraw/excalidraw/issues",
+  "homepage": "https://github.com/excalidraw/excalidraw/tree/master/packages/excalidraw",
+  "scripts": {
+    "gen:types": "rimraf types && tsc",
+    "build:esm": "rimraf dist && node ../../scripts/buildPackage.js && yarn gen:types"
   }
 }

packages/excalidraw/renderer/interactiveScene.ts

@@ -118,8 +118,7 @@ const renderLinearElementPointHighlight = (
 ) => {
   const { elementId, hoverPointIndex } = appState.selectedLinearElement!;
   if (
-    appState.selectedLinearElement?.isEditing &&
-    appState.selectedLinearElement?.selectedPointsIndices?.includes(
+    appState.editingLinearElement?.selectedPointsIndices?.includes(
       hoverPointIndex,
     )
   ) {
@@ -181,7 +180,7 @@ const renderSingleLinearPoint = <Point extends GlobalPoint | LocalPoint>(
     point[0],
     point[1],
     (isOverlappingPoint
-      ? radius * (appState.selectedLinearElement?.isEditing ? 1.5 : 2)
+      ? radius * (appState.editingLinearElement ? 1.5 : 2)
       : radius) / appState.zoom.value,
     !isPhantomPoint,
     !isOverlappingPoint || isSelected,
@@ -449,7 +448,7 @@ const renderLinearPointHandles = (
   );
 
   const { POINT_HANDLE_SIZE } = LinearElementEditor;
-  const radius = appState.selectedLinearElement?.isEditing
+  const radius = appState.editingLinearElement
     ? POINT_HANDLE_SIZE
     : POINT_HANDLE_SIZE / 2;
 
@@ -471,8 +470,7 @@ const renderLinearPointHandles = (
       );
 
     let isSelected =
-      !!appState.selectedLinearElement?.isEditing &&
-      !!appState.selectedLinearElement?.selectedPointsIndices?.includes(idx);
+      !!appState.editingLinearElement?.selectedPointsIndices?.includes(idx);
     // when element is a polygon, highlight the last point as well if first
     // point is selected since they overlap and the last point tends to be
     // rendered on top
@@ -481,8 +479,7 @@ const renderLinearPointHandles = (
       element.polygon &&
       !isSelected &&
       idx === element.points.length - 1 &&
-      !!appState.selectedLinearElement?.isEditing &&
-      !!appState.selectedLinearElement?.selectedPointsIndices?.includes(0)
+      !!appState.editingLinearElement?.selectedPointsIndices?.includes(0)
     ) {
       isSelected = true;
     }
@@ -538,7 +535,7 @@ const renderLinearPointHandles = (
     );
 
     midPoints.forEach((segmentMidPoint) => {
-      if (appState.selectedLinearElement?.isEditing || points.length === 2) {
+      if (appState.editingLinearElement || points.length === 2) {
         renderSingleLinearPoint(
           context,
           appState,
@@ -763,10 +760,7 @@ const _renderInteractiveScene = ({
     // Getting the element using LinearElementEditor during collab mismatches version - being one head of visible elements due to
     // ShapeCache returns empty hence making sure that we get the
     // correct element from visible elements
-    if (
-      appState.selectedLinearElement?.isEditing &&
-      appState.selectedLinearElement.elementId === element.id
-    ) {
+    if (appState.editingLinearElement?.elementId === element.id) {
       if (element) {
         editingLinearElement = element as NonDeleted<ExcalidrawLinearElement>;
       }
@@ -859,8 +853,7 @@ const _renderInteractiveScene = ({
   // correct element from visible elements
   if (
     selectedElements.length === 1 &&
-    appState.selectedLinearElement?.isEditing &&
-    appState.selectedLinearElement.elementId === selectedElements[0].id
+    appState.editingLinearElement?.elementId === selectedElements[0].id
   ) {
     renderLinearPointHandles(
       context,
@@ -891,7 +884,7 @@ const _renderInteractiveScene = ({
   }
 
   // Paint selected elements
-  if (!appState.multiElement && !appState.selectedLinearElement?.isEditing) {
+  if (!appState.multiElement && !appState.editingLinearElement) {
     const showBoundingBox = shouldShowBoundingBox(selectedElements, appState);
 
     const isSingleLinearElementSelected =

packages/excalidraw/renderer/renderNewElementScene.ts

@@ -1,16 +1,9 @@
 import { throttleRAF } from "@excalidraw/common";
 
-import {
-  getTargetFrame,
-  isInvisiblySmallElement,
-  renderElement,
-  shouldApplyFrameClip,
-} from "@excalidraw/element";
+import { renderElement } from "@excalidraw/element";
 
 import { bootstrapCanvas, getNormalizedCanvasDimensions } from "./helpers";
 
-import { frameClip } from "./staticScene";
-
 import type { NewElementSceneRenderConfig } from "../scene/types";
 
 const _renderNewElementScene = ({
@@ -36,37 +29,11 @@ const _renderNewElementScene = ({
       normalizedHeight,
     });
 
-    context.save();
-
     // Apply zoom
+    context.save();
     context.scale(appState.zoom.value, appState.zoom.value);
 
     if (newElement && newElement.type !== "selection") {
-      // e.g. when creating arrows and we're still below the arrow drag distance
-      // threshold
-      // (for now we skip render only with elements while we're creating to be
-      // safe)
-      if (isInvisiblySmallElement(newElement)) {
-        return;
-      }
-
-      const frameId = newElement.frameId || appState.frameToHighlight?.id;
-
-      if (
-        frameId &&
-        appState.frameRendering.enabled &&
-        appState.frameRendering.clip
-      ) {
-        const frame = getTargetFrame(newElement, elementsMap, appState);
-
-        if (
-          frame &&
-          shouldApplyFrameClip(newElement, frame, appState, elementsMap)
-        ) {
-          frameClip(frame, context, renderConfig, appState);
-        }
-      }
-
       renderElement(
         newElement,
         elementsMap,
@@ -79,8 +46,6 @@ const _renderNewElementScene = ({
     } else {
       context.clearRect(0, 0, normalizedWidth, normalizedHeight);
     }
-
-    context.restore();
   }
 };
 

packages/excalidraw/renderer/staticScene.ts

@@ -113,7 +113,7 @@ const strokeGrid = (
   context.restore();
 };
 
-export const frameClip = (
+const frameClip = (
   frame: ExcalidrawFrameLikeElement,
   context: CanvasRenderingContext2D,
   renderConfig: StaticCanvasRenderConfig,

packages/excalidraw/snapping.ts

@@ -13,7 +13,7 @@ import {
   getDraggedElementsBounds,
   getElementAbsoluteCoords,
 } from "@excalidraw/element";
-import { isBoundToContainer } from "@excalidraw/element";
+import { isBoundToContainer, isFrameLikeElement } from "@excalidraw/element";
 
 import { getMaximumGroups } from "@excalidraw/element";
 
@@ -169,14 +169,8 @@ export const isSnappingEnabled = ({
   selectedElements: NonDeletedExcalidrawElement[];
 }) => {
   if (event) {
-    // Allow snapping for lasso tool when dragging selected elements
-    // but not during lasso selection phase
-    const isLassoDragging =
-      app.state.activeTool.type === "lasso" &&
-      app.state.selectedElementsAreBeingDragged;
-
     return (
-      (app.state.activeTool.type !== "lasso" || isLassoDragging) &&
+      app.state.activeTool.type !== "lasso" &&
       ((app.state.objectsSnapModeEnabled && !event[KEYS.CTRL_OR_CMD]) ||
         (!app.state.objectsSnapModeEnabled &&
           event[KEYS.CTRL_OR_CMD] &&
@@ -317,13 +311,20 @@ const getReferenceElements = (
   selectedElements: NonDeletedExcalidrawElement[],
   appState: AppState,
   elementsMap: ElementsMap,
-) =>
-  getVisibleAndNonSelectedElements(
+) => {
+  const selectedFrames = selectedElements
+    .filter((element) => isFrameLikeElement(element))
+    .map((frame) => frame.id);
+
+  return getVisibleAndNonSelectedElements(
     elements,
     selectedElements,
     appState,
     elementsMap,
+  ).filter(
+    (element) => !(element.frameId && selectedFrames.includes(element.frameId)),
   );
+};
 
 export const getVisibleGaps = (
   elements: readonly NonDeletedExcalidrawElement[],

packages/excalidraw/tests/__snapshots__/contextmenu.test.tsx.snap

@@ -908,6 +908,7 @@ exports[`contextMenu element > right-clicking on a group should select whole gro
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -1105,6 +1106,7 @@ exports[`contextMenu element > selecting 'Add to library' in context menu adds e
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -1317,6 +1319,7 @@ exports[`contextMenu element > selecting 'Bring forward' in context menu brings
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -1646,6 +1649,7 @@ exports[`contextMenu element > selecting 'Bring to front' in context menu brings
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -1975,6 +1979,7 @@ exports[`contextMenu element > selecting 'Copy styles' in context menu copies st
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -2187,6 +2192,7 @@ exports[`contextMenu element > selecting 'Delete' in context menu deletes elemen
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -2426,6 +2432,7 @@ exports[`contextMenu element > selecting 'Duplicate' in context menu duplicates
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -2722,6 +2729,7 @@ exports[`contextMenu element > selecting 'Group selection' in context menu group
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -3092,6 +3100,7 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -3583,6 +3592,7 @@ exports[`contextMenu element > selecting 'Send backward' in context menu sends e
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -3682,14 +3692,14 @@ exports[`contextMenu element > selecting 'Send backward' in context menu sends e
   "opacity": 100,
   "roughness": 1,
   "roundness": null,
-  "seed": 400692809,
+  "seed": 1116226695,
   "strokeColor": "#1e1e1e",
   "strokeStyle": "solid",
   "strokeWidth": 2,
   "type": "rectangle",
   "updated": 1,
   "version": 4,
-  "versionNonce": 81784553,
+  "versionNonce": 23633383,
   "width": 20,
   "x": 20,
   "y": 30,
@@ -3714,14 +3724,14 @@ exports[`contextMenu element > selecting 'Send backward' in context menu sends e
   "opacity": 100,
   "roughness": 1,
   "roundness": null,
-  "seed": 449462985,
+  "seed": 1278240551,
   "strokeColor": "#1e1e1e",
   "strokeStyle": "solid",
   "strokeWidth": 2,
   "type": "rectangle",
   "updated": 1,
   "version": 3,
-  "versionNonce": 1150084233,
+  "versionNonce": 401146281,
   "width": 20,
   "x": -10,
   "y": 0,
@@ -3904,6 +3914,7 @@ exports[`contextMenu element > selecting 'Send to back' in context menu sends el
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -4225,6 +4236,7 @@ exports[`contextMenu element > selecting 'Ungroup selection' in context menu ung
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -5508,6 +5520,7 @@ exports[`contextMenu element > shows 'Group selection' in context menu for multi
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -6723,6 +6736,7 @@ exports[`contextMenu element > shows 'Ungroup selection' in context menu for gro
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -7656,6 +7670,7 @@ exports[`contextMenu element > shows context menu for canvas > [end of test] app
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -8654,6 +8669,7 @@ exports[`contextMenu element > shows context menu for element > [end of test] ap
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -9643,6 +9659,7 @@ exports[`contextMenu element > shows context menu for element > [end of test] ap
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,

packages/excalidraw/tests/__snapshots__/excalidraw.test.tsx.snap

@@ -15,11 +15,7 @@ exports[`<Excalidraw/> > <MainMenu/> > should render main menu with host menu it
       <div
         class="dropdown-menu-item__text"
       >
-        <span
-          style="text-overflow: ellipsis; overflow: hidden; white-space: nowrap;"
-        >
-          Click me
-        </span>
+        Click me
       </div>
     </button>
     <a
@@ -31,11 +27,7 @@ exports[`<Excalidraw/> > <MainMenu/> > should render main menu with host menu it
       <div
         class="dropdown-menu-item__text"
       >
-        <span
-          style="text-overflow: ellipsis; overflow: hidden; white-space: nowrap;"
-        >
-          Excalidraw blog
-        </span>
+        Excalidraw blog
       </div>
     </a>
     <div
@@ -96,11 +88,7 @@ exports[`<Excalidraw/> > <MainMenu/> > should render main menu with host menu it
       <div
         class="dropdown-menu-item__text"
       >
-        <span
-          style="text-overflow: ellipsis; overflow: hidden; white-space: nowrap;"
-        >
-          Help
-        </span>
+        Help
       </div>
       <div
         class="dropdown-menu-item__shortcut"
@@ -150,11 +138,7 @@ exports[`<Excalidraw/> > Test UIOptions prop > Test canvasActions > should rende
       <div
         class="dropdown-menu-item__text"
       >
-        <span
-          style="text-overflow: ellipsis; overflow: hidden; white-space: nowrap;"
-        >
-          Open
-        </span>
+        Open
       </div>
       <div
         class="dropdown-menu-item__shortcut"
@@ -191,11 +175,7 @@ exports[`<Excalidraw/> > Test UIOptions prop > Test canvasActions > should rende
       <div
         class="dropdown-menu-item__text"
       >
-        <span
-          style="text-overflow: ellipsis; overflow: hidden; white-space: nowrap;"
-        >
-          Save to...
-        </span>
+        Save to...
       </div>
     </button>
     <button
@@ -251,11 +231,7 @@ exports[`<Excalidraw/> > Test UIOptions prop > Test canvasActions > should rende
       <div
         class="dropdown-menu-item__text"
       >
-        <span
-          style="text-overflow: ellipsis; overflow: hidden; white-space: nowrap;"
-        >
-          Export image...
-        </span>
+        Export image...
       </div>
       <div
         class="dropdown-menu-item__shortcut"
@@ -304,11 +280,7 @@ exports[`<Excalidraw/> > Test UIOptions prop > Test canvasActions > should rende
       <div
         class="dropdown-menu-item__text"
       >
-        <span
-          style="text-overflow: ellipsis; overflow: hidden; white-space: nowrap;"
-        >
-          Find on canvas
-        </span>
+        Find on canvas
       </div>
       <div
         class="dropdown-menu-item__shortcut"
@@ -365,11 +337,7 @@ exports[`<Excalidraw/> > Test UIOptions prop > Test canvasActions > should rende
       <div
         class="dropdown-menu-item__text"
       >
-        <span
-          style="text-overflow: ellipsis; overflow: hidden; white-space: nowrap;"
-        >
-          Help
-        </span>
+        Help
       </div>
       <div
         class="dropdown-menu-item__shortcut"
@@ -406,11 +374,7 @@ exports[`<Excalidraw/> > Test UIOptions prop > Test canvasActions > should rende
       <div
         class="dropdown-menu-item__text"
       >
-        <span
-          style="text-overflow: ellipsis; overflow: hidden; white-space: nowrap;"
-        >
-          Reset the canvas
-        </span>
+        Reset the canvas
       </div>
     </button>
     <div
@@ -455,11 +419,7 @@ exports[`<Excalidraw/> > Test UIOptions prop > Test canvasActions > should rende
         <div
           class="dropdown-menu-item__text"
         >
-          <span
-            style="text-overflow: ellipsis; overflow: hidden; white-space: nowrap;"
-          >
-            GitHub
-          </span>
+          GitHub
         </div>
       </a>
       <a
@@ -505,11 +465,7 @@ exports[`<Excalidraw/> > Test UIOptions prop > Test canvasActions > should rende
         <div
           class="dropdown-menu-item__text"
         >
-          <span
-            style="text-overflow: ellipsis; overflow: hidden; white-space: nowrap;"
-          >
-            Follow us
-          </span>
+          Follow us
         </div>
       </a>
       <a
@@ -549,11 +505,7 @@ exports[`<Excalidraw/> > Test UIOptions prop > Test canvasActions > should rende
         <div
           class="dropdown-menu-item__text"
         >
-          <span
-            style="text-overflow: ellipsis; overflow: hidden; white-space: nowrap;"
-          >
-            Discord chat
-          </span>
+          Discord chat
         </div>
       </a>
     </div>
@@ -590,11 +542,7 @@ exports[`<Excalidraw/> > Test UIOptions prop > Test canvasActions > should rende
       <div
         class="dropdown-menu-item__text"
       >
-        <span
-          style="text-overflow: ellipsis; overflow: hidden; white-space: nowrap;"
-        >
-          Dark mode
-        </span>
+        Dark mode
       </div>
       <div
         class="dropdown-menu-item__shortcut"

packages/excalidraw/tests/__snapshots__/regressionTests.test.tsx.snap

@@ -34,6 +34,7 @@ exports[`given element A and group of elements B and given both are selected whe
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -458,6 +459,7 @@ exports[`given element A and group of elements B and given both are selected whe
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -872,6 +874,7 @@ exports[`regression tests > Cmd/Ctrl-click exclusively select element under poin
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": "id28",
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -1436,6 +1439,7 @@ exports[`regression tests > Drags selected element when hitting only bounding bo
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -1641,6 +1645,7 @@ exports[`regression tests > adjusts z order when grouping > [end of test] appSta
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -2023,6 +2028,7 @@ exports[`regression tests > alt-drag duplicates an element > [end of test] appSt
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -2216,7 +2222,16 @@ exports[`regression tests > alt-drag duplicates an element > [end of test] undo
           },
         },
       },
-      "updated": {},
+      "updated": {
+        "id0": {
+          "deleted": {
+            "version": 5,
+          },
+          "inserted": {
+            "version": 3,
+          },
+        },
+      },
     },
     "id": "id6",
   },
@@ -2257,6 +2272,7 @@ exports[`regression tests > arrow keys > [end of test] appState 1`] = `
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -2435,6 +2451,7 @@ exports[`regression tests > can drag element that covers another element, while
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -2758,6 +2775,7 @@ exports[`regression tests > change the properties of a shape > [end of test] app
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -3011,6 +3029,7 @@ exports[`regression tests > click on an element and drag it > [dragged] appState
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -3250,6 +3269,7 @@ exports[`regression tests > click on an element and drag it > [end of test] appS
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -3484,6 +3504,7 @@ exports[`regression tests > click to select a shape > [end of test] appState 1`]
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -3740,6 +3761,7 @@ exports[`regression tests > click-drag to select a group > [end of test] appStat
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -4052,6 +4074,7 @@ exports[`regression tests > deleting last but one element in editing group shoul
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -4486,6 +4509,7 @@ exports[`regression tests > deselects group of selected elements on pointer down
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -4767,6 +4791,7 @@ exports[`regression tests > deselects group of selected elements on pointer up w
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -5041,6 +5066,7 @@ exports[`regression tests > deselects selected element on pointer down when poin
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -5247,6 +5273,7 @@ exports[`regression tests > deselects selected element, on pointer up, when clic
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -5445,6 +5472,7 @@ exports[`regression tests > double click to edit a group > [end of test] appStat
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": "id11",
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -5836,6 +5864,7 @@ exports[`regression tests > drags selected elements from point inside common bou
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -6131,6 +6160,7 @@ exports[`regression tests > draw every type of shape > [end of test] appState 1`
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -6385,16 +6415,13 @@ exports[`regression tests > draw every type of shape > [end of test] undo stack
           "selectedElementIds": {
             "id9": true,
           },
-          "selectedLinearElement": {
-            "elementId": "id9",
-            "isEditing": false,
-          },
+          "selectedLinearElementId": "id9",
         },
         "inserted": {
           "selectedElementIds": {
             "id6": true,
           },
-          "selectedLinearElement": null,
+          "selectedLinearElementId": null,
         },
       },
     },
@@ -6462,19 +6489,13 @@ exports[`regression tests > draw every type of shape > [end of test] undo stack
           "selectedElementIds": {
             "id12": true,
           },
-          "selectedLinearElement": {
-            "elementId": "id12",
-            "isEditing": false,
-          },
+          "selectedLinearElementId": "id12",
         },
         "inserted": {
           "selectedElementIds": {
             "id9": true,
           },
-          "selectedLinearElement": {
-            "elementId": "id9",
-            "isEditing": false,
-          },
+          "selectedLinearElementId": "id9",
         },
       },
     },
@@ -6540,16 +6561,13 @@ exports[`regression tests > draw every type of shape > [end of test] undo stack
           "selectedElementIds": {
             "id15": true,
           },
-          "selectedLinearElement": null,
+          "selectedLinearElementId": null,
         },
         "inserted": {
           "selectedElementIds": {
             "id12": true,
           },
-          "selectedLinearElement": {
-            "elementId": "id12",
-            "isEditing": false,
-          },
+          "selectedLinearElementId": "id12",
         },
       },
     },
@@ -6676,13 +6694,10 @@ exports[`regression tests > draw every type of shape > [end of test] undo stack
     "appState": AppStateDelta {
       "delta": Delta {
         "deleted": {
-          "selectedLinearElement": {
-            "elementId": "id15",
-            "isEditing": false,
-          },
+          "selectedLinearElementId": "id15",
         },
         "inserted": {
-          "selectedLinearElement": null,
+          "selectedLinearElementId": null,
         },
       },
     },
@@ -6700,16 +6715,13 @@ exports[`regression tests > draw every type of shape > [end of test] undo stack
           "selectedElementIds": {
             "id22": true,
           },
-          "selectedLinearElement": null,
+          "selectedLinearElementId": null,
         },
         "inserted": {
           "selectedElementIds": {
             "id15": true,
           },
-          "selectedLinearElement": {
-            "elementId": "id15",
-            "isEditing": false,
-          },
+          "selectedLinearElementId": "id15",
         },
       },
     },
@@ -6834,13 +6846,10 @@ exports[`regression tests > draw every type of shape > [end of test] undo stack
     "appState": AppStateDelta {
       "delta": Delta {
         "deleted": {
-          "selectedLinearElement": {
-            "elementId": "id22",
-            "isEditing": false,
-          },
+          "selectedLinearElementId": "id22",
         },
         "inserted": {
-          "selectedLinearElement": null,
+          "selectedLinearElementId": null,
         },
       },
     },
@@ -6875,13 +6884,10 @@ exports[`regression tests > draw every type of shape > [end of test] undo stack
     "appState": AppStateDelta {
       "delta": Delta {
         "deleted": {
-          "selectedLinearElement": null,
+          "selectedLinearElementId": null,
         },
         "inserted": {
-          "selectedLinearElement": {
-            "elementId": "id22",
-            "isEditing": false,
-          },
+          "selectedLinearElementId": "id22",
         },
       },
     },
@@ -6985,6 +6991,7 @@ exports[`regression tests > given a group of selected elements with an element t
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -7317,6 +7324,7 @@ exports[`regression tests > given a selected element A and a not selected elemen
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -7594,6 +7602,7 @@ exports[`regression tests > given selected element A with lower z-index than uns
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -7827,6 +7836,7 @@ exports[`regression tests > given selected element A with lower z-index than uns
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -8065,6 +8075,7 @@ exports[`regression tests > key 2 selects rectangle tool > [end of test] appStat
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -8179,7 +8190,7 @@ exports[`regression tests > key 2 selects rectangle tool > [end of test] undo st
             "fillStyle": "solid",
             "frameId": null,
             "groupIds": [],
-            "height": 30,
+            "height": 10,
             "index": "a0",
             "isDeleted": false,
             "link": null,
@@ -8192,7 +8203,7 @@ exports[`regression tests > key 2 selects rectangle tool > [end of test] undo st
             "strokeWidth": 2,
             "type": "rectangle",
             "version": 3,
-            "width": 30,
+            "width": 10,
             "x": 10,
             "y": 10,
           },
@@ -8243,6 +8254,7 @@ exports[`regression tests > key 3 selects diamond tool > [end of test] appState
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -8357,7 +8369,7 @@ exports[`regression tests > key 3 selects diamond tool > [end of test] undo stac
             "fillStyle": "solid",
             "frameId": null,
             "groupIds": [],
-            "height": 30,
+            "height": 10,
             "index": "a0",
             "isDeleted": false,
             "link": null,
@@ -8370,7 +8382,7 @@ exports[`regression tests > key 3 selects diamond tool > [end of test] undo stac
             "strokeWidth": 2,
             "type": "diamond",
             "version": 3,
-            "width": 30,
+            "width": 10,
             "x": 10,
             "y": 10,
           },
@@ -8421,6 +8433,7 @@ exports[`regression tests > key 4 selects ellipse tool > [end of test] appState
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -8535,7 +8548,7 @@ exports[`regression tests > key 4 selects ellipse tool > [end of test] undo stac
             "fillStyle": "solid",
             "frameId": null,
             "groupIds": [],
-            "height": 30,
+            "height": 10,
             "index": "a0",
             "isDeleted": false,
             "link": null,
@@ -8548,7 +8561,7 @@ exports[`regression tests > key 4 selects ellipse tool > [end of test] undo stac
             "strokeWidth": 2,
             "type": "ellipse",
             "version": 3,
-            "width": 30,
+            "width": 10,
             "x": 10,
             "y": 10,
           },
@@ -8599,6 +8612,7 @@ exports[`regression tests > key 5 selects arrow tool > [end of test] appState 1`
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -8662,7 +8676,6 @@ exports[`regression tests > key 5 selects arrow tool > [end of test] appState 1`
     "endBindingElement": "keep",
     "hoverPointIndex": -1,
     "isDragging": false,
-    "isEditing": false,
     "lastUncommittedPoint": null,
     "pointerDownState": {
       "lastClickedIsEndPoint": false,
@@ -8722,14 +8735,11 @@ exports[`regression tests > key 5 selects arrow tool > [end of test] undo stack
           "selectedElementIds": {
             "id0": true,
           },
-          "selectedLinearElement": {
-            "elementId": "id0",
-            "isEditing": false,
-          },
+          "selectedLinearElementId": "id0",
         },
         "inserted": {
           "selectedElementIds": {},
-          "selectedLinearElement": null,
+          "selectedLinearElementId": null,
         },
       },
     },
@@ -8748,7 +8758,7 @@ exports[`regression tests > key 5 selects arrow tool > [end of test] undo stack
             "fillStyle": "solid",
             "frameId": null,
             "groupIds": [],
-            "height": 30,
+            "height": 10,
             "index": "a0",
             "isDeleted": false,
             "lastCommittedPoint": null,
@@ -8761,8 +8771,8 @@ exports[`regression tests > key 5 selects arrow tool > [end of test] undo stack
                 0,
               ],
               [
-                30,
-                30,
+                10,
+                10,
               ],
             ],
             "roughness": 1,
@@ -8776,7 +8786,7 @@ exports[`regression tests > key 5 selects arrow tool > [end of test] undo stack
             "strokeWidth": 2,
             "type": "arrow",
             "version": 4,
-            "width": 30,
+            "width": 10,
             "x": 10,
             "y": 10,
           },
@@ -8827,6 +8837,7 @@ exports[`regression tests > key 6 selects line tool > [end of test] appState 1`]
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -8890,7 +8901,6 @@ exports[`regression tests > key 6 selects line tool > [end of test] appState 1`]
     "endBindingElement": "keep",
     "hoverPointIndex": -1,
     "isDragging": false,
-    "isEditing": false,
     "lastUncommittedPoint": null,
     "pointerDownState": {
       "lastClickedIsEndPoint": false,
@@ -8950,14 +8960,11 @@ exports[`regression tests > key 6 selects line tool > [end of test] undo stack 1
           "selectedElementIds": {
             "id0": true,
           },
-          "selectedLinearElement": {
-            "elementId": "id0",
-            "isEditing": false,
-          },
+          "selectedLinearElementId": "id0",
         },
         "inserted": {
           "selectedElementIds": {},
-          "selectedLinearElement": null,
+          "selectedLinearElementId": null,
         },
       },
     },
@@ -8975,7 +8982,7 @@ exports[`regression tests > key 6 selects line tool > [end of test] undo stack 1
             "fillStyle": "solid",
             "frameId": null,
             "groupIds": [],
-            "height": 30,
+            "height": 10,
             "index": "a0",
             "isDeleted": false,
             "lastCommittedPoint": null,
@@ -8988,8 +8995,8 @@ exports[`regression tests > key 6 selects line tool > [end of test] undo stack 1
                 0,
               ],
               [
-                30,
-                30,
+                10,
+                10,
               ],
             ],
             "polygon": false,
@@ -9002,7 +9009,7 @@ exports[`regression tests > key 6 selects line tool > [end of test] undo stack 1
             "strokeWidth": 2,
             "type": "line",
             "version": 4,
-            "width": 30,
+            "width": 10,
             "x": 10,
             "y": 10,
           },
@@ -9053,6 +9060,7 @@ exports[`regression tests > key 7 selects freedraw tool > [end of test] appState
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -9159,12 +9167,12 @@ exports[`regression tests > key 7 selects freedraw tool > [end of test] undo sta
             "fillStyle": "solid",
             "frameId": null,
             "groupIds": [],
-            "height": 30,
+            "height": 10,
             "index": "a0",
             "isDeleted": false,
             "lastCommittedPoint": [
-              30,
-              30,
+              10,
+              10,
             ],
             "link": null,
             "locked": false,
@@ -9175,12 +9183,12 @@ exports[`regression tests > key 7 selects freedraw tool > [end of test] undo sta
                 0,
               ],
               [
-                30,
-                30,
+                10,
+                10,
               ],
               [
-                30,
-                30,
+                10,
+                10,
               ],
             ],
             "pressures": [
@@ -9196,7 +9204,7 @@ exports[`regression tests > key 7 selects freedraw tool > [end of test] undo sta
             "strokeWidth": 2,
             "type": "freedraw",
             "version": 4,
-            "width": 30,
+            "width": 10,
             "x": 10,
             "y": 10,
           },
@@ -9247,6 +9255,7 @@ exports[`regression tests > key a selects arrow tool > [end of test] appState 1`
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -9310,7 +9319,6 @@ exports[`regression tests > key a selects arrow tool > [end of test] appState 1`
     "endBindingElement": "keep",
     "hoverPointIndex": -1,
     "isDragging": false,
-    "isEditing": false,
     "lastUncommittedPoint": null,
     "pointerDownState": {
       "lastClickedIsEndPoint": false,
@@ -9370,14 +9378,11 @@ exports[`regression tests > key a selects arrow tool > [end of test] undo stack
           "selectedElementIds": {
             "id0": true,
           },
-          "selectedLinearElement": {
-            "elementId": "id0",
-            "isEditing": false,
-          },
+          "selectedLinearElementId": "id0",
         },
         "inserted": {
           "selectedElementIds": {},
-          "selectedLinearElement": null,
+          "selectedLinearElementId": null,
         },
       },
     },
@@ -9396,7 +9401,7 @@ exports[`regression tests > key a selects arrow tool > [end of test] undo stack
             "fillStyle": "solid",
             "frameId": null,
             "groupIds": [],
-            "height": 30,
+            "height": 10,
             "index": "a0",
             "isDeleted": false,
             "lastCommittedPoint": null,
@@ -9409,8 +9414,8 @@ exports[`regression tests > key a selects arrow tool > [end of test] undo stack
                 0,
               ],
               [
-                30,
-                30,
+                10,
+                10,
               ],
             ],
             "roughness": 1,
@@ -9424,7 +9429,7 @@ exports[`regression tests > key a selects arrow tool > [end of test] undo stack
             "strokeWidth": 2,
             "type": "arrow",
             "version": 4,
-            "width": 30,
+            "width": 10,
             "x": 10,
             "y": 10,
           },
@@ -9475,6 +9480,7 @@ exports[`regression tests > key d selects diamond tool > [end of test] appState
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -9589,7 +9595,7 @@ exports[`regression tests > key d selects diamond tool > [end of test] undo stac
             "fillStyle": "solid",
             "frameId": null,
             "groupIds": [],
-            "height": 30,
+            "height": 10,
             "index": "a0",
             "isDeleted": false,
             "link": null,
@@ -9602,7 +9608,7 @@ exports[`regression tests > key d selects diamond tool > [end of test] undo stac
             "strokeWidth": 2,
             "type": "diamond",
             "version": 3,
-            "width": 30,
+            "width": 10,
             "x": 10,
             "y": 10,
           },
@@ -9653,6 +9659,7 @@ exports[`regression tests > key l selects line tool > [end of test] appState 1`]
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -9716,7 +9723,6 @@ exports[`regression tests > key l selects line tool > [end of test] appState 1`]
     "endBindingElement": "keep",
     "hoverPointIndex": -1,
     "isDragging": false,
-    "isEditing": false,
     "lastUncommittedPoint": null,
     "pointerDownState": {
       "lastClickedIsEndPoint": false,
@@ -9776,14 +9782,11 @@ exports[`regression tests > key l selects line tool > [end of test] undo stack 1
           "selectedElementIds": {
             "id0": true,
           },
-          "selectedLinearElement": {
-            "elementId": "id0",
-            "isEditing": false,
-          },
+          "selectedLinearElementId": "id0",
         },
         "inserted": {
           "selectedElementIds": {},
-          "selectedLinearElement": null,
+          "selectedLinearElementId": null,
         },
       },
     },
@@ -9801,7 +9804,7 @@ exports[`regression tests > key l selects line tool > [end of test] undo stack 1
             "fillStyle": "solid",
             "frameId": null,
             "groupIds": [],
-            "height": 30,
+            "height": 10,
             "index": "a0",
             "isDeleted": false,
             "lastCommittedPoint": null,
@@ -9814,8 +9817,8 @@ exports[`regression tests > key l selects line tool > [end of test] undo stack 1
                 0,
               ],
               [
-                30,
-                30,
+                10,
+                10,
               ],
             ],
             "polygon": false,
@@ -9828,7 +9831,7 @@ exports[`regression tests > key l selects line tool > [end of test] undo stack 1
             "strokeWidth": 2,
             "type": "line",
             "version": 4,
-            "width": 30,
+            "width": 10,
             "x": 10,
             "y": 10,
           },
@@ -9879,6 +9882,7 @@ exports[`regression tests > key o selects ellipse tool > [end of test] appState
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -9993,7 +9997,7 @@ exports[`regression tests > key o selects ellipse tool > [end of test] undo stac
             "fillStyle": "solid",
             "frameId": null,
             "groupIds": [],
-            "height": 30,
+            "height": 10,
             "index": "a0",
             "isDeleted": false,
             "link": null,
@@ -10006,7 +10010,7 @@ exports[`regression tests > key o selects ellipse tool > [end of test] undo stac
             "strokeWidth": 2,
             "type": "ellipse",
             "version": 3,
-            "width": 30,
+            "width": 10,
             "x": 10,
             "y": 10,
           },
@@ -10057,6 +10061,7 @@ exports[`regression tests > key p selects freedraw tool > [end of test] appState
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -10163,12 +10168,12 @@ exports[`regression tests > key p selects freedraw tool > [end of test] undo sta
             "fillStyle": "solid",
             "frameId": null,
             "groupIds": [],
-            "height": 30,
+            "height": 10,
             "index": "a0",
             "isDeleted": false,
             "lastCommittedPoint": [
-              30,
-              30,
+              10,
+              10,
             ],
             "link": null,
             "locked": false,
@@ -10179,12 +10184,12 @@ exports[`regression tests > key p selects freedraw tool > [end of test] undo sta
                 0,
               ],
               [
-                30,
-                30,
+                10,
+                10,
               ],
               [
-                30,
-                30,
+                10,
+                10,
               ],
             ],
             "pressures": [
@@ -10200,7 +10205,7 @@ exports[`regression tests > key p selects freedraw tool > [end of test] undo sta
             "strokeWidth": 2,
             "type": "freedraw",
             "version": 4,
-            "width": 30,
+            "width": 10,
             "x": 10,
             "y": 10,
           },
@@ -10251,6 +10256,7 @@ exports[`regression tests > key r selects rectangle tool > [end of test] appStat
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -10365,7 +10371,7 @@ exports[`regression tests > key r selects rectangle tool > [end of test] undo st
             "fillStyle": "solid",
             "frameId": null,
             "groupIds": [],
-            "height": 30,
+            "height": 10,
             "index": "a0",
             "isDeleted": false,
             "link": null,
@@ -10378,7 +10384,7 @@ exports[`regression tests > key r selects rectangle tool > [end of test] undo st
             "strokeWidth": 2,
             "type": "rectangle",
             "version": 3,
-            "width": 30,
+            "width": 10,
             "x": 10,
             "y": 10,
           },
@@ -10429,6 +10435,7 @@ exports[`regression tests > make a group and duplicate it > [end of test] appSta
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -10892,7 +10899,32 @@ exports[`regression tests > make a group and duplicate it > [end of test] undo s
           },
         },
       },
-      "updated": {},
+      "updated": {
+        "id0": {
+          "deleted": {
+            "version": 6,
+          },
+          "inserted": {
+            "version": 4,
+          },
+        },
+        "id3": {
+          "deleted": {
+            "version": 6,
+          },
+          "inserted": {
+            "version": 4,
+          },
+        },
+        "id6": {
+          "deleted": {
+            "version": 6,
+          },
+          "inserted": {
+            "version": 4,
+          },
+        },
+      },
     },
     "id": "id21",
   },
@@ -10933,6 +10965,7 @@ exports[`regression tests > noop interaction after undo shouldn't create history
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -11211,6 +11244,7 @@ exports[`regression tests > pinch-to-zoom works > [end of test] appState 1`] = `
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -11332,6 +11366,7 @@ exports[`regression tests > shift click on selected element should deselect it o
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -11530,6 +11565,7 @@ exports[`regression tests > shift-click to multiselect, then drag > [end of test
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -11847,6 +11883,7 @@ exports[`regression tests > should group elements and ungroup them > [end of tes
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -12274,6 +12311,7 @@ exports[`regression tests > single-clicking on a subgroup of a selected group sh
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -12912,6 +12950,7 @@ exports[`regression tests > spacebar + drag scrolls the canvas > [end of test] a
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -13036,6 +13075,7 @@ exports[`regression tests > supports nested groups > [end of test] appState 1`]
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": "id11",
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -13665,6 +13705,7 @@ exports[`regression tests > switches from group of selected elements to another
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -14002,6 +14043,7 @@ exports[`regression tests > switches selected element on pointer down > [end of
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -14264,6 +14306,7 @@ exports[`regression tests > two-finger scroll works > [end of test] appState 1`]
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -14385,6 +14428,7 @@ exports[`regression tests > undo/redo drawing an element > [end of test] appStat
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -14476,13 +14520,10 @@ exports[`regression tests > undo/redo drawing an element > [end of test] redo st
     "appState": AppStateDelta {
       "delta": Delta {
         "deleted": {
-          "selectedLinearElement": null,
+          "selectedLinearElementId": null,
         },
         "inserted": {
-          "selectedLinearElement": {
-            "elementId": "id6",
-            "isEditing": false,
-          },
+          "selectedLinearElementId": "id6",
         },
       },
     },
@@ -14775,6 +14816,7 @@ exports[`regression tests > updates fontSize & fontFamily appState > [end of tes
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,
@@ -14896,6 +14938,7 @@ exports[`regression tests > zoom hotkeys > [end of test] appState 1`] = `
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,

packages/excalidraw/tests/data/restore.test.ts

@@ -60,11 +60,7 @@ describe("restoreElements", () => {
     const rectElement = API.createElement({ type: "rectangle" });
     mockSizeHelper.mockImplementation(() => true);
 
-    expect(
-      restore.restoreElements([rectElement], null, {
-        deleteInvisibleElements: true,
-      }),
-    ).toEqual([expect.objectContaining({ isDeleted: true })]);
+    expect(restore.restoreElements([rectElement], null).length).toBe(0);
   });
 
   it("should restore text element correctly passing value for each attribute", () => {
@@ -89,23 +85,6 @@ describe("restoreElements", () => {
     });
   });
 
-  it("should not delete empty text element when opts.deleteInvisibleElements is not defined", () => {
-    const textElement = API.createElement({
-      type: "text",
-      text: "",
-      isDeleted: false,
-    });
-
-    const restoredElements = restore.restoreElements([textElement], null);
-
-    expect(restoredElements).toEqual([
-      expect.objectContaining({
-        id: textElement.id,
-        isDeleted: false,
-      }),
-    ]);
-  });
-
   it("should restore text element correctly with unknown font family, null text and undefined alignment", () => {
     const textElement: any = API.createElement({
       type: "text",
@@ -118,9 +97,10 @@ describe("restoreElements", () => {
     textElement.font = "10 unknown";
 
     expect(textElement.isDeleted).toBe(false);
-    const restoredText = restore.restoreElements([textElement], null, {
-      deleteInvisibleElements: true,
-    })[0] as ExcalidrawTextElement;
+    const restoredText = restore.restoreElements(
+      [textElement],
+      null,
+    )[0] as ExcalidrawTextElement;
     expect(restoredText.isDeleted).toBe(true);
     expect(restoredText).toMatchSnapshot({
       seed: expect.any(Number),
@@ -197,16 +177,13 @@ describe("restoreElements", () => {
       y: 0,
     });
 
-    const restoredElements = restore.restoreElements([arrowElement], null, {
-      deleteInvisibleElements: true,
-    });
+    const restoredElements = restore.restoreElements([arrowElement], null);
 
     const restoredArrow = restoredElements[0] as
       | ExcalidrawArrowElement
       | undefined;
 
-    expect(restoredArrow).not.toBeUndefined();
-    expect(restoredArrow?.isDeleted).toBe(true);
+    expect(restoredArrow).toBeUndefined();
   });
 
   it("should keep 'imperceptibly' small freedraw/line elements", () => {
@@ -871,7 +848,6 @@ describe("repairing bindings", () => {
     let restoredElements = restore.restoreElements(
       [container, invisibleBoundElement, boundElement],
       null,
-      { deleteInvisibleElements: true },
     );
 
     expect(restoredElements).toEqual([
@@ -879,11 +855,6 @@ describe("repairing bindings", () => {
         id: container.id,
         boundElements: [obsoleteBinding, invisibleBinding, nonExistentBinding],
       }),
-      expect.objectContaining({
-        id: invisibleBoundElement.id,
-        containerId: container.id,
-        isDeleted: true,
-      }),
       expect.objectContaining({
         id: boundElement.id,
         containerId: container.id,
@@ -893,7 +864,7 @@ describe("repairing bindings", () => {
     restoredElements = restore.restoreElements(
       [container, invisibleBoundElement, boundElement],
       null,
-      { repairBindings: true, deleteInvisibleElements: true },
+      { repairBindings: true },
     );
 
     expect(restoredElements).toEqual([
@@ -901,11 +872,6 @@ describe("repairing bindings", () => {
         id: container.id,
         boundElements: [],
       }),
-      expect.objectContaining({
-        id: invisibleBoundElement.id,
-        containerId: container.id,
-        isDeleted: true,
-      }),
       expect.objectContaining({
         id: boundElement.id,
         containerId: container.id,

packages/excalidraw/tests/dragCreate.test.tsx

@@ -315,12 +315,7 @@ describe("Test dragCreate", () => {
       );
       expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`5`);
       expect(h.state.selectionElement).toBeNull();
-      expect(h.elements).toEqual([
-        expect.objectContaining({
-          type: "arrow",
-          isDeleted: true,
-        }),
-      ]);
+      expect(h.elements.length).toEqual(0);
     });
 
     it("line", async () => {
@@ -349,12 +344,7 @@ describe("Test dragCreate", () => {
       );
       expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`5`);
       expect(h.state.selectionElement).toBeNull();
-      expect(h.elements).toEqual([
-        expect.objectContaining({
-          type: "line",
-          isDeleted: true,
-        }),
-      ]);
+      expect(h.elements.length).toEqual(0);
     });
   });
 });

packages/excalidraw/tests/history.test.tsx

@@ -1073,7 +1073,7 @@ describe("history", () => {
       expect(API.getUndoStack().length).toBe(6);
       expect(API.getRedoStack().length).toBe(0);
       expect(assertSelectedElements(h.elements[0]));
-      expect(h.state.selectedLinearElement?.isEditing ?? false).toBe(false);
+      expect(h.state.editingLinearElement).toBeNull();
       expect(h.state.selectedLinearElement).not.toBeNull();
       expect(h.elements).toEqual([
         expect.objectContaining({
@@ -1090,7 +1090,7 @@ describe("history", () => {
       expect(API.getUndoStack().length).toBe(5);
       expect(API.getRedoStack().length).toBe(1);
       expect(assertSelectedElements(h.elements[0]));
-      expect(h.state.selectedLinearElement?.isEditing).toBe(true);
+      expect(h.state.editingLinearElement?.elementId).toBe(h.elements[0].id);
       expect(h.state.selectedLinearElement?.elementId).toBe(h.elements[0].id);
       expect(h.elements).toEqual([
         expect.objectContaining({
@@ -1114,7 +1114,7 @@ describe("history", () => {
       expect(API.getUndoStack().length).toBe(4);
       expect(API.getRedoStack().length).toBe(2);
       expect(assertSelectedElements(h.elements[0]));
-      expect(h.state.selectedLinearElement?.isEditing).toBe(true);
+      expect(h.state.editingLinearElement?.elementId).toBe(h.elements[0].id);
       expect(h.state.selectedLinearElement?.elementId).toBe(h.elements[0].id);
       expect(h.elements).toEqual([
         expect.objectContaining({
@@ -1131,7 +1131,7 @@ describe("history", () => {
       expect(API.getUndoStack().length).toBe(3);
       expect(API.getRedoStack().length).toBe(3);
       expect(assertSelectedElements(h.elements[0]));
-      expect(h.state.selectedLinearElement?.isEditing ?? false).toBe(false); // undo `open editor`
+      expect(h.state.editingLinearElement).toBeNull(); // undo `open editor`
       expect(h.state.selectedLinearElement?.elementId).toBe(h.elements[0].id);
       expect(h.elements).toEqual([
         expect.objectContaining({
@@ -1148,7 +1148,7 @@ describe("history", () => {
       expect(API.getUndoStack().length).toBe(2);
       expect(API.getRedoStack().length).toBe(4);
       expect(assertSelectedElements(h.elements[0]));
-      expect(h.state.selectedLinearElement?.isEditing ?? false).toBe(false);
+      expect(h.state.editingLinearElement).toBeNull();
       expect(h.state.selectedLinearElement).toBeNull(); // undo `actionFinalize`
       expect(h.elements).toEqual([
         expect.objectContaining({
@@ -1165,7 +1165,7 @@ describe("history", () => {
       expect(API.getUndoStack().length).toBe(1);
       expect(API.getRedoStack().length).toBe(5);
       expect(assertSelectedElements(h.elements[0]));
-      expect(h.state.selectedLinearElement?.isEditing ?? false).toBe(false);
+      expect(h.state.editingLinearElement).toBeNull();
       expect(h.state.selectedLinearElement).toBeNull();
       expect(h.elements).toEqual([
         expect.objectContaining({
@@ -1181,7 +1181,7 @@ describe("history", () => {
       expect(API.getUndoStack().length).toBe(0);
       expect(API.getRedoStack().length).toBe(6);
       expect(API.getSelectedElements().length).toBe(0);
-      expect(h.state.selectedLinearElement?.isEditing ?? false).toBe(false);
+      expect(h.state.editingLinearElement).toBeNull();
       expect(h.state.selectedLinearElement).toBeNull();
       expect(h.elements).toEqual([
         expect.objectContaining({
@@ -1197,7 +1197,7 @@ describe("history", () => {
       expect(API.getUndoStack().length).toBe(1);
       expect(API.getRedoStack().length).toBe(5);
       expect(assertSelectedElements(h.elements[0]));
-      expect(h.state.selectedLinearElement?.isEditing ?? false).toBe(false);
+      expect(h.state.editingLinearElement).toBeNull();
       expect(h.state.selectedLinearElement).toBeNull();
       expect(h.elements).toEqual([
         expect.objectContaining({
@@ -1213,7 +1213,7 @@ describe("history", () => {
       expect(API.getUndoStack().length).toBe(2);
       expect(API.getRedoStack().length).toBe(4);
       expect(assertSelectedElements(h.elements[0]));
-      expect(h.state.selectedLinearElement?.isEditing ?? false).toBe(false);
+      expect(h.state.editingLinearElement).toBeNull();
       expect(h.state.selectedLinearElement).toBeNull(); // undo `actionFinalize`
       expect(h.elements).toEqual([
         expect.objectContaining({
@@ -1230,7 +1230,7 @@ describe("history", () => {
       expect(API.getUndoStack().length).toBe(3);
       expect(API.getRedoStack().length).toBe(3);
       expect(assertSelectedElements(h.elements[0]));
-      expect(h.state.selectedLinearElement?.isEditing ?? false).toBe(false); // undo `open editor`
+      expect(h.state.editingLinearElement).toBeNull(); // undo `open editor`
       expect(h.state.selectedLinearElement?.elementId).toBe(h.elements[0].id);
       expect(h.elements).toEqual([
         expect.objectContaining({
@@ -1247,7 +1247,7 @@ describe("history", () => {
       expect(API.getUndoStack().length).toBe(4);
       expect(API.getRedoStack().length).toBe(2);
       expect(assertSelectedElements(h.elements[0]));
-      expect(h.state.selectedLinearElement?.isEditing).toBe(true);
+      expect(h.state.editingLinearElement?.elementId).toBe(h.elements[0].id);
       expect(h.state.selectedLinearElement?.elementId).toBe(h.elements[0].id);
       expect(h.elements).toEqual([
         expect.objectContaining({
@@ -1264,7 +1264,7 @@ describe("history", () => {
       expect(API.getUndoStack().length).toBe(5);
       expect(API.getRedoStack().length).toBe(1);
       expect(assertSelectedElements(h.elements[0]));
-      expect(h.state.selectedLinearElement?.isEditing).toBe(true);
+      expect(h.state.editingLinearElement?.elementId).toBe(h.elements[0].id);
       expect(h.state.selectedLinearElement?.elementId).toBe(h.elements[0].id);
       expect(h.elements).toEqual([
         expect.objectContaining({
@@ -1281,7 +1281,7 @@ describe("history", () => {
       expect(API.getUndoStack().length).toBe(6);
       expect(API.getRedoStack().length).toBe(0);
       expect(assertSelectedElements(h.elements[0]));
-      expect(h.state.selectedLinearElement?.isEditing ?? false).toBe(false);
+      expect(h.state.editingLinearElement).toBeNull();
       expect(h.state.selectedLinearElement).not.toBeNull();
       expect(h.elements).toEqual([
         expect.objectContaining({
@@ -3029,8 +3029,8 @@ describe("history", () => {
 
       expect(API.getUndoStack().length).toBe(4);
       expect(API.getRedoStack().length).toBe(0);
+      expect(h.state.editingLinearElement).toBeNull();
       expect(h.state.selectedLinearElement).not.toBeNull();
-      expect(h.state.selectedLinearElement?.isEditing).toBe(false);
 
       // Simulate remote update
       API.updateScene({
@@ -3043,15 +3043,16 @@ describe("history", () => {
       });
 
       Keyboard.undo();
-      expect(API.getUndoStack().length).toBe(0);
-      expect(API.getRedoStack().length).toBe(4);
+      expect(API.getUndoStack().length).toBe(1);
+      expect(API.getRedoStack().length).toBe(3);
+      expect(h.state.editingLinearElement).toBeNull();
       expect(h.state.selectedLinearElement).toBeNull();
 
       Keyboard.redo();
       expect(API.getUndoStack().length).toBe(4);
       expect(API.getRedoStack().length).toBe(0);
+      expect(h.state.editingLinearElement).toBeNull();
       expect(h.state.selectedLinearElement).toBeNull();
-      expect(h.state.selectedLinearElement?.isEditing ?? false).toBe(false);
     });
 
     it("should iterate through the history when z-index changes do not produce visible change and we synced changed indices", async () => {
@@ -4055,7 +4056,7 @@ describe("history", () => {
             expect.objectContaining({
               id: container.id,
               boundElements: [{ id: remoteText.id, type: "text" }],
-              isDeleted: true,
+              isDeleted: false, // isDeleted got remotely updated to false
             }),
             expect.objectContaining({
               id: text.id,
@@ -4065,7 +4066,7 @@ describe("history", () => {
             expect.objectContaining({
               id: remoteText.id,
               // unbound
-              containerId: null,
+              containerId: container.id,
               isDeleted: false,
             }),
           ]);

packages/excalidraw/tests/regressionTests.test.tsx

@@ -150,7 +150,7 @@ describe("regression tests", () => {
         expect(h.state.activeTool.type).toBe(shape);
 
         mouse.down(10, 10);
-        mouse.up(30, 30);
+        mouse.up(10, 10);
 
         if (shouldSelect) {
           expect(API.getSelectedElement().type).toBe(shape);

packages/excalidraw/types.ts

@@ -213,6 +213,7 @@ export type InteractiveCanvasAppState = Readonly<
   _CommonCanvasAppState & {
     // renderInteractiveScene
     activeEmbeddable: AppState["activeEmbeddable"];
+    editingLinearElement: AppState["editingLinearElement"];
     selectionElement: AppState["selectionElement"];
     selectedGroupIds: AppState["selectedGroupIds"];
     selectedLinearElement: AppState["selectedLinearElement"];
@@ -248,10 +249,10 @@ export type ObservedElementsAppState = {
   editingGroupId: AppState["editingGroupId"];
   selectedElementIds: AppState["selectedElementIds"];
   selectedGroupIds: AppState["selectedGroupIds"];
-  selectedLinearElement: {
-    elementId: LinearElementEditor["elementId"];
-    isEditing: boolean;
-  } | null;
+  // Avoiding storing whole instance, as it could lead into state incosistencies, empty undos/redos and etc.
+  editingLinearElementId: LinearElementEditor["elementId"] | null;
+  // Right now it's coupled to `editingLinearElement`, ideally it should not be really needed as we already have selectedElementIds & editingLinearElementId
+  selectedLinearElementId: LinearElementEditor["elementId"] | null;
   croppingElementId: AppState["croppingElementId"];
   lockedMultiSelections: AppState["lockedMultiSelections"];
   activeLockedId: AppState["activeLockedId"];
@@ -306,6 +307,7 @@ export interface AppState {
    * set when a new text is created or when an existing text is being edited
    */
   editingTextElement: NonDeletedExcalidrawElement | null;
+  editingLinearElement: LinearElementEditor | null;
   activeTool: {
     /**
      * indicates a previous tool we should revert back to if we deselect the
@@ -442,6 +444,11 @@ export interface AppState {
   // as elements are unlocked, we remove the groupId from the elements
   // and also remove groupId from this map
   lockedMultiSelections: { [groupId: string]: true };
+  cropPositionMovement: {
+    croppingElementId?: string;
+    enabled: boolean;
+    directionLock: "x" | "y" | null;
+  };
 }
 
 export type SearchMatch = {
@@ -731,8 +738,6 @@ export type AppClassProperties = {
 
   onPointerUpEmitter: App["onPointerUpEmitter"];
   updateEditorAtom: App["updateEditorAtom"];
-
-  defaultSelectionTool: "selection" | "lasso";
 };
 
 export type PointerDownState = Readonly<{
@@ -782,10 +787,6 @@ export type PointerDownState = Readonly<{
     // by default same as PointerDownState.origin. On alt-duplication, reset
     // to current pointer position at time of duplication.
     origin: { x: number; y: number };
-    // Whether to block drag after lasso selection
-    // this is meant to be used to block dragging after lasso selection on PCs
-    // until the next pointer down
-    blockDragging: boolean;
   };
   // We need to have these in the state so that we can unsubscribe them
   eventListeners: {
@@ -801,13 +802,17 @@ export type PointerDownState = Readonly<{
   boxSelection: {
     hasOccurred: boolean;
   };
+  cropPositionMovement: {
+    croppingElementId?: string;
+    enabled: boolean;
+    directionLock: "x" | "y" | null;
+  };
 }>;
 
 export type UnsubscribeCallback = () => void;
 
 export interface ExcalidrawImperativeAPI {
   updateScene: InstanceType<typeof App>["updateScene"];
-  applyDeltas: InstanceType<typeof App>["applyDeltas"];
   mutateElement: InstanceType<typeof App>["mutateElement"];
   updateLibrary: InstanceType<typeof Library>["updateLibrary"];
   resetScene: InstanceType<typeof App>["resetScene"];

packages/excalidraw/wysiwyg/textWysiwyg.test.tsx

@@ -1198,11 +1198,7 @@ describe("textWysiwyg", () => {
       updateTextEditor(editor, "   ");
       Keyboard.exitTextEditor(editor);
       expect(rectangle.boundElements).toStrictEqual([]);
-      expect(h.elements[1]).toEqual(
-        expect.objectContaining({
-          isDeleted: true,
-        }),
-      );
+      expect(h.elements[1].isDeleted).toBe(true);
     });
 
     it("should restore original container height and clear cache once text is unbind", async () => {

packages/math/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@excalidraw/math",
-  "version": "0.18.0",
+  "version": "0.1.0",
   "type": "module",
   "types": "./dist/types/math/src/index.d.ts",
   "main": "./dist/prod/index.js",
@@ -13,10 +13,7 @@
       "default": "./dist/prod/index.js"
     },
     "./*": {
-      "types": "./dist/types/math/src/*.d.ts",
-      "development": "./dist/dev/index.js",
-      "production": "./dist/prod/index.js",
-      "default": "./dist/prod/index.js"
+      "types": "./dist/types/math/src/*.d.ts"
     }
   },
   "files": [
@@ -59,8 +56,5 @@
   "scripts": {
     "gen:types": "rimraf types && tsc",
     "build:esm": "rimraf dist && node ../../scripts/buildBase.js && yarn gen:types"
-  },
-  "dependencies": {
-    "@excalidraw/common": "0.18.0"
   }
 }

packages/utils/src/export.ts

@@ -49,7 +49,6 @@ export const exportToCanvas = ({
     { elements, appState },
     null,
     null,
-    { deleteInvisibleElements: true },
   );
   const { exportBackground, viewBackgroundColor } = restoredAppState;
   return _exportToCanvas(
@@ -180,7 +179,6 @@ export const exportToSvg = async ({
     { elements, appState },
     null,
     null,
-    { deleteInvisibleElements: true },
   );
 
   const exportAppState = {

packages/utils/tests/__snapshots__/export.test.ts.snap

@@ -34,6 +34,7 @@ exports[`exportToSvg > with default arguments 1`] = `
   "defaultSidebarDockedPreference": false,
   "editingFrame": null,
   "editingGroupId": null,
+  "editingLinearElement": null,
   "editingTextElement": null,
   "elementsToHighlight": null,
   "errorMessage": null,

playwright.config.ts

@@ -1,89 +0,0 @@
-import { defineConfig, devices } from "@playwright/test";
-
-/**
- * Read environment variables from file.
- * https://github.com/motdotla/dotenv
- */
-// import dotenv from 'dotenv';
-// import path from 'path';
-// dotenv.config({ path: path.resolve(__dirname, '.env') });
-
-/**
- * See https://playwright.dev/docs/test-configuration.
- */
-export default defineConfig({
-  testDir: "./excalidraw-app/tests/regression",
-  snapshotPathTemplate:
-    "{snapshotDir}/{testFileDir}/{testFileName}-snapshots/{arg}{ext}",
-  /* Run tests in files in parallel */
-  fullyParallel: true,
-  /* Fail the build on CI if you accidentally left test.only in the source code. */
-  forbidOnly: !!process.env.CI,
-  /* Retry on CI only */
-  retries: process.env.CI ? 2 : 1,
-  /* Opt out of parallel tests on CI. */
-  workers: process.env.CI ? 1 : undefined,
-  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
-  reporter: "html",
-  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
-  use: {
-    actionTimeout: 0,
-    /* Base URL to use in actions like `await page.goto('/')`. */
-    baseURL: "http://localhost:3000",
-
-    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
-    trace: "on-first-retry",
-    headless: true,
-  },
-  timeout: 1200000,
-
-  /* Configure projects for major browsers */
-  projects: [
-    {
-      name: "chromium",
-      use: {
-        ...devices["Desktop Chrome"],
-        launchOptions: {
-          args: ["--disable-font-subpixel-positioning", "--disable-gpu"],
-        },
-      },
-    },
-
-    // {
-    //   name: "firefox",
-    //   use: { ...devices["Desktop Firefox"] },
-    // },
-
-    // {
-    //   name: "webkit",
-    //   use: { ...devices["Desktop Safari"] },
-    // },
-
-    /* Test against mobile viewports. */
-    // {
-    //   name: 'Mobile Chrome',
-    //   use: { ...devices['Pixel 5'] },
-    // },
-    // {
-    //   name: 'Mobile Safari',
-    //   use: { ...devices['iPhone 12'] },
-    // },
-
-    /* Test against branded browsers. */
-    // {
-    //   name: 'Microsoft Edge',
-    //   use: { ...devices['Desktop Edge'], channel: 'msedge' },
-    // },
-    // {
-    //   name: 'Google Chrome',
-    //   use: { ...devices['Desktop Chrome'], channel: 'chrome' },
-    // },
-  ],
-
-  /* Run your local dev server before starting the tests */
-  webServer: {
-    command: "yarn start --no-open",
-    url: "http://localhost:3000",
-    reuseExistingServer: !process.env.CI,
-  },
-});

scripts/autorelease.js

@@ -0,0 +1,71 @@
+const { exec, execSync } = require("child_process");
+const fs = require("fs");
+
+const core = require("@actions/core");
+
+const excalidrawDir = `${__dirname}/../packages/excalidraw`;
+const excalidrawPackage = `${excalidrawDir}/package.json`;
+const pkg = require(excalidrawPackage);
+const isPreview = process.argv.slice(2)[0] === "preview";
+
+const getShortCommitHash = () => {
+  return execSync("git rev-parse --short HEAD").toString().trim();
+};
+
+const publish = () => {
+  const tag = isPreview ? "preview" : "next";
+
+  try {
+    execSync(`yarn  --frozen-lockfile`);
+    execSync(`yarn run build:esm`, { cwd: excalidrawDir });
+    execSync(`yarn --cwd ${excalidrawDir} publish --tag ${tag}`);
+    console.info(`Published ${pkg.name}@${tag}🎉`);
+    core.setOutput(
+      "result",
+      `**Preview version has been shipped** :rocket:
+    You can use [@excalidraw/excalidraw@${pkg.version}](https://www.npmjs.com/package/@excalidraw/excalidraw/v/${pkg.version}) for testing!`,
+    );
+  } catch (error) {
+    core.setOutput("result", "package couldn't be published :warning:!");
+    console.error(error);
+    process.exit(1);
+  }
+};
+// get files changed between prev and head commit
+exec(`git diff --name-only HEAD^ HEAD`, async (error, stdout, stderr) => {
+  if (error || stderr) {
+    console.error(error);
+    core.setOutput("result", ":warning: Package couldn't be published!");
+    process.exit(1);
+  }
+  const changedFiles = stdout.trim().split("\n");
+
+  const excalidrawPackageFiles = changedFiles.filter((file) => {
+    return (
+      file.indexOf("packages/excalidraw") >= 0 ||
+      file.indexOf("buildPackage.js") > 0
+    );
+  });
+  if (!excalidrawPackageFiles.length) {
+    console.info("Skipping release as no valid diff found");
+    core.setOutput("result", "Skipping release as no valid diff found");
+    process.exit(0);
+  }
+
+  // update package.json
+  let version = `${pkg.version}-${getShortCommitHash()}`;
+
+  // update readme
+
+  if (isPreview) {
+    // use pullNumber-commithash as the version for preview
+    const pullRequestNumber = process.argv.slice(3)[0];
+    version = `${pkg.version}-${pullRequestNumber}-${getShortCommitHash()}`;
+  }
+  pkg.version = version;
+
+  fs.writeFileSync(excalidrawPackage, JSON.stringify(pkg, null, 2), "utf8");
+
+  console.info("Publish in progress...");
+  publish();
+});

scripts/buildBase.js

@@ -11,9 +11,12 @@ const getConfig = (outdir) => ({
   entryNames: "[name]",
   assetNames: "[dir]/[name]",
   alias: {
+    "@excalidraw/common": path.resolve(__dirname, "../packages/common/src"),
+    "@excalidraw/element": path.resolve(__dirname, "../packages/element/src"),
+    "@excalidraw/excalidraw": path.resolve(__dirname, "../packages/excalidraw"),
+    "@excalidraw/math": path.resolve(__dirname, "../packages/math/src"),
     "@excalidraw/utils": path.resolve(__dirname, "../packages/utils/src"),
   },
-  external: ["@excalidraw/common", "@excalidraw/element", "@excalidraw/math"],
 });
 
 function buildDev(config) {

scripts/buildPackage.js

@@ -28,9 +28,12 @@ const getConfig = (outdir) => ({
   assetNames: "[dir]/[name]",
   chunkNames: "[dir]/[name]-[hash]",
   alias: {
+    "@excalidraw/common": path.resolve(__dirname, "../packages/common/src"),
+    "@excalidraw/element": path.resolve(__dirname, "../packages/element/src"),
+    "@excalidraw/excalidraw": path.resolve(__dirname, "../packages/excalidraw"),
+    "@excalidraw/math": path.resolve(__dirname, "../packages/math/src"),
     "@excalidraw/utils": path.resolve(__dirname, "../packages/utils/src"),
   },
-  external: ["@excalidraw/common", "@excalidraw/element", "@excalidraw/math"],
   loader: {
     ".woff2": "file",
   },

scripts/prerelease.js

@@ -0,0 +1,38 @@
+const fs = require("fs");
+const util = require("util");
+
+const exec = util.promisify(require("child_process").exec);
+const updateChangelog = require("./updateChangelog");
+
+const excalidrawDir = `${__dirname}/../packages/excalidraw/`;
+const excalidrawPackage = `${excalidrawDir}/package.json`;
+
+const updatePackageVersion = (nextVersion) => {
+  const pkg = require(excalidrawPackage);
+  pkg.version = nextVersion;
+  const content = `${JSON.stringify(pkg, null, 2)}\n`;
+  fs.writeFileSync(excalidrawPackage, content, "utf-8");
+};
+
+const prerelease = async (nextVersion) => {
+  try {
+    await updateChangelog(nextVersion);
+    updatePackageVersion(nextVersion);
+    await exec(`git add -u`);
+    await exec(
+      `git commit -m "docs: release @excalidraw/excalidraw@${nextVersion}  🎉"`,
+    );
+
+    console.info("Done!");
+  } catch (error) {
+    console.error(error);
+    process.exit(1);
+  }
+};
+
+const nextVersion = process.argv.slice(2)[0];
+if (!nextVersion) {
+  console.error("Pass the next version to release!");
+  process.exit(1);
+}
+prerelease(nextVersion);

scripts/release.js

@@ -1,239 +1,28 @@
-const fs = require("fs");
-const path = require("path");
-
 const { execSync } = require("child_process");
 
-const updateChangelog = require("./updateChangelog");
+const excalidrawDir = `${__dirname}/../packages/excalidraw`;
+const excalidrawPackage = `${excalidrawDir}/package.json`;
+const pkg = require(excalidrawPackage);
 
-// skipping utils for now, as it has independent release process
-const PACKAGES = ["common", "math", "element", "excalidraw"];
-const PACKAGES_DIR = path.resolve(__dirname, "../packages");
-
-/**
- * Returns the arguments for the release script.
- *
- * Usage examples:
- * - yarn release --help                          -> prints this help message
- * - yarn release                                 -> publishes `@excalidraw` packages with "test" tag and "-[hash]" version suffix
- * - yarn release --tag=test                      -> same as above
- * - yarn release --tag=next                      -> publishes `@excalidraw` packages with "next" tag and version "-[hash]" suffix
- * - yarn release --tag=next --non-interactive    -> skips interactive prompts (runs on CI/CD), otherwise same as above
- * - yarn release --tag=latest --version=0.19.0   -> publishes `@excalidraw` packages with "latest" tag and version "0.19.0" & prepares changelog for the release
- *
- * @returns [tag, version, nonInteractive]
- */
-const getArguments = () => {
-  let tag = "test";
-  let version = "";
-  let nonInteractive = false;
-
-  for (const argument of process.argv.slice(2)) {
-    if (/--help/.test(argument)) {
-      console.info(`Available arguments:
-  --tag=<tag>                                    -> (optional) "test" (default), "next" for auto release, "latest" for stable release
-  --version=<version>                            -> (optional) for "next" and "test", (required) for "latest" i.e. "0.19.0"
-  --non-interactive                              -> (optional) disables interactive prompts`);
-
-      console.info(`\nUsage examples:
-  - yarn release                                 -> publishes \`@excalidraw\` packages with "test" tag and "-[hash]" version suffix
-  - yarn release --tag=test                      -> same as above
-  - yarn release --tag=next                      -> publishes \`@excalidraw\` packages with "next" tag and version "-[hash]" suffix
-  - yarn release --tag=next --non-interactive    -> skips interactive prompts (runs on CI/CD), otherwise same as above
-  - yarn release --tag=latest --version=0.19.0   -> publishes \`@excalidraw\` packages with "latest" tag and version "0.19.0" & prepares changelog for the release`);
-
-      process.exit(0);
-    }
-
-    if (/--tag=/.test(argument)) {
-      tag = argument.split("=")[1];
-    }
-
-    if (/--version=/.test(argument)) {
-      version = argument.split("=")[1];
-    }
-
-    if (/--non-interactive/.test(argument)) {
-      nonInteractive = true;
-    }
-  }
-
-  if (tag !== "latest" && tag !== "next" && tag !== "test") {
-    console.error(`Unsupported tag "${tag}", use "latest", "next" or "test".`);
-    process.exit(1);
-  }
-
-  if (tag === "latest" && !version) {
-    console.error("Pass the version to make the latest stable release!");
-    process.exit(1);
-  }
-
-  if (!version) {
-    // set the next version based on the excalidraw package version + commit hash
-    const excalidrawPackageVersion = require(getPackageJsonPath(
-      "excalidraw",
-    )).version;
-
-    const hash = getShortCommitHash();
-
-    if (!excalidrawPackageVersion.includes(hash)) {
-      version = `${excalidrawPackageVersion}-${hash}`;
-    } else {
-      // ensuring idempotency
-      version = excalidrawPackageVersion;
-    }
-  }
-
-  console.info(`Running with tag "${tag}" and version "${version}"...`);
-
-  return [tag, version, nonInteractive];
-};
-
-const validatePackageName = (packageName) => {
-  if (!PACKAGES.includes(packageName)) {
-    console.error(`Package "${packageName}" not found!`);
+const publish = () => {
+  try {
+    console.info("Installing the dependencies in root folder...");
+    execSync(`yarn  --frozen-lockfile`);
+    console.info("Installing the dependencies in excalidraw directory...");
+    execSync(`yarn --frozen-lockfile`, { cwd: excalidrawDir });
+    console.info("Building ESM Package...");
+    execSync(`yarn run build:esm`, { cwd: excalidrawDir });
+    console.info("Publishing the package...");
+    execSync(`yarn --cwd ${excalidrawDir} publish`);
+  } catch (error) {
+    console.error(error);
     process.exit(1);
   }
 };
 
-const getPackageJsonPath = (packageName) => {
-  validatePackageName(packageName);
-  return path.resolve(PACKAGES_DIR, packageName, "package.json");
+const release = () => {
+  publish();
+  console.info(`Published ${pkg.version}!`);
 };
 
-const updatePackageJsons = (nextVersion) => {
-  const packageJsons = new Map();
-
-  for (const packageName of PACKAGES) {
-    const pkg = require(getPackageJsonPath(packageName));
-
-    pkg.version = nextVersion;
-
-    if (pkg.dependencies) {
-      for (const dependencyName of PACKAGES) {
-        if (!pkg.dependencies[`@excalidraw/${dependencyName}`]) {
-          continue;
-        }
-
-        pkg.dependencies[`@excalidraw/${dependencyName}`] = nextVersion;
-      }
-    }
-
-    packageJsons.set(packageName, `${JSON.stringify(pkg, null, 2)}\n`);
-  }
-
-  // modify once, to avoid inconsistent state
-  for (const packageName of PACKAGES) {
-    const content = packageJsons.get(packageName);
-    fs.writeFileSync(getPackageJsonPath(packageName), content, "utf-8");
-  }
-};
-
-const getShortCommitHash = () => {
-  return execSync("git rev-parse --short HEAD").toString().trim();
-};
-
-const askToCommit = (tag, nextVersion) => {
-  if (tag !== "latest") {
-    return Promise.resolve();
-  }
-
-  return new Promise((resolve) => {
-    const rl = require("readline").createInterface({
-      input: process.stdin,
-      output: process.stdout,
-    });
-
-    rl.question(
-      "Would you like to commit these changes to git? (Y/n): ",
-      (answer) => {
-        rl.close();
-
-        if (answer.toLowerCase() === "y") {
-          execSync(`git add -u`);
-          execSync(
-            `git commit -m "chore: release @excalidraw/excalidraw@${nextVersion} 🎉"`,
-          );
-        } else {
-          console.warn(
-            "Skipping commit. Don't forget to commit manually later!",
-          );
-        }
-
-        resolve();
-      },
-    );
-  });
-};
-
-const buildPackages = () => {
-  console.info("Running yarn install...");
-  execSync(`yarn --frozen-lockfile`, { stdio: "inherit" });
-
-  console.info("Removing existing build artifacts...");
-  execSync(`yarn rm:build`, { stdio: "inherit" });
-
-  for (const packageName of PACKAGES) {
-    console.info(`Building "@excalidraw/${packageName}"...`);
-    execSync(`yarn run build:esm`, {
-      cwd: path.resolve(PACKAGES_DIR, packageName),
-      stdio: "inherit",
-    });
-  }
-};
-
-const askToPublish = (tag, version) => {
-  return new Promise((resolve) => {
-    const rl = require("readline").createInterface({
-      input: process.stdin,
-      output: process.stdout,
-    });
-
-    rl.question(
-      "Would you like to publish these changes to npm? (Y/n): ",
-      (answer) => {
-        rl.close();
-
-        if (answer.toLowerCase() === "y") {
-          publishPackages(tag, version);
-        } else {
-          console.info("Skipping publish.");
-        }
-
-        resolve();
-      },
-    );
-  });
-};
-
-const publishPackages = (tag, version) => {
-  for (const packageName of PACKAGES) {
-    execSync(`yarn publish --tag ${tag}`, {
-      cwd: path.resolve(PACKAGES_DIR, packageName),
-      stdio: "inherit",
-    });
-
-    console.info(
-      `Published "@excalidraw/${packageName}@${tag}" with version "${version}"! 🎉`,
-    );
-  }
-};
-
-/** main */
-(async () => {
-  const [tag, version, nonInteractive] = getArguments();
-
-  buildPackages();
-
-  if (tag === "latest") {
-    await updateChangelog(version);
-  }
-
-  updatePackageJsons(version);
-
-  if (nonInteractive) {
-    publishPackages(tag, version);
-  } else {
-    await askToCommit(tag, version);
-    await askToPublish(tag, version);
-  }
-})();
+release();

scripts/updateChangelog.js

@@ -20,16 +20,14 @@ const headerForType = {
   perf: "Performance",
   build: "Build",
 };
-
 const badCommits = [];
 const getCommitHashForLastVersion = async () => {
   try {
-    const commitMessage = `"release @excalidraw/excalidraw"`;
+    const commitMessage = `"release @excalidraw/excalidraw@${lastVersion}"`;
     const { stdout } = await exec(
       `git log --format=format:"%H" --grep=${commitMessage}`,
     );
-    // take commit hash from latest release
-    return stdout.split(/\r?\n/)[0];
+    return stdout;
   } catch (error) {
     console.error(error);
   }

yarn.lock

@@ -2162,13 +2162,6 @@
   resolved "https://registry.yarnpkg.com/@pkgjs/parseargs/-/parseargs-0.11.0.tgz#a77ea742fab25775145434eb1d2328cf5013ac33"
   integrity sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==
 
-"@playwright/test@1.55.0":
-  version "1.55.0"
-  resolved "https://registry.yarnpkg.com/@playwright/test/-/test-1.55.0.tgz#080fa6d9ee6d749ff523b1c18259572d0268b963"
-  integrity sha512-04IXzPwHrW69XusN/SIdDdKZBzMfOT9UNT/YiJit/xpy2VuAoB8NHc8Aplb96zsWDddLnbkPL3TsmrS04ZU2xQ==
-  dependencies:
-    playwright "1.55.0"
-
 "@polka/url@^1.0.0-next.24":
   version "1.0.0-next.28"
   resolved "https://registry.yarnpkg.com/@polka/url/-/url-1.0.0-next.28.tgz#d45e01c4a56f143ee69c54dd6b12eade9e270a73"
@@ -2952,13 +2945,6 @@
   dependencies:
     undici-types "~6.20.0"
 
-"@types/node@24.3.0":
-  version "24.3.0"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-24.3.0.tgz#89b09f45cb9a8ee69466f18ee5864e4c3eb84dec"
-  integrity sha512-aPTXCrfwnDLj4VvXrm+UUCQjNEvJgNA8s5F1cvwQU+3KNltTOkBm1j30uNLyqqPNe7gE3KFzImYoZEfLhp4Yow==
-  dependencies:
-    undici-types "~7.10.0"
-
 "@types/node@>=12.12.47", "@types/node@>=13.7.0":
   version "22.13.8"
   resolved "https://registry.yarnpkg.com/@types/node/-/node-22.13.8.tgz#57e2450295b33a6518d6fd4f65f47236d3e41d8d"
@@ -5840,11 +5826,6 @@ fs.realpath@^1.0.0:
   resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"
   integrity sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==
 
-fsevents@2.3.2:
-  version "2.3.2"
-  resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.2.tgz#8a526f78b8fdf4623b709e0b975c52c24c02fd1a"
-  integrity sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==
-
 fsevents@~2.3.2, fsevents@~2.3.3:
   version "2.3.3"
   resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.3.tgz#cac6407785d03675a2a5e1a5305c697b347d90d6"
@@ -7857,20 +7838,6 @@ pkg-dir@4.2.0:
   dependencies:
     find-up "^4.0.0"
 
-playwright-core@1.55.0:
-  version "1.55.0"
-  resolved "https://registry.yarnpkg.com/playwright-core/-/playwright-core-1.55.0.tgz#ec8a9f8ef118afb3e86e0f46f1393e3bea32adf4"
-  integrity sha512-GvZs4vU3U5ro2nZpeiwyb0zuFaqb9sUiAJuyrWpcGouD8y9/HLgGbNRjIph7zU9D3hnPaisMl9zG9CgFi/biIg==
-
-playwright@1.55.0:
-  version "1.55.0"
-  resolved "https://registry.yarnpkg.com/playwright/-/playwright-1.55.0.tgz#7aca7ac3ffd9e083a8ad8b2514d6f9ba401cc78b"
-  integrity sha512-sdCWStblvV1YU909Xqx0DhOjPZE4/5lJsIS84IfN9dAZfcl/CIZ5O8l3o0j7hPMjDvqoTF8ZUcc+i/GL5erstA==
-  dependencies:
-    playwright-core "1.55.0"
-  optionalDependencies:
-    fsevents "2.3.2"
-
 png-chunk-text@1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/png-chunk-text/-/png-chunk-text-1.0.0.tgz#1c6006d8e34ba471d38e1c9c54b3f53e1085e18f"
@@ -9361,11 +9328,6 @@ undici-types@~6.20.0:
   resolved "https://registry.yarnpkg.com/undici-types/-/undici-types-6.20.0.tgz#8171bf22c1f588d1554d55bf204bc624af388433"
   integrity sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg==
 
-undici-types@~7.10.0:
-  version "7.10.0"
-  resolved "https://registry.yarnpkg.com/undici-types/-/undici-types-7.10.0.tgz#4ac2e058ce56b462b056e629cc6a02393d3ff350"
-  integrity sha512-t5Fy/nfn+14LuOc2KNYg75vZqClpAiqscVvMygNnlsHBFpSXdJaYtXMcdNLpl/Qvc3P2cB3s6lOV51nqsFq4ag==
-
 unicode-canonical-property-names-ecmascript@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.1.tgz#cb3173fe47ca743e228216e4a3ddc4c84d628cc2"