@dwelle/excalidraw 0.4.0-9db4535 → 0.4.0-9fa56da

package/types/actions/actionCanvas.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ExcalidrawElement } from "../element/types";
 import { AppState, NormalizedZoomValue } from "../types";
 export declare const actionChangeViewBackgroundColor: {
@@ -23,7 +22,7 @@ export declare const actionClearCanvas: {
         elements: ExcalidrawElement[];
         appState: {
             files: {};
-            theme: string;
+            theme: import("../element/types").Theme;
             penMode: boolean;
             penDetected: boolean;
             exportBackground: boolean;
@@ -38,16 +37,16 @@ export declare const actionClearCanvas: {
                 data: import("../charts").Spreadsheet;
             };
             activeTool: {
-                lastActiveTool: import("../types").LastActiveTool;
+                lastActiveTool: import("../types").ActiveTool | null;
                 locked: boolean;
-            } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
-                customType: null;
-            } | {
-                type: "custom";
-                customType: string;
-            });
+            } & import("../types").ActiveTool;
             name: string;
+            toast: {
+                message: string;
+                closable?: boolean | undefined;
+                duration?: number | undefined;
+            } | null;
+            collaborators: Map<string, import("../types").Collaborator>;
             contextMenu: {
                 items: import("../components/ContextMenu").ContextMenuItems;
                 top: number;
@@ -56,6 +55,10 @@ export declare const actionClearCanvas: {
             showWelcomeScreen: boolean;
             isLoading: boolean;
             errorMessage: import("react").ReactNode;
+            activeEmbeddable: {
+                element: import("../element/types").NonDeletedExcalidrawElement;
+                state: "active" | "hover";
+            } | null;
             draggingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             resizingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             multiElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawLinearElement> | null;
@@ -63,6 +66,15 @@ export declare const actionClearCanvas: {
             isBindingEnabled: boolean;
             startBoundElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawBindableElement> | null;
             suggestedBindings: import("../element/binding").SuggestedBinding[];
+            frameToHighlight: import("../element/types").NonDeleted<import("../element/types").ExcalidrawFrameElement> | null;
+            frameRendering: {
+                enabled: boolean;
+                name: boolean;
+                outline: boolean;
+                clip: boolean;
+            };
+            editingFrame: string | null;
+            elementsToHighlight: import("../element/types").NonDeleted<ExcalidrawElement>[] | null;
             editingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             editingLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
             exportWithDarkMode: boolean;
@@ -99,18 +111,14 @@ export declare const actionClearCanvas: {
             openDialog: "imageExport" | "help" | "jsonExport" | null;
             defaultSidebarDockedPreference: boolean;
             lastPointerDownWith: import("../element/types").PointerType;
-            selectedElementIds: {
-                [id: string]: boolean;
-            };
+            selectedElementIds: Readonly<{
+                [id: string]: true;
+            }>;
             previousSelectedElementIds: {
-                [id: string]: boolean;
+                [id: string]: true;
             };
+            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
-            toast: {
-                message: string;
-                closable?: boolean | undefined;
-                duration?: number | undefined;
-            } | null;
             zenModeEnabled: boolean;
             viewModeEnabled: boolean;
             selectedGroupIds: {
@@ -118,11 +126,16 @@ export declare const actionClearCanvas: {
             };
             editingGroupId: string | null;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
-            collaborators: Map<string, import("../types").Collaborator>;
             currentChartType: import("../element/types").ChartType;
             pendingImageElementId: string | null;
-            showHyperlinkPopup: false | "info" | "editor";
+            showHyperlinkPopup: false | "editor" | "info";
             selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
+            snapLines: readonly import("../snapping").SnapLine[];
+            originSnapOffset: {
+                x: number;
+                y: number;
+            } | null;
+            objectsSnapModeEnabled: boolean;
         };
         commitToHistory: true;
     };
@@ -150,6 +163,10 @@ export declare const actionZoomIn: {
             showWelcomeScreen: boolean;
             isLoading: boolean;
             errorMessage: import("react").ReactNode;
+            activeEmbeddable: {
+                element: import("../element/types").NonDeletedExcalidrawElement;
+                state: "active" | "hover";
+            } | null;
             draggingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             resizingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             multiElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawLinearElement> | null;
@@ -157,18 +174,21 @@ export declare const actionZoomIn: {
             isBindingEnabled: boolean;
             startBoundElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawBindableElement> | null;
             suggestedBindings: import("../element/binding").SuggestedBinding[];
+            frameToHighlight: import("../element/types").NonDeleted<import("../element/types").ExcalidrawFrameElement> | null;
+            frameRendering: {
+                enabled: boolean;
+                name: boolean;
+                outline: boolean;
+                clip: boolean;
+            };
+            editingFrame: string | null;
+            elementsToHighlight: import("../element/types").NonDeleted<ExcalidrawElement>[] | null;
             editingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             editingLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
             activeTool: {
-                lastActiveTool: import("../types").LastActiveTool;
+                lastActiveTool: import("../types").ActiveTool | null;
                 locked: boolean;
-            } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
-                customType: null;
-            } | {
-                type: "custom";
-                customType: string;
-            });
+            } & import("../types").ActiveTool;
             penMode: boolean;
             penDetected: boolean;
             exportBackground: boolean;
@@ -203,12 +223,13 @@ export declare const actionZoomIn: {
             openDialog: "imageExport" | "help" | "jsonExport" | null;
             defaultSidebarDockedPreference: boolean;
             lastPointerDownWith: import("../element/types").PointerType;
-            selectedElementIds: {
-                [id: string]: boolean;
-            };
+            selectedElementIds: Readonly<{
+                [id: string]: true;
+            }>;
             previousSelectedElementIds: {
-                [id: string]: boolean;
+                [id: string]: true;
             };
+            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
             toast: {
                 message: string;
@@ -216,7 +237,7 @@ export declare const actionZoomIn: {
                 duration?: number | undefined;
             } | null;
             zenModeEnabled: boolean;
-            theme: string;
+            theme: import("../element/types").Theme;
             gridSize: number | null;
             viewModeEnabled: boolean;
             selectedGroupIds: {
@@ -239,15 +260,21 @@ export declare const actionZoomIn: {
                 data: import("../charts").Spreadsheet;
             };
             pendingImageElementId: string | null;
-            showHyperlinkPopup: false | "info" | "editor";
+            showHyperlinkPopup: false | "editor" | "info";
             selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
+            snapLines: readonly import("../snapping").SnapLine[];
+            originSnapOffset: {
+                x: number;
+                y: number;
+            } | null;
+            objectsSnapModeEnabled: boolean;
         };
         commitToHistory: false;
     };
     PanelComponent: ({ updateData }: import("./types").PanelComponentProps) => JSX.Element;
-    keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
+    keyTest: (event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean;
 } & {
-    keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
+    keyTest?: ((event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean) | undefined;
 };
 export declare const actionZoomOut: {
     name: "zoomOut";
@@ -270,6 +297,10 @@ export declare const actionZoomOut: {
             showWelcomeScreen: boolean;
             isLoading: boolean;
             errorMessage: import("react").ReactNode;
+            activeEmbeddable: {
+                element: import("../element/types").NonDeletedExcalidrawElement;
+                state: "active" | "hover";
+            } | null;
             draggingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             resizingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             multiElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawLinearElement> | null;
@@ -277,18 +308,21 @@ export declare const actionZoomOut: {
             isBindingEnabled: boolean;
             startBoundElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawBindableElement> | null;
             suggestedBindings: import("../element/binding").SuggestedBinding[];
+            frameToHighlight: import("../element/types").NonDeleted<import("../element/types").ExcalidrawFrameElement> | null;
+            frameRendering: {
+                enabled: boolean;
+                name: boolean;
+                outline: boolean;
+                clip: boolean;
+            };
+            editingFrame: string | null;
+            elementsToHighlight: import("../element/types").NonDeleted<ExcalidrawElement>[] | null;
             editingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             editingLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
             activeTool: {
-                lastActiveTool: import("../types").LastActiveTool;
+                lastActiveTool: import("../types").ActiveTool | null;
                 locked: boolean;
-            } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
-                customType: null;
-            } | {
-                type: "custom";
-                customType: string;
-            });
+            } & import("../types").ActiveTool;
             penMode: boolean;
             penDetected: boolean;
             exportBackground: boolean;
@@ -323,12 +357,13 @@ export declare const actionZoomOut: {
             openDialog: "imageExport" | "help" | "jsonExport" | null;
             defaultSidebarDockedPreference: boolean;
             lastPointerDownWith: import("../element/types").PointerType;
-            selectedElementIds: {
-                [id: string]: boolean;
-            };
+            selectedElementIds: Readonly<{
+                [id: string]: true;
+            }>;
             previousSelectedElementIds: {
-                [id: string]: boolean;
+                [id: string]: true;
             };
+            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
             toast: {
                 message: string;
@@ -336,7 +371,7 @@ export declare const actionZoomOut: {
                 duration?: number | undefined;
             } | null;
             zenModeEnabled: boolean;
-            theme: string;
+            theme: import("../element/types").Theme;
             gridSize: number | null;
             viewModeEnabled: boolean;
             selectedGroupIds: {
@@ -359,15 +394,21 @@ export declare const actionZoomOut: {
                 data: import("../charts").Spreadsheet;
             };
             pendingImageElementId: string | null;
-            showHyperlinkPopup: false | "info" | "editor";
+            showHyperlinkPopup: false | "editor" | "info";
             selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
+            snapLines: readonly import("../snapping").SnapLine[];
+            originSnapOffset: {
+                x: number;
+                y: number;
+            } | null;
+            objectsSnapModeEnabled: boolean;
         };
         commitToHistory: false;
     };
     PanelComponent: ({ updateData }: import("./types").PanelComponentProps) => JSX.Element;
-    keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
+    keyTest: (event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean;
 } & {
-    keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
+    keyTest?: ((event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean) | undefined;
 };
 export declare const actionResetZoom: {
     name: "resetZoom";
@@ -390,6 +431,10 @@ export declare const actionResetZoom: {
             showWelcomeScreen: boolean;
             isLoading: boolean;
             errorMessage: import("react").ReactNode;
+            activeEmbeddable: {
+                element: import("../element/types").NonDeletedExcalidrawElement;
+                state: "active" | "hover";
+            } | null;
             draggingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             resizingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             multiElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawLinearElement> | null;
@@ -397,18 +442,21 @@ export declare const actionResetZoom: {
             isBindingEnabled: boolean;
             startBoundElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawBindableElement> | null;
             suggestedBindings: import("../element/binding").SuggestedBinding[];
+            frameToHighlight: import("../element/types").NonDeleted<import("../element/types").ExcalidrawFrameElement> | null;
+            frameRendering: {
+                enabled: boolean;
+                name: boolean;
+                outline: boolean;
+                clip: boolean;
+            };
+            editingFrame: string | null;
+            elementsToHighlight: import("../element/types").NonDeleted<ExcalidrawElement>[] | null;
             editingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             editingLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
             activeTool: {
-                lastActiveTool: import("../types").LastActiveTool;
+                lastActiveTool: import("../types").ActiveTool | null;
                 locked: boolean;
-            } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
-                customType: null;
-            } | {
-                type: "custom";
-                customType: string;
-            });
+            } & import("../types").ActiveTool;
             penMode: boolean;
             penDetected: boolean;
             exportBackground: boolean;
@@ -443,12 +491,13 @@ export declare const actionResetZoom: {
             openDialog: "imageExport" | "help" | "jsonExport" | null;
             defaultSidebarDockedPreference: boolean;
             lastPointerDownWith: import("../element/types").PointerType;
-            selectedElementIds: {
-                [id: string]: boolean;
-            };
+            selectedElementIds: Readonly<{
+                [id: string]: true;
+            }>;
             previousSelectedElementIds: {
-                [id: string]: boolean;
+                [id: string]: true;
             };
+            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
             toast: {
                 message: string;
@@ -456,7 +505,7 @@ export declare const actionResetZoom: {
                 duration?: number | undefined;
             } | null;
             zenModeEnabled: boolean;
-            theme: string;
+            theme: import("../element/types").Theme;
             gridSize: number | null;
             viewModeEnabled: boolean;
             selectedGroupIds: {
@@ -479,23 +528,36 @@ export declare const actionResetZoom: {
                 data: import("../charts").Spreadsheet;
             };
             pendingImageElementId: string | null;
-            showHyperlinkPopup: false | "info" | "editor";
+            showHyperlinkPopup: false | "editor" | "info";
             selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
+            snapLines: readonly import("../snapping").SnapLine[];
+            originSnapOffset: {
+                x: number;
+                y: number;
+            } | null;
+            objectsSnapModeEnabled: boolean;
         };
         commitToHistory: false;
     };
     PanelComponent: ({ updateData, appState }: import("./types").PanelComponentProps) => JSX.Element;
-    keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
+    keyTest: (event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean;
 } & {
-    keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
+    keyTest?: ((event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean) | undefined;
 };
-export declare const zoomToFitElements: (elements: readonly ExcalidrawElement[], appState: Readonly<AppState>, zoomToSelection: boolean) => {
+export declare const zoomToFit: ({ targetElements, appState, fitToViewport, viewportZoomFactor, }: {
+    targetElements: readonly ExcalidrawElement[];
+    appState: Readonly<AppState>;
+    /** whether to fit content to viewport (beyond >100%) */
+    fitToViewport: boolean;
+    /** zoom content to cover X of the viewport, when fitToViewport=true */
+    viewportZoomFactor?: number | undefined;
+}) => {
     appState: {
+        scrollX: number;
+        scrollY: number;
         zoom: {
             value: NormalizedZoomValue;
         };
-        scrollX: number;
-        scrollY: number;
         contextMenu: {
             items: import("../components/ContextMenu").ContextMenuItems;
             top: number;
@@ -504,6 +566,10 @@ export declare const zoomToFitElements: (elements: readonly ExcalidrawElement[],
         showWelcomeScreen: boolean;
         isLoading: boolean;
         errorMessage: import("react").ReactNode;
+        activeEmbeddable: {
+            element: import("../element/types").NonDeletedExcalidrawElement;
+            state: "active" | "hover";
+        } | null;
         draggingElement: import("../element/types").NonDeletedExcalidrawElement | null;
         resizingElement: import("../element/types").NonDeletedExcalidrawElement | null;
         multiElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawLinearElement> | null;
@@ -511,18 +577,21 @@ export declare const zoomToFitElements: (elements: readonly ExcalidrawElement[],
         isBindingEnabled: boolean;
         startBoundElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawBindableElement> | null;
         suggestedBindings: import("../element/binding").SuggestedBinding[];
+        frameToHighlight: import("../element/types").NonDeleted<import("../element/types").ExcalidrawFrameElement> | null;
+        frameRendering: {
+            enabled: boolean;
+            name: boolean;
+            outline: boolean;
+            clip: boolean;
+        };
+        editingFrame: string | null;
+        elementsToHighlight: import("../element/types").NonDeleted<ExcalidrawElement>[] | null;
         editingElement: import("../element/types").NonDeletedExcalidrawElement | null;
         editingLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
         activeTool: {
-            lastActiveTool: import("../types").LastActiveTool;
+            lastActiveTool: import("../types").ActiveTool | null;
             locked: boolean;
-        } & ({
-            type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
-            customType: null;
-        } | {
-            type: "custom";
-            customType: string;
-        });
+        } & import("../types").ActiveTool;
         penMode: boolean;
         penDetected: boolean;
         exportBackground: boolean;
@@ -557,12 +626,13 @@ export declare const zoomToFitElements: (elements: readonly ExcalidrawElement[],
         openDialog: "imageExport" | "help" | "jsonExport" | null;
         defaultSidebarDockedPreference: boolean;
         lastPointerDownWith: import("../element/types").PointerType;
-        selectedElementIds: {
-            [id: string]: boolean;
-        };
+        selectedElementIds: Readonly<{
+            [id: string]: true;
+        }>;
         previousSelectedElementIds: {
-            [id: string]: boolean;
+            [id: string]: true;
         };
+        selectedElementsAreBeingDragged: boolean;
         shouldCacheIgnoreZoom: boolean;
         toast: {
             message: string;
@@ -570,7 +640,7 @@ export declare const zoomToFitElements: (elements: readonly ExcalidrawElement[],
             duration?: number | undefined;
         } | null;
         zenModeEnabled: boolean;
-        theme: string;
+        theme: import("../element/types").Theme;
         gridSize: number | null;
         viewModeEnabled: boolean;
         selectedGroupIds: {
@@ -593,23 +663,161 @@ export declare const zoomToFitElements: (elements: readonly ExcalidrawElement[],
             data: import("../charts").Spreadsheet;
         };
         pendingImageElementId: string | null;
-        showHyperlinkPopup: false | "info" | "editor";
+        showHyperlinkPopup: false | "editor" | "info";
         selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
+        snapLines: readonly import("../snapping").SnapLine[];
+        originSnapOffset: {
+            x: number;
+            y: number;
+        } | null;
+        objectsSnapModeEnabled: boolean;
     };
     commitToHistory: boolean;
 };
-export declare const actionZoomToSelected: {
-    name: "zoomToSelection";
+export declare const actionZoomToFitSelectionInViewport: {
+    name: "zoomToFitSelectionInViewport";
     trackEvent: {
         category: "canvas";
     };
-    perform: (elements: readonly ExcalidrawElement[], appState: Readonly<AppState>) => {
+    perform: (elements: readonly ExcalidrawElement[], appState: Readonly<AppState>, _: any, app: import("../types").AppClassProperties) => {
         appState: {
+            scrollX: number;
+            scrollY: number;
             zoom: {
                 value: NormalizedZoomValue;
             };
+            contextMenu: {
+                items: import("../components/ContextMenu").ContextMenuItems;
+                top: number;
+                left: number;
+            } | null;
+            showWelcomeScreen: boolean;
+            isLoading: boolean;
+            errorMessage: import("react").ReactNode;
+            activeEmbeddable: {
+                element: import("../element/types").NonDeletedExcalidrawElement;
+                state: "active" | "hover";
+            } | null;
+            draggingElement: import("../element/types").NonDeletedExcalidrawElement | null;
+            resizingElement: import("../element/types").NonDeletedExcalidrawElement | null;
+            multiElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawLinearElement> | null;
+            selectionElement: import("../element/types").NonDeletedExcalidrawElement | null;
+            isBindingEnabled: boolean;
+            startBoundElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawBindableElement> | null;
+            suggestedBindings: import("../element/binding").SuggestedBinding[];
+            frameToHighlight: import("../element/types").NonDeleted<import("../element/types").ExcalidrawFrameElement> | null;
+            frameRendering: {
+                enabled: boolean;
+                name: boolean;
+                outline: boolean;
+                clip: boolean;
+            };
+            editingFrame: string | null;
+            elementsToHighlight: import("../element/types").NonDeleted<ExcalidrawElement>[] | null;
+            editingElement: import("../element/types").NonDeletedExcalidrawElement | null;
+            editingLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
+            activeTool: {
+                lastActiveTool: import("../types").ActiveTool | null;
+                locked: boolean;
+            } & import("../types").ActiveTool;
+            penMode: boolean;
+            penDetected: boolean;
+            exportBackground: boolean;
+            exportEmbedScene: boolean;
+            exportWithDarkMode: boolean;
+            exportScale: number;
+            currentItemStrokeColor: string;
+            currentItemBackgroundColor: string;
+            currentItemFillStyle: import("../element/types").FillStyle;
+            currentItemStrokeWidth: number;
+            currentItemStrokeStyle: import("../element/types").StrokeStyle;
+            currentItemRoughness: number;
+            currentItemOpacity: number;
+            currentItemFontFamily: number;
+            currentItemFontSize: number;
+            currentItemTextAlign: string;
+            currentItemStartArrowhead: import("../element/types").Arrowhead | null;
+            currentItemEndArrowhead: import("../element/types").Arrowhead | null;
+            currentItemRoundness: import("../element/types").StrokeRoundness;
+            viewBackgroundColor: string;
+            cursorButton: "up" | "down";
+            scrolledOutside: boolean;
+            name: string;
+            isResizing: boolean;
+            isRotating: boolean;
+            openMenu: "canvas" | "shape" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
+            openSidebar: {
+                name: string;
+                tab?: string | undefined;
+            } | null;
+            openDialog: "imageExport" | "help" | "jsonExport" | null;
+            defaultSidebarDockedPreference: boolean;
+            lastPointerDownWith: import("../element/types").PointerType;
+            selectedElementIds: Readonly<{
+                [id: string]: true;
+            }>;
+            previousSelectedElementIds: {
+                [id: string]: true;
+            };
+            selectedElementsAreBeingDragged: boolean;
+            shouldCacheIgnoreZoom: boolean;
+            toast: {
+                message: string;
+                closable?: boolean | undefined;
+                duration?: number | undefined;
+            } | null;
+            zenModeEnabled: boolean;
+            theme: import("../element/types").Theme;
+            gridSize: number | null;
+            viewModeEnabled: boolean;
+            selectedGroupIds: {
+                [groupId: string]: boolean;
+            };
+            editingGroupId: string | null;
+            width: number;
+            height: number;
+            offsetTop: number;
+            offsetLeft: number;
+            fileHandle: import("browser-fs-access").FileSystemHandle | null;
+            collaborators: Map<string, import("../types").Collaborator>;
+            showStats: boolean;
+            currentChartType: import("../element/types").ChartType;
+            pasteDialog: {
+                shown: false;
+                data: null;
+            } | {
+                shown: true;
+                data: import("../charts").Spreadsheet;
+            };
+            pendingImageElementId: string | null;
+            showHyperlinkPopup: false | "editor" | "info";
+            selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
+            snapLines: readonly import("../snapping").SnapLine[];
+            originSnapOffset: {
+                x: number;
+                y: number;
+            } | null;
+            objectsSnapModeEnabled: boolean;
+        };
+        commitToHistory: boolean;
+    };
+    keyTest: (event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean;
+} & {
+    keyTest?: ((event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean) | undefined;
+};
+export declare const actionZoomToFitSelection: {
+    name: "zoomToFitSelection";
+    trackEvent: {
+        category: "canvas";
+    };
+    perform: (elements: readonly ExcalidrawElement[], appState: Readonly<AppState>, _: any, app: import("../types").AppClassProperties) => {
+        appState: {
             scrollX: number;
             scrollY: number;
+            zoom: {
+                value: NormalizedZoomValue;
+            };
             contextMenu: {
                 items: import("../components/ContextMenu").ContextMenuItems;
                 top: number;
@@ -618,6 +826,10 @@ export declare const actionZoomToSelected: {
             showWelcomeScreen: boolean;
             isLoading: boolean;
             errorMessage: import("react").ReactNode;
+            activeEmbeddable: {
+                element: import("../element/types").NonDeletedExcalidrawElement;
+                state: "active" | "hover";
+            } | null;
             draggingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             resizingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             multiElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawLinearElement> | null;
@@ -625,18 +837,21 @@ export declare const actionZoomToSelected: {
             isBindingEnabled: boolean;
             startBoundElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawBindableElement> | null;
             suggestedBindings: import("../element/binding").SuggestedBinding[];
+            frameToHighlight: import("../element/types").NonDeleted<import("../element/types").ExcalidrawFrameElement> | null;
+            frameRendering: {
+                enabled: boolean;
+                name: boolean;
+                outline: boolean;
+                clip: boolean;
+            };
+            editingFrame: string | null;
+            elementsToHighlight: import("../element/types").NonDeleted<ExcalidrawElement>[] | null;
             editingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             editingLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
             activeTool: {
-                lastActiveTool: import("../types").LastActiveTool;
+                lastActiveTool: import("../types").ActiveTool | null;
                 locked: boolean;
-            } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
-                customType: null;
-            } | {
-                type: "custom";
-                customType: string;
-            });
+            } & import("../types").ActiveTool;
             penMode: boolean;
             penDetected: boolean;
             exportBackground: boolean;
@@ -671,12 +886,13 @@ export declare const actionZoomToSelected: {
             openDialog: "imageExport" | "help" | "jsonExport" | null;
             defaultSidebarDockedPreference: boolean;
             lastPointerDownWith: import("../element/types").PointerType;
-            selectedElementIds: {
-                [id: string]: boolean;
-            };
+            selectedElementIds: Readonly<{
+                [id: string]: true;
+            }>;
             previousSelectedElementIds: {
-                [id: string]: boolean;
+                [id: string]: true;
             };
+            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
             toast: {
                 message: string;
@@ -684,7 +900,7 @@ export declare const actionZoomToSelected: {
                 duration?: number | undefined;
             } | null;
             zenModeEnabled: boolean;
-            theme: string;
+            theme: import("../element/types").Theme;
             gridSize: number | null;
             viewModeEnabled: boolean;
             selectedGroupIds: {
@@ -707,14 +923,20 @@ export declare const actionZoomToSelected: {
                 data: import("../charts").Spreadsheet;
             };
             pendingImageElementId: string | null;
-            showHyperlinkPopup: false | "info" | "editor";
+            showHyperlinkPopup: false | "editor" | "info";
             selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
+            snapLines: readonly import("../snapping").SnapLine[];
+            originSnapOffset: {
+                x: number;
+                y: number;
+            } | null;
+            objectsSnapModeEnabled: boolean;
         };
         commitToHistory: boolean;
     };
-    keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
+    keyTest: (event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean;
 } & {
-    keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
+    keyTest?: ((event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean) | undefined;
 };
 export declare const actionZoomToFit: {
     name: "zoomToFit";
@@ -724,11 +946,11 @@ export declare const actionZoomToFit: {
     };
     perform: (elements: readonly ExcalidrawElement[], appState: Readonly<AppState>) => {
         appState: {
+            scrollX: number;
+            scrollY: number;
             zoom: {
                 value: NormalizedZoomValue;
             };
-            scrollX: number;
-            scrollY: number;
             contextMenu: {
                 items: import("../components/ContextMenu").ContextMenuItems;
                 top: number;
@@ -737,6 +959,10 @@ export declare const actionZoomToFit: {
             showWelcomeScreen: boolean;
             isLoading: boolean;
             errorMessage: import("react").ReactNode;
+            activeEmbeddable: {
+                element: import("../element/types").NonDeletedExcalidrawElement;
+                state: "active" | "hover";
+            } | null;
             draggingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             resizingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             multiElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawLinearElement> | null;
@@ -744,18 +970,21 @@ export declare const actionZoomToFit: {
             isBindingEnabled: boolean;
             startBoundElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawBindableElement> | null;
             suggestedBindings: import("../element/binding").SuggestedBinding[];
+            frameToHighlight: import("../element/types").NonDeleted<import("../element/types").ExcalidrawFrameElement> | null;
+            frameRendering: {
+                enabled: boolean;
+                name: boolean;
+                outline: boolean;
+                clip: boolean;
+            };
+            editingFrame: string | null;
+            elementsToHighlight: import("../element/types").NonDeleted<ExcalidrawElement>[] | null;
             editingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             editingLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
             activeTool: {
-                lastActiveTool: import("../types").LastActiveTool;
+                lastActiveTool: import("../types").ActiveTool | null;
                 locked: boolean;
-            } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
-                customType: null;
-            } | {
-                type: "custom";
-                customType: string;
-            });
+            } & import("../types").ActiveTool;
             penMode: boolean;
             penDetected: boolean;
             exportBackground: boolean;
@@ -790,12 +1019,13 @@ export declare const actionZoomToFit: {
             openDialog: "imageExport" | "help" | "jsonExport" | null;
             defaultSidebarDockedPreference: boolean;
             lastPointerDownWith: import("../element/types").PointerType;
-            selectedElementIds: {
-                [id: string]: boolean;
-            };
+            selectedElementIds: Readonly<{
+                [id: string]: true;
+            }>;
             previousSelectedElementIds: {
-                [id: string]: boolean;
+                [id: string]: true;
             };
+            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
             toast: {
                 message: string;
@@ -803,7 +1033,7 @@ export declare const actionZoomToFit: {
                 duration?: number | undefined;
             } | null;
             zenModeEnabled: boolean;
-            theme: string;
+            theme: import("../element/types").Theme;
             gridSize: number | null;
             viewModeEnabled: boolean;
             selectedGroupIds: {
@@ -826,14 +1056,20 @@ export declare const actionZoomToFit: {
                 data: import("../charts").Spreadsheet;
             };
             pendingImageElementId: string | null;
-            showHyperlinkPopup: false | "info" | "editor";
+            showHyperlinkPopup: false | "editor" | "info";
             selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
+            snapLines: readonly import("../snapping").SnapLine[];
+            originSnapOffset: {
+                x: number;
+                y: number;
+            } | null;
+            objectsSnapModeEnabled: boolean;
         };
         commitToHistory: boolean;
     };
-    keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
+    keyTest: (event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean;
 } & {
-    keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
+    keyTest?: ((event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean) | undefined;
 };
 export declare const actionToggleTheme: {
     name: "toggleTheme";
@@ -852,6 +1088,10 @@ export declare const actionToggleTheme: {
             showWelcomeScreen: boolean;
             isLoading: boolean;
             errorMessage: import("react").ReactNode;
+            activeEmbeddable: {
+                element: import("../element/types").NonDeletedExcalidrawElement;
+                state: "active" | "hover";
+            } | null;
             draggingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             resizingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             multiElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawLinearElement> | null;
@@ -859,18 +1099,21 @@ export declare const actionToggleTheme: {
             isBindingEnabled: boolean;
             startBoundElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawBindableElement> | null;
             suggestedBindings: import("../element/binding").SuggestedBinding[];
+            frameToHighlight: import("../element/types").NonDeleted<import("../element/types").ExcalidrawFrameElement> | null;
+            frameRendering: {
+                enabled: boolean;
+                name: boolean;
+                outline: boolean;
+                clip: boolean;
+            };
+            editingFrame: string | null;
+            elementsToHighlight: import("../element/types").NonDeleted<ExcalidrawElement>[] | null;
             editingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             editingLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
             activeTool: {
-                lastActiveTool: import("../types").LastActiveTool;
+                lastActiveTool: import("../types").ActiveTool | null;
                 locked: boolean;
-            } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
-                customType: null;
-            } | {
-                type: "custom";
-                customType: string;
-            });
+            } & import("../types").ActiveTool;
             penMode: boolean;
             penDetected: boolean;
             exportBackground: boolean;
@@ -910,12 +1153,13 @@ export declare const actionToggleTheme: {
             openDialog: "imageExport" | "help" | "jsonExport" | null;
             defaultSidebarDockedPreference: boolean;
             lastPointerDownWith: import("../element/types").PointerType;
-            selectedElementIds: {
-                [id: string]: boolean;
-            };
+            selectedElementIds: Readonly<{
+                [id: string]: true;
+            }>;
             previousSelectedElementIds: {
-                [id: string]: boolean;
+                [id: string]: true;
             };
+            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
             toast: {
                 message: string;
@@ -945,15 +1189,21 @@ export declare const actionToggleTheme: {
                 data: import("../charts").Spreadsheet;
             };
             pendingImageElementId: string | null;
-            showHyperlinkPopup: false | "info" | "editor";
+            showHyperlinkPopup: false | "editor" | "info";
             selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
+            snapLines: readonly import("../snapping").SnapLine[];
+            originSnapOffset: {
+                x: number;
+                y: number;
+            } | null;
+            objectsSnapModeEnabled: boolean;
         };
         commitToHistory: false;
     };
-    keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
+    keyTest: (event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean;
     predicate: (elements: readonly ExcalidrawElement[], appState: AppState, props: import("../types").ExcalidrawProps, app: import("../types").AppClassProperties) => boolean;
 } & {
-    keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
+    keyTest?: ((event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean) | undefined;
 };
 export declare const actionToggleEraserTool: {
     name: "toggleEraserTool";
@@ -964,16 +1214,11 @@ export declare const actionToggleEraserTool: {
         appState: {
             selectedElementIds: {};
             selectedGroupIds: {};
+            activeEmbeddable: null;
             activeTool: {
-                lastActiveTool: import("../types").LastActiveTool;
+                lastActiveTool: import("../types").ActiveTool | null;
                 locked: boolean;
-            } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
-                customType: null;
-            } | {
-                type: "custom";
-                customType: string;
-            });
+            } & import("../types").ActiveTool;
             contextMenu: {
                 items: import("../components/ContextMenu").ContextMenuItems;
                 top: number;
@@ -989,6 +1234,15 @@ export declare const actionToggleEraserTool: {
             isBindingEnabled: boolean;
             startBoundElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawBindableElement> | null;
             suggestedBindings: import("../element/binding").SuggestedBinding[];
+            frameToHighlight: import("../element/types").NonDeleted<import("../element/types").ExcalidrawFrameElement> | null;
+            frameRendering: {
+                enabled: boolean;
+                name: boolean;
+                outline: boolean;
+                clip: boolean;
+            };
+            editingFrame: string | null;
+            elementsToHighlight: import("../element/types").NonDeleted<ExcalidrawElement>[] | null;
             editingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             editingLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
             penMode: boolean;
@@ -1031,8 +1285,9 @@ export declare const actionToggleEraserTool: {
             defaultSidebarDockedPreference: boolean;
             lastPointerDownWith: import("../element/types").PointerType;
             previousSelectedElementIds: {
-                [id: string]: boolean;
+                [id: string]: true;
             };
+            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
             toast: {
                 message: string;
@@ -1040,7 +1295,7 @@ export declare const actionToggleEraserTool: {
                 duration?: number | undefined;
             } | null;
             zenModeEnabled: boolean;
-            theme: string;
+            theme: import("../element/types").Theme;
             gridSize: number | null;
             viewModeEnabled: boolean;
             editingGroupId: string | null;
@@ -1060,14 +1315,20 @@ export declare const actionToggleEraserTool: {
                 data: import("../charts").Spreadsheet;
             };
             pendingImageElementId: string | null;
-            showHyperlinkPopup: false | "info" | "editor";
+            showHyperlinkPopup: false | "editor" | "info";
             selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
+            snapLines: readonly import("../snapping").SnapLine[];
+            originSnapOffset: {
+                x: number;
+                y: number;
+            } | null;
+            objectsSnapModeEnabled: boolean;
         };
         commitToHistory: true;
     };
-    keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
+    keyTest: (event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean;
 } & {
-    keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
+    keyTest?: ((event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean) | undefined;
 };
 export declare const actionToggleHandTool: {
     name: "toggleHandTool";
@@ -1078,16 +1339,11 @@ export declare const actionToggleHandTool: {
         appState: {
             selectedElementIds: {};
             selectedGroupIds: {};
+            activeEmbeddable: null;
             activeTool: {
-                lastActiveTool: import("../types").LastActiveTool;
+                lastActiveTool: import("../types").ActiveTool | null;
                 locked: boolean;
-            } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
-                customType: null;
-            } | {
-                type: "custom";
-                customType: string;
-            });
+            } & import("../types").ActiveTool;
             contextMenu: {
                 items: import("../components/ContextMenu").ContextMenuItems;
                 top: number;
@@ -1103,6 +1359,15 @@ export declare const actionToggleHandTool: {
             isBindingEnabled: boolean;
             startBoundElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawBindableElement> | null;
             suggestedBindings: import("../element/binding").SuggestedBinding[];
+            frameToHighlight: import("../element/types").NonDeleted<import("../element/types").ExcalidrawFrameElement> | null;
+            frameRendering: {
+                enabled: boolean;
+                name: boolean;
+                outline: boolean;
+                clip: boolean;
+            };
+            editingFrame: string | null;
+            elementsToHighlight: import("../element/types").NonDeleted<ExcalidrawElement>[] | null;
             editingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             editingLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
             penMode: boolean;
@@ -1145,8 +1410,9 @@ export declare const actionToggleHandTool: {
             defaultSidebarDockedPreference: boolean;
             lastPointerDownWith: import("../element/types").PointerType;
             previousSelectedElementIds: {
-                [id: string]: boolean;
+                [id: string]: true;
             };
+            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
             toast: {
                 message: string;
@@ -1154,7 +1420,7 @@ export declare const actionToggleHandTool: {
                 duration?: number | undefined;
             } | null;
             zenModeEnabled: boolean;
-            theme: string;
+            theme: import("../element/types").Theme;
             gridSize: number | null;
             viewModeEnabled: boolean;
             editingGroupId: string | null;
@@ -1174,12 +1440,18 @@ export declare const actionToggleHandTool: {
                 data: import("../charts").Spreadsheet;
             };
             pendingImageElementId: string | null;
-            showHyperlinkPopup: false | "info" | "editor";
+            showHyperlinkPopup: false | "editor" | "info";
             selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
+            snapLines: readonly import("../snapping").SnapLine[];
+            originSnapOffset: {
+                x: number;
+                y: number;
+            } | null;
+            objectsSnapModeEnabled: boolean;
         };
         commitToHistory: true;
     };
-    keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
+    keyTest: (event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean;
 } & {
-    keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
+    keyTest?: ((event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean) | undefined;
 };