@gtkx/react 1.0.0-rc.3 → 1.0.0

package/src/reconciler/apply-props.ts

@@ -1,7 +1,7 @@
 import type * as GObject from "@gtkx/gi/gobject";
 import type { SignalHandler } from "@gtkx/runtime";
 import * as Gtk from "@gtkx/gi/gtk";
-import { drain, kebabCase } from "@gtkx/utils";
+import { drain, isDeepEqual, kebabCase } from "@gtkx/utils";
 import type { ElementBehavior, Props } from "./registry.js";
 import { applyAccessibleProps, isAccessibleProp } from "../utils/accessible-props.js";
 import { type TypeInfo, typeInfoFor } from "./metadata.js";
@@ -16,9 +16,13 @@ type PropChange = { prev: Props; next: Props };
 const REACT_RESERVED_PROPS = new Set(["children", "ref", "key"]);
 const NOTIFY_PREFIX = "onNotify";
 const HANDLER_PREFIX = "on";
+const HANDLER_NAME = /^on[A-Z]/;
 const flushDirty: Set<ElementNode> = new Set();
+const accessibleDirty: Map<ElementNode, Props> = new Map();
+const mapWatched: WeakSet<ElementNode> = new WeakSet();
+const pendingMap: Set<ElementNode> = new Set();
 
-const isHandlerName = (name: string): boolean => /^on[A-Z]/.test(name);
+const isHandlerName = (name: string): boolean => HANDLER_NAME.test(name);
 
 const signalForProp = (info: TypeInfo, name: string): string => {
     if (name === NOTIFY_PREFIX) {
@@ -102,29 +106,42 @@ const applyEntry = (node: ElementNode, info: TypeInfo, delta: PropDelta): void =
 };
 
 const eachChangedName = (prev: Props, next: Props, visit: (name: string) => void): void => {
-    const names = new Set([...Object.keys(prev), ...Object.keys(next)]);
-
-    for (const name of names) {
+    for (const name in prev) {
         visit(name);
     }
+
+    for (const name in next) {
+        if (!Object.hasOwn(prev, name)) {
+            visit(name);
+        }
+    }
 };
 
-const constructOnlyChangeError = (typeName: string, name: string): Error =>
+const propChangeError = (typeName: string, name: string): Error =>
     new Error(
         `Cannot change the construct-only prop '${name}' of <${typeName}> after it is created. ` +
-        "GTK accepts it only while the object is being built, so give the element a key that " +
+        "It is only accepted while the element is being built, so give the element a key that " +
         `changes with '${name}' and React will build a new one.`,
     );
 
-const assertConstructOnlyUnchanged = (typeName: string, prev: Props, next: Props): void => {
+const hasAppliedValue = (value: unknown): boolean => (Array.isArray(value) ? value.length > 0 : value !== undefined);
+
+const isConstructOnlyChange = (info: TypeInfo, name: string, change: PropChange): boolean =>
+    info.constructOnly.has(name) && !Object.is(change.prev[name], change.next[name]);
+
+const isDeclaredConstructOnlyChange = (info: TypeInfo, name: string, change: PropChange): boolean =>
+    info.declaredConstructOnly.has(name) &&
+    hasAppliedValue(change.prev[name]) &&
+    !isDeepEqual(change.prev[name], change.next[name]);
+
+const assertPropsCanChange = (typeName: string, prev: Props, next: Props): void => {
     const info = typeInfoFor(typeName);
+    const change: PropChange = { prev, next };
 
     eachChangedName(prev, next, (name) => {
-        if (!info.constructOnly.has(name) || Object.is(prev[name], next[name])) {
-            return;
+        if (isConstructOnlyChange(info, name, change) || isDeclaredConstructOnlyChange(info, name, change)) {
+            throw propChangeError(typeName, name);
         }
-
-        throw constructOnlyChangeError(typeName, name);
     });
 };
 
@@ -213,22 +230,58 @@ const flushBehaviors = (): void => {
     });
 };
 
-const mountBehaviors = (node: ElementNode): void => {
-    if (!typeInfoFor(node.typeName).hasMount) {
+const applyAccessible = (object: GObject.Object, prev: Props | null, next: Props): void => {
+    if (object instanceof Gtk.Accessible) {
+        applyAccessibleProps(object, prev, next);
+    }
+};
+
+const markAccessible = (node: ElementNode, prev: Props): void => {
+    if (!accessibleDirty.has(node)) {
+        accessibleDirty.set(node, prev);
+    }
+};
+
+const hasAccessibleProp = (props: Props): boolean => {
+    for (const name in props) {
+        if (isAccessibleProp(name)) {
+            return true;
+        }
+    }
+
+    return false;
+};
+
+const watchMap = (node: ElementNode): void => {
+    const { object } = node;
+
+    if (mapWatched.has(node) || !(object instanceof Gtk.Widget) || !hasAccessibleProp(node.props)) {
         return;
     }
 
-    eachBehavior(node, (behavior, context) => behavior.mount?.(node.object, context));
+    mapWatched.add(node);
+
+    object.connect("map", () => {
+        pendingMap.add(node);
+        setTimeout(settleAccessible, 0);
+    });
 };
 
-const unmountBehaviors = (node: ElementNode): void => {
-    eachBehavior(node, (behavior, context) => behavior.unmount?.(node.object, context));
+const settleAccessible = (): void => {
+    drain(pendingMap, (node) => {
+        if (node.object instanceof Gtk.Widget && node.object.getMapped()) {
+            applyAccessible(node.object, null, node.props);
+        }
+    });
 };
 
-const applyAccessible = (object: GObject.Object, prev: Props, next: Props): void => {
-    if (object instanceof Gtk.Widget) {
-        applyAccessibleProps(object, prev, next);
+const flushAccessible = (): void => {
+    for (const [node, prev] of accessibleDirty) {
+        applyAccessible(node.object, prev, node.props);
+        watchMap(node);
     }
+
+    accessibleDirty.clear();
 };
 
 const applyElementProps = (node: ElementNode, prev: Props, next: Props): void => {
@@ -236,8 +289,8 @@ const applyElementProps = (node: ElementNode, prev: Props, next: Props): void =>
     const consumed = runBehaviorUpdates(node, info, prev, next);
     applyValueEntries(node, info, { prev, next }, consumed);
     restoreActionableSensitivity(node, info, prev, next);
-    applyAccessible(node.object, prev, next);
     applyHandlers(node, info, prev, next);
+    markAccessible(node, prev);
     markFlush(node);
     node.props = next;
 };
@@ -262,10 +315,10 @@ const applyAdoptedProps = (target: SignalTarget, prev: Props, next: Props): void
 
 export {
     markFlush,
+    flushAccessible,
+    settleAccessible,
     flushBehaviors,
-    mountBehaviors,
-    unmountBehaviors,
     applyElementProps,
     applyAdoptedProps,
-    assertConstructOnlyUnchanged,
+    assertPropsCanChange,
 };

package/src/reconciler/behaviors.ts

@@ -1,6 +1,15 @@
 import type * as GObject from "@gtkx/gi/gobject";
 import type * as Gtk from "@gtkx/gi/gtk";
-import { getInstanceType, TYPE_INVALID, typeFromName, typeIsA } from "@gtkx/runtime";
+import {
+    type AnyClass,
+    type ApplicationClass,
+    type CommandLineApplication,
+    createApplication,
+    getClassType,
+    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";
@@ -23,7 +32,7 @@ type ListHooks<P extends GObject.Object, I, H> = {
 
 type ListEntry = { item: unknown; handle: unknown };
 type ListState = { snapshot: unknown[]; entries: ListEntry[] };
-type DeferredState = { desired: unknown; present: boolean; applied: unknown };
+type DeferredState = { desired: unknown; isPresent: boolean; applied: unknown };
 type CanApply<P extends GObject.Object, V> = (object: P, value: V) => boolean;
 type ChildSetter = GObject.Object & { setChild: (child: Gtk.Widget | null) => void };
 type ContentSetter<C extends Gtk.Widget> = GObject.Object & { setContent: (content: C | null) => void };
@@ -36,9 +45,9 @@ type BoxLike = GObject.Object & {
 
 type RowCache = WeakMap<GObject.Object, Gtk.Widget>;
 
-type IndexedInserter = GObject.Object & {
-    remove: (child: Gtk.Widget) => void;
-    insert: (child: Gtk.Widget, position: number) => unknown;
+type IndexedChildHost<C extends GObject.Object> = GObject.Object & {
+    remove: (child: C) => void;
+    insert: (child: C, position: number) => unknown;
 };
 
 const childTypeCache: Map<string, bigint> = new Map();
@@ -50,7 +59,7 @@ const childMatcher =
         (child) => {
             const type = childTypeFor(name);
 
-            return type === TYPE_INVALID || typeIsA(getInstanceType(child), type);
+            return type === TYPE_INVALID || typeIsA(getClassType(child.constructor as AnyClass), type);
         };
 
 const slotAttach =
@@ -67,7 +76,6 @@ const slotAttach =
             return attach(object as P, child as C, info) ?? true;
         };
 
-/** Builds a behavior for a named child slot holding children of `childType`, claiming matches only. */
 const slot = <P extends GObject.Object, C extends GObject.Object>(
     slotName: string,
     childType: string,
@@ -94,7 +102,6 @@ const slot = <P extends GObject.Object, C extends GObject.Object>(
     return behavior;
 };
 
-/** Builds a scalar-prop behavior that invokes `apply` whenever the value changes, and claims the prop. */
 const value = <P extends GObject.Object, V>(
     prop: string,
     apply: ValueApply<P, V>,
@@ -119,48 +126,50 @@ const teardownList = <P extends GObject.Object, I, H>(
         return;
     }
 
-    const remove = hooks.remove;
-
-    if (remove === undefined) {
-        return;
-    }
-
     for (const entry of entries) {
-        remove(object, entry.item as I, entry.handle as H);
+        hooks.remove?.(object, entry.item as I, entry.handle as H);
     }
 };
 
-/**
- * Builds an array-prop behavior that adds, removes, and clears its items, reapplying on structural
- * change. `add` may return a handle that the same item's later `remove` receives, for items whose
- * teardown needs what `add` produced (as VFL constraints need the objects the layout created).
- */
-const list = <P extends GObject.Object, I, H = void>(
+const listUpdate = <P extends GObject.Object, I, H>(
     prop: string,
     hooks: ListHooks<P, I, H>,
-): ElementBehavior<P> => {
+): NonNullable<ElementBehavior<P>["update"]> => {
     const { add } = hooks;
 
-    return {
-        createContext: (): ListState => ({ snapshot: [], entries: [] }),
-        update: (object, _prev, next, context) => {
-            const state = context as ListState;
-            const raw = next[prop];
-            const items: unknown[] = Array.isArray(raw) ? raw : [];
+    return (object, _prev, next, context) => {
+        const state = context as ListState;
+        const raw = next[prop];
+        const items: unknown[] = Array.isArray(raw) ? raw : [];
 
-            if (isDeepEqual(state.snapshot, items)) {
-                return [prop];
-            }
+        if (isDeepEqual(state.snapshot, items)) {
+            return [prop];
+        }
 
-            teardownList(object, state.entries, hooks);
-            state.entries = items.map((item) => ({ item, handle: add?.(object, item as I) }));
-            state.snapshot = structuredClone(items);
+        teardownList(object, state.entries, hooks);
+        state.entries = items.map((item) => ({ item, handle: add?.(object, item as I) }));
+        state.snapshot = structuredClone(items);
 
-            return [prop];
-        },
+        return [prop];
     };
 };
 
+const list = <P extends GObject.Object, I, H = void>(
+    prop: string,
+    hooks: ListHooks<P, I, H>,
+): ElementBehavior<P> => {
+    const behavior: ElementBehavior<P> = {
+        initialize: (): ListState => ({ snapshot: [], entries: [] }),
+        update: listUpdate(prop, hooks),
+    };
+
+    if (hooks.remove === undefined && hooks.clear === undefined) {
+        behavior.constructOnly = [prop];
+    }
+
+    return behavior;
+};
+
 const flushDeferred = <P extends GObject.Object, V>(
     object: GObject.Object,
     context: unknown,
@@ -169,7 +178,7 @@ const flushDeferred = <P extends GObject.Object, V>(
 ): void => {
     const state = context as DeferredState;
 
-    if (!state.present || Object.is(state.applied, state.desired)) {
+    if (!state.isPresent || Object.is(state.applied, state.desired)) {
         return;
     }
 
@@ -184,17 +193,16 @@ const flushDeferred = <P extends GObject.Object, V>(
     state.applied = state.desired;
 };
 
-/** Builds a behavior for a prop applied after the surrounding commit, deferred until `canApply` returns true. */
 const deferred = <P extends GObject.Object, V>(
     prop: string,
     canApply?: CanApply<P, V>,
 ): ElementBehavior<P> => ({
     deferred: [prop],
-    createContext: (): DeferredState => ({ desired: undefined, present: false, applied: undefined }),
+    initialize: (): DeferredState => ({ desired: undefined, isPresent: false, applied: undefined }),
     update: (_object, _prev, next, context) => {
         const state = context as DeferredState;
         state.desired = next[prop];
-        state.present = next[prop] !== undefined;
+        state.isPresent = next[prop] !== undefined;
 
         return [prop];
     },
@@ -203,7 +211,6 @@ const deferred = <P extends GObject.Object, V>(
     },
 });
 
-/** Builds a behavior for a text prop kept in controlled-input sync: set when provided, never reset. */
 const controlledText = (prop: string): ElementBehavior =>
     value(prop, (object, next) => {
         if (!hasSameText(object, prop, next)) {
@@ -213,7 +220,6 @@ const controlledText = (prop: string): ElementBehavior =>
         }
     });
 
-/** Behavior for a container that installs its single child with `setChild`. */
 const childSetterSlot = <P extends ChildSetter>(): ElementBehavior<P> =>
     slot<P, Gtk.Widget>("children", "GtkWidget", {
         attach: (parent, child) => {
@@ -224,7 +230,6 @@ const childSetterSlot = <P extends ChildSetter>(): ElementBehavior<P> =>
         },
     });
 
-/** Behavior for a container that installs its single child with `setContent`. */
 const contentSetterSlot = <P extends ContentSetter<C>, C extends Gtk.Widget = Gtk.Widget>(
     childType = "GtkWidget",
 ): ElementBehavior<P> =>
@@ -237,7 +242,6 @@ const contentSetterSlot = <P extends ContentSetter<C>, C extends Gtk.Widget = Gt
         },
     });
 
-/** Behavior for a `GtkBox`-style container that orders children by sibling. */
 const boxSlot = <P extends BoxLike>(): ElementBehavior<P> =>
     slot<P, Gtk.Widget>("children", "GtkWidget", {
         attach: (box, child, info) => box.insertChildAfter(child, info.sibling as Gtk.Widget | null),
@@ -249,7 +253,6 @@ const boxSlot = <P extends BoxLike>(): ElementBehavior<P> =>
         },
     });
 
-/** Behavior for a container whose children are added and removed by a pair of methods. */
 const addRemoveSlot = <C extends GObject.Object, P extends GObject.Object>(
     slotName: string,
     childType: string,
@@ -257,7 +260,23 @@ const addRemoveSlot = <C extends GObject.Object, P extends GObject.Object>(
     remove: (parent: P, child: C) => void,
 ): ElementBehavior => slot<P, C>(slotName, childType, { attach: add, detach: remove });
 
-/** Behavior for a `children` slot whose attach call returns the page object the container adopts. */
+const indexedSlot = <P extends IndexedChildHost<C>, C extends GObject.Object>(
+    slotName: string,
+    childType: string,
+): ElementBehavior<P> =>
+    slot<P, C>(slotName, childType, {
+        attach: (parent, child, info) => {
+            parent.insert(child, info.index);
+        },
+        detach: (parent, child) => {
+            parent.remove(child);
+        },
+        reorder: (parent, child, info) => {
+            parent.remove(child);
+            parent.insert(child, info.index);
+        },
+    });
+
 const adoptedChildrenSlot = <P extends GObject.Object, C extends GObject.Object>(
     childType: string,
     add: (parent: P, item: C) => unknown,
@@ -289,7 +308,7 @@ const wrappedRow = <W extends Gtk.Widget>(
 
 const removeWrappedRow = (
     Wrapper: new (props: Props) => Gtk.Widget,
-    parent: IndexedInserter,
+    parent: IndexedChildHost<Gtk.Widget>,
     child: Gtk.Widget,
     rows: RowCache,
 ): void => {
@@ -300,8 +319,7 @@ const removeWrappedRow = (
     }
 };
 
-/** Behavior for an index-placed container that wraps each child in `Wrapper` before adding it. */
-const wrappingIndexedSlot = <W extends Gtk.Widget, P extends IndexedInserter>(
+const wrappingIndexedSlot = <W extends Gtk.Widget, P extends IndexedChildHost<Gtk.Widget>>(
     Wrapper: new (props: Props) => W,
     setChild: (wrapper: W, inner: Gtk.Widget) => void,
 ): ElementBehavior<P> => ({
@@ -312,10 +330,18 @@ const wrappingIndexedSlot = <W extends Gtk.Widget, P extends IndexedInserter>(
             removeWrappedRow(Wrapper, parent, child, info.context as RowCache);
         },
     }),
-    createContext: (): RowCache => new WeakMap(),
+    initialize: (): RowCache => new WeakMap(),
+});
+
+const applicationCreator = <P extends GObject.Object & CommandLineApplication, C extends Props>(
+    base: ApplicationClass<P, C>,
+): ElementBehavior<P> => ({
+    create: (props) => createApplication(base, props as C),
 });
 
 export {
+    applicationCreator,
+    childMatcher,
     slot,
     value,
     list,
@@ -326,5 +352,6 @@ export {
     boxSlot,
     addRemoveSlot,
     adoptedChildrenSlot,
+    indexedSlot,
     wrappingIndexedSlot,
 };

package/src/reconciler/devtools.ts

@@ -0,0 +1,18 @@
+type DevToolsInjectable = {
+    injectIntoDevTools: (...args: never[]) => unknown;
+};
+
+const injection = { isDone: false };
+
+const hasDevToolsHook = (): boolean => Reflect.get(globalThis, "__REACT_DEVTOOLS_GLOBAL_HOOK__") !== undefined;
+
+const injectIntoDevTools = (reconciler: DevToolsInjectable): void => {
+    if (injection.isDone || !hasDevToolsHook()) {
+        return;
+    }
+
+    injection.isDone = true;
+    reconciler.injectIntoDevTools();
+};
+
+export { injectIntoDevTools };

package/src/reconciler/host-config.ts

@@ -1,7 +1,7 @@
 import type * as GObject from "@gtkx/gi/gobject";
 import * as Gtk from "@gtkx/gi/gtk";
-import { getInstanceType, typeName } from "@gtkx/runtime";
-import { getOrInsert } from "@gtkx/utils";
+import { type AnyClass, getClassType, typeName } from "@gtkx/runtime";
+import { getOrInsert, packageVersion } from "@gtkx/utils";
 import { createContext } from "react";
 import ReactReconciler from "react-reconciler";
 import { DefaultEventPriority, DiscreteEventPriority, NoEventPriority } from "react-reconciler/constants.js";
@@ -10,20 +10,17 @@ import { Prop } from "../components/element.js";
 import {
     applyAdoptedProps,
     applyElementProps,
-    assertConstructOnlyUnchanged,
+    assertPropsCanChange,
+    flushAccessible,
     flushBehaviors,
-    mountBehaviors,
-    unmountBehaviors,
 } from "./apply-props.js";
 import { attachChild, detachChild } from "./child-routing.js";
 import { resolveElementNode } from "./instance.js";
-import { typeInfoFor } from "./metadata.js";
 import {
     type AnyNode,
     createElementNode,
     createPropNode,
     createTextNode,
-    type Dispatch,
     ELEMENT_KIND,
     type ElementNode,
     type Instance,
@@ -41,7 +38,7 @@ import {
     validateContentMix,
 } from "./text.js";
 
-/** A top-level container an element tree can be mounted into. */
+/** What a tree is rendered into: any GObject, or the {@link RootElement} marker to render at the top level. */
 type Container = RootElement | GObject.Object;
 
 type PriorityTracker = {
@@ -55,9 +52,15 @@ const containerNodes: WeakMap<object, ElementNode> = new WeakMap();
 const priority = createPriorityTracker();
 
 const hostConfig = {
+    rendererPackageName: "@gtkx/react",
+    rendererVersion: packageVersion(import.meta.url, "@gtkx/react/package.json"),
     supportsMutation: true,
     supportsPersistence: false,
     supportsHydration: false,
+    supportsMicrotasks: true,
+    scheduleMicrotask: (fn: () => void): void => {
+        queueMicrotask(fn);
+    },
     isPrimaryRenderer: true,
     noTimeout: -1,
     scheduleTimeout: (fn: (...args: unknown[]) => unknown, delay?: number): ReturnType<typeof setTimeout> =>
@@ -71,18 +74,11 @@ const hostConfig = {
         attachChild(parent, child, null);
     },
     finalizeInitialChildren: (instance: Instance, _type: string, props: Props): boolean => {
-        if (instance.kind !== ELEMENT_KIND) {
-            return false;
-        }
-
-        validateContentMix(instance, props);
-
-        return typeInfoFor(instance.typeName).hasMount;
-    },
-    commitMount: (instance: Instance): void => {
         if (instance.kind === ELEMENT_KIND) {
-            mountBehaviors(instance);
+            validateContentMix(instance, props);
         }
+
+        return false;
     },
     shouldSetTextContent: (): boolean => false,
     getRootHostContext: (): Record<string, never> => HOST_CONTEXT,
@@ -92,6 +88,7 @@ const hostConfig = {
     resetAfterCommit: (): void => {
         flushTextHosts();
         flushBehaviors();
+        flushAccessible();
     },
     preparePortalMount: (): void => undefined,
     clearContainer: (): void => undefined,
@@ -135,7 +132,6 @@ const hostConfig = {
     detachDeletedInstance: (instance: Instance): void => {
         if (instance.kind === ELEMENT_KIND) {
             disconnectAllHandlers(instance);
-            unmountBehaviors(instance);
         } else if (instance.kind === LAZY_KIND && instance.adopted !== null) {
             disconnectAllHandlers(lazyTarget(instance, instance.adopted));
         }
@@ -191,14 +187,14 @@ function createPriorityTracker(): PriorityTracker {
 
 const updateInstance = (instance: Instance, prev: Props, next: Props): void => {
     if (instance.kind === ELEMENT_KIND) {
-        assertConstructOnlyUnchanged(instance.typeName, prev, next);
+        assertPropsCanChange(instance.typeName, prev, next);
         applyElementProps(instance, prev, next);
 
         return;
     }
 
     if (instance.kind === LAZY_KIND && instance.adopted !== null) {
-        assertConstructOnlyUnchanged(instance.typeName, prev, next);
+        assertPropsCanChange(instance.typeName, prev, next);
         applyAdoptedProps(lazyTarget(instance, instance.adopted), prev, next);
         instance.props = next;
     }
@@ -234,22 +230,14 @@ const setWidgetVisible = (instance: Instance, isVisible: boolean): void => {
     }
 };
 
-const runDiscrete: Dispatch = (fn) => {
-    try {
-        return priority.withDiscrete(fn);
-    } finally {
-        reconciler.flushSyncWork();
-    }
-};
-
 const adoptContainer = (container: GObject.Object): ElementNode => {
-    const name = typeName(getInstanceType(container));
+    const name = typeName(getClassType(container.constructor as AnyClass));
 
     if (name === null) {
         throw new Error("Cannot adopt a container whose GType has no registered name");
     }
 
-    return createElementNode(name, container, runDiscrete, null);
+    return createElementNode(name, container, priority.withDiscrete, null);
 };
 
 const getOrCreateContainerNode = (container: GObject.Object): ElementNode =>
@@ -260,7 +248,7 @@ const createNode = (type: string, props: Props): Instance => {
         return createPropNode(props.propName as string);
     }
 
-    const node = resolveElementNode(type, props, runDiscrete);
+    const node = resolveElementNode(type, props, priority.withDiscrete);
 
     if (node.kind === ELEMENT_KIND) {
         containerNodes.set(node.object, node);

package/src/reconciler/instance.ts

@@ -1,6 +1,6 @@
 import type * as GObject from "@gtkx/gi/gobject";
 import { getWrapperClass, TYPE_INVALID, typeFromName, typeIsA } from "@gtkx/runtime";
-import { pickBy } from "@gtkx/utils";
+import { getOrInsert, pickBy } from "@gtkx/utils";
 import type { Props } from "./registry.js";
 import { type TypeInfo, typeInfoFor } from "./metadata.js";
 import {
@@ -24,6 +24,7 @@ const CONTENT_TYPE_NAMES: { kind: ContentKind; name: string }[] = [
 ];
 
 const getContentTypes = createContentTypeCache();
+const contentKinds: Map<bigint, ContentKind | null> = new Map();
 
 function createContentTypeCache(): () => ContentType[] {
     let cached: ContentType[] | null = null;
@@ -35,7 +36,7 @@ function createContentTypeCache(): () => ContentType[] {
     };
 }
 
-const resolveContentKind = (type: bigint): ContentKind | null => {
+const findContentKind = (type: bigint): ContentKind | null => {
     for (const entry of getContentTypes()) {
         if (entry.type !== TYPE_INVALID && typeIsA(type, entry.type)) {
             return entry.kind;
@@ -45,6 +46,8 @@ const resolveContentKind = (type: bigint): ContentKind | null => {
     return null;
 };
 
+const contentKindFor = (type: bigint): ContentKind | null => getOrInsert(contentKinds, type, findContentKind);
+
 const constructInput = (info: TypeInfo, props: Props): Props =>
     pickBy(
         props,
@@ -69,14 +72,14 @@ const createObject = (typeName: string, type: bigint, input: Props): GObject.Obj
 const resolveElementNode = (typeName: string, props: Props, dispatch: Dispatch): ElementNode | LazyNode => {
     const info = typeInfoFor(typeName);
 
-    if (info.lazy) {
+    if (info.isLazy) {
         return createLazyNode(typeName, props, dispatch);
     }
 
     const type = typeFromName(typeName);
     const object = createObject(typeName, type, constructInput(info, props));
 
-    return createElementNode(typeName, object, dispatch, resolveContentKind(type));
+    return createElementNode(typeName, object, dispatch, contentKindFor(type));
 };
 
 export { resolveElementNode };