@gtkx/react 1.3.0 → 1.4.0

package/src/reconciler/placement.ts

@@ -15,7 +15,7 @@ import {
     type PlaceableNode,
     type PlacedChild,
 } from "./node.js";
-import { applyWrite } from "./signals.js";
+import { applyMutation, applyWrite } from "./signals.js";
 import { markTextDirty } from "./text.js";
 
 type AttachContext = { parent: ElementNode; entry: PlacedChild; index: number; sibling: GObject.Object | null };
@@ -78,7 +78,7 @@ const wireBufferView = (node: PlaceableNode, parent: ElementNode): void => {
 };
 
 const writeSlot = (parent: ElementNode, entry: PlacedChild, value: GObject.Object | null): void => {
-    applyWrite(() => {
+    applyWrite(entry.slot, () => {
         Reflect.set(parent.object, entry.slot, value);
     });
 };
@@ -135,7 +135,7 @@ const runAttach = (parent: ElementNode, entry: PlacedChild, index: number, sibli
 };
 
 const attachEntry = (parent: ElementNode, entry: PlacedChild, index: number, sibling: GObject.Object | null): void => {
-    applyWrite(() => {
+    applyMutation(() => {
         runAttach(parent, entry, index, sibling);
     });
 };
@@ -160,7 +160,7 @@ const runDetach = (parent: ElementNode, entry: PlacedChild): void => {
 };
 
 const detachEntry = (parent: ElementNode, entry: PlacedChild): void => {
-    applyWrite(() => {
+    applyMutation(() => {
         runDetach(parent, entry);
     });
 };

package/src/reconciler/registry.ts

@@ -54,6 +54,8 @@ type ElementBehavior<T extends GObject.Object = GObject.Object> = {
     update?: (object: T, prev: Props, next: Props, context: unknown) => Iterable<string> | undefined;
     /** Runs after the commit that touched the node, once every child has been placed. */
     flush?: (object: T, context: unknown) => void;
+    /** Releases whatever `initialize` or a later hook acquired, once the node is destroyed. */
+    teardown?: (object: T, context: unknown) => void;
     /** Props to withhold from the constructor, leaving them for a later hook to apply. */
     deferred?: string[];
     /**

package/src/reconciler/root.ts

@@ -171,7 +171,7 @@ const quit = (): typeof Gdk.EVENT_PROPAGATE | typeof Gdk.EVENT_STOP => {
  * @param container The GObject to render into, or {@link rootElement} to render at the top level.
  */
 const createPortal = (children: ReactNode, container: Container, key?: string): ReactPortal =>
-    reconciler.createPortal(children, container, null, key ?? null) as unknown as ReactPortal;
+    reconciler.createPortal(children, container, null, key ?? null);
 
 export {
     setReconcilerErrorHandler,

package/src/reconciler/signals.ts

@@ -1,25 +1,67 @@
+import * as GObject from "@gtkx/gi/gobject";
 import { getSignalBaseName, type SignalHandler } from "@gtkx/runtime";
-import { camelCase } from "@gtkx/utils";
+import { getOrInsert, toCamelIdentifier } from "@gtkx/utils";
 import type { HandlerRecord, SignalTarget } from "./node.js";
 import { type TypeInfo, typeInfoFor } from "./metadata.js";
 
+type NotifyBinding = { property: string | null };
+
+const NOTIFY_SIGNAL = "notify";
 const NOTIFY_DETAIL_PREFIX = "notify::";
-const writeState: { depth: number } = { depth: 0 };
+const pendingWrites: (string | null)[] = [];
+const canonicalNames: Map<string, string> = new Map();
 
-const isApplyingWrite = (): boolean => writeState.depth > 0;
+const isApplyingWrite = (): boolean => pendingWrites.length > 0;
+const canonicalName = (property: string): string => getOrInsert(canonicalNames, property, toCamelIdentifier);
 
-const applyWrite = <T>(write: () => T): T => {
-    writeState.depth += 1;
+const runWrite = <T>(property: string | null, write: () => T): T => {
+    pendingWrites.push(property === null ? null : canonicalName(property));
 
     try {
         return write();
     } finally {
-        writeState.depth = Math.max(0, writeState.depth - 1);
+        pendingWrites.pop();
     }
 };
 
-const getNotifyProperty = (signal: string): string | null =>
-    signal.startsWith(NOTIFY_DETAIL_PREFIX) ? camelCase(signal.slice(NOTIFY_DETAIL_PREFIX.length)) : null;
+const applyWrite = <T>(property: string, write: () => T): T => runWrite(property, write);
+const applyMutation = <T>(write: () => T): T => runWrite(null, write);
+
+const notifyBindingFor = (signal: string): NotifyBinding | null => {
+    if (signal === NOTIFY_SIGNAL) {
+        return { property: null };
+    }
+
+    if (!signal.startsWith(NOTIFY_DETAIL_PREFIX)) {
+        return null;
+    }
+
+    return { property: canonicalName(signal.slice(NOTIFY_DETAIL_PREFIX.length)) };
+};
+
+const notifiedProperty = (notify: NotifyBinding, args: unknown[]): string | null => {
+    if (notify.property !== null) {
+        return notify.property;
+    }
+
+    const [pspec] = args;
+
+    return pspec instanceof GObject.ParamSpec ? canonicalName(pspec.getName()) : null;
+};
+
+const isSuppressedNotify = (notify: NotifyBinding, args: unknown[]): boolean => {
+    const notified = notifiedProperty(notify, args);
+
+    return notified === null || pendingWrites.includes(null) || pendingWrites.includes(notified);
+};
+
+const isSuppressed = (record: HandlerRecord, notify: NotifyBinding | null, args: unknown[]): boolean => {
+    if (!record.isBlockable || !isApplyingWrite()) {
+        return false;
+    }
+
+    return notify === null || isSuppressedNotify(notify, args);
+};
 
 const isBlockableSignal = (info: TypeInfo, signal: string): boolean =>
     info.userEventSignals.has(getSignalBaseName(signal));
@@ -27,20 +69,23 @@ const isBlockableSignal = (info: TypeInfo, signal: string): boolean =>
 const invokeHandler = (
     target: SignalTarget,
     record: HandlerRecord,
-    notifyProperty: string | null,
+    notify: NotifyBinding | null,
     args: unknown[],
-): unknown =>
-    notifyProperty === null
+): unknown => {
+    const property = notify?.property ?? null;
+
+    return property === null
         ? record.handler(...args, target.object)
-        : record.handler(Reflect.get(target.object, notifyProperty), target.object);
+        : record.handler(Reflect.get(target.object, property), target.object);
+};
 
-const wrapHandler = (target: SignalTarget, record: HandlerRecord, notifyProperty: string | null): SignalHandler =>
+const wrapHandler = (target: SignalTarget, record: HandlerRecord, notify: NotifyBinding | null): SignalHandler =>
     (...args: unknown[]): unknown => {
-        if (record.isBlockable && isApplyingWrite()) {
+        if (isSuppressed(record, notify, args)) {
             return undefined;
         }
 
-        return target.dispatch(() => invokeHandler(target, record, notifyProperty, args));
+        return target.dispatch(() => invokeHandler(target, record, notify, args));
     };
 
 const connectHandler = (target: SignalTarget, prop: string, signal: string, handler: SignalHandler): void => {
@@ -57,9 +102,8 @@ const connectHandler = (target: SignalTarget, prop: string, signal: string, hand
     }
 
     const isBlockable = isBlockableSignal(typeInfoFor(target.typeName), signal);
-    const notifyProperty = getNotifyProperty(signal);
     const record: HandlerRecord = { signal, handler, wrapped: (): undefined => undefined, isBlockable };
-    record.wrapped = wrapHandler(target, record, notifyProperty);
+    record.wrapped = wrapHandler(target, record, notifyBindingFor(signal));
     target.object.on(signal, record.wrapped);
     target.handlers.set(prop, record);
 };
@@ -84,6 +128,7 @@ const disconnectAllHandlers = (target: SignalTarget): void => {
 };
 
 export {
+    applyMutation,
     applyWrite,
     connectHandler,
     disconnectHandler,

package/src/reconciler/style.ts

@@ -7,6 +7,7 @@ import { applyWrite } from "./signals.js";
 type StyleSlot = { provider: Gtk.CssProvider; className: string; css: string };
 
 const CLASS_PREFIX = "gtkx-s";
+const CSS_CLASSES_PROP = "cssClasses";
 const STYLE_PRIORITY = STYLE_PROVIDER_PRIORITY_APPLICATION + 1;
 const log: Logger = createLogger("react");
 const styles: WeakMap<Gtk.Widget, StyleSlot> = new WeakMap();
@@ -37,7 +38,7 @@ const releaseStyle = (widget: Gtk.Widget): void => {
     styles.delete(widget);
     reclaimed.unregister(widget);
 
-    applyWrite(() => {
+    applyWrite(CSS_CLASSES_PROP, () => {
         widget.removeCssClass(slot.className);
     });
 
@@ -55,7 +56,7 @@ const ensureSlot = (widget: Gtk.Widget): StyleSlot => {
     styles.set(widget, slot);
     reclaimed.register(widget, slot, widget);
 
-    applyWrite(() => {
+    applyWrite(CSS_CLASSES_PROP, () => {
         widget.addCssClass(slot.className);
     });
 
@@ -80,4 +81,4 @@ const applyStyle = (widget: Gtk.Widget, style: unknown): string | null => {
     return slot.className;
 };
 
-export { applyStyle, releaseStyle, styleClass };
+export { applyStyle, CSS_CLASSES_PROP, releaseStyle, styleClass };

package/src/reconciler/text.ts

@@ -5,7 +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";
+import { applyMutation } from "./signals.js";
 
 type OffsetResult = { wasFound: boolean; offset: number };
 
@@ -320,7 +320,7 @@ const rebuildBuffer = (node: ElementNode): void => {
         return;
     }
 
-    applyWrite(() => {
+    applyMutation(() => {
         buffer.setText("", -1);
         const build: BufferBuild = { buffer, view: node.bufferView, marks: [] };
         insertContent(build, node.content);
@@ -385,7 +385,7 @@ const didUpdateTextSurgically = (host: ElementNode, node: TextNode, oldText: str
 
     const start = located.offset;
 
-    applyWrite(() => {
+    applyMutation(() => {
         buffer.delete(buffer.getIterAtOffset(start), buffer.getIterAtOffset(start + charLength(oldText)));
         buffer.insert(buffer.getIterAtOffset(start), newText, -1);
     });