allow host app to control form factor and ui mode

packages/excalidraw/components/App.tsx

@@ -753,8 +753,16 @@ class App extends React.Component<AppProps, AppState> {
     const userAgentDescriptor = createUserAgentDescriptor(
       typeof navigator !== "undefined" ? navigator.userAgent : "",
     );
+    // allow host app to control formFactor and desktopUIMode via props
     this.editorInterface = updateObject(this.editorInterface, {
-      desktopUIMode: storedDesktopUIMode ?? this.editorInterface.desktopUIMode,
+      desktopUIMode:
+        typeof props.desktopUIMode !== "undefined"
+          ? props.desktopUIMode
+          : storedDesktopUIMode ?? this.editorInterface.desktopUIMode,
+      formFactor:
+        typeof props.formFactor !== "undefined"
+          ? props.formFactor
+          : this.editorInterface.formFactor,
       userAgent: userAgentDescriptor,
     });
     this.stylesPanelMode = deriveStylesPanelMode(this.editorInterface);

packages/excalidraw/types.ts

@@ -691,6 +691,12 @@ export type AppProps = Merge<
     isCollaborating: boolean;
     children?: React.ReactNode;
     aiEnabled: 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"];
   }
 >;