npm - @excalidraw/excalidraw - Versions diffs - 0.15.2-fc9a9a2 → 0.15.3 - Mend

@excalidraw/excalidraw 0.15.2-fc9a9a2 → 0.15.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (493) hide show

package/types/actions/actionCanvas.d.ts CHANGED Viewed

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { ExcalidrawElement } from "../element/types";
 import { AppState, NormalizedZoomValue } from "../types";
 export declare const actionChangeViewBackgroundColor: {
@@ -8,7 +9,7 @@ export declare const actionChangeViewBackgroundColor: {
         appState: any;
         commitToHistory: boolean;
     };
-    PanelComponent: ({ elements, appState, updateData, appProps }: import("./types").PanelComponentProps) => JSX.Element;
+    PanelComponent: ({ elements, appState, updateData }: import("./types").PanelComponentProps) => JSX.Element;
 } & {
     keyTest?: undefined;
 };
@@ -22,7 +23,7 @@ export declare const actionClearCanvas: {
         elements: ExcalidrawElement[];
         appState: {
             files: {};
-            theme: import("../element/types").Theme;
+            theme: string;
             penMode: boolean;
             penDetected: boolean;
             exportBackground: boolean;
@@ -40,19 +41,13 @@ export declare const actionClearCanvas: {
                 lastActiveTool: import("../types").LastActiveTool;
                 locked: boolean;
             } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand";
+                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
                 customType: null;
             } | {
                 type: "custom";
                 customType: string;
             });
             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;
@@ -61,10 +56,6 @@ 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;
@@ -72,15 +63,6 @@ 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;
@@ -109,22 +91,23 @@ export declare const actionClearCanvas: {
                 value: NormalizedZoomValue;
             }>;
             openMenu: "canvas" | "shape" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
-            openSidebar: {
-                name: string;
-                tab?: string | undefined;
-            } | null;
+            openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
+            openSidebar: "library" | "customSidebar" | null;
             openDialog: "imageExport" | "help" | "jsonExport" | null;
-            defaultSidebarDockedPreference: boolean;
+            isSidebarDocked: boolean;
             lastPointerDownWith: import("../element/types").PointerType;
-            selectedElementIds: Readonly<{
-                [id: string]: true;
-            }>;
+            selectedElementIds: {
+                [id: string]: boolean;
+            };
             previousSelectedElementIds: {
-                [id: string]: true;
+                [id: string]: boolean;
             };
-            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
+            toast: {
+                message: string;
+                closable?: boolean | undefined;
+                duration?: number | undefined;
+            } | null;
             zenModeEnabled: boolean;
             viewModeEnabled: boolean;
             selectedGroupIds: {
@@ -132,9 +115,10 @@ 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 | "editor" | "info";
+            showHyperlinkPopup: false | "info" | "editor";
             selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
         };
         commitToHistory: true;
@@ -163,10 +147,6 @@ 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;
@@ -174,22 +154,13 @@ 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;
                 locked: boolean;
             } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand";
+                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
                 customType: null;
             } | {
                 type: "custom";
@@ -221,21 +192,17 @@ export declare const actionZoomIn: {
             isResizing: boolean;
             isRotating: boolean;
             openMenu: "canvas" | "shape" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
-            openSidebar: {
-                name: string;
-                tab?: string | undefined;
-            } | null;
+            openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
+            openSidebar: "library" | "customSidebar" | null;
             openDialog: "imageExport" | "help" | "jsonExport" | null;
-            defaultSidebarDockedPreference: boolean;
+            isSidebarDocked: boolean;
             lastPointerDownWith: import("../element/types").PointerType;
-            selectedElementIds: Readonly<{
-                [id: string]: true;
-            }>;
+            selectedElementIds: {
+                [id: string]: boolean;
+            };
             previousSelectedElementIds: {
-                [id: string]: true;
+                [id: string]: boolean;
             };
-            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
             toast: {
                 message: string;
@@ -243,7 +210,7 @@ export declare const actionZoomIn: {
                 duration?: number | undefined;
             } | null;
             zenModeEnabled: boolean;
-            theme: import("../element/types").Theme;
+            theme: string;
             gridSize: number | null;
             viewModeEnabled: boolean;
             selectedGroupIds: {
@@ -266,7 +233,7 @@ export declare const actionZoomIn: {
                 data: import("../charts").Spreadsheet;
             };
             pendingImageElementId: string | null;
-            showHyperlinkPopup: false | "editor" | "info";
+            showHyperlinkPopup: false | "info" | "editor";
             selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
         };
         commitToHistory: false;
@@ -297,10 +264,6 @@ 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;
@@ -308,22 +271,13 @@ 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;
                 locked: boolean;
             } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand";
+                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
                 customType: null;
             } | {
                 type: "custom";
@@ -355,21 +309,17 @@ export declare const actionZoomOut: {
             isResizing: boolean;
             isRotating: boolean;
             openMenu: "canvas" | "shape" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
-            openSidebar: {
-                name: string;
-                tab?: string | undefined;
-            } | null;
+            openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
+            openSidebar: "library" | "customSidebar" | null;
             openDialog: "imageExport" | "help" | "jsonExport" | null;
-            defaultSidebarDockedPreference: boolean;
+            isSidebarDocked: boolean;
             lastPointerDownWith: import("../element/types").PointerType;
-            selectedElementIds: Readonly<{
-                [id: string]: true;
-            }>;
+            selectedElementIds: {
+                [id: string]: boolean;
+            };
             previousSelectedElementIds: {
-                [id: string]: true;
+                [id: string]: boolean;
             };
-            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
             toast: {
                 message: string;
@@ -377,7 +327,7 @@ export declare const actionZoomOut: {
                 duration?: number | undefined;
             } | null;
             zenModeEnabled: boolean;
-            theme: import("../element/types").Theme;
+            theme: string;
             gridSize: number | null;
             viewModeEnabled: boolean;
             selectedGroupIds: {
@@ -400,7 +350,7 @@ export declare const actionZoomOut: {
                 data: import("../charts").Spreadsheet;
             };
             pendingImageElementId: string | null;
-            showHyperlinkPopup: false | "editor" | "info";
+            showHyperlinkPopup: false | "info" | "editor";
             selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
         };
         commitToHistory: false;
@@ -431,10 +381,6 @@ 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;
@@ -442,22 +388,13 @@ 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;
                 locked: boolean;
             } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand";
+                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
                 customType: null;
             } | {
                 type: "custom";
@@ -489,21 +426,17 @@ export declare const actionResetZoom: {
             isResizing: boolean;
             isRotating: boolean;
             openMenu: "canvas" | "shape" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
-            openSidebar: {
-                name: string;
-                tab?: string | undefined;
-            } | null;
+            openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
+            openSidebar: "library" | "customSidebar" | null;
             openDialog: "imageExport" | "help" | "jsonExport" | null;
-            defaultSidebarDockedPreference: boolean;
+            isSidebarDocked: boolean;
             lastPointerDownWith: import("../element/types").PointerType;
-            selectedElementIds: Readonly<{
-                [id: string]: true;
-            }>;
+            selectedElementIds: {
+                [id: string]: boolean;
+            };
             previousSelectedElementIds: {
-                [id: string]: true;
+                [id: string]: boolean;
             };
-            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
             toast: {
                 message: string;
@@ -511,7 +444,7 @@ export declare const actionResetZoom: {
                 duration?: number | undefined;
             } | null;
             zenModeEnabled: boolean;
-            theme: import("../element/types").Theme;
+            theme: string;
             gridSize: number | null;
             viewModeEnabled: boolean;
             selectedGroupIds: {
@@ -534,7 +467,7 @@ export declare const actionResetZoom: {
                 data: import("../charts").Spreadsheet;
             };
             pendingImageElementId: string | null;
-            showHyperlinkPopup: false | "editor" | "info";
+            showHyperlinkPopup: false | "info" | "editor";
             selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
         };
         commitToHistory: false;
@@ -544,20 +477,13 @@ export declare const actionResetZoom: {
 } & {
     keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
 };
-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;
-}) => {
+export declare const zoomToFitElements: (elements: readonly ExcalidrawElement[], appState: Readonly<AppState>, zoomToSelection: boolean) => {
     appState: {
-        scrollX: number;
-        scrollY: number;
         zoom: {
             value: NormalizedZoomValue;
         };
+        scrollX: number;
+        scrollY: number;
         contextMenu: {
             items: import("../components/ContextMenu").ContextMenuItems;
             top: number;
@@ -566,10 +492,6 @@ export declare const zoomToFit: ({ targetElements, appState, fitToViewport, view
         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;
@@ -577,22 +499,13 @@ export declare const zoomToFit: ({ targetElements, appState, fitToViewport, view
         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;
             locked: boolean;
         } & ({
-            type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand";
+            type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
             customType: null;
         } | {
             type: "custom";
@@ -624,21 +537,17 @@ export declare const zoomToFit: ({ targetElements, appState, fitToViewport, view
         isResizing: boolean;
         isRotating: boolean;
         openMenu: "canvas" | "shape" | null;
-        openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
-        openSidebar: {
-            name: string;
-            tab?: string | undefined;
-        } | null;
+        openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
+        openSidebar: "library" | "customSidebar" | null;
         openDialog: "imageExport" | "help" | "jsonExport" | null;
-        defaultSidebarDockedPreference: boolean;
+        isSidebarDocked: boolean;
         lastPointerDownWith: import("../element/types").PointerType;
-        selectedElementIds: Readonly<{
-            [id: string]: true;
-        }>;
+        selectedElementIds: {
+            [id: string]: boolean;
+        };
         previousSelectedElementIds: {
-            [id: string]: true;
+            [id: string]: boolean;
         };
-        selectedElementsAreBeingDragged: boolean;
         shouldCacheIgnoreZoom: boolean;
         toast: {
             message: string;
@@ -646,7 +555,7 @@ export declare const zoomToFit: ({ targetElements, appState, fitToViewport, view
             duration?: number | undefined;
         } | null;
         zenModeEnabled: boolean;
-        theme: import("../element/types").Theme;
+        theme: string;
         gridSize: number | null;
         viewModeEnabled: boolean;
         selectedGroupIds: {
@@ -669,155 +578,23 @@ export declare const zoomToFit: ({ targetElements, appState, fitToViewport, view
             data: import("../charts").Spreadsheet;
         };
         pendingImageElementId: string | null;
-        showHyperlinkPopup: false | "editor" | "info";
+        showHyperlinkPopup: false | "info" | "editor";
         selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
     };
     commitToHistory: boolean;
 };
-export declare const actionZoomToFitSelectionInViewport: {
-    name: "zoomToFitSelectionInViewport";
+export declare const actionZoomToSelected: {
+    name: "zoomToSelection";
     trackEvent: {
         category: "canvas";
     };
-    perform: (elements: readonly ExcalidrawElement[], appState: Readonly<AppState>, _: any, app: import("../types").AppClassProperties) => {
+    perform: (elements: readonly ExcalidrawElement[], appState: Readonly<AppState>) => {
         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").LastActiveTool;
-                locked: boolean;
-            } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand";
-                customType: null;
-            } | {
-                type: "custom";
-                customType: string;
-            });
-            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;
-        };
-        commitToHistory: boolean;
-    };
-    keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
-} & {
-    keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => 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;
@@ -826,10 +603,6 @@ export declare const actionZoomToFitSelection: {
             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;
@@ -837,22 +610,13 @@ export declare const actionZoomToFitSelection: {
             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;
                 locked: boolean;
             } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand";
+                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
                 customType: null;
             } | {
                 type: "custom";
@@ -884,21 +648,17 @@ export declare const actionZoomToFitSelection: {
             isResizing: boolean;
             isRotating: boolean;
             openMenu: "canvas" | "shape" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
-            openSidebar: {
-                name: string;
-                tab?: string | undefined;
-            } | null;
+            openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
+            openSidebar: "library" | "customSidebar" | null;
             openDialog: "imageExport" | "help" | "jsonExport" | null;
-            defaultSidebarDockedPreference: boolean;
+            isSidebarDocked: boolean;
             lastPointerDownWith: import("../element/types").PointerType;
-            selectedElementIds: Readonly<{
-                [id: string]: true;
-            }>;
+            selectedElementIds: {
+                [id: string]: boolean;
+            };
             previousSelectedElementIds: {
-                [id: string]: true;
+                [id: string]: boolean;
             };
-            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
             toast: {
                 message: string;
@@ -906,7 +666,7 @@ export declare const actionZoomToFitSelection: {
                 duration?: number | undefined;
             } | null;
             zenModeEnabled: boolean;
-            theme: import("../element/types").Theme;
+            theme: string;
             gridSize: number | null;
             viewModeEnabled: boolean;
             selectedGroupIds: {
@@ -929,7 +689,7 @@ export declare const actionZoomToFitSelection: {
                 data: import("../charts").Spreadsheet;
             };
             pendingImageElementId: string | null;
-            showHyperlinkPopup: false | "editor" | "info";
+            showHyperlinkPopup: false | "info" | "editor";
             selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
         };
         commitToHistory: boolean;
@@ -946,11 +706,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;
@@ -959,10 +719,6 @@ 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;
@@ -970,22 +726,13 @@ 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;
                 locked: boolean;
             } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand";
+                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
                 customType: null;
             } | {
                 type: "custom";
@@ -1017,21 +764,17 @@ export declare const actionZoomToFit: {
             isResizing: boolean;
             isRotating: boolean;
             openMenu: "canvas" | "shape" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
-            openSidebar: {
-                name: string;
-                tab?: string | undefined;
-            } | null;
+            openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
+            openSidebar: "library" | "customSidebar" | null;
             openDialog: "imageExport" | "help" | "jsonExport" | null;
-            defaultSidebarDockedPreference: boolean;
+            isSidebarDocked: boolean;
             lastPointerDownWith: import("../element/types").PointerType;
-            selectedElementIds: Readonly<{
-                [id: string]: true;
-            }>;
+            selectedElementIds: {
+                [id: string]: boolean;
+            };
             previousSelectedElementIds: {
-                [id: string]: true;
+                [id: string]: boolean;
             };
-            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
             toast: {
                 message: string;
@@ -1039,7 +782,7 @@ export declare const actionZoomToFit: {
                 duration?: number | undefined;
             } | null;
             zenModeEnabled: boolean;
-            theme: import("../element/types").Theme;
+            theme: string;
             gridSize: number | null;
             viewModeEnabled: boolean;
             selectedGroupIds: {
@@ -1062,7 +805,7 @@ export declare const actionZoomToFit: {
                 data: import("../charts").Spreadsheet;
             };
             pendingImageElementId: string | null;
-            showHyperlinkPopup: false | "editor" | "info";
+            showHyperlinkPopup: false | "info" | "editor";
             selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
         };
         commitToHistory: boolean;
@@ -1088,10 +831,6 @@ 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;
@@ -1099,22 +838,13 @@ 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;
                 locked: boolean;
             } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand";
+                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
                 customType: null;
             } | {
                 type: "custom";
@@ -1151,21 +881,17 @@ export declare const actionToggleTheme: {
                 value: NormalizedZoomValue;
             }>;
             openMenu: "canvas" | "shape" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
-            openSidebar: {
-                name: string;
-                tab?: string | undefined;
-            } | null;
+            openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
+            openSidebar: "library" | "customSidebar" | null;
             openDialog: "imageExport" | "help" | "jsonExport" | null;
-            defaultSidebarDockedPreference: boolean;
+            isSidebarDocked: boolean;
             lastPointerDownWith: import("../element/types").PointerType;
-            selectedElementIds: Readonly<{
-                [id: string]: true;
-            }>;
+            selectedElementIds: {
+                [id: string]: boolean;
+            };
             previousSelectedElementIds: {
-                [id: string]: true;
+                [id: string]: boolean;
             };
-            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
             toast: {
                 message: string;
@@ -1195,7 +921,7 @@ export declare const actionToggleTheme: {
                 data: import("../charts").Spreadsheet;
             };
             pendingImageElementId: string | null;
-            showHyperlinkPopup: false | "editor" | "info";
+            showHyperlinkPopup: false | "info" | "editor";
             selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
         };
         commitToHistory: false;
@@ -1214,12 +940,11 @@ export declare const actionToggleEraserTool: {
         appState: {
             selectedElementIds: {};
             selectedGroupIds: {};
-            activeEmbeddable: null;
             activeTool: {
                 lastActiveTool: import("../types").LastActiveTool;
                 locked: boolean;
             } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand";
+                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
                 customType: null;
             } | {
                 type: "custom";
@@ -1240,15 +965,6 @@ 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;
@@ -1282,18 +998,14 @@ export declare const actionToggleEraserTool: {
                 value: NormalizedZoomValue;
             }>;
             openMenu: "canvas" | "shape" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
-            openSidebar: {
-                name: string;
-                tab?: string | undefined;
-            } | null;
+            openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
+            openSidebar: "library" | "customSidebar" | null;
             openDialog: "imageExport" | "help" | "jsonExport" | null;
-            defaultSidebarDockedPreference: boolean;
+            isSidebarDocked: boolean;
             lastPointerDownWith: import("../element/types").PointerType;
             previousSelectedElementIds: {
-                [id: string]: true;
+                [id: string]: boolean;
             };
-            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
             toast: {
                 message: string;
@@ -1301,7 +1013,7 @@ export declare const actionToggleEraserTool: {
                 duration?: number | undefined;
             } | null;
             zenModeEnabled: boolean;
-            theme: import("../element/types").Theme;
+            theme: string;
             gridSize: number | null;
             viewModeEnabled: boolean;
             editingGroupId: string | null;
@@ -1321,7 +1033,7 @@ export declare const actionToggleEraserTool: {
                 data: import("../charts").Spreadsheet;
             };
             pendingImageElementId: string | null;
-            showHyperlinkPopup: false | "editor" | "info";
+            showHyperlinkPopup: false | "info" | "editor";
             selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
         };
         commitToHistory: true;
@@ -1339,12 +1051,11 @@ export declare const actionToggleHandTool: {
         appState: {
             selectedElementIds: {};
             selectedGroupIds: {};
-            activeEmbeddable: null;
             activeTool: {
                 lastActiveTool: import("../types").LastActiveTool;
                 locked: boolean;
             } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand";
+                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
                 customType: null;
             } | {
                 type: "custom";
@@ -1365,15 +1076,6 @@ 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;
@@ -1407,18 +1109,14 @@ export declare const actionToggleHandTool: {
                 value: NormalizedZoomValue;
             }>;
             openMenu: "canvas" | "shape" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
-            openSidebar: {
-                name: string;
-                tab?: string | undefined;
-            } | null;
+            openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
+            openSidebar: "library" | "customSidebar" | null;
             openDialog: "imageExport" | "help" | "jsonExport" | null;
-            defaultSidebarDockedPreference: boolean;
+            isSidebarDocked: boolean;
             lastPointerDownWith: import("../element/types").PointerType;
             previousSelectedElementIds: {
-                [id: string]: true;
+                [id: string]: boolean;
             };
-            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
             toast: {
                 message: string;
@@ -1426,7 +1124,7 @@ export declare const actionToggleHandTool: {
                 duration?: number | undefined;
             } | null;
             zenModeEnabled: boolean;
-            theme: import("../element/types").Theme;
+            theme: string;
             gridSize: number | null;
             viewModeEnabled: boolean;
             editingGroupId: string | null;
@@ -1446,7 +1144,7 @@ export declare const actionToggleHandTool: {
                 data: import("../charts").Spreadsheet;
             };
             pendingImageElementId: string | null;
-            showHyperlinkPopup: false | "editor" | "info";
+            showHyperlinkPopup: false | "info" | "editor";
             selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
         };
         commitToHistory: true;