@zsviczian/excalidraw 0.14.0-obsidian → 0.14.1-obsidian

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 (41) hide show
  1. package/dist/excalidraw.development.js +149 -116
  2. package/dist/excalidraw.production.min.js +1 -1
  3. package/package.json +1 -1
  4. package/types/actions/actionAddToLibrary.d.ts +21 -15
  5. package/types/actions/actionBoundText.d.ts +7 -5
  6. package/types/actions/actionCanvas.d.ts +185 -47
  7. package/types/actions/actionClipboard.d.ts +35 -25
  8. package/types/actions/actionDeleteSelected.d.ts +21 -15
  9. package/types/actions/actionExport.d.ts +63 -45
  10. package/types/actions/actionFinalize.d.ts +14 -10
  11. package/types/actions/actionLinearEditor.d.ts +7 -5
  12. package/types/actions/actionMenu.d.ts +21 -15
  13. package/types/actions/actionProperties.d.ts +91 -65
  14. package/types/actions/actionStyles.d.ts +7 -5
  15. package/types/actions/actionToggleGridMode.d.ts +7 -5
  16. package/types/actions/actionToggleLock.d.ts +7 -5
  17. package/types/actions/actionToggleStats.d.ts +7 -5
  18. package/types/actions/actionToggleViewMode.d.ts +7 -5
  19. package/types/actions/actionToggleZenMode.d.ts +7 -5
  20. package/types/actions/types.d.ts +1 -1
  21. package/types/appState.d.ts +8 -6
  22. package/types/components/ActiveConfirmDialog.d.ts +24 -0
  23. package/types/components/App.d.ts +1 -0
  24. package/types/components/HandButton.d.ts +10 -0
  25. package/types/components/LayerUI.d.ts +2 -1
  26. package/types/components/LockButton.d.ts +0 -1
  27. package/types/components/MobileMenu.d.ts +2 -1
  28. package/types/components/ToolButton.d.ts +1 -1
  29. package/types/components/dropdownMenu/DropdownMenu.d.ts +7 -5
  30. package/types/components/dropdownMenu/DropdownMenuContent.d.ts +7 -3
  31. package/types/components/dropdownMenu/DropdownMenuItem.d.ts +2 -3
  32. package/types/components/dropdownMenu/DropdownMenuItemLink.d.ts +3 -2
  33. package/types/components/dropdownMenu/common.d.ts +6 -0
  34. package/types/components/icons.d.ts +1 -0
  35. package/types/components/main-menu/MainMenu.d.ts +10 -5
  36. package/types/constants.d.ts +6 -1
  37. package/types/element/Hyperlink.d.ts +7 -5
  38. package/types/element/linearElementEditor.d.ts +8 -5
  39. package/types/keys.d.ts +0 -3
  40. package/types/types.d.ts +13 -7
  41. package/types/utils.d.ts +6 -3
@@ -27,16 +27,15 @@ export declare const actionToggleViewMode: {
27
27
  editingElement: import("../element/types").NonDeletedExcalidrawElement | null;
28
28
  editingLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
29
29
  activeTool: {
30
- type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser";
31
- lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
30
+ lastActiveTool: import("../types").LastActiveTool;
32
31
  locked: boolean;
32
+ } & ({
33
+ type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
33
34
  customType: null;
34
35
  } | {
35
36
  type: "custom";
36
37
  customType: string;
37
- lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
38
- locked: boolean;
39
- };
38
+ });
40
39
  penMode: boolean;
41
40
  penDetected: boolean;
42
41
  exportBackground: boolean;
@@ -88,6 +87,7 @@ export declare const actionToggleViewMode: {
88
87
  zenModeEnabled: boolean;
89
88
  theme: string;
90
89
  gridSize: number | null;
90
+ previousGridSize: number | null;
91
91
  selectedGroupIds: {
92
92
  [groupId: string]: boolean;
93
93
  };
@@ -116,6 +116,8 @@ export declare const actionToggleViewMode: {
116
116
  elementBackground?: string[] | undefined;
117
117
  elementStroke?: string[] | undefined;
118
118
  };
119
+ allowWheelZoom?: boolean | undefined;
120
+ allowPinchZoom?: boolean | undefined;
119
121
  selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
120
122
  };
121
123
  commitToHistory: false;
@@ -27,16 +27,15 @@ export declare const actionToggleZenMode: {
27
27
  editingElement: import("../element/types").NonDeletedExcalidrawElement | null;
28
28
  editingLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
29
29
  activeTool: {
30
- type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser";
31
- lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
30
+ lastActiveTool: import("../types").LastActiveTool;
32
31
  locked: boolean;
32
+ } & ({
33
+ type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
33
34
  customType: null;
34
35
  } | {
35
36
  type: "custom";
36
37
  customType: string;
37
- lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
38
- locked: boolean;
39
- };
38
+ });
40
39
  penMode: boolean;
41
40
  penDetected: boolean;
42
41
  exportBackground: boolean;
@@ -87,6 +86,7 @@ export declare const actionToggleZenMode: {
87
86
  } | null;
88
87
  theme: string;
89
88
  gridSize: number | null;
89
+ previousGridSize: number | null;
90
90
  viewModeEnabled: boolean;
91
91
  selectedGroupIds: {
92
92
  [groupId: string]: boolean;
@@ -116,6 +116,8 @@ export declare const actionToggleZenMode: {
116
116
  elementBackground?: string[] | undefined;
117
117
  elementStroke?: string[] | undefined;
118
118
  };
119
+ allowWheelZoom?: boolean | undefined;
120
+ allowPinchZoom?: boolean | undefined;
119
121
  selectedLinearElement: import("../element/linearElementEditor").LinearElementEditor | null;
120
122
  };
121
123
  commitToHistory: false;
@@ -14,7 +14,7 @@ export declare type ActionResult = {
14
14
  declare type ActionFn = (elements: readonly ExcalidrawElement[], appState: Readonly<AppState>, formData: any, app: AppClassProperties) => ActionResult | Promise<ActionResult>;
15
15
  export declare type UpdaterFn = (res: ActionResult) => void;
16
16
  export declare type ActionFilterFn = (action: Action) => void;
17
- 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";
17
+ 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";
18
18
  export declare type PanelComponentProps = {
19
19
  elements: readonly ExcalidrawElement[];
20
20
  appState: AppState;
@@ -3,17 +3,16 @@ export declare const getDefaultAppState: () => Omit<AppState, "offsetTop" | "off
3
3
  export declare const clearAppStateForLocalStorage: (appState: Partial<AppState>) => {
4
4
  theme?: string | undefined;
5
5
  name?: string | undefined;
6
- activeTool?: {
7
- type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser";
8
- lastActiveToolBeforeEraser: import("./types").LastActiveToolBeforeEraser;
6
+ activeTool?: ({
7
+ lastActiveTool: import("./types").LastActiveTool;
9
8
  locked: boolean;
9
+ } & ({
10
+ type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
10
11
  customType: null;
11
12
  } | {
12
13
  type: "custom";
13
14
  customType: string;
14
- lastActiveToolBeforeEraser: import("./types").LastActiveToolBeforeEraser;
15
- locked: boolean;
16
- } | undefined;
15
+ })) | undefined;
17
16
  showWelcomeScreen?: boolean | undefined;
18
17
  penMode?: boolean | undefined;
19
18
  penDetected?: boolean | undefined;
@@ -74,3 +73,6 @@ export declare const clearAppStateForDatabase: (appState: Partial<AppState>) =>
74
73
  export declare const isEraserActive: ({ activeTool, }: {
75
74
  activeTool: AppState["activeTool"];
76
75
  }) => boolean;
76
+ export declare const isHandToolActive: ({ activeTool, }: {
77
+ activeTool: AppState["activeTool"];
78
+ }) => boolean;
@@ -0,0 +1,24 @@
1
+ export declare const activeConfirmDialogAtom: import("jotai").Atom<"clearCanvas" | null> & {
2
+ write: (get: {
3
+ <Value>(atom: import("jotai").Atom<Value | Promise<Value>>): Value;
4
+ <Value_1>(atom: import("jotai").Atom<Promise<Value_1>>): Value_1;
5
+ <Value_2>(atom: import("jotai").Atom<Value_2>): Value_2 extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? any : V : V : V : V : V : V : V : V : V : V : Value_2;
6
+ } & {
7
+ <Value_3>(atom: import("jotai").Atom<Value_3 | Promise<Value_3>>, options: {
8
+ unstable_promise: true;
9
+ }): Value_3 | Promise<Value_3>;
10
+ <Value_4>(atom: import("jotai").Atom<Promise<Value_4>>, options: {
11
+ unstable_promise: true;
12
+ }): Value_4 | Promise<Value_4>;
13
+ <Value_5>(atom: import("jotai").Atom<Value_5>, options: {
14
+ unstable_promise: true;
15
+ }): (Value_5 extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? any : V : V : V : V : V : V : V : V : V : V : Value_5) | Promise<Value_5 extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? V extends Promise<infer V> ? any : V : V : V : V : V : V : V : V : V : V : Value_5>;
16
+ }, set: {
17
+ <Value_6, Result extends void | Promise<void>>(atom: import("jotai").WritableAtom<Value_6, undefined, Result>): Result;
18
+ <Value_7, Update, Result_1 extends void | Promise<void>>(atom: import("jotai").WritableAtom<Value_7, Update, Result_1>, update: Update): Result_1;
19
+ }, update: "clearCanvas" | ((prev: "clearCanvas" | null) => "clearCanvas" | null) | null) => void;
20
+ onMount?: (<S extends (update: "clearCanvas" | ((prev: "clearCanvas" | null) => "clearCanvas" | null) | null) => void>(setAtom: S) => void | (() => void)) | undefined;
21
+ } & {
22
+ init: "clearCanvas" | null;
23
+ };
24
+ export declare const ActiveConfirmDialog: () => JSX.Element | null;
@@ -96,6 +96,7 @@ declare class App extends React.Component<AppProps, AppState> {
96
96
  removePointer: (event: React.PointerEvent<HTMLElement> | PointerEvent) => void;
97
97
  toggleLock: (source?: "keyboard" | "ui") => void;
98
98
  togglePenMode: () => void;
99
+ onHandToolToggle: () => void;
99
100
  scrollToContent: (target?: ExcalidrawElement | readonly ExcalidrawElement[]) => void;
100
101
  zoomToFit: (target?: readonly ExcalidrawElement[], maxZoom?: number, margin?: number) => void;
101
102
  updateContainerSize: (containers: NonDeletedExcalidrawElement[]) => void;
@@ -0,0 +1,10 @@
1
+ import "./ToolIcon.scss";
2
+ declare type LockIconProps = {
3
+ title?: string;
4
+ name?: string;
5
+ checked: boolean;
6
+ onChange?(): void;
7
+ isMobile?: boolean;
8
+ };
9
+ export declare const HandButton: (props: LockIconProps) => JSX.Element;
10
+ export {};
@@ -14,6 +14,7 @@ interface LayerUIProps {
14
14
  setAppState: React.Component<any, AppState>["setState"];
15
15
  elements: readonly NonDeletedExcalidrawElement[];
16
16
  onLockToggle: () => void;
17
+ onHandToolToggle: () => void;
17
18
  onPenModeToggle: () => void;
18
19
  onInsertElements: (elements: readonly NonDeletedExcalidrawElement[]) => void;
19
20
  showExitZenModeBtn: boolean;
@@ -33,5 +34,5 @@ interface LayerUIProps {
33
34
  renderWelcomeScreen: boolean;
34
35
  children?: React.ReactNode;
35
36
  }
36
- 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>;
37
+ declare const _default: React.MemoExoticComponent<({ actionManager, appState, files, setAppState, elements, canvas, onLockToggle, onHandToolToggle, onPenModeToggle, onInsertElements, showExitZenModeBtn, isCollaborating, renderTopRightUI, renderCustomStats, renderCustomSidebar, libraryReturnUrl, UIOptions, focusContainer, library, id, onImageAction, renderWelcomeScreen, children, }: LayerUIProps) => JSX.Element>;
37
38
  export default _default;
@@ -4,7 +4,6 @@ declare type LockIconProps = {
4
4
  name?: string;
5
5
  checked: boolean;
6
6
  onChange?(): void;
7
- zenModeEnabled?: boolean;
8
7
  isMobile?: boolean;
9
8
  };
10
9
  export declare const LockButton: (props: LockIconProps) => JSX.Element;
@@ -10,6 +10,7 @@ declare type MobileMenuProps = {
10
10
  setAppState: React.Component<any, AppState>["setState"];
11
11
  elements: readonly NonDeletedExcalidrawElement[];
12
12
  onLockToggle: () => void;
13
+ onHandToolToggle: () => void;
13
14
  onPenModeToggle: () => void;
14
15
  canvas: HTMLCanvasElement | null;
15
16
  onImageAction: (data: {
@@ -22,5 +23,5 @@ declare type MobileMenuProps = {
22
23
  renderMenu: () => React.ReactNode;
23
24
  welcomeScreenCenter: UIWelcomeScreenComponents["Center"];
24
25
  };
25
- export declare const MobileMenu: ({ appState, elements, actionManager, setAppState, onLockToggle, onPenModeToggle, canvas, onImageAction, renderTopRightUI, renderCustomStats, renderSidebars, device, renderMenu, welcomeScreenCenter, }: MobileMenuProps) => JSX.Element;
26
+ export declare const MobileMenu: ({ appState, elements, actionManager, setAppState, onLockToggle, onHandToolToggle, onPenModeToggle, canvas, onImageAction, renderTopRightUI, renderCustomStats, renderSidebars, device, renderMenu, welcomeScreenCenter, }: MobileMenuProps) => JSX.Element;
26
27
  export {};
@@ -12,7 +12,7 @@ declare type ToolButtonBaseProps = {
12
12
  name?: string;
13
13
  id?: string;
14
14
  size?: ToolButtonSize;
15
- keyBindingLabel?: string;
15
+ keyBindingLabel?: string | null;
16
16
  showAriaLabel?: boolean;
17
17
  hidden?: boolean;
18
18
  visible?: boolean;
@@ -14,10 +14,11 @@ declare const DropdownMenu: {
14
14
  displayName: string;
15
15
  };
16
16
  Content: {
17
- ({ children, onClickOutside, className, style, }: {
17
+ ({ children, onClickOutside, className, onSelect, style, }: {
18
18
  children?: React.ReactNode;
19
19
  onClickOutside?: (() => void) | undefined;
20
20
  className?: string | undefined;
21
+ onSelect?: ((event: Event) => void) | undefined;
21
22
  style?: React.CSSProperties | undefined;
22
23
  }): JSX.Element;
23
24
  displayName: string;
@@ -25,20 +26,21 @@ declare const DropdownMenu: {
25
26
  Item: {
26
27
  ({ icon, onSelect, children, shortcut, className, ...rest }: {
27
28
  icon?: JSX.Element | undefined;
28
- onSelect: () => void;
29
+ onSelect: (event: Event) => void;
29
30
  children: React.ReactNode;
30
31
  shortcut?: string | undefined;
31
32
  className?: string | undefined;
32
- } & React.ButtonHTMLAttributes<HTMLButtonElement>): JSX.Element;
33
+ } & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onSelect">): JSX.Element;
33
34
  displayName: string;
34
35
  };
35
36
  ItemLink: {
36
- ({ icon, shortcut, href, children, className, ...rest }: {
37
+ ({ icon, shortcut, href, children, onSelect, className, ...rest }: {
38
+ href: string;
37
39
  icon?: JSX.Element | undefined;
38
40
  children: React.ReactNode;
39
41
  shortcut?: string | undefined;
40
42
  className?: string | undefined;
41
- href: string;
43
+ onSelect?: ((event: Event) => void) | undefined;
42
44
  } & React.AnchorHTMLAttributes<HTMLAnchorElement>): JSX.Element;
43
45
  displayName: string;
44
46
  };
@@ -1,10 +1,14 @@
1
- /// <reference types="react" />
1
+ import React from "react";
2
2
  declare const MenuContent: {
3
- ({ children, onClickOutside, className, style, }: {
3
+ ({ children, onClickOutside, className, onSelect, style, }: {
4
4
  children?: React.ReactNode;
5
5
  onClickOutside?: (() => void) | undefined;
6
6
  className?: string | undefined;
7
- style?: import("react").CSSProperties | undefined;
7
+ /**
8
+ * Called when any menu item is selected (clicked on).
9
+ */
10
+ onSelect?: ((event: Event) => void) | undefined;
11
+ style?: React.CSSProperties | undefined;
8
12
  }): JSX.Element;
9
13
  displayName: string;
10
14
  };
@@ -1,13 +1,12 @@
1
1
  import React from "react";
2
- export declare const getDrodownMenuItemClassName: (className?: string) => string;
3
2
  declare const DropdownMenuItem: {
4
3
  ({ icon, onSelect, children, shortcut, className, ...rest }: {
5
4
  icon?: JSX.Element | undefined;
6
- onSelect: () => void;
5
+ onSelect: (event: Event) => void;
7
6
  children: React.ReactNode;
8
7
  shortcut?: string | undefined;
9
8
  className?: string | undefined;
10
- } & React.ButtonHTMLAttributes<HTMLButtonElement>): JSX.Element;
9
+ } & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onSelect">): JSX.Element;
11
10
  displayName: string;
12
11
  };
13
12
  export default DropdownMenuItem;
@@ -1,11 +1,12 @@
1
1
  import React from "react";
2
2
  declare const DropdownMenuItemLink: {
3
- ({ icon, shortcut, href, children, className, ...rest }: {
3
+ ({ icon, shortcut, href, children, onSelect, className, ...rest }: {
4
+ href: string;
4
5
  icon?: JSX.Element | undefined;
5
6
  children: React.ReactNode;
6
7
  shortcut?: string | undefined;
7
8
  className?: string | undefined;
8
- href: string;
9
+ onSelect?: ((event: Event) => void) | undefined;
9
10
  } & React.AnchorHTMLAttributes<HTMLAnchorElement>): JSX.Element;
10
11
  displayName: string;
11
12
  };
@@ -0,0 +1,6 @@
1
+ import React from "react";
2
+ export declare const DropdownMenuContentPropsContext: React.Context<{
3
+ onSelect?: ((event: Event) => void) | undefined;
4
+ }>;
5
+ export declare const getDrodownMenuItemClassName: (className?: string) => string;
6
+ export declare const useHandleDropdownMenuItemClick: (origOnClick: React.MouseEventHandler<HTMLAnchorElement | HTMLButtonElement> | undefined, onSelect: ((event: Event) => void) | undefined) => (event: React.MouseEvent<HTMLButtonElement | HTMLAnchorElement, MouseEvent>) => void;
@@ -138,4 +138,5 @@ export declare const TextAlignMiddleIcon: React.MemoExoticComponent<({ theme }:
138
138
  }) => JSX.Element>;
139
139
  export declare const publishIcon: JSX.Element;
140
140
  export declare const eraser: JSX.Element;
141
+ export declare const handIcon: JSX.Element;
141
142
  export {};
@@ -1,8 +1,12 @@
1
1
  import React from "react";
2
2
  import * as DefaultItems from "./DefaultItems";
3
3
  declare const MainMenu: {
4
- ({ children }: {
4
+ ({ children, onSelect, }: {
5
5
  children?: React.ReactNode;
6
+ /**
7
+ * Called when any menu item is selected (clicked on).
8
+ */
9
+ onSelect?: ((event: Event) => void) | undefined;
6
10
  }): JSX.Element;
7
11
  Trigger: {
8
12
  ({ className, children, onToggle, }: {
@@ -15,20 +19,21 @@ declare const MainMenu: {
15
19
  Item: {
16
20
  ({ icon, onSelect, children, shortcut, className, ...rest }: {
17
21
  icon?: JSX.Element | undefined;
18
- onSelect: () => void;
22
+ onSelect: (event: Event) => void;
19
23
  children: React.ReactNode;
20
24
  shortcut?: string | undefined;
21
25
  className?: string | undefined;
22
- } & React.ButtonHTMLAttributes<HTMLButtonElement>): JSX.Element;
26
+ } & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onSelect">): JSX.Element;
23
27
  displayName: string;
24
28
  };
25
29
  ItemLink: {
26
- ({ icon, shortcut, href, children, className, ...rest }: {
30
+ ({ icon, shortcut, href, children, onSelect, className, ...rest }: {
31
+ href: string;
27
32
  icon?: JSX.Element | undefined;
28
33
  children: React.ReactNode;
29
34
  shortcut?: string | undefined;
30
35
  className?: string | undefined;
31
- href: string;
36
+ onSelect?: ((event: Event) => void) | undefined;
32
37
  } & React.AnchorHTMLAttributes<HTMLAnchorElement>): JSX.Element;
33
38
  displayName: string;
34
39
  };
@@ -1,5 +1,9 @@
1
1
  import { AppProps } from "./types";
2
2
  import { FontFamilyValues } from "./element/types";
3
+ export declare const isDarwin: boolean;
4
+ export declare const isWindows: boolean;
5
+ export declare const isAndroid: boolean;
6
+ export declare const isFirefox: boolean;
3
7
  export declare const APP_NAME = "Excalidraw";
4
8
  export declare const DRAGGING_THRESHOLD = 10;
5
9
  export declare const LINE_CONFIRM_THRESHOLD = 8;
@@ -48,7 +52,8 @@ export declare enum EVENT {
48
52
  HASHCHANGE = "hashchange",
49
53
  VISIBILITY_CHANGE = "visibilitychange",
50
54
  SCROLL = "scroll",
51
- EXCALIDRAW_LINK = "excalidraw-link"
55
+ EXCALIDRAW_LINK = "excalidraw-link",
56
+ MENU_ITEM_SELECT = "menu.itemSelect"
52
57
  }
53
58
  export declare const ENV: {
54
59
  TEST: string;
@@ -36,16 +36,15 @@ export declare const actionLink: {
36
36
  editingElement: NonDeletedExcalidrawElement | null;
37
37
  editingLinearElement: import("./linearElementEditor").LinearElementEditor | null;
38
38
  activeTool: {
39
- type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser";
40
- lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
39
+ lastActiveTool: import("../types").LastActiveTool;
41
40
  locked: boolean;
41
+ } & ({
42
+ type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
42
43
  customType: null;
43
44
  } | {
44
45
  type: "custom";
45
46
  customType: string;
46
- lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
47
- locked: boolean;
48
- };
47
+ });
49
48
  penMode: boolean;
50
49
  penDetected: boolean;
51
50
  exportBackground: boolean;
@@ -96,6 +95,7 @@ export declare const actionLink: {
96
95
  zenModeEnabled: boolean;
97
96
  theme: string;
98
97
  gridSize: number | null;
98
+ previousGridSize: number | null;
99
99
  viewModeEnabled: boolean;
100
100
  selectedGroupIds: {
101
101
  [groupId: string]: boolean;
@@ -124,6 +124,8 @@ export declare const actionLink: {
124
124
  elementBackground?: string[] | undefined;
125
125
  elementStroke?: string[] | undefined;
126
126
  };
127
+ allowWheelZoom?: boolean | undefined;
128
+ allowPinchZoom?: boolean | undefined;
127
129
  selectedLinearElement: import("./linearElementEditor").LinearElementEditor | null;
128
130
  };
129
131
  commitToHistory: true;
@@ -140,16 +140,15 @@ export declare class LinearElementEditor {
140
140
  suggestedBindings: import("./binding").SuggestedBinding[];
141
141
  editingElement: import("./types").NonDeletedExcalidrawElement | null;
142
142
  activeTool: {
143
- type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser";
144
- lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
143
+ lastActiveTool: import("../types").LastActiveTool;
145
144
  locked: boolean;
145
+ } & ({
146
+ type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
146
147
  customType: null;
147
148
  } | {
148
149
  type: "custom";
149
150
  customType: string;
150
- lastActiveToolBeforeEraser: import("../types").LastActiveToolBeforeEraser;
151
- locked: boolean;
152
- };
151
+ });
153
152
  penMode: boolean;
154
153
  penDetected: boolean;
155
154
  exportBackground: boolean;
@@ -192,6 +191,7 @@ export declare class LinearElementEditor {
192
191
  previousSelectedElementIds: {
193
192
  [id: string]: boolean;
194
193
  };
194
+ /** @returns whether point was dragged */
195
195
  shouldCacheIgnoreZoom: boolean;
196
196
  toast: {
197
197
  message: string;
@@ -201,6 +201,7 @@ export declare class LinearElementEditor {
201
201
  zenModeEnabled: boolean;
202
202
  theme: string;
203
203
  gridSize: number | null;
204
+ previousGridSize: number | null;
204
205
  viewModeEnabled: boolean;
205
206
  selectedGroupIds: {
206
207
  [groupId: string]: boolean;
@@ -230,6 +231,8 @@ export declare class LinearElementEditor {
230
231
  elementBackground?: string[] | undefined;
231
232
  elementStroke?: string[] | undefined;
232
233
  };
234
+ allowWheelZoom?: boolean | undefined;
235
+ allowPinchZoom?: boolean | undefined;
233
236
  selectedLinearElement: LinearElementEditor | null;
234
237
  };
235
238
  };
package/types/keys.d.ts CHANGED
@@ -1,6 +1,3 @@
1
- export declare const isDarwin: boolean;
2
- export declare const isWindows: boolean;
3
- export declare const isAndroid: boolean;
4
1
  export declare const CODES: {
5
2
  readonly EQUAL: "Equal";
6
3
  readonly MINUS: "Minus";
package/types/types.d.ts CHANGED
@@ -55,8 +55,8 @@ export declare type BinaryFileData = {
55
55
  };
56
56
  export declare type BinaryFileMetadata = Omit<BinaryFileData, "dataURL">;
57
57
  export declare type BinaryFiles = Record<ExcalidrawElement["id"], BinaryFileData>;
58
- export declare type LastActiveToolBeforeEraser = {
59
- type: typeof SHAPES[number]["value"] | "eraser";
58
+ export declare type LastActiveTool = {
59
+ type: typeof SHAPES[number]["value"] | "eraser" | "hand";
60
60
  customType: null;
61
61
  } | {
62
62
  type: "custom";
@@ -81,16 +81,19 @@ export declare type AppState = {
81
81
  editingElement: NonDeletedExcalidrawElement | null;
82
82
  editingLinearElement: LinearElementEditor | null;
83
83
  activeTool: {
84
- type: typeof SHAPES[number]["value"] | "eraser";
85
- lastActiveToolBeforeEraser: LastActiveToolBeforeEraser;
84
+ /**
85
+ * indicates a previous tool we should revert back to if we deselect the
86
+ * currently active tool. At the moment applies to `eraser` and `hand` tool.
87
+ */
88
+ lastActiveTool: LastActiveTool;
86
89
  locked: boolean;
90
+ } & ({
91
+ type: typeof SHAPES[number]["value"] | "eraser" | "hand";
87
92
  customType: null;
88
93
  } | {
89
94
  type: "custom";
90
95
  customType: string;
91
- lastActiveToolBeforeEraser: LastActiveToolBeforeEraser;
92
- locked: boolean;
93
- };
96
+ });
94
97
  penMode: boolean;
95
98
  penDetected: boolean;
96
99
  exportBackground: boolean;
@@ -140,6 +143,7 @@ export declare type AppState = {
140
143
  zenModeEnabled: boolean;
141
144
  theme: Theme;
142
145
  gridSize: number | null;
146
+ previousGridSize: number | null;
143
147
  viewModeEnabled: boolean;
144
148
  /** top-most selected groups (i.e. does not include nested groups) */
145
149
  selectedGroupIds: {
@@ -173,6 +177,8 @@ export declare type AppState = {
173
177
  elementBackground?: string[];
174
178
  elementStroke?: string[];
175
179
  };
180
+ allowWheelZoom?: boolean;
181
+ allowPinchZoom?: boolean;
176
182
  selectedLinearElement: LinearElementEditor | null;
177
183
  };
178
184
  export declare type NormalizedZoomValue = number & {
package/types/utils.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { EVENT } from "./constants";
2
2
  import { FontFamilyValues, FontString } from "./element/types";
3
- import { AppState, LastActiveToolBeforeEraser, Zoom } from "./types";
3
+ import { AppState, LastActiveTool, Zoom } from "./types";
4
4
  import { SHAPES } from "./shapes";
5
5
  import React from "react";
6
6
  export declare const setDateTimeForTests: (dateTime: string) => void;
@@ -34,12 +34,12 @@ export declare const selectNode: (node: Element) => void;
34
34
  export declare const removeSelection: () => void;
35
35
  export declare const distance: (x: number, y: number) => number;
36
36
  export declare const updateActiveTool: (appState: Pick<AppState, "activeTool">, data: ({
37
- type: (typeof SHAPES)[number]["value"] | "eraser";
37
+ type: (typeof SHAPES)[number]["value"] | "eraser" | "hand";
38
38
  } | {
39
39
  type: "custom";
40
40
  customType: string;
41
41
  }) & {
42
- lastActiveToolBeforeEraser?: LastActiveToolBeforeEraser;
42
+ lastActiveToolBeforeEraser?: LastActiveTool;
43
43
  }) => AppState["activeTool"];
44
44
  export declare const resetCursor: (canvas: HTMLCanvasElement | null) => void;
45
45
  export declare const setCursor: (canvas: HTMLCanvasElement | null, cursor: string) => void;
@@ -151,3 +151,6 @@ export declare const getReactChildren: <KnownChildren extends {
151
151
  [x: string]: React.ReactNode;
152
152
  }>(children: React.ReactNode, expectedComponents?: Record<keyof KnownChildren, any> | undefined) => readonly [Partial<KnownChildren>, React.ReactNode[]];
153
153
  export declare const isShallowEqual: <T extends Record<string, any>>(objA: T, objB: T) => boolean;
154
+ export declare const composeEventHandlers: <E>(originalEventHandler?: ((event: E) => void) | undefined, ourEventHandler?: ((event: E) => void) | undefined, { checkForDefaultPrevented }?: {
155
+ checkForDefaultPrevented?: boolean | undefined;
156
+ }) => (event: E) => void;