@zsviczian/excalidraw 0.13.0-obsidian-1 → 0.14.0-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 (88) hide show
  1. package/README.md +418 -20
  2. package/dist/excalidraw.development.js +571 -1154
  3. package/dist/excalidraw.production.min.js +1 -1
  4. package/dist/excalidraw.production.min.js.LICENSE.txt +0 -102
  5. package/package.json +1 -1
  6. package/types/actions/actionAddToLibrary.d.ts +21 -9
  7. package/types/actions/actionAlign.d.ts +6 -18
  8. package/types/actions/actionBoundText.d.ts +9 -5
  9. package/types/actions/actionCanvas.d.ts +83 -55
  10. package/types/actions/actionClipboard.d.ts +63 -16
  11. package/types/actions/actionDeleteSelected.d.ts +31 -12
  12. package/types/actions/actionDistribute.d.ts +2 -6
  13. package/types/actions/actionDuplicateSelection.d.ts +1 -3
  14. package/types/actions/actionExport.d.ts +79 -58
  15. package/types/actions/actionFinalize.d.ts +15 -9
  16. package/types/actions/actionFlip.d.ts +2 -2
  17. package/types/actions/actionGroup.d.ts +4 -8
  18. package/types/actions/actionLinearEditor.d.ts +8 -4
  19. package/types/actions/actionMenu.d.ts +24 -17
  20. package/types/actions/actionNavigate.d.ts +2 -3
  21. package/types/actions/actionProperties.d.ts +106 -80
  22. package/types/actions/actionStyles.d.ts +7 -3
  23. package/types/actions/actionToggleGridMode.d.ts +9 -3
  24. package/types/actions/actionToggleLock.d.ts +7 -3
  25. package/types/actions/actionToggleStats.d.ts +8 -3
  26. package/types/actions/actionToggleViewMode.d.ts +9 -3
  27. package/types/actions/actionToggleZenMode.d.ts +9 -3
  28. package/types/actions/actionZindex.d.ts +4 -12
  29. package/types/actions/manager.d.ts +2 -1
  30. package/types/actions/types.d.ts +6 -5
  31. package/types/appState.d.ts +8 -9
  32. package/types/clipboard.d.ts +6 -1
  33. package/types/components/App.d.ts +8 -51
  34. package/types/components/Button.d.ts +15 -0
  35. package/types/components/CollabButton.d.ts +1 -2
  36. package/types/components/ContextMenu.d.ts +8 -21
  37. package/types/components/JSONExportDialog.d.ts +3 -1
  38. package/types/components/LayerUI.d.ts +2 -3
  39. package/types/components/LibraryMenuHeaderContent.d.ts +23 -0
  40. package/types/components/MobileMenu.d.ts +4 -6
  41. package/types/components/UserList.d.ts +0 -2
  42. package/types/components/dropdownMenu/DropdownMenu.d.ts +64 -0
  43. package/types/components/dropdownMenu/DropdownMenuContent.d.ts +11 -0
  44. package/types/components/dropdownMenu/DropdownMenuGroup.d.ts +11 -0
  45. package/types/components/dropdownMenu/DropdownMenuItem.d.ts +13 -0
  46. package/types/components/dropdownMenu/DropdownMenuItemContent.d.ts +6 -0
  47. package/types/components/dropdownMenu/DropdownMenuItemCustom.d.ts +6 -0
  48. package/types/components/dropdownMenu/DropdownMenuItemLink.d.ts +12 -0
  49. package/types/components/dropdownMenu/DropdownMenuSeparator.d.ts +5 -0
  50. package/types/components/dropdownMenu/DropdownMenuTrigger.d.ts +9 -0
  51. package/types/components/dropdownMenu/dropdownMenuUtils.d.ts +3 -0
  52. package/types/components/footer/Footer.d.ts +13 -0
  53. package/types/components/footer/FooterCenter.d.ts +8 -0
  54. package/types/components/icons.d.ts +1 -1
  55. package/types/components/live-collaboration/LiveCollaborationTrigger.d.ts +10 -0
  56. package/types/components/main-menu/DefaultItems.d.ts +44 -0
  57. package/types/components/main-menu/MainMenu.d.ts +55 -0
  58. package/types/components/mainMenu/DefaultItems.d.ts +44 -0
  59. package/types/components/mainMenu/MainMenu.d.ts +63 -0
  60. package/types/components/welcome-screen/WelcomeScreen.Center.d.ts +58 -0
  61. package/types/components/welcome-screen/WelcomeScreen.Hints.d.ts +19 -0
  62. package/types/components/welcome-screen/WelcomeScreen.d.ts +85 -0
  63. package/types/constants.d.ts +6 -7
  64. package/types/element/Hyperlink.d.ts +9 -7
  65. package/types/element/bounds.d.ts +3 -2
  66. package/types/element/linearElementEditor.d.ts +38 -6
  67. package/types/element/newElement.d.ts +2 -2
  68. package/types/element/resizeElements.d.ts +0 -1
  69. package/types/element/textElement.d.ts +24 -2
  70. package/types/element/textWysiwyg.d.ts +6 -1
  71. package/types/element/transformHandles.d.ts +2 -3
  72. package/types/element/typeChecks.d.ts +10 -1
  73. package/types/element/types.d.ts +11 -4
  74. package/types/excalidraw-app/data/index.d.ts +13 -9
  75. package/types/excalidraw-app/data/localStorage.d.ts +13 -9
  76. package/types/keys.d.ts +2 -0
  77. package/types/math.d.ts +2 -1
  78. package/types/packages/excalidraw/example/CustomFooter.d.ts +5 -0
  79. package/types/packages/excalidraw/example/MobileFooter.d.ts +5 -0
  80. package/types/packages/excalidraw/index.d.ts +10 -0
  81. package/types/renderer/easingFunctions.d.ts +6 -0
  82. package/types/renderer/renderElement.d.ts +4 -3
  83. package/types/scene/Fonts.d.ts +21 -0
  84. package/types/scene/Scene.d.ts +15 -0
  85. package/types/scene/comparisons.d.ts +2 -3
  86. package/types/scene/index.d.ts +1 -1
  87. package/types/types.d.ts +43 -22
  88. package/types/utils.d.ts +17 -0
@@ -1,12 +1,18 @@
1
1
  /// <reference types="react" />
2
2
  export declare const actionToggleStats: {
3
3
  name: "stats";
4
+ viewMode: true;
4
5
  trackEvent: {
5
6
  category: "menu";
6
7
  };
7
8
  perform(elements: readonly import("../element/types").ExcalidrawElement[], appState: Readonly<import("../types").AppState>): {
8
9
  appState: {
9
10
  showStats: boolean;
11
+ contextMenu: {
12
+ items: import("../components/ContextMenu").ContextMenuItems;
13
+ top: number;
14
+ left: number;
15
+ } | null;
10
16
  showWelcomeScreen: boolean;
11
17
  isLoading: boolean;
12
18
  errorMessage: string | null;
@@ -46,10 +52,9 @@ export declare const actionToggleStats: {
46
52
  currentItemFontFamily: number;
47
53
  currentItemFontSize: number;
48
54
  currentItemTextAlign: string;
49
- currentItemStrokeSharpness: import("../element/types").StrokeSharpness;
50
55
  currentItemStartArrowhead: import("../element/types").Arrowhead | null;
51
56
  currentItemEndArrowhead: import("../element/types").Arrowhead | null;
52
- currentItemLinearStrokeSharpness: import("../element/types").StrokeSharpness;
57
+ currentItemRoundness: import("../element/types").StrokeRoundness;
53
58
  viewBackgroundColor: string;
54
59
  scrollX: number;
55
60
  scrollY: number;
@@ -64,7 +69,7 @@ export declare const actionToggleStats: {
64
69
  openMenu: "canvas" | "shape" | null;
65
70
  openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
66
71
  openSidebar: "library" | "customSidebar" | null;
67
- openDialog: "imageExport" | "help" | null;
72
+ openDialog: "imageExport" | "help" | "jsonExport" | null;
68
73
  isSidebarDocked: boolean;
69
74
  lastPointerDownWith: import("../element/types").PointerType;
70
75
  selectedElementIds: {
@@ -1,6 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  export declare const actionToggleViewMode: {
3
3
  name: "viewMode";
4
+ viewMode: true;
4
5
  trackEvent: {
5
6
  category: "canvas";
6
7
  predicate: (appState: Readonly<import("../types").AppState>) => boolean;
@@ -8,6 +9,11 @@ export declare const actionToggleViewMode: {
8
9
  perform(elements: readonly import("../element/types").ExcalidrawElement[], appState: Readonly<import("../types").AppState>, _: any, app: import("../types").AppClassProperties): {
9
10
  appState: {
10
11
  viewModeEnabled: boolean;
12
+ contextMenu: {
13
+ items: import("../components/ContextMenu").ContextMenuItems;
14
+ top: number;
15
+ left: number;
16
+ } | null;
11
17
  showWelcomeScreen: boolean;
12
18
  isLoading: boolean;
13
19
  errorMessage: string | null;
@@ -47,10 +53,9 @@ export declare const actionToggleViewMode: {
47
53
  currentItemFontFamily: number;
48
54
  currentItemFontSize: number;
49
55
  currentItemTextAlign: string;
50
- currentItemStrokeSharpness: import("../element/types").StrokeSharpness;
51
56
  currentItemStartArrowhead: import("../element/types").Arrowhead | null;
52
57
  currentItemEndArrowhead: import("../element/types").Arrowhead | null;
53
- currentItemLinearStrokeSharpness: import("../element/types").StrokeSharpness;
58
+ currentItemRoundness: import("../element/types").StrokeRoundness;
54
59
  viewBackgroundColor: string;
55
60
  scrollX: number;
56
61
  scrollY: number;
@@ -65,7 +70,7 @@ export declare const actionToggleViewMode: {
65
70
  openMenu: "canvas" | "shape" | null;
66
71
  openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
67
72
  openSidebar: "library" | "customSidebar" | null;
68
- openDialog: "imageExport" | "help" | null;
73
+ openDialog: "imageExport" | "help" | "jsonExport" | null;
69
74
  isSidebarDocked: boolean;
70
75
  lastPointerDownWith: import("../element/types").PointerType;
71
76
  selectedElementIds: {
@@ -116,6 +121,7 @@ export declare const actionToggleViewMode: {
116
121
  commitToHistory: false;
117
122
  };
118
123
  checked: (appState: Readonly<import("../types").AppState>) => boolean;
124
+ predicate: (elements: readonly import("../element/types").ExcalidrawElement[], appState: import("../types").AppState, appProps: import("../types").ExcalidrawProps) => boolean;
119
125
  contextItemLabel: string;
120
126
  keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
121
127
  } & {
@@ -1,6 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  export declare const actionToggleZenMode: {
3
3
  name: "zenMode";
4
+ viewMode: true;
4
5
  trackEvent: {
5
6
  category: "canvas";
6
7
  predicate: (appState: Readonly<import("../types").AppState>) => boolean;
@@ -8,6 +9,11 @@ export declare const actionToggleZenMode: {
8
9
  perform(elements: readonly import("../element/types").ExcalidrawElement[], appState: Readonly<import("../types").AppState>): {
9
10
  appState: {
10
11
  zenModeEnabled: boolean;
12
+ contextMenu: {
13
+ items: import("../components/ContextMenu").ContextMenuItems;
14
+ top: number;
15
+ left: number;
16
+ } | null;
11
17
  showWelcomeScreen: boolean;
12
18
  isLoading: boolean;
13
19
  errorMessage: string | null;
@@ -47,10 +53,9 @@ export declare const actionToggleZenMode: {
47
53
  currentItemFontFamily: number;
48
54
  currentItemFontSize: number;
49
55
  currentItemTextAlign: string;
50
- currentItemStrokeSharpness: import("../element/types").StrokeSharpness;
51
56
  currentItemStartArrowhead: import("../element/types").Arrowhead | null;
52
57
  currentItemEndArrowhead: import("../element/types").Arrowhead | null;
53
- currentItemLinearStrokeSharpness: import("../element/types").StrokeSharpness;
58
+ currentItemRoundness: import("../element/types").StrokeRoundness;
54
59
  viewBackgroundColor: string;
55
60
  scrollX: number;
56
61
  scrollY: number;
@@ -65,7 +70,7 @@ export declare const actionToggleZenMode: {
65
70
  openMenu: "canvas" | "shape" | null;
66
71
  openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
67
72
  openSidebar: "library" | "customSidebar" | null;
68
- openDialog: "imageExport" | "help" | null;
73
+ openDialog: "imageExport" | "help" | "jsonExport" | null;
69
74
  isSidebarDocked: boolean;
70
75
  lastPointerDownWith: import("../element/types").PointerType;
71
76
  selectedElementIds: {
@@ -116,6 +121,7 @@ export declare const actionToggleZenMode: {
116
121
  commitToHistory: false;
117
122
  };
118
123
  checked: (appState: Readonly<import("../types").AppState>) => boolean;
124
+ predicate: (elements: readonly import("../element/types").ExcalidrawElement[], appState: import("../types").AppState, appProps: import("../types").ExcalidrawProps) => boolean;
119
125
  contextItemLabel: string;
120
126
  keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
121
127
  } & {
@@ -12,9 +12,7 @@ export declare const actionSendBackward: {
12
12
  contextItemLabel: string;
13
13
  keyPriority: number;
14
14
  keyTest: (event: KeyboardEvent | React.KeyboardEvent<Element>) => boolean;
15
- PanelComponent: ({ updateData, appState }: import("./types").PanelComponentProps & {
16
- isInHamburgerMenu: boolean;
17
- }) => JSX.Element;
15
+ PanelComponent: ({ updateData, appState }: import("./types").PanelComponentProps) => JSX.Element;
18
16
  } & {
19
17
  keyTest?: ((event: KeyboardEvent | React.KeyboardEvent<Element>) => boolean) | undefined;
20
18
  };
@@ -31,9 +29,7 @@ export declare const actionBringForward: {
31
29
  contextItemLabel: string;
32
30
  keyPriority: number;
33
31
  keyTest: (event: KeyboardEvent | React.KeyboardEvent<Element>) => boolean;
34
- PanelComponent: ({ updateData, appState }: import("./types").PanelComponentProps & {
35
- isInHamburgerMenu: boolean;
36
- }) => JSX.Element;
32
+ PanelComponent: ({ updateData, appState }: import("./types").PanelComponentProps) => JSX.Element;
37
33
  } & {
38
34
  keyTest?: ((event: KeyboardEvent | React.KeyboardEvent<Element>) => boolean) | undefined;
39
35
  };
@@ -49,9 +45,7 @@ export declare const actionSendToBack: {
49
45
  };
50
46
  contextItemLabel: string;
51
47
  keyTest: (event: KeyboardEvent | React.KeyboardEvent<Element>) => boolean;
52
- PanelComponent: ({ updateData, appState }: import("./types").PanelComponentProps & {
53
- isInHamburgerMenu: boolean;
54
- }) => JSX.Element;
48
+ PanelComponent: ({ updateData, appState }: import("./types").PanelComponentProps) => JSX.Element;
55
49
  } & {
56
50
  keyTest?: ((event: KeyboardEvent | React.KeyboardEvent<Element>) => boolean) | undefined;
57
51
  };
@@ -67,9 +61,7 @@ export declare const actionBringToFront: {
67
61
  };
68
62
  contextItemLabel: string;
69
63
  keyTest: (event: KeyboardEvent | React.KeyboardEvent<Element>) => boolean;
70
- PanelComponent: ({ updateData, appState }: import("./types").PanelComponentProps & {
71
- isInHamburgerMenu: boolean;
72
- }) => JSX.Element;
64
+ PanelComponent: ({ updateData, appState }: import("./types").PanelComponentProps) => JSX.Element;
73
65
  } & {
74
66
  keyTest?: ((event: KeyboardEvent | React.KeyboardEvent<Element>) => boolean) | undefined;
75
67
  };
@@ -16,5 +16,6 @@ export declare class ActionManager {
16
16
  /**
17
17
  * @param data additional data sent to the PanelComponent
18
18
  */
19
- renderAction: (name: ActionName, data?: PanelComponentProps["data"], isInHamburgerMenu?: boolean) => JSX.Element | null;
19
+ renderAction: (name: ActionName, data?: PanelComponentProps["data"]) => JSX.Element | null;
20
+ isActionEnabled: (action: Action) => boolean;
20
21
  }
@@ -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" | "changeSharpness" | "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" | "eraser" | "bindText" | "toggleLock" | "toggleLinearEditor";
18
18
  export declare type PanelComponentProps = {
19
19
  elements: readonly ExcalidrawElement[];
20
20
  appState: AppState;
@@ -24,19 +24,20 @@ export declare type PanelComponentProps = {
24
24
  };
25
25
  export interface Action {
26
26
  name: ActionName;
27
- PanelComponent?: React.FC<PanelComponentProps & {
28
- isInHamburgerMenu: boolean;
29
- }>;
27
+ PanelComponent?: React.FC<PanelComponentProps>;
30
28
  perform: ActionFn;
31
29
  keyPriority?: number;
32
30
  keyTest?: (event: React.KeyboardEvent | KeyboardEvent, appState: AppState, elements: readonly ExcalidrawElement[]) => boolean;
33
31
  contextItemLabel?: string | ((elements: readonly ExcalidrawElement[], appState: Readonly<AppState>) => string);
34
- contextItemPredicate?: (elements: readonly ExcalidrawElement[], appState: AppState) => boolean;
32
+ predicate?: (elements: readonly ExcalidrawElement[], appState: AppState, appProps: ExcalidrawProps, app: AppClassProperties) => boolean;
35
33
  checked?: (appState: Readonly<AppState>) => boolean;
36
34
  trackEvent: false | {
37
35
  category: "toolbar" | "element" | "canvas" | "export" | "history" | "menu" | "collab" | "hyperlink";
38
36
  action?: string;
39
37
  predicate?: (appState: Readonly<AppState>, elements: readonly ExcalidrawElement[], value: any) => boolean;
40
38
  };
39
+ /** if set to `true`, allow action to be performed in viewMode.
40
+ * Defaults to `false` */
41
+ viewMode?: boolean;
41
42
  }
42
43
  export {};
@@ -14,13 +14,6 @@ export declare const clearAppStateForLocalStorage: (appState: Partial<AppState>)
14
14
  lastActiveToolBeforeEraser: import("./types").LastActiveToolBeforeEraser;
15
15
  locked: boolean;
16
16
  } | undefined;
17
- scrollX?: number | undefined;
18
- scrollY?: number | undefined;
19
- viewBackgroundColor?: string | undefined;
20
- zoom?: Readonly<{
21
- value: NormalizedZoomValue;
22
- }> | undefined;
23
- shouldCacheIgnoreZoom?: boolean | undefined;
24
17
  showWelcomeScreen?: boolean | undefined;
25
18
  penMode?: boolean | undefined;
26
19
  penDetected?: boolean | undefined;
@@ -38,12 +31,17 @@ export declare const clearAppStateForLocalStorage: (appState: Partial<AppState>)
38
31
  currentItemFontFamily?: number | undefined;
39
32
  currentItemFontSize?: number | undefined;
40
33
  currentItemTextAlign?: string | undefined;
41
- currentItemStrokeSharpness?: import("./element/types").StrokeSharpness | undefined;
42
34
  currentItemStartArrowhead?: import("./element/types").Arrowhead | null | undefined;
43
35
  currentItemEndArrowhead?: import("./element/types").Arrowhead | null | undefined;
44
- currentItemLinearStrokeSharpness?: import("./element/types").StrokeSharpness | undefined;
36
+ currentItemRoundness?: import("./element/types").StrokeRoundness | undefined;
37
+ viewBackgroundColor?: string | undefined;
38
+ scrollX?: number | undefined;
39
+ scrollY?: number | undefined;
45
40
  cursorButton?: "up" | "down" | undefined;
46
41
  scrolledOutside?: boolean | undefined;
42
+ zoom?: Readonly<{
43
+ value: NormalizedZoomValue;
44
+ }> | undefined;
47
45
  openMenu?: "canvas" | "shape" | null | undefined;
48
46
  openSidebar?: "library" | "customSidebar" | null | undefined;
49
47
  isSidebarDocked?: boolean | undefined;
@@ -54,6 +52,7 @@ export declare const clearAppStateForLocalStorage: (appState: Partial<AppState>)
54
52
  previousSelectedElementIds?: {
55
53
  [id: string]: boolean;
56
54
  } | undefined;
55
+ shouldCacheIgnoreZoom?: boolean | undefined;
57
56
  zenModeEnabled?: boolean | undefined;
58
57
  gridSize?: number | null | undefined;
59
58
  selectedGroupIds?: {
@@ -12,9 +12,14 @@ export declare const probablySupportsClipboardReadText: boolean;
12
12
  export declare const probablySupportsClipboardWriteText: boolean;
13
13
  export declare const probablySupportsClipboardBlob: boolean;
14
14
  export declare const copyToClipboard: (elements: readonly NonDeletedExcalidrawElement[], appState: AppState, files: BinaryFiles | null) => Promise<void>;
15
+ /**
16
+ * Retrieves content from system clipboard (either from ClipboardEvent or
17
+ * via async clipboard API if supported)
18
+ */
19
+ export declare const getSystemClipboard: (event: ClipboardEvent | null) => Promise<string>;
15
20
  /**
16
21
  * Attempts to parse clipboard. Prefers system clipboard.
17
22
  */
18
- export declare const parseClipboard: (event: ClipboardEvent | null) => Promise<ClipboardData>;
23
+ export declare const parseClipboard: (event: ClipboardEvent | null, isPlainPaste?: boolean) => Promise<ClipboardData>;
19
24
  export declare const copyBlobToClipboardAsPng: (blob: Blob | Promise<Blob>) => Promise<void>;
20
25
  export declare const copyTextToSystemClipboard: (text: string | null) => Promise<void>;
@@ -9,53 +9,11 @@ import Scene from "../scene/Scene";
9
9
  import { AppClassProperties, AppProps, AppState, ExcalidrawImperativeAPI, BinaryFiles, LibraryItems, SceneData, Device } from "../types";
10
10
  import { FileSystemHandle } from "../data/filesystem";
11
11
  import { ImportedDataState } from "../data/types";
12
- export declare const isMenuOpenAtom: import("jotai").Atom<boolean> & {
13
- write: (get: {
14
- <Value>(atom: import("jotai").Atom<Value | Promise<Value>>): Value;
15
- <Value_1>(atom: import("jotai").Atom<Promise<Value_1>>): Value_1;
16
- <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;
17
- } & {
18
- <Value_3>(atom: import("jotai").Atom<Value_3 | Promise<Value_3>>, options: {
19
- unstable_promise: true;
20
- }): Value_3 | Promise<Value_3>;
21
- <Value_4>(atom: import("jotai").Atom<Promise<Value_4>>, options: {
22
- unstable_promise: true;
23
- }): Value_4 | Promise<Value_4>;
24
- <Value_5>(atom: import("jotai").Atom<Value_5>, options: {
25
- unstable_promise: true;
26
- }): (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>;
27
- }, set: {
28
- <Value_6, Result extends void | Promise<void>>(atom: import("jotai").WritableAtom<Value_6, undefined, Result>): Result;
29
- <Value_7, Update, Result_1 extends void | Promise<void>>(atom: import("jotai").WritableAtom<Value_7, Update, Result_1>, update: Update): Result_1;
30
- }, update: boolean | ((prev: boolean) => boolean)) => void;
31
- onMount?: (<S extends (update: boolean | ((prev: boolean) => boolean)) => void>(setAtom: S) => void | (() => void)) | undefined;
32
- } & {
33
- init: boolean;
34
- };
35
- export declare const isDropdownOpenAtom: import("jotai").Atom<boolean> & {
36
- write: (get: {
37
- <Value>(atom: import("jotai").Atom<Value | Promise<Value>>): Value;
38
- <Value_1>(atom: import("jotai").Atom<Promise<Value_1>>): Value_1;
39
- <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;
40
- } & {
41
- <Value_3>(atom: import("jotai").Atom<Value_3 | Promise<Value_3>>, options: {
42
- unstable_promise: true;
43
- }): Value_3 | Promise<Value_3>;
44
- <Value_4>(atom: import("jotai").Atom<Promise<Value_4>>, options: {
45
- unstable_promise: true;
46
- }): Value_4 | Promise<Value_4>;
47
- <Value_5>(atom: import("jotai").Atom<Value_5>, options: {
48
- unstable_promise: true;
49
- }): (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>;
50
- }, set: {
51
- <Value_6, Result extends void | Promise<void>>(atom: import("jotai").WritableAtom<Value_6, undefined, Result>): Result;
52
- <Value_7, Update, Result_1 extends void | Promise<void>>(atom: import("jotai").WritableAtom<Value_7, Update, Result_1>, update: Update): Result_1;
53
- }, update: boolean | ((prev: boolean) => boolean)) => void;
54
- onMount?: (<S extends (update: boolean | ((prev: boolean) => boolean)) => void>(setAtom: S) => void | (() => void)) | undefined;
55
- } & {
56
- init: boolean;
57
- };
58
12
  export declare let showFourthFont: boolean;
13
+ export declare const ExcalidrawContainerContext: React.Context<{
14
+ container: HTMLDivElement | null;
15
+ id: string | null;
16
+ }>;
59
17
  export declare const useDevice: () => Readonly<{
60
18
  isSmScreen: boolean;
61
19
  isMobile: boolean;
@@ -69,6 +27,7 @@ export declare const useExcalidrawContainer: () => {
69
27
  export declare const useExcalidrawElements: () => readonly NonDeletedExcalidrawElement[];
70
28
  export declare const useExcalidrawAppState: () => AppState;
71
29
  export declare const useExcalidrawSetAppState: () => <K extends keyof AppState>(state: AppState | ((prevState: Readonly<AppState>, props: Readonly<any>) => AppState | Pick<AppState, K> | null) | Pick<AppState, K> | null, callback?: (() => void) | undefined) => void;
30
+ export declare const useExcalidrawActionManager: () => ActionManager;
72
31
  declare class App extends React.Component<AppProps, AppState> {
73
32
  canvas: AppClassProperties["canvas"];
74
33
  rc: RoughCanvas | null;
@@ -79,6 +38,7 @@ declare class App extends React.Component<AppProps, AppState> {
79
38
  private excalidrawContainerRef;
80
39
  static defaultProps: Partial<AppProps>;
81
40
  scene: Scene;
41
+ private fonts;
82
42
  private resizeObserver;
83
43
  private nearestScrollableContainer;
84
44
  library: AppClassProperties["library"];
@@ -91,7 +51,6 @@ declare class App extends React.Component<AppProps, AppState> {
91
51
  hitLinkElement?: NonDeletedExcalidrawElement;
92
52
  lastPointerDown: React.PointerEvent<HTMLCanvasElement> | null;
93
53
  lastPointerUp: React.PointerEvent<HTMLElement> | PointerEvent | null;
94
- contextMenuOpen: boolean;
95
54
  lastScenePointer: {
96
55
  x: number;
97
56
  y: number;
@@ -107,7 +66,6 @@ declare class App extends React.Component<AppProps, AppState> {
107
66
  private onBlur;
108
67
  private onUnload;
109
68
  private disableEvent;
110
- private onFontLoaded;
111
69
  private resetHistory;
112
70
  /**
113
71
  * Resets scene & history.
@@ -131,7 +89,7 @@ declare class App extends React.Component<AppProps, AppState> {
131
89
  private static resetTapTwice;
132
90
  private onTapStart;
133
91
  private onTapEnd;
134
- private pasteFromClipboard;
92
+ pasteFromClipboard: (event: ClipboardEvent | null) => Promise<void>;
135
93
  private addElementsFromPasteOrLibrary;
136
94
  private addTextFromPaste;
137
95
  setAppState: React.Component<any, AppState>["setState"];
@@ -253,8 +211,7 @@ declare class App extends React.Component<AppProps, AppState> {
253
211
  private handleCanvasContextMenu;
254
212
  private maybeDragNewGenericElement;
255
213
  private maybeHandleResize;
256
- /** @private use this.handleCanvasContextMenu */
257
- private _openContextMenu;
214
+ private getContextMenuItems;
258
215
  private handleWheel;
259
216
  private getTextWysiwygSnappedToCenterPosition;
260
217
  private savePointer;
@@ -0,0 +1,15 @@
1
+ /// <reference types="react" />
2
+ import "./Button.scss";
3
+ interface ButtonProps extends React.HTMLAttributes<HTMLButtonElement> {
4
+ type?: "button" | "submit" | "reset";
5
+ onSelect: () => any;
6
+ children: React.ReactNode;
7
+ className?: string;
8
+ }
9
+ /**
10
+ * A generic button component that follows Excalidraw's design system.
11
+ * Style can be customised using `className` or `style` prop.
12
+ * Accepts all props that a regular `button` element accepts.
13
+ */
14
+ export declare const Button: ({ type, onSelect, children, className, ...rest }: ButtonProps) => JSX.Element;
15
+ export {};
@@ -1,8 +1,7 @@
1
1
  import "./CollabButton.scss";
2
- declare const CollabButton: ({ isCollaborating, collaboratorCount, onClick, isInHamburgerMenu, }: {
2
+ declare const CollabButton: ({ isCollaborating, collaboratorCount, onClick, }: {
3
3
  isCollaborating: boolean;
4
4
  collaboratorCount: number;
5
5
  onClick: () => void;
6
- isInHamburgerMenu?: boolean | undefined;
7
6
  }) => JSX.Element;
8
7
  export default CollabButton;
@@ -1,28 +1,15 @@
1
1
  import "./ContextMenu.scss";
2
2
  import { Action } from "../actions/types";
3
3
  import { ActionManager } from "../actions/manager";
4
- import { AppState } from "../types";
5
- import { NonDeletedExcalidrawElement } from "../element/types";
6
- export declare type ContextMenuOption = "separator" | Action;
4
+ import React from "react";
5
+ export declare type ContextMenuItem = typeof CONTEXT_MENU_SEPARATOR | Action;
6
+ export declare type ContextMenuItems = (ContextMenuItem | false | null | undefined)[];
7
7
  declare type ContextMenuProps = {
8
- options: ContextMenuOption[];
9
- onCloseRequest?(): void;
8
+ actionManager: ActionManager;
9
+ items: ContextMenuItems;
10
10
  top: number;
11
11
  left: number;
12
- actionManager: ActionManager;
13
- appState: Readonly<AppState>;
14
- elements: readonly NonDeletedExcalidrawElement[];
15
- };
16
- declare type ContextMenuParams = {
17
- options: (ContextMenuOption | false | null | undefined)[];
18
- top: ContextMenuProps["top"];
19
- left: ContextMenuProps["left"];
20
- actionManager: ContextMenuProps["actionManager"];
21
- appState: Readonly<AppState>;
22
- container: HTMLElement;
23
- elements: readonly NonDeletedExcalidrawElement[];
24
- };
25
- declare const _default: {
26
- push(params: ContextMenuParams): void;
27
12
  };
28
- export default _default;
13
+ export declare const CONTEXT_MENU_SEPARATOR = "separator";
14
+ export declare const ContextMenu: React.MemoExoticComponent<({ actionManager, items, top, left }: ContextMenuProps) => JSX.Element>;
15
+ export {};
@@ -1,13 +1,15 @@
1
+ import React from "react";
1
2
  import { NonDeletedExcalidrawElement } from "../element/types";
2
3
  import { AppState, ExportOpts, BinaryFiles } from "../types";
3
4
  import "./ExportDialog.scss";
4
5
  import { ActionManager } from "../actions/manager";
5
6
  export declare type ExportCB = (elements: readonly NonDeletedExcalidrawElement[], scale?: number) => void;
6
- export declare const JSONExportDialog: ({ elements, appState, files, actionManager, exportOpts, canvas, }: {
7
+ export declare const JSONExportDialog: ({ elements, appState, files, actionManager, exportOpts, canvas, setAppState, }: {
7
8
  elements: readonly NonDeletedExcalidrawElement[];
8
9
  appState: AppState;
9
10
  files: BinaryFiles;
10
11
  actionManager: ActionManager;
11
12
  exportOpts: ExportOpts;
12
13
  canvas: HTMLCanvasElement | null;
14
+ setAppState: React.Component<any, AppState>["setState"];
13
15
  }) => JSX.Element;
@@ -13,7 +13,6 @@ interface LayerUIProps {
13
13
  canvas: HTMLCanvasElement | null;
14
14
  setAppState: React.Component<any, AppState>["setState"];
15
15
  elements: readonly NonDeletedExcalidrawElement[];
16
- onCollabButtonClick?: () => void;
17
16
  onLockToggle: () => void;
18
17
  onPenModeToggle: () => void;
19
18
  onInsertElements: (elements: readonly NonDeletedExcalidrawElement[]) => void;
@@ -21,7 +20,6 @@ interface LayerUIProps {
21
20
  langCode: Language["code"];
22
21
  isCollaborating: boolean;
23
22
  renderTopRightUI?: ExcalidrawProps["renderTopRightUI"];
24
- renderCustomFooter?: ExcalidrawProps["renderFooter"];
25
23
  renderCustomStats?: ExcalidrawProps["renderCustomStats"];
26
24
  renderCustomSidebar?: ExcalidrawProps["renderSidebar"];
27
25
  libraryReturnUrl: ExcalidrawProps["libraryReturnUrl"];
@@ -33,6 +31,7 @@ interface LayerUIProps {
33
31
  insertOnCanvasDirectly: boolean;
34
32
  }) => void;
35
33
  renderWelcomeScreen: boolean;
34
+ children?: React.ReactNode;
36
35
  }
37
- declare const _default: React.MemoExoticComponent<({ actionManager, appState, files, setAppState, elements, canvas, onCollabButtonClick, onLockToggle, onPenModeToggle, onInsertElements, showExitZenModeBtn, isCollaborating, renderTopRightUI, renderCustomFooter, renderCustomStats, renderCustomSidebar, libraryReturnUrl, UIOptions, focusContainer, library, id, onImageAction, renderWelcomeScreen, }: LayerUIProps) => JSX.Element>;
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>;
38
37
  export default _default;
@@ -1,6 +1,29 @@
1
1
  import React from "react";
2
2
  import Library from "../data/library";
3
3
  import { AppState, LibraryItem } from "../types";
4
+ export declare const isLibraryMenuOpenAtom: import("jotai").Atom<boolean> & {
5
+ write: (get: {
6
+ <Value>(atom: import("jotai").Atom<Value | Promise<Value>>): Value;
7
+ <Value_1>(atom: import("jotai").Atom<Promise<Value_1>>): Value_1;
8
+ <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;
9
+ } & {
10
+ <Value_3>(atom: import("jotai").Atom<Value_3 | Promise<Value_3>>, options: {
11
+ unstable_promise: true;
12
+ }): Value_3 | Promise<Value_3>;
13
+ <Value_4>(atom: import("jotai").Atom<Promise<Value_4>>, options: {
14
+ unstable_promise: true;
15
+ }): Value_4 | Promise<Value_4>;
16
+ <Value_5>(atom: import("jotai").Atom<Value_5>, options: {
17
+ unstable_promise: true;
18
+ }): (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>;
19
+ }, set: {
20
+ <Value_6, Result extends void | Promise<void>>(atom: import("jotai").WritableAtom<Value_6, undefined, Result>): Result;
21
+ <Value_7, Update, Result_1 extends void | Promise<void>>(atom: import("jotai").WritableAtom<Value_7, Update, Result_1>, update: Update): Result_1;
22
+ }, update: boolean | ((prev: boolean) => boolean)) => void;
23
+ onMount?: (<S extends (update: boolean | ((prev: boolean) => boolean)) => void>(setAtom: S) => void | (() => void)) | undefined;
24
+ } & {
25
+ init: boolean;
26
+ };
4
27
  export declare const LibraryMenuHeader: React.FC<{
5
28
  setAppState: React.Component<any, AppState>["setState"];
6
29
  selectedItems: LibraryItem["id"][];
@@ -1,5 +1,5 @@
1
1
  import React from "react";
2
- import { AppState, Device, ExcalidrawProps } from "../types";
2
+ import { AppState, Device, ExcalidrawProps, UIWelcomeScreenComponents } from "../types";
3
3
  import { ActionManager } from "../actions/manager";
4
4
  import { NonDeletedExcalidrawElement } from "../element/types";
5
5
  declare type MobileMenuProps = {
@@ -9,12 +9,9 @@ declare type MobileMenuProps = {
9
9
  renderImageExportDialog: () => React.ReactNode;
10
10
  setAppState: React.Component<any, AppState>["setState"];
11
11
  elements: readonly NonDeletedExcalidrawElement[];
12
- onCollabButtonClick?: () => void;
13
12
  onLockToggle: () => void;
14
13
  onPenModeToggle: () => void;
15
14
  canvas: HTMLCanvasElement | null;
16
- isCollaborating: boolean;
17
- renderCustomFooter?: (isMobile: boolean, appState: AppState) => JSX.Element | null;
18
15
  onImageAction: (data: {
19
16
  insertOnCanvasDirectly: boolean;
20
17
  }) => void;
@@ -22,7 +19,8 @@ declare type MobileMenuProps = {
22
19
  renderCustomStats?: ExcalidrawProps["renderCustomStats"];
23
20
  renderSidebars: () => JSX.Element | null;
24
21
  device: Device;
25
- renderWelcomeScreen?: boolean;
22
+ renderMenu: () => React.ReactNode;
23
+ welcomeScreenCenter: UIWelcomeScreenComponents["Center"];
26
24
  };
27
- export declare const MobileMenu: ({ appState, elements, actionManager, renderJSONExportDialog, renderImageExportDialog, setAppState, onCollabButtonClick, onLockToggle, onPenModeToggle, canvas, isCollaborating, renderCustomFooter, onImageAction, renderTopRightUI, renderCustomStats, renderSidebars, device, renderWelcomeScreen, }: MobileMenuProps) => JSX.Element;
25
+ export declare const MobileMenu: ({ appState, elements, actionManager, setAppState, onLockToggle, onPenModeToggle, canvas, onImageAction, renderTopRightUI, renderCustomStats, renderSidebars, device, renderMenu, welcomeScreenCenter, }: MobileMenuProps) => JSX.Element;
28
26
  export {};
@@ -1,10 +1,8 @@
1
1
  import "./UserList.scss";
2
2
  import React from "react";
3
3
  import { AppState } from "../types";
4
- import { ActionManager } from "../actions/manager";
5
4
  export declare const UserList: React.FC<{
6
5
  className?: string;
7
6
  mobile?: boolean;
8
7
  collaborators: AppState["collaborators"];
9
- actionManager: ActionManager;
10
8
  }>;