From b50acc93448ede0588ec47b0c658beba517e0633 Mon Sep 17 00:00:00 2001
From: Mohamed Boudra <boudra.moha@gmail.com>
Date: Mon, 19 Oct 2026 10:44:28 +0700
Subject: [PATCH] fix(app): restore assistant text selection in iPhone Safari
 (#7360)

The Markdown DOM container bypasses React Native Web style prefixing. Safari inherits the gesture host selection suppression unless the selectable boundary also sets WebkitUserSelect. Keep container styling in the existing style configuration so its selection contract is covered by the renderer tests.
---
 packages/app/src/components/markdown/renderer.test.ts | 7 +++++++
 packages/app/src/components/markdown/renderer.tsx     | 2 --
 packages/app/src/components/markdown/styles.ts        | 6 +++++-
 3 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/packages/app/src/components/markdown/renderer.test.ts b/packages/app/src/components/markdown/renderer.test.ts
index 670dcf6c1e..0b98b6d51d 100644
--- a/packages/app/src/components/markdown/renderer.test.ts
+++ b/packages/app/src/components/markdown/renderer.test.ts
@@ -718,3 +718,10 @@ it("replaces the native placeholder only after the resolved URL decodes", () =>
   const prepared = prepareMarkdownSource("![image](shot.png)", undefined, { supportsSvg: false });
   expect(prepared.render(new Map([["shot.png", url]]))).toBe(`![image](<${url}>)`);
 });
+
+it("makes the web Markdown container selectable in Safari as well as unprefixed browsers", () => {
+  expect(createMarkdownStyles(lightTheme, { blockGap: 12 }).containerStyle).toEqual({
+    userSelect: "text",
+    WebkitUserSelect: "text",
+  });
+});
diff --git a/packages/app/src/components/markdown/renderer.tsx b/packages/app/src/components/markdown/renderer.tsx
index 4d6f042c2f..6d79beb01f 100644
--- a/packages/app/src/components/markdown/renderer.tsx
+++ b/packages/app/src/components/markdown/renderer.tsx
@@ -27,7 +27,6 @@ const markdownStyle = (compact: boolean) => (theme: Theme, rt: { breakpoint?: st
   createMarkdownStyles(theme, { compact, blockGap: resolveDensity(rt, density.blockGap) });
 const regularStyle = markdownStyle(false);
 const compactStyle = markdownStyle(true);
-const WEB_CONTAINER = { userSelect: "text" as const };
 
 export interface MarkdownRendererProps extends MarkdownImageContext {
   text: string;
@@ -99,7 +98,6 @@ const MarkdownPart = memo(function MarkdownPart({
             <ThemedMarkdown
               key={`${segment.kind}:${segment.id}`}
               markdown={segment.source}
-              containerStyle={isWeb ? WEB_CONTAINER : undefined}
               uniProps={compact ? compactStyle : regularStyle}
               flavor="github"
               selectable
diff --git a/packages/app/src/components/markdown/styles.ts b/packages/app/src/components/markdown/styles.ts
index 57ee40ff12..faf388a9dc 100644
--- a/packages/app/src/components/markdown/styles.ts
+++ b/packages/app/src/components/markdown/styles.ts
@@ -2,10 +2,13 @@ import type { MarkdownStyle } from "react-native-enriched-markdown";
 import type { Theme } from "@/styles/theme";
 import { isWeb } from "@/constants/platform";
 
+// iOS Safari needs the prefix to override the gesture host's selection suppression.
+const WEB_CONTAINER = { userSelect: "text", WebkitUserSelect: "text" } as const;
+
 export function createMarkdownStyles(
   theme: Theme,
   { compact = false, blockGap }: { compact?: boolean; blockGap: number },
-): { markdownStyle: MarkdownStyle; selectionColor: string } {
+): { markdownStyle: MarkdownStyle; selectionColor: string; containerStyle?: typeof WEB_CONTAINER } {
   const fontSize = compact ? theme.fontSize.base : theme.fontSize.content;
   // Every block is followed by the same gap; the library drops it after the last block.
   const block = { marginTop: 0, marginBottom: blockGap };
@@ -23,6 +26,7 @@ export function createMarkdownStyles(
     fontWeight: "bold",
   });
   return {
+    containerStyle: isWeb ? WEB_CONTAINER : undefined,
     selectionColor: theme.colors.terminal.selectionBackground,
     markdownStyle: {
       paragraph,