@excalidraw/excalidraw 0.17.1-7500-ac247a0 → 0.17.1-b7babe5

package/dist/excalidraw/data/resave.d.ts

@@ -1,5 +1,5 @@
 import { ExcalidrawElement } from "../element/types";
 import { AppState, BinaryFiles } from "../types";
-export declare const resaveAsImageWithScene: (elements: readonly ExcalidrawElement[], appState: AppState, files: BinaryFiles) => Promise<{
+export declare const resaveAsImageWithScene: (elements: readonly ExcalidrawElement[], appState: AppState, files: BinaryFiles, name: string) => Promise<{
     fileHandle: import("browser-fs-access").FileSystemHandle;
 }>;

package/dist/excalidraw/data/resave.js

@@ -1,7 +1,7 @@
 import { exportCanvas, prepareElementsForExport } from ".";
 import { getFileHandleType, isImageFileHandleType } from "./blob";
-export const resaveAsImageWithScene = async (elements, appState, files) => {
-    const { exportBackground, viewBackgroundColor, name, fileHandle } = appState;
+export const resaveAsImageWithScene = async (elements, appState, files, name) => {
+    const { exportBackground, viewBackgroundColor, fileHandle } = appState;
     const fileHandleType = getFileHandleType(fileHandle);
     if (!fileHandle || !isImageFileHandleType(fileHandleType)) {
         throw new Error("fileHandle should exist and should be of type svg or png when resaving");

package/dist/excalidraw/data/restore.js

@@ -5,9 +5,9 @@ import { DEFAULT_FONT_FAMILY, DEFAULT_TEXT_ALIGN, DEFAULT_VERTICAL_ALIGN, PRECED
 import { getDefaultAppState } from "../appState";
 import { LinearElementEditor } from "../element/linearElementEditor";
 import { bumpVersion } from "../element/mutateElement";
-import { getFontString, getUpdatedTimestamp, updateActiveTool } from "../utils";
+import { getUpdatedTimestamp, updateActiveTool } from "../utils";
 import { arrayToMap } from "../utils";
-import { detectLineHeight, getDefaultLineHeight, measureBaseline, } from "../element/textElement";
+import { detectLineHeight, getContainerElement, getDefaultLineHeight, } from "../element/textElement";
 import { normalizeLink } from "./url";
 export const AllowedExcalidrawActiveTools = {
     selection: true,
@@ -94,7 +94,7 @@ const restoreElementWithProperties = (element, extra) => {
         ...extra,
     };
 };
-const restoreElement = (element, refreshDimensions = false) => {
+const restoreElement = (element) => {
     switch (element.type) {
         case "text":
             let fontSize = element.fontSize;
@@ -117,7 +117,6 @@ const restoreElement = (element, refreshDimensions = false) => {
                     : // no element height likely means programmatic use, so default
                         // to a fixed line height
                         getDefaultLineHeight(element.fontFamily));
-            const baseline = measureBaseline(element.text, getFontString(element), lineHeight);
             element = restoreElementWithProperties(element, {
                 fontSize,
                 fontFamily,
@@ -127,7 +126,6 @@ const restoreElement = (element, refreshDimensions = false) => {
                 containerId: element.containerId ?? null,
                 originalText: element.originalText || text,
                 lineHeight,
-                baseline,
             });
             // if empty text, mark as deleted. We keep in array
             // for data integrity purposes (collab etc.)
@@ -135,9 +133,6 @@ const restoreElement = (element, refreshDimensions = false) => {
                 element = { ...element, originalText: text, isDeleted: true };
                 element = bumpVersion(element);
             }
-            if (refreshDimensions) {
-                element = { ...element, ...refreshTextDimensions(element) };
-            }
             return element;
         case "freedraw": {
             return restoreElementWithProperties(element, {
@@ -190,11 +185,8 @@ const restoreElement = (element, refreshDimensions = false) => {
         case "rectangle":
         case "diamond":
         case "iframe":
-            return restoreElementWithProperties(element, {});
         case "embeddable":
-            return restoreElementWithProperties(element, {
-                validated: null,
-            });
+            return restoreElementWithProperties(element, {});
         case "magicframe":
         case "frame":
             return restoreElementWithProperties(element, {
@@ -287,7 +279,7 @@ localElements, opts) => {
         // filtering out selection, which is legacy, no longer kept in elements,
         // and causing issues if retained
         if (element.type !== "selection" && !isInvisiblySmallElement(element)) {
-            let migratedElement = restoreElement(element, opts?.refreshDimensions);
+            let migratedElement = restoreElement(element);
             if (migratedElement) {
                 const localElement = localElementsMap?.get(element.id);
                 if (localElement && localElement.version > migratedElement.version) {
@@ -317,6 +309,9 @@ localElements, opts) => {
         else if (element.boundElements) {
             repairContainerElement(element, restoredElementsMap);
         }
+        if (opts.refreshDimensions && isTextElement(element)) {
+            Object.assign(element, refreshTextDimensions(element, getContainerElement(element, restoredElementsMap), restoredElementsMap));
+        }
     }
     return restoredElements;
 };

package/dist/excalidraw/data/transform.js

@@ -3,7 +3,7 @@ import { getCommonBounds, newElement, newLinearElement, redrawTextBoundingBox, }
 import { bindLinearElement } from "../element/binding";
 import { newFrameElement, newImageElement, newMagicFrameElement, newTextElement, } from "../element/newElement";
 import { getDefaultLineHeight, measureText, normalizeText, } from "../element/textElement";
-import { assertNever, cloneJSON, getFontString } from "../utils";
+import { assertNever, cloneJSON, getFontString, toBrandedType } from "../utils";
 import { getSizeFromPoints } from "../points";
 import { randomId } from "../random";
 const DEFAULT_LINEAR_ELEMENT_PROPS = {
@@ -11,7 +11,7 @@ const DEFAULT_LINEAR_ELEMENT_PROPS = {
     height: 0,
 };
 const DEFAULT_DIMENSION = 100;
-const bindTextToContainer = (container, textProps) => {
+const bindTextToContainer = (container, textProps, elementsMap) => {
     const textElement = newTextElement({
         x: 0,
         y: 0,
@@ -27,10 +27,10 @@ const bindTextToContainer = (container, textProps) => {
             id: textElement.id,
         }),
     });
-    redrawTextBoundingBox(textElement, container);
+    redrawTextBoundingBox(textElement, container, elementsMap);
     return [container, textElement];
 };
-const bindLinearElementToElement = (linearElement, start, end, elementStore) => {
+const bindLinearElementToElement = (linearElement, start, end, elementStore, elementsMap) => {
     let startBoundElement;
     let endBoundElement;
     Object.assign(linearElement, {
@@ -97,7 +97,7 @@ const bindLinearElementToElement = (linearElement, start, end, elementStore) =>
                     }
                 }
             }
-            bindLinearElement(linearElement, startBoundElement, "start");
+            bindLinearElement(linearElement, startBoundElement, "start", elementsMap);
         }
     }
     if (end) {
@@ -159,7 +159,7 @@ const bindLinearElementToElement = (linearElement, start, end, elementStore) =>
                     }
                 }
             }
-            bindLinearElement(linearElement, endBoundElement, "end");
+            bindLinearElement(linearElement, endBoundElement, "end", elementsMap);
         }
     }
     // Update start/end points by 0.5 so bindings don't overlap with start/end bound element coordinates.
@@ -208,6 +208,9 @@ class ElementStore {
     getElements = () => {
         return Array.from(this.excalidrawElements.values());
     };
+    getElementsMap = () => {
+        return toBrandedType(this.excalidrawElements);
+    };
     getElement = (id) => {
         return this.excalidrawElements.get(id);
     };
@@ -337,6 +340,7 @@ export const convertToExcalidrawElements = (elementsSkeleton, opts) => {
             }
         }
     }
+    const elementsMap = elementStore.getElementsMap();
     // Add labels and arrow bindings
     for (const [id, element] of elementsWithIds) {
         const excalidrawElement = elementStore.getElement(id);
@@ -346,7 +350,7 @@ export const convertToExcalidrawElements = (elementsSkeleton, opts) => {
             case "diamond":
             case "arrow": {
                 if (element.label?.text) {
-                    let [container, text] = bindTextToContainer(excalidrawElement, element?.label);
+                    let [container, text] = bindTextToContainer(excalidrawElement, element?.label, elementsMap);
                     elementStore.add(container);
                     elementStore.add(text);
                     if (container.type === "arrow") {
@@ -364,7 +368,7 @@ export const convertToExcalidrawElements = (elementsSkeleton, opts) => {
                                 Object.assign(originalEnd, { id: newEndId });
                             }
                         }
-                        const { linearElement, startBoundElement, endBoundElement } = bindLinearElementToElement(container, originalStart, originalEnd, elementStore);
+                        const { linearElement, startBoundElement, endBoundElement } = bindLinearElementToElement(container, originalStart, originalEnd, elementStore, elementsMap);
                         container = linearElement;
                         elementStore.add(linearElement);
                         elementStore.add(startBoundElement);
@@ -383,7 +387,7 @@ export const convertToExcalidrawElements = (elementsSkeleton, opts) => {
                                 const newEndId = oldToNewElementIdMap.get(end.id);
                                 Object.assign(end, { id: newEndId });
                             }
-                            const { linearElement, startBoundElement, endBoundElement } = bindLinearElementToElement(excalidrawElement, start, end, elementStore);
+                            const { linearElement, startBoundElement, endBoundElement } = bindLinearElementToElement(excalidrawElement, start, end, elementStore, elementsMap);
                             elementStore.add(linearElement);
                             elementStore.add(startBoundElement);
                             elementStore.add(endBoundElement);

package/dist/excalidraw/distribute.d.ts

@@ -1,6 +1,6 @@
-import { ExcalidrawElement } from "./element/types";
+import type { ElementsMap, ExcalidrawElement } from "./element/types";
 export interface Distribution {
     space: "between";
     axis: "x" | "y";
 }
-export declare const distributeElements: (selectedElements: ExcalidrawElement[], distribution: Distribution) => ExcalidrawElement[];
+export declare const distributeElements: (selectedElements: ExcalidrawElement[], elementsMap: ElementsMap, distribution: Distribution) => ExcalidrawElement[];

package/dist/excalidraw/distribute.js

@@ -1,12 +1,12 @@
 import { newElementWith } from "./element/mutateElement";
 import { getMaximumGroups } from "./groups";
 import { getCommonBoundingBox } from "./element/bounds";
-export const distributeElements = (selectedElements, distribution) => {
+export const distributeElements = (selectedElements, elementsMap, distribution) => {
     const [start, mid, end, extent] = distribution.axis === "x"
         ? ["minX", "midX", "maxX", "width"]
         : ["minY", "midY", "maxY", "height"];
     const bounds = getCommonBoundingBox(selectedElements);
-    const groups = getMaximumGroups(selectedElements)
+    const groups = getMaximumGroups(selectedElements, elementsMap)
         .map((group) => [group, getCommonBoundingBox(group)])
         .sort((a, b) => a[1][mid] - b[1][mid]);
     let span = 0;

package/dist/excalidraw/element/ElementCanvasButtons.d.ts

@@ -1,7 +1,8 @@
 /// <reference types="react" />
-import { NonDeletedExcalidrawElement } from "./types";
+import { ElementsMap, NonDeletedExcalidrawElement } from "./types";
 import "./ElementCanvasButtons.scss";
-export declare const ElementCanvasButtons: ({ children, element, }: {
+export declare const ElementCanvasButtons: ({ children, element, elementsMap, }: {
     children: React.ReactNode;
     element: NonDeletedExcalidrawElement;
+    elementsMap: ElementsMap;
 }) => JSX.Element | null;

package/dist/excalidraw/element/ElementCanvasButtons.js

@@ -4,14 +4,14 @@ import { getElementAbsoluteCoords } from ".";
 import { useExcalidrawAppState } from "../components/App";
 import "./ElementCanvasButtons.scss";
 const CONTAINER_PADDING = 5;
-const getContainerCoords = (element, appState) => {
-    const [x1, y1] = getElementAbsoluteCoords(element);
+const getContainerCoords = (element, appState, elementsMap) => {
+    const [x1, y1] = getElementAbsoluteCoords(element, elementsMap);
     const { x: viewportX, y: viewportY } = sceneCoordsToViewportCoords({ sceneX: x1 + element.width, sceneY: y1 }, appState);
     const x = viewportX - appState.offsetLeft + 10;
     const y = viewportY - appState.offsetTop;
     return { x, y };
 };
-export const ElementCanvasButtons = ({ children, element, }) => {
+export const ElementCanvasButtons = ({ children, element, elementsMap, }) => {
     const appState = useExcalidrawAppState();
     if (appState.contextMenu ||
         appState.draggingElement ||
@@ -21,7 +21,7 @@ export const ElementCanvasButtons = ({ children, element, }) => {
         appState.viewModeEnabled) {
         return null;
     }
-    const { x, y } = getContainerCoords(element, appState);
+    const { x, y } = getContainerCoords(element, appState, elementsMap);
     return (_jsx("div", { className: "excalidraw-canvas-buttons", style: {
             top: `${y}px`,
             left: `${x}px`,

package/dist/excalidraw/element/binding.d.ts

@@ -1,4 +1,4 @@
-import { ExcalidrawLinearElement, ExcalidrawBindableElement, NonDeleted, NonDeletedExcalidrawElement, ExcalidrawElement } from "./types";
+import { ExcalidrawLinearElement, ExcalidrawBindableElement, NonDeleted, NonDeletedExcalidrawElement, ExcalidrawElement, ElementsMap, NonDeletedSceneElementsMap } from "./types";
 import { AppState } from "../types";
 import Scene from "../scene/Scene";
 export type SuggestedBinding = NonDeleted<ExcalidrawBindableElement> | SuggestedPointBinding;
@@ -9,26 +9,26 @@ export type SuggestedPointBinding = [
 ];
 export declare const shouldEnableBindingForPointerEvent: (event: React.PointerEvent<HTMLElement>) => boolean;
 export declare const isBindingEnabled: (appState: AppState) => boolean;
-export declare const bindOrUnbindLinearElement: (linearElement: NonDeleted<ExcalidrawLinearElement>, startBindingElement: ExcalidrawBindableElement | null | "keep", endBindingElement: ExcalidrawBindableElement | null | "keep") => void;
-export declare const bindOrUnbindSelectedElements: (elements: NonDeleted<ExcalidrawElement>[]) => void;
+export declare const bindOrUnbindLinearElement: (linearElement: NonDeleted<ExcalidrawLinearElement>, startBindingElement: ExcalidrawBindableElement | null | "keep", endBindingElement: ExcalidrawBindableElement | null | "keep", elementsMap: NonDeletedSceneElementsMap) => void;
+export declare const bindOrUnbindSelectedElements: (selectedElements: NonDeleted<ExcalidrawElement>[], elements: readonly ExcalidrawElement[], elementsMap: NonDeletedSceneElementsMap) => void;
 export declare const maybeBindLinearElement: (linearElement: NonDeleted<ExcalidrawLinearElement>, appState: AppState, scene: Scene, pointerCoords: {
     x: number;
     y: number;
-}) => void;
-export declare const bindLinearElement: (linearElement: NonDeleted<ExcalidrawLinearElement>, hoveredElement: ExcalidrawBindableElement, startOrEnd: "start" | "end") => void;
+}, elementsMap: NonDeletedSceneElementsMap) => void;
+export declare const bindLinearElement: (linearElement: NonDeleted<ExcalidrawLinearElement>, hoveredElement: ExcalidrawBindableElement, startOrEnd: "start" | "end", elementsMap: NonDeletedSceneElementsMap) => void;
 export declare const isLinearElementSimpleAndAlreadyBound: (linearElement: NonDeleted<ExcalidrawLinearElement>, alreadyBoundToId: ExcalidrawBindableElement["id"] | undefined, bindableElement: ExcalidrawBindableElement) => boolean;
-export declare const unbindLinearElements: (elements: NonDeleted<ExcalidrawElement>[]) => void;
+export declare const unbindLinearElements: (elements: NonDeleted<ExcalidrawElement>[], elementsMap: NonDeletedSceneElementsMap) => void;
 export declare const getHoveredElementForBinding: (pointerCoords: {
     x: number;
     y: number;
-}, scene: Scene) => NonDeleted<ExcalidrawBindableElement> | null;
-export declare const updateBoundElements: (changedElement: NonDeletedExcalidrawElement, options?: {
+}, elements: readonly NonDeletedExcalidrawElement[], elementsMap: NonDeletedSceneElementsMap) => NonDeleted<ExcalidrawBindableElement> | null;
+export declare const updateBoundElements: (changedElement: NonDeletedExcalidrawElement, elementsMap: ElementsMap, options?: {
     simultaneouslyUpdated?: readonly ExcalidrawElement[];
     newSize?: {
         width: number;
         height: number;
     };
 }) => void;
-export declare const getEligibleElementsForBinding: (elements: NonDeleted<ExcalidrawElement>[]) => SuggestedBinding[];
+export declare const getEligibleElementsForBinding: (selectedElements: NonDeleted<ExcalidrawElement>[], elements: readonly ExcalidrawElement[], elementsMap: NonDeletedSceneElementsMap) => SuggestedBinding[];
 export declare const fixBindingsAfterDuplication: (sceneElements: readonly ExcalidrawElement[], oldElements: readonly ExcalidrawElement[], oldIdToDuplicatedId: Map<ExcalidrawElement["id"], ExcalidrawElement["id"]>, duplicatesServeAsOld?: "duplicatesServeAsOld" | undefined) => void;
 export declare const fixBindingsAfterDeletion: (sceneElements: readonly ExcalidrawElement[], deletedElements: readonly ExcalidrawElement[]) => void;

package/dist/excalidraw/element/binding.js

@@ -23,11 +23,11 @@ const getNonDeletedElements = (scene, ids) => {
     });
     return result;
 };
-export const bindOrUnbindLinearElement = (linearElement, startBindingElement, endBindingElement) => {
+export const bindOrUnbindLinearElement = (linearElement, startBindingElement, endBindingElement, elementsMap) => {
     const boundToElementIds = new Set();
     const unboundFromElementIds = new Set();
-    bindOrUnbindLinearElementEdge(linearElement, startBindingElement, endBindingElement, "start", boundToElementIds, unboundFromElementIds);
-    bindOrUnbindLinearElementEdge(linearElement, endBindingElement, startBindingElement, "end", boundToElementIds, unboundFromElementIds);
+    bindOrUnbindLinearElementEdge(linearElement, startBindingElement, endBindingElement, "start", boundToElementIds, unboundFromElementIds, elementsMap);
+    bindOrUnbindLinearElementEdge(linearElement, endBindingElement, startBindingElement, "end", boundToElementIds, unboundFromElementIds, elementsMap);
     const onlyUnbound = Array.from(unboundFromElementIds).filter((id) => !boundToElementIds.has(id));
     getNonDeletedElements(Scene.getScene(linearElement), onlyUnbound).forEach((element) => {
         mutateElement(element, {
@@ -39,7 +39,7 @@ const bindOrUnbindLinearElementEdge = (linearElement, bindableElement, otherEdge
 // Is mutated
 boundToElementIds, 
 // Is mutated
-unboundFromElementIds) => {
+unboundFromElementIds, elementsMap) => {
     if (bindableElement !== "keep") {
         if (bindableElement != null) {
             // Don't bind if we're trying to bind or are already bound to the same
@@ -49,7 +49,7 @@ unboundFromElementIds) => {
                     ? !isLinearElementSimpleAndAlreadyBoundOnOppositeEdge(linearElement, bindableElement, startOrEnd)
                     : startOrEnd === "start" ||
                         otherEdgeBindableElement.id !== bindableElement.id)) {
-                bindLinearElement(linearElement, bindableElement, startOrEnd);
+                bindLinearElement(linearElement, bindableElement, startOrEnd, elementsMap);
                 boundToElementIds.add(bindableElement.id);
             }
         }
@@ -61,34 +61,34 @@ unboundFromElementIds) => {
         }
     }
 };
-export const bindOrUnbindSelectedElements = (elements) => {
-    elements.forEach((element) => {
-        if (isBindingElement(element)) {
-            bindOrUnbindLinearElement(element, getElligibleElementForBindingElement(element, "start"), getElligibleElementForBindingElement(element, "end"));
+export const bindOrUnbindSelectedElements = (selectedElements, elements, elementsMap) => {
+    selectedElements.forEach((selectedElement) => {
+        if (isBindingElement(selectedElement)) {
+            bindOrUnbindLinearElement(selectedElement, getElligibleElementForBindingElement(selectedElement, "start", elements, elementsMap), getElligibleElementForBindingElement(selectedElement, "end", elements, elementsMap), elementsMap);
         }
-        else if (isBindableElement(element)) {
-            maybeBindBindableElement(element);
+        else if (isBindableElement(selectedElement)) {
+            maybeBindBindableElement(selectedElement, elementsMap);
         }
     });
 };
-const maybeBindBindableElement = (bindableElement) => {
-    getElligibleElementsForBindableElementAndWhere(bindableElement).forEach(([linearElement, where]) => bindOrUnbindLinearElement(linearElement, where === "end" ? "keep" : bindableElement, where === "start" ? "keep" : bindableElement));
+const maybeBindBindableElement = (bindableElement, elementsMap) => {
+    getElligibleElementsForBindableElementAndWhere(bindableElement, elementsMap).forEach(([linearElement, where]) => bindOrUnbindLinearElement(linearElement, where === "end" ? "keep" : bindableElement, where === "start" ? "keep" : bindableElement, elementsMap));
 };
-export const maybeBindLinearElement = (linearElement, appState, scene, pointerCoords) => {
+export const maybeBindLinearElement = (linearElement, appState, scene, pointerCoords, elementsMap) => {
     if (appState.startBoundElement != null) {
-        bindLinearElement(linearElement, appState.startBoundElement, "start");
+        bindLinearElement(linearElement, appState.startBoundElement, "start", elementsMap);
     }
-    const hoveredElement = getHoveredElementForBinding(pointerCoords, scene);
+    const hoveredElement = getHoveredElementForBinding(pointerCoords, scene.getNonDeletedElements(), elementsMap);
     if (hoveredElement != null &&
         !isLinearElementSimpleAndAlreadyBoundOnOppositeEdge(linearElement, hoveredElement, "end")) {
-        bindLinearElement(linearElement, hoveredElement, "end");
+        bindLinearElement(linearElement, hoveredElement, "end", elementsMap);
     }
 };
-export const bindLinearElement = (linearElement, hoveredElement, startOrEnd) => {
+export const bindLinearElement = (linearElement, hoveredElement, startOrEnd, elementsMap) => {
     mutateElement(linearElement, {
         [startOrEnd === "start" ? "startBinding" : "endBinding"]: {
             elementId: hoveredElement.id,
-            ...calculateFocusAndGap(linearElement, hoveredElement, startOrEnd),
+            ...calculateFocusAndGap(linearElement, hoveredElement, startOrEnd, elementsMap),
         },
     });
     const boundElementsMap = arrayToMap(hoveredElement.boundElements || []);
@@ -109,10 +109,10 @@ const isLinearElementSimpleAndAlreadyBoundOnOppositeEdge = (linearElement, binda
 export const isLinearElementSimpleAndAlreadyBound = (linearElement, alreadyBoundToId, bindableElement) => {
     return (alreadyBoundToId === bindableElement.id && linearElement.points.length < 3);
 };
-export const unbindLinearElements = (elements) => {
+export const unbindLinearElements = (elements, elementsMap) => {
     elements.forEach((element) => {
         if (isBindingElement(element)) {
-            bindOrUnbindLinearElement(element, null, null);
+            bindOrUnbindLinearElement(element, null, null, elementsMap);
         }
     });
 };
@@ -125,20 +125,20 @@ const unbindLinearElement = (linearElement, startOrEnd) => {
     mutateElement(linearElement, { [field]: null });
     return binding.elementId;
 };
-export const getHoveredElementForBinding = (pointerCoords, scene) => {
-    const hoveredElement = getElementAtPosition(scene.getNonDeletedElements(), (element) => isBindableElement(element, false) &&
-        bindingBorderTest(element, pointerCoords));
+export const getHoveredElementForBinding = (pointerCoords, elements, elementsMap) => {
+    const hoveredElement = getElementAtPosition(elements, (element) => isBindableElement(element, false) &&
+        bindingBorderTest(element, pointerCoords, elementsMap));
     return hoveredElement;
 };
-const calculateFocusAndGap = (linearElement, hoveredElement, startOrEnd) => {
+const calculateFocusAndGap = (linearElement, hoveredElement, startOrEnd, elementsMap) => {
     const direction = startOrEnd === "start" ? -1 : 1;
     const edgePointIndex = direction === -1 ? 0 : linearElement.points.length - 1;
     const adjacentPointIndex = edgePointIndex - direction;
-    const edgePoint = LinearElementEditor.getPointAtIndexGlobalCoordinates(linearElement, edgePointIndex);
-    const adjacentPoint = LinearElementEditor.getPointAtIndexGlobalCoordinates(linearElement, adjacentPointIndex);
+    const edgePoint = LinearElementEditor.getPointAtIndexGlobalCoordinates(linearElement, edgePointIndex, elementsMap);
+    const adjacentPoint = LinearElementEditor.getPointAtIndexGlobalCoordinates(linearElement, adjacentPointIndex, elementsMap);
     return {
-        focus: determineFocusDistance(hoveredElement, adjacentPoint, edgePoint),
-        gap: Math.max(1, distanceToBindableElement(hoveredElement, edgePoint)),
+        focus: determineFocusDistance(hoveredElement, adjacentPoint, edgePoint, elementsMap),
+        gap: Math.max(1, distanceToBindableElement(hoveredElement, edgePoint, elementsMap)),
     };
 };
 // Supports translating, rotating and scaling `changedElement` with bound
@@ -146,14 +146,15 @@ const calculateFocusAndGap = (linearElement, hoveredElement, startOrEnd) => {
 // Because scaling involves moving the focus points as well, it is
 // done before the `changedElement` is updated, and the `newSize` is passed
 // in explicitly.
-export const updateBoundElements = (changedElement, options) => {
+export const updateBoundElements = (changedElement, elementsMap, options) => {
     const boundLinearElements = (changedElement.boundElements ?? []).filter((el) => el.type === "arrow");
     if (boundLinearElements.length === 0) {
         return;
     }
     const { newSize, simultaneouslyUpdated } = options ?? {};
     const simultaneouslyUpdatedElementIds = getSimultaneouslyUpdatedElementIds(simultaneouslyUpdated);
-    getNonDeletedElements(Scene.getScene(changedElement), boundLinearElements.map((el) => el.id)).forEach((element) => {
+    const scene = Scene.getScene(changedElement);
+    getNonDeletedElements(scene, boundLinearElements.map((el) => el.id)).forEach((element) => {
         if (!isLinearElement(element)) {
             return;
         }
@@ -169,11 +170,11 @@ export const updateBoundElements = (changedElement, options) => {
             mutateElement(element, { startBinding, endBinding });
             return;
         }
-        updateBoundPoint(element, "start", startBinding, changedElement);
-        updateBoundPoint(element, "end", endBinding, changedElement);
-        const boundText = getBoundTextElement(element);
+        updateBoundPoint(element, "start", startBinding, changedElement, elementsMap);
+        updateBoundPoint(element, "end", endBinding, changedElement, elementsMap);
+        const boundText = getBoundTextElement(element, scene.getNonDeletedElementsMap());
         if (boundText) {
-            handleBindTextResize(element, false);
+            handleBindTextResize(element, scene.getNonDeletedElementsMap(), false);
         }
     });
 };
@@ -184,7 +185,7 @@ const doesNeedUpdate = (boundElement, changedElement) => {
 const getSimultaneouslyUpdatedElementIds = (simultaneouslyUpdated) => {
     return new Set((simultaneouslyUpdated || []).map((element) => element.id));
 };
-const updateBoundPoint = (linearElement, startOrEnd, binding, changedElement) => {
+const updateBoundPoint = (linearElement, startOrEnd, binding, changedElement, elementsMap) => {
     if (binding == null ||
         // We only need to update the other end if this is a 2 point line element
         (binding.elementId !== changedElement.id && linearElement.points.length > 2)) {
@@ -198,8 +199,8 @@ const updateBoundPoint = (linearElement, startOrEnd, binding, changedElement) =>
     const direction = startOrEnd === "start" ? -1 : 1;
     const edgePointIndex = direction === -1 ? 0 : linearElement.points.length - 1;
     const adjacentPointIndex = edgePointIndex - direction;
-    const adjacentPoint = LinearElementEditor.getPointAtIndexGlobalCoordinates(linearElement, adjacentPointIndex);
-    const focusPointAbsolute = determineFocusPoint(bindingElement, binding.focus, adjacentPoint);
+    const adjacentPoint = LinearElementEditor.getPointAtIndexGlobalCoordinates(linearElement, adjacentPointIndex, elementsMap);
+    const focusPointAbsolute = determineFocusPoint(bindingElement, binding.focus, adjacentPoint, elementsMap);
     let newEdgePoint;
     // The linear element was not originally pointing inside the bound shape,
     // we can point directly at the focus point
@@ -207,7 +208,7 @@ const updateBoundPoint = (linearElement, startOrEnd, binding, changedElement) =>
         newEdgePoint = focusPointAbsolute;
     }
     else {
-        const intersections = intersectElementWithLine(bindingElement, adjacentPoint, focusPointAbsolute, binding.gap);
+        const intersections = intersectElementWithLine(bindingElement, adjacentPoint, focusPointAbsolute, binding.gap, elementsMap);
         if (intersections.length === 0) {
             // This should never happen, since focusPoint should always be
             // inside the element, but just in case, bail out
@@ -221,7 +222,7 @@ const updateBoundPoint = (linearElement, startOrEnd, binding, changedElement) =>
     LinearElementEditor.movePoints(linearElement, [
         {
             index: edgePointIndex,
-            point: LinearElementEditor.pointFromAbsoluteCoords(linearElement, newEdgePoint),
+            point: LinearElementEditor.pointFromAbsoluteCoords(linearElement, newEdgePoint, elementsMap),
         },
     ], { [startOrEnd === "start" ? "startBinding" : "endBinding"]: binding });
 };
@@ -236,36 +237,37 @@ const maybeCalculateNewGapWhenScaling = (changedElement, currentBinding, newSize
     return { elementId, gap: newGap, focus };
 };
 // TODO: this is a bottleneck, optimise
-export const getEligibleElementsForBinding = (elements) => {
-    const includedElementIds = new Set(elements.map(({ id }) => id));
-    return elements.flatMap((element) => isBindingElement(element, false)
-        ? getElligibleElementsForBindingElement(element).filter((element) => !includedElementIds.has(element.id))
-        : isBindableElement(element, false)
-            ? getElligibleElementsForBindableElementAndWhere(element).filter((binding) => !includedElementIds.has(binding[0].id))
+export const getEligibleElementsForBinding = (selectedElements, elements, elementsMap) => {
+    const includedElementIds = new Set(selectedElements.map(({ id }) => id));
+    return selectedElements.flatMap((selectedElement) => isBindingElement(selectedElement, false)
+        ? getElligibleElementsForBindingElement(selectedElement, elements, elementsMap).filter((element) => !includedElementIds.has(element.id))
+        : isBindableElement(selectedElement, false)
+            ? getElligibleElementsForBindableElementAndWhere(selectedElement, elementsMap).filter((binding) => !includedElementIds.has(binding[0].id))
             : []);
 };
-const getElligibleElementsForBindingElement = (linearElement) => {
+const getElligibleElementsForBindingElement = (linearElement, elements, elementsMap) => {
     return [
-        getElligibleElementForBindingElement(linearElement, "start"),
-        getElligibleElementForBindingElement(linearElement, "end"),
+        getElligibleElementForBindingElement(linearElement, "start", elements, elementsMap),
+        getElligibleElementForBindingElement(linearElement, "end", elements, elementsMap),
     ].filter((element) => element != null);
 };
-const getElligibleElementForBindingElement = (linearElement, startOrEnd) => {
-    return getHoveredElementForBinding(getLinearElementEdgeCoors(linearElement, startOrEnd), Scene.getScene(linearElement));
+const getElligibleElementForBindingElement = (linearElement, startOrEnd, elements, elementsMap) => {
+    return getHoveredElementForBinding(getLinearElementEdgeCoors(linearElement, startOrEnd, elementsMap), elements, elementsMap);
 };
-const getLinearElementEdgeCoors = (linearElement, startOrEnd) => {
+const getLinearElementEdgeCoors = (linearElement, startOrEnd, elementsMap) => {
     const index = startOrEnd === "start" ? 0 : -1;
-    return tupleToCoors(LinearElementEditor.getPointAtIndexGlobalCoordinates(linearElement, index));
+    return tupleToCoors(LinearElementEditor.getPointAtIndexGlobalCoordinates(linearElement, index, elementsMap));
 };
-const getElligibleElementsForBindableElementAndWhere = (bindableElement) => {
-    return Scene.getScene(bindableElement)
+const getElligibleElementsForBindableElementAndWhere = (bindableElement, elementsMap) => {
+    const scene = Scene.getScene(bindableElement);
+    return scene
         .getNonDeletedElements()
         .map((element) => {
         if (!isBindingElement(element, false)) {
             return null;
         }
-        const canBindStart = isLinearElementEligibleForNewBindingByBindable(element, "start", bindableElement);
-        const canBindEnd = isLinearElementEligibleForNewBindingByBindable(element, "end", bindableElement);
+        const canBindStart = isLinearElementEligibleForNewBindingByBindable(element, "start", bindableElement, elementsMap);
+        const canBindEnd = isLinearElementEligibleForNewBindingByBindable(element, "end", bindableElement, elementsMap);
         if (!canBindStart && !canBindEnd) {
             return null;
         }
@@ -277,11 +279,11 @@ const getElligibleElementsForBindableElementAndWhere = (bindableElement) => {
     })
         .filter((maybeElement) => maybeElement != null);
 };
-const isLinearElementEligibleForNewBindingByBindable = (linearElement, startOrEnd, bindableElement) => {
+const isLinearElementEligibleForNewBindingByBindable = (linearElement, startOrEnd, bindableElement, elementsMap) => {
     const existingBinding = linearElement[startOrEnd === "start" ? "startBinding" : "endBinding"];
     return (existingBinding == null &&
         !isLinearElementSimpleAndAlreadyBoundOnOppositeEdge(linearElement, bindableElement, startOrEnd) &&
-        bindingBorderTest(bindableElement, getLinearElementEdgeCoors(linearElement, startOrEnd)));
+        bindingBorderTest(bindableElement, getLinearElementEdgeCoors(linearElement, startOrEnd, elementsMap), elementsMap));
 };
 // We need to:
 // 1: Update elements not selected to point to duplicated elements

package/dist/excalidraw/element/bounds.d.ts

@@ -1,4 +1,4 @@
-import { ExcalidrawElement, ExcalidrawLinearElement, Arrowhead, ExcalidrawFreeDrawElement, NonDeleted } from "./types";
+import { ExcalidrawElement, ExcalidrawLinearElement, Arrowhead, ExcalidrawFreeDrawElement, NonDeleted, ElementsMap } from "./types";
 import { Drawable, Op } from "roughjs/bin/core";
 import { AppState, Point } from "../types";
 export type RectangleBox = {
@@ -25,11 +25,11 @@ export type SceneBounds = readonly [
 ];
 export declare class ElementBounds {
     private static boundsCache;
-    static getBounds(element: ExcalidrawElement): Bounds;
+    static getBounds(element: ExcalidrawElement, elementsMap: ElementsMap): Bounds;
     private static calculateBounds;
 }
-export declare const getElementAbsoluteCoords: (element: ExcalidrawElement, includeBoundText?: boolean) => [number, number, number, number, number, number];
-export declare const getElementLineSegments: (element: ExcalidrawElement) => [Point, Point][];
+export declare const getElementAbsoluteCoords: (element: ExcalidrawElement, elementsMap: ElementsMap, includeBoundText?: boolean) => [number, number, number, number, number, number];
+export declare const getElementLineSegments: (element: ExcalidrawElement, elementsMap: ElementsMap) => [Point, Point][];
 /**
  * Scene -> Scene coords, but in x1,x2,y1,y2 format.
  *
@@ -46,7 +46,7 @@ export declare const getArrowheadSize: (arrowhead: Arrowhead) => number;
 /** @returns number in degrees */
 export declare const getArrowheadAngle: (arrowhead: Arrowhead) => number;
 export declare const getArrowheadPoints: (element: ExcalidrawLinearElement, shape: Drawable[], position: "start" | "end", arrowhead: Arrowhead) => number[] | null;
-export declare const getElementBounds: (element: ExcalidrawElement) => Bounds;
+export declare const getElementBounds: (element: ExcalidrawElement, elementsMap: ElementsMap) => Bounds;
 export declare const getCommonBounds: (elements: readonly ExcalidrawElement[]) => Bounds;
 export declare const getDraggedElementsBounds: (elements: ExcalidrawElement[], dragOffset: {
     x: number;