@multiplatform.one/rich-text 7.7.6 → 7.8.0

package/dist/jsx/toolbar/MoreDropdown.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["__defProp","Object","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toCommonJS","mod","value","MoreDropdown_exports","MoreDropdown","module","exports","import_jsx_runtime","require","import_react","import_react2","import_components","import_capabilities","import_ToolbarButton","import_icons","import_shortcuts","import_t","INLINE_ITEMS","label","SHORTCUTS","subscript","command","icon","SubscriptIcon","isActive","s","isSubscript","label2","superscript","SuperscriptIcon","isActive2","isSuperscript","ALIGN_ITEMS","label3","alignLeft","AlignLeftIcon","isActive3","textAlign","label4","alignCenter","AlignCenterIcon","isActive4","label5","alignRight","AlignRightIcon","isActive5","label6","alignJustify","AlignJustifyIcon","isActive6","BLOCK_ITEMS","label7","horizontalRule","HorizontalRuleIcon","label8","clearFormatting","ClearFormattingIcon","MoreIcon","jsx","DotsThreeIcon","size","weight","ItemSection","param","items","state","onSelect","Fragment","children","map","item","_item_isActive","Icon","label9","DropdownMenu","Item","closeOnSelect","backgroundColor","onSelect1","payload"],"sources":["../../../src/toolbar/MoreDropdown.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["__defProp","Object","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toCommonJS","mod","value","MoreDropdown_exports","MoreDropdown","module","exports","import_jsx_runtime","require","import_react","import_react2","import_components","import_capabilities","import_ToolbarButton","import_icons","import_shortcuts","import_t","INLINE_ITEMS","label","SHORTCUTS","subscript","command","icon","SubscriptIcon","isActive","s","isSubscript","label2","superscript","SuperscriptIcon","isActive2","isSuperscript","ALIGN_ITEMS","label3","alignLeft","AlignLeftIcon","isActive3","textAlign","label4","alignCenter","AlignCenterIcon","isActive4","label5","alignRight","AlignRightIcon","isActive5","label6","alignJustify","AlignJustifyIcon","isActive6","BLOCK_ITEMS","label7","horizontalRule","HorizontalRuleIcon","label8","clearFormatting","ClearFormattingIcon","MoreIcon","jsx","DotsThreeIcon","size","weight","ItemSection","param","items","state","onSelect","Fragment","children","map","item","_item_isActive","Icon","label9","DropdownMenu","Item","closeOnSelect","backgroundColor","onSelect1","payload","editorRef","capabilities","disabled","open","setOpen","useState","selectedRef","useRef","handleSelect","handleSelect2","_editorRef_current","current","executeCommand","inlineItems","filter"],"sources":["../../../src/toolbar/MoreDropdown.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@multiplatform.one/rich-text",
-  "version": "7.7.6",
+  "version": "7.8.0",
   "description": "Cross-platform rich text editor with markdown support and syntax highlighting",
   "keywords": [
     "cross-platform",
@@ -60,6 +60,7 @@
     "@phosphor-icons/react": "^2.1.10",
     "@tamagui/linear-gradient": "2.7.6",
     "@tanstack/react-form": "^1.29.1",
+    "@tiptap/core": "^3.30.0",
     "@tiptap/extension-character-count": "^3.30.0",
     "@tiptap/extension-code-block-lowlight": "^3.30.0",
     "@tiptap/extension-color": "^3.30.0",
@@ -93,13 +94,14 @@
     "marked": "^17.0.6",
     "tamagui": "2.7.6",
     "turndown": "^7.2.4",
-    "@multiplatform.one/components": "7.7.6",
-    "@multiplatform.one/forms": "7.7.6",
-    "@multiplatform.one/markdown": "7.7.6",
-    "@multiplatform.one/theme": "7.7.6"
+    "@multiplatform.one/components": "7.8.0",
+    "@multiplatform.one/theme": "7.8.0",
+    "@multiplatform.one/forms": "7.8.0",
+    "@multiplatform.one/markdown": "7.8.0"
   },
   "devDependencies": {
     "@tamagui/build": "2.7.6",
+    "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.2",
     "@types/katex": "^0.16.7",
     "@vitejs/plugin-react": "^6.0.1",
@@ -108,9 +110,9 @@
     "react": "19.2.5",
     "react-dom": "19.2.5",
     "vitest": "^4.1.5",
-    "@multiplatform.one/config": "7.7.6",
-    "@multiplatform.one/storybook": "7.7.6",
-    "@multiplatform.one/test-utils": "7.7.6"
+    "@multiplatform.one/test-utils": "7.8.0",
+    "@multiplatform.one/storybook": "7.8.0",
+    "@multiplatform.one/config": "7.8.0"
   },
   "peerDependencies": {
     "i18next": "^25.0.0",

package/src/RichEditor.native.spec.tsx

@@ -0,0 +1,158 @@
+import { readFileSync } from "node:fs";
+import { runInNewContext } from "node:vm";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+import * as React from "react";
+import * as jsxRuntime from "react/jsx-runtime";
+import { cleanup, fireEvent, render, screen } from "@testing-library/react";
+import { afterEach, beforeEach, describe, expect, it } from "vitest";
+import { fontCategoryStacks } from "@multiplatform.one/theme";
+import { JsxEmit, ModuleKind, transpileModule } from "typescript";
+
+let bodyFamily: string | undefined = "Inter";
+let headingFamily: string | undefined = "Inter";
+let bodyToken = "$body";
+let headingToken = "$heading";
+const Container = ({ children }: any) => <div>{children}</div>;
+const Pressable = ({ children, onPress, accessibilityLabel }: any) => (
+  <button aria-label={accessibilityLabel} onClick={onPress}>
+    {children}
+  </button>
+);
+const Tentap = React.forwardRef((_props: any, _ref) => (
+  <div
+    data-testid="tentap"
+    data-body={_props.bodyFontFamily}
+    data-heading={_props.headingFontFamily}
+  />
+));
+
+// RichEditor deliberately uses a guarded native require for its optional
+// WebView backend. Execute the real wrapper with that boundary substituted;
+// importing through the web bundler would turn it into the unavailable branch.
+const nativeExports: Record<string, any> = {};
+const modules: Record<string, any> = {
+  react: React,
+  "react/jsx-runtime": jsxRuntime,
+  "react-native": {
+    KeyboardAvoidingView: Container,
+    SafeAreaView: Container,
+    Pressable,
+    Modal: ({ visible, children }: any) => (visible ? <div>{children}</div> : null),
+    Platform: { OS: "ios" },
+    StyleSheet: { create: (styles: any) => styles },
+  },
+  tamagui: {
+    Text: Container,
+    View: Container,
+    XStack: Container,
+    YStack: Container,
+    getConfig: () => ({
+      fonts: {
+        [bodyToken.slice(1)]: { family: bodyFamily },
+        [headingToken.slice(1)]: { family: headingFamily },
+      },
+    }),
+    withStaticProperties: Object.assign,
+  },
+  "@multiplatform.one/theme": {
+    fontCategoryStacks,
+    useGlyphColor: () => "black",
+    sizeRecipeForToken: () => ({ iconSize: 18 }),
+    useResolvedKnobs: () => ({
+      knobProps: {
+        body: { fontFamily: bodyToken },
+        heading: { fontFamily: headingToken },
+        borderRadius: {},
+        panelPadding: { padding: 12 },
+      },
+    }),
+  },
+  "@multiplatform.one/components": { Pencil: () => null },
+  "@multiplatform.one/forms": { Button: Pressable, clampRadiusForLargeComponent: () => 4 },
+  "./types": { defaultEditorState: {} },
+  "./context": { RichEditorContext: { Provider: Container } },
+  "./styled": { EditorFrame: Container },
+  "./toolbar/FixedToolbar": { FixedToolbar: () => null },
+  "./preview": { parseHtmlPreview: () => ({ blocks: [], truncated: false }) },
+  "./editor/markdown": { htmlToMarkdown: (v: string) => v, markdownToHtml: (v: string) => v },
+  "./shared/t": { t: (v: string) => v },
+  "./editor/TentapEditor.native": { TentapEditor: Tentap },
+};
+runInNewContext(
+  transpileModule(
+    readFileSync(
+      path.join(path.dirname(fileURLToPath(import.meta.url)), "RichEditor.native.tsx"),
+      "utf8",
+    ),
+    {
+      compilerOptions: { module: ModuleKind.CommonJS, jsx: JsxEmit.ReactJSX },
+    },
+  ).outputText,
+  {
+    exports: nativeExports,
+    require: (name: string) => {
+      if (!(name in modules)) throw new Error(`Unexpected native wrapper import ${name}`);
+      return modules[name];
+    },
+  },
+);
+const RichEditor = nativeExports.RichEditor;
+afterEach(cleanup);
+beforeEach(() => {
+  bodyFamily = "Inter";
+  headingFamily = "Inter";
+  bodyToken = "$body";
+  headingToken = "$heading";
+});
+
+describe("native RichEditor font propagation", () => {
+  it.each([false, true])(
+    "passes resolved families to the editing document, inline=%s",
+    (inlineEditing) => {
+      render(<RichEditor inlineEditing={inlineEditing} initialContent="<p>Saved note</p>" />);
+      if (!inlineEditing) fireEvent.click(screen.getByRole("button", { name: "Edit rich text" }));
+      const editor = screen.getByTestId("tentap");
+      expect(editor.getAttribute("data-body")).toBe(
+        `${bodyFamily}, ${fontCategoryStacks["sans-serif"]}`,
+      );
+      expect(editor.getAttribute("data-heading")).toBe(
+        `${headingFamily}, ${fontCategoryStacks["sans-serif"]}`,
+      );
+    },
+  );
+});
+
+describe("native editor CSS font fallbacks", () => {
+  it("keeps configured families first and uses the selected category fallback", () => {
+    bodyFamily = "Custom Serif";
+    headingFamily = "Custom Mono";
+    bodyToken = "$serif";
+    headingToken = "$mono";
+    render(<RichEditor defaultFullscreen initialContent="<p>Saved note</p>" />);
+    const editor = screen.getByTestId("tentap");
+    expect(editor.getAttribute("data-body")).toBe(`${bodyFamily}, ${fontCategoryStacks.serif}`);
+    expect(editor.getAttribute("data-heading")).toBe(
+      `${headingFamily}, ${fontCategoryStacks.mono}`,
+    );
+  });
+
+  it("preserves explicit CSS stacks and intentional generic families", () => {
+    bodyFamily = "Georgia, serif";
+    headingFamily = "system-ui";
+    render(<RichEditor defaultFullscreen />);
+    const editor = screen.getByTestId("tentap");
+    expect(editor.getAttribute("data-body")).toBe(bodyFamily);
+    expect(editor.getAttribute("data-heading")).toBe(headingFamily);
+  });
+
+  it("uses the canonical fallback when no configured font exists", () => {
+    bodyFamily = undefined;
+    headingFamily = undefined;
+    headingToken = "$mono";
+    render(<RichEditor defaultFullscreen />);
+    const editor = screen.getByTestId("tentap");
+    expect(editor.getAttribute("data-body")).toBe(fontCategoryStacks["sans-serif"]);
+    expect(editor.getAttribute("data-heading")).toBe(fontCategoryStacks.mono);
+  });
+});

package/src/RichEditor.native.tsx

@@ -34,7 +34,13 @@ import {
 } from "react-native";
 import type { SizeTokens } from "tamagui";
 import { Text, View, XStack, YStack, getConfig, withStaticProperties } from "tamagui";
-import { useResolvedKnobs } from "@multiplatform.one/theme";
+import {
+  fontCategoryStacks,
+  sizeRecipeForToken,
+  useGlyphColor,
+  useResolvedKnobs,
+} from "@multiplatform.one/theme";
+import { Pencil } from "@multiplatform.one/components";
 import { Button, clampRadiusForLargeComponent } from "@multiplatform.one/forms";
 import type { EditorState, RichEditorProps, RichEditorRef, ToolbarSection } from "./types";
 import { defaultEditorState } from "./types";
@@ -265,6 +271,7 @@ const RichEditorImpl = forwardRef<RichEditorRef, RichEditorCombinedProps>(
       size,
       compact,
     });
+    const editGlyphColor = useGlyphColor("$color11");
 
     // Same resolver as the web RichEditor: the knob names a registered font
     // token ($body / $heading); the WebView needs its concrete CSS family
@@ -272,9 +279,22 @@ const RichEditorImpl = forwardRef<RichEditorRef, RichEditorCombinedProps>(
     const { bodyFontFamily, headingFontFamily } = useMemo(() => {
       const fonts = getConfig()?.fonts;
       const resolve = (token?: string) => {
-        if (!token) return undefined;
-        const key = token.startsWith("$") ? token.slice(1) : token;
-        return fonts?.[key]?.family as string | undefined;
+        const key = token?.replace(/^\$/, "") ?? "body";
+        const configured = fonts?.[key]?.family;
+        const family = typeof configured === "string" ? configured.trim() : undefined;
+        // RN's bare Inter name is not a font installed inside WKWebView.
+        // Preserve explicit CSS stacks; otherwise use the shared category fallback.
+        if (
+          family &&
+          /(?:^|,)\s*(?:serif|sans-serif|monospace|cursive|fantasy|system-ui|ui-serif|ui-sans-serif|ui-monospace|ui-rounded)\s*$/i.test(
+            family,
+          )
+        )
+          return family;
+        const fallback = Object.hasOwn(fontCategoryStacks, key)
+          ? fontCategoryStacks[key as keyof typeof fontCategoryStacks]
+          : fontCategoryStacks["sans-serif"];
+        return family ? `${family}, ${fallback}` : fallback;
       };
       return {
         bodyFontFamily: resolve(knobProps.body?.fontFamily),
@@ -381,6 +401,7 @@ const RichEditorImpl = forwardRef<RichEditorRef, RichEditorCombinedProps>(
     const cappedRadius = clampRadiusForLargeComponent(knobProps.borderRadius.borderRadius, 4);
     const disabled = !editable;
     const sizeToken = (knobProps.sizeToken ?? "$true") as any;
+    const editGlyphSize = sizeRecipeForToken(sizeToken, { touch: true }).iconSize;
 
     const preview = useMemo(() => parseHtmlPreview(committed.html, 6), [committed.html]);
     const previewEmpty = preview.blocks.length === 0;
@@ -484,9 +505,7 @@ const RichEditorImpl = forwardRef<RichEditorRef, RichEditorCombinedProps>(
             </YStack>
             {!disabled && (
               <View position="absolute" top="$2.5" right="$2.5">
-                <Text color="$color10" fontSize={15}>
-                  {"✎"}
-                </Text>
+                <Pencil color={editGlyphColor} size={editGlyphSize} accessible={false} />
               </View>
             )}
           </EditorFrame>
@@ -538,6 +557,8 @@ const RichEditorImpl = forwardRef<RichEditorRef, RichEditorCombinedProps>(
                     {TentapEditor ? (
                       <TentapEditor
                         ref={internalRef}
+                        bodyFontFamily={bodyFontFamily}
+                        headingFontFamily={headingFontFamily}
                         {...editorProps}
                         initialContent={committed.html}
                         initialJSON={committed.json ?? undefined}

package/src/RichTextEditor/index.tsx

@@ -56,9 +56,11 @@ function applyExternalContent(
 ) {
   if (!editor) return;
   if (capabilities === "markdown") {
+    if (isWeb && editor.getMarkdown() === next) return;
     editor.setMarkdown(next);
     return;
   }
+  if (isWeb && editor.getHTML() === next) return;
   editor.setHTML(next);
 }
 
@@ -135,12 +137,12 @@ export type RichTextEditorProps<
   TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>,
 > = Omit<
   FormFieldProps<TParentData, TName, TFieldValidator, TFormValidator, TData>,
-  "children" | "field"
+  "children" | "field" | "onChange"
 > &
   Partial<
     Omit<
       FieldComponentProps<TParentData, TName, TFieldValidator, TFormValidator, TData>,
-      "children"
+      "children" | "onChange"
     >
   > & {
     value?: string;

package/src/RichTextEditor/richTextEditor.spec.tsx

@@ -1,4 +1,4 @@
-import { forwardRef, useImperativeHandle } from "react";
+import { forwardRef, useImperativeHandle, useRef, useState } from "react";
 import { describe, expect, it, vi } from "vitest";
 
 const editorSpies = vi.hoisted(() => ({
@@ -92,14 +92,21 @@ vi.mock("@multiplatform.one/forms", async () => {
 
 vi.mock("../RichEditor", () => ({
   RichEditor: forwardRef((props: any, ref) => {
+    const content = useRef(props.initialContent ?? "");
     useImperativeHandle(ref, () => ({
-      setHTML: editorSpies.setHTML,
-      setMarkdown: editorSpies.setMarkdown,
+      setHTML: (next: string) => {
+        content.current = next;
+        editorSpies.setHTML(next);
+      },
+      setMarkdown: (next: string) => {
+        content.current = next;
+        editorSpies.setMarkdown(next);
+      },
       focus: editorSpies.focus,
       blur: vi.fn(),
-      getHTML: () => props.initialContent ?? "",
+      getHTML: () => content.current,
       getJSON: () => null,
-      getMarkdown: () => "",
+      getMarkdown: () => content.current,
       getState: () => ({}),
       executeCommand: vi.fn(),
     }));
@@ -111,7 +118,18 @@ vi.mock("../RichEditor", () => ({
         data-initial={props.initialContent}
         data-bubble={props.showBubbleToolbar ? "true" : undefined}
         data-sections={props.sections ? JSON.stringify(props.sections) : undefined}
-      />
+      >
+        <button
+          type="button"
+          data-testid="simulate-edit"
+          onClick={() => {
+            content.current = props.capabilities === "markdown" ? "edited" : "<p>edited</p>";
+            props.onChange(content.current);
+          }}
+        >
+          edit
+        </button>
+      </div>
     );
   }),
 }));
@@ -198,6 +216,22 @@ describe("RichTextEditor form-integrated field", () => {
     expect(editorSpies.setMarkdown).toHaveBeenCalledWith("world");
   });
 
+  it.each(["full", "markdown"] as const)(
+    "does not replace a %s document when its user edit is echoed",
+    async (capabilities) => {
+      editorSpies.setHTML.mockClear();
+      editorSpies.setMarkdown.mockClear();
+      function Controlled() {
+        const [value, setValue] = useState("");
+        return <RichTextEditor value={value} onChange={setValue} capabilities={capabilities} />;
+      }
+      const { getByTestId } = renderWithProviders(<Controlled />);
+      await act(async () => getByTestId("simulate-edit").click());
+      expect(editorSpies.setHTML).not.toHaveBeenCalled();
+      expect(editorSpies.setMarkdown).not.toHaveBeenCalled();
+    },
+  );
+
   it("clears the editor when the form field value is reset", async () => {
     editorSpies.setHTML.mockClear();
     const { getByTestId } = renderWithProviders(

package/src/editor/SlashCommands.spec.tsx

@@ -1,6 +1,8 @@
 import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 
-const suggestion = vi.hoisted(() => ({ fn: vi.fn(() => ({ props: {} })) }));
+const suggestion = vi.hoisted(() => ({
+  fn: vi.fn((_options: Record<string, unknown>) => ({ props: {} })),
+}));
 
 vi.mock("@tiptap/suggestion", () => ({ default: suggestion.fn }));
 

package/src/editor/TentapEditor.native.spec.tsx

@@ -0,0 +1,120 @@
+import { act, cleanup, render } from "@testing-library/react";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { TentapEditor } from "./TentapEditor.native";
+
+const state = vi.hoisted(() => ({
+  props: {} as any,
+  scheme: "light",
+  theme: { color12: { val: "black" } },
+  editor: {
+    injectCSS: vi.fn(),
+    setContent: vi.fn(),
+    _subscribeToEditorStateUpdate: vi.fn(() => vi.fn()),
+    getEditorState: vi.fn(() => ({})),
+  },
+}));
+
+vi.mock("react-native", () => ({
+  StyleSheet: { create: (styles: any) => styles },
+  useColorScheme: () => "light",
+}));
+vi.mock("tamagui", () => ({
+  View: ({ children }: any) => <div>{children}</div>,
+  useTheme: () => state.theme,
+  useThemeName: () => state.scheme,
+}));
+vi.mock("../context", () => ({
+  RichEditorContext: { useStyledContext: () => ({ disabled: false }) },
+}));
+vi.mock("../shared/t", () => ({ t: (value: string) => value }));
+vi.mock("@10play/tentap-editor", () => ({
+  RichText: (props: any) => {
+    state.props = props;
+    return <div data-testid="native-webview" />;
+  },
+  useEditorBridge: () => state.editor,
+  TenTapStartKit: [],
+  UnderlineBridge: {},
+  LinkBridge: {},
+  ColorBridge: {},
+  HighlightBridge: {},
+  ImageBridge: {},
+  TaskListBridge: {},
+  PlaceholderBridge: { configureExtension: () => ({}) },
+  darkEditorCss: "body { background: black; color: white; }",
+  darkEditorTheme: {},
+}));
+
+beforeEach(() => {
+  vi.useFakeTimers();
+  vi.clearAllMocks();
+  state.scheme = "light";
+  state.theme = { color12: { val: "black" } };
+});
+afterEach(() => {
+  cleanup();
+  vi.useRealTimers();
+});
+
+describe("Tentap native stylesheet lifecycle", () => {
+  it("waits for load, reapplies after the iOS replacement document, and updates live styling", () => {
+    const view = render(
+      <TentapEditor initialContent="<p>Saved note</p>" bodyFontFamily="system-ui" />,
+    );
+    act(() => {
+      vi.advanceTimersByTime(1000);
+    });
+    expect(state.editor.injectCSS).not.toHaveBeenCalled();
+
+    // Installed RichText calls its supplied props.onLoad after its own loaded
+    // state and first-iOS-load key change. That replacement fires onLoad again.
+    const originalLoad = state.props.onLoad;
+    act(() => originalLoad({ nativeEvent: { url: "about:blank" } }));
+    expect(state.editor.injectCSS).toHaveBeenCalledTimes(3);
+    act(() => state.props.onLoad({ nativeEvent: { url: "about:blank" } }));
+    expect(state.editor.injectCSS).toHaveBeenCalledTimes(6);
+    expect(state.editor.injectCSS).toHaveBeenLastCalledWith(
+      expect.stringContaining("font-family: system-ui"),
+      "multiplatform-tentap-content",
+    );
+
+    state.scheme = "dark";
+    state.theme = { color12: { val: "white" } };
+    view.rerender(
+      <TentapEditor initialContent="<p>Saved note</p>" bodyFontFamily="Georgia, serif" />,
+    );
+    expect(state.editor.injectCSS).toHaveBeenCalledWith(
+      expect.stringContaining("background: black"),
+      "multiplatform-tentap-dark",
+    );
+    expect(state.editor.injectCSS).toHaveBeenCalledWith(
+      expect.stringContaining("--color12: white"),
+      "multiplatform-tentap-palette",
+    );
+    expect(state.editor.injectCSS).toHaveBeenLastCalledWith(
+      expect.stringContaining("font-family: Georgia, serif"),
+      "multiplatform-tentap-content",
+    );
+    expect(state.editor.setContent).not.toHaveBeenCalled();
+    const calls = state.editor.injectCSS.mock.calls.length;
+    view.unmount();
+    act(() => {
+      vi.advanceTimersByTime(1000);
+    });
+    expect(state.editor.injectCSS).toHaveBeenCalledTimes(calls);
+  });
+
+  it("uses the latest scheme when styling changes before the WebView loads", () => {
+    const view = render(<TentapEditor />);
+    state.scheme = "dark";
+    state.theme = { color12: { val: "white" } };
+    view.rerender(<TentapEditor />);
+    expect(state.editor.injectCSS).not.toHaveBeenCalled();
+    act(() => state.props.onLoad({ nativeEvent: { url: "about:blank" } }));
+    expect(state.editor.injectCSS).toHaveBeenCalledTimes(3);
+    expect(state.editor.injectCSS).toHaveBeenCalledWith(
+      expect.stringContaining("--color12: white"),
+      "multiplatform-tentap-palette",
+    );
+  });
+});

package/src/editor/TentapEditor.native.tsx

@@ -43,6 +43,7 @@ import { PALETTE_THEME_TOKENS } from "../constants";
 import { t } from "../shared/t";
 import { getEditorStateFromBridge } from "./useEditorState";
 import { getEditorCSS } from "./editorStyles";
+import { escapeNativeEditorCSS } from "./nativeEditorCSS";
 import { htmlToMarkdown, markdownToHtml } from "./markdown";
 
 function useNativeEditorDarkMode(): boolean {
@@ -126,62 +127,43 @@ export const TentapEditor = forwardRef(
       },
     });
 
-    // 10Tap defaults the WebView to a white shell; darkEditorTheme fixes the RN WebView,
-    // and darkEditorCss aligns the inner ProseMirror document with dark mode.
-    useEffect(() => {
-      const id = setTimeout(() => {
-        if (isDarkMode) {
-          editor.injectCSS(darkEditorCss, "multiplatform-tentap-dark");
-        } else {
-          editor.injectCSS("", "multiplatform-tentap-dark");
-        }
-      }, 150);
-      return () => clearTimeout(id);
-    }, [editor, isDarkMode]);
-
-    // Web-authored color/highlight marks store theme custom properties
-    // (`var(--red11)`); the 10Tap webview has no tamagui stylesheet, so
-    // define the palette vars there from the active theme (Axiom 5: same
-    // tokens, resolved once per scheme).
     const theme = useTheme();
-    useEffect(() => {
-      const id = setTimeout(() => {
-        const decls = PALETTE_THEME_TOKENS.map((token) => {
-          const value = (theme as any)[token]?.val;
-          return value ? `--${token}: ${value};` : "";
-        }).join(" ");
-        editor.injectCSS(`:root { ${decls} }`, "multiplatform-tentap-palette");
-      }, 150);
-      return () => clearTimeout(id);
-    }, [editor, theme]);
+    const webviewLoaded = useRef(false);
+    const applyEditorStyles = useCallback(() => {
+      const inject = (css: string, tag: string) => {
+        editor.injectCSS(escapeNativeEditorCSS(css), tag);
+      };
+      inject(isDarkMode ? darkEditorCss : "", "multiplatform-tentap-dark");
+      // The WebView has no Tamagui stylesheet. Resolve the same palette as
+      // web-authored color/highlight marks before applying content rules.
+      const decls = PALETTE_THEME_TOKENS.map((token) => {
+        const value = (theme as any)[token]?.val;
+        return value ? `--${token}: ${value};` : "";
+      }).join(" ");
+      inject(`:root { ${decls} }`, "multiplatform-tentap-palette");
+      inject(
+        getEditorCSS({
+          minHeight,
+          maxHeight,
+          bodyFontFamily,
+          headingFontFamily,
+          fullscreen: fill,
+          motionMs: 0,
+        }),
+        "multiplatform-tentap-content",
+      );
+    }, [editor, isDarkMode, theme, minHeight, maxHeight, bodyFontFamily, headingFontFamily, fill]);
 
-    // The content rules: padding, the $body / $heading families, block flow
-    // for lists and quotes, code and image chrome. Web gets them from
-    // getEditorCSS() through a <style> tag; the 10Tap WebView is a separate
-    // document with no Tamagui stylesheet, so with nothing injected it renders
-    // WebKit's defaults, which is zero padding and the UA serif (MPO-187, Clay's
-    // screenshot: "Hello world" at x=0 in Times while the toolbar is the system
-    // sans). One source: the same function the web editor uses, so a fix on
-    // either side lands on both. motionMs 0 because there is no bubble menu on
-    // native, and the palette block above already defines every var(--colorN)
-    // this CSS reads. `.ProseMirror` outranks darkEditorCss's `* { color }`, so
-    // the foreground also moves onto the theme's --color12 in both schemes.
+    // TenTap invokes this after its internal onLoad handling, including its
+    // first-load iOS reload. Apply on every load so the replacement document
+    // receives the styles too; a mount-time timer can target the old one.
+    const handleEditorLoad = useCallback(() => {
+      webviewLoaded.current = true;
+      applyEditorStyles();
+    }, [applyEditorStyles]);
     useEffect(() => {
-      const id = setTimeout(() => {
-        editor.injectCSS(
-          getEditorCSS({
-            minHeight,
-            maxHeight,
-            bodyFontFamily,
-            headingFontFamily,
-            fullscreen: fill,
-            motionMs: 0,
-          }),
-          "multiplatform-tentap-content",
-        );
-      }, 150);
-      return () => clearTimeout(id);
-    }, [editor, minHeight, maxHeight, bodyFontFamily, headingFontFamily, fill]);
+      if (webviewLoaded.current) applyEditorStyles();
+    }, [applyEditorStyles]);
 
     // Subscribe to editor state updates
     useEffect(() => {
@@ -349,7 +331,11 @@ export const TentapEditor = forwardRef(
         overflow="hidden"
         opacity={ctx.disabled ? 0.5 : 1}
       >
-        <RichText editor={editor} style={fill ? styles.editorFill : styles.editor} />
+        <RichText
+          editor={editor}
+          style={fill ? styles.editorFill : styles.editor}
+          onLoad={handleEditorLoad}
+        />
       </View>
     );
   },