@excalidraw/excalidraw 0.18.0-414182f → 0.18.0-4e0441e

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/dist/dev/{chunk-QF5FRM6O.js → chunk-LLUJPE5U.js} +48 -26
  2. package/dist/dev/chunk-LLUJPE5U.js.map +7 -0
  3. package/dist/dev/{chunk-WWDIUJ2Q.js → chunk-YMRX7R7U.js} +50 -51
  4. package/dist/dev/chunk-YMRX7R7U.js.map +7 -0
  5. package/dist/dev/data/{image-VTYIFRQE.js → image-L23D26XS.js} +2 -2
  6. package/dist/dev/index.css +989 -592
  7. package/dist/dev/index.css.map +3 -3
  8. package/dist/dev/index.js +4782 -2938
  9. package/dist/dev/index.js.map +4 -4
  10. package/dist/dev/locales/{en-SMAPCEOQ.js → en-YSPYSBUR.js} +4 -2
  11. package/dist/prod/chunk-HT4FKTIQ.js +4 -0
  12. package/dist/prod/chunk-RSFMSEP5.js +12 -0
  13. package/dist/prod/data/{image-YQ6UXXDA.js → image-NWF7UX55.js} +1 -1
  14. package/dist/prod/index.css +1 -1
  15. package/dist/prod/index.js +22 -22
  16. package/dist/prod/locales/en-SFRQHD7K.js +1 -0
  17. package/dist/types/common/src/constants.d.ts +11 -1
  18. package/dist/types/common/src/utils.d.ts +3 -1
  19. package/dist/types/element/src/renderElement.d.ts +4 -1
  20. package/dist/types/element/src/transformHandles.d.ts +1 -1
  21. package/dist/types/excalidraw/actions/actionAddToLibrary.d.ts +21 -6
  22. package/dist/types/excalidraw/actions/actionBoundText.d.ts +14 -4
  23. package/dist/types/excalidraw/actions/actionCanvas.d.ts +92 -40
  24. package/dist/types/excalidraw/actions/actionClipboard.d.ts +42 -12
  25. package/dist/types/excalidraw/actions/actionCropEditor.d.ts +7 -2
  26. package/dist/types/excalidraw/actions/actionDeleteSelected.d.ts +21 -6
  27. package/dist/types/excalidraw/actions/actionElementLink.d.ts +7 -2
  28. package/dist/types/excalidraw/actions/actionElementLock.d.ts +14 -4
  29. package/dist/types/excalidraw/actions/actionEmbeddable.d.ts +7 -2
  30. package/dist/types/excalidraw/actions/actionExport.d.ts +63 -18
  31. package/dist/types/excalidraw/actions/actionFinalize.d.ts +14 -4
  32. package/dist/types/excalidraw/actions/actionFrame.d.ts +28 -8
  33. package/dist/types/excalidraw/actions/actionGroup.d.ts +14 -4
  34. package/dist/types/excalidraw/actions/actionLinearEditor.d.ts +8 -3
  35. package/dist/types/excalidraw/actions/actionLink.d.ts +6 -1
  36. package/dist/types/excalidraw/actions/actionMenu.d.ts +7 -368
  37. package/dist/types/excalidraw/actions/actionNavigate.d.ts +14 -4
  38. package/dist/types/excalidraw/actions/actionProperties.d.ts +122 -38
  39. package/dist/types/excalidraw/actions/actionSelectAll.d.ts +7 -2
  40. package/dist/types/excalidraw/actions/actionStyles.d.ts +7 -2
  41. package/dist/types/excalidraw/actions/actionToggleGridMode.d.ts +7 -2
  42. package/dist/types/excalidraw/actions/actionToggleObjectsSnapMode.d.ts +7 -2
  43. package/dist/types/excalidraw/actions/actionToggleSearchMenu.d.ts +7 -2
  44. package/dist/types/excalidraw/actions/actionToggleStats.d.ts +7 -2
  45. package/dist/types/excalidraw/actions/actionToggleViewMode.d.ts +7 -2
  46. package/dist/types/excalidraw/actions/actionToggleZenMode.d.ts +7 -2
  47. package/dist/types/excalidraw/actions/index.d.ts +2 -2
  48. package/dist/types/excalidraw/actions/types.d.ts +1 -1
  49. package/dist/types/excalidraw/appState.d.ts +5 -1
  50. package/dist/types/excalidraw/clipboard.d.ts +2 -0
  51. package/dist/types/excalidraw/components/Actions.d.ts +17 -3
  52. package/dist/types/excalidraw/components/App.d.ts +1 -2
  53. package/dist/types/excalidraw/components/ColorPicker/ColorPicker.d.ts +1 -0
  54. package/dist/types/excalidraw/components/ColorPicker/Picker.d.ts +2 -0
  55. package/dist/types/excalidraw/components/ColorPicker/PickerColorList.d.ts +2 -1
  56. package/dist/types/excalidraw/components/ColorPicker/ShadeList.d.ts +2 -1
  57. package/dist/types/excalidraw/components/CommandPalette/CommandPalette.d.ts +1 -0
  58. package/dist/types/excalidraw/components/ExcalidrawLogo.d.ts +1 -1
  59. package/dist/types/excalidraw/components/FontPicker/FontPicker.d.ts +2 -1
  60. package/dist/types/excalidraw/components/FontPicker/FontPickerTrigger.d.ts +3 -1
  61. package/dist/types/excalidraw/components/InlineIcon.d.ts +3 -1
  62. package/dist/types/excalidraw/components/LayerUI.d.ts +2 -1
  63. package/dist/types/excalidraw/components/LibraryMenuSection.d.ts +1 -1
  64. package/dist/types/excalidraw/components/MobileMenu.d.ts +3 -5
  65. package/dist/types/excalidraw/components/MobileToolBar.d.ts +11 -0
  66. package/dist/types/excalidraw/components/Popover.d.ts +2 -1
  67. package/dist/types/excalidraw/components/PropertiesPopover.d.ts +1 -0
  68. package/dist/types/excalidraw/components/TTDDialog/TTDDialogTrigger.d.ts +1 -2
  69. package/dist/types/excalidraw/components/TextField.d.ts +1 -0
  70. package/dist/types/excalidraw/components/ToolPopover.d.ts +25 -0
  71. package/dist/types/excalidraw/components/dropdownMenu/DropdownMenu.d.ts +4 -2
  72. package/dist/types/excalidraw/components/dropdownMenu/DropdownMenuContent.d.ts +2 -1
  73. package/dist/types/excalidraw/components/icons.d.ts +5 -0
  74. package/dist/types/excalidraw/data/blob.d.ts +2 -2
  75. package/dist/types/excalidraw/data/types.d.ts +4 -1
  76. package/dist/types/excalidraw/hooks/useLibraryItemSvg.d.ts +1 -1
  77. package/dist/types/excalidraw/hooks/useTextEditorFocus.d.ts +14 -0
  78. package/dist/types/excalidraw/shortcut.d.ts +1 -0
  79. package/dist/types/excalidraw/types.d.ts +10 -3
  80. package/dist/types/math/src/segment.d.ts +1 -0
  81. package/package.json +4 -4
  82. package/dist/dev/chunk-QF5FRM6O.js.map +0 -7
  83. package/dist/dev/chunk-WWDIUJ2Q.js.map +0 -7
  84. package/dist/prod/chunk-I4UNSFV6.js +0 -12
  85. package/dist/prod/chunk-VTWWEYSQ.js +0 -4
  86. package/dist/prod/locales/en-TYY6KWIJ.js +0 -1
  87. /package/dist/dev/data/{image-VTYIFRQE.js.map → image-L23D26XS.js.map} +0 -0
  88. /package/dist/dev/locales/{en-SMAPCEOQ.js.map → en-YSPYSBUR.js.map} +0 -0
@@ -48,6 +48,10 @@ export declare const actionToggleStats: {
48
48
  locked: boolean;
49
49
  fromSelection: boolean;
50
50
  } & import("../types").ActiveTool;
51
+ preferredSelectionTool: {
52
+ type: "selection" | "lasso";
53
+ initialized: boolean;
54
+ };
51
55
  penMode: boolean;
52
56
  penDetected: boolean;
53
57
  exportBackground: boolean;
@@ -80,8 +84,8 @@ export declare const actionToggleStats: {
80
84
  zoom: Readonly<{
81
85
  value: import("../types").NormalizedZoomValue;
82
86
  }>;
83
- openMenu: "canvas" | "shape" | null;
84
- openPopup: "fontFamily" | "canvasBackground" | "elementBackground" | "elementStroke" | null;
87
+ openMenu: "canvas" | null;
88
+ openPopup: "fontFamily" | "canvasBackground" | "elementBackground" | "elementStroke" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
85
89
  openSidebar: {
86
90
  name: string;
87
91
  tab?: string | undefined;
@@ -178,6 +182,7 @@ export declare const actionToggleStats: {
178
182
  lockedMultiSelections: {
179
183
  [groupId: string]: true;
180
184
  };
185
+ stylesPanelMode: "compact" | "full" | "mobile";
181
186
  };
182
187
  captureUpdate: "EVENTUALLY";
183
188
  };
@@ -45,6 +45,10 @@ export declare const actionToggleViewMode: {
45
45
  locked: boolean;
46
46
  fromSelection: boolean;
47
47
  } & import("../types").ActiveTool;
48
+ preferredSelectionTool: {
49
+ type: "selection" | "lasso";
50
+ initialized: boolean;
51
+ };
48
52
  penMode: boolean;
49
53
  penDetected: boolean;
50
54
  exportBackground: boolean;
@@ -77,8 +81,8 @@ export declare const actionToggleViewMode: {
77
81
  zoom: Readonly<{
78
82
  value: import("../types").NormalizedZoomValue;
79
83
  }>;
80
- openMenu: "canvas" | "shape" | null;
81
- openPopup: "fontFamily" | "canvasBackground" | "elementBackground" | "elementStroke" | null;
84
+ openMenu: "canvas" | null;
85
+ openPopup: "fontFamily" | "canvasBackground" | "elementBackground" | "elementStroke" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
82
86
  openSidebar: {
83
87
  name: string;
84
88
  tab?: string | undefined;
@@ -178,6 +182,7 @@ export declare const actionToggleViewMode: {
178
182
  lockedMultiSelections: {
179
183
  [groupId: string]: true;
180
184
  };
185
+ stylesPanelMode: "compact" | "full" | "mobile";
181
186
  };
182
187
  captureUpdate: "EVENTUALLY";
183
188
  };
@@ -45,6 +45,10 @@ export declare const actionToggleZenMode: {
45
45
  locked: boolean;
46
46
  fromSelection: boolean;
47
47
  } & import("../types").ActiveTool;
48
+ preferredSelectionTool: {
49
+ type: "selection" | "lasso";
50
+ initialized: boolean;
51
+ };
48
52
  penMode: boolean;
49
53
  penDetected: boolean;
50
54
  exportBackground: boolean;
@@ -77,8 +81,8 @@ export declare const actionToggleZenMode: {
77
81
  zoom: Readonly<{
78
82
  value: import("../types").NormalizedZoomValue;
79
83
  }>;
80
- openMenu: "canvas" | "shape" | null;
81
- openPopup: "fontFamily" | "canvasBackground" | "elementBackground" | "elementStroke" | null;
84
+ openMenu: "canvas" | null;
85
+ openPopup: "fontFamily" | "canvasBackground" | "elementBackground" | "elementStroke" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
82
86
  openSidebar: {
83
87
  name: string;
84
88
  tab?: string | undefined;
@@ -178,6 +182,7 @@ export declare const actionToggleZenMode: {
178
182
  lockedMultiSelections: {
179
183
  [groupId: string]: true;
180
184
  };
185
+ stylesPanelMode: "compact" | "full" | "mobile";
181
186
  };
182
187
  captureUpdate: "EVENTUALLY";
183
188
  };
@@ -2,13 +2,13 @@ export { actionDeleteSelected } from "./actionDeleteSelected";
2
2
  export { actionBringForward, actionBringToFront, actionSendBackward, actionSendToBack, } from "./actionZindex";
3
3
  export { actionSelectAll } from "./actionSelectAll";
4
4
  export { actionDuplicateSelection } from "./actionDuplicateSelection";
5
- export { actionChangeStrokeColor, actionChangeBackgroundColor, actionChangeStrokeWidth, actionChangeFillStyle, actionChangeSloppiness, actionChangeOpacity, actionChangeFontSize, actionChangeFontFamily, actionChangeTextAlign, actionChangeVerticalAlign, } from "./actionProperties";
5
+ export { actionChangeStrokeColor, actionChangeBackgroundColor, actionChangeStrokeWidth, actionChangeFillStyle, actionChangeSloppiness, actionChangeOpacity, actionChangeFontSize, actionChangeFontFamily, actionChangeTextAlign, actionChangeVerticalAlign, actionChangeArrowProperties, } from "./actionProperties";
6
6
  export { actionChangeViewBackgroundColor, actionClearCanvas, actionZoomIn, actionZoomOut, actionResetZoom, actionZoomToFit, actionToggleTheme, } from "./actionCanvas";
7
7
  export { actionSetEmbeddableAsActiveTool } from "./actionEmbeddable";
8
8
  export { actionFinalize } from "./actionFinalize";
9
9
  export { actionChangeProjectName, actionChangeExportBackground, actionSaveToActiveFile, actionSaveFileToDisk, actionLoadScene, } from "./actionExport";
10
10
  export { actionCopyStyles, actionPasteStyles } from "./actionStyles";
11
- export { actionToggleCanvasMenu, actionToggleEditMenu, actionShortcuts, } from "./actionMenu";
11
+ export { actionShortcuts } from "./actionMenu";
12
12
  export { actionGroup, actionUngroup } from "./actionGroup";
13
13
  export { actionGoToCollaborator } from "./actionNavigate";
14
14
  export { actionAddToLibrary } from "./actionAddToLibrary";
@@ -14,7 +14,7 @@ export type ActionResult = {
14
14
  type ActionFn = (elements: readonly OrderedExcalidrawElement[], appState: Readonly<AppState>, formData: any, app: AppClassProperties) => ActionResult | Promise<ActionResult>;
15
15
  export type UpdaterFn = (res: ActionResult) => void;
16
16
  export type ActionFilterFn = (action: Action) => void;
17
- export type ActionName = "copy" | "cut" | "paste" | "copyAsPng" | "copyAsSvg" | "copyText" | "sendBackward" | "bringForward" | "sendToBack" | "bringToFront" | "copyStyles" | "selectAll" | "pasteStyles" | "gridMode" | "zenMode" | "objectsSnapMode" | "stats" | "changeStrokeColor" | "changeBackgroundColor" | "changeFillStyle" | "changeStrokeWidth" | "changeStrokeShape" | "changeSloppiness" | "changeStrokeStyle" | "changeArrowhead" | "changeArrowType" | "changeOpacity" | "changeFontSize" | "toggleCanvasMenu" | "toggleEditMenu" | "undo" | "redo" | "finalize" | "changeProjectName" | "changeExportBackground" | "changeExportEmbedScene" | "changeExportScale" | "saveToActiveFile" | "saveFileToDisk" | "loadScene" | "duplicateSelection" | "deleteSelectedElements" | "changeViewBackgroundColor" | "clearCanvas" | "zoomIn" | "zoomOut" | "resetZoom" | "zoomToFit" | "zoomToFitSelection" | "zoomToFitSelectionInViewport" | "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" | "unlockAllElements" | "toggleElementLock" | "toggleLinearEditor" | "toggleEraserTool" | "toggleHandTool" | "selectAllElementsInFrame" | "removeAllElementsFromFrame" | "updateFrameRendering" | "setFrameAsActiveTool" | "setEmbeddableAsActiveTool" | "createContainerFromText" | "wrapTextInContainer" | "commandPalette" | "autoResize" | "elementStats" | "searchMenu" | "copyElementLink" | "linkToElement" | "cropEditor" | "wrapSelectionInFrame" | "toggleLassoTool" | "toggleShapeSwitch" | "togglePolygon";
17
+ export type ActionName = "copy" | "cut" | "paste" | "copyAsPng" | "copyAsSvg" | "copyText" | "sendBackward" | "bringForward" | "sendToBack" | "bringToFront" | "copyStyles" | "selectAll" | "pasteStyles" | "gridMode" | "zenMode" | "objectsSnapMode" | "stats" | "changeStrokeColor" | "changeBackgroundColor" | "changeFillStyle" | "changeStrokeWidth" | "changeStrokeShape" | "changeSloppiness" | "changeStrokeStyle" | "changeArrowhead" | "changeArrowType" | "changeArrowProperties" | "changeOpacity" | "changeFontSize" | "undo" | "redo" | "finalize" | "changeProjectName" | "changeExportBackground" | "changeExportEmbedScene" | "changeExportScale" | "saveToActiveFile" | "saveFileToDisk" | "loadScene" | "duplicateSelection" | "deleteSelectedElements" | "changeViewBackgroundColor" | "clearCanvas" | "zoomIn" | "zoomOut" | "resetZoom" | "zoomToFit" | "zoomToFitSelection" | "zoomToFitSelectionInViewport" | "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" | "unlockAllElements" | "toggleElementLock" | "toggleLinearEditor" | "toggleEraserTool" | "toggleHandTool" | "selectAllElementsInFrame" | "removeAllElementsFromFrame" | "updateFrameRendering" | "setFrameAsActiveTool" | "setEmbeddableAsActiveTool" | "createContainerFromText" | "wrapTextInContainer" | "commandPalette" | "autoResize" | "elementStats" | "searchMenu" | "copyElementLink" | "linkToElement" | "cropEditor" | "wrapSelectionInFrame" | "toggleLassoTool" | "toggleShapeSwitch" | "togglePolygon";
18
18
  export type PanelComponentProps = {
19
19
  elements: readonly ExcalidrawElement[];
20
20
  appState: AppState;
@@ -24,6 +24,10 @@ export declare const clearAppStateForLocalStorage: (appState: Partial<AppState>)
24
24
  locked: boolean;
25
25
  fromSelection: boolean;
26
26
  } & import("./types").ActiveTool) | undefined;
27
+ preferredSelectionTool?: {
28
+ type: "selection" | "lasso";
29
+ initialized: boolean;
30
+ } | undefined;
27
31
  penMode?: boolean | undefined;
28
32
  penDetected?: boolean | undefined;
29
33
  exportBackground?: boolean | undefined;
@@ -46,7 +50,7 @@ export declare const clearAppStateForLocalStorage: (appState: Partial<AppState>)
46
50
  currentItemArrowType?: "round" | "sharp" | "elbow" | undefined;
47
51
  cursorButton?: "up" | "down" | undefined;
48
52
  scrolledOutside?: boolean | undefined;
49
- openMenu?: "canvas" | "shape" | null | undefined;
53
+ openMenu?: "canvas" | null | undefined;
50
54
  openSidebar?: {
51
55
  name: string;
52
56
  tab?: string | undefined;
@@ -107,6 +107,7 @@ declare const findDataTransferItemType: <T extends ValueOf<{
107
107
  readonly json: "application/json";
108
108
  readonly excalidraw: "application/vnd.excalidraw+json";
109
109
  readonly excalidrawlib: "application/vnd.excalidrawlib+json";
110
+ readonly excalidrawlibIds: "application/vnd.excalidrawlib.ids+json";
110
111
  }>>(this: ParsedDataTranferList, type: T) => ParsedDataTransferItemType<T> | null;
111
112
  declare const getDataTransferItemData: <T extends ValueOf<{
112
113
  readonly text: "text/plain";
@@ -114,6 +115,7 @@ declare const getDataTransferItemData: <T extends ValueOf<{
114
115
  readonly json: "application/json";
115
116
  readonly excalidraw: "application/vnd.excalidraw+json";
116
117
  readonly excalidrawlib: "application/vnd.excalidrawlib+json";
118
+ readonly excalidrawlibIds: "application/vnd.excalidrawlib.ids+json";
117
119
  }>>(this: ParsedDataTranferList, type: T) => ParsedDataTransferItemType<ValueOf<typeof STRING_MIME_TYPES>>["value"] | null;
118
120
  declare const getDataTransferFiles: (this: ParsedDataTranferList) => ParsedDataTransferFile[];
119
121
  export declare const parseDataTransferEvent: (event: ClipboardEvent | DragEvent | React.DragEvent<HTMLDivElement>) => Promise<ParsedDataTranferList>;
@@ -1,6 +1,6 @@
1
1
  import type { ExcalidrawElement, NonDeletedElementsMap, NonDeletedSceneElementsMap } from "@excalidraw/element/types";
2
2
  import "./Actions.scss";
3
- import type { AppClassProperties, AppProps, UIAppState, Zoom } from "../types";
3
+ import type { AppClassProperties, AppProps, UIAppState, Zoom, AppState } from "../types";
4
4
  import type { ActionManager } from "../actions/manager";
5
5
  export declare const canChangeStrokeColor: (appState: UIAppState, targetElements: ExcalidrawElement[]) => boolean;
6
6
  export declare const canChangeBackgroundColor: (appState: UIAppState, targetElements: ExcalidrawElement[]) => boolean;
@@ -10,9 +10,23 @@ export declare const SelectedShapeActions: ({ appState, elementsMap, renderActio
10
10
  renderAction: ActionManager["renderAction"];
11
11
  app: AppClassProperties;
12
12
  }) => import("react/jsx-runtime").JSX.Element;
13
- export declare const ShapesSwitcher: ({ activeTool, appState, app, UIOptions, }: {
14
- activeTool: UIAppState["activeTool"];
13
+ export declare const CompactShapeActions: ({ appState, elementsMap, renderAction, app, setAppState, }: {
14
+ appState: UIAppState;
15
+ elementsMap: NonDeletedElementsMap | NonDeletedSceneElementsMap;
16
+ renderAction: ActionManager["renderAction"];
17
+ app: AppClassProperties;
18
+ setAppState: React.Component<any, AppState>["setState"];
19
+ }) => import("react/jsx-runtime").JSX.Element;
20
+ export declare const MobileShapeActions: ({ appState, elementsMap, renderAction, app, setAppState, }: {
15
21
  appState: UIAppState;
22
+ elementsMap: NonDeletedElementsMap | NonDeletedSceneElementsMap;
23
+ renderAction: ActionManager["renderAction"];
24
+ app: AppClassProperties;
25
+ setAppState: React.Component<any, AppState>["setState"];
26
+ }) => import("react/jsx-runtime").JSX.Element;
27
+ export declare const ShapesSwitcher: ({ activeTool, setAppState, app, UIOptions, }: {
28
+ activeTool: UIAppState["activeTool"];
29
+ setAppState: React.Component<any, AppState>["setState"];
16
30
  app: AppClassProperties;
17
31
  UIOptions: AppProps["UIOptions"];
18
32
  }) => import("react/jsx-runtime").JSX.Element;
@@ -245,7 +245,6 @@ declare class App extends React.Component<AppProps, AppState> {
245
245
  }>]>;
246
246
  missingPointerEventCleanupEmitter: Emitter<[event: PointerEvent | null]>;
247
247
  onRemoveEventListenersEmitter: Emitter<[]>;
248
- defaultSelectionTool: "selection" | "lasso";
249
248
  constructor(props: AppProps);
250
249
  updateEditorAtom: <Value, Args extends unknown[], Result>(atom: WritableAtom<Value, Args, Result>, ...args: Args) => Result;
251
250
  private onWindowMessage;
@@ -300,8 +299,8 @@ declare class App extends React.Component<AppProps, AppState> {
300
299
  */
301
300
  private resetScene;
302
301
  private initializeScene;
303
- private isMobileOrTablet;
304
302
  private isMobileBreakpoint;
303
+ private isTabletBreakpoint;
305
304
  private refreshViewportBreakpoints;
306
305
  private refreshEditorBreakpoints;
307
306
  private clearImageShapeCache;
@@ -18,6 +18,7 @@ interface ColorPickerProps {
18
18
  palette?: ColorPaletteCustom | null;
19
19
  topPicks?: ColorTuple;
20
20
  updateData: (formData?: any) => void;
21
+ compactMode?: boolean;
21
22
  }
22
23
  export declare const ColorPicker: ({ type, color, onChange, label, elements, palette, topPicks, updateData, appState, }: ColorPickerProps) => import("react/jsx-runtime").JSX.Element;
23
24
  export {};
@@ -10,8 +10,10 @@ interface PickerProps {
10
10
  palette: ColorPaletteCustom;
11
11
  updateData: (formData?: any) => void;
12
12
  children?: React.ReactNode;
13
+ showTitle?: boolean;
13
14
  onEyeDropperToggle: (force?: boolean) => void;
14
15
  onEscape: (event: React.KeyboardEvent | KeyboardEvent) => void;
16
+ showHotKey?: boolean;
15
17
  }
16
18
  export declare const Picker: React.ForwardRefExoticComponent<PickerProps & React.RefAttributes<unknown>>;
17
19
  export {};
@@ -4,6 +4,7 @@ interface PickerColorListProps {
4
4
  color: string | null;
5
5
  onChange: (color: string) => void;
6
6
  activeShade: number;
7
+ showHotKey?: boolean;
7
8
  }
8
- declare const PickerColorList: ({ palette, color, onChange, activeShade, }: PickerColorListProps) => import("react/jsx-runtime").JSX.Element;
9
+ declare const PickerColorList: ({ palette, color, onChange, activeShade, showHotKey, }: PickerColorListProps) => import("react/jsx-runtime").JSX.Element;
9
10
  export default PickerColorList;
@@ -3,6 +3,7 @@ interface ShadeListProps {
3
3
  color: string | null;
4
4
  onChange: (color: string) => void;
5
5
  palette: ColorPaletteCustom;
6
+ showHotKey?: boolean;
6
7
  }
7
- export declare const ShadeList: ({ color, onChange, palette }: ShadeListProps) => import("react/jsx-runtime").JSX.Element;
8
+ export declare const ShadeList: ({ color, onChange, palette, showHotKey, }: ShadeListProps) => import("react/jsx-runtime").JSX.Element;
8
9
  export {};
@@ -8,6 +8,7 @@ export declare const DEFAULT_CATEGORIES: {
8
8
  editor: string;
9
9
  elements: string;
10
10
  links: string;
11
+ library: string;
11
12
  };
12
13
  type CommandPaletteProps = {
13
14
  customCommandPaletteItems?: CommandPaletteItem[];
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import "./ExcalidrawLogo.scss";
3
- type LogoSize = "xs" | "small" | "normal" | "large" | "custom";
3
+ type LogoSize = "xs" | "small" | "normal" | "large" | "custom" | "mobile";
4
4
  interface LogoProps {
5
5
  size?: LogoSize;
6
6
  withText?: boolean;
@@ -16,6 +16,7 @@ interface FontPickerProps {
16
16
  onHover: (fontFamily: FontFamilyValues) => void;
17
17
  onLeave: () => void;
18
18
  onPopupChange: (open: boolean) => void;
19
+ compactMode?: boolean;
19
20
  }
20
- export declare const FontPicker: React.MemoExoticComponent<({ isOpened, selectedFontFamily, hoveredFontFamily, onSelect, onHover, onLeave, onPopupChange, }: FontPickerProps) => import("react/jsx-runtime").JSX.Element>;
21
+ export declare const FontPicker: React.MemoExoticComponent<({ isOpened, selectedFontFamily, hoveredFontFamily, onSelect, onHover, onLeave, onPopupChange, compactMode, }: FontPickerProps) => import("react/jsx-runtime").JSX.Element>;
21
22
  export {};
@@ -1,6 +1,8 @@
1
1
  import type { FontFamilyValues } from "@excalidraw/element/types";
2
2
  interface FontPickerTriggerProps {
3
3
  selectedFontFamily: FontFamilyValues | null;
4
+ isOpened?: boolean;
5
+ compactMode?: boolean;
4
6
  }
5
- export declare const FontPickerTrigger: ({ selectedFontFamily, }: FontPickerTriggerProps) => import("react/jsx-runtime").JSX.Element;
7
+ export declare const FontPickerTrigger: ({ selectedFontFamily, isOpened, compactMode, }: FontPickerTriggerProps) => import("react/jsx-runtime").JSX.Element;
6
8
  export {};
@@ -1,3 +1,5 @@
1
- export declare const InlineIcon: ({ icon }: {
1
+ export declare const InlineIcon: ({ className, icon, size, }: {
2
+ className?: string | undefined;
2
3
  icon: React.ReactNode;
4
+ size?: string | undefined;
3
5
  }) => import("react/jsx-runtime").JSX.Element;
@@ -17,6 +17,7 @@ interface LayerUIProps {
17
17
  onPenModeToggle: AppClassProperties["togglePenMode"];
18
18
  showExitZenModeBtn: boolean;
19
19
  langCode: Language["code"];
20
+ renderTopLeftUI?: ExcalidrawProps["renderTopLeftUI"];
20
21
  renderTopRightUI?: ExcalidrawProps["renderTopRightUI"];
21
22
  renderCustomStats?: ExcalidrawProps["renderCustomStats"];
22
23
  UIOptions: AppProps["UIOptions"];
@@ -27,5 +28,5 @@ interface LayerUIProps {
27
28
  isCollaborating: boolean;
28
29
  generateLinkForSelection?: AppProps["generateLinkForSelection"];
29
30
  }
30
- declare const _default: React.MemoExoticComponent<({ actionManager, appState, files, setAppState, elements, canvas, onLockToggle, onHandToolToggle, onPenModeToggle, showExitZenModeBtn, renderTopRightUI, renderCustomStats, UIOptions, onExportImage, renderWelcomeScreen, children, app, isCollaborating, generateLinkForSelection, }: LayerUIProps) => import("react/jsx-runtime").JSX.Element>;
31
+ declare const _default: React.MemoExoticComponent<({ actionManager, appState, files, setAppState, elements, canvas, onLockToggle, onHandToolToggle, onPenModeToggle, showExitZenModeBtn, renderTopLeftUI, renderTopRightUI, renderCustomStats, UIOptions, onExportImage, renderWelcomeScreen, children, app, isCollaborating, generateLinkForSelection, }: LayerUIProps) => import("react/jsx-runtime").JSX.Element>;
31
32
  export default _default;
@@ -3,7 +3,7 @@ import type { ExcalidrawElement, NonDeleted } from "@excalidraw/element/types";
3
3
  import type { SvgCache } from "../hooks/useLibraryItemSvg";
4
4
  import type { LibraryItem } from "../types";
5
5
  import type { ReactNode } from "react";
6
- type LibraryOrPendingItem = (LibraryItem | /* pending library item */ {
6
+ type LibraryOrPendingItem = readonly (LibraryItem | /* pending library item */ {
7
7
  id: null;
8
8
  elements: readonly NonDeleted<ExcalidrawElement>[];
9
9
  })[];
@@ -1,7 +1,7 @@
1
1
  import React from "react";
2
2
  import type { NonDeletedExcalidrawElement } from "@excalidraw/element/types";
3
3
  import type { ActionManager } from "../actions/manager";
4
- import type { AppClassProperties, AppProps, AppState, Device, ExcalidrawProps, UIAppState } from "../types";
4
+ import type { AppClassProperties, AppProps, AppState, UIAppState } from "../types";
5
5
  import type { JSX } from "react";
6
6
  type MobileMenuProps = {
7
7
  appState: UIAppState;
@@ -10,16 +10,14 @@ type MobileMenuProps = {
10
10
  renderImageExportDialog: () => React.ReactNode;
11
11
  setAppState: React.Component<any, AppState>["setState"];
12
12
  elements: readonly NonDeletedExcalidrawElement[];
13
- onLockToggle: () => void;
14
13
  onHandToolToggle: () => void;
15
14
  onPenModeToggle: AppClassProperties["togglePenMode"];
16
15
  renderTopRightUI?: (isMobile: boolean, appState: UIAppState) => JSX.Element | null;
17
- renderCustomStats?: ExcalidrawProps["renderCustomStats"];
16
+ renderTopLeftUI?: (isMobile: boolean, appState: UIAppState) => JSX.Element | null;
18
17
  renderSidebars: () => JSX.Element | null;
19
- device: Device;
20
18
  renderWelcomeScreen: boolean;
21
19
  UIOptions: AppProps["UIOptions"];
22
20
  app: AppClassProperties;
23
21
  };
24
- export declare const MobileMenu: ({ appState, elements, actionManager, setAppState, onLockToggle, onHandToolToggle, onPenModeToggle, renderTopRightUI, renderCustomStats, renderSidebars, device, renderWelcomeScreen, UIOptions, app, }: MobileMenuProps) => import("react/jsx-runtime").JSX.Element;
22
+ export declare const MobileMenu: ({ appState, elements, actionManager, setAppState, onHandToolToggle, renderTopLeftUI, renderTopRightUI, renderSidebars, renderWelcomeScreen, UIOptions, app, }: MobileMenuProps) => import("react/jsx-runtime").JSX.Element;
25
23
  export {};
@@ -0,0 +1,11 @@
1
+ /// <reference types="react" />
2
+ import "./ToolIcon.scss";
3
+ import "./MobileToolBar.scss";
4
+ import type { AppClassProperties, UIAppState } from "../types";
5
+ type MobileToolBarProps = {
6
+ app: AppClassProperties;
7
+ onHandToolToggle: () => void;
8
+ setAppState: React.Component<any, UIAppState>["setState"];
9
+ };
10
+ export declare const MobileToolBar: ({ app, onHandToolToggle, setAppState, }: MobileToolBarProps) => import("react/jsx-runtime").JSX.Element;
11
+ export {};
@@ -10,6 +10,7 @@ type Props = {
10
10
  offsetTop?: number;
11
11
  viewportWidth?: number;
12
12
  viewportHeight?: number;
13
+ className?: string;
13
14
  };
14
- export declare const Popover: ({ children, left, top, onCloseRequest, fitInViewport, offsetLeft, offsetTop, viewportWidth, viewportHeight, }: Props) => import("react/jsx-runtime").JSX.Element;
15
+ export declare const Popover: ({ children, left, top, onCloseRequest, fitInViewport, offsetLeft, offsetTop, viewportWidth, viewportHeight, className, }: Props) => import("react/jsx-runtime").JSX.Element;
15
16
  export {};
@@ -10,6 +10,7 @@ interface PropertiesPopoverProps {
10
10
  onPointerLeave?: React.PointerEventHandler<HTMLDivElement>;
11
11
  onFocusOutside?: Popover.PopoverContentProps["onFocusOutside"];
12
12
  onPointerDownOutside?: Popover.PopoverContentProps["onPointerDownOutside"];
13
+ preventAutoFocusOnTouch?: boolean;
13
14
  }
14
15
  export declare const PropertiesPopover: React.ForwardRefExoticComponent<PropertiesPopoverProps & React.RefAttributes<HTMLDivElement>>;
15
16
  export {};
@@ -1,5 +1,4 @@
1
- import type { ReactNode } from "react";
2
- import type { JSX } from "react";
1
+ import type { JSX, ReactNode } from "react";
3
2
  export declare const TTDDialogTrigger: {
4
3
  ({ children, icon, }: {
5
4
  children?: ReactNode;
@@ -12,6 +12,7 @@ type TextFieldProps = {
12
12
  className?: string;
13
13
  placeholder?: string;
14
14
  isRedacted?: boolean;
15
+ type?: "text" | "search";
15
16
  } & ({
16
17
  value: string;
17
18
  } | {
@@ -0,0 +1,25 @@
1
+ import React from "react";
2
+ import "./ToolPopover.scss";
3
+ import type { AppClassProperties } from "../types";
4
+ type ToolOption = {
5
+ type: string;
6
+ icon: React.ReactNode;
7
+ title?: string;
8
+ };
9
+ type ToolPopoverProps = {
10
+ app: AppClassProperties;
11
+ options: readonly ToolOption[];
12
+ activeTool: {
13
+ type: string;
14
+ };
15
+ defaultOption: string;
16
+ className?: string;
17
+ namePrefix: string;
18
+ title: string;
19
+ "data-testid": string;
20
+ onToolChange: (type: string) => void;
21
+ displayedOption: ToolOption;
22
+ fillable?: boolean;
23
+ };
24
+ export declare const ToolPopover: ({ app, options, activeTool, defaultOption, className, namePrefix, title, "data-testid": dataTestId, onToolChange, displayedOption, fillable, }: ToolPopoverProps) => import("react/jsx-runtime").JSX.Element;
25
+ export {};
@@ -1,9 +1,10 @@
1
1
  import React from "react";
2
2
  import "./DropdownMenu.scss";
3
3
  declare const DropdownMenu: {
4
- ({ children, open, }: {
4
+ ({ children, open, placement, }: {
5
5
  children?: React.ReactNode;
6
6
  open: boolean;
7
+ placement?: "top" | "bottom" | undefined;
7
8
  }): import("react/jsx-runtime").JSX.Element;
8
9
  Trigger: {
9
10
  ({ className, children, onToggle, title, ...rest }: {
@@ -15,12 +16,13 @@ declare const DropdownMenu: {
15
16
  displayName: string;
16
17
  };
17
18
  Content: {
18
- ({ children, onClickOutside, className, onSelect, style, }: {
19
+ ({ children, onClickOutside, className, onSelect, style, placement, }: {
19
20
  children?: React.ReactNode;
20
21
  onClickOutside?: (() => void) | undefined;
21
22
  className?: string | undefined;
22
23
  onSelect?: ((event: Event) => void) | undefined;
23
24
  style?: React.CSSProperties | undefined;
25
+ placement?: "top" | "bottom" | undefined;
24
26
  }): import("react/jsx-runtime").JSX.Element;
25
27
  displayName: string;
26
28
  };
@@ -1,6 +1,6 @@
1
1
  import React from "react";
2
2
  declare const MenuContent: {
3
- ({ children, onClickOutside, className, onSelect, style, }: {
3
+ ({ children, onClickOutside, className, onSelect, style, placement, }: {
4
4
  children?: React.ReactNode;
5
5
  onClickOutside?: (() => void) | undefined;
6
6
  className?: string | undefined;
@@ -9,6 +9,7 @@ declare const MenuContent: {
9
9
  */
10
10
  onSelect?: ((event: Event) => void) | undefined;
11
11
  style?: React.CSSProperties | undefined;
12
+ placement?: "top" | "bottom" | undefined;
12
13
  }): import("react/jsx-runtime").JSX.Element;
13
14
  displayName: string;
14
15
  };
@@ -11,6 +11,7 @@ export declare const PlusPromoIcon: import("react/jsx-runtime").JSX.Element;
11
11
  export declare const LibraryIcon: import("react/jsx-runtime").JSX.Element;
12
12
  export declare const PlusIcon: import("react/jsx-runtime").JSX.Element;
13
13
  export declare const DotsIcon: import("react/jsx-runtime").JSX.Element;
14
+ export declare const DotsHorizontalIcon: import("react/jsx-runtime").JSX.Element;
14
15
  export declare const PinIcon: import("react/jsx-runtime").JSX.Element;
15
16
  export declare const polygonIcon: import("react/jsx-runtime").JSX.Element;
16
17
  export declare const UnlockedIcon: import("react/jsx-runtime").JSX.Element;
@@ -30,6 +31,7 @@ export declare const LineIcon: import("react/jsx-runtime").JSX.Element;
30
31
  export declare const PenModeIcon: import("react/jsx-runtime").JSX.Element;
31
32
  export declare const FreedrawIcon: import("react/jsx-runtime").JSX.Element;
32
33
  export declare const TextIcon: import("react/jsx-runtime").JSX.Element;
34
+ export declare const TextSizeIcon: import("react/jsx-runtime").JSX.Element;
33
35
  export declare const ImageIcon: import("react/jsx-runtime").JSX.Element;
34
36
  export declare const EraserIcon: import("react/jsx-runtime").JSX.Element;
35
37
  export declare const ZoomInIcon: import("react/jsx-runtime").JSX.Element;
@@ -222,4 +224,7 @@ export declare const collapseUpIcon: import("react/jsx-runtime").JSX.Element;
222
224
  export declare const upIcon: import("react/jsx-runtime").JSX.Element;
223
225
  export declare const cropIcon: import("react/jsx-runtime").JSX.Element;
224
226
  export declare const elementLinkIcon: import("react/jsx-runtime").JSX.Element;
227
+ export declare const resizeIcon: import("react/jsx-runtime").JSX.Element;
228
+ export declare const adjustmentsIcon: import("react/jsx-runtime").JSX.Element;
229
+ export declare const strokeIcon: import("react/jsx-runtime").JSX.Element;
225
230
  export {};
@@ -2,7 +2,7 @@ import { IMAGE_MIME_TYPES, MIME_TYPES } from "@excalidraw/common";
2
2
  import type { ValueOf } from "@excalidraw/common/utility-types";
3
3
  import type { ExcalidrawElement, FileId } from "@excalidraw/element/types";
4
4
  import type { AppState, DataURL, LibraryItem } from "../types";
5
- import type { FileSystemHandle } from "./filesystem";
5
+ import type { FileSystemHandle } from "browser-fs-access";
6
6
  import type { ImportedLibraryData } from "./types";
7
7
  export declare const getMimeType: (blob: Blob | string) => string;
8
8
  export declare const getFileHandleType: (handle: FileSystemHandle | null) => string | null;
@@ -41,7 +41,7 @@ export declare const SVGStringToFile: (SVGString: string, filename?: string) =>
41
41
  };
42
42
  export declare const ImageURLToFile: (imageUrl: string, filename?: string) => Promise<File | undefined>;
43
43
  export declare const getFileHandle: (event: DragEvent | React.DragEvent | DataTransferItem) => Promise<FileSystemHandle | null>;
44
- export declare const createFile: (blob: File | Blob | ArrayBuffer, mimeType: ValueOf<typeof MIME_TYPES>, name: string | undefined) => File;
44
+ export declare const createFile: (blob: File | Blob | ArrayBuffer, mimeType: string, name: string | undefined) => File;
45
45
  /** attempts to detect correct mimeType if none is set, or if an image
46
46
  * has an incorrect extension.
47
47
  * Note: doesn't handle missing .excalidraw/.excalidrawlib extension */
@@ -1,7 +1,7 @@
1
1
  import type { VERSIONS } from "@excalidraw/common";
2
2
  import type { ExcalidrawElement } from "@excalidraw/element/types";
3
3
  import type { cleanAppStateForExport } from "../appState";
4
- import type { AppState, BinaryFiles, LibraryItems, LibraryItems_anyVersion } from "../types";
4
+ import type { AppState, BinaryFiles, LibraryItem, LibraryItems, LibraryItems_anyVersion } from "../types";
5
5
  export interface ExportedDataState {
6
6
  type: string;
7
7
  version: number;
@@ -43,3 +43,6 @@ export interface ImportedLibraryData extends Partial<ExportedLibraryData> {
43
43
  /** @deprecated v1 */
44
44
  library?: LibraryItems;
45
45
  }
46
+ export type ExcalidrawLibraryIds = {
47
+ itemIds: LibraryItem["id"][];
48
+ };
@@ -3,7 +3,7 @@ export type SvgCache = Map<LibraryItem["id"], SVGSVGElement>;
3
3
  export declare const libraryItemSvgsCache: import("jotai/vanilla/atom").PrimitiveAtom<SvgCache> & {
4
4
  init: SvgCache;
5
5
  };
6
- export declare const useLibraryItemSvg: (id: LibraryItem["id"] | null, elements: LibraryItem["elements"] | undefined, svgCache: SvgCache) => SVGSVGElement | undefined;
6
+ export declare const useLibraryItemSvg: (id: LibraryItem["id"] | null, elements: LibraryItem["elements"] | undefined, svgCache: SvgCache, ref: React.RefObject<HTMLDivElement | null>) => SVGSVGElement | undefined;
7
7
  export declare const useLibraryCache: () => {
8
8
  clearLibraryCache: () => void;
9
9
  deleteItemsFromLibraryCache: (items: LibraryItem["id"][]) => void;
@@ -0,0 +1,14 @@
1
+ export type CaretPosition = {
2
+ start: number;
3
+ end: number;
4
+ };
5
+ export declare const saveCaretPosition: () => CaretPosition | null;
6
+ export declare const restoreCaretPosition: (position: CaretPosition | null) => void;
7
+ export declare const withCaretPositionPreservation: (callback: () => void, isCompactMode: boolean, isEditingText: boolean, onPreventClose?: () => void) => void;
8
+ export declare const useTextEditorFocus: () => {
9
+ saveCaretPosition: () => void;
10
+ restoreCaretPosition: () => void;
11
+ clearSavedPosition: () => void;
12
+ hasSavedPosition: boolean;
13
+ };
14
+ export declare const temporarilyDisableTextEditorBlur: (duration?: number) => void;
@@ -0,0 +1 @@
1
+ export declare const getShortcutKey: (shortcut: string) => string;
@@ -221,6 +221,10 @@ export interface AppState {
221
221
  locked: boolean;
222
222
  fromSelection: boolean;
223
223
  } & ActiveTool;
224
+ preferredSelectionTool: {
225
+ type: "selection" | "lasso";
226
+ initialized: boolean;
227
+ };
224
228
  penMode: boolean;
225
229
  penDetected: boolean;
226
230
  exportBackground: boolean;
@@ -251,8 +255,8 @@ export interface AppState {
251
255
  isResizing: boolean;
252
256
  isRotating: boolean;
253
257
  zoom: Zoom;
254
- openMenu: "canvas" | "shape" | null;
255
- openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | null;
258
+ openMenu: "canvas" | null;
259
+ openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
256
260
  openSidebar: {
257
261
  name: SidebarName;
258
262
  tab?: SidebarTabName;
@@ -351,6 +355,8 @@ export interface AppState {
351
355
  lockedMultiSelections: {
352
356
  [groupId: string]: true;
353
357
  };
358
+ /** properties sidebar mode - determines whether to show compact or complete sidebar */
359
+ stylesPanelMode: "compact" | "full" | "mobile";
354
360
  }
355
361
  export type SearchMatch = {
356
362
  id: string;
@@ -441,6 +447,7 @@ export interface ExcalidrawProps {
441
447
  onDuplicate?: (nextElements: readonly ExcalidrawElement[],
442
448
  /** excludes the duplicated elements */
443
449
  prevElements: readonly ExcalidrawElement[]) => ExcalidrawElement[] | void;
450
+ renderTopLeftUI?: (isMobile: boolean, appState: UIAppState) => JSX.Element | null;
444
451
  renderTopRightUI?: (isMobile: boolean, appState: UIAppState) => JSX.Element | null;
445
452
  langCode?: Language["code"];
446
453
  viewModeEnabled?: boolean;
@@ -557,7 +564,7 @@ export type AppClassProperties = {
557
564
  excalidrawContainerValue: App["excalidrawContainerValue"];
558
565
  onPointerUpEmitter: App["onPointerUpEmitter"];
559
566
  updateEditorAtom: App["updateEditorAtom"];
560
- defaultSelectionTool: "selection" | "lasso";
567
+ onPointerDownEmitter: App["onPointerDownEmitter"];
561
568
  };
562
569
  export type PointerDownState = Readonly<{
563
570
  origin: Readonly<{