@octane-xplat/lexical 0.0.1 → 0.11.0

package/dist/web/index2.js

@@ -0,0 +1,349 @@
+import { Fragment, __s, bag10, bag3, child, clone, componentSlot, createScopedElement, createScopedValue, drainFrag, hookSlots, markChildrenBlock, positionalChildren, setStyle, sibling, template, useEffect, useImperativeHandle, useRef, useState } from "octane";
+import { bindSignalAttribute, bindSignalChild, createElementFromConfig, enableSignalBindings } from "octane/internal/client";
+import { AutoFocusPlugin, ContentEditable, EditorRefPlugin, HistoryPlugin, LexicalComposer, LexicalErrorBoundary, LinkPlugin, ListPlugin, OnChangePlugin, RichTextPlugin } from "@octanejs/lexical";
+import { $createParagraphNode, $createTextNode, $findMatchingParent, $getRoot, $getSelection, $isNodeSelection, $isRangeSelection, FORMAT_ELEMENT_COMMAND, FORMAT_TEXT_COMMAND, REDO_COMMAND, UNDO_COMMAND } from "lexical";
+import { $createHeadingNode, $createQuoteNode, $isHeadingNode, $isQuoteNode, HeadingNode, QuoteNode } from "@lexical/rich-text";
+import { $isListNode, INSERT_CHECK_LIST_COMMAND, INSERT_ORDERED_LIST_COMMAND, INSERT_UNORDERED_LIST_COMMAND, ListItemNode, ListNode } from "@lexical/list";
+import { $createLinkNode, $isLinkNode, AutoLinkNode, LinkNode, TOGGLE_LINK_COMMAND } from "@lexical/link";
+import { $createCodeNode, $isCodeNode, CodeNode } from "@lexical/code";
+import { $isHorizontalRuleNode, HorizontalRuleNode, INSERT_HORIZONTAL_RULE_COMMAND } from "@lexical/extension";
+import { $setBlocksType } from "@lexical/selection";
+import { $generateHtmlFromNodes, $generateNodesFromDOM } from "@lexical/html";
+//#region src/LexicalEditor.web.tsrx
+enableSignalBindings(1, true);
+var _t$0 = /* @__PURE__ */ template("<!><!><!><!><!>", 3, 1);
+var _t$1 = /* @__PURE__ */ template("<div></div>");
+var _hs$ = /* @__PURE__ */ hookSlots(11);
+var __childrenBody = {};
+var supported = true;
+var NODES = [
+	HeadingNode,
+	QuoteNode,
+	ListNode,
+	ListItemNode,
+	LinkNode,
+	AutoLinkNode,
+	CodeNode,
+	HorizontalRuleNode
+];
+var HEADING_TAG = {
+	heading1: "h1",
+	heading2: "h2",
+	heading3: "h3",
+	heading4: "h4",
+	heading5: "h5",
+	heading6: "h6"
+};
+var TEXT_FORMAT = {
+	bold: "bold",
+	italic: "italic",
+	underline: "underline",
+	strikethrough: "strikethrough",
+	code: "code",
+	highlight: "highlight",
+	subscript: "subscript",
+	superscript: "superscript"
+};
+var ELEMENT_FORMAT = {
+	alignLeft: "left",
+	alignCenter: "center",
+	alignRight: "right"
+};
+function setBlock(editor, is, create, match) {
+	editor.update(() => {
+		const sel = $getSelection();
+		if (!$isRangeSelection(sel)) return;
+		const block = $findMatchingParent(sel.anchor.getNode(), is);
+		const active = block != null && (match ? match(block) : true);
+		$setBlocksType(sel, () => active ? $createParagraphNode() : create());
+	});
+}
+function applyFormat(editor, format) {
+	const text = TEXT_FORMAT[format];
+	if (text) {
+		editor.dispatchCommand(FORMAT_TEXT_COMMAND, text);
+		return;
+	}
+	const el = ELEMENT_FORMAT[format];
+	if (el) {
+		editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, el);
+		return;
+	}
+	const tag = HEADING_TAG[format];
+	if (tag) {
+		setBlock(editor, $isHeadingNode, () => $createHeadingNode(tag), (n) => n.getTag() === tag);
+		return;
+	}
+	switch (format) {
+		case "paragraph":
+			setBlock(editor, () => true, () => $createParagraphNode(), () => false);
+			break;
+		case "blockquote":
+			setBlock(editor, $isQuoteNode, () => $createQuoteNode());
+			break;
+		case "codeBlock":
+			setBlock(editor, $isCodeNode, () => $createCodeNode());
+			break;
+		case "bulletList":
+			editor.dispatchCommand(INSERT_UNORDERED_LIST_COMMAND, void 0);
+			break;
+		case "orderedList":
+			editor.dispatchCommand(INSERT_ORDERED_LIST_COMMAND, void 0);
+			break;
+		case "taskList":
+			editor.dispatchCommand(INSERT_CHECK_LIST_COMMAND, void 0);
+			break;
+		case "horizontalRule": editor.dispatchCommand(INSERT_HORIZONTAL_RULE_COMMAND, void 0);
+	}
+}
+function isActive(editor, format) {
+	return editor.read(() => {
+		const sel = $getSelection();
+		if (sel == null) return false;
+		const text = TEXT_FORMAT[format];
+		if (text) return $isRangeSelection(sel) && sel.hasFormat(text);
+		const el = ELEMENT_FORMAT[format];
+		if (el) return sel.getNodes().some((n) => {
+			const block = $findMatchingParent(n, (p) => p.getFormatType != null);
+			return block != null && block.getFormatType() === el;
+		});
+		const tag = HEADING_TAG[format];
+		if (tag) return sel.getNodes().some((n) => {
+			return $findMatchingParent(n, $isHeadingNode)?.getTag() === tag;
+		});
+		switch (format) {
+			case "blockquote": return sel.getNodes().some((n) => $findMatchingParent(n, $isQuoteNode) != null);
+			case "codeBlock": return sel.getNodes().some((n) => $findMatchingParent(n, $isCodeNode) != null);
+			case "bulletList":
+			case "orderedList":
+			case "taskList": {
+				const want = format === "bulletList" ? "bullet" : format === "orderedList" ? "number" : "check";
+				return sel.getNodes().some((n) => {
+					return $findMatchingParent(n, $isListNode)?.getListType() === want;
+				});
+			}
+			case "link": return sel.getNodes().some((n) => $isLinkNode(n) || $isLinkNode($findMatchingParent(n, $isLinkNode)));
+			case "horizontalRule": return $isNodeSelection(sel) && sel.getNodes().some($isHorizontalRuleNode);
+			case "paragraph": return sel.getNodes().some((n) => $findMatchingParent(n, (p) => p.getType?.() === "paragraph"));
+			default: return false;
+		}
+	});
+}
+function flatOffset(root, key, offset) {
+	const contains = (node) => node.getKey() === key || (node.getChildren?.() ?? []).some(contains);
+	let acc = 0;
+	const visit = (node) => {
+		if (node.getKey() === key) {
+			acc += offset;
+			return true;
+		}
+		for (const c of node.getChildren?.() ?? []) if (contains(c)) {
+			if (visit(c)) return true;
+		} else acc += c.getTextContentSize?.() ?? 0;
+		return false;
+	};
+	visit(root);
+	return acc;
+}
+function activeFormats(editor) {
+	const out = [];
+	for (const f of Object.keys(TEXT_FORMAT)) if (isActive(editor, f)) out.push(f);
+	for (const f of [
+		"paragraph",
+		"heading1",
+		"heading2",
+		"heading3",
+		"heading4",
+		"heading5",
+		"heading6",
+		"blockquote",
+		"bulletList",
+		"orderedList",
+		"taskList",
+		"codeBlock",
+		"link"
+	]) if (isActive(editor, f)) out.push(f);
+	return out;
+}
+var LexicalEditor = /* @__PURE__ */ __s(function LexicalEditor(props, __s, __extra) {
+	__s.block;
+	const editorRef = useRef(null, _hs$ + 0);
+	const lastEmitted = useRef(void 0, _hs$ + 1);
+	const lastJSON = useRef(void 0, _hs$ + 2);
+	const lastHTMLInput = useRef(JSON.stringify([props.json !== void 0, props.value]), _hs$ + 3);
+	const lastJSONInput = useRef(JSON.stringify(props.json), _hs$ + 4);
+	const bound = useRef(void 0, _hs$ + 5);
+	const [exposedHandle, setHandle] = useState(null, _hs$ + 6);
+	useImperativeHandle(props.ref, () => exposedHandle, [exposedHandle], _hs$ + 7);
+	const initialConfig = {
+		namespace: "octane-xplat/lexical",
+		nodes: props.web?.replaceNodes ? props.web.nodes ?? [] : [.../* @__PURE__ */ new Set([...NODES, ...props.web?.nodes ?? []])],
+		editable: props.editable !== false,
+		editorState: props.json != null ? JSON.stringify(props.json) : props.value != null ? (editor) => {
+			const dom = new DOMParser().parseFromString(props.value, "text/html");
+			const nodes = $generateNodesFromDOM(editor, dom);
+			$getRoot().append(...nodes);
+		} : void 0,
+		onError: (e) => {
+			throw e;
+		}
+	};
+	const attach = (editor) => {
+		if (!editor || bound.current?.native === editor) return;
+		editorRef.current = editor;
+		bound.current = {
+			getHTML: () => editor.read(() => $generateHtmlFromNodes(editor)),
+			setHTML: (html) => editor.update(() => {
+				const dom = new DOMParser().parseFromString(html, "text/html");
+				const nodes = $generateNodesFromDOM(editor, dom);
+				$getRoot().clear().append(...nodes);
+			}),
+			getJSON: () => editor.getEditorState().toJSON(),
+			setJSON: (doc) => editor.setEditorState(editor.parseEditorState(JSON.stringify(doc))),
+			apply: (format) => {
+				editor.focus();
+				applyFormat(editor, format);
+			},
+			linkTo: (url, anchor) => {
+				if (anchor != null && anchor !== "") editor.update(() => {
+					const link = $createLinkNode(url);
+					link.append($createTextNode(anchor));
+					const sel = $getSelection();
+					if ($isRangeSelection(sel)) sel.insertNodes([link]);
+				});
+				else editor.dispatchCommand(TOGGLE_LINK_COMMAND, url);
+			},
+			removeLink: () => editor.dispatchCommand(TOGGLE_LINK_COMMAND, null),
+			isActive: (format) => isActive(editor, format),
+			undo: () => editor.dispatchCommand(UNDO_COMMAND, void 0),
+			redo: () => editor.dispatchCommand(REDO_COMMAND, void 0),
+			focus: () => editor.focus(),
+			blur: () => editor.blur(),
+			isFocused: () => {
+				const root = editor.getRootElement();
+				return root != null && root === document.activeElement;
+			},
+			native: editor
+		};
+		setHandle(bound.current);
+		props.onJSONReady?.(true);
+		props.onReady?.();
+	};
+	useEffect(() => {
+		if (!editorRef.current) return;
+		const stamp = JSON.stringify([props.json !== void 0, props.value]);
+		if (stamp === lastHTMLInput.current) return;
+		lastHTMLInput.current = stamp;
+		if (props.json !== void 0 || props.value === void 0 || props.value === lastEmitted.current) return;
+		bound.current?.setHTML(props.value);
+	}, [
+		exposedHandle,
+		props.value,
+		props.json
+	], _hs$ + 8);
+	useEffect(() => {
+		if (!editorRef.current) return;
+		const stamp = JSON.stringify(props.json);
+		if (stamp === lastJSONInput.current) return;
+		lastJSONInput.current = stamp;
+		if (props.json === void 0 || stamp === lastJSON.current) return;
+		bound.current?.setJSON(props.json);
+	}, [exposedHandle, props.json], _hs$ + 9);
+	useEffect(() => {
+		editorRef.current?.setEditable(props.editable !== false);
+	}, [exposedHandle, props.editable], _hs$ + 10);
+	const emitChange = (state, editor) => {
+		const html = state.read(() => $generateHtmlFromNodes(editor));
+		lastEmitted.current = html;
+		props.onChange?.(html);
+		const doc = state.toJSON();
+		lastJSON.current = JSON.stringify(doc);
+		props.onJSONChange?.(doc);
+		state.read(() => {
+			const sel = $getSelection();
+			if ($isRangeSelection(sel) && props.onSelectionChange) {
+				const root = $getRoot();
+				props.onSelectionChange({
+					start: flatOffset(root, sel.anchor.key, sel.anchor.offset),
+					end: flatOffset(root, sel.focus.key, sel.focus.offset),
+					active: activeFormats(editor)
+				});
+			}
+		});
+	};
+	if (__s.block.pending && !__s.block.crossRenderUpdate) return;
+	function __children$1(__props, __s, __extra) {
+		const __block = __s.block;
+		let _b = __s.slots[0];
+		if (_b === void 0) {
+			let _m0, _m1, _m2, _m5, _m6, _m7;
+			const _root = clone(_t$0);
+			_m0 = __block.parentNode;
+			const _el0 = child(_root);
+			_m1 = _el0;
+			const _el1 = sibling(_el0, 1);
+			_m2 = _el1;
+			const _el2 = sibling(_el1, 1);
+			_m5 = _el2;
+			const _el3 = sibling(_el2, 1);
+			_m6 = _el3;
+			_m7 = sibling(_el3, 1);
+			drainFrag(_root, __block.parentNode, __block.endMarker);
+			_b = bag10(__s, null, _m0, _m1, _m2, null, void 0, _m5, _m6, _m7, null, void 0);
+		}
+		componentSlot(__s, 1, _b.a, RichTextPlugin, {
+			"contentEditable": createScopedValue(() => createElementFromConfig("c:8bd4dc5e", ContentEditable, {
+				id: props.id,
+				"aria-placeholder": props.placeholder ?? "",
+				placeholder: null,
+				className: "vx-lexical-input",
+				style: { outline: "none" },
+				onFocus: props.onFocus,
+				onBlur: props.onBlur
+			})),
+			"placeholder": props.placeholder ? createScopedValue(() => createScopedElement("div", {
+				className: "vx-lexical-placeholder",
+				style: {
+					position: "absolute",
+					inset: "8px auto auto 10px",
+					pointerEvents: "none",
+					opacity: .5
+				}
+			}, () => props.placeholder)) : null,
+			"ErrorBoundary": LexicalErrorBoundary
+		}, _b.b, void 0, 2, void 0, void 0, "c:1283dc87");
+		_b.k = bindSignalChild(__s, _b.k, 2, _b.a, !props.web?.replacePlugins ? createScopedElement(Fragment, {}, () => positionalChildren([
+			createElementFromConfig("c:2ac25b31", HistoryPlugin, {}),
+			createElementFromConfig("c:8c987b0a", ListPlugin, {}),
+			createElementFromConfig("c:c85acd4c", LinkPlugin, {}),
+			props.autofocus ? createElementFromConfig("c:4e4f8e9d", AutoFocusPlugin, {}) : null
+		])) : null, "b:d23e6e54", _b.c, true, void 0, void 0, void 0);
+		componentSlot(__s, 3, _b.a, OnChangePlugin, { "onChange": emitChange }, _b.f, void 0, 2, void 0, void 0, "c:fbe62b73");
+		componentSlot(__s, 4, _b.a, EditorRefPlugin, { "editorRef": attach }, _b.g, void 0, 2, void 0, void 0, "c:bcb623dd");
+		_b.l = bindSignalChild(__s, _b.l, 5, _b.a, props.web?.plugins, "b:6078ff9a", _b.h, true, void 0, void 0, void 0);
+	}
+	let _b = __s.slots[0];
+	if (_b === void 0) {
+		let _m1;
+		const _root = clone(_t$1);
+		_m1 = _root;
+		_b = bag3(__s, _root, void 0, _m1, void 0);
+	}
+	_b.a = bindSignalAttribute(__s, _b.a, _b.b, "class", props.className, "b:748f4137", "class");
+	{
+		const _v = {
+			position: "relative",
+			...props.style
+		};
+		if (_b.c !== _v) {
+			setStyle(_b.b, _v, _b.c);
+			_b.c = _v;
+		}
+	}
+	componentSlot(__s, 1, _b.b, LexicalComposer, {
+		"initialConfig": initialConfig,
+		"children": markChildrenBlock(__children$1, __childrenBody)
+	}, void 0, void 0, void 0, void 0, void 0, "c:9d1ef90e");
+});
+//#endregion
+export { LexicalEditor, supported };

package/dist/web/octane-client-build.json

@@ -0,0 +1,8 @@
+{
+  "version": 1,
+  "buildId": "732a6a63-dfe4-4d61-bc19-af20265044e1",
+  "mode": "production",
+  "capabilities": {
+    "independentHydration": false
+  }
+}

package/package.json

@@ -1,11 +1,99 @@
 {
   "name": "@octane-xplat/lexical",
-  "version": "0.0.1",
-  "description": "Placeholder stub for @octane-xplat/lexical — no supported API yet.",
+  "version": "0.11.0",
+  "description": "Unified rich-text editor facade for Octane xplat — live lexical on web/AppKit, Aztec + lexical document model on Android",
+  "keywords": [
+    "cross-platform",
+    "editor",
+    "lexical",
+    "octane",
+    "rich-text",
+    "richtext",
+    "xplat"
+  ],
+  "homepage": "https://github.com/octane-xplat/octane-xplat/tree/main/packages/lexical",
   "license": "MIT",
   "repository": {
     "type": "git",
     "url": "https://github.com/octane-xplat/octane-xplat",
     "directory": "packages/lexical"
+  },
+  "files": [
+    "dist",
+    "types",
+    "src",
+    "platforms"
+  ],
+  "type": "module",
+  "exports": {
+    ".": {
+      "macos": {
+        "types": "./types/index.macos.d.ts",
+        "default": "./src/index.macos.ts"
+      },
+      "web": {
+        "types": "./types/index.d.ts",
+        "default": "./dist/web/index.js"
+      },
+      "native": {
+        "types": "./types/index.d.ts",
+        "default": "./dist/native/index.js"
+      },
+      "types": "./types/index.d.ts",
+      "default": "./dist/native/index.js"
+    }
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "@lexical/code": "0.51.0",
+    "@lexical/extension": "0.51.0",
+    "@lexical/html": "0.51.0",
+    "@lexical/link": "0.51.0",
+    "@lexical/list": "0.51.0",
+    "@lexical/rich-text": "0.51.0",
+    "@lexical/selection": "0.51.0",
+    "@lexical/utils": "0.51.0",
+    "@octane-xplat/richtext": "0.11.0",
+    "@octanejs/lexical": "0.2.0",
+    "lexical": "0.51.0",
+    "zeed-dom": "0.18.0"
+  },
+  "devDependencies": {
+    "@nativescript-community/octane": "0.2.4",
+    "@nativescript/core": "9.1.2",
+    "@octane-xplat/macos-renderer": "0.11.0",
+    "@octanejs/vite-plugin": "0.1.61",
+    "octane": "0.6.3",
+    "typescript": "5.9.3",
+    "vite": "8.3.0",
+    "vitest": "5.0.1"
+  },
+  "peerDependencies": {
+    "@nativescript-community/octane": ">=0.2.1 <1",
+    "@nativescript/core": ">=9.1.0 <10",
+    "octane": ">=0.6.3 <1"
+  },
+  "peerDependenciesMeta": {
+    "@nativescript-community/octane": {
+      "optional": true
+    },
+    "@nativescript/core": {
+      "optional": true
+    },
+    "octane": {
+      "optional": true
+    }
+  },
+  "nativescript": {
+    "platforms": {
+      "android": "9.1.0",
+      "ios": "9.1.0"
+    }
+  },
+  "scripts": {
+    "build": "vite build && vite build --mode native && tsc -p tsconfig.types.json && node ../../scripts/check-native-dist.mjs && node ../richtext/build-browser.mjs",
+    "test:native": "vitest run --config vitest.native.config.mts"
   }
-}
+}

package/src/Editor.macos.tsx

@@ -0,0 +1,9 @@
+/** @jsxImportSource @octane-xplat/macos-renderer */
+import type { LexicalEditorProps } from './types'
+import browser from '../dist/macos/browser.js'
+import { NativeEditor } from '@octane-xplat/richtext/macos-host'
+
+/** AppKit mounts the local editor engine in WKWebView. */
+export function LexicalEditor(props: LexicalEditorProps) {
+	return <NativeEditor {...props} browser={browser} />
+}

package/src/LexicalEditor.mobile.test.ts

@@ -0,0 +1,229 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+import {
+	createObjectContainer,
+	createObjectDriver,
+	createUniversalRoot,
+	flushUniversalSync,
+} from 'octane/universal/native'
+
+import type { LexicalJSON } from './types'
+
+// Controlled fake for the lazy JSON bridge — the real module's dynamic
+// imports aren't needed to test facade timing. `resolved`/`ready` model the
+// bridge settling; docs carry `html` so conversions stay deterministic.
+const bridge = vi.hoisted(() => ({
+	ready: false,
+	resolved: undefined as boolean | undefined,
+	waiters: [] as Array<(ok: boolean) => void>,
+}))
+
+vi.mock('./json-bridge', () => ({
+	ensureJSONBridge: () =>
+		bridge.resolved !== undefined
+			? Promise.resolve(bridge.resolved)
+			: new Promise<boolean>((resolve) => bridge.waiters.push(resolve)),
+	jsonBridgeReady: () => bridge.ready,
+	jsonToHTML: (doc: any) =>
+		doc && typeof doc === 'object' && typeof doc.html === 'string' ? doc.html : null,
+	htmlToJSON: (html: string) => ({ type: 'doc', html }),
+}))
+
+vi.mock('@octane-xplat/richtext', async () => {
+	return await import('../tests/fake-richtext.fixture.mobile.tsrx')
+})
+
+import { LexicalEditor } from './LexicalEditor.tsrx'
+import { hosts, resetFakeRichtext, setDefer } from '../tests/fake-richtext.fixture.mobile.tsrx'
+
+const docA = { type: 'doc', html: '<p>alpha</p>' } as unknown as LexicalJSON
+const docB = { type: 'doc', html: '<p>bravo</p>' } as unknown as LexicalJSON
+
+const roots: ReturnType<typeof createUniversalRoot>[] = []
+
+function mount(props: any) {
+	const container = createObjectContainer('nativescript')
+	const root = createUniversalRoot(container, createObjectDriver('nativescript'))
+	roots.push(root)
+	let handle: any = null
+	root.render(LexicalEditor, {
+		...props,
+		ref: (next: any) => {
+			handle = next
+		},
+	})
+
+	return {
+		root,
+		container,
+		get handle() {
+			return handle
+		},
+	}
+}
+
+function settleBridge(ok: boolean) {
+	bridge.ready = ok
+	bridge.resolved = ok
+	for (const resolve of bridge.waiters.splice(0)) {
+		resolve(ok)
+	}
+}
+
+async function settle() {
+	for (let i = 0; i < 12; i++) {
+		await Promise.resolve()
+	}
+
+	flushUniversalSync(() => {})
+}
+
+beforeEach(() => {
+	bridge.ready = false
+	bridge.resolved = undefined
+	bridge.waiters.length = 0
+	resetFakeRichtext()
+})
+
+afterEach(() => {
+	for (const root of roots.splice(0)) {
+		root.unmount()
+	}
+})
+
+describe('LexicalEditor native JSON readiness', () => {
+	it('applies an initial props.json once when the bridge settles after mount', async () => {
+		const onJSONReady = vi.fn()
+		mount({ json: docA, onJSONReady })
+		await settle()
+		expect(hosts[0].setCalls).toEqual([])
+
+		settleBridge(true)
+		await settle()
+		expect(onJSONReady).toHaveBeenCalledWith(true)
+		expect(hosts[0].html).toBe('<p>alpha</p>')
+		expect(hosts[0].setCalls).toEqual(['<p>alpha</p>'])
+	})
+
+	it('applies an initial props.json when the host readies after the bridge', async () => {
+		bridge.ready = true
+		bridge.resolved = true
+		setDefer(true)
+		mount({ json: docA })
+		await settle()
+		expect(hosts[0].setCalls).toEqual([])
+
+		hosts[0].ready()
+		await settle()
+		expect(hosts[0].html).toBe('<p>alpha</p>')
+		expect(hosts[0].setCalls).toEqual(['<p>alpha</p>'])
+	})
+
+	it('applies an initial props.json once when host and bridge are both late', async () => {
+		setDefer(true)
+		mount({ json: docA })
+		await settle()
+		hosts[0].ready()
+		await settle()
+		expect(hosts[0].setCalls).toEqual([])
+
+		settleBridge(true)
+		await settle()
+		expect(hosts[0].setCalls).toEqual(['<p>alpha</p>'])
+	})
+
+	it('keeps json precedence over value once readiness lands', async () => {
+		mount({ value: '<p>value</p>', json: docA })
+		await settle()
+		settleBridge(true)
+		await settle()
+		expect(hosts[0].html).toBe('<p>alpha</p>')
+	})
+
+	it('applies later props.json updates and skips identical docs', async () => {
+		const view = mount({ json: docA })
+		settleBridge(true)
+		await settle()
+		expect(hosts[0].setCalls).toEqual(['<p>alpha</p>'])
+
+		view.root.render(LexicalEditor, { json: docB } as any)
+		await settle()
+		expect(hosts[0].setCalls).toEqual(['<p>alpha</p>', '<p>bravo</p>'])
+
+		view.root.render(LexicalEditor, { json: docB } as any)
+		await settle()
+		expect(hosts[0].setCalls).toEqual(['<p>alpha</p>', '<p>bravo</p>'])
+	})
+
+	it('does not push a doc the editor itself emitted back at it', async () => {
+		const onJSONChange = vi.fn()
+		const view = mount({ onJSONChange })
+		settleBridge(true)
+		await settle()
+
+		const rig = hosts[0]
+		rig.html = '<p>typed</p>'
+		// The leaf calls props.onChange(html); the facade wraps it to emit JSON.
+		rig.props.onChange('<p>typed</p>')
+		await settle()
+		const emitted = onJSONChange.mock.calls[0][0]
+		expect(emitted).toEqual({ type: 'doc', html: '<p>typed</p>' })
+
+		view.root.render(LexicalEditor, { json: emitted, onJSONChange } as any)
+		await settle()
+		expect(rig.setCalls).toEqual([])
+	})
+
+	it('defers an imperative setJSON issued before the bridge settles', async () => {
+		const view = mount({})
+		await settle()
+		expect(view.handle).not.toBeNull()
+
+		view.handle.setJSON(docB)
+		expect(hosts[0].setCalls).toEqual([])
+		settleBridge(true)
+		await settle()
+		expect(hosts[0].setCalls).toEqual(['<p>bravo</p>'])
+	})
+
+	it('re-applies the current doc when the host rebinds', async () => {
+		mount({ json: docA })
+		settleBridge(true)
+		await settle()
+		expect(hosts[0].setCalls).toEqual(['<p>alpha</p>'])
+
+		hosts[0].rebind()
+		await settle()
+		expect(hosts[0].html).toBe('<p>alpha</p>')
+		expect(hosts[0].setCalls).toEqual(['<p>alpha</p>'])
+	})
+
+	it('ignores a bridge that settles after unmount', async () => {
+		const onJSONReady = vi.fn()
+		const view = mount({ json: docA, onJSONReady })
+		await settle()
+		view.root.unmount()
+
+		settleBridge(true)
+		await settle()
+		expect(onJSONReady).not.toHaveBeenCalled()
+		expect(hosts[0].setCalls).toEqual([])
+	})
+
+	it('reports bridge failure through onJSONReady without touching the host', async () => {
+		const onJSONReady = vi.fn()
+		const view = mount({ json: docA, onJSONReady })
+		await settle()
+		settleBridge(false)
+		await settle()
+		expect(onJSONReady).toHaveBeenCalledWith(false)
+		expect(hosts[0].setCalls).toEqual([])
+		expect(view.handle.getJSON()).toBeNull()
+	})
+
+	it('drops a doc the converter rejects instead of writing null HTML', async () => {
+		mount({ json: { type: 'doc', content: [{ type: 'mystery' }] } as any })
+		settleBridge(true)
+		await settle()
+		expect(hosts[0].setCalls).toEqual([])
+	})
+})