@gtkx/react 1.0.0-rc.2 → 1.0.0-rc.3

package/src/adw/element-config.ts

@@ -1,5 +1,18 @@
-import { type ElementConfig, internal, type ModuleExport } from "../reconciler/registry.js";
+import { type ElementConfig, forTypes, internal, type ModuleExport } from "../reconciler/registry.js";
 
+const CHILD_SETTER_TYPES: string[] = [
+    "AdwBin",
+    "AdwClamp",
+    "AdwClampScrollable",
+    "AdwNavigationPage",
+    "AdwSplitButton",
+    "AdwStatusPage",
+    "AdwTabOverview",
+    "AdwToastOverlay",
+    "AdwToggle",
+];
+
+const CONTENT_SETTER_TYPES: string[] = ["AdwBottomSheet", "AdwFlap", "AdwOverlaySplitView"];
 const childrenProps = internal("ChildrenProps");
 const breakpointsProps = adw("AdwBreakpointsProps");
 const preferencesRowProps = adw("AdwPreferencesRowProps");
@@ -10,42 +23,14 @@ const preferencesRowProps = adw("AdwPreferencesRowProps");
  * parent. Codegen imports this module, so it must never reach the GObject bindings.
  */
 const BUILTIN_ELEMENTS: Record<string, ElementConfig> = {
-    AdwBin: {
-        props: childrenProps,
-    },
-    AdwClamp: {
-        props: childrenProps,
-    },
-    AdwClampScrollable: {
-        props: childrenProps,
-    },
-    AdwNavigationPage: {
-        props: childrenProps,
-    },
-    AdwSplitButton: {
+    ...forTypes(CHILD_SETTER_TYPES, {
         props: childrenProps,
-    },
-    AdwStatusPage: {
-        props: childrenProps,
-    },
-    AdwTabOverview: {
+        omitProps: ["child"],
+    }),
+    ...forTypes(CONTENT_SETTER_TYPES, {
         props: childrenProps,
-    },
-    AdwToastOverlay: {
-        props: childrenProps,
-    },
-    AdwToggle: {
-        props: childrenProps,
-    },
-    AdwBottomSheet: {
-        props: childrenProps,
-    },
-    AdwFlap: {
-        props: childrenProps,
-    },
-    AdwOverlaySplitView: {
-        props: childrenProps,
-    },
+        omitProps: ["content"],
+    }),
     AdwViewStackPage: {
         lazy: true,
     },
@@ -58,15 +43,19 @@ const BUILTIN_ELEMENTS: Record<string, ElementConfig> = {
     AdwDialog: {
         props: breakpointsProps,
         component: adw("createDialogComponent"),
+        omitProps: ["child"],
     },
     AdwApplicationWindow: {
         props: breakpointsProps,
+        omitProps: ["content"],
     },
     AdwWindow: {
         props: breakpointsProps,
+        omitProps: ["content"],
     },
     AdwBreakpointBin: {
         props: breakpointsProps,
+        omitProps: ["child"],
     },
     AdwActionRow: {
         props: preferencesRowProps,
@@ -79,6 +68,7 @@ const BUILTIN_ELEMENTS: Record<string, ElementConfig> = {
     },
     AdwNavigationSplitView: {
         props: childrenProps,
+        omitProps: ["content"],
     },
     AdwLeaflet: {
         props: childrenProps,
@@ -115,6 +105,7 @@ const BUILTIN_ELEMENTS: Record<string, ElementConfig> = {
     },
     AdwToolbarView: {
         props: adw("AdwToolbarViewProps"),
+        omitProps: ["content"],
     },
     AdwHeaderBar: {
         props: internal("GtkHeaderBarProps"),
@@ -137,4 +128,4 @@ function adw(name: string): ModuleExport {
     return { module: "@gtkx/react/adw", export: name };
 }
 
-export { BUILTIN_ELEMENTS };
+export { CHILD_SETTER_TYPES, CONTENT_SETTER_TYPES, BUILTIN_ELEMENTS };

package/src/components/window.tsx

@@ -2,11 +2,24 @@ import type * as Gtk from "@gtkx/gi/gtk";
 import { type ElementType, type ReactNode, type Ref, useLayoutEffect, useState } from "react";
 import { useMergedRef } from "../hooks/use-merged-refs.js";
 import { ParentWindowContext } from "../hooks/use-parent-window.js";
+import { applyWrite } from "../reconciler/signals.js";
 
 type WindowComponentProps = {
     ref?: Ref<Gtk.Window | null> | undefined;
 };
 
+const presentWindow = (window: Gtk.Window): void => {
+    applyWrite(() => {
+        window.present();
+    });
+};
+
+const destroyWindow = (window: Gtk.Window): void => {
+    applyWrite(() => {
+        window.destroy();
+    });
+};
+
 const createWindowComponent = (Component: ElementType): ((props: WindowComponentProps) => ReactNode) => {
     return ({ ref, ...rest }: WindowComponentProps): ReactNode => {
         const [window, setWindow] = useState<Gtk.Window | null>(null);
@@ -17,10 +30,10 @@ const createWindowComponent = (Component: ElementType): ((props: WindowComponent
                 return;
             }
 
-            window.present();
+            presentWindow(window);
 
             return () => {
-                window.destroy();
+                destroyWindow(window);
             };
         }, [window]);
 

package/src/config.ts

@@ -1,3 +1,10 @@
 export { BUILTIN_ELEMENTS } from "./element-config.js";
 export type { DetachInfo, ElementBehavior, ElementConfig, ModuleExport, PlaceInfo } from "./reconciler/registry.js";
-export { defineElements, ELEMENTS, forTypes, internal, mergeElementConfigs } from "./reconciler/registry.js";
+export {
+    defineBehavior,
+    defineElements,
+    ELEMENTS,
+    forTypes,
+    internal,
+    mergeElementConfigs,
+} from "./reconciler/registry.js";

package/src/element-config.ts

@@ -32,6 +32,7 @@ const SINGLE_CHILD_TYPES: string[] = [
 const BUILTIN_ELEMENTS: Record<string, ElementConfig> = {
     ...forTypes(SINGLE_CHILD_TYPES, {
         props: internal("ChildrenProps"),
+        omitProps: ["child"],
     }),
     ...forTypes(["GtkHeaderBar", "GtkActionBar"], {
         props: internal("GtkHeaderBarProps"),
@@ -39,6 +40,7 @@ const BUILTIN_ELEMENTS: Record<string, ElementConfig> = {
     GtkWindow: {
         props: internal("ChildrenProps"),
         component: internal("createWindowComponent"),
+        omitProps: ["child"],
     },
     GtkLabel: {
         props: internal("ChildrenProps"),
@@ -84,6 +86,7 @@ const BUILTIN_ELEMENTS: Record<string, ElementConfig> = {
     },
     GtkOverlay: {
         props: internal("GtkOverlayProps"),
+        omitProps: ["child"],
     },
     GtkShortcutController: {
         props: internal("GtkShortcutControllerProps"),

package/src/hooks/use-signal.ts

@@ -25,6 +25,10 @@ type UseSignalOptions = {
  * Each emission runs the handler from the latest render, so it does not have to be stable and a
  * changing handler never reconnects the signal.
  *
+ * On React 19.2 this does not hold inside a component wrapped in `memo` or `forwardRef`, where every emission
+ * runs the handler captured on the first render. Keep the calling component unwrapped, or read the values the
+ * handler needs off the GObject itself. React fixes this on the 19.3 line.
+ *
  * @param object The GObject (or ref to one) to connect to.
  * @param signal The signal name, optionally with a detail suffix.
  * @param handler The callback invoked when the signal is emitted.

package/src/internal.ts

@@ -9,5 +9,6 @@ export { useObjectValue } from "./hooks/use-object-value.js";
 export type * from "./prop-types.js";
 export { isRootElement } from "./reconciler/root-element.js";
 export { createReconcilerRoot, type ReconcilerRoot, setReconcilerErrorHandler } from "./reconciler/root.js";
+export { applyWrite } from "./reconciler/signals.js";
 export { getAccessibleMetadata } from "./utils/accessible-metadata.js";
 export { type RefProp, resolveRefProp } from "./utils/ref-prop.js";

package/src/reconciler/apply-props.ts

@@ -6,7 +6,7 @@ import type { ElementBehavior, Props } from "./registry.js";
 import { applyAccessibleProps, isAccessibleProp } from "../utils/accessible-props.js";
 import { type TypeInfo, typeInfoFor } from "./metadata.js";
 import { type ElementNode, getOrCreateContext, type SignalTarget } from "./node.js";
-import { connectHandler, disconnectHandler } from "./signals.js";
+import { applyWrite, connectHandler, disconnectHandler } from "./signals.js";
 import { bufferText, hasSameText, isContentPaintableProp, markTextDirty, TEXT_PROP } from "./text.js";
 
 type PropDelta = { name: string; value: unknown; prevValue: unknown };
@@ -43,7 +43,9 @@ const writeValue = (object: GObject.Object, name: string, value: unknown): void
         return;
     }
 
-    Reflect.set(object, name, value);
+    applyWrite(() => {
+        Reflect.set(object, name, value);
+    });
 };
 
 const resetPlain = (object: GObject.Object, info: TypeInfo, name: string): void => {
@@ -65,9 +67,11 @@ const applyBufferText = (buffer: Gtk.TextBuffer, text: string): void => {
         return;
     }
 
-    buffer.beginIrreversibleAction();
-    buffer.setText(text, -1);
-    buffer.endIrreversibleAction();
+    applyWrite(() => {
+        buffer.beginIrreversibleAction();
+        buffer.setText(text, -1);
+        buffer.endIrreversibleAction();
+    });
 };
 
 const isBufferText = (node: ElementNode, name: string): node is ElementNode & { object: Gtk.TextBuffer } =>
@@ -169,7 +173,9 @@ const restoreActionableSensitivity = (node: ElementNode, info: TypeInfo, prev: P
     const desired = "sensitive" in next ? next.sensitive : info.defaults.sensitive;
 
     if (typeof desired === "boolean") {
-        Reflect.set(node.object, "sensitive", desired);
+        applyWrite(() => {
+            Reflect.set(node.object, "sensitive", desired);
+        });
     }
 };
 

package/src/reconciler/behaviors.ts

@@ -3,6 +3,7 @@ import type * as Gtk from "@gtkx/gi/gtk";
 import { getInstanceType, TYPE_INVALID, typeFromName, typeIsA } from "@gtkx/runtime";
 import { getOrInsert, isDeepEqual, structuredClone } from "@gtkx/utils";
 import type { DetachInfo, ElementBehavior, PlaceInfo, Props } from "./registry.js";
+import { applyWrite } from "./signals.js";
 import { hasSameText } from "./text.js";
 
 type SlotHooks<P extends GObject.Object, C extends GObject.Object> = {
@@ -176,7 +177,10 @@ const flushDeferred = <P extends GObject.Object, V>(
         return;
     }
 
-    Reflect.set(object, prop, state.desired);
+    applyWrite(() => {
+        Reflect.set(object, prop, state.desired);
+    });
+
     state.applied = state.desired;
 };
 
@@ -203,7 +207,9 @@ const deferred = <P extends GObject.Object, V>(
 const controlledText = (prop: string): ElementBehavior =>
     value(prop, (object, next) => {
         if (!hasSameText(object, prop, next)) {
-            Reflect.set(object, prop, next);
+            applyWrite(() => {
+                Reflect.set(object, prop, next);
+            });
         }
     });
 

package/src/reconciler/host-config.ts

@@ -32,7 +32,7 @@ import {
     type TextNode,
 } from "./node.js";
 import { isRootElement, type RootElement } from "./root-element.js";
-import { beginSuppression, disconnectAllHandlers, endSuppression } from "./signals.js";
+import { disconnectAllHandlers } from "./signals.js";
 import {
     didUpdateTextSurgically,
     enclosingHost,
@@ -88,15 +88,10 @@ const hostConfig = {
     getRootHostContext: (): Record<string, never> => HOST_CONTEXT,
     getChildHostContext: (parent: Record<string, never>): Record<string, never> => parent,
     getPublicInstance: (instance: Instance): object => getPublicInstance(instance),
-    prepareForCommit: (): null => {
-        beginSuppression();
-
-        return null;
-    },
+    prepareForCommit: (): null => null,
     resetAfterCommit: (): void => {
         flushTextHosts();
         flushBehaviors();
-        endSuppression();
     },
     preparePortalMount: (): void => undefined,
     clearContainer: (): void => undefined,

package/src/reconciler/placement.ts

@@ -15,6 +15,7 @@ import {
     type PlaceableNode,
     type PlacedChild,
 } from "./node.js";
+import { applyWrite } from "./signals.js";
 import { markTextDirty } from "./text.js";
 
 type AttachContext = { parent: ElementNode; entry: PlacedChild; index: number; sibling: GObject.Object | null };
@@ -69,8 +70,14 @@ const wireBufferView = (node: PlaceableNode, parent: ElementNode): void => {
     markTextDirty(node);
 };
 
+const writeSlot = (parent: ElementNode, entry: PlacedChild, value: GObject.Object | null): void => {
+    applyWrite(() => {
+        Reflect.set(parent.object, entry.slot, value);
+    });
+};
+
 const setObjectSlot = (parent: ElementNode, entry: PlacedChild): void => {
-    Reflect.set(parent.object, entry.slot, entry.object);
+    writeSlot(parent, entry, entry.object);
     wireBufferView(entry.node, parent);
     entry.behavior = null;
     entry.attached = true;
@@ -98,7 +105,7 @@ const didAttach = (ctx: AttachContext, behavior: ElementBehavior): boolean => {
     return true;
 };
 
-const attachEntry = (parent: ElementNode, entry: PlacedChild, index: number, sibling: GObject.Object | null): void => {
+const runAttach = (parent: ElementNode, entry: PlacedChild, index: number, sibling: GObject.Object | null): void => {
     const ctx: AttachContext = { parent, entry, index, sibling };
 
     for (const behavior of typeInfoFor(parent.typeName).behaviors) {
@@ -112,6 +119,12 @@ const attachEntry = (parent: ElementNode, entry: PlacedChild, index: number, sib
     }
 };
 
+const attachEntry = (parent: ElementNode, entry: PlacedChild, index: number, sibling: GObject.Object | null): void => {
+    applyWrite(() => {
+        runAttach(parent, entry, index, sibling);
+    });
+};
+
 const detachInfo = (entry: PlacedChild, context: unknown): DetachInfo => ({
     slot: entry.slot,
     adopted: entry.adopted,
@@ -119,17 +132,12 @@ const detachInfo = (entry: PlacedChild, context: unknown): DetachInfo => ({
     context,
 });
 
-const detachEntry = (parent: ElementNode, entry: PlacedChild): void => {
-    if (!entry.attached) {
-        return;
-    }
-
-    entry.attached = false;
+const runDetach = (parent: ElementNode, entry: PlacedChild): void => {
     const behavior = entry.behavior;
 
     if (behavior === null) {
         if (entry.slot !== DEFAULT_SLOT) {
-            Reflect.set(parent.object, entry.slot, null);
+            writeSlot(parent, entry, null);
         }
 
         return;
@@ -138,6 +146,18 @@ const detachEntry = (parent: ElementNode, entry: PlacedChild): void => {
     behavior.detach?.(parent.object, entry.object, detachInfo(entry, getOrCreateContext(parent, behavior)));
 };
 
+const detachEntry = (parent: ElementNode, entry: PlacedChild): void => {
+    if (!entry.attached) {
+        return;
+    }
+
+    entry.attached = false;
+
+    applyWrite(() => {
+        runDetach(parent, entry);
+    });
+};
+
 const rebuild = (parent: ElementNode, entries: PlacedChild[]): void => {
     for (const entry of entries) {
         detachEntry(parent, entry);

package/src/reconciler/registry.ts

@@ -50,14 +50,17 @@ type ModuleExport = { module: string; export: string };
 /**
  * Per-element configuration keyed by GLib type name: whether the element is lazy (its GObject is
  * created by its parent container, as pages and layout children are), the custom behaviors bound to
- * its type, an optional component that wraps the generated element, and the base props interface its
- * generated props extend. `component` and `props` are inert at runtime; they are read only by codegen.
+ * its type, an optional component that wraps the generated element, the base props interface its
+ * generated props extend, and the GObject properties to leave out of the generated props (those a
+ * behavior already writes from children, such as the `child` and `content` properties). `component`,
+ * `props` and `omitProps` are inert at runtime; they are read only by codegen.
  */
 type ElementConfig<T extends GObject.Object = GObject.Object> = {
     lazy?: boolean;
     behaviors?: ElementBehavior<T>[];
     component?: ModuleExport;
     props?: ModuleExport;
+    omitProps?: string[];
 };
 
 /**
@@ -76,22 +79,19 @@ const mergeBehaviors = (base: ElementConfig, added: ElementBehavior[], isPrepend
 };
 
 const mergeConfigEntry = (base: ElementConfig, added: ElementConfig<never>, isPrepended = false): ElementConfig => {
-    const entry: ElementConfig = { ...base };
+    const { behaviors, lazy, omitProps, ...rest } = added;
+    const entry: ElementConfig = { ...base, ...rest };
 
-    if (added.behaviors !== undefined) {
-        entry.behaviors = mergeBehaviors(entry, added.behaviors as ElementBehavior[], isPrepended);
+    if (behaviors !== undefined) {
+        entry.behaviors = mergeBehaviors(base, behaviors as ElementBehavior[], isPrepended);
     }
 
-    if (added.lazy === true) {
-        entry.lazy = true;
-    }
-
-    if (added.component !== undefined) {
-        entry.component = added.component;
+    if (omitProps !== undefined) {
+        entry.omitProps = [...(base.omitProps ?? []), ...omitProps];
     }
 
-    if (added.props !== undefined) {
-        entry.props = added.props;
+    if (lazy === true) {
+        entry.lazy = true;
     }
 
     return entry;
@@ -99,8 +99,9 @@ const mergeConfigEntry = (base: ElementConfig, added: ElementConfig<never>, isPr
 
 /**
  * Merges maps of {@link ElementConfig} keyed by GLib type name into one, concatenating each type's
- * behaviors in the order the maps are given (an earlier map's behaviors come first) and taking the last
- * lazy flag, component, and props seen. Use it to combine an app's element config with its behaviors.
+ * behaviors and omitted props in the order the maps are given (an earlier map's behaviors come first)
+ * and taking the last lazy flag, component, and props seen. Use it to combine an app's element config
+ * with its behaviors.
  */
 const mergeElementConfigs = (...maps: Record<string, ElementConfig<never>>[]): Record<string, ElementConfig> => {
     const merged: Record<string, ElementConfig> = {};
@@ -131,12 +132,24 @@ const registerElements = (
 
 /**
  * Identity helper that types the module named by the `elements` entry of `gtkx.config.ts`, enabling
- * editor autocompletion and type checking. Key each entry by GLib type name and annotate each hook's
- * object parameter with the concrete GObject class the behavior applies to.
+ * editor autocompletion and type checking. Key each entry by GLib type name and write each behavior
+ * with {@link defineBehavior} so its hooks receive the concrete GObject class.
  */
 const defineElements = (elements: Record<string, ElementConfig<never>>): Record<string, ElementConfig<never>> =>
     elements;
 
+/**
+ * Types one behavior against the GObject class it applies to, so every hook's object parameter is
+ * inferred rather than annotated by hand. Pass the class as the type argument.
+ *
+ * ```ts
+ * defineElements({
+ *     GtkFrame: { behaviors: [defineBehavior<Gtk.Frame>({ attach: (frame, child) => frame.setChild(child) })] },
+ * });
+ * ```
+ */
+const defineBehavior = <T extends GObject.Object>(hooks: ElementBehavior<T>): ElementBehavior<never> => hooks;
+
 /** Spreads one config across many GLib type names. */
 const forTypes = (types: string[], config: ElementConfig<never>): Record<string, ElementConfig<never>> =>
     Object.fromEntries(types.map((type) => [type, config]));
@@ -150,6 +163,7 @@ export {
     mergeElementConfigs,
     registerElements,
     defineElements,
+    defineBehavior,
     forTypes,
     internal,
     type Props,

package/src/reconciler/root.ts

@@ -1,10 +1,9 @@
-import type { ErrorInfo, ReactNode } from "react";
+import type { ErrorInfo, ReactNode, ReactPortal } from "react";
 import * as Gdk from "@gtkx/gi/gdk";
 import { createLogger, type Logger } from "@gtkx/utils";
 import { ConcurrentRoot } from "react-reconciler/constants.js";
 import { type Container, reconciler } from "./host-config.js";
 import { rootElement } from "./root-element.js";
-import { endSuppressionNow } from "./signals.js";
 
 type OpaqueRoot = { [opaqueRoot]: true };
 
@@ -59,12 +58,10 @@ function createErrorHandlerSlot(): ErrorHandlerSlot {
 const setReconcilerErrorHandler = (handler: ErrorHandler): ErrorHandler | null => errorHandlerSlot.set(handler);
 
 const rethrowUncaughtRenderError = (error: unknown): never => {
-    endSuppressionNow();
     throw error;
 };
 
 const logCaughtRenderError = (error: unknown): void => {
-    endSuppressionNow();
     log.error("caught render error", error);
 };
 
@@ -161,8 +158,8 @@ const quit = (): typeof Gdk.EVENT_STOP => {
  * @param key An optional stable key.
  * @returns A React portal.
  */
-const createPortal = (children: ReactNode, container: Container, key?: string): ReactNode =>
-    Object.assign(reconciler.createPortal(children, container, null, key ?? null), { type: "gtkx-portal", props: {} });
+const createPortal = (children: ReactNode, container: Container, key?: string): ReactPortal =>
+    reconciler.createPortal(children, container, null, key ?? null) as unknown as ReactPortal;
 
 export {
     setReconcilerErrorHandler,

package/src/reconciler/signals.ts

@@ -3,40 +3,20 @@ import { camelCase } from "@gtkx/utils";
 import type { HandlerRecord, SignalTarget } from "./node.js";
 import { type TypeInfo, typeInfoFor } from "./metadata.js";
 
-type SuppressionCounter = {
-    beginSuppression: () => void;
-    endSuppression: () => void;
-    endSuppressionNow: () => void;
-    isSuppressed: () => boolean;
-};
-
 const NOTIFY_DETAIL_PREFIX = "notify::";
-const suppressionCounter: SuppressionCounter = createSuppressionCounter();
-const beginSuppression: () => void = suppressionCounter.beginSuppression;
-const endSuppression: () => void = suppressionCounter.endSuppression;
-const endSuppressionNow: () => void = suppressionCounter.endSuppressionNow;
-const isSuppressed: () => boolean = suppressionCounter.isSuppressed;
-
-function createSuppressionCounter(): SuppressionCounter {
-    let depth = 0;
-
-    const release = (): void => {
-        if (depth > 0) {
-            depth -= 1;
-        }
-    };
+const writeState: { depth: number } = { depth: 0 };
 
-    return {
-        beginSuppression: () => {
-            depth += 1;
-        },
-        endSuppression: () => {
-            queueMicrotask(release);
-        },
-        endSuppressionNow: release,
-        isSuppressed: () => depth > 0,
-    };
-}
+const isApplyingWrite = (): boolean => writeState.depth > 0;
+
+const applyWrite = <T>(write: () => T): T => {
+    writeState.depth += 1;
+
+    try {
+        return write();
+    } finally {
+        writeState.depth = Math.max(0, writeState.depth - 1);
+    }
+};
 
 const getNotifyProperty = (signal: string): string | null =>
     signal.startsWith(NOTIFY_DETAIL_PREFIX) ? camelCase(signal.slice(NOTIFY_DETAIL_PREFIX.length)) : null;
@@ -56,7 +36,7 @@ const invokeHandler = (
 
 const wrapHandler = (target: SignalTarget, record: HandlerRecord, notifyProperty: string | null): SignalHandler =>
     (...args: unknown[]): unknown => {
-        if (record.blockable && isSuppressed()) {
+        if (record.blockable && isApplyingWrite()) {
             return undefined;
         }
 
@@ -104,9 +84,8 @@ const disconnectAllHandlers = (target: SignalTarget): void => {
 };
 
 export {
-    beginSuppression,
-    endSuppression,
-    endSuppressionNow,
+    applyWrite,
+    isApplyingWrite,
     connectHandler,
     disconnectHandler,
     disconnectAllHandlers,

package/src/reconciler/text.ts

@@ -5,6 +5,7 @@ import { drain, indexBeforeOrEnd } from "@gtkx/utils";
 import type { ContentChild, ContentKind, ElementNode, ParentNode, TextNode } from "./node.js";
 import type { Props } from "./registry.js";
 import { ELEMENT_KIND, TEXT_KIND } from "./node.js";
+import { applyWrite } from "./signals.js";
 
 type OffsetResult = { found: boolean; offset: number };
 
@@ -319,13 +320,15 @@ const rebuildBuffer = (node: ElementNode): void => {
         return;
     }
 
-    buffer.setText("", -1);
-    const build: BufferBuild = { buffer, view: node.bufferView, marks: [] };
-    insertContent(build, node.content);
+    applyWrite(() => {
+        buffer.setText("", -1);
+        const build: BufferBuild = { buffer, view: node.bufferView, marks: [] };
+        insertContent(build, node.content);
 
-    for (const mark of build.marks) {
-        placeMark(buffer, mark.node, mark.offset);
-    }
+        for (const mark of build.marks) {
+            placeMark(buffer, mark.node, mark.offset);
+        }
+    });
 };
 
 const rebuildLabel = (node: ElementNode): void => {
@@ -381,8 +384,12 @@ const didUpdateTextSurgically = (host: ElementNode, node: TextNode, oldText: str
     }
 
     const start = located.offset;
-    buffer.delete(buffer.getIterAtOffset(start), buffer.getIterAtOffset(start + charLength(oldText)));
-    buffer.insert(buffer.getIterAtOffset(start), newText, -1);
+
+    applyWrite(() => {
+        buffer.delete(buffer.getIterAtOffset(start), buffer.getIterAtOffset(start + charLength(oldText)));
+        buffer.insert(buffer.getIterAtOffset(start), newText, -1);
+    });
+
     const startIter = buffer.getIterAtOffset(start);
     const endIter = buffer.getIterAtOffset(start + charLength(newText));
     applyEnclosingTags(buffer, node, startIter, endIter);