@excalidraw/excalidraw 0.10.0 → 0.11.0

package/types/element/Hyperlink.d.ts

@@ -0,0 +1,117 @@
+/// <reference types="react" />
+import { AppState, ExcalidrawProps } from "../types";
+import { NonDeletedExcalidrawElement } from "./types";
+import { Bounds } from "./bounds";
+import "./Hyperlink.scss";
+export declare const EXTERNAL_LINK_IMG: HTMLImageElement;
+export declare const Hyperlink: ({ element, appState, setAppState, onLinkOpen, }: {
+    element: NonDeletedExcalidrawElement;
+    appState: AppState;
+    setAppState: React.Component<any, AppState>["setState"];
+    onLinkOpen: ExcalidrawProps["onLinkOpen"];
+}) => JSX.Element | null;
+export declare const normalizeLink: (link: string) => string;
+export declare const isLocalLink: (link: string | null) => boolean;
+export declare const actionLink: {
+    name: "link";
+    perform: (elements: readonly import("./types").ExcalidrawElement[], appState: Readonly<AppState>) => false | {
+        elements: readonly import("./types").ExcalidrawElement[];
+        appState: {
+            showHyperlinkPopup: "editor";
+            openMenu: null;
+            isLoading: boolean;
+            errorMessage: string | null;
+            draggingElement: NonDeletedExcalidrawElement | null;
+            resizingElement: NonDeletedExcalidrawElement | null;
+            multiElement: import("./types").NonDeleted<import("./types").ExcalidrawLinearElement> | null;
+            selectionElement: NonDeletedExcalidrawElement | null;
+            isBindingEnabled: boolean;
+            startBoundElement: import("./types").NonDeleted<import("./types").ExcalidrawBindableElement> | null;
+            suggestedBindings: import("./binding").SuggestedBinding[];
+            editingElement: NonDeletedExcalidrawElement | null;
+            editingLinearElement: import("./linearElementEditor").LinearElementEditor | null;
+            elementType: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw";
+            elementLocked: boolean;
+            penMode: boolean;
+            penDetected: boolean;
+            exportBackground: boolean;
+            exportEmbedScene: boolean;
+            exportWithDarkMode: boolean;
+            exportScale: number;
+            currentItemStrokeColor: string;
+            currentItemBackgroundColor: string;
+            currentItemFillStyle: import("./types").FillStyle;
+            currentItemStrokeWidth: number;
+            currentItemStrokeStyle: import("./types").StrokeStyle;
+            currentItemRoughness: number;
+            currentItemOpacity: number;
+            currentItemFontFamily: number;
+            currentItemFontSize: number;
+            currentItemTextAlign: import("./types").TextAlign;
+            currentItemStrokeSharpness: import("./types").StrokeSharpness;
+            currentItemStartArrowhead: import("./types").Arrowhead | null;
+            currentItemEndArrowhead: import("./types").Arrowhead | null;
+            currentItemLinearStrokeSharpness: import("./types").StrokeSharpness;
+            viewBackgroundColor: string;
+            scrollX: number;
+            scrollY: number;
+            cursorButton: "up" | "down";
+            scrolledOutside: boolean;
+            name: string;
+            isResizing: boolean;
+            isRotating: boolean;
+            zoom: Readonly<{
+                value: import("../types").NormalizedZoomValue;
+            }>;
+            openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
+            lastPointerDownWith: import("./types").PointerType;
+            selectedElementIds: {
+                [id: string]: boolean;
+            };
+            previousSelectedElementIds: {
+                [id: string]: boolean;
+            };
+            shouldCacheIgnoreZoom: boolean;
+            showHelpDialog: boolean;
+            toastMessage: string | null;
+            zenModeEnabled: boolean;
+            theme: string;
+            gridSize: number | null;
+            viewModeEnabled: boolean;
+            selectedGroupIds: {
+                [groupId: string]: boolean;
+            };
+            editingGroupId: string | null;
+            width: number;
+            height: number;
+            offsetTop: number;
+            offsetLeft: number;
+            isLibraryOpen: boolean;
+            fileHandle: import("browser-fs-access").FileSystemHandle | null;
+            collaborators: Map<string, import("../types").Collaborator>;
+            showStats: boolean;
+            currentChartType: import("./types").ChartType;
+            pasteDialog: {
+                shown: false;
+                data: null;
+            } | {
+                shown: true;
+                data: import("../charts").Spreadsheet;
+            };
+            pendingImageElement: import("./types").NonDeleted<import("./types").ExcalidrawImageElement> | null;
+        };
+        commitToHistory: true;
+    };
+    keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
+    contextItemLabel: (elements: readonly import("./types").ExcalidrawElement[], appState: Readonly<AppState>) => "labels.link.edit" | "labels.link.create";
+    contextItemPredicate: (elements: readonly import("./types").ExcalidrawElement[], appState: AppState) => boolean;
+    PanelComponent: ({ elements, appState, updateData }: import("react").PropsWithChildren<import("../actions/types").PanelComponentProps>) => JSX.Element;
+} & {
+    keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
+};
+export declare const getContextMenuLabel: (elements: readonly NonDeletedExcalidrawElement[], appState: AppState) => "labels.link.edit" | "labels.link.create";
+export declare const getLinkHandleFromCoords: ([x1, y1, x2, y2]: Bounds, angle: number, appState: AppState) => [x: number, y: number, width: number, height: number];
+export declare const isPointHittingLinkIcon: (element: NonDeletedExcalidrawElement, appState: AppState, [x, y]: readonly [number, number], isMobile: boolean) => boolean;
+export declare const showHyperlinkTooltip: (element: NonDeletedExcalidrawElement, appState: AppState) => void;
+export declare const hideHyperlinkToolip: () => void;
+export declare const shouldHideLinkPopup: (element: NonDeletedExcalidrawElement, appState: AppState, [clientX, clientY]: readonly [number, number]) => Boolean;

package/types/element/bounds.d.ts

@@ -1,4 +1,4 @@
-import { ExcalidrawElement, ExcalidrawLinearElement, Arrowhead } from "./types";
+import { ExcalidrawElement, ExcalidrawLinearElement, Arrowhead, NonDeleted } from "./types";
 import { Drawable, Op } from "roughjs/bin/core";
 export declare type Bounds = readonly [number, number, number, number];
 export declare const getElementAbsoluteCoords: (element: ExcalidrawElement) => Bounds;
@@ -14,3 +14,14 @@ export declare const getClosestElementBounds: (elements: readonly ExcalidrawElem
     x: number;
     y: number;
 }) => [number, number, number, number];
+export interface Box {
+    minX: number;
+    minY: number;
+    maxX: number;
+    maxY: number;
+    midX: number;
+    midY: number;
+    width: number;
+    height: number;
+}
+export declare const getCommonBoundingBox: (elements: ExcalidrawElement[] | readonly NonDeleted<ExcalidrawElement>[]) => Box;

package/types/element/collision.d.ts

@@ -1,9 +1,11 @@
 import * as GA from "../ga";
-import { NonDeletedExcalidrawElement, ExcalidrawBindableElement, ExcalidrawElement, ExcalidrawRectangleElement, ExcalidrawDiamondElement, ExcalidrawTextElement, ExcalidrawEllipseElement, NonDeleted } from "./types";
+import { NonDeletedExcalidrawElement, ExcalidrawBindableElement, ExcalidrawElement, ExcalidrawRectangleElement, ExcalidrawDiamondElement, ExcalidrawTextElement, ExcalidrawEllipseElement, NonDeleted, ExcalidrawImageElement } from "./types";
 import { Point } from "../types";
 import { AppState } from "../types";
 export declare const hitTest: (element: NonDeletedExcalidrawElement, appState: AppState, x: number, y: number) => boolean;
 export declare const isHittingElementBoundingBoxWithoutHittingElement: (element: NonDeletedExcalidrawElement, appState: AppState, x: number, y: number) => boolean;
+export declare const isHittingElementNotConsideringBoundingBox: (element: NonDeletedExcalidrawElement, appState: AppState, point: readonly [number, number]) => boolean;
+export declare const isPointHittingElementBoundingBox: (element: NonDeleted<ExcalidrawElement>, [x, y]: readonly [number, number], threshold: number) => boolean;
 export declare const bindingBorderTest: (element: NonDeleted<ExcalidrawBindableElement>, { x, y }: {
     x: number;
     y: number;
@@ -16,4 +18,4 @@ export declare const determineFocusPoint: (element: ExcalidrawBindableElement, f
 export declare const intersectElementWithLine: (element: ExcalidrawBindableElement, a: readonly [number, number], b: readonly [number, number], gap?: number) => Point[];
 export declare const getCircleIntersections: (center: readonly [number, number, number, number, number, number, number, number], radius: number, line: readonly [number, number, number, number, number, number, number, number]) => GA.Point[];
 export declare const findFocusPointForEllipse: (ellipse: ExcalidrawEllipseElement, relativeDistance: number, point: readonly [number, number, number, number, number, number, number, number]) => readonly [number, number, number, number, number, number, number, number];
-export declare const findFocusPointForRectangulars: (element: ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawTextElement, relativeDistance: number, point: readonly [number, number, number, number, number, number, number, number]) => readonly [number, number, number, number, number, number, number, number];
+export declare const findFocusPointForRectangulars: (element: ExcalidrawRectangleElement | ExcalidrawImageElement | ExcalidrawDiamondElement | ExcalidrawTextElement, relativeDistance: number, point: readonly [number, number, number, number, number, number, number, number]) => readonly [number, number, number, number, number, number, number, number];

package/types/element/dragElements.d.ts

@@ -1,7 +1,6 @@
 import { SHAPES } from "../shapes";
-import Scene from "../scene/Scene";
 import { NonDeletedExcalidrawElement } from "./types";
-import { PointerDownState } from "../types";
-export declare const dragSelectedElements: (pointerDownState: PointerDownState, selectedElements: NonDeletedExcalidrawElement[], pointerX: number, pointerY: number, scene: Scene, lockDirection?: boolean, distanceX?: number, distanceY?: number) => void;
+import { AppState, PointerDownState } from "../types";
+export declare const dragSelectedElements: (pointerDownState: PointerDownState, selectedElements: NonDeletedExcalidrawElement[], pointerX: number, pointerY: number, lockDirection: boolean | undefined, distanceX: number | undefined, distanceY: number | undefined, appState: AppState) => void;
 export declare const getDragOffsetXY: (selectedElements: NonDeletedExcalidrawElement[], x: number, y: number) => [number, number];
-export declare const dragNewElement: (draggingElement: NonDeletedExcalidrawElement, elementType: typeof SHAPES[number]["value"], originX: number, originY: number, x: number, y: number, width: number, height: number, isResizeWithSidesSameLength: boolean, isResizeCenterPoint: boolean) => void;
+export declare const dragNewElement: (draggingElement: NonDeletedExcalidrawElement, elementType: typeof SHAPES[number]["value"], originX: number, originY: number, x: number, y: number, width: number, height: number, shouldMaintainAspectRatio: boolean, shouldResizeFromCenter: boolean, widthAspectRatio?: number | null | undefined) => void;

package/types/element/image.d.ts

@@ -0,0 +1,22 @@
+import { AppClassProperties, DataURL, BinaryFiles } from "../types";
+import { ExcalidrawElement, FileId, InitializedExcalidrawImageElement } from "./types";
+export declare const loadHTMLImageElement: (dataURL: DataURL) => Promise<HTMLImageElement>;
+/** NOTE: updates cache even if already populated with given image. Thus,
+ * you should filter out the images upstream if you want to optimize this. */
+export declare const updateImageCache: ({ fileIds, files, imageCache, }: {
+    fileIds: FileId[];
+    files: BinaryFiles;
+    imageCache: AppClassProperties["imageCache"];
+}) => Promise<{
+    imageCache: Map<FileId, {
+        image: HTMLImageElement | Promise<HTMLImageElement>;
+        mimeType: "image/svg+xml" | "image/png" | "image/jpeg" | "image/gif";
+    }>;
+    /** includes errored files because they cache was updated nonetheless */
+    updatedFiles: Map<FileId, true>;
+    /** files that failed when creating HTMLImageElement */
+    erroredFiles: Map<FileId, true>;
+}>;
+export declare const getInitializedImageElements: (elements: readonly ExcalidrawElement[]) => InitializedExcalidrawImageElement[];
+export declare const isHTMLSVGElement: (node: Node | null) => node is SVGElement;
+export declare const normalizeSVG: (SVGString: string) => Promise<string>;

package/types/element/index.d.ts

@@ -1,5 +1,5 @@
 import { ExcalidrawElement, NonDeletedExcalidrawElement, NonDeleted } from "./types";
-export { newElement, newTextElement, updateTextElement, newLinearElement, duplicateElement, } from "./newElement";
+export { newElement, newTextElement, updateTextElement, newLinearElement, newImageElement, duplicateElement, } from "./newElement";
 export { getElementAbsoluteCoords, getElementBounds, getCommonBounds, getDiamondPoints, getArrowheadPoints, getClosestElementBounds, } from "./bounds";
 export { OMIT_SIDES_FOR_MULTIPLE_ELEMENTS, getTransformHandlesFromCoords, getTransformHandles, } from "./transformHandles";
 export { hitTest, isHittingElementBoundingBoxWithoutHittingElement, } from "./collision";
@@ -11,12 +11,10 @@ export { textWysiwyg } from "./textWysiwyg";
 export { redrawTextBoundingBox } from "./textElement";
 export { getPerfectElementSize, isInvisiblySmallElement, resizePerfectLineForNWHandler, getNormalizedDimensions, } from "./sizeHelpers";
 export { showSelectedShapeActions } from "./showSelectedShapeActions";
-export declare const getElementMap: (elements: readonly ExcalidrawElement[]) => {
-    [key: string]: ExcalidrawElement;
-};
 export declare const getSceneVersion: (elements: readonly ExcalidrawElement[]) => number;
 export declare const getVisibleElements: (elements: readonly ExcalidrawElement[]) => readonly NonDeletedExcalidrawElement[];
 export declare const getNonDeletedElements: (elements: readonly ExcalidrawElement[]) => readonly NonDeletedExcalidrawElement[];
 export declare const isNonDeletedElement: <T extends ExcalidrawElement>(element: T) => element is NonDeleted<T>;
+export declare const clearElementsForDatabase: (elements: readonly ExcalidrawElement[]) => ExcalidrawElement[];
 export declare const clearElementsForExport: (elements: readonly ExcalidrawElement[]) => ExcalidrawElement[];
 export declare const clearElementsForLocalStorage: (elements: readonly ExcalidrawElement[]) => ExcalidrawElement[];

package/types/element/linearElementEditor.d.ts

@@ -7,14 +7,20 @@ export declare class LinearElementEditor {
     elementId: ExcalidrawElement["id"] & {
         _brand: "excalidrawLinearElementId";
     };
-    activePointIndex: number | null;
+    /** indices */
+    selectedPointsIndices: readonly number[] | null;
+    pointerDownState: Readonly<{
+        prevSelectedPointsIndices: readonly number[] | null;
+        /** index */
+        lastClickedPoint: number;
+    }>;
     /** whether you're dragging a point */
     isDragging: boolean;
     lastUncommittedPoint: Point | null;
-    pointerOffset: {
+    pointerOffset: Readonly<{
         x: number;
         y: number;
-    };
+    }>;
     startBindingElement: ExcalidrawBindableElement | null | "keep";
     endBindingElement: ExcalidrawBindableElement | null | "keep";
     constructor(element: NonDeleted<ExcalidrawLinearElement>, scene: Scene);
@@ -24,8 +30,12 @@ export declare class LinearElementEditor {
      *  statically guarantee this method returns an ExcalidrawLinearElement)
      */
     static getElement(id: InstanceType<typeof LinearElementEditor>["elementId"]): NonDeleted<ExcalidrawLinearElement> | null;
+    static handleBoxSelection(event: PointerEvent, appState: AppState, setState: React.Component<any, AppState>["setState"]): false | undefined;
     /** @returns whether point was dragged */
-    static handlePointDragging(appState: AppState, setState: React.Component<any, AppState>["setState"], scenePointerX: number, scenePointerY: number, maybeSuggestBinding: (element: NonDeleted<ExcalidrawLinearElement>, startOrEnd: "start" | "end") => void): boolean;
+    static handlePointDragging(appState: AppState, setState: React.Component<any, AppState>["setState"], scenePointerX: number, scenePointerY: number, maybeSuggestBinding: (element: NonDeleted<ExcalidrawLinearElement>, pointSceneCoords: {
+        x: number;
+        y: number;
+    }[]) => void): boolean;
     static handlePointerUp(event: PointerEvent, editingLinearElement: LinearElementEditor, appState: AppState): LinearElementEditor;
     static handlePointerDown(event: React.PointerEvent<HTMLCanvasElement>, appState: AppState, setState: React.Component<any, AppState>["setState"], history: History, scenePointer: {
         x: number;
@@ -35,6 +45,9 @@ export declare class LinearElementEditor {
         hitElement: NonDeleted<ExcalidrawElement> | null;
     };
     static handlePointerMove(event: React.PointerEvent<HTMLCanvasElement>, scenePointerX: number, scenePointerY: number, editingLinearElement: LinearElementEditor, gridSize: number | null): LinearElementEditor;
+    /** scene coords */
+    static getPointGlobalCoordinates(element: NonDeleted<ExcalidrawLinearElement>, point: Point): readonly [number, number];
+    /** scene coords */
     static getPointsGlobalCoordinates(element: NonDeleted<ExcalidrawLinearElement>): number[][];
     static getPointAtIndexGlobalCoordinates(element: NonDeleted<ExcalidrawLinearElement>, indexMaybeFromEnd: number): Point;
     static pointFromAbsoluteCoords(element: NonDeleted<ExcalidrawLinearElement>, absoluteCoords: Point): Point;
@@ -51,12 +64,122 @@ export declare class LinearElementEditor {
         y: number;
     };
     static normalizePoints(element: NonDeleted<ExcalidrawLinearElement>): void;
-    static movePointByOffset(element: NonDeleted<ExcalidrawLinearElement>, pointIndex: number, offset: {
-        x: number;
-        y: number;
-    }): void;
-    static movePoint(element: NonDeleted<ExcalidrawLinearElement>, pointIndex: number | "new", targetPosition: Point | "delete", otherUpdates?: {
+    static duplicateSelectedPoints(appState: AppState): false | {
+        appState: {
+            editingLinearElement: {
+                selectedPointsIndices: number[];
+                elementId: string & {
+                    _brand: "excalidrawLinearElementId";
+                };
+                pointerDownState: Readonly<{
+                    prevSelectedPointsIndices: readonly number[] | null;
+                    /** index */
+                    lastClickedPoint: number;
+                }>;
+                /** whether you're dragging a point */
+                isDragging: boolean;
+                lastUncommittedPoint: readonly [number, number] | null;
+                pointerOffset: Readonly<{
+                    x: number;
+                    y: number;
+                }>;
+                startBindingElement: ExcalidrawBindableElement | "keep" | null;
+                endBindingElement: ExcalidrawBindableElement | "keep" | null;
+            };
+            isLoading: boolean;
+            errorMessage: string | null;
+            draggingElement: import("./types").NonDeletedExcalidrawElement | null;
+            resizingElement: import("./types").NonDeletedExcalidrawElement | null;
+            multiElement: NonDeleted<ExcalidrawLinearElement> | null;
+            selectionElement: import("./types").NonDeletedExcalidrawElement | null;
+            isBindingEnabled: boolean;
+            startBoundElement: NonDeleted<ExcalidrawBindableElement> | null;
+            suggestedBindings: import("./binding").SuggestedBinding[];
+            editingElement: import("./types").NonDeletedExcalidrawElement | null;
+            elementType: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw";
+            elementLocked: boolean;
+            penMode: boolean;
+            penDetected: boolean;
+            exportBackground: boolean;
+            exportEmbedScene: boolean;
+            exportWithDarkMode: boolean;
+            exportScale: number;
+            currentItemStrokeColor: string;
+            currentItemBackgroundColor: string;
+            currentItemFillStyle: import("./types").FillStyle;
+            currentItemStrokeWidth: number;
+            currentItemStrokeStyle: import("./types").StrokeStyle;
+            currentItemRoughness: number;
+            currentItemOpacity: number;
+            currentItemFontFamily: number;
+            currentItemFontSize: number;
+            currentItemTextAlign: import("./types").TextAlign;
+            currentItemStrokeSharpness: import("./types").StrokeSharpness;
+            currentItemStartArrowhead: import("./types").Arrowhead | null;
+            currentItemEndArrowhead: import("./types").Arrowhead | null;
+            currentItemLinearStrokeSharpness: import("./types").StrokeSharpness;
+            viewBackgroundColor: string;
+            scrollX: number;
+            scrollY: number;
+            cursorButton: "up" | "down";
+            scrolledOutside: boolean;
+            name: string;
+            isResizing: boolean;
+            isRotating: boolean;
+            zoom: Readonly<{
+                value: import("../types").NormalizedZoomValue;
+            }>;
+            openMenu: "canvas" | "shape" | null;
+            openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
+            lastPointerDownWith: import("./types").PointerType;
+            selectedElementIds: {
+                [id: string]: boolean;
+            };
+            previousSelectedElementIds: {
+                [id: string]: boolean;
+            };
+            shouldCacheIgnoreZoom: boolean;
+            showHelpDialog: boolean;
+            toastMessage: string | null;
+            zenModeEnabled: boolean;
+            theme: string;
+            gridSize: number | null;
+            viewModeEnabled: boolean;
+            selectedGroupIds: {
+                [groupId: string]: boolean;
+            };
+            editingGroupId: string | null;
+            width: number;
+            height: number;
+            offsetTop: number;
+            offsetLeft: number;
+            isLibraryOpen: boolean;
+            fileHandle: import("browser-fs-access").FileSystemHandle | null;
+            collaborators: Map<string, import("../types").Collaborator>;
+            showStats: boolean;
+            currentChartType: import("./types").ChartType;
+            pasteDialog: {
+                shown: false;
+                data: null;
+            } | {
+                shown: true;
+                data: import("../charts").Spreadsheet;
+            };
+            pendingImageElement: NonDeleted<import("./types").ExcalidrawImageElement> | null;
+            showHyperlinkPopup: false | "info" | "editor";
+        };
+    };
+    static deletePoints(element: NonDeleted<ExcalidrawLinearElement>, pointIndices: readonly number[]): void;
+    static addPoints(element: NonDeleted<ExcalidrawLinearElement>, targetPoints: {
+        point: Point;
+    }[]): void;
+    static movePoints(element: NonDeleted<ExcalidrawLinearElement>, targetPoints: {
+        index: number;
+        point: Point;
+        isDragging?: boolean;
+    }[], otherUpdates?: {
         startBinding?: PointBinding;
         endBinding?: PointBinding;
     }): void;
+    private static _updatePoints;
 }

package/types/element/mutateElement.d.ts

@@ -1,9 +1,9 @@
 import { ExcalidrawElement } from "./types";
 declare type ElementUpdate<TElement extends ExcalidrawElement> = Omit<Partial<TElement>, "id" | "version" | "versionNonce">;
-export declare const mutateElement: <TElement extends Mutable<ExcalidrawElement>>(element: TElement, updates: ElementUpdate<TElement>) => void;
+export declare const mutateElement: <TElement extends Mutable<ExcalidrawElement>>(element: TElement, updates: ElementUpdate<TElement>, informMutation?: boolean) => TElement;
 export declare const newElementWith: <TElement extends ExcalidrawElement>(element: TElement, updates: ElementUpdate<TElement>) => TElement;
 /**
- * Mutates element and updates `version` & `versionNonce`.
+ * Mutates element, bumping `version`, `versionNonce`, and `updated`.
  *
  * NOTE: does not trigger re-render.
  */

package/types/element/newElement.d.ts

@@ -1,6 +1,6 @@
-import { ExcalidrawElement, ExcalidrawTextElement, ExcalidrawLinearElement, ExcalidrawGenericElement, NonDeleted, TextAlign, GroupId, VerticalAlign, Arrowhead, ExcalidrawFreeDrawElement, FontFamilyValues } from "../element/types";
+import { ExcalidrawElement, ExcalidrawImageElement, ExcalidrawTextElement, ExcalidrawLinearElement, ExcalidrawGenericElement, NonDeleted, TextAlign, GroupId, VerticalAlign, Arrowhead, ExcalidrawFreeDrawElement, FontFamilyValues, ExcalidrawRectangleElement } from "../element/types";
 import { AppState } from "../types";
-declare type ElementConstructorOpts = MarkOptional<Omit<ExcalidrawGenericElement, "id" | "type" | "isDeleted">, "width" | "height" | "angle" | "groupIds" | "boundElementIds" | "seed" | "version" | "versionNonce">;
+declare type ElementConstructorOpts = MarkOptional<Omit<ExcalidrawGenericElement, "id" | "type" | "isDeleted" | "updated">, "width" | "height" | "angle" | "groupIds" | "boundElements" | "seed" | "version" | "versionNonce" | "link">;
 export declare const newElement: (opts: {
     type: ExcalidrawGenericElement["type"];
 } & ElementConstructorOpts) => NonDeleted<ExcalidrawGenericElement>;
@@ -10,10 +10,12 @@ export declare const newTextElement: (opts: {
     fontFamily: FontFamilyValues;
     textAlign: TextAlign;
     verticalAlign: VerticalAlign;
+    containerId?: ExcalidrawRectangleElement["id"];
 } & ElementConstructorOpts) => NonDeleted<ExcalidrawTextElement>;
-export declare const updateTextElement: (element: ExcalidrawTextElement, { text, isDeleted }: {
+export declare const updateTextElement: (element: ExcalidrawTextElement, { text, isDeleted, originalText, }: {
     text: string;
     isDeleted?: boolean | undefined;
+    originalText: string;
 }) => ExcalidrawTextElement;
 export declare const newFreeDrawElement: (opts: {
     type: "freedraw";
@@ -26,6 +28,9 @@ export declare const newLinearElement: (opts: {
     endArrowhead: Arrowhead | null;
     points?: ExcalidrawLinearElement["points"];
 } & ElementConstructorOpts) => NonDeleted<ExcalidrawLinearElement>;
+export declare const newImageElement: (opts: {
+    type: ExcalidrawImageElement["type"];
+} & ElementConstructorOpts) => NonDeleted<ExcalidrawImageElement>;
 export declare const deepCopyElement: (val: any, depth?: number) => any;
 /**
  * Duplicate an element, often used in the alt-drag operation.

package/types/element/resizeElements.d.ts

@@ -2,8 +2,8 @@ import { ExcalidrawLinearElement, NonDeletedExcalidrawElement, NonDeleted } from
 import { MaybeTransformHandleType, TransformHandleDirection } from "./transformHandles";
 import { PointerDownState } from "../types";
 export declare const normalizeAngle: (angle: number) => number;
-export declare const transformElements: (pointerDownState: PointerDownState, transformHandleType: MaybeTransformHandleType, selectedElements: readonly NonDeletedExcalidrawElement[], resizeArrowDirection: "origin" | "end", isRotateWithDiscreteAngle: boolean, isResizeCenterPoint: boolean, shouldKeepSidesRatio: boolean, pointerX: number, pointerY: number, centerX: number, centerY: number) => boolean;
-export declare const reshapeSingleTwoPointElement: (element: NonDeleted<ExcalidrawLinearElement>, resizeArrowDirection: "origin" | "end", isRotateWithDiscreteAngle: boolean, pointerX: number, pointerY: number) => void;
-export declare const resizeSingleElement: (stateAtResizeStart: NonDeletedExcalidrawElement, shouldKeepSidesRatio: boolean, element: NonDeletedExcalidrawElement, transformHandleDirection: TransformHandleDirection, isResizeFromCenter: boolean, pointerX: number, pointerY: number) => void;
+export declare const transformElements: (pointerDownState: PointerDownState, transformHandleType: MaybeTransformHandleType, selectedElements: readonly NonDeletedExcalidrawElement[], resizeArrowDirection: "origin" | "end", shouldRotateWithDiscreteAngle: boolean, shouldResizeFromCenter: boolean, shouldMaintainAspectRatio: boolean, pointerX: number, pointerY: number, centerX: number, centerY: number) => boolean;
+export declare const reshapeSingleTwoPointElement: (element: NonDeleted<ExcalidrawLinearElement>, resizeArrowDirection: "origin" | "end", shouldRotateWithDiscreteAngle: boolean, pointerX: number, pointerY: number) => void;
+export declare const resizeSingleElement: (stateAtResizeStart: NonDeletedExcalidrawElement, shouldMaintainAspectRatio: boolean, element: NonDeletedExcalidrawElement, transformHandleDirection: TransformHandleDirection, shouldResizeFromCenter: boolean, pointerX: number, pointerY: number) => void;
 export declare const getResizeOffsetXY: (transformHandleType: MaybeTransformHandleType, selectedElements: NonDeletedExcalidrawElement[], x: number, y: number) => [number, number];
 export declare const getResizeArrowDirection: (transformHandleType: MaybeTransformHandleType, element: NonDeleted<ExcalidrawLinearElement>) => "origin" | "end";

package/types/element/textElement.d.ts

@@ -1,2 +1,26 @@
-import { ExcalidrawTextElement } from "./types";
-export declare const redrawTextBoundingBox: (element: ExcalidrawTextElement) => void;
+import { ExcalidrawElement, ExcalidrawTextElement, ExcalidrawTextElementWithContainer, FontString, NonDeletedExcalidrawElement } from "./types";
+import { MaybeTransformHandleType } from "./transformHandles";
+import { AppState } from "../types";
+export declare const redrawTextBoundingBox: (element: ExcalidrawTextElement, container: ExcalidrawElement | null, appState: AppState) => void;
+export declare const bindTextToShapeAfterDuplication: (sceneElements: ExcalidrawElement[], oldElements: ExcalidrawElement[], oldIdToDuplicatedId: Map<ExcalidrawElement["id"], ExcalidrawElement["id"]>) => void;
+export declare const handleBindTextResize: (elements: readonly NonDeletedExcalidrawElement[], transformHandleType: MaybeTransformHandleType) => void;
+export declare const measureText: (text: string, font: FontString, maxWidth?: number | null | undefined) => {
+    width: number;
+    height: number;
+    baseline: number;
+};
+export declare const getApproxLineHeight: (font: FontString) => number;
+export declare const wrapText: (text: string, font: FontString, containerWidth: number) => string;
+export declare const charWidth: {
+    calculate: (char: string, font: FontString) => number;
+    getCache: (font: FontString) => number[];
+};
+export declare const getApproxMinLineWidth: (font: FontString) => number;
+export declare const getApproxMinLineHeight: (font: FontString) => number;
+export declare const getMinCharWidth: (font: FontString) => number;
+export declare const getApproxCharsToFitInWidth: (font: FontString, width: number) => number;
+export declare const getBoundTextElementId: (container: ExcalidrawElement | null) => string | undefined;
+export declare const getBoundTextElement: (element: ExcalidrawElement | null) => ExcalidrawTextElementWithContainer | null;
+export declare const getContainerElement: (element: (ExcalidrawElement & {
+    containerId: ExcalidrawElement["id"] | null;
+}) | null) => ExcalidrawElement | null;

package/types/element/textWysiwyg.d.ts

@@ -1,15 +1,16 @@
-import { ExcalidrawElement } from "./types";
-import { AppState } from "../types";
-export declare const textWysiwyg: ({ id, appState, onChange, onSubmit, getViewportCoords, element, canvas, excalidrawContainer, }: {
+import { ExcalidrawElement, ExcalidrawTextElement } from "./types";
+import App from "../components/App";
+export declare const textWysiwyg: ({ id, onChange, onSubmit, getViewportCoords, element, canvas, excalidrawContainer, app, }: {
     id: ExcalidrawElement["id"];
-    appState: AppState;
     onChange?: ((text: string) => void) | undefined;
     onSubmit: (data: {
         text: string;
         viaKeyboard: boolean;
+        originalText: string;
     }) => void;
     getViewportCoords: (x: number, y: number) => [number, number];
-    element: ExcalidrawElement;
+    element: ExcalidrawTextElement;
     canvas: HTMLCanvasElement | null;
     excalidrawContainer: HTMLDivElement | null;
+    app: App;
 }) => void;

package/types/element/typeChecks.d.ts

@@ -1,5 +1,7 @@
-import { ExcalidrawElement, ExcalidrawTextElement, ExcalidrawLinearElement, ExcalidrawBindableElement, ExcalidrawGenericElement, ExcalidrawFreeDrawElement } from "./types";
+import { ExcalidrawElement, ExcalidrawTextElement, ExcalidrawLinearElement, ExcalidrawBindableElement, ExcalidrawGenericElement, ExcalidrawFreeDrawElement, InitializedExcalidrawImageElement, ExcalidrawImageElement, ExcalidrawTextElementWithContainer } from "./types";
 export declare const isGenericElement: (element: ExcalidrawElement | null) => element is ExcalidrawGenericElement;
+export declare const isInitializedImageElement: (element: ExcalidrawElement | null) => element is InitializedExcalidrawImageElement;
+export declare const isImageElement: (element: ExcalidrawElement | null) => element is ExcalidrawImageElement;
 export declare const isTextElement: (element: ExcalidrawElement | null) => element is ExcalidrawTextElement;
 export declare const isFreeDrawElement: (element?: ExcalidrawElement | null | undefined) => element is ExcalidrawFreeDrawElement;
 export declare const isFreeDrawElementType: (elementType: ExcalidrawElement["type"]) => boolean;
@@ -8,4 +10,7 @@ export declare const isLinearElementType: (elementType: ExcalidrawElement["type"
 export declare const isBindingElement: (element?: ExcalidrawElement | null | undefined) => element is ExcalidrawLinearElement;
 export declare const isBindingElementType: (elementType: ExcalidrawElement["type"]) => boolean;
 export declare const isBindableElement: (element: ExcalidrawElement | null) => element is ExcalidrawBindableElement;
+export declare const isTextBindableContainer: (element: ExcalidrawElement | null) => boolean;
 export declare const isExcalidrawElement: (element: any) => boolean;
+export declare const hasBoundTextElement: (element: ExcalidrawElement | null) => element is ExcalidrawBindableElement;
+export declare const isBoundToContainer: (element: ExcalidrawElement | null) => element is ExcalidrawTextElementWithContainer;

package/types/element/types.d.ts

@@ -1,9 +1,10 @@
 import { Point } from "../types";
-import { FONT_FAMILY } from "../constants";
+import { FONT_FAMILY, THEME } from "../constants";
 export declare type ChartType = "bar" | "line";
 export declare type FillStyle = "hachure" | "cross-hatch" | "solid";
 export declare type FontFamilyKeys = keyof typeof FONT_FAMILY;
 export declare type FontFamilyValues = typeof FONT_FAMILY[FontFamilyKeys];
+export declare type Theme = typeof THEME[keyof typeof THEME];
 export declare type FontString = string & {
     _brand: "fontString";
 };
@@ -42,8 +43,14 @@ declare type _ExcalidrawElementBase = Readonly<{
     /** List of groups the element belongs to.
         Ordered from deepest to shallowest. */
     groupIds: readonly GroupId[];
-    /** Ids of (linear) elements that are bound to this element. */
-    boundElementIds: readonly ExcalidrawLinearElement["id"][] | null;
+    /** other elements that are bound to this element */
+    boundElements: readonly Readonly<{
+        id: ExcalidrawLinearElement["id"];
+        type: "arrow" | "text";
+    }>[] | null;
+    /** epoch (ms) timestamp of last element update */
+    updated: number;
+    link: string | null;
 }>;
 export declare type ExcalidrawSelectionElement = _ExcalidrawElementBase & {
     type: "selection";
@@ -57,6 +64,15 @@ export declare type ExcalidrawDiamondElement = _ExcalidrawElementBase & {
 export declare type ExcalidrawEllipseElement = _ExcalidrawElementBase & {
     type: "ellipse";
 };
+export declare type ExcalidrawImageElement = _ExcalidrawElementBase & Readonly<{
+    type: "image";
+    fileId: FileId | null;
+    /** whether respective file is persisted */
+    status: "pending" | "saved" | "error";
+    /** X and Y scale factors <-1, 1>, used for image axis flipping */
+    scale: [number, number];
+}>;
+export declare type InitializedExcalidrawImageElement = MarkNonNullable<ExcalidrawImageElement, "fileId">;
 /**
  * These are elements that don't have any additional properties.
  */
@@ -66,9 +82,9 @@ export declare type ExcalidrawGenericElement = ExcalidrawSelectionElement | Exca
  * no computed data. The list of all ExcalidrawElements should be shareable
  * between peers and contain no state local to the peer.
  */
-export declare type ExcalidrawElement = ExcalidrawGenericElement | ExcalidrawTextElement | ExcalidrawLinearElement | ExcalidrawFreeDrawElement;
+export declare type ExcalidrawElement = ExcalidrawGenericElement | ExcalidrawTextElement | ExcalidrawLinearElement | ExcalidrawFreeDrawElement | ExcalidrawImageElement;
 export declare type NonDeleted<TElement extends ExcalidrawElement> = TElement & {
-    isDeleted: false;
+    isDeleted: boolean;
 };
 export declare type NonDeletedExcalidrawElement = NonDeleted<ExcalidrawElement>;
 export declare type ExcalidrawTextElement = _ExcalidrawElementBase & Readonly<{
@@ -79,14 +95,19 @@ export declare type ExcalidrawTextElement = _ExcalidrawElementBase & Readonly<{
     baseline: number;
     textAlign: TextAlign;
     verticalAlign: VerticalAlign;
+    containerId: ExcalidrawGenericElement["id"] | null;
+    originalText: string;
 }>;
-export declare type ExcalidrawBindableElement = ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement | ExcalidrawTextElement;
+export declare type ExcalidrawBindableElement = ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement | ExcalidrawTextElement | ExcalidrawImageElement;
+export declare type ExcalidrawTextElementWithContainer = {
+    containerId: ExcalidrawGenericElement["id"];
+} & ExcalidrawTextElement;
 export declare type PointBinding = {
     elementId: ExcalidrawBindableElement["id"];
     focus: number;
     gap: number;
 };
-export declare type Arrowhead = "arrow" | "bar" | "dot";
+export declare type Arrowhead = "arrow" | "bar" | "dot" | "triangle";
 export declare type ExcalidrawLinearElement = _ExcalidrawElementBase & Readonly<{
     type: "line" | "arrow";
     points: readonly Point[];
@@ -103,4 +124,7 @@ export declare type ExcalidrawFreeDrawElement = _ExcalidrawElementBase & Readonl
     simulatePressure: boolean;
     lastCommittedPoint: Point | null;
 }>;
+export declare type FileId = string & {
+    _brand: "FileId";
+};
 export {};

package/types/groups.d.ts

@@ -24,3 +24,4 @@ export declare const addToGroup: (prevGroupIds: ExcalidrawElement["groupIds"], n
 export declare const removeFromSelectedGroups: (groupIds: ExcalidrawElement["groupIds"], selectedGroupIds: {
     [groupId: string]: boolean;
 }) => string[];
+export declare const getMaximumGroups: (elements: ExcalidrawElement[]) => ExcalidrawElement[][];

package/types/i18n.d.ts

@@ -11,5 +11,5 @@ export declare const languages: Language[];
 export declare const setLanguage: (lang: Language) => Promise<void>;
 export declare const getLanguage: () => Language;
 export declare const t: (path: string, replacement?: {
-    [key: string]: string;
+    [key: string]: string | number;
 } | undefined) => string;