From 95ddc663392d94cd22a17a982dde5060849038de Mon Sep 17 00:00:00 2001
From: zsviczian <viczian.zsolt@gmail.com>
Date: Thu, 6 Nov 2025 22:33:11 +0100
Subject: [PATCH] fix: add toggle pen-mode to MobileMenu (#10293)

* add toggle pen mode to MobileMenu

* swap buttons

---------

Co-authored-by: dwelle <5153846+dwelle@users.noreply.github.com>
---
 packages/excalidraw/components/MobileMenu.tsx | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/packages/excalidraw/components/MobileMenu.tsx b/packages/excalidraw/components/MobileMenu.tsx
index ac52fb6bcc..ed83263c3c 100644
--- a/packages/excalidraw/components/MobileMenu.tsx
+++ b/packages/excalidraw/components/MobileMenu.tsx
@@ -13,6 +13,8 @@ import { FixedSideContainer } from "./FixedSideContainer";
 
 import { Island } from "./Island";
 
+import { PenModeButton } from "./PenModeButton";
+
 import type { ActionManager } from "../actions/manager";
 import type {
   AppClassProperties,
@@ -58,6 +60,7 @@ export const MobileMenu = ({
   renderWelcomeScreen,
   UIOptions,
   app,
+  onPenModeToggle,
 }: MobileMenuProps) => {
   const {
     WelcomeScreenCenterTunnel,
@@ -72,7 +75,18 @@ export const MobileMenu = ({
     const topRightUI = (
       <div className="excalidraw-ui-top-right">
         {renderTopRightUI?.(true, appState) ??
-          (!appState.viewModeEnabled && <DefaultSidebarTriggerTunnel.Out />)}
+          (!appState.viewModeEnabled && (
+            <>
+              <PenModeButton
+                checked={appState.penMode}
+                onChange={() => onPenModeToggle(null)}
+                title={t("toolBar.penMode")}
+                isMobile
+                penDetected={appState.penDetected}
+              />
+              <DefaultSidebarTriggerTunnel.Out />
+            </>
+          ))}
         {appState.viewModeEnabled && (
           <ExitViewModeButton actionManager={actionManager} />
         )}