@excalidraw/excalidraw 0.14.1 → 0.14.2-04a8c22

package/types/actions/actionToggleLock.d.ts

@@ -27,16 +27,15 @@ export declare const actionToggleLock: {
             editingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             editingLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
             activeTool: {
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser";
-                lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
+                lastActiveTool: import("../types").LastActiveTool;
                 locked: boolean;
+            } & ({
+                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
                 customType: null;
             } | {
                 type: "custom";
                 customType: string;
-                lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
-                locked: boolean;
-            };
+            });
             penMode: boolean;
             penDetected: boolean;
             exportBackground: boolean;

package/types/actions/actionToggleStats.d.ts

@@ -26,16 +26,15 @@ export declare const actionToggleStats: {
             editingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             editingLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
             activeTool: {
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser";
-                lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
+                lastActiveTool: import("../types").LastActiveTool;
                 locked: boolean;
+            } & ({
+                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
                 customType: null;
             } | {
                 type: "custom";
                 customType: string;
-                lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
-                locked: boolean;
-            };
+            });
             penMode: boolean;
             penDetected: boolean;
             exportBackground: boolean;

package/types/actions/actionToggleViewMode.d.ts

@@ -27,16 +27,15 @@ export declare const actionToggleViewMode: {
             editingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             editingLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
             activeTool: {
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser";
-                lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
+                lastActiveTool: import("../types").LastActiveTool;
                 locked: boolean;
+            } & ({
+                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
                 customType: null;
             } | {
                 type: "custom";
                 customType: string;
-                lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
-                locked: boolean;
-            };
+            });
             penMode: boolean;
             penDetected: boolean;
             exportBackground: boolean;

package/types/actions/actionToggleZenMode.d.ts

@@ -27,16 +27,15 @@ export declare const actionToggleZenMode: {
             editingElement: import("../element/types").NonDeletedExcalidrawElement | null;
             editingLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
             activeTool: {
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser";
-                lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
+                lastActiveTool: import("../types").LastActiveTool;
                 locked: boolean;
+            } & ({
+                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
                 customType: null;
             } | {
                 type: "custom";
                 customType: string;
-                lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
-                locked: boolean;
-            };
+            });
             penMode: boolean;
             penDetected: boolean;
             exportBackground: boolean;

package/types/actions/shortcuts.d.ts

@@ -1,3 +1,3 @@
 import { ActionName } from "./types";
-export declare type ShortcutName = SubtypeOf<ActionName, "toggleTheme" | "loadScene" | "cut" | "copy" | "paste" | "copyStyles" | "pasteStyles" | "selectAll" | "deleteSelectedElements" | "duplicateSelection" | "sendBackward" | "bringForward" | "sendToBack" | "bringToFront" | "copyAsPng" | "copyAsSvg" | "group" | "ungroup" | "gridMode" | "zenMode" | "stats" | "addToLibrary" | "viewMode" | "flipHorizontal" | "flipVertical" | "hyperlink" | "toggleLock"> | "saveScene" | "imageExport";
+export declare type ShortcutName = SubtypeOf<ActionName, "toggleTheme" | "loadScene" | "clearCanvas" | "cut" | "copy" | "paste" | "copyStyles" | "pasteStyles" | "selectAll" | "deleteSelectedElements" | "duplicateSelection" | "sendBackward" | "bringForward" | "sendToBack" | "bringToFront" | "copyAsPng" | "copyAsSvg" | "group" | "ungroup" | "gridMode" | "zenMode" | "stats" | "addToLibrary" | "viewMode" | "flipHorizontal" | "flipVertical" | "hyperlink" | "toggleLock"> | "saveScene" | "imageExport";
 export declare const getShortcutFromShortcutName: (name: ShortcutName) => string;

package/types/actions/types.d.ts

@@ -14,7 +14,7 @@ export declare type ActionResult = {
 declare type ActionFn = (elements: readonly ExcalidrawElement[], appState: Readonly<AppState>, formData: any, app: AppClassProperties) => ActionResult | Promise<ActionResult>;
 export declare type UpdaterFn = (res: ActionResult) => void;
 export declare type ActionFilterFn = (action: Action) => void;
-export declare type ActionName = "copy" | "cut" | "paste" | "copyAsPng" | "copyAsSvg" | "copyText" | "sendBackward" | "bringForward" | "sendToBack" | "bringToFront" | "copyStyles" | "selectAll" | "pasteStyles" | "gridMode" | "zenMode" | "stats" | "changeStrokeColor" | "changeBackgroundColor" | "changeFillStyle" | "changeStrokeWidth" | "changeStrokeShape" | "changeSloppiness" | "changeStrokeStyle" | "changeArrowhead" | "changeOpacity" | "changeFontSize" | "toggleCanvasMenu" | "toggleEditMenu" | "undo" | "redo" | "finalize" | "changeProjectName" | "changeExportBackground" | "changeExportEmbedScene" | "changeExportScale" | "saveToActiveFile" | "saveFileToDisk" | "loadScene" | "duplicateSelection" | "deleteSelectedElements" | "changeViewBackgroundColor" | "clearCanvas" | "zoomIn" | "zoomOut" | "resetZoom" | "zoomToFit" | "zoomToSelection" | "changeFontFamily" | "changeTextAlign" | "changeVerticalAlign" | "toggleFullScreen" | "toggleShortcuts" | "group" | "ungroup" | "goToCollaborator" | "addToLibrary" | "changeRoundness" | "alignTop" | "alignBottom" | "alignLeft" | "alignRight" | "alignVerticallyCentered" | "alignHorizontallyCentered" | "distributeHorizontally" | "distributeVertically" | "flipHorizontal" | "flipVertical" | "viewMode" | "exportWithDarkMode" | "toggleTheme" | "increaseFontSize" | "decreaseFontSize" | "unbindText" | "hyperlink" | "eraser" | "bindText" | "toggleLock" | "toggleLinearEditor";
+export declare type ActionName = "copy" | "cut" | "paste" | "copyAsPng" | "copyAsSvg" | "copyText" | "sendBackward" | "bringForward" | "sendToBack" | "bringToFront" | "copyStyles" | "selectAll" | "pasteStyles" | "gridMode" | "zenMode" | "stats" | "changeStrokeColor" | "changeBackgroundColor" | "changeFillStyle" | "changeStrokeWidth" | "changeStrokeShape" | "changeSloppiness" | "changeStrokeStyle" | "changeArrowhead" | "changeOpacity" | "changeFontSize" | "toggleCanvasMenu" | "toggleEditMenu" | "undo" | "redo" | "finalize" | "changeProjectName" | "changeExportBackground" | "changeExportEmbedScene" | "changeExportScale" | "saveToActiveFile" | "saveFileToDisk" | "loadScene" | "duplicateSelection" | "deleteSelectedElements" | "changeViewBackgroundColor" | "clearCanvas" | "zoomIn" | "zoomOut" | "resetZoom" | "zoomToFit" | "zoomToSelection" | "changeFontFamily" | "changeTextAlign" | "changeVerticalAlign" | "toggleFullScreen" | "toggleShortcuts" | "group" | "ungroup" | "goToCollaborator" | "addToLibrary" | "changeRoundness" | "alignTop" | "alignBottom" | "alignLeft" | "alignRight" | "alignVerticallyCentered" | "alignHorizontallyCentered" | "distributeHorizontally" | "distributeVertically" | "flipHorizontal" | "flipVertical" | "viewMode" | "exportWithDarkMode" | "toggleTheme" | "increaseFontSize" | "decreaseFontSize" | "unbindText" | "hyperlink" | "bindText" | "toggleLock" | "toggleLinearEditor" | "toggleEraserTool" | "toggleHandTool";
 export declare type PanelComponentProps = {
     elements: readonly ExcalidrawElement[];
     appState: AppState;

package/types/appState.d.ts

@@ -3,17 +3,16 @@ export declare const getDefaultAppState: () => Omit<AppState, "offsetTop" | "off
 export declare const clearAppStateForLocalStorage: (appState: Partial<AppState>) => {
     theme?: string | undefined;
     name?: string | undefined;
-    activeTool?: {
-        type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser";
-        lastActiveToolBeforeEraser: import("./types").LastActiveToolBeforeEraser;
+    activeTool?: ({
+        lastActiveTool: import("./types").LastActiveTool;
         locked: boolean;
+    } & ({
+        type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
         customType: null;
     } | {
         type: "custom";
         customType: string;
-        lastActiveToolBeforeEraser: import("./types").LastActiveToolBeforeEraser;
-        locked: boolean;
-    } | undefined;
+    })) | undefined;
     showWelcomeScreen?: boolean | undefined;
     penMode?: boolean | undefined;
     penDetected?: boolean | undefined;
@@ -74,3 +73,6 @@ export declare const clearAppStateForDatabase: (appState: Partial<AppState>) =>
 export declare const isEraserActive: ({ activeTool, }: {
     activeTool: AppState["activeTool"];
 }) => boolean;
+export declare const isHandToolActive: ({ activeTool, }: {
+    activeTool: AppState["activeTool"];
+}) => boolean;

package/types/{excalidraw-app/index.d.ts → components/ActiveConfirmDialog.d.ts}

@@ -1,5 +1,4 @@
-import "./index.scss";
-export declare const langCodeAtom: import("jotai").Atom<string> & {
+export declare const activeConfirmDialogAtom: import("jotai").Atom<"clearCanvas" | null> & {
     write: (get: {
         <Value>(atom: import("jotai").Atom<Value | Promise<Value>>): Value;
         <Value_1>(atom: import("jotai").Atom<Promise<Value_1>>): Value_1;
@@ -17,10 +16,9 @@ export declare const langCodeAtom: import("jotai").Atom<string> & {
     }, set: {
         <Value_6, Result extends void | Promise<void>>(atom: import("jotai").WritableAtom<Value_6, undefined, Result>): Result;
         <Value_7, Update, Result_1 extends void | Promise<void>>(atom: import("jotai").WritableAtom<Value_7, Update, Result_1>, update: Update): Result_1;
-    }, update: string | ((prev: string) => string)) => void;
-    onMount?: (<S extends (update: string | ((prev: string) => string)) => void>(setAtom: S) => void | (() => void)) | undefined;
+    }, update: "clearCanvas" | ((prev: "clearCanvas" | null) => "clearCanvas" | null) | null) => void;
+    onMount?: (<S extends (update: "clearCanvas" | ((prev: "clearCanvas" | null) => "clearCanvas" | null) | null) => void>(setAtom: S) => void | (() => void)) | undefined;
 } & {
-    init: string;
+    init: "clearCanvas" | null;
 };
-declare const ExcalidrawApp: () => JSX.Element;
-export default ExcalidrawApp;
+export declare const ActiveConfirmDialog: () => JSX.Element | null;

package/types/components/App.d.ts

@@ -92,6 +92,7 @@ declare class App extends React.Component<AppProps, AppState> {
     removePointer: (event: React.PointerEvent<HTMLElement> | PointerEvent) => void;
     toggleLock: (source?: "keyboard" | "ui") => void;
     togglePenMode: () => void;
+    onHandToolToggle: () => void;
     scrollToContent: (target?: ExcalidrawElement | readonly ExcalidrawElement[]) => void;
     setToast: (toast: {
         message: string;

package/types/components/HandButton.d.ts

@@ -0,0 +1,10 @@
+import "./ToolIcon.scss";
+declare type LockIconProps = {
+    title?: string;
+    name?: string;
+    checked: boolean;
+    onChange?(): void;
+    isMobile?: boolean;
+};
+export declare const HandButton: (props: LockIconProps) => JSX.Element;
+export {};

package/types/components/LayerUI.d.ts

@@ -14,11 +14,11 @@ interface LayerUIProps {
     setAppState: React.Component<any, AppState>["setState"];
     elements: readonly NonDeletedExcalidrawElement[];
     onLockToggle: () => void;
+    onHandToolToggle: () => void;
     onPenModeToggle: () => void;
     onInsertElements: (elements: readonly NonDeletedExcalidrawElement[]) => void;
     showExitZenModeBtn: boolean;
     langCode: Language["code"];
-    isCollaborating: boolean;
     renderTopRightUI?: ExcalidrawProps["renderTopRightUI"];
     renderCustomStats?: ExcalidrawProps["renderCustomStats"];
     renderCustomSidebar?: ExcalidrawProps["renderSidebar"];
@@ -33,5 +33,5 @@ interface LayerUIProps {
     renderWelcomeScreen: boolean;
     children?: React.ReactNode;
 }
-declare const _default: React.MemoExoticComponent<({ actionManager, appState, files, setAppState, elements, canvas, onLockToggle, onPenModeToggle, onInsertElements, showExitZenModeBtn, isCollaborating, renderTopRightUI, renderCustomStats, renderCustomSidebar, libraryReturnUrl, UIOptions, focusContainer, library, id, onImageAction, renderWelcomeScreen, children, }: LayerUIProps) => JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ actionManager, appState, files, setAppState, elements, canvas, onLockToggle, onHandToolToggle, onPenModeToggle, onInsertElements, showExitZenModeBtn, renderTopRightUI, renderCustomStats, renderCustomSidebar, libraryReturnUrl, UIOptions, focusContainer, library, id, onImageAction, renderWelcomeScreen, children, }: LayerUIProps) => JSX.Element>;
 export default _default;

package/types/components/LockButton.d.ts

@@ -4,7 +4,6 @@ declare type LockIconProps = {
     name?: string;
     checked: boolean;
     onChange?(): void;
-    zenModeEnabled?: boolean;
     isMobile?: boolean;
 };
 export declare const LockButton: (props: LockIconProps) => JSX.Element;

package/types/components/MobileMenu.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { AppState, Device, ExcalidrawProps, UIWelcomeScreenComponents } from "../types";
+import { AppState, Device, ExcalidrawProps } from "../types";
 import { ActionManager } from "../actions/manager";
 import { NonDeletedExcalidrawElement } from "../element/types";
 declare type MobileMenuProps = {
@@ -10,6 +10,7 @@ declare type MobileMenuProps = {
     setAppState: React.Component<any, AppState>["setState"];
     elements: readonly NonDeletedExcalidrawElement[];
     onLockToggle: () => void;
+    onHandToolToggle: () => void;
     onPenModeToggle: () => void;
     canvas: HTMLCanvasElement | null;
     onImageAction: (data: {
@@ -19,8 +20,7 @@ declare type MobileMenuProps = {
     renderCustomStats?: ExcalidrawProps["renderCustomStats"];
     renderSidebars: () => JSX.Element | null;
     device: Device;
-    renderMenu: () => React.ReactNode;
-    welcomeScreenCenter: UIWelcomeScreenComponents["Center"];
+    renderWelcomeScreen: boolean;
 };
-export declare const MobileMenu: ({ appState, elements, actionManager, setAppState, onLockToggle, onPenModeToggle, canvas, onImageAction, renderTopRightUI, renderCustomStats, renderSidebars, device, renderMenu, welcomeScreenCenter, }: MobileMenuProps) => JSX.Element;
+export declare const MobileMenu: ({ appState, elements, actionManager, setAppState, onLockToggle, onHandToolToggle, onPenModeToggle, canvas, onImageAction, renderTopRightUI, renderCustomStats, renderSidebars, device, renderWelcomeScreen, }: MobileMenuProps) => JSX.Element;
 export {};

package/types/components/ToolButton.d.ts

@@ -12,7 +12,7 @@ declare type ToolButtonBaseProps = {
     name?: string;
     id?: string;
     size?: ToolButtonSize;
-    keyBindingLabel?: string;
+    keyBindingLabel?: string | null;
     showAriaLabel?: boolean;
     hidden?: boolean;
     visible?: boolean;

package/types/components/context/tunnels.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+import tunnel from "@dwelle/tunnel-rat";
+declare type Tunnel = ReturnType<typeof tunnel>;
+declare type TunnelsContextValue = {
+    mainMenuTunnel: Tunnel;
+    welcomeScreenMenuHintTunnel: Tunnel;
+    welcomeScreenToolbarHintTunnel: Tunnel;
+    welcomeScreenHelpHintTunnel: Tunnel;
+    welcomeScreenCenterTunnel: Tunnel;
+    footerCenterTunnel: Tunnel;
+    jotaiScope: symbol;
+};
+export declare const TunnelsContext: React.Context<TunnelsContextValue>;
+export declare const useTunnels: () => TunnelsContextValue;
+export declare const useInitializeTunnels: () => TunnelsContextValue;
+export {};

package/types/components/dropdownMenu/DropdownMenu.d.ts

@@ -14,10 +14,11 @@ declare const DropdownMenu: {
         displayName: string;
     };
     Content: {
-        ({ children, onClickOutside, className, style, }: {
+        ({ children, onClickOutside, className, onSelect, style, }: {
             children?: React.ReactNode;
             onClickOutside?: (() => void) | undefined;
             className?: string | undefined;
+            onSelect?: ((event: Event) => void) | undefined;
             style?: React.CSSProperties | undefined;
         }): JSX.Element;
         displayName: string;
@@ -25,20 +26,21 @@ declare const DropdownMenu: {
     Item: {
         ({ icon, onSelect, children, shortcut, className, ...rest }: {
             icon?: JSX.Element | undefined;
-            onSelect: () => void;
+            onSelect: (event: Event) => void;
             children: React.ReactNode;
             shortcut?: string | undefined;
             className?: string | undefined;
-        } & React.ButtonHTMLAttributes<HTMLButtonElement>): JSX.Element;
+        } & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onSelect">): JSX.Element;
         displayName: string;
     };
     ItemLink: {
-        ({ icon, shortcut, href, children, className, ...rest }: {
+        ({ icon, shortcut, href, children, onSelect, className, ...rest }: {
+            href: string;
             icon?: JSX.Element | undefined;
             children: React.ReactNode;
             shortcut?: string | undefined;
             className?: string | undefined;
-            href: string;
+            onSelect?: ((event: Event) => void) | undefined;
         } & React.AnchorHTMLAttributes<HTMLAnchorElement>): JSX.Element;
         displayName: string;
     };

package/types/components/dropdownMenu/DropdownMenuContent.d.ts

@@ -1,10 +1,14 @@
-/// <reference types="react" />
+import React from "react";
 declare const MenuContent: {
-    ({ children, onClickOutside, className, style, }: {
+    ({ children, onClickOutside, className, onSelect, style, }: {
         children?: React.ReactNode;
         onClickOutside?: (() => void) | undefined;
         className?: string | undefined;
-        style?: import("react").CSSProperties | undefined;
+        /**
+         * Called when any menu item is selected (clicked on).
+         */
+        onSelect?: ((event: Event) => void) | undefined;
+        style?: React.CSSProperties | undefined;
     }): JSX.Element;
     displayName: string;
 };

package/types/components/dropdownMenu/DropdownMenuItem.d.ts

@@ -1,13 +1,12 @@
 import React from "react";
-export declare const getDrodownMenuItemClassName: (className?: string) => string;
 declare const DropdownMenuItem: {
     ({ icon, onSelect, children, shortcut, className, ...rest }: {
         icon?: JSX.Element | undefined;
-        onSelect: () => void;
+        onSelect: (event: Event) => void;
         children: React.ReactNode;
         shortcut?: string | undefined;
         className?: string | undefined;
-    } & React.ButtonHTMLAttributes<HTMLButtonElement>): JSX.Element;
+    } & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onSelect">): JSX.Element;
     displayName: string;
 };
 export default DropdownMenuItem;

package/types/components/dropdownMenu/DropdownMenuItemLink.d.ts

@@ -1,11 +1,12 @@
 import React from "react";
 declare const DropdownMenuItemLink: {
-    ({ icon, shortcut, href, children, className, ...rest }: {
+    ({ icon, shortcut, href, children, onSelect, className, ...rest }: {
+        href: string;
         icon?: JSX.Element | undefined;
         children: React.ReactNode;
         shortcut?: string | undefined;
         className?: string | undefined;
-        href: string;
+        onSelect?: ((event: Event) => void) | undefined;
     } & React.AnchorHTMLAttributes<HTMLAnchorElement>): JSX.Element;
     displayName: string;
 };

package/types/components/dropdownMenu/common.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+export declare const DropdownMenuContentPropsContext: React.Context<{
+    onSelect?: ((event: Event) => void) | undefined;
+}>;
+export declare const getDropdownMenuItemClassName: (className?: string) => string;
+export declare const useHandleDropdownMenuItemClick: (origOnClick: React.MouseEventHandler<HTMLAnchorElement | HTMLButtonElement> | undefined, onSelect: ((event: Event) => void) | undefined) => (event: React.MouseEvent<HTMLButtonElement | HTMLAnchorElement, MouseEvent>) => void;

package/types/components/footer/Footer.d.ts

@@ -1,12 +1,11 @@
 import { ActionManager } from "../../actions/manager";
-import { AppState, UIChildrenComponents, UIWelcomeScreenComponents } from "../../types";
+import { AppState } from "../../types";
 declare const Footer: {
-    ({ appState, actionManager, showExitZenModeBtn, footerCenter, welcomeScreenHelp, }: {
+    ({ appState, actionManager, showExitZenModeBtn, renderWelcomeScreen, }: {
         appState: AppState;
         actionManager: ActionManager;
         showExitZenModeBtn: boolean;
-        footerCenter: UIChildrenComponents["FooterCenter"];
-        welcomeScreenHelp: UIWelcomeScreenComponents["HelpHint"];
+        renderWelcomeScreen: boolean;
     }): JSX.Element;
     displayName: string;
 };

package/types/components/hoc/withInternalFallback.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+export declare const withInternalFallback: <P>(componentName: string, Component: React.FC<P>) => React.FC<P & {
+    __fallback?: boolean | undefined;
+}>;

package/types/components/icons.d.ts

@@ -136,4 +136,5 @@ export declare const TextAlignMiddleIcon: React.MemoExoticComponent<({ theme }:
 }) => JSX.Element>;
 export declare const publishIcon: JSX.Element;
 export declare const eraser: JSX.Element;
+export declare const handIcon: JSX.Element;
 export {};

package/types/components/main-menu/MainMenu.d.ts

@@ -1,9 +1,14 @@
 import React from "react";
 import * as DefaultItems from "./DefaultItems";
-declare const MainMenu: {
-    ({ children }: {
-        children?: React.ReactNode;
-    }): JSX.Element;
+declare const MainMenu: React.FC<{
+    children?: React.ReactNode;
+    /**
+     * Called when any menu item is selected (clicked on).
+     */
+    onSelect?: ((event: Event) => void) | undefined;
+} & {
+    __fallback?: boolean | undefined;
+}> & {
     Trigger: {
         ({ className, children, onToggle, }: {
             className?: string | undefined;
@@ -15,20 +20,21 @@ declare const MainMenu: {
     Item: {
         ({ icon, onSelect, children, shortcut, className, ...rest }: {
             icon?: JSX.Element | undefined;
-            onSelect: () => void;
+            onSelect: (event: Event) => void;
             children: React.ReactNode;
             shortcut?: string | undefined;
             className?: string | undefined;
-        } & React.ButtonHTMLAttributes<HTMLButtonElement>): JSX.Element;
+        } & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onSelect">): JSX.Element;
         displayName: string;
     };
     ItemLink: {
-        ({ icon, shortcut, href, children, className, ...rest }: {
+        ({ icon, shortcut, href, children, onSelect, className, ...rest }: {
+            href: string;
             icon?: JSX.Element | undefined;
             children: React.ReactNode;
             shortcut?: string | undefined;
             className?: string | undefined;
-            href: string;
+            onSelect?: ((event: Event) => void) | undefined;
         } & React.AnchorHTMLAttributes<HTMLAnchorElement>): JSX.Element;
         displayName: string;
     };
@@ -50,6 +56,5 @@ declare const MainMenu: {
         displayName: string;
     };
     DefaultItems: typeof DefaultItems;
-    displayName: string;
 };
 export default MainMenu;

package/types/components/welcome-screen/WelcomeScreen.d.ts

@@ -2,8 +2,8 @@
 import "./WelcomeScreen.scss";
 declare const WelcomeScreen: {
     (props: {
-        children: React.ReactNode;
-    }): null;
+        children?: React.ReactNode;
+    }): JSX.Element;
     displayName: string;
     Center: {
         ({ children }: {

package/types/constants.d.ts

@@ -1,5 +1,9 @@
 import { AppProps } from "./types";
 import { FontFamilyValues } from "./element/types";
+export declare const isDarwin: boolean;
+export declare const isWindows: boolean;
+export declare const isAndroid: boolean;
+export declare const isFirefox: boolean;
 export declare const APP_NAME = "Excalidraw";
 export declare const DRAGGING_THRESHOLD = 10;
 export declare const LINE_CONFIRM_THRESHOLD = 8;
@@ -48,7 +52,8 @@ export declare enum EVENT {
     HASHCHANGE = "hashchange",
     VISIBILITY_CHANGE = "visibilitychange",
     SCROLL = "scroll",
-    EXCALIDRAW_LINK = "excalidraw-link"
+    EXCALIDRAW_LINK = "excalidraw-link",
+    MENU_ITEM_SELECT = "menu.itemSelect"
 }
 export declare const ENV: {
     TEST: string;

package/types/data/restore.d.ts

@@ -8,8 +8,14 @@ export declare type RestoredDataState = {
     appState: RestoredAppState;
     files: BinaryFiles;
 };
-export declare const restoreElements: (elements: ImportedDataState["elements"], localElements: readonly ExcalidrawElement[] | null | undefined, refreshDimensions?: boolean) => ExcalidrawElement[];
+export declare const restoreElements: (elements: ImportedDataState["elements"], localElements: readonly ExcalidrawElement[] | null | undefined, opts?: {
+    refreshDimensions?: boolean;
+    repairBindings?: boolean;
+} | undefined) => ExcalidrawElement[];
 export declare const restoreAppState: (appState: ImportedDataState["appState"], localAppState: Partial<AppState> | null | undefined) => RestoredAppState;
-export declare const restore: (data: Pick<ImportedDataState, "appState" | "elements" | "files"> | null, localAppState: Partial<AppState> | null | undefined, localElements: readonly ExcalidrawElement[] | null | undefined) => RestoredDataState;
+export declare const restore: (data: Pick<ImportedDataState, "appState" | "elements" | "files"> | null, localAppState: Partial<AppState> | null | undefined, localElements: readonly ExcalidrawElement[] | null | undefined, elementsConfig?: {
+    refreshDimensions?: boolean;
+    repairBindings?: boolean;
+}) => RestoredDataState;
 export declare const restoreLibraryItems: (libraryItems: ImportedDataState["libraryItems"], defaultStatus: LibraryItem["status"]) => LibraryItem[];
 export {};

package/types/element/Hyperlink.d.ts

@@ -36,16 +36,15 @@ export declare const actionLink: {
             editingElement: NonDeletedExcalidrawElement | null;
             editingLinearElement: import("./linearElementEditor").LinearElementEditor | null;
             activeTool: {
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser";
-                lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
+                lastActiveTool: import("../types").LastActiveTool;
                 locked: boolean;
+            } & ({
+                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
                 customType: null;
             } | {
                 type: "custom";
                 customType: string;
-                lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
-                locked: boolean;
-            };
+            });
             penMode: boolean;
             penDetected: boolean;
             exportBackground: boolean;

package/types/element/linearElementEditor.d.ts

@@ -140,16 +140,15 @@ export declare class LinearElementEditor {
             suggestedBindings: import("./binding").SuggestedBinding[];
             editingElement: import("./types").NonDeletedExcalidrawElement | null;
             activeTool: {
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser";
-                lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
+                lastActiveTool: import("../types").LastActiveTool;
                 locked: boolean;
+            } & ({
+                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
                 customType: null;
             } | {
                 type: "custom";
                 customType: string;
-                lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
-                locked: boolean;
-            };
+            });
             penMode: boolean;
             penDetected: boolean;
             exportBackground: boolean;
@@ -196,7 +195,7 @@ export declare class LinearElementEditor {
             toast: {
                 message: string;
                 closable?: boolean | undefined;
-                duration?: number | undefined; /** @returns whether point was dragged */
+                duration?: number | undefined;
             } | null;
             zenModeEnabled: boolean;
             theme: string;

package/types/element/newElement.d.ts

@@ -20,8 +20,6 @@ export declare const refreshTextDimensions: (textElement: ExcalidrawTextElement,
     baseline: number;
     text: string;
 };
-export declare const getMaxContainerWidth: (container: ExcalidrawElement) => number;
-export declare const getMaxContainerHeight: (container: ExcalidrawElement) => number;
 export declare const updateTextElement: (textElement: ExcalidrawTextElement, { text, isDeleted, originalText, }: {
     text: string;
     isDeleted?: boolean | undefined;

package/types/element/sortElements.d.ts

@@ -0,0 +1,2 @@
+import { ExcalidrawElement } from "./types";
+export declare const normalizeElementOrder: (elements: readonly ExcalidrawElement[]) => readonly ExcalidrawElement[];

package/types/element/textElement.d.ts

@@ -41,6 +41,10 @@ export declare const getContainerCenter: (container: ExcalidrawElement, appState
     x: number;
     y: number;
 };
+export declare const getContainerCoords: (container: NonDeletedExcalidrawElement) => {
+    x: number;
+    y: number;
+};
 export declare const getTextElementAngle: (textElement: ExcalidrawTextElement) => number;
 export declare const getBoundTextElementOffset: (boundTextElement: ExcalidrawTextElement | null) => number;
 export declare const getBoundTextElementPosition: (container: ExcalidrawElement, boundTextElement: ExcalidrawTextElementWithContainer) => {
@@ -50,3 +54,6 @@ export declare const getBoundTextElementPosition: (container: ExcalidrawElement,
 export declare const shouldAllowVerticalAlign: (selectedElements: NonDeletedExcalidrawElement[]) => boolean;
 export declare const getTextBindableContainerAtPosition: (elements: readonly ExcalidrawElement[], appState: AppState, x: number, y: number) => ExcalidrawTextContainer | null;
 export declare const isValidTextContainer: (element: ExcalidrawElement) => boolean;
+export declare const computeContainerHeightForBoundText: (container: NonDeletedExcalidrawElement, boundTextElementHeight: number) => number;
+export declare const getMaxContainerWidth: (container: ExcalidrawElement) => number;
+export declare const getMaxContainerHeight: (container: ExcalidrawElement) => number;

package/types/element/typeChecks.d.ts

@@ -14,7 +14,7 @@ export declare const isBindingElementType: (elementType: AppState["activeTool"][
 export declare const isBindableElement: (element: ExcalidrawElement | null, includeLocked?: boolean) => element is ExcalidrawBindableElement;
 export declare const isTextBindableContainer: (element: ExcalidrawElement | null, includeLocked?: boolean) => element is ExcalidrawTextContainer;
 export declare const isExcalidrawElement: (element: any) => boolean;
-export declare const hasBoundTextElement: (element: ExcalidrawElement | null) => element is ExcalidrawBindableElement;
+export declare const hasBoundTextElement: (element: ExcalidrawElement | null) => element is MarkNonNullable<ExcalidrawBindableElement, "boundElements">;
 export declare const isBoundToContainer: (element: ExcalidrawElement | null) => element is ExcalidrawTextElementWithContainer;
 export declare const isUsingAdaptiveRadius: (type: string) => boolean;
 export declare const isUsingProportionalRadius: (type: string) => boolean;

package/types/i18n.d.ts

@@ -13,3 +13,9 @@ export declare const getLanguage: () => Language;
 export declare const t: (path: string, replacement?: {
     [key: string]: string | number;
 } | undefined) => string;
+export declare const useI18n: () => {
+    t: (path: string, replacement?: {
+        [key: string]: string | number;
+    } | undefined) => string;
+    langCode: string;
+};