@zsviczian/excalidraw 0.15.3-obsidian → 0.16.1-obsidian-1

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 (148) hide show
  1. package/dist/excalidraw.development.js +318 -87
  2. package/dist/excalidraw.production.min.js +1 -1
  3. package/dist/excalidraw.production.min.js.LICENSE.txt +0 -9
  4. package/package.json +3 -3
  5. package/types/actions/actionAddToLibrary.d.ts +24 -3
  6. package/types/actions/actionAlign.d.ts +6 -6
  7. package/types/actions/actionBoundText.d.ts +16 -2
  8. package/types/actions/actionCanvas.d.ts +100 -16
  9. package/types/actions/actionClipboard.d.ts +40 -5
  10. package/types/actions/actionDeleteSelected.d.ts +25 -4
  11. package/types/actions/actionDistribute.d.ts +2 -2
  12. package/types/actions/actionDuplicateSelection.d.ts +1 -1
  13. package/types/actions/actionElementLock.d.ts +16 -2
  14. package/types/actions/actionExport.d.ts +78 -15
  15. package/types/actions/actionFinalize.d.ts +17 -3
  16. package/types/actions/actionFrame.d.ts +24 -3
  17. package/types/actions/actionGroup.d.ts +18 -4
  18. package/types/actions/actionLinearEditor.d.ts +8 -1
  19. package/types/actions/actionMenu.d.ts +26 -5
  20. package/types/actions/actionNavigate.d.ts +1 -1
  21. package/types/actions/actionProperties.d.ts +119 -26
  22. package/types/actions/actionSelectAll.d.ts +8 -1
  23. package/types/actions/actionStyles.d.ts +8 -1
  24. package/types/actions/actionToggleGridMode.d.ts +8 -1
  25. package/types/actions/actionToggleObjectsSnapMode.d.ts +169 -0
  26. package/types/actions/actionToggleStats.d.ts +8 -1
  27. package/types/actions/actionToggleViewMode.d.ts +8 -1
  28. package/types/actions/actionToggleZenMode.d.ts +8 -1
  29. package/types/actions/actionZindex.d.ts +4 -4
  30. package/types/actions/index.d.ts +1 -0
  31. package/types/actions/manager.d.ts +1 -1
  32. package/types/actions/shortcuts.d.ts +1 -1
  33. package/types/actions/types.d.ts +1 -1
  34. package/types/appState.d.ts +2 -1
  35. package/types/components/Actions.d.ts +6 -6
  36. package/types/components/ActiveConfirmDialog.d.ts +1 -1
  37. package/types/components/App.d.ts +22 -4
  38. package/types/components/Avatar.d.ts +1 -1
  39. package/types/components/BraveMeasureTextError.d.ts +1 -1
  40. package/types/components/Button.d.ts +1 -1
  41. package/types/components/ButtonIconSelect.d.ts +1 -1
  42. package/types/components/ColorPicker/ColorInput.d.ts +3 -1
  43. package/types/components/ColorPicker/ColorPicker.d.ts +1 -1
  44. package/types/components/ColorPicker/CustomColorList.d.ts +1 -1
  45. package/types/components/ColorPicker/HotkeyLabel.d.ts +1 -1
  46. package/types/components/ColorPicker/Picker.d.ts +1 -1
  47. package/types/components/ColorPicker/PickerColorList.d.ts +1 -1
  48. package/types/components/ColorPicker/PickerHeading.d.ts +1 -1
  49. package/types/components/ColorPicker/ShadeList.d.ts +1 -1
  50. package/types/components/ColorPicker/TopPicks.d.ts +1 -1
  51. package/types/components/ColorPicker/colorPickerUtils.d.ts +1 -1
  52. package/types/components/ConfirmDialog.d.ts +1 -1
  53. package/types/components/ContextMenu.d.ts +1 -1
  54. package/types/components/DarkModeToggle.d.ts +1 -1
  55. package/types/components/DefaultSidebar.d.ts +1 -1
  56. package/types/components/Dialog.d.ts +1 -1
  57. package/types/components/DialogActionButton.d.ts +1 -1
  58. package/types/components/ErrorDialog.d.ts +1 -1
  59. package/types/components/ExcalidrawLogo.d.ts +15 -0
  60. package/types/components/EyeDropper.d.ts +18 -7
  61. package/types/components/FixedSideContainer.d.ts +1 -1
  62. package/types/components/HandButton.d.ts +1 -1
  63. package/types/components/HelpButton.d.ts +1 -1
  64. package/types/components/HelpDialog.d.ts +1 -1
  65. package/types/components/HintViewer.d.ts +1 -1
  66. package/types/components/IconPicker.d.ts +1 -1
  67. package/types/components/ImageExportDialog.d.ts +2 -2
  68. package/types/components/InitializeApp.d.ts +1 -1
  69. package/types/components/JSONExportDialog.d.ts +1 -1
  70. package/types/components/LayerUI.d.ts +1 -1
  71. package/types/components/LibraryMenu.d.ts +2 -2
  72. package/types/components/LibraryMenuBrowseButton.d.ts +1 -1
  73. package/types/components/LibraryMenuControlButtons.d.ts +1 -1
  74. package/types/components/LibraryMenuHeaderContent.d.ts +1 -1
  75. package/types/components/LibraryMenuItems.d.ts +1 -1
  76. package/types/components/LibraryMenuSection.d.ts +2 -2
  77. package/types/components/LibraryUnit.d.ts +2 -2
  78. package/types/components/LockButton.d.ts +1 -1
  79. package/types/components/MermaidToExcalidraw.d.ts +12 -0
  80. package/types/components/MobileMenu.d.ts +1 -1
  81. package/types/components/OverwriteConfirm/OverwriteConfirm.d.ts +4 -4
  82. package/types/components/OverwriteConfirm/OverwriteConfirmActions.d.ts +6 -6
  83. package/types/components/PasteChartDialog.d.ts +1 -1
  84. package/types/components/PenModeButton.d.ts +1 -1
  85. package/types/components/Popover.d.ts +1 -1
  86. package/types/components/ProjectName.d.ts +1 -1
  87. package/types/components/PublishLibrary.d.ts +1 -1
  88. package/types/components/RadioGroup.d.ts +1 -1
  89. package/types/components/Sidebar/Sidebar.d.ts +8 -8
  90. package/types/components/Sidebar/SidebarHeader.d.ts +1 -1
  91. package/types/components/Sidebar/SidebarTab.d.ts +1 -1
  92. package/types/components/Sidebar/SidebarTabTrigger.d.ts +1 -1
  93. package/types/components/Sidebar/SidebarTabTriggers.d.ts +1 -1
  94. package/types/components/Sidebar/SidebarTabs.d.ts +1 -1
  95. package/types/components/Sidebar/SidebarTrigger.d.ts +1 -1
  96. package/types/components/Spinner.d.ts +1 -1
  97. package/types/components/Stack.d.ts +2 -2
  98. package/types/components/Stats.d.ts +1 -1
  99. package/types/components/Switch.d.ts +1 -1
  100. package/types/components/Toast.d.ts +1 -1
  101. package/types/components/Tooltip.d.ts +1 -1
  102. package/types/components/canvases/InteractiveCanvas.d.ts +1 -1
  103. package/types/components/canvases/StaticCanvas.d.ts +1 -1
  104. package/types/components/dropdownMenu/DropdownMenu.d.ts +8 -8
  105. package/types/components/dropdownMenu/DropdownMenuContent.d.ts +1 -1
  106. package/types/components/dropdownMenu/DropdownMenuGroup.d.ts +1 -1
  107. package/types/components/dropdownMenu/DropdownMenuItem.d.ts +1 -1
  108. package/types/components/dropdownMenu/DropdownMenuItemContent.d.ts +1 -1
  109. package/types/components/dropdownMenu/DropdownMenuItemCustom.d.ts +1 -1
  110. package/types/components/dropdownMenu/DropdownMenuItemLink.d.ts +1 -1
  111. package/types/components/dropdownMenu/DropdownMenuSeparator.d.ts +1 -1
  112. package/types/components/dropdownMenu/DropdownMenuTrigger.d.ts +1 -1
  113. package/types/components/dropdownMenu/dropdownMenuUtils.d.ts +2 -2
  114. package/types/components/footer/Footer.d.ts +1 -1
  115. package/types/components/footer/FooterCenter.d.ts +1 -1
  116. package/types/components/icons.d.ts +128 -126
  117. package/types/components/live-collaboration/LiveCollaborationTrigger.d.ts +1 -1
  118. package/types/components/main-menu/DefaultItems.d.ts +10 -10
  119. package/types/components/main-menu/MainMenu.d.ts +6 -6
  120. package/types/components/welcome-screen/WelcomeScreen.Center.d.ts +9 -9
  121. package/types/components/welcome-screen/WelcomeScreen.Hints.d.ts +3 -3
  122. package/types/components/welcome-screen/WelcomeScreen.d.ts +13 -13
  123. package/types/constants.d.ts +5 -0
  124. package/types/data/transform.d.ts +3 -1
  125. package/types/element/Hyperlink.d.ts +10 -3
  126. package/types/element/bounds.d.ts +4 -5
  127. package/types/element/dragElements.d.ts +11 -2
  128. package/types/element/embeddable.d.ts +8 -1
  129. package/types/element/linearElementEditor.d.ts +9 -2
  130. package/types/element/resizeElements.d.ts +2 -2
  131. package/types/frame.d.ts +1 -1
  132. package/types/hooks/useStable.d.ts +1 -0
  133. package/types/keys.d.ts +1 -0
  134. package/types/math.d.ts +2 -0
  135. package/types/packages/excalidraw/example/App.d.ts +1 -1
  136. package/types/packages/excalidraw/example/CustomFooter.d.ts +1 -1
  137. package/types/packages/excalidraw/example/MobileFooter.d.ts +1 -1
  138. package/types/packages/excalidraw/example/sidebar/ExampleSidebar.d.ts +1 -1
  139. package/types/packages/excalidraw/index.d.ts +1 -1
  140. package/types/packages/excalidraw/webpack.dev.config.d.ts +11 -0
  141. package/types/packages/excalidraw/webpack.prod.config.d.ts +11 -0
  142. package/types/packages/utils.d.ts +1 -0
  143. package/types/renderer/renderSnaps.d.ts +2 -0
  144. package/types/scene/selection.d.ts +1 -0
  145. package/types/shapes.d.ts +10 -10
  146. package/types/snapping.d.ts +108 -0
  147. package/types/types.d.ts +26 -3
  148. package/types/utils.d.ts +1 -1
@@ -29,6 +29,11 @@ export declare const POINTER_BUTTON: {
29
29
  readonly SECONDARY: 2;
30
30
  readonly TOUCH: -1;
31
31
  };
32
+ export declare const POINTER_EVENTS: {
33
+ readonly enabled: "all";
34
+ readonly disabled: "none";
35
+ readonly inheritFromUI: any;
36
+ };
32
37
  export declare enum EVENT {
33
38
  COPY = "copy",
34
39
  PASTE = "paste",
@@ -68,4 +68,6 @@ export type ExcalidrawElementSkeleton = Extract<Exclude<ExcalidrawElement, Excal
68
68
  y: number;
69
69
  fileId: FileId;
70
70
  } & Partial<ExcalidrawImageElement>);
71
- export declare const convertToExcalidrawElements: (elements: ExcalidrawElementSkeleton[] | null) => ExcalidrawElement[];
71
+ export declare const convertToExcalidrawElements: (elements: ExcalidrawElementSkeleton[] | null, opts?: {
72
+ regenerateIds: boolean;
73
+ }) => ExcalidrawElement[];
@@ -12,7 +12,7 @@ export declare const Hyperlink: ({ element, setAppState, onLinkOpen, setToast, }
12
12
  closable?: boolean;
13
13
  duration?: number;
14
14
  } | null) => void;
15
- }) => JSX.Element | null;
15
+ }) => import("react/jsx-runtime").JSX.Element | null;
16
16
  export declare const actionLink: {
17
17
  name: "hyperlink";
18
18
  perform: (elements: readonly import("./types").ExcalidrawElement[], appState: Readonly<AppState>) => false | {
@@ -54,7 +54,7 @@ export declare const actionLink: {
54
54
  lastActiveTool: import("../types").LastActiveTool;
55
55
  locked: boolean;
56
56
  } & ({
57
- type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand";
57
+ type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand" | "mermaid";
58
58
  customType: null;
59
59
  } | {
60
60
  type: "custom";
@@ -157,10 +157,17 @@ export declare const actionLink: {
157
157
  gridColor: {
158
158
  Bold: string;
159
159
  Regular: string;
160
+ MajorGridFrequency?: number | undefined;
160
161
  };
161
162
  dynamicStyle: string;
162
163
  invertBindingBehaviour: boolean;
163
164
  selectedLinearElement: import("./linearElementEditor").LinearElementEditor | null;
165
+ snapLines: import("../snapping").SnapLine[];
166
+ originSnapOffset: {
167
+ x: number;
168
+ y: number;
169
+ } | null;
170
+ objectsSnapModeEnabled: boolean;
164
171
  };
165
172
  commitToHistory: true;
166
173
  };
@@ -171,7 +178,7 @@ export declare const actionLink: {
171
178
  keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
172
179
  contextItemLabel: (elements: readonly import("./types").ExcalidrawElement[], appState: Readonly<AppState>) => "labels.link.editEmbed" | "labels.link.edit" | "labels.link.createEmbed" | "labels.link.create";
173
180
  predicate: (elements: readonly import("./types").ExcalidrawElement[], appState: AppState) => boolean;
174
- PanelComponent: ({ elements, appState, updateData }: import("../actions/types").PanelComponentProps) => JSX.Element;
181
+ PanelComponent: ({ elements, appState, updateData }: import("../actions/types").PanelComponentProps) => import("react/jsx-runtime").JSX.Element;
175
182
  } & {
176
183
  keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
177
184
  };
@@ -15,11 +15,6 @@ export declare class ElementBounds {
15
15
  private static calculateBounds;
16
16
  }
17
17
  export declare const getElementAbsoluteCoords: (element: ExcalidrawElement, includeBoundText?: boolean) => [number, number, number, number, number, number];
18
- /**
19
- * for a given element, `getElementLineSegments` returns line segments
20
- * that can be used for visual collision detection (useful for frames)
21
- * as opposed to bounding box collision detection
22
- */
23
18
  export declare const getElementLineSegments: (element: ExcalidrawElement) => [Point, Point][];
24
19
  /**
25
20
  * Scene -> Scene coords, but in x1,x2,y1,y2 format.
@@ -34,6 +29,10 @@ export declare const getMinMaxXYFromCurvePathOps: (ops: Op[], transformXY?: ((x:
34
29
  export declare const getArrowheadPoints: (element: ExcalidrawLinearElement, shape: Drawable[], position: "start" | "end", arrowhead: Arrowhead) => number[] | null;
35
30
  export declare const getElementBounds: (element: ExcalidrawElement) => Bounds;
36
31
  export declare const getCommonBounds: (elements: readonly ExcalidrawElement[]) => Bounds;
32
+ export declare const getDraggedElementsBounds: (elements: ExcalidrawElement[], dragOffset: {
33
+ x: number;
34
+ y: number;
35
+ }) => number[];
37
36
  export declare const getResizedElementAbsoluteCoords: (element: ExcalidrawElement, nextWidth: number, nextHeight: number, normalizePoints: boolean) => [number, number, number, number];
38
37
  export declare const getElementPointsCoords: (element: ExcalidrawLinearElement, points: readonly (readonly [number, number])[]) => [number, number, number, number];
39
38
  export declare const getClosestElementBounds: (elements: readonly ExcalidrawElement[], from: {
@@ -1,6 +1,15 @@
1
1
  import { NonDeletedExcalidrawElement } from "./types";
2
2
  import { AppState, PointerDownState } from "../types";
3
3
  import Scene from "../scene/Scene";
4
- export declare const dragSelectedElements: (pointerDownState: PointerDownState, selectedElements: NonDeletedExcalidrawElement[], pointerX: number, pointerY: number, lockDirection: boolean | undefined, distanceX: number | undefined, distanceY: number | undefined, appState: AppState, scene: Scene) => void;
4
+ export declare const dragSelectedElements: (pointerDownState: PointerDownState, selectedElements: NonDeletedExcalidrawElement[], offset: {
5
+ x: number;
6
+ y: number;
7
+ }, appState: AppState, scene: Scene, snapOffset: {
8
+ x: number;
9
+ y: number;
10
+ }, gridSize: AppState["gridSize"]) => void;
5
11
  export declare const getDragOffsetXY: (selectedElements: NonDeletedExcalidrawElement[], x: number, y: number) => [number, number];
6
- export declare const dragNewElement: (draggingElement: NonDeletedExcalidrawElement, elementType: AppState["activeTool"]["type"], originX: number, originY: number, x: number, y: number, width: number, height: number, shouldMaintainAspectRatio: boolean, shouldResizeFromCenter: boolean, widthAspectRatio?: number | null) => void;
12
+ export declare const dragNewElement: (draggingElement: NonDeletedExcalidrawElement, elementType: AppState["activeTool"]["type"], originX: number, originY: number, x: number, y: number, width: number, height: number, shouldMaintainAspectRatio: boolean, shouldResizeFromCenter: boolean, widthAspectRatio?: number | null, originOffset?: {
13
+ x: number;
14
+ y: number;
15
+ } | null) => void;
@@ -28,7 +28,7 @@ export declare const actionSetEmbeddableAsActiveTool: {
28
28
  lastActiveTool: import("../types").LastActiveTool;
29
29
  locked: boolean;
30
30
  } & ({
31
- type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand";
31
+ type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand" | "mermaid";
32
32
  customType: null;
33
33
  } | {
34
34
  type: "custom";
@@ -163,10 +163,17 @@ export declare const actionSetEmbeddableAsActiveTool: {
163
163
  gridColor: {
164
164
  Bold: string;
165
165
  Regular: string;
166
+ MajorGridFrequency?: number | undefined;
166
167
  };
167
168
  dynamicStyle: string;
168
169
  invertBindingBehaviour: boolean;
169
170
  selectedLinearElement: import("./linearElementEditor").LinearElementEditor | null;
171
+ snapLines: import("../snapping").SnapLine[];
172
+ originSnapOffset: {
173
+ x: number;
174
+ y: number;
175
+ } | null;
176
+ objectsSnapModeEnabled: boolean;
170
177
  };
171
178
  commitToHistory: false;
172
179
  };
@@ -155,7 +155,7 @@ export declare class LinearElementEditor {
155
155
  lastActiveTool: import("../types").LastActiveTool;
156
156
  locked: boolean;
157
157
  } & ({
158
- type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand";
158
+ type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand" | "mermaid";
159
159
  customType: null;
160
160
  } | {
161
161
  type: "custom";
@@ -260,10 +260,17 @@ export declare class LinearElementEditor {
260
260
  gridColor: {
261
261
  Bold: string;
262
262
  Regular: string;
263
+ MajorGridFrequency?: number | undefined;
263
264
  };
264
265
  dynamicStyle: string;
265
266
  invertBindingBehaviour: boolean;
266
267
  selectedLinearElement: LinearElementEditor | null;
268
+ snapLines: import("../snapping").SnapLine[];
269
+ originSnapOffset: {
270
+ x: number;
271
+ y: number;
272
+ } | null;
273
+ objectsSnapModeEnabled: boolean;
267
274
  };
268
275
  };
269
276
  static deletePoints(element: NonDeleted<ExcalidrawLinearElement>, pointIndices: readonly number[]): void;
@@ -279,7 +286,7 @@ export declare class LinearElementEditor {
279
286
  endBinding?: PointBinding;
280
287
  }): void;
281
288
  static shouldAddMidpoint(linearElementEditor: LinearElementEditor, pointerCoords: PointerCoords, appState: AppState): boolean;
282
- static addMidpoint(linearElementEditor: LinearElementEditor, pointerCoords: PointerCoords, appState: AppState): {
289
+ static addMidpoint(linearElementEditor: LinearElementEditor, pointerCoords: PointerCoords, appState: AppState, snapToGrid: boolean): {
283
290
  pointerDownState: LinearElementEditor["pointerDownState"];
284
291
  selectedPointsIndices: LinearElementEditor["selectedPointsIndices"];
285
292
  } | undefined;
@@ -1,8 +1,8 @@
1
1
  import { ExcalidrawLinearElement, NonDeletedExcalidrawElement, NonDeleted } from "./types";
2
2
  import { MaybeTransformHandleType, TransformHandleDirection } from "./transformHandles";
3
- import { PointerDownState } from "../types";
3
+ import { AppState, PointerDownState } from "../types";
4
4
  export declare const normalizeAngle: (angle: number) => number;
5
- export declare const transformElements: (pointerDownState: PointerDownState, transformHandleType: MaybeTransformHandleType, selectedElements: readonly NonDeletedExcalidrawElement[], resizeArrowDirection: "origin" | "end", shouldRotateWithDiscreteAngle: boolean, shouldResizeFromCenter: boolean, shouldMaintainAspectRatio: boolean, pointerX: number, pointerY: number, centerX: number, centerY: number) => boolean;
5
+ export declare const transformElements: (pointerDownState: PointerDownState, transformHandleType: MaybeTransformHandleType, selectedElements: readonly NonDeletedExcalidrawElement[], resizeArrowDirection: "origin" | "end", shouldRotateWithDiscreteAngle: boolean, shouldResizeFromCenter: boolean, shouldMaintainAspectRatio: boolean, pointerX: number, pointerY: number, centerX: number, centerY: number, appState: AppState) => boolean;
6
6
  export declare const resizeSingleElement: (originalElements: PointerDownState["originalElements"], shouldMaintainAspectRatio: boolean, element: NonDeletedExcalidrawElement, transformHandleDirection: TransformHandleDirection, shouldResizeFromCenter: boolean, pointerX: number, pointerY: number) => void;
7
7
  export declare const resizeMultipleElements: (pointerDownState: PointerDownState, selectedElements: readonly NonDeletedExcalidrawElement[], transformHandleType: "nw" | "ne" | "sw" | "se", shouldResizeFromCenter: boolean, pointerX: number, pointerY: number) => void;
8
8
  export declare const getResizeOffsetXY: (transformHandleType: MaybeTransformHandleType, selectedElements: NonDeletedExcalidrawElement[], x: number, y: number) => [number, number];
package/types/frame.d.ts CHANGED
@@ -25,7 +25,7 @@ export declare const addElementsToFrame: (allElements: ExcalidrawElementsIncludi
25
25
  export declare const removeElementsFromFrame: (allElements: ExcalidrawElementsIncludingDeleted, elementsToRemove: NonDeletedExcalidrawElement[], appState: AppState) => ExcalidrawElement[];
26
26
  export declare const removeAllElementsFromFrame: (allElements: ExcalidrawElementsIncludingDeleted, frame: ExcalidrawFrameElement, appState: AppState) => ExcalidrawElement[];
27
27
  export declare const replaceAllElementsInFrame: (allElements: ExcalidrawElementsIncludingDeleted, nextElementsInFrame: ExcalidrawElement[], frame: ExcalidrawFrameElement, appState: AppState) => ExcalidrawElement[];
28
- /** does not mutate elements, but return new ones */
28
+ /** does not mutate elements, but returns new ones */
29
29
  export declare const updateFrameMembershipOfSelectedElements: (allElements: ExcalidrawElementsIncludingDeleted, appState: AppState, app: AppClassProperties) => ExcalidrawElementsIncludingDeleted;
30
30
  /**
31
31
  * filters out elements that are inside groups that contain a frame element
@@ -0,0 +1 @@
1
+ export declare const useStable: <T extends Record<string, any>>(value: T) => T;
package/types/keys.d.ts CHANGED
@@ -19,6 +19,7 @@ export declare const CODES: {
19
19
  readonly V: "KeyV";
20
20
  readonly Z: "KeyZ";
21
21
  readonly R: "KeyR";
22
+ readonly S: "KeyS";
22
23
  };
23
24
  export declare const KEYS: {
24
25
  readonly ARROW_DOWN: "ArrowDown";
package/types/math.d.ts CHANGED
@@ -28,3 +28,5 @@ export declare const getBezierCurveLength: (element: NonDeleted<ExcalidrawLinear
28
28
  export declare const mapIntervalToBezierT: (element: NonDeleted<ExcalidrawLinearElement>, endPoint: readonly [number, number], interval: number) => number;
29
29
  export declare const arePointsEqual: (p1: readonly [number, number], p2: readonly [number, number]) => boolean;
30
30
  export declare const isRightAngle: (angle: number) => boolean;
31
+ export declare const rangesOverlap: ([a0, a1]: [number, number], [b0, b1]: [number, number]) => boolean;
32
+ export declare const rangeIntersection: (rangeA: [number, number], rangeB: [number, number]) => [number, number] | null;
@@ -11,4 +11,4 @@ export interface AppProps {
11
11
  useCustom: (api: ExcalidrawImperativeAPI | null, customArgs?: any[]) => void;
12
12
  customArgs?: any[];
13
13
  }
14
- export default function App({ appTitle, useCustom, customArgs }: AppProps): JSX.Element;
14
+ export default function App({ appTitle, useCustom, customArgs }: AppProps): import("react/jsx-runtime").JSX.Element;
@@ -1,5 +1,5 @@
1
1
  import { ExcalidrawImperativeAPI } from "../../../types";
2
2
  declare const CustomFooter: ({ excalidrawAPI, }: {
3
3
  excalidrawAPI: ExcalidrawImperativeAPI;
4
- }) => JSX.Element;
4
+ }) => import("react/jsx-runtime").JSX.Element;
5
5
  export default CustomFooter;
@@ -1,5 +1,5 @@
1
1
  import { ExcalidrawImperativeAPI } from "../../../types";
2
2
  declare const MobileFooter: ({ excalidrawAPI, }: {
3
3
  excalidrawAPI: ExcalidrawImperativeAPI;
4
- }) => JSX.Element | null;
4
+ }) => import("react/jsx-runtime").JSX.Element | null;
5
5
  export default MobileFooter;
@@ -2,4 +2,4 @@ import React from "react";
2
2
  import "./ExampleSidebar.scss";
3
3
  export default function Sidebar({ children }: {
4
4
  children: React.ReactNode;
5
- }): JSX.Element;
5
+ }): import("react/jsx-runtime").JSX.Element;
@@ -20,7 +20,7 @@ getDefaultLineHeight, //zsviczian
20
20
  wrapText, //zsviczian
21
21
  getFontString, //zsviczian
22
22
  getBoundTextMaxWidth, //zsviczian
23
- exportToClipboard, mergeLibraryItems, } from "../../packages/utils";
23
+ exportToClipboard, mergeLibraryItems, mermaidToExcalidraw, } from "../../packages/utils";
24
24
  export { isLinearElement } from "../../element/typeChecks";
25
25
  export { FONT_FAMILY, THEME, MIME_TYPES } from "../../constants";
26
26
  export { mutateElement, newElementWith, bumpVersion, } from "../../element/mutateElement";
@@ -30,6 +30,15 @@ export namespace module {
30
30
  };
31
31
  };
32
32
  })[];
33
+ resolve?: undefined;
34
+ type?: undefined;
35
+ } | {
36
+ test: RegExp;
37
+ resolve: {
38
+ fullySpecified: boolean;
39
+ };
40
+ exclude?: undefined;
41
+ use?: undefined;
33
42
  type?: undefined;
34
43
  } | {
35
44
  test: RegExp;
@@ -44,12 +53,14 @@ export namespace module {
44
53
  configFile: string;
45
54
  };
46
55
  })[];
56
+ resolve?: undefined;
47
57
  type?: undefined;
48
58
  } | {
49
59
  test: RegExp;
50
60
  type: string;
51
61
  exclude?: undefined;
52
62
  use?: undefined;
63
+ resolve?: undefined;
53
64
  })[];
54
65
  }
55
66
  export namespace optimization {
@@ -31,6 +31,15 @@ export namespace module {
31
31
  };
32
32
  };
33
33
  })[];
34
+ resolve?: undefined;
35
+ type?: undefined;
36
+ } | {
37
+ test: RegExp;
38
+ resolve: {
39
+ fullySpecified: boolean;
40
+ };
41
+ exclude?: undefined;
42
+ use?: undefined;
34
43
  type?: undefined;
35
44
  } | {
36
45
  test: RegExp;
@@ -57,12 +66,14 @@ export namespace module {
57
66
  configFile?: undefined;
58
67
  };
59
68
  })[];
69
+ resolve?: undefined;
60
70
  type?: undefined;
61
71
  } | {
62
72
  test: RegExp;
63
73
  type: string;
64
74
  exclude?: undefined;
65
75
  use?: undefined;
76
+ resolve?: undefined;
66
77
  })[];
67
78
  }
68
79
  export namespace optimization {
@@ -41,3 +41,4 @@ export { measureText, wrapText, getDefaultLineHeight, } from "../element/textEle
41
41
  export { getFontString } from "../utils";
42
42
  export { getBoundTextMaxWidth } from "../element/textElement";
43
43
  export { mergeLibraryItems } from "../data/library";
44
+ export { mermaidToExcalidraw } from "../components/MermaidToExcalidraw";
@@ -0,0 +1,2 @@
1
+ import { InteractiveCanvasAppState } from "../types";
2
+ export declare const renderSnaps: (context: CanvasRenderingContext2D, appState: InteractiveCanvasAppState) => void;
@@ -8,6 +8,7 @@ import { AppState, InteractiveCanvasAppState } from "../types";
8
8
  */
9
9
  export declare const excludeElementsInFramesFromSelection: <T extends ExcalidrawElement>(selectedElements: readonly T[]) => T[];
10
10
  export declare const getElementsWithinSelection: (elements: readonly NonDeletedExcalidrawElement[], selection: NonDeletedExcalidrawElement, excludeElementsInFrames?: boolean) => NonDeletedExcalidrawElement[];
11
+ export declare const getVisibleAndNonSelectedElements: (elements: readonly NonDeletedExcalidrawElement[], selectedElements: readonly NonDeletedExcalidrawElement[], appState: AppState) => NonDeletedExcalidrawElement[];
11
12
  export declare const isSomeElementSelected: {
12
13
  (elements: readonly NonDeletedExcalidrawElement[], appState: Pick<AppState, "selectedElementIds">): boolean;
13
14
  clearCache(): void;
package/types/shapes.d.ts CHANGED
@@ -1,59 +1,59 @@
1
1
  export declare const SHAPES: readonly [{
2
- readonly icon: JSX.Element;
2
+ readonly icon: import("react/jsx-runtime").JSX.Element;
3
3
  readonly value: "selection";
4
4
  readonly key: "v";
5
5
  readonly numericKey: "1";
6
6
  readonly fillable: true;
7
7
  }, {
8
- readonly icon: JSX.Element;
8
+ readonly icon: import("react/jsx-runtime").JSX.Element;
9
9
  readonly value: "rectangle";
10
10
  readonly key: "r";
11
11
  readonly numericKey: "2";
12
12
  readonly fillable: true;
13
13
  }, {
14
- readonly icon: JSX.Element;
14
+ readonly icon: import("react/jsx-runtime").JSX.Element;
15
15
  readonly value: "diamond";
16
16
  readonly key: "d";
17
17
  readonly numericKey: "3";
18
18
  readonly fillable: true;
19
19
  }, {
20
- readonly icon: JSX.Element;
20
+ readonly icon: import("react/jsx-runtime").JSX.Element;
21
21
  readonly value: "ellipse";
22
22
  readonly key: "o";
23
23
  readonly numericKey: "4";
24
24
  readonly fillable: true;
25
25
  }, {
26
- readonly icon: JSX.Element;
26
+ readonly icon: import("react/jsx-runtime").JSX.Element;
27
27
  readonly value: "arrow";
28
28
  readonly key: "a";
29
29
  readonly numericKey: "5";
30
30
  readonly fillable: true;
31
31
  }, {
32
- readonly icon: JSX.Element;
32
+ readonly icon: import("react/jsx-runtime").JSX.Element;
33
33
  readonly value: "line";
34
34
  readonly key: "l";
35
35
  readonly numericKey: "6";
36
36
  readonly fillable: true;
37
37
  }, {
38
- readonly icon: JSX.Element;
38
+ readonly icon: import("react/jsx-runtime").JSX.Element;
39
39
  readonly value: "freedraw";
40
40
  readonly key: readonly ["p", "x"];
41
41
  readonly numericKey: "7";
42
42
  readonly fillable: false;
43
43
  }, {
44
- readonly icon: JSX.Element;
44
+ readonly icon: import("react/jsx-runtime").JSX.Element;
45
45
  readonly value: "text";
46
46
  readonly key: "t";
47
47
  readonly numericKey: "8";
48
48
  readonly fillable: false;
49
49
  }, {
50
- readonly icon: JSX.Element;
50
+ readonly icon: import("react/jsx-runtime").JSX.Element;
51
51
  readonly value: "image";
52
52
  readonly key: null;
53
53
  readonly numericKey: "9";
54
54
  readonly fillable: false;
55
55
  }, {
56
- readonly icon: JSX.Element;
56
+ readonly icon: import("react/jsx-runtime").JSX.Element;
57
57
  readonly value: "eraser";
58
58
  readonly key: "e";
59
59
  readonly numericKey: "0";
@@ -0,0 +1,108 @@
1
+ import { Bounds } from "./element/bounds";
2
+ import { MaybeTransformHandleType } from "./element/transformHandles";
3
+ import { ExcalidrawElement, NonDeletedExcalidrawElement } from "./element/types";
4
+ import { AppState, KeyboardModifiersObject, Point } from "./types";
5
+ export declare const getSnapDistance: (zoomValue: number) => number;
6
+ type Vector2D = {
7
+ x: number;
8
+ y: number;
9
+ };
10
+ type PointPair = [Point, Point];
11
+ export type PointSnap = {
12
+ type: "point";
13
+ points: PointPair;
14
+ offset: number;
15
+ };
16
+ export type Gap = {
17
+ startBounds: Bounds;
18
+ endBounds: Bounds;
19
+ startSide: [Point, Point];
20
+ endSide: [Point, Point];
21
+ overlap: [number, number];
22
+ length: number;
23
+ };
24
+ export type GapSnap = {
25
+ type: "gap";
26
+ direction: "center_horizontal" | "center_vertical" | "side_left" | "side_right" | "side_top" | "side_bottom";
27
+ gap: Gap;
28
+ offset: number;
29
+ };
30
+ export type GapSnaps = GapSnap[];
31
+ export type Snap = GapSnap | PointSnap;
32
+ export type Snaps = Snap[];
33
+ export type PointSnapLine = {
34
+ type: "points";
35
+ points: Point[];
36
+ };
37
+ export type PointerSnapLine = {
38
+ type: "pointer";
39
+ points: PointPair;
40
+ direction: "horizontal" | "vertical";
41
+ };
42
+ export type GapSnapLine = {
43
+ type: "gap";
44
+ direction: "horizontal" | "vertical";
45
+ points: PointPair;
46
+ };
47
+ export type SnapLine = PointSnapLine | GapSnapLine | PointerSnapLine;
48
+ export declare class SnapCache {
49
+ private static referenceSnapPoints;
50
+ private static visibleGaps;
51
+ static setReferenceSnapPoints: (snapPoints: Point[] | null) => void;
52
+ static getReferenceSnapPoints: () => (readonly [number, number])[] | null;
53
+ static setVisibleGaps: (gaps: {
54
+ verticalGaps: Gap[];
55
+ horizontalGaps: Gap[];
56
+ } | null) => void;
57
+ static getVisibleGaps: () => {
58
+ verticalGaps: Gap[];
59
+ horizontalGaps: Gap[];
60
+ } | null;
61
+ static destroy: () => void;
62
+ }
63
+ export declare const isSnappingEnabled: ({ event, appState, selectedElements, }: {
64
+ appState: AppState;
65
+ event: KeyboardModifiersObject;
66
+ selectedElements: NonDeletedExcalidrawElement[];
67
+ }) => boolean;
68
+ export declare const areRoughlyEqual: (a: number, b: number, precision?: number) => boolean;
69
+ export declare const getElementsCorners: (elements: ExcalidrawElement[], { omitCenter, boundingBoxCorners, dragOffset, }?: {
70
+ omitCenter?: boolean | undefined;
71
+ boundingBoxCorners?: boolean | undefined;
72
+ dragOffset?: Vector2D | undefined;
73
+ }) => Point[];
74
+ export declare const getVisibleGaps: (elements: readonly NonDeletedExcalidrawElement[], selectedElements: ExcalidrawElement[], appState: AppState) => {
75
+ horizontalGaps: Gap[];
76
+ verticalGaps: Gap[];
77
+ };
78
+ export declare const getReferenceSnapPoints: (elements: readonly NonDeletedExcalidrawElement[], selectedElements: ExcalidrawElement[], appState: AppState) => (readonly [number, number])[];
79
+ export declare const snapDraggedElements: (selectedElements: ExcalidrawElement[], dragOffset: Vector2D, appState: AppState, event: KeyboardModifiersObject) => {
80
+ snapOffset: {
81
+ x: number;
82
+ y: number;
83
+ };
84
+ snapLines: (PointSnapLine | GapSnapLine)[];
85
+ };
86
+ export declare const snapResizingElements: (selectedElements: ExcalidrawElement[], selectedOriginalElements: ExcalidrawElement[], appState: AppState, event: KeyboardModifiersObject, dragOffset: Vector2D, transformHandle: MaybeTransformHandleType) => {
87
+ snapOffset: {
88
+ x: number;
89
+ y: number;
90
+ };
91
+ snapLines: PointSnapLine[];
92
+ };
93
+ export declare const snapNewElement: (draggingElement: ExcalidrawElement, appState: AppState, event: KeyboardModifiersObject, origin: Vector2D, dragOffset: Vector2D) => {
94
+ snapOffset: {
95
+ x: number;
96
+ y: number;
97
+ };
98
+ snapLines: PointSnapLine[];
99
+ };
100
+ export declare const getSnapLinesAtPointer: (elements: readonly ExcalidrawElement[], appState: AppState, pointer: Vector2D, event: KeyboardModifiersObject) => {
101
+ originOffset: {
102
+ x: number;
103
+ y: number;
104
+ };
105
+ snapLines: PointerSnapLine[];
106
+ };
107
+ export declare const isActiveToolNonLinearSnappable: (activeToolType: AppState["activeTool"]["type"]) => boolean;
108
+ export {};
package/types/types.d.ts CHANGED
@@ -16,6 +16,7 @@ import Library from "./data/library";
16
16
  import type { FileSystemHandle } from "./data/filesystem";
17
17
  import type { IMAGE_MIME_TYPES, MIME_TYPES } from "./constants";
18
18
  import { ContextMenuItems } from "./components/ContextMenu";
19
+ import { SnapLine } from "./snapping";
19
20
  import { Merge, ForwardRef, ValueOf } from "./utility-types";
20
21
  import { ColorPaletteCustom } from "./colors";
21
22
  export type Point = Readonly<RoughPoint>;
@@ -58,7 +59,7 @@ export type BinaryFileData = {
58
59
  export type BinaryFileMetadata = Omit<BinaryFileData, "dataURL">;
59
60
  export type BinaryFiles = Record<ExcalidrawElement["id"], BinaryFileData>;
60
61
  export type LastActiveTool = {
61
- type: typeof SHAPES[number]["value"] | "eraser" | "hand" | "frame" | "embeddable";
62
+ type: typeof SHAPES[number]["value"] | "eraser" | "hand" | "frame" | "embeddable" | "mermaid";
62
63
  customType: null;
63
64
  } | {
64
65
  type: "custom";
@@ -106,6 +107,8 @@ export type InteractiveCanvasAppState = Readonly<_CommonCanvasAppState & {
106
107
  openSidebar: AppState["openSidebar"];
107
108
  showHyperlinkPopup: AppState["showHyperlinkPopup"];
108
109
  collaborators: AppState["collaborators"];
110
+ snapLines: AppState["snapLines"];
111
+ zenModeEnabled: AppState["zenModeEnabled"];
109
112
  }>;
110
113
  export type AppState = {
111
114
  contextMenu: {
@@ -146,7 +149,7 @@ export type AppState = {
146
149
  lastActiveTool: LastActiveTool;
147
150
  locked: boolean;
148
151
  } & ({
149
- type: typeof SHAPES[number]["value"] | "eraser" | "hand" | "frame" | "embeddable";
152
+ type: typeof SHAPES[number]["value"] | "eraser" | "hand" | "frame" | "embeddable" | "mermaid";
150
153
  customType: null;
151
154
  } | {
152
155
  type: "custom";
@@ -260,10 +263,17 @@ export type AppState = {
260
263
  gridColor: {
261
264
  Bold: string;
262
265
  Regular: string;
266
+ MajorGridFrequency?: number;
263
267
  };
264
268
  dynamicStyle: string;
265
269
  invertBindingBehaviour: boolean;
266
270
  selectedLinearElement: LinearElementEditor | null;
271
+ snapLines: SnapLine[];
272
+ originSnapOffset: {
273
+ x: number;
274
+ y: number;
275
+ } | null;
276
+ objectsSnapModeEnabled: boolean;
267
277
  };
268
278
  export type UIAppState = Omit<AppState, "suggestedBindings" | "startBoundElement" | "cursorButton" | "scrollX" | "scrollY">;
269
279
  export type NormalizedZoomValue = number & {
@@ -333,6 +343,7 @@ export interface ExcalidrawProps {
333
343
  viewModeEnabled?: boolean;
334
344
  zenModeEnabled?: boolean;
335
345
  gridModeEnabled?: boolean;
346
+ objectsSnapModeEnabled?: boolean;
336
347
  libraryReturnUrl?: string;
337
348
  initState?: AppState;
338
349
  theme?: Theme;
@@ -406,8 +417,9 @@ export type AppProps = Merge<ExcalidrawProps, {
406
417
  * in the app, eg Manager. Factored out into a separate type to keep DRY. */
407
418
  export type AppClassProperties = {
408
419
  props: AppProps;
409
- canvas: HTMLCanvasElement;
410
420
  interactiveCanvas: HTMLCanvasElement | null;
421
+ /** static canvas */
422
+ canvas: HTMLCanvasElement;
411
423
  focusContainer(): void;
412
424
  library: Library;
413
425
  imageCache: Map<FileId, {
@@ -422,6 +434,11 @@ export type AppClassProperties = {
422
434
  onInsertElements: App["onInsertElements"];
423
435
  onExportImage: App["onExportImage"];
424
436
  lastViewportPosition: App["lastViewportPosition"];
437
+ scrollToContent: App["scrollToContent"];
438
+ addFiles: App["addFiles"];
439
+ setSelection: App["setSelection"];
440
+ addElementsFromPasteOrLibrary: App["addElementsFromPasteOrLibrary"];
441
+ setActiveTool: App["setActiveTool"];
425
442
  };
426
443
  export type PointerDownState = Readonly<{
427
444
  origin: Readonly<{
@@ -543,4 +560,10 @@ export type FrameNameBoundsCache = {
543
560
  versionNonce: ExcalidrawFrameElement["versionNonce"];
544
561
  }>;
545
562
  };
563
+ export type KeyboardModifiersObject = {
564
+ ctrlKey: boolean;
565
+ shiftKey: boolean;
566
+ altKey: boolean;
567
+ metaKey: boolean;
568
+ };
546
569
  export {};
package/types/utils.d.ts CHANGED
@@ -81,7 +81,7 @@ export declare const selectNode: (node: Element) => void;
81
81
  export declare const removeSelection: () => void;
82
82
  export declare const distance: (x: number, y: number) => number;
83
83
  export declare const updateActiveTool: (appState: Pick<AppState, "activeTool">, data: ({
84
- type: (typeof SHAPES)[number]["value"] | "eraser" | "hand" | "frame" | "embeddable";
84
+ type: (typeof SHAPES)[number]["value"] | "eraser" | "hand" | "frame" | "embeddable" | "mermaid";
85
85
  } | {
86
86
  type: "custom";
87
87
  customType: string;