@zsviczian/excalidraw 0.18.0-46 → 0.18.0-48

package/types/excalidraw/actions/actionStyles.d.ts

@@ -161,7 +161,7 @@ export declare const actionCopyStyles: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            showHyperlinkPopup: false | "editor" | "info";
+            showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             colorPalette?: {
                 canvasBackground: import("@excalidraw/common").ColorPaletteCustom;
@@ -216,7 +216,6 @@ export declare const actionCopyStyles: {
             lockedMultiSelections: {
                 [groupId: string]: true;
             };
-            stylesPanelMode: "compact" | "full" | "mobile" | "tray";
         };
         captureUpdate: "EVENTUALLY";
     };

package/types/excalidraw/actions/actionToggleGridMode.d.ts

@@ -167,7 +167,7 @@ export declare const actionToggleGridMode: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            showHyperlinkPopup: false | "editor" | "info";
+            showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             colorPalette?: {
                 canvasBackground: import("@excalidraw/common").ColorPaletteCustom;
@@ -221,7 +221,6 @@ export declare const actionToggleGridMode: {
             lockedMultiSelections: {
                 [groupId: string]: true;
             };
-            stylesPanelMode: "compact" | "full" | "mobile" | "tray";
         };
         captureUpdate: "EVENTUALLY";
     };

package/types/excalidraw/actions/actionToggleObjectsSnapMode.d.ts

@@ -165,7 +165,7 @@ export declare const actionToggleObjectsSnapMode: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            showHyperlinkPopup: false | "editor" | "info";
+            showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             colorPalette?: {
                 canvasBackground: import("@excalidraw/common").ColorPaletteCustom;
@@ -219,7 +219,6 @@ export declare const actionToggleObjectsSnapMode: {
             lockedMultiSelections: {
                 [groupId: string]: true;
             };
-            stylesPanelMode: "compact" | "full" | "mobile" | "tray";
         };
         captureUpdate: "EVENTUALLY";
     };

package/types/excalidraw/actions/actionToggleSearchMenu.d.ts

@@ -157,7 +157,7 @@ export declare const actionToggleSearchMenu: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            showHyperlinkPopup: false | "editor" | "info";
+            showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             colorPalette?: {
                 canvasBackground: import("@excalidraw/common").ColorPaletteCustom;
@@ -212,7 +212,6 @@ export declare const actionToggleSearchMenu: {
             lockedMultiSelections: {
                 [groupId: string]: true;
             };
-            stylesPanelMode: "compact" | "full" | "mobile" | "tray";
         };
         captureUpdate: "EVENTUALLY";
     };

package/types/excalidraw/actions/actionToggleStats.d.ts

@@ -164,7 +164,7 @@ export declare const actionToggleStats: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            showHyperlinkPopup: false | "editor" | "info";
+            showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             colorPalette?: {
                 canvasBackground: import("@excalidraw/common").ColorPaletteCustom;
@@ -219,7 +219,6 @@ export declare const actionToggleStats: {
             lockedMultiSelections: {
                 [groupId: string]: true;
             };
-            stylesPanelMode: "compact" | "full" | "mobile" | "tray";
         };
         captureUpdate: "EVENTUALLY";
     };

package/types/excalidraw/actions/actionToggleViewMode.d.ts

@@ -164,7 +164,7 @@ export declare const actionToggleViewMode: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            showHyperlinkPopup: false | "editor" | "info";
+            showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             colorPalette?: {
                 canvasBackground: import("@excalidraw/common").ColorPaletteCustom;
@@ -219,7 +219,6 @@ export declare const actionToggleViewMode: {
             lockedMultiSelections: {
                 [groupId: string]: true;
             };
-            stylesPanelMode: "compact" | "full" | "mobile" | "tray";
         };
         captureUpdate: "EVENTUALLY";
     };

package/types/excalidraw/actions/actionToggleZenMode.d.ts

@@ -164,7 +164,7 @@ export declare const actionToggleZenMode: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            showHyperlinkPopup: false | "editor" | "info";
+            showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             colorPalette?: {
                 canvasBackground: import("@excalidraw/common").ColorPaletteCustom;
@@ -219,12 +219,11 @@ export declare const actionToggleZenMode: {
             lockedMultiSelections: {
                 [groupId: string]: true;
             };
-            stylesPanelMode: "compact" | "full" | "mobile" | "tray";
         };
         captureUpdate: "EVENTUALLY";
     };
     checked: (appState: Readonly<import("../types").AppState>) => boolean;
-    predicate: (elements: readonly import("@excalidraw/element/types").ExcalidrawElement[], appState: import("../types").AppState, appProps: import("../types").ExcalidrawProps) => boolean;
+    predicate: (elements: readonly import("@excalidraw/element/types").ExcalidrawElement[], appState: import("../types").AppState, appProps: import("../types").ExcalidrawProps, app: import("../types").AppClassProperties) => boolean;
     keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
 } & {
     keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;

package/types/excalidraw/actions/actionTrayMenu.d.ts

@@ -161,7 +161,7 @@ export declare const actionToggleTrayEditMenu: {
                 shown: true;
                 data: import("../charts").Spreadsheet;
             };
-            showHyperlinkPopup: false | "editor" | "info";
+            showHyperlinkPopup: false | "info" | "editor";
             linkOpacity: number;
             colorPalette?: {
                 canvasBackground: import("@excalidraw/common").ColorPaletteCustom;
@@ -216,7 +216,6 @@ export declare const actionToggleTrayEditMenu: {
             lockedMultiSelections: {
                 [groupId: string]: true;
             };
-            stylesPanelMode: "compact" | "full" | "mobile" | "tray";
         };
         captureUpdate: "EVENTUALLY";
     };

package/types/excalidraw/components/Actions.d.ts

@@ -39,7 +39,10 @@ export declare const UndoRedoActions: ({ renderAction, className, }: {
     renderAction: ActionManager["renderAction"];
     className?: string | undefined;
 }) => import("react/jsx-runtime").JSX.Element;
-export declare const ExitZenModeAction: ({ actionManager, showExitZenModeBtn, }: {
+export declare const ExitZenModeButton: ({ actionManager, showExitZenModeBtn, }: {
     actionManager: ActionManager;
     showExitZenModeBtn: boolean;
 }) => import("react/jsx-runtime").JSX.Element;
+export declare const ExitViewModeButton: ({ actionManager, }: {
+    actionManager: ActionManager;
+}) => import("react/jsx-runtime").JSX.Element;

package/types/excalidraw/components/App.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { type EXPORT_IMAGE_TYPES, Emitter } from "@excalidraw/common";
+import { type EXPORT_IMAGE_TYPES, Emitter, type EditorInterface, type StylesPanelMode } from "@excalidraw/common";
 import { LinearElementEditor, FlowChartCreator, Scene, type ElementUpdate, StoreDelta, type ApplyToOptions } from "@excalidraw/element";
 import type { ExcalidrawElement, ExcalidrawLinearElement, NonDeleted, NonDeletedExcalidrawElement, ExcalidrawFrameLikeElement, ExcalidrawIframeElement, ExcalidrawEmbeddableElement, Ordered, SceneElementsMap } from "@excalidraw/element/types";
 import type { Mutable } from "@excalidraw/common/utility-types";
@@ -13,7 +13,7 @@ import { LassoTrail } from "../lasso";
 import { EraserTrail } from "../eraser";
 import type { ExportedElements } from "../data";
 import type { FileSystemHandle } from "../data/filesystem";
-import type { AppClassProperties, AppProps, AppState, ExcalidrawImperativeAPI, BinaryFiles, LibraryItems, SceneData, Device, FrameNameBoundsCache, SidebarName, SidebarTabName, ToolType, OnUserFollowedPayload, GenerateDiagramToCode, NullableGridSize, Offsets } from "../types";
+import type { AppClassProperties, AppProps, AppState, ExcalidrawImperativeAPI, BinaryFiles, LibraryItems, SceneData, FrameNameBoundsCache, SidebarName, SidebarTabName, ToolType, OnUserFollowedPayload, GenerateDiagramToCode, NullableGridSize, Offsets } from "../types";
 import type { RoughCanvas } from "roughjs/bin/canvas";
 import type { ActionResult } from "../actions/types";
 export declare const ExcalidrawContainerContext: React.Context<{
@@ -22,18 +22,19 @@ export declare const ExcalidrawContainerContext: React.Context<{
 }>;
 export declare const useApp: () => AppClassProperties;
 export declare const useAppProps: () => AppProps;
-export declare const useDevice: () => Readonly<{
-    viewport: {
-        isMobile: boolean;
-        isLandscape: boolean;
-    };
-    editor: {
-        isMobile: boolean;
-        canFitSidebar: boolean;
-    };
+export declare const useEditorInterface: () => Readonly<{
+    formFactor: "phone" | "tablet" | "desktop";
+    desktopUIMode: "compact" | "full" | "tray";
+    userAgent: Readonly<{
+        isMobileDevice: boolean;
+        platform: "other" | "unknown" | "ios" | "android";
+    }>;
     isTouchScreen: boolean;
-    isTrayMode: boolean;
+    canFitSidebar: boolean;
+    isLandscape: boolean;
+    preferTrayMode: boolean;
 }>;
+export declare const useStylesPanelMode: () => StylesPanelMode;
 export declare const useExcalidrawContainer: () => {
     container: HTMLDivElement | null;
     id: string | null;
@@ -48,7 +49,8 @@ declare class App extends React.Component<AppProps, AppState> {
     rc: RoughCanvas;
     unmounted: boolean;
     actionManager: ActionManager;
-    device: Device;
+    editorInterface: EditorInterface;
+    private stylesPanelMode;
     private excalidrawContainerRef;
     scene: Scene;
     fonts: Fonts;
@@ -301,10 +303,12 @@ declare class App extends React.Component<AppProps, AppState> {
      */
     private resetScene;
     private initializeScene;
-    private isMobileBreakpoint;
-    private isTabletBreakpoint;
-    private refreshViewportBreakpoints;
-    private refreshEditorBreakpoints;
+    private getFormFactor;
+    refreshEditorInterface: (preferTrayMode?: boolean) => void;
+    private reconcileStylesPanelMode;
+    /** TO BE USED LATER */
+    private setDesktopUIMode;
+    private isTouchScreen;
     private setTrayModeEnabled;
     isTrayModeEnabled: () => boolean;
     private clearImageShapeCache;
@@ -397,7 +401,6 @@ declare class App extends React.Component<AppProps, AppState> {
      * NOTE if file already exists in editor state, the file data is not updated
      * */
     addFiles: ExcalidrawImperativeAPI["addFiles"];
-    setMobileModeAllowed: ExcalidrawImperativeAPI["setMobileModeAllowed"];
     private debounceClearHighlightSearchResults;
     selectElements: ExcalidrawImperativeAPI["selectElements"];
     bringToFront: ExcalidrawImperativeAPI["bringToFront"];

package/types/excalidraw/components/ColorPicker/ColorPicker.d.ts

@@ -18,7 +18,6 @@ interface ColorPickerProps {
     palette?: ColorPaletteCustom | null;
     topPicks?: ColorTuple;
     updateData: (formData?: any) => void;
-    compactMode?: boolean;
 }
 export declare const ColorPicker: ({ type, color, onChange, label, elements, palette, topPicks, updateData, appState, }: ColorPickerProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/types/excalidraw/components/HintViewer.d.ts

@@ -1,10 +1,11 @@
+import type { EditorInterface } from "@excalidraw/common";
 import "./HintViewer.scss";
-import type { AppClassProperties, Device, UIAppState } from "../types";
+import type { AppClassProperties, UIAppState } from "../types";
 interface HintViewerProps {
     appState: UIAppState;
     isMobile: boolean;
-    device: Device;
+    editorInterface: EditorInterface;
     app: AppClassProperties;
 }
-export declare const HintViewer: ({ appState, isMobile, device, app, }: HintViewerProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const HintViewer: ({ appState, isMobile, editorInterface, app, }: HintViewerProps) => import("react/jsx-runtime").JSX.Element | null;
 export {};

package/types/excalidraw/components/TrayMenu.d.ts

@@ -1,7 +1,8 @@
 import React from "react";
 import type { NonDeletedExcalidrawElement } from "@excalidraw/element/types";
+import type { EditorInterface } from "@excalidraw/common";
 import type { ActionManager } from "../actions/manager";
-import type { AppClassProperties, AppProps, AppState, Device, ExcalidrawProps, UIAppState } from "../types";
+import type { AppClassProperties, AppProps, AppState, ExcalidrawProps, UIAppState } from "../types";
 import type { JSX } from "react";
 type TrayMenuProps = {
     appState: UIAppState;
@@ -16,10 +17,10 @@ type TrayMenuProps = {
     renderTopRightUI?: (isMobile: boolean, appState: UIAppState) => JSX.Element | null;
     renderCustomStats?: ExcalidrawProps["renderCustomStats"];
     renderSidebars: () => JSX.Element | null;
-    device: Device;
+    editorInterface: EditorInterface;
     renderWelcomeScreen: boolean;
     UIOptions: AppProps["UIOptions"];
     app: AppClassProperties;
 };
-export declare const TrayMenu: ({ appState, elements, actionManager, setAppState, onLockToggle, onHandToolToggle, onPenModeToggle, renderTopRightUI, renderCustomStats, renderSidebars, device, renderWelcomeScreen, UIOptions, app, }: TrayMenuProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TrayMenu: ({ appState, elements, actionManager, setAppState, onLockToggle, onHandToolToggle, onPenModeToggle, renderTopRightUI, renderCustomStats, renderSidebars, editorInterface, renderWelcomeScreen, UIOptions, app, }: TrayMenuProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/types/excalidraw/components/canvases/InteractiveCanvas.d.ts

@@ -1,7 +1,8 @@
 import React from "react";
+import { type EditorInterface } from "@excalidraw/common";
 import type { NonDeletedExcalidrawElement, NonDeletedSceneElementsMap } from "@excalidraw/element/types";
 import type { RenderableElementsMap, RenderInteractiveSceneCallback } from "../../scene/types";
-import type { Device, InteractiveCanvasAppState } from "../../types";
+import type { InteractiveCanvasAppState } from "../../types";
 import type { DOMAttributes } from "react";
 type InteractiveCanvasProps = {
     containerRef: React.RefObject<HTMLDivElement | null>;
@@ -15,7 +16,7 @@ type InteractiveCanvasProps = {
     scale: number;
     appState: InteractiveCanvasAppState;
     renderScrollbars: boolean;
-    device: Device;
+    editorInterface: EditorInterface;
     renderInteractiveSceneCallback: (data: RenderInteractiveSceneCallback) => void;
     handleCanvasRef: (canvas: HTMLCanvasElement | null) => void;
     onContextMenu: Exclude<DOMAttributes<HTMLCanvasElement | HTMLDivElement>["onContextMenu"], undefined>;

package/types/excalidraw/components/icons.d.ts

@@ -233,4 +233,5 @@ export declare const Card: import("react/jsx-runtime").JSX.Element;
 export declare const resizeIcon: import("react/jsx-runtime").JSX.Element;
 export declare const adjustmentsIcon: import("react/jsx-runtime").JSX.Element;
 export declare const strokeIcon: import("react/jsx-runtime").JSX.Element;
+export declare const pencilIcon: import("react/jsx-runtime").JSX.Element;
 export {};

package/types/excalidraw/components/live-collaboration/LiveCollaborationTrigger.d.ts

@@ -1,8 +1,21 @@
+import { type EditorInterface } from "@excalidraw/common";
 import "./LiveCollaborationTrigger.scss";
 declare const LiveCollaborationTrigger: {
-    ({ isCollaborating, onSelect, ...rest }: {
+    ({ isCollaborating, onSelect, editorInterface, ...rest }: {
         isCollaborating: boolean;
         onSelect: () => void;
+        editorInterface?: Readonly<{
+            formFactor: "phone" | "tablet" | "desktop";
+            desktopUIMode: "compact" | "full" | "tray";
+            userAgent: Readonly<{
+                isMobileDevice: boolean;
+                platform: "other" | "unknown" | "ios" | "android";
+            }>;
+            isTouchScreen: boolean;
+            canFitSidebar: boolean;
+            isLandscape: boolean;
+            preferTrayMode: boolean;
+        }> | undefined;
     } & import("react").ButtonHTMLAttributes<HTMLButtonElement>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };

package/types/excalidraw/components/main-menu/MainMenu.d.ts

@@ -25,9 +25,6 @@ declare const MainMenu: React.FC<{
             order?: number | undefined;
             onSelect?: ((event: Event) => void) | undefined;
             children: React.ReactNode;
-            /**
-             * Called when any menu item is selected (clicked on).
-             */
             shortcut?: string | undefined;
             hovered?: boolean | undefined;
             selected?: boolean | undefined;

package/types/excalidraw/index.d.ts

@@ -33,18 +33,17 @@ export { loadFromBlob, loadSceneOrLibraryFromBlob, loadLibraryFromBlob, } from "
 export { getFreeDrawSvgPath } from "@excalidraw/element";
 export { mergeLibraryItems, getLibraryItemsHash } from "./data/library";
 export { isLinearElement } from "@excalidraw/element";
-export { FONT_FAMILY, THEME, MIME_TYPES, ROUNDNESS, DEFAULT_LASER_COLOR, UserIdleState, normalizeLink, } from "@excalidraw/common";
+export { FONT_FAMILY, THEME, MIME_TYPES, ROUNDNESS, DEFAULT_LASER_COLOR, UserIdleState, normalizeLink, sceneCoordsToViewportCoords, viewportCoordsToSceneCoords, getFormFactor, safelyParseJSON, } from "@excalidraw/common";
 export { mutateElement, newElementWith, bumpVersion, } from "@excalidraw/element";
 export { CaptureUpdateAction } from "@excalidraw/element";
 export { parseLibraryTokensFromUrl, useHandleLibrary } from "./data/library";
-export { sceneCoordsToViewportCoords, viewportCoordsToSceneCoords, safelyParseJSON, } from "@excalidraw/common";
 export { getEmbedLink } from "@excalidraw/element/embeddable";
 export { Sidebar } from "./components/Sidebar/Sidebar";
 export { Button } from "./components/Button";
 export { Footer };
 export { MainMenu };
 export { Ellipsify } from "./components/Ellipsify";
-export { useDevice } from "./components/App";
+export { useEditorInterface, useStylesPanelMode } from "./components/App";
 export { WelcomeScreen };
 export { LiveCollaborationTrigger };
 export { Stats } from "./components/Stats";

package/types/excalidraw/obsidianUtils.d.ts

@@ -1,7 +1,7 @@
 import { type GlobalPoint } from "@excalidraw/math/types";
 import type { FontMetadata } from "@excalidraw/common";
 import type { ElementsMap, ExcalidrawElement, ExcalidrawTextElement, NonDeletedExcalidrawElement } from "@excalidraw/element/types";
-import type { AppState } from "./types";
+import type { AppClassProperties, AppState } from "./types";
 import type { MermaidToExcalidrawLibProps } from "./components/TTDDialog/common";
 export declare let hostPlugin: any;
 export declare function destroyObsidianUtils(): void;
@@ -42,5 +42,5 @@ export declare const getZoomMax: () => any;
 export declare const runAction: (action: string) => void;
 export declare const t2: (key: string) => string;
 export declare const shouldDisableZoom: (appState: AppState) => boolean;
-export declare const isFullPanelMode: (appState: AppState) => boolean;
+export declare const isFullPanelMode: (app: AppClassProperties) => boolean;
 export declare const isContextMenuDisabled: () => boolean;

package/types/excalidraw/renderer/interactiveScene.d.ts

@@ -9,7 +9,7 @@ export declare const renderInteractiveSceneThrottled: {
  * Interactive scene is the ui-canvas where we render bounding boxes, selections
  * and other ui stuff.
  */
-export declare const renderInteractiveScene: <U extends ({ canvas, elementsMap, visibleElements, selectedElements, allElementsMap, scale, appState, renderConfig, device, }: InteractiveSceneRenderConfig) => {
+export declare const renderInteractiveScene: <U extends ({ canvas, elementsMap, visibleElements, selectedElements, allElementsMap, scale, appState, renderConfig, editorInterface, }: InteractiveSceneRenderConfig) => {
     atLeastOneVisibleElement: boolean;
     elementsMap: RenderableElementsMap;
     scrollBars?: undefined;

package/types/excalidraw/scene/types.d.ts

@@ -1,7 +1,7 @@
-import type { UserIdleState } from "@excalidraw/common";
+import type { UserIdleState, EditorInterface } from "@excalidraw/common";
 import type { ExcalidrawElement, NonDeletedElementsMap, NonDeletedExcalidrawElement, NonDeletedSceneElementsMap } from "@excalidraw/element/types";
 import type { MakeBrand } from "@excalidraw/common/utility-types";
-import type { AppClassProperties, AppState, EmbedsValidationStatus, ElementsPendingErasure, InteractiveCanvasAppState, StaticCanvasAppState, SocketId, Device, PendingExcalidrawElements } from "../types";
+import type { AppClassProperties, AppState, EmbedsValidationStatus, ElementsPendingErasure, InteractiveCanvasAppState, StaticCanvasAppState, SocketId, PendingExcalidrawElements } from "../types";
 import type { RoughCanvas } from "roughjs/bin/canvas";
 import type { Drawable } from "roughjs/bin/core";
 export type RenderableElementsMap = NonDeletedElementsMap & MakeBrand<"RenderableElementsMap">;
@@ -71,7 +71,7 @@ export type InteractiveSceneRenderConfig = {
     scale: number;
     appState: InteractiveCanvasAppState;
     renderConfig: InteractiveCanvasRenderConfig;
-    device: Device;
+    editorInterface: EditorInterface;
     callback: (data: RenderInteractiveSceneCallback) => void;
 };
 export type NewElementSceneRenderConfig = {

package/types/excalidraw/types.d.ts

@@ -1,4 +1,4 @@
-import type { IMAGE_MIME_TYPES, UserIdleState, throttleRAF, MIME_TYPES, ColorPaletteCustom } from "@excalidraw/common";
+import type { IMAGE_MIME_TYPES, UserIdleState, throttleRAF, MIME_TYPES, ColorPaletteCustom, EditorInterface } from "@excalidraw/common";
 import type { SuggestedBinding } from "@excalidraw/element";
 import type { LinearElementEditor } from "@excalidraw/element";
 import type { MaybeTransformHandleType } from "@excalidraw/element";
@@ -400,8 +400,6 @@ export interface AppState {
     lockedMultiSelections: {
         [groupId: string]: true;
     };
-    /** properties sidebar mode - determines whether to show compact or complete sidebar */
-    stylesPanelMode: "compact" | "full" | "mobile" | "tray";
 }
 export type SearchMatch = {
     id: string;
@@ -566,6 +564,12 @@ export type UIOptions = Partial<{
     tools: {
         image: boolean;
     };
+    /**
+     * Optionally control the editor form factor and desktop UI mode from the host app.
+     * If not provided, we will take care of it internally.
+     */
+    formFactor?: EditorInterface["formFactor"];
+    desktopUIMode?: EditorInterface["desktopUIMode"];
     /** @deprecated does nothing. Will be removed in 0.15 */
     welcomeScreen?: boolean;
 }>;
@@ -596,7 +600,7 @@ export type AppClassProperties = {
         mimeType: ValueOf<typeof IMAGE_MIME_TYPES>;
     }>;
     files: BinaryFiles;
-    device: App["device"];
+    editorInterface: App["editorInterface"];
     scene: App["scene"];
     syncActionResult: App["syncActionResult"];
     fonts: App["fonts"];
@@ -700,8 +704,10 @@ export interface ExcalidrawImperativeAPI {
     };
     setForceRenderAllEmbeddables: InstanceType<typeof App>["setForceRenderAllEmbeddables"];
     zoomToFit: InstanceType<typeof App>["zoomToFit"];
-    refreshEditorBreakpoints: InstanceType<typeof App>["refreshEditorBreakpoints"];
+    refreshEditorInterface: InstanceType<typeof App>["refreshEditorInterface"];
+    isTouchScreen: InstanceType<typeof App>["isTouchScreen"];
     setTrayModeEnabled: InstanceType<typeof App>["setTrayModeEnabled"];
+    setDesktopUIMode: InstanceType<typeof App>["setDesktopUIMode"];
     isTrayModeEnabled: InstanceType<typeof App>["isTrayModeEnabled"];
     getColorAtScenePoint: InstanceType<typeof App>["getColorAtScenePoint"];
     startLineEditor: InstanceType<typeof App>["startLineEditor"];
@@ -721,12 +727,12 @@ export interface ExcalidrawImperativeAPI {
     bringForward: (elements: readonly ExcalidrawElement[]) => void;
     sendToBack: (elements: readonly ExcalidrawElement[]) => void;
     bringToFront: (elements: readonly ExcalidrawElement[]) => void;
-    setMobileModeAllowed: (allow: boolean) => void;
     setActiveTool: InstanceType<typeof App>["setActiveTool"];
     setCursor: InstanceType<typeof App>["setCursor"];
     resetCursor: InstanceType<typeof App>["resetCursor"];
     toggleSidebar: InstanceType<typeof App>["toggleSidebar"];
     getHTMLIFrameElement: InstanceType<typeof App>["getHTMLIFrameElement"];
+    getEditorInterface: () => EditorInterface;
     /**
      * Disables rendering of frames (including element clipping), but currently
      * the frames are still interactive in edit mode. As such, this API should be
@@ -740,18 +746,6 @@ export interface ExcalidrawImperativeAPI {
     onScrollChange: (callback: (scrollX: number, scrollY: number, zoom: Zoom) => void) => UnsubscribeCallback;
     onUserFollow: (callback: (payload: OnUserFollowedPayload) => void) => UnsubscribeCallback;
 }
-export type Device = Readonly<{
-    viewport: {
-        isMobile: boolean;
-        isLandscape: boolean;
-    };
-    editor: {
-        isMobile: boolean;
-        canFitSidebar: boolean;
-    };
-    isTouchScreen: boolean;
-    isTrayMode: boolean;
-}>;
 export type FrameNameBounds = {
     x: number;
     y: number;

package/types/excalidraw/webpack.dev.config.d.ts

@@ -14,6 +14,8 @@ export namespace output {
 }
 export namespace resolve {
     const extensions: string[];
+    const mainFields: string[];
+    const mainFiles: string[];
     const alias: {
         "@excalidraw/excalidraw": string;
         "@excalidraw/utils": string;

package/types/excalidraw/webpack.prod.config.d.ts

@@ -15,6 +15,8 @@ export namespace output {
 }
 export namespace resolve {
     const extensions: string[];
+    const mainFields: string[];
+    const mainFiles: string[];
     const alias: {
         "@excalidraw/excalidraw": string;
         "@excalidraw/utils": string;