@excalidraw/excalidraw 0.16.1-5561755 → 0.16.1-9b8de8a

package/types/element/dragElements.d.ts

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

package/types/element/embeddable.d.ts

@@ -25,15 +25,9 @@ export declare const actionSetEmbeddableAsActiveTool: {
         elements: readonly ExcalidrawElement[];
         appState: {
             activeTool: {
-                lastActiveTool: import("../types").LastActiveTool;
+                lastActiveTool: import("../types").ActiveTool | null;
                 locked: boolean;
-            } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand";
-                customType: null;
-            } | {
-                type: "custom";
-                customType: string;
-            });
+            } & import("../types").ActiveTool;
             contextMenu: {
                 items: import("../components/ContextMenu").ContextMenuItems;
                 top: number;
@@ -142,6 +136,12 @@ export declare const actionSetEmbeddableAsActiveTool: {
             pendingImageElementId: string | null;
             showHyperlinkPopup: false | "editor" | "info";
             selectedLinearElement: import("./linearElementEditor").LinearElementEditor | null;
+            snapLines: readonly import("../snapping").SnapLine[];
+            originSnapOffset: {
+                x: number;
+                y: number;
+            } | null;
+            objectsSnapModeEnabled: boolean;
         };
         commitToHistory: false;
     };

package/types/element/linearElementEditor.d.ts

@@ -1,4 +1,5 @@
 import { NonDeleted, ExcalidrawLinearElement, ExcalidrawElement, PointBinding, ExcalidrawBindableElement, ExcalidrawTextElementWithContainer } from "./types";
+import { Bounds } from "./bounds";
 import { Point, AppState, PointerCoords, InteractiveCanvasAppState } from "../types";
 import History from "../history";
 import Scene from "../scene/Scene";
@@ -152,15 +153,9 @@ export declare class LinearElementEditor {
             elementsToHighlight: NonDeleted<ExcalidrawElement>[] | null;
             editingElement: import("./types").NonDeletedExcalidrawElement | null;
             activeTool: {
-                lastActiveTool: import("../types").LastActiveTool;
+                lastActiveTool: import("../types").ActiveTool | null;
                 locked: boolean;
-            } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand";
-                customType: null;
-            } | {
-                type: "custom";
-                customType: string;
-            });
+            } & import("../types").ActiveTool;
             penMode: boolean;
             penDetected: boolean;
             exportBackground: boolean;
@@ -239,6 +234,12 @@ export declare class LinearElementEditor {
             pendingImageElementId: string | null;
             showHyperlinkPopup: false | "editor" | "info";
             selectedLinearElement: LinearElementEditor | null;
+            snapLines: readonly import("../snapping").SnapLine[];
+            originSnapOffset: {
+                x: number;
+                y: number;
+            } | null;
+            objectsSnapModeEnabled: boolean;
         };
     };
     static deletePoints(element: NonDeleted<ExcalidrawLinearElement>, pointIndices: readonly number[]): void;
@@ -264,7 +265,7 @@ export declare class LinearElementEditor {
         x: number;
         y: number;
     };
-    static getMinMaxXYWithBoundText: (element: ExcalidrawLinearElement, elementBounds: [number, number, number, number], boundTextElement: ExcalidrawTextElementWithContainer) => [number, number, number, number, number, number];
+    static getMinMaxXYWithBoundText: (element: ExcalidrawLinearElement, elementBounds: Bounds, boundTextElement: ExcalidrawTextElementWithContainer) => [number, number, number, number, number, number];
     static getElementAbsoluteCoords: (element: ExcalidrawLinearElement, includeBoundText?: boolean) => [number, number, number, number, number, number];
 }
 export {};

package/types/element/mutateElement.d.ts

@@ -8,5 +8,5 @@ export declare const newElementWith: <TElement extends ExcalidrawElement>(elemen
  *
  * NOTE: does not trigger re-render.
  */
-export declare const bumpVersion: (element: Mutable<ExcalidrawElement>, version?: ExcalidrawElement["version"]) => Mutable<ExcalidrawElement>;
+export declare const bumpVersion: <T extends Mutable<ExcalidrawElement>>(element: T, version?: ExcalidrawElement["version"]) => T;
 export {};

package/types/element/resizeElements.d.ts

@@ -1,8 +1,8 @@
 import { ExcalidrawLinearElement, NonDeletedExcalidrawElement, NonDeleted } from "./types";
 import { MaybeTransformHandleType, TransformHandleDirection } from "./transformHandles";
-import { PointerDownState } from "../types";
+import { AppState, PointerDownState } from "../types";
 export declare const normalizeAngle: (angle: number) => number;
-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 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, appState: AppState) => boolean;
 export declare const resizeSingleElement: (originalElements: PointerDownState["originalElements"], shouldMaintainAspectRatio: boolean, element: NonDeletedExcalidrawElement, transformHandleDirection: TransformHandleDirection, shouldResizeFromCenter: boolean, pointerX: number, pointerY: number) => void;
 export declare const resizeMultipleElements: (pointerDownState: PointerDownState, selectedElements: readonly NonDeletedExcalidrawElement[], transformHandleType: "nw" | "ne" | "sw" | "se", shouldResizeFromCenter: boolean, pointerX: number, pointerY: number) => void;
 export declare const getResizeOffsetXY: (transformHandleType: MaybeTransformHandleType, selectedElements: NonDeletedExcalidrawElement[], x: number, y: number) => [number, number];

package/types/element/resizeTest.d.ts

@@ -1,12 +1,13 @@
 import { ExcalidrawElement, PointerType, NonDeletedExcalidrawElement } from "./types";
 import { MaybeTransformHandleType } from "./transformHandles";
 import { AppState, Zoom } from "../types";
+import { Bounds } from "./bounds";
 export declare const resizeTest: (element: NonDeletedExcalidrawElement, appState: AppState, x: number, y: number, zoom: Zoom, pointerType: PointerType) => MaybeTransformHandleType;
 export declare const getElementWithTransformHandleType: (elements: readonly NonDeletedExcalidrawElement[], appState: AppState, scenePointerX: number, scenePointerY: number, zoom: Zoom, pointerType: PointerType) => {
     element: NonDeletedExcalidrawElement;
     transformHandleType: MaybeTransformHandleType;
 } | null;
-export declare const getTransformHandleTypeFromCoords: ([x1, y1, x2, y2]: readonly [number, number, number, number], scenePointerX: number, scenePointerY: number, zoom: Zoom, pointerType: PointerType) => MaybeTransformHandleType;
+export declare const getTransformHandleTypeFromCoords: ([x1, y1, x2, y2]: Bounds, scenePointerX: number, scenePointerY: number, zoom: Zoom, pointerType: PointerType) => MaybeTransformHandleType;
 export declare const getCursorForResizingElement: (resizingElement: {
     element?: ExcalidrawElement;
     transformHandleType: MaybeTransformHandleType;

package/types/element/transformHandles.d.ts

@@ -1,8 +1,9 @@
 import { ExcalidrawElement, NonDeletedExcalidrawElement, PointerType } from "./types";
+import { Bounds } from "./bounds";
 import { InteractiveCanvasAppState, Zoom } from "../types";
 export type TransformHandleDirection = "n" | "s" | "w" | "e" | "nw" | "ne" | "sw" | "se";
 export type TransformHandleType = TransformHandleDirection | "rotation";
-export type TransformHandle = [number, number, number, number];
+export type TransformHandle = Bounds;
 export type TransformHandles = Partial<{
     [T in TransformHandleType]: TransformHandle;
 }>;

package/types/emitter.d.ts

@@ -0,0 +1,20 @@
+type Subscriber<T extends any[]> = (...payload: T) => void;
+export declare class Emitter<T extends any[] = []> {
+    subscribers: Subscriber<T>[];
+    value: T | undefined;
+    private updateOnChangeOnly;
+    constructor(opts?: {
+        initialState?: T;
+        updateOnChangeOnly?: boolean;
+    });
+    /**
+     * Attaches subscriber
+     *
+     * @returns unsubscribe function
+     */
+    on(...handlers: Subscriber<T>[] | Subscriber<T>[][]): () => void;
+    off(...handlers: Subscriber<T>[] | Subscriber<T>[][]): void;
+    trigger(...payload: T): any[];
+    destroy(): void;
+}
+export {};

package/types/frame.d.ts

@@ -2,6 +2,7 @@ import { ExcalidrawElement, ExcalidrawFrameElement, NonDeleted, NonDeletedExcali
 import { AppClassProperties, AppState, StaticCanvasAppState } from "./types";
 import { ExcalidrawElementsIncludingDeleted } from "./scene/Scene";
 export declare const bindElementsToFramesAfterDuplication: (nextElements: ExcalidrawElement[], oldElements: readonly ExcalidrawElement[], oldIdToDuplicatedId: Map<ExcalidrawElement["id"], ExcalidrawElement["id"]>) => void;
+export declare function isElementIntersectingFrame(element: ExcalidrawElement, frame: ExcalidrawFrameElement): boolean;
 export declare const getElementsCompletelyInFrame: (elements: readonly ExcalidrawElement[], frame: ExcalidrawFrameElement) => ExcalidrawElement[];
 export declare const isElementContainingFrame: (elements: readonly ExcalidrawElement[], element: ExcalidrawElement, frame: ExcalidrawFrameElement) => boolean;
 export declare const getElementsIntersectingFrame: (elements: readonly ExcalidrawElement[], frame: ExcalidrawFrameElement) => ExcalidrawElement[];
@@ -21,6 +22,11 @@ export declare const getFrameElements: (allElements: ExcalidrawElementsIncluding
 export declare const getElementsInResizingFrame: (allElements: ExcalidrawElementsIncludingDeleted, frame: ExcalidrawFrameElement, appState: AppState) => ExcalidrawElement[];
 export declare const getElementsInNewFrame: (allElements: ExcalidrawElementsIncludingDeleted, frame: ExcalidrawFrameElement) => ExcalidrawElement[];
 export declare const getContainingFrame: (element: ExcalidrawElement, elementsMap?: Map<string, ExcalidrawElement>) => ExcalidrawFrameElement | null;
+/**
+ * Retains (or repairs for target frame) the ordering invriant where children
+ * elements come right before the parent frame:
+ * [el, el, child, child, frame, el]
+ */
 export declare const addElementsToFrame: (allElements: ExcalidrawElementsIncludingDeleted, elementsToAdd: NonDeletedExcalidrawElement[], frame: ExcalidrawFrameElement) => ExcalidrawElement[];
 export declare const removeElementsFromFrame: (allElements: ExcalidrawElementsIncludingDeleted, elementsToRemove: NonDeletedExcalidrawElement[], appState: AppState) => ExcalidrawElement[];
 export declare const removeAllElementsFromFrame: (allElements: ExcalidrawElementsIncludingDeleted, frame: ExcalidrawFrameElement, appState: AppState) => ExcalidrawElement[];

package/types/keys.d.ts

@@ -19,6 +19,7 @@ export declare const CODES: {
     readonly V: "KeyV";
     readonly Z: "KeyZ";
     readonly R: "KeyR";
+    readonly S: "KeyS";
 };
 export declare const KEYS: {
     readonly ARROW_DOWN: "ArrowDown";

package/types/math.d.ts

@@ -28,3 +28,6 @@ export declare const getBezierCurveLength: (element: NonDeleted<ExcalidrawLinear
 export declare const mapIntervalToBezierT: (element: NonDeleted<ExcalidrawLinearElement>, endPoint: readonly [number, number], interval: number) => number;
 export declare const arePointsEqual: (p1: readonly [number, number], p2: readonly [number, number]) => boolean;
 export declare const isRightAngle: (angle: number) => boolean;
+export declare const rangesOverlap: ([a0, a1]: [number, number], [b0, b1]: [number, number]) => boolean;
+export declare const rangeIntersection: (rangeA: [number, number], rangeB: [number, number]) => [number, number] | null;
+export declare const isValueInRange: (value: number, min: number, max: number) => boolean;

package/types/packages/bbox.d.ts

@@ -0,0 +1,11 @@
+import { Bounds } from "../element/bounds";
+import { Point } from "../types";
+export type LineSegment = [Point, Point];
+export declare function getBBox(line: LineSegment): Bounds;
+export declare function crossProduct(a: Point, b: Point): number;
+export declare function doBBoxesIntersect(a: Bounds, b: Bounds): boolean;
+export declare function translate(a: Point, b: Point): Point;
+export declare function isPointOnLine(l: LineSegment, p: Point): boolean;
+export declare function isPointRightOfLine(l: LineSegment, p: Point): boolean;
+export declare function isLineSegmentTouchingOrCrossingLine(a: LineSegment, b: LineSegment): boolean;
+export declare function doLineSegmentsIntersect(a: LineSegment, b: LineSegment): boolean;

package/types/packages/excalidraw/index.d.ts

@@ -27,3 +27,4 @@ export { LiveCollaborationTrigger };
 export { DefaultSidebar } from "../../components/DefaultSidebar";
 export { normalizeLink } from "../../data/url";
 export { convertToExcalidrawElements } from "../../data/transform";
+export { elementsOverlappingBBox, isElementInsideBBox, elementPartiallyOverlapsWithOrContainsBBox, } from "../withinBounds";

package/types/packages/utils.d.ts

@@ -30,6 +30,8 @@ export declare const exportToClipboard: (opts: ExportOpts & {
     quality?: number;
     type: "png" | "svg" | "json";
 }) => Promise<void>;
+export * from "./bbox";
+export { elementsOverlappingBBox, isElementInsideBBox, elementPartiallyOverlapsWithOrContainsBBox, } from "./withinBounds";
 export { serializeAsJSON, serializeLibraryAsJSON } from "../data/json";
 export { loadFromBlob, loadSceneOrLibraryFromBlob, loadLibraryFromBlob, } from "../data/blob";
 export { getFreeDrawSvgPath } from "../renderer/renderElement";

package/types/packages/withinBounds.d.ts

@@ -0,0 +1,19 @@
+import type { NonDeletedExcalidrawElement } from "../element/types";
+import { Bounds } from "../element/bounds";
+type Element = NonDeletedExcalidrawElement;
+type Elements = readonly NonDeletedExcalidrawElement[];
+export declare const isElementInsideBBox: (element: Element, bbox: Bounds, eitherDirection?: boolean) => boolean;
+export declare const elementPartiallyOverlapsWithOrContainsBBox: (element: Element, bbox: Bounds) => boolean;
+export declare const elementsOverlappingBBox: ({ elements, bounds, type, errorMargin, }: {
+    elements: Elements;
+    bounds: Bounds;
+    /** safety offset. Defaults to 0. */
+    errorMargin?: number | undefined;
+    /**
+     * - overlap: elements overlapping or inside bounds
+     * - contain: elements inside bounds or bounds inside elements
+     * - inside: elements inside bounds
+     **/
+    type: "overlap" | "contain" | "inside";
+}) => NonDeletedExcalidrawElement[];
+export {};

package/types/renderer/renderSnaps.d.ts

@@ -0,0 +1,2 @@
+import { InteractiveCanvasAppState } from "../types";
+export declare const renderSnaps: (context: CanvasRenderingContext2D, appState: InteractiveCanvasAppState) => void;

package/types/scene/comparisons.d.ts

@@ -4,7 +4,6 @@ export declare const hasStrokeColor: (type: string) => boolean;
 export declare const hasStrokeWidth: (type: string) => boolean;
 export declare const hasStrokeStyle: (type: string) => boolean;
 export declare const canChangeRoundness: (type: string) => boolean;
-export declare const hasText: (type: string) => boolean;
 export declare const canHaveArrowheads: (type: string) => boolean;
 export declare const getElementAtPosition: (elements: readonly NonDeletedExcalidrawElement[], isAtPositionFn: (element: NonDeletedExcalidrawElement) => boolean) => NonDeletedExcalidrawElement | null;
 export declare const getElementsAtPosition: (elements: readonly NonDeletedExcalidrawElement[], isAtPositionFn: (element: NonDeletedExcalidrawElement) => boolean) => NonDeletedExcalidrawElement[];

package/types/scene/export.d.ts

@@ -1,7 +1,6 @@
 import { NonDeletedExcalidrawElement } from "../element/types";
 import { AppState, BinaryFiles } from "../types";
 import { serializeAsJSON } from "../data/json";
-export declare const SVG_EXPORT_TAG = "<!-- svg-source:excalidraw -->";
 export declare const exportToCanvas: (elements: readonly NonDeletedExcalidrawElement[], appState: AppState, files: BinaryFiles, { exportBackground, exportPadding, viewBackgroundColor, }: {
     exportBackground: boolean;
     exportPadding?: number | undefined;

package/types/scene/index.d.ts

@@ -1,5 +1,5 @@
 export { isOverScrollBars } from "./scrollbars";
 export { isSomeElementSelected, getElementsWithinSelection, getCommonAttributeOfSelectedElements, getSelectedElements, getTargetElements, } from "./selection";
 export { calculateScrollCenter } from "./scroll";
-export { hasBackground, hasStrokeWidth, hasStrokeStyle, canHaveArrowheads, canChangeRoundness, getElementAtPosition, hasText, getElementsAtPosition, } from "./comparisons";
+export { hasBackground, hasStrokeWidth, hasStrokeStyle, canHaveArrowheads, canChangeRoundness, getElementAtPosition, getElementsAtPosition, } from "./comparisons";
 export { getNormalizedZoom } from "./zoom";

package/types/scene/selection.d.ts

@@ -8,6 +8,7 @@ import { AppState, InteractiveCanvasAppState } from "../types";
  */
 export declare const excludeElementsInFramesFromSelection: <T extends ExcalidrawElement>(selectedElements: readonly T[]) => T[];
 export declare const getElementsWithinSelection: (elements: readonly NonDeletedExcalidrawElement[], selection: NonDeletedExcalidrawElement, excludeElementsInFrames?: boolean) => NonDeletedExcalidrawElement[];
+export declare const getVisibleAndNonSelectedElements: (elements: readonly NonDeletedExcalidrawElement[], selectedElements: readonly NonDeletedExcalidrawElement[], appState: AppState) => NonDeletedExcalidrawElement[];
 export declare const isSomeElementSelected: {
     (elements: readonly NonDeletedExcalidrawElement[], appState: Pick<AppState, "selectedElementIds">): boolean;
     clearCache(): void;

package/types/snapping.d.ts

@@ -0,0 +1,108 @@
+import { Bounds } from "./element/bounds";
+import { MaybeTransformHandleType } from "./element/transformHandles";
+import { ExcalidrawElement, NonDeletedExcalidrawElement } from "./element/types";
+import { AppState, KeyboardModifiersObject, Point } from "./types";
+export declare const getSnapDistance: (zoomValue: number) => number;
+type Vector2D = {
+    x: number;
+    y: number;
+};
+type PointPair = [Point, Point];
+export type PointSnap = {
+    type: "point";
+    points: PointPair;
+    offset: number;
+};
+export type Gap = {
+    startBounds: Bounds;
+    endBounds: Bounds;
+    startSide: [Point, Point];
+    endSide: [Point, Point];
+    overlap: [number, number];
+    length: number;
+};
+export type GapSnap = {
+    type: "gap";
+    direction: "center_horizontal" | "center_vertical" | "side_left" | "side_right" | "side_top" | "side_bottom";
+    gap: Gap;
+    offset: number;
+};
+export type GapSnaps = GapSnap[];
+export type Snap = GapSnap | PointSnap;
+export type Snaps = Snap[];
+export type PointSnapLine = {
+    type: "points";
+    points: Point[];
+};
+export type PointerSnapLine = {
+    type: "pointer";
+    points: PointPair;
+    direction: "horizontal" | "vertical";
+};
+export type GapSnapLine = {
+    type: "gap";
+    direction: "horizontal" | "vertical";
+    points: PointPair;
+};
+export type SnapLine = PointSnapLine | GapSnapLine | PointerSnapLine;
+export declare class SnapCache {
+    private static referenceSnapPoints;
+    private static visibleGaps;
+    static setReferenceSnapPoints: (snapPoints: Point[] | null) => void;
+    static getReferenceSnapPoints: () => (readonly [number, number])[] | null;
+    static setVisibleGaps: (gaps: {
+        verticalGaps: Gap[];
+        horizontalGaps: Gap[];
+    } | null) => void;
+    static getVisibleGaps: () => {
+        verticalGaps: Gap[];
+        horizontalGaps: Gap[];
+    } | null;
+    static destroy: () => void;
+}
+export declare const isSnappingEnabled: ({ event, appState, selectedElements, }: {
+    appState: AppState;
+    event: KeyboardModifiersObject;
+    selectedElements: NonDeletedExcalidrawElement[];
+}) => boolean;
+export declare const areRoughlyEqual: (a: number, b: number, precision?: number) => boolean;
+export declare const getElementsCorners: (elements: ExcalidrawElement[], { omitCenter, boundingBoxCorners, dragOffset, }?: {
+    omitCenter?: boolean | undefined;
+    boundingBoxCorners?: boolean | undefined;
+    dragOffset?: Vector2D | undefined;
+}) => Point[];
+export declare const getVisibleGaps: (elements: readonly NonDeletedExcalidrawElement[], selectedElements: ExcalidrawElement[], appState: AppState) => {
+    horizontalGaps: Gap[];
+    verticalGaps: Gap[];
+};
+export declare const getReferenceSnapPoints: (elements: readonly NonDeletedExcalidrawElement[], selectedElements: ExcalidrawElement[], appState: AppState) => (readonly [number, number])[];
+export declare const snapDraggedElements: (selectedElements: ExcalidrawElement[], dragOffset: Vector2D, appState: AppState, event: KeyboardModifiersObject) => {
+    snapOffset: {
+        x: number;
+        y: number;
+    };
+    snapLines: (PointSnapLine | GapSnapLine)[];
+};
+export declare const snapResizingElements: (selectedElements: ExcalidrawElement[], selectedOriginalElements: ExcalidrawElement[], appState: AppState, event: KeyboardModifiersObject, dragOffset: Vector2D, transformHandle: MaybeTransformHandleType) => {
+    snapOffset: {
+        x: number;
+        y: number;
+    };
+    snapLines: PointSnapLine[];
+};
+export declare const snapNewElement: (draggingElement: ExcalidrawElement, appState: AppState, event: KeyboardModifiersObject, origin: Vector2D, dragOffset: Vector2D) => {
+    snapOffset: {
+        x: number;
+        y: number;
+    };
+    snapLines: PointSnapLine[];
+};
+export declare const getSnapLinesAtPointer: (elements: readonly ExcalidrawElement[], appState: AppState, pointer: Vector2D, event: KeyboardModifiersObject) => {
+    originOffset: {
+        x: number;
+        y: number;
+    };
+    snapLines: PointerSnapLine[];
+};
+export declare const isActiveToolNonLinearSnappable: (activeToolType: AppState["activeTool"]["type"]) => boolean;
+export {};

package/types/types.d.ts

@@ -1,6 +1,5 @@
 import React from "react";
 import { PointerType, ExcalidrawLinearElement, NonDeletedExcalidrawElement, NonDeleted, TextAlign, ExcalidrawElement, GroupId, ExcalidrawBindableElement, Arrowhead, ChartType, FontFamilyValues, FileId, ExcalidrawImageElement, Theme, StrokeRoundness, ExcalidrawFrameElement, ExcalidrawEmbeddableElement } from "./element/types";
-import { SHAPES } from "./shapes";
 import { Point as RoughPoint } from "roughjs/bin/geometry";
 import { LinearElementEditor } from "./element/linearElementEditor";
 import { SuggestedBinding } from "./element/binding";
@@ -16,13 +15,11 @@ import Library from "./data/library";
 import type { FileSystemHandle } from "./data/filesystem";
 import type { IMAGE_MIME_TYPES, MIME_TYPES } from "./constants";
 import { ContextMenuItems } from "./components/ContextMenu";
+import { SnapLine } from "./snapping";
 import { Merge, ForwardRef, ValueOf } from "./utility-types";
 export type Point = Readonly<RoughPoint>;
 export type Collaborator = {
-    pointer?: {
-        x: number;
-        y: number;
-    };
+    pointer?: CollaboratorPointer;
     button?: "up" | "down";
     selectedElementIds?: AppState["selectedElementIds"];
     username?: string | null;
@@ -34,6 +31,11 @@ export type Collaborator = {
     avatarUrl?: string;
     id?: string;
 };
+export type CollaboratorPointer = {
+    x: number;
+    y: number;
+    tool: "pointer" | "laser";
+};
 export type DataURL = string & {
     _brand: "DataURL";
 };
@@ -56,13 +58,14 @@ export type BinaryFileData = {
 };
 export type BinaryFileMetadata = Omit<BinaryFileData, "dataURL">;
 export type BinaryFiles = Record<ExcalidrawElement["id"], BinaryFileData>;
-export type LastActiveTool = {
-    type: typeof SHAPES[number]["value"] | "eraser" | "hand" | "frame" | "embeddable";
+export type ToolType = "selection" | "rectangle" | "diamond" | "ellipse" | "arrow" | "line" | "freedraw" | "text" | "image" | "eraser" | "hand" | "frame" | "embeddable" | "laser";
+export type ActiveTool = {
+    type: ToolType;
     customType: null;
 } | {
     type: "custom";
     customType: string;
-} | null;
+};
 export type SidebarName = string;
 export type SidebarTabName = string;
 type _CommonCanvasAppState = {
@@ -103,6 +106,8 @@ export type InteractiveCanvasAppState = Readonly<_CommonCanvasAppState & {
     openSidebar: AppState["openSidebar"];
     showHyperlinkPopup: AppState["showHyperlinkPopup"];
     collaborators: AppState["collaborators"];
+    snapLines: AppState["snapLines"];
+    zenModeEnabled: AppState["zenModeEnabled"];
 }>;
 export type AppState = {
     contextMenu: {
@@ -140,15 +145,9 @@ export type AppState = {
          * indicates a previous tool we should revert back to if we deselect the
          * currently active tool. At the moment applies to `eraser` and `hand` tool.
          */
-        lastActiveTool: LastActiveTool;
+        lastActiveTool: ActiveTool | null;
         locked: boolean;
-    } & ({
-        type: typeof SHAPES[number]["value"] | "eraser" | "hand" | "frame" | "embeddable";
-        customType: null;
-    } | {
-        type: "custom";
-        customType: string;
-    });
+    } & ActiveTool;
     penMode: boolean;
     penDetected: boolean;
     exportBackground: boolean;
@@ -236,6 +235,12 @@ export type AppState = {
     pendingImageElementId: ExcalidrawImageElement["id"] | null;
     showHyperlinkPopup: false | "info" | "editor";
     selectedLinearElement: LinearElementEditor | null;
+    snapLines: readonly SnapLine[];
+    originSnapOffset: {
+        x: number;
+        y: number;
+    } | null;
+    objectsSnapModeEnabled: boolean;
 };
 export type UIAppState = Omit<AppState, "suggestedBindings" | "startBoundElement" | "cursorButton" | "scrollX" | "scrollY">;
 export type NormalizedZoomValue = number & {
@@ -294,6 +299,7 @@ export interface ExcalidrawProps {
         pointer: {
             x: number;
             y: number;
+            tool: "pointer" | "laser";
         };
         button: "down" | "up";
         pointersMap: Gesture["pointers"];
@@ -304,6 +310,7 @@ export interface ExcalidrawProps {
     viewModeEnabled?: boolean;
     zenModeEnabled?: boolean;
     gridModeEnabled?: boolean;
+    objectsSnapModeEnabled?: boolean;
     libraryReturnUrl?: string;
     theme?: Theme;
     name?: string;
@@ -386,6 +393,8 @@ export type AppClassProperties = {
     onInsertElements: App["onInsertElements"];
     onExportImage: App["onExportImage"];
     lastViewportPosition: App["lastViewportPosition"];
+    togglePenMode: App["togglePenMode"];
+    setActiveTool: App["setActiveTool"];
 };
 export type PointerDownState = Readonly<{
     origin: Readonly<{
@@ -446,6 +455,7 @@ export type PointerDownState = Readonly<{
         };
     };
 }>;
+type UnsubscribeCallback = () => void;
 export type ExcalidrawImperativeAPI = {
     updateScene: InstanceType<typeof App>["updateScene"];
     updateLibrary: InstanceType<typeof Library>["updateLibrary"];
@@ -474,6 +484,9 @@ export type ExcalidrawImperativeAPI = {
      * used in conjunction with view mode (props.viewModeEnabled).
      */
     updateFrameRendering: InstanceType<typeof App>["updateFrameRendering"];
+    onChange: (callback: (elements: readonly ExcalidrawElement[], appState: AppState, files: BinaryFiles) => void) => UnsubscribeCallback;
+    onPointerDown: (callback: (activeTool: AppState["activeTool"], pointerDownState: PointerDownState, event: React.PointerEvent<HTMLElement>) => void) => UnsubscribeCallback;
+    onPointerUp: (callback: (activeTool: AppState["activeTool"], pointerDownState: PointerDownState, event: PointerEvent) => void) => UnsubscribeCallback;
 };
 export type Device = Readonly<{
     isSmScreen: boolean;
@@ -496,4 +509,11 @@ export type FrameNameBoundsCache = {
         versionNonce: ExcalidrawFrameElement["versionNonce"];
     }>;
 };
+export type KeyboardModifiersObject = {
+    ctrlKey: boolean;
+    shiftKey: boolean;
+    altKey: boolean;
+    metaKey: boolean;
+};
+export type Primitive = number | string | boolean | bigint | symbol | null | undefined;
 export {};

package/types/utils.d.ts

@@ -1,7 +1,6 @@
 import { EVENT } from "./constants";
 import { FontFamilyValues, FontString, NonDeletedExcalidrawElement } from "./element/types";
-import { AppState, LastActiveTool, Zoom } from "./types";
-import { SHAPES } from "./shapes";
+import { ActiveTool, AppState, ToolType, Zoom } from "./types";
 export declare const setDateTimeForTests: (dateTime: string) => void;
 export declare const getDateTime: () => string;
 export declare const capitalizeString: (str: string) => string;
@@ -80,18 +79,16 @@ export declare const chunk: <T extends unknown>(array: readonly T[], size: numbe
 export declare const selectNode: (node: Element) => void;
 export declare const removeSelection: () => void;
 export declare const distance: (x: number, y: number) => number;
-export declare const updateActiveTool: (appState: Pick<AppState, "activeTool">, data: ({
-    type: (typeof SHAPES)[number]["value"] | "eraser" | "hand" | "frame" | "embeddable";
+export declare const updateActiveTool: (appState: Pick<AppState, "activeTool">, data: (({
+    type: ToolType;
 } | {
     type: "custom";
     customType: string;
 }) & {
-    lastActiveToolBeforeEraser?: LastActiveTool;
+    locked?: boolean;
+}) & {
+    lastActiveToolBeforeEraser?: ActiveTool | null;
 }) => AppState["activeTool"];
-export declare const resetCursor: (interactiveCanvas: HTMLCanvasElement | null) => void;
-export declare const setCursor: (interactiveCanvas: HTMLCanvasElement | null, cursor: string) => void;
-export declare const setEraserCursor: (interactiveCanvas: HTMLCanvasElement | null, theme: AppState["theme"]) => void;
-export declare const setCursorForShape: (interactiveCanvas: HTMLCanvasElement | null, appState: Pick<AppState, "activeTool" | "theme">) => void;
 export declare const isFullScreen: () => boolean;
 export declare const allowFullScreen: () => Promise<void>;
 export declare const exitFullScreen: () => Promise<void>;
@@ -198,3 +195,5 @@ export declare const memoize: <T extends Record<string, any>, R extends unknown>
     clear: () => void;
 };
 export declare const isRenderThrottlingEnabled: () => boolean;
+/** Checks if value is inside given collection. Useful for type-safety. */
+export declare const isMemberOf: <T extends string>(collection: Set<T> | Record<T, any> | Map<T, any> | readonly T[], value: string) => value is T;

package/types/zindex.d.ts

@@ -1,6 +1,6 @@
 import { ExcalidrawElement } from "./element/types";
 import { AppState } from "./types";
-export declare const moveOneLeft: (elements: readonly ExcalidrawElement[], appState: AppState, elementsToBeMoved?: readonly ExcalidrawElement[]) => ExcalidrawElement[];
-export declare const moveOneRight: (elements: readonly ExcalidrawElement[], appState: AppState, elementsToBeMoved?: readonly ExcalidrawElement[]) => ExcalidrawElement[];
-export declare const moveAllLeft: (elements: readonly ExcalidrawElement[], appState: AppState, elementsToBeMoved?: readonly ExcalidrawElement[]) => ExcalidrawElement[];
-export declare const moveAllRight: (elements: readonly ExcalidrawElement[], appState: AppState, elementsToBeMoved?: readonly ExcalidrawElement[]) => ExcalidrawElement[];
+export declare const moveOneLeft: (allElements: readonly ExcalidrawElement[], appState: AppState) => ExcalidrawElement[];
+export declare const moveOneRight: (allElements: readonly ExcalidrawElement[], appState: AppState) => ExcalidrawElement[];
+export declare const moveAllLeft: (allElements: readonly ExcalidrawElement[], appState: AppState) => readonly ExcalidrawElement[] | ExcalidrawElement[];
+export declare const moveAllRight: (allElements: readonly ExcalidrawElement[], appState: AppState) => readonly ExcalidrawElement[] | ExcalidrawElement[];