@zsviczian/excalidraw 0.11.0-obsidian-22 → 0.11.0-obsidian-24

package/types/actions/actionProperties.d.ts

@@ -101,6 +101,7 @@ export declare const actionChangeFillStyle: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../../src/types").Collaborator>;
             showStats: boolean;
@@ -112,7 +113,7 @@ export declare const actionChangeFillStyle: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;
@@ -212,6 +213,7 @@ export declare const actionChangeStrokeWidth: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../../src/types").Collaborator>;
             showStats: boolean;
@@ -223,7 +225,7 @@ export declare const actionChangeStrokeWidth: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;
@@ -323,6 +325,7 @@ export declare const actionChangeSloppiness: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../../src/types").Collaborator>;
             showStats: boolean;
@@ -334,7 +337,7 @@ export declare const actionChangeSloppiness: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;
@@ -434,6 +437,7 @@ export declare const actionChangeStrokeStyle: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../../src/types").Collaborator>;
             showStats: boolean;
@@ -445,7 +449,7 @@ export declare const actionChangeStrokeStyle: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;
@@ -545,6 +549,7 @@ export declare const actionChangeOpacity: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../../src/types").Collaborator>;
             showStats: boolean;
@@ -556,7 +561,7 @@ export declare const actionChangeOpacity: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;
@@ -656,6 +661,7 @@ export declare const actionChangeFontSize: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../../src/types").Collaborator>;
             showStats: boolean;
@@ -667,7 +673,7 @@ export declare const actionChangeFontSize: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;
@@ -767,6 +773,7 @@ export declare const actionDecreaseFontSize: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../../src/types").Collaborator>;
             showStats: boolean;
@@ -778,7 +785,7 @@ export declare const actionDecreaseFontSize: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;
@@ -878,6 +885,7 @@ export declare const actionIncreaseFontSize: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../../src/types").Collaborator>;
             showStats: boolean;
@@ -889,7 +897,7 @@ export declare const actionIncreaseFontSize: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;
@@ -989,6 +997,7 @@ export declare const actionChangeFontFamily: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../../src/types").Collaborator>;
             showStats: boolean;
@@ -1000,7 +1009,7 @@ export declare const actionChangeFontFamily: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;
@@ -1100,6 +1109,7 @@ export declare const actionChangeTextAlign: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../../src/types").Collaborator>;
             showStats: boolean;
@@ -1111,7 +1121,7 @@ export declare const actionChangeTextAlign: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;
@@ -1213,6 +1223,7 @@ export declare const actionChangeVerticalAlign: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../../src/types").Collaborator>;
             showStats: boolean;
@@ -1224,7 +1235,7 @@ export declare const actionChangeVerticalAlign: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;
@@ -1324,6 +1335,7 @@ export declare const actionChangeSharpness: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../../src/types").Collaborator>;
             showStats: boolean;
@@ -1335,7 +1347,7 @@ export declare const actionChangeSharpness: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;
@@ -1438,6 +1450,7 @@ export declare const actionChangeArrowhead: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../../src/types").Collaborator>;
             showStats: boolean;
@@ -1449,7 +1462,7 @@ export declare const actionChangeArrowhead: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;

package/types/actions/actionStyles.d.ts

@@ -85,6 +85,7 @@ export declare const actionCopyStyles: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../types").Collaborator>;
             showStats: boolean;
@@ -96,7 +97,7 @@ export declare const actionCopyStyles: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;

package/types/actions/actionToggleGridMode.d.ts

@@ -86,6 +86,7 @@ export declare const actionToggleGridMode: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../types").Collaborator>;
             showStats: boolean;
@@ -97,7 +98,7 @@ export declare const actionToggleGridMode: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;

package/types/actions/actionToggleStats.d.ts

@@ -85,6 +85,7 @@ export declare const actionToggleStats: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../types").Collaborator>;
             currentChartType: import("../element/types").ChartType;
@@ -95,7 +96,7 @@ export declare const actionToggleStats: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;

package/types/actions/actionToggleViewMode.d.ts

@@ -85,6 +85,7 @@ export declare const actionToggleViewMode: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../types").Collaborator>;
             showStats: boolean;
@@ -96,7 +97,7 @@ export declare const actionToggleViewMode: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;

package/types/actions/actionToggleZenMode.d.ts

@@ -85,6 +85,7 @@ export declare const actionToggleZenMode: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../types").Collaborator>;
             showStats: boolean;
@@ -96,7 +97,7 @@ export declare const actionToggleZenMode: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("../element/types").NonDeleted<import("../element/types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;

package/types/appState.d.ts

@@ -57,6 +57,8 @@ export declare const clearAppStateForLocalStorage: (appState: Partial<AppState>)
         [groupId: string]: boolean;
     } | undefined;
     editingGroupId?: string | null | undefined;
+    isLibraryOpen?: boolean | undefined;
+    isLibraryMenuDocked?: boolean | undefined;
     showStats?: boolean | undefined;
     currentChartType?: import("./element/types").ChartType | undefined;
 };

package/types/components/App.d.ts

@@ -4,11 +4,17 @@ import { ActionManager } from "../actions/manager";
 import { RestoredDataState } from "../data/restore";
 import { ExcalidrawElement, NonDeletedExcalidrawElement } from "../element/types";
 import History from "../history";
-import { AppClassProperties, AppProps, AppState, ExcalidrawImperativeAPI, BinaryFiles, LibraryItems, SceneData, DeviceType } from "../types";
+import Scene from "../scene/Scene";
+import { AppClassProperties, AppProps, AppState, ExcalidrawImperativeAPI, BinaryFiles, LibraryItems, SceneData, Device } from "../types";
 import { FileSystemHandle } from "../data/filesystem";
 import { ImportedDataState } from "../data/types";
 export declare let showFourthFont: boolean;
-export declare const useDeviceType: () => DeviceType;
+export declare const useDevice: () => Readonly<{
+    isSmScreen: boolean;
+    isMobile: boolean;
+    isTouchScreen: boolean;
+    canDeviceFitSidebar: boolean;
+}>;
 export declare const useExcalidrawContainer: () => {
     container: HTMLDivElement | null;
     id: string | null;
@@ -18,11 +24,11 @@ declare class App extends React.Component<AppProps, AppState> {
     rc: RoughCanvas | null;
     unmounted: boolean;
     actionManager: ActionManager;
-    deviceType: DeviceType;
+    device: Device;
     detachIsMobileMqHandler?: () => void;
     private excalidrawContainerRef;
     static defaultProps: Partial<AppProps>;
-    private scene;
+    scene: Scene;
     private resizeObserver;
     private nearestScrollableContainer;
     library: AppClassProperties["library"];
@@ -40,7 +46,6 @@ declare class App extends React.Component<AppProps, AppState> {
         x: number;
         y: number;
     } | null;
-    allowMobileMode: boolean;
     constructor(props: AppProps);
     private renderCanvas;
     render(): JSX.Element;
@@ -59,6 +64,7 @@ declare class App extends React.Component<AppProps, AppState> {
      */
     private resetScene;
     private initializeScene;
+    private refreshDeviceState;
     componentDidMount(): Promise<void>;
     componentWillUnmount(): void;
     private onResize;
@@ -81,7 +87,6 @@ declare class App extends React.Component<AppProps, AppState> {
     toggleLock: (source?: "keyboard" | "ui") => void;
     togglePenMode: () => void;
     toggleZenMode: () => void;
-    toggleStats: () => void;
     scrollToContent: (target?: ExcalidrawElement | readonly ExcalidrawElement[]) => void;
     zoomToFit: (target?: readonly ExcalidrawElement[], maxZoom?: number, margin?: number) => void;
     updateContainerSize: (containers: NonDeletedExcalidrawElement[]) => void;
@@ -91,7 +96,6 @@ declare class App extends React.Component<AppProps, AppState> {
     restoreFileFromShare: () => Promise<void>;
     /** adds supplied files to existing files in the appState */
     addFiles: ExcalidrawImperativeAPI["addFiles"];
-    setMobileModeAllowed: ExcalidrawImperativeAPI["setMobileModeAllowed"];
     setLocalFont: ExcalidrawImperativeAPI["setLocalFont"];
     selectElements: ExcalidrawImperativeAPI["selectElements"];
     bringToFront: ExcalidrawImperativeAPI["bringToFront"];

package/types/components/LayerUI.d.ts

@@ -23,8 +23,9 @@ interface LayerUIProps {
     toggleZenMode: () => void;
     langCode: Language["code"];
     isCollaborating: boolean;
-    renderTopRightUI?: (isMobile: boolean, appState: AppState) => JSX.Element | null;
-    renderCustomFooter?: (isMobile: boolean, appState: AppState) => JSX.Element | null;
+    renderTopRightUI?: ExcalidrawProps["renderTopRightUI"];
+    renderCustomFooter?: ExcalidrawProps["renderFooter"];
+    renderCustomStats?: ExcalidrawProps["renderCustomStats"];
     viewModeEnabled: boolean;
     libraryReturnUrl: ExcalidrawProps["libraryReturnUrl"];
     UIOptions: AppProps["UIOptions"];
@@ -35,5 +36,5 @@ interface LayerUIProps {
         insertOnCanvasDirectly: boolean;
     }) => void;
 }
-declare const _default: React.MemoExoticComponent<({ actionManager, appState, files, setAppState, canvas, elements, onCollabButtonClick, onLockToggle, onPenModeToggle, onInsertElements, zenModeEnabled, showExitZenModeBtn, showThemeBtn, toggleZenMode, isCollaborating, renderTopRightUI, renderCustomFooter, viewModeEnabled, libraryReturnUrl, UIOptions, focusContainer, library, id, onImageAction, }: LayerUIProps) => JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ actionManager, appState, files, setAppState, canvas, elements, onCollabButtonClick, onLockToggle, onPenModeToggle, onInsertElements, zenModeEnabled, showExitZenModeBtn, showThemeBtn, toggleZenMode, isCollaborating, renderTopRightUI, renderCustomFooter, renderCustomStats, viewModeEnabled, libraryReturnUrl, UIOptions, focusContainer, library, id, onImageAction, }: LayerUIProps) => JSX.Element>;
 export default _default;

package/types/components/LibraryMenuItems.d.ts

@@ -2,7 +2,7 @@ import React from "react";
 import Library from "../data/library";
 import { AppState, BinaryFiles, ExcalidrawProps, LibraryItem, LibraryItems } from "../types";
 import "./LibraryMenuItems.scss";
-declare const LibraryMenuItems: ({ isLoading, libraryItems, onRemoveFromLibrary, onAddToLibrary, onInsertLibraryItems, pendingElements, theme, setAppState, libraryReturnUrl, library, files, id, selectedItems, onSelectItems, onPublish, resetLibrary, }: {
+declare const LibraryMenuItems: ({ isLoading, libraryItems, onRemoveFromLibrary, onAddToLibrary, onInsertLibraryItems, pendingElements, theme, setAppState, appState, libraryReturnUrl, library, files, id, selectedItems, onSelectItems, onPublish, resetLibrary, }: {
     isLoading: boolean;
     libraryItems: LibraryItems;
     pendingElements: LibraryItem["elements"];
@@ -12,6 +12,7 @@ declare const LibraryMenuItems: ({ isLoading, libraryItems, onRemoveFromLibrary,
     theme: AppState["theme"];
     files: BinaryFiles;
     setAppState: React.Component<any, AppState>["setState"];
+    appState: AppState;
     libraryReturnUrl: ExcalidrawProps["libraryReturnUrl"];
     library: Library;
     id: string;

package/types/components/MobileMenu.d.ts

@@ -22,6 +22,7 @@ declare type MobileMenuProps = {
         insertOnCanvasDirectly: boolean;
     }) => void;
     renderTopRightUI?: (isMobile: boolean, appState: AppState) => JSX.Element | null;
+    renderStats: () => JSX.Element | null;
 };
-export declare const MobileMenu: ({ appState, elements, libraryMenu, actionManager, renderJSONExportDialog, renderImageExportDialog, setAppState, onCollabButtonClick, onLockToggle, onPenModeToggle, canvas, isCollaborating, renderCustomFooter, viewModeEnabled, showThemeBtn, onImageAction, renderTopRightUI, }: MobileMenuProps) => JSX.Element;
+export declare const MobileMenu: ({ appState, elements, libraryMenu, actionManager, renderJSONExportDialog, renderImageExportDialog, setAppState, onCollabButtonClick, onLockToggle, onPenModeToggle, canvas, isCollaborating, renderCustomFooter, viewModeEnabled, showThemeBtn, onImageAction, renderTopRightUI, renderStats, }: MobileMenuProps) => JSX.Element;
 export {};

package/types/components/SidebarLockButton.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import "./ToolIcon.scss";
+import "./SidebarLockButton.scss";
+declare type SidebarLockIconProps = {
+    checked: boolean;
+    onChange?(): void;
+};
+export declare const SidebarLockButton: (props: SidebarLockIconProps) => JSX.Element;
+export {};

package/types/components/Stack.d.ts

@@ -10,6 +10,6 @@ declare type StackProps = {
 };
 declare const _default: {
     Row: ({ children, gap, align, justifyContent, className, style, }: StackProps) => JSX.Element;
-    Col: ({ children, gap, align, justifyContent, className, }: StackProps) => JSX.Element;
+    Col: ({ children, gap, align, justifyContent, className, style, }: StackProps) => JSX.Element;
 };
 export default _default;

package/types/constants.d.ts

@@ -119,9 +119,12 @@ export declare const URL_HASH_KEYS: {
     readonly addLibrary: "addLibrary";
 };
 export declare const DEFAULT_UI_OPTIONS: AppProps["UIOptions"];
+export declare const MQ_SM_MAX_WIDTH = 640;
 export declare const MQ_MAX_WIDTH_PORTRAIT = 730;
 export declare const MQ_MAX_WIDTH_LANDSCAPE = 1000;
 export declare const MQ_MAX_HEIGHT_LANDSCAPE = 500;
+export declare const MQ_RIGHT_SIDEBAR_MIN_WIDTH = 1229;
+export declare const LIBRARY_SIDEBAR_WIDTH: number;
 export declare const MAX_DECIMALS_FOR_SVG_EXPORT = 2;
 export declare const EXPORT_SCALES: number[];
 export declare const DEFAULT_EXPORT_PADDING = 10;

package/types/element/Hyperlink.d.ts

@@ -96,6 +96,7 @@ export declare const actionLink: {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../types").Collaborator>;
             showStats: boolean;
@@ -107,7 +108,7 @@ export declare const actionLink: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: import("./types").NonDeleted<import("./types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             linkOpacity: number;
             trayModeEnabled: boolean;
             colorPalette: {

package/types/element/linearElementEditor.d.ts

@@ -163,6 +163,7 @@ export declare class LinearElementEditor {
             offsetTop: number;
             offsetLeft: number;
             isLibraryOpen: boolean;
+            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../types").Collaborator>;
             showStats: boolean;
@@ -174,7 +175,7 @@ export declare class LinearElementEditor {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            pendingImageElement: NonDeleted<import("./types").ExcalidrawImageElement> | null;
+            pendingImageElementId: string | null;
             showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             trayModeEnabled: boolean;

package/types/packages/excalidraw/dist/excalidraw.production.min.d.ts

@@ -1 +1 @@
-export const Excalidraw: {};
+export const ExcalidrawLib: {};

package/types/packages/excalidraw/entry.d.ts

@@ -1,3 +1 @@
-export default Excalidraw;
 export * from "./index";
-import Excalidraw from "./index";

package/types/packages/excalidraw/index.d.ts

@@ -3,8 +3,7 @@ import "../../css/app.scss";
 import "../../css/styles.scss";
 import { ExcalidrawAPIRefValue, ExcalidrawProps } from "../../types";
 declare type PublicExcalidrawProps = Omit<ExcalidrawProps, "forwardedRef">;
-declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<PublicExcalidrawProps & React.RefAttributes<ExcalidrawAPIRefValue>>>;
-export default _default;
+export declare const Excalidraw: React.MemoExoticComponent<React.ForwardRefExoticComponent<PublicExcalidrawProps & React.RefAttributes<ExcalidrawAPIRefValue>>>;
 export { getSceneVersion, isInvisiblySmallElement, getNonDeletedElements, } from "../../element";
 export { defaultLang, languages } from "../../i18n";
 export { restore, restoreAppState, restoreElements, restoreLibraryItems, } from "../../data/restore";

package/types/types.d.ts

@@ -130,6 +130,7 @@ export declare type AppState = {
     offsetTop: number;
     offsetLeft: number;
     isLibraryOpen: boolean;
+    isLibraryMenuDocked: boolean;
     fileHandle: FileSystemHandle | null;
     collaborators: Map<string, Collaborator>;
     showStats: boolean;
@@ -142,7 +143,7 @@ export declare type AppState = {
         data: Spreadsheet;
     };
     /** imageElement waiting to be placed on canvas */
-    pendingImageElement: NonDeleted<ExcalidrawImageElement> | null;
+    pendingImageElementId: ExcalidrawImageElement["id"] | null;
     showHyperlinkPopup: false | "info" | "editor";
     linkOpacity: number;
     trayModeEnabled: boolean;
@@ -215,8 +216,6 @@ export interface ExcalidrawProps {
     }) => void;
     onPaste?: (data: ClipboardData, event: ClipboardEvent | null) => Promise<boolean> | boolean;
     onDrop?: (event: React.DragEvent<HTMLDivElement>) => Promise<boolean> | boolean;
-    ownerDocument: Document;
-    ownerWindow: Window;
     renderTopRightUI?: (isMobile: boolean, appState: AppState) => JSX.Element | null;
     renderFooter?: (isMobile: boolean, appState: AppState) => JSX.Element | null;
     langCode?: Language["code"];
@@ -227,7 +226,10 @@ export interface ExcalidrawProps {
     theme?: Theme;
     name?: string;
     renderCustomStats?: (elements: readonly NonDeletedExcalidrawElement[], appState: AppState) => JSX.Element;
-    UIOptions?: UIOptions;
+    UIOptions?: {
+        dockedSidebarBreakpoint?: number;
+        canvasActions?: CanvasActions;
+    };
     detectScroll?: boolean;
     handleKeyboardGlobally?: boolean;
     onLibraryChange?: (libraryItems: LibraryItems) => void | Promise<any>;
@@ -269,19 +271,17 @@ declare type CanvasActions = {
     theme?: boolean;
     saveAsImage?: boolean;
 };
-export declare type UIOptions = {
-    canvasActions?: CanvasActions;
-};
-export declare type AppProps = ExcalidrawProps & {
+export declare type AppProps = Merge<ExcalidrawProps, {
     UIOptions: {
         canvasActions: Required<CanvasActions> & {
             export: ExportOpts;
         };
+        dockedSidebarBreakpoint?: number;
     };
     detectScroll: boolean;
     handleKeyboardGlobally: boolean;
     isCollaborating: boolean;
-};
+}>;
 /** A subset of App class properties that we need to use elsewhere
  * in the app, eg Manager. Factored out into a separate type to keep DRY. */
 export declare type AppClassProperties = {
@@ -294,7 +294,8 @@ export declare type AppClassProperties = {
         mimeType: typeof ALLOWED_IMAGE_MIME_TYPES[number];
     }>;
     files: BinaryFiles;
-    deviceType: App["deviceType"];
+    device: App["device"];
+    scene: App["scene"];
 };
 export declare type PointerDownState = Readonly<{
     origin: Readonly<{
@@ -383,13 +384,14 @@ export declare type ExcalidrawImperativeAPI = {
     sendToBack: (elements: readonly ExcalidrawElement[]) => void;
     bringToFront: (elements: readonly ExcalidrawElement[]) => void;
     restore: InstanceType<typeof App>["restore"];
-    setMobileModeAllowed: (allow: boolean) => void;
     setActiveTool: InstanceType<typeof App>["setActiveTool"];
     setCursor: InstanceType<typeof App>["setCursor"];
     resetCursor: InstanceType<typeof App>["resetCursor"];
 };
-export declare type DeviceType = {
+export declare type Device = Readonly<{
+    isSmScreen: boolean;
     isMobile: boolean;
     isTouchScreen: boolean;
-};
+    canDeviceFitSidebar: boolean;
+}>;
 export {};

package/types/utils.d.ts

@@ -131,3 +131,4 @@ export declare const updateObject: <T extends Record<string, any>>(obj: T, updat
 export declare const isPrimitive: (val: any) => boolean;
 export declare const getFrame: () => "top" | "iframe";
 export declare const isPromiseLike: (value: any) => value is Promise<any>;
+export declare const queryFocusableElements: (container: HTMLElement | null) => HTMLElement[];