@gtkx/react 0.16.0 → 0.17.2

package/dist/generated/jsx.js

@@ -7959,6 +7959,7 @@ export const AdwTabOverview = "AdwTabOverview";
  * are the accessible parent objects of the child widgets.
  */
 export const AdwTabView = "AdwTabView";
+/** A Vte.Terminal widget element. */
 export const VteTerminal = "VteTerminal";
 /**
  * A single-line text entry.
@@ -8975,6 +8976,7 @@ export const GtkVolumeButton = "GtkVolumeButton";
  * you don't need to embed it in a #GtkScrolledWindow.
  */
 export const WebKitWebView = "WebKitWebView";
+/** A WebKit.WebViewBase widget element. */
 export const WebKitWebViewBase = "WebKitWebViewBase";
 /**
  * Shows window frame controls.

package/dist/host-config.js

@@ -2,7 +2,6 @@ import { getNativeId } from "@gtkx/ffi";
 import React from "react";
 import { createNode } from "./factory.js";
 import { isBufferedType } from "./nodes/internal/predicates.js";
-import { getSignalStore } from "./nodes/internal/signal-store.js";
 import { flushAfterCommit } from "./scheduler.js";
 if (!globalThis.__GTKX_CONTAINER_NODE_CACHE__) {
     globalThis.__GTKX_CONTAINER_NODE_CACHE__ = new Map();
@@ -55,13 +54,11 @@ export function createHostConfig() {
             parent.appendChild(child);
         },
         finalizeInitialChildren: (instance, _type, props) => {
-            instance.signalStore.blockAll();
-            instance.updateProps(null, props);
-            instance.signalStore.unblockAll();
+            instance.commitProps(null, props);
             return true;
         },
         commitUpdate: (instance, _type, oldProps, newProps) => {
-            instance.updateProps(oldProps, newProps);
+            instance.commitProps(oldProps, newProps);
         },
         commitMount: (instance, _type) => {
             instance.mount();
@@ -87,20 +84,18 @@ export function createHostConfig() {
             const parent = getOrCreateContainerNode(container);
             parent.insertBefore(child, beforeChild);
         },
-        prepareForCommit: (containerInfo) => {
-            getSignalStore(containerInfo).blockAll();
+        prepareForCommit: () => {
             return null;
         },
-        resetAfterCommit: (containerInfo) => {
+        resetAfterCommit: () => {
             flushAfterCommit();
-            getSignalStore(containerInfo).unblockAll();
         },
         commitTextUpdate: (textInstance, oldText, newText) => {
             if (textInstance.typeName === "TextSegment") {
-                textInstance.updateProps({ text: oldText }, { text: newText });
+                textInstance.commitProps({ text: oldText }, { text: newText });
             }
             else {
-                textInstance.updateProps({ label: oldText }, { label: newText });
+                textInstance.commitProps({ label: oldText }, { label: newText });
             }
         },
         clearContainer: () => { },

package/dist/jsx.d.ts

@@ -2,25 +2,47 @@ import type * as Adw from "@gtkx/ffi/adw";
 import type * as Gsk from "@gtkx/ffi/gsk";
 import type * as Gtk from "@gtkx/ffi/gtk";
 import type { ReactElement, ReactNode } from "react";
+import type { AnimationProps } from "./animation/types.js";
 import type { GtkGridViewProps as GeneratedGtkGridViewProps, GtkListViewProps as GeneratedGtkListViewProps, WidgetSlotNames } from "./generated/jsx.js";
-import type { AnimationProps as AnimationNodeProps } from "./nodes/animation/index.js";
 import type { RenderItemFn } from "./nodes/internal/list-item-renderer.js";
 import type { TreeRenderItemFn } from "./nodes/internal/tree-list-item-renderer.js";
 import type { ShortcutProps as ShortcutNodeProps } from "./nodes/shortcut.js";
 import type { TextAnchorProps } from "./nodes/text-anchor.js";
 import type { TextPaintableProps } from "./nodes/text-paintable.js";
 import type { TextTagProps } from "./nodes/text-tag.js";
-export type { AnimatableProperties, SpringTransition, TimedTransition, Transition } from "./nodes/animation/index.js";
+export type { AnimatableProperties, AnimationMode, AnimationProps, SpringTransition, TimedTransition, } from "./animation/types.js";
 export type { TextAnchorProps } from "./nodes/text-anchor.js";
 export type { TextPaintableProps } from "./nodes/text-paintable.js";
 export type { TextTagProps } from "./nodes/text-tag.js";
+/**
+ * Configuration for a mark on a GtkScale widget.
+ *
+ * Marks are visual indicators placed along the scale at specific values,
+ * optionally with text labels.
+ *
+ * @see {@link https://docs.gtk.org/gtk4/method.Scale.add_mark.html GtkScale.add_mark}
+ */
 export type ScaleMark = {
+    /** The value at which to place the mark */
     value: number;
+    /** Position of the mark relative to the scale (default: BOTTOM) */
     position?: Gtk.PositionType;
+    /** Optional text label to display at the mark */
     label?: string | null;
 };
+/**
+ * Configuration for an offset threshold on a GtkLevelBar widget.
+ *
+ * Offsets define named value thresholds that change the bar's appearance
+ * (e.g., "low", "high", "full"). Built-in offsets include GTK_LEVEL_BAR_OFFSET_LOW,
+ * GTK_LEVEL_BAR_OFFSET_HIGH, and GTK_LEVEL_BAR_OFFSET_FULL.
+ *
+ * @see {@link https://docs.gtk.org/gtk4/method.LevelBar.add_offset_value.html GtkLevelBar.add_offset_value}
+ */
 export type LevelBarOffset = {
+    /** Unique identifier for this offset (e.g., "low", "high", "full") */
     id: string;
+    /** The threshold value at which this offset applies */
     value: number;
 };
 /**
@@ -272,6 +294,13 @@ export type ToggleProps = {
     /** Whether underline in label indicates mnemonic */
     useUnderline?: boolean;
 };
+/**
+ * Props for response buttons in an AdwAlertDialog.
+ *
+ * Each response represents a button the user can click to dismiss the dialog.
+ *
+ * @see {@link x.AlertDialogResponse} for usage
+ */
 export type AlertDialogResponseProps = {
     /** Unique response ID (used in response signal and for default/close response) */
     id: string;
@@ -848,19 +877,19 @@ export declare const x: {
      */
     Shortcut: "Shortcut";
     /**
-     * Declarative animation wrapper using libadwaita's animation primitives.
+     * Declarative animation wrapper using Adw.TimedAnimation or Adw.SpringAnimation.
      *
-     * Provides Framer Motion-like API for animating GTK widgets with spring
-     * or timed animations.
+     * Provides framer-motion-inspired API for animating child widgets.
      *
      * @example
      * ```tsx
      * <x.Animation
-     *   initial={{ opacity: 0, y: -20 }}
-     *   animate={{ opacity: 1, y: 0 }}
-     *   transition={{ type: "spring", stiffness: 300, damping: 20 }}
+     *   mode="spring"
+     *   initial={{ opacity: 0, scale: 0.9 }}
+     *   animate={{ opacity: 1, scale: 1 }}
+     *   animateOnMount
      * >
-     *   <GtkLabel label="Hello World" />
+     *   <GtkButton label="Animated Button" />
      * </x.Animation>
      * ```
      */
@@ -873,6 +902,7 @@ declare global {
                 ActionRowPrefix: VirtualSlotProps;
                 ActionRowSuffix: VirtualSlotProps;
                 AlertDialogResponse: AlertDialogResponseProps;
+                Animation: AnimationProps;
                 ColumnViewColumn: ColumnViewColumnProps<any>;
                 ExpanderRowAction: ExpanderRowChildProps;
                 ExpanderRowRow: ExpanderRowChildProps;
@@ -898,7 +928,6 @@ declare global {
                 TreeListItem: TreeListItemProps<any>;
                 NavigationPage: NavigationPageProps;
                 Shortcut: ShortcutProps;
-                Animation: AnimationNodeProps;
             }
         }
     }

package/dist/jsx.js

@@ -476,19 +476,19 @@ export const x = {
      */
     Shortcut: "Shortcut",
     /**
-     * Declarative animation wrapper using libadwaita's animation primitives.
+     * Declarative animation wrapper using Adw.TimedAnimation or Adw.SpringAnimation.
      *
-     * Provides Framer Motion-like API for animating GTK widgets with spring
-     * or timed animations.
+     * Provides framer-motion-inspired API for animating child widgets.
      *
      * @example
      * ```tsx
      * <x.Animation
-     *   initial={{ opacity: 0, y: -20 }}
-     *   animate={{ opacity: 1, y: 0 }}
-     *   transition={{ type: "spring", stiffness: 300, damping: 20 }}
+     *   mode="spring"
+     *   initial={{ opacity: 0, scale: 0.9 }}
+     *   animate={{ opacity: 1, scale: 1 }}
+     *   animateOnMount
      * >
-     *   <GtkLabel label="Hello World" />
+     *   <GtkButton label="Animated Button" />
      * </x.Animation>
      * ```
      */

package/dist/node.d.ts

@@ -13,5 +13,6 @@ export declare class Node<T = unknown, P = Props> {
     insertBefore(_child: Node, _before: Node): void;
     updateProps(_oldProps: P | null, _newProps: P): void;
     mount(): void;
+    commitProps(oldProps: P | null, newProps: P): void;
     unmount(): void;
 }

package/dist/node.js

@@ -20,6 +20,15 @@ export class Node {
     insertBefore(_child, _before) { }
     updateProps(_oldProps, _newProps) { }
     mount() { }
+    commitProps(oldProps, newProps) {
+        this.signalStore.blockAll();
+        try {
+            this.updateProps(oldProps, newProps);
+        }
+        finally {
+            this.signalStore.unblockAll();
+        }
+    }
     unmount() {
         this.signalStore.clear(this);
     }

package/dist/nodes/abstract/virtual-container.d.ts

@@ -1,14 +1,18 @@
 import type * as Gtk from "@gtkx/ffi/gtk";
 import type { Node } from "../../node.js";
+import type { Attachable } from "../internal/predicates.js";
 import { VirtualNode } from "../virtual.js";
 type ChildParentWidget = Gtk.Widget & {
     remove(child: Gtk.Widget): void;
 };
-export declare abstract class VirtualContainerNode<P extends ChildParentWidget = ChildParentWidget> extends VirtualNode {
+export declare abstract class VirtualContainerNode<P extends ChildParentWidget = ChildParentWidget> extends VirtualNode implements Attachable {
     protected parent: P | null;
     setParent(newParent: P | null): void;
     protected getParent(): P;
     protected abstract attachChild(parent: P, widget: Gtk.Widget): void;
+    canBeChildOf(parent: Node): boolean;
+    attachTo(parent: Node): void;
+    detachFrom(_parent: Node): void;
     unmount(): void;
     appendChild(child: Node): void;
     insertBefore(child: Node, _before: Node): void;

package/dist/nodes/abstract/virtual-container.js

@@ -13,6 +13,15 @@ export class VirtualContainerNode extends VirtualNode {
         }
         return this.parent;
     }
+    canBeChildOf(parent) {
+        return parent instanceof WidgetNode;
+    }
+    attachTo(parent) {
+        if (parent instanceof WidgetNode) {
+            this.setParent(parent.container);
+        }
+    }
+    detachFrom(_parent) { }
     unmount() {
         this.parent = null;
         super.unmount();

package/dist/nodes/abstract/virtual-single-child.js

@@ -1,3 +1,4 @@
+import { isObjectEqual } from "@gtkx/ffi";
 import { CommitPriority, scheduleAfterCommit } from "../../scheduler.js";
 import { VirtualNode } from "../virtual.js";
 import { WidgetNode } from "../widget.js";
@@ -34,7 +35,7 @@ export class VirtualSingleChildNode extends VirtualNode {
         }
         const oldChild = this.child;
         scheduleAfterCommit(() => {
-            if (oldChild === this.child) {
+            if (isObjectEqual(oldChild, this.child)) {
                 this.child = null;
             }
             if (this.parent && oldChild) {

package/dist/nodes/action-row-child.js

@@ -1,10 +1,15 @@
+import { PREFIX_SUFFIX_INTERFACE_METHODS } from "../generated/internal.js";
 import { registerNodeClass } from "../registry.js";
 import { VirtualContainerNode } from "./abstract/virtual-container.js";
+import { matchesInterface } from "./internal/utils.js";
 class ActionRowPrefixNode extends VirtualContainerNode {
     static priority = 1;
     static matches(type) {
         return type === "ActionRowPrefix";
     }
+    canBeChildOf(parent) {
+        return matchesInterface(PREFIX_SUFFIX_INTERFACE_METHODS, parent.container);
+    }
     attachChild(parent, widget) {
         parent.addPrefix(widget);
     }
@@ -14,6 +19,9 @@ class ActionRowSuffixNode extends VirtualContainerNode {
     static matches(type) {
         return type === "ActionRowSuffix";
     }
+    canBeChildOf(parent) {
+        return matchesInterface(PREFIX_SUFFIX_INTERFACE_METHODS, parent.container);
+    }
     attachChild(parent, widget) {
         parent.addSuffix(widget);
     }

package/dist/nodes/animation.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/nodes/animation.js

@@ -0,0 +1,252 @@
+import { isObjectEqual } from "@gtkx/ffi";
+import * as Adw from "@gtkx/ffi/adw";
+import * as Gdk from "@gtkx/ffi/gdk";
+import * as Gtk from "@gtkx/ffi/gtk";
+import { buildCss, interpolate } from "../animation/css-builder.js";
+import { registerNodeClass } from "../registry.js";
+import { CommitPriority, scheduleAfterCommit } from "../scheduler.js";
+import { VirtualSingleChildNode } from "./abstract/virtual-single-child.js";
+import { attachChild, detachChild, getAttachmentStrategy } from "./internal/child-attachment.js";
+import { isRemovable } from "./internal/predicates.js";
+let animationCounter = 0;
+const DEFAULT_TIMED_DURATION = 300;
+const DEFAULT_SPRING_DAMPING = 1;
+const DEFAULT_SPRING_MASS = 1;
+const DEFAULT_SPRING_STIFFNESS = 100;
+class AnimationNode extends VirtualSingleChildNode {
+    static priority = 2;
+    static matches(type) {
+        return type === "Animation";
+    }
+    className;
+    provider = null;
+    display = null;
+    currentAnimation = null;
+    currentValues = {};
+    isExiting = false;
+    constructor(typeName, props, container, rootContainer) {
+        super(typeName, props, container, rootContainer);
+        this.className = `gtkx-anim-${animationCounter++}`;
+    }
+    updateProps(oldProps, newProps) {
+        super.updateProps(oldProps, newProps);
+        if (this.isExiting) {
+            return;
+        }
+        if (oldProps && newProps.animate && !this.arePropsEqual(oldProps.animate, newProps.animate)) {
+            const target = newProps.animate;
+            scheduleAfterCommit(() => {
+                if (this.child && !this.isExiting) {
+                    this.animateTo(target);
+                }
+            }, CommitPriority.LOW);
+        }
+    }
+    onChildChange(oldChild) {
+        if (oldChild && this.provider) {
+            oldChild.removeCssClass(this.className);
+        }
+        if (oldChild && this.parent && this.isWidgetAttachedTo(oldChild, this.parent)) {
+            const strategy = getAttachmentStrategy(this.parent);
+            if (strategy) {
+                detachChild(oldChild, strategy);
+            }
+            else if (isRemovable(this.parent)) {
+                this.parent.remove(oldChild);
+            }
+        }
+        if (this.child && this.parent) {
+            const strategy = getAttachmentStrategy(this.parent);
+            if (strategy) {
+                attachChild(this.child, strategy);
+            }
+            this.setupCssProvider();
+            this.child.addCssClass(this.className);
+            scheduleAfterCommit(() => {
+                if (!this.child)
+                    return;
+                const initial = this.props.initial;
+                const animate = this.props.animate;
+                if (initial === false || !this.props.animateOnMount) {
+                    if (animate) {
+                        this.currentValues = { ...animate };
+                        this.applyValues(this.currentValues);
+                    }
+                }
+                else {
+                    const initialValues = initial ?? animate ?? {};
+                    this.currentValues = { ...initialValues };
+                    this.applyValues(this.currentValues);
+                    if (this.props.animateOnMount && animate) {
+                        this.animateTo(animate);
+                    }
+                }
+            }, CommitPriority.LOW);
+        }
+    }
+    unmount() {
+        if (this.isExiting) {
+            return;
+        }
+        if (this.props.exit && this.child) {
+            this.isExiting = true;
+            this.animateTo(this.props.exit, () => {
+                this.detachChildFromParent();
+                this.cleanup();
+                super.unmount();
+            });
+        }
+        else {
+            this.detachChildFromParent();
+            this.cleanup();
+            super.unmount();
+        }
+    }
+    detachChildFromParent() {
+        if (this.child && this.parent && this.isChildAttachedToParent()) {
+            const strategy = getAttachmentStrategy(this.parent);
+            if (strategy) {
+                detachChild(this.child, strategy);
+            }
+            else if (isRemovable(this.parent)) {
+                this.parent.remove(this.child);
+            }
+        }
+    }
+    isChildAttachedToParent() {
+        return this.isWidgetAttachedTo(this.child, this.parent);
+    }
+    isWidgetAttachedTo(child, parent) {
+        if (!child || !parent)
+            return false;
+        const childParent = child.getParent();
+        return childParent !== null && isObjectEqual(childParent, parent);
+    }
+    setupCssProvider() {
+        if (this.provider || !this.child)
+            return;
+        this.provider = new Gtk.CssProvider();
+        this.display = Gdk.DisplayManager.get().getDefaultDisplay();
+        if (this.display) {
+            Gtk.StyleContext.addProviderForDisplay(this.display, this.provider, Gtk.STYLE_PROVIDER_PRIORITY_APPLICATION);
+        }
+    }
+    cleanup() {
+        if (this.currentAnimation) {
+            this.currentAnimation.skip();
+            this.currentAnimation = null;
+        }
+        if (this.provider && this.display) {
+            Gtk.StyleContext.removeProviderForDisplay(this.display, this.provider);
+        }
+        if (this.child) {
+            this.child.removeCssClass(this.className);
+        }
+        this.provider = null;
+        this.display = null;
+    }
+    animateTo(target, onComplete) {
+        if (!this.child)
+            return;
+        if (this.currentAnimation) {
+            this.currentAnimation.skip();
+            this.currentAnimation = null;
+        }
+        const from = { ...this.currentValues };
+        const to = { ...target };
+        this.props.onAnimationStart?.();
+        const callback = new Adw.CallbackAnimationTarget((progress) => {
+            const interpolated = interpolate(from, to, progress);
+            this.currentValues = interpolated;
+            this.applyValues(interpolated);
+        });
+        const animation = this.createAnimation(this.child, callback);
+        animation.connect("done", () => {
+            this.currentValues = { ...to };
+            this.currentAnimation = null;
+            this.props.onAnimationComplete?.();
+            onComplete?.();
+        });
+        this.currentAnimation = animation;
+        const transition = this.props.transition;
+        const delay = transition?.delay ?? 0;
+        if (delay > 0) {
+            setTimeout(() => {
+                if (this.currentAnimation === animation) {
+                    animation.play();
+                }
+            }, delay);
+        }
+        else {
+            animation.play();
+        }
+    }
+    createAnimation(widget, target) {
+        const mode = this.props.mode;
+        if (mode === "spring") {
+            return this.createSpringAnimation(widget, target);
+        }
+        return this.createTimedAnimation(widget, target);
+    }
+    createTimedAnimation(widget, target) {
+        const transition = this.props.transition;
+        const duration = transition?.duration ?? DEFAULT_TIMED_DURATION;
+        const animation = new Adw.TimedAnimation(widget, 0, 1, duration, target);
+        if (transition?.easing !== undefined) {
+            animation.setEasing(transition.easing);
+        }
+        if (transition?.repeat !== undefined) {
+            animation.setRepeatCount(transition.repeat);
+        }
+        if (transition?.reverse !== undefined) {
+            animation.setReverse(transition.reverse);
+        }
+        if (transition?.alternate !== undefined) {
+            animation.setAlternate(transition.alternate);
+        }
+        return animation;
+    }
+    createSpringAnimation(widget, target) {
+        const transition = this.props.transition;
+        const damping = transition?.damping ?? DEFAULT_SPRING_DAMPING;
+        const mass = transition?.mass ?? DEFAULT_SPRING_MASS;
+        const stiffness = transition?.stiffness ?? DEFAULT_SPRING_STIFFNESS;
+        const springParams = new Adw.SpringParams(damping, mass, stiffness);
+        const animation = new Adw.SpringAnimation(widget, 0, 1, springParams, target);
+        if (transition?.initialVelocity !== undefined) {
+            animation.setInitialVelocity(transition.initialVelocity);
+        }
+        if (transition?.clamp !== undefined) {
+            animation.setClamp(transition.clamp);
+        }
+        return animation;
+    }
+    applyValues(values) {
+        if (!this.provider) {
+            return;
+        }
+        if (this.child && !this.child.getCssClasses()?.includes(this.className)) {
+            this.child.addCssClass(this.className);
+        }
+        const css = buildCss(this.className, values);
+        if (css) {
+            this.provider.loadFromString(css);
+        }
+    }
+    arePropsEqual(a, b) {
+        if (a === b)
+            return true;
+        if (!a || !b)
+            return false;
+        const keysA = Object.keys(a);
+        const keysB = Object.keys(b);
+        if (keysA.length !== keysB.length)
+            return false;
+        for (const key of keysA) {
+            if (a[key] !== b[key])
+                return false;
+        }
+        return true;
+    }
+}
+registerNodeClass(AnimationNode);

package/dist/nodes/event-controller.d.ts

@@ -1 +1,22 @@
-export {};
+import * as Gtk from "@gtkx/ffi/gtk";
+import { Node } from "../node.js";
+import type { Container, Props } from "../types.js";
+import type { Attachable } from "./internal/predicates.js";
+export declare class EventControllerNode<T extends Gtk.EventController = Gtk.EventController> extends Node<T, Props> implements Attachable {
+    static priority: number;
+    static matches(type: string): boolean;
+    static createContainer(props: Props, containerClass: typeof Gtk.EventController): Gtk.EventController;
+    props: Props;
+    protected parentWidget: Gtk.Widget | null;
+    constructor(typeName: string, props: Props, container: T, rootContainer: Container);
+    canBeChildOf(parent: Node): boolean;
+    appendChild(_child: Node): void;
+    removeChild(_child: Node): void;
+    insertBefore(_child: Node, _before: Node): void;
+    attachTo(parent: Node): void;
+    detachFrom(_parent: Node): void;
+    updateProps(oldProps: Props | null, newProps: Props): void;
+    unmount(): void;
+    private applyProps;
+    private setProperty;
+}

package/dist/nodes/event-controller.js

@@ -5,7 +5,7 @@ import { registerNodeClass } from "../registry.js";
 import { propNameToSignalName, resolvePropMeta, resolveSignal } from "./internal/utils.js";
 import { WidgetNode } from "./widget.js";
 const G_TYPE_INVALID = 0;
-class EventControllerNode extends Node {
+export class EventControllerNode extends Node {
     static priority = 1;
     static matches(type) {
         return type in CONTROLLER_CLASSES;
@@ -70,7 +70,7 @@ class EventControllerNode extends Node {
             const signalName = propNameToSignalName(name);
             if (resolveSignal(this.container, signalName)) {
                 const handler = typeof newValue === "function" ? newValue : undefined;
-                this.signalStore.set(this, this.container, signalName, handler);
+                this.signalStore.set(this, this.container, signalName, handler, { blockable: false });
             }
             else if (newValue !== undefined) {
                 this.setProperty(name, newValue);

package/dist/nodes/expander-row-child.js

@@ -1,10 +1,15 @@
 import { registerNodeClass } from "../registry.js";
 import { VirtualContainerNode } from "./abstract/virtual-container.js";
+import { matchesInterface } from "./internal/utils.js";
+const EXPANDER_ROW_INTERFACE_METHODS = ["addRow", "addAction", "remove"];
 class ExpanderRowRowNode extends VirtualContainerNode {
     static priority = 1;
     static matches(type) {
         return type === "ExpanderRowRow";
     }
+    canBeChildOf(parent) {
+        return matchesInterface(EXPANDER_ROW_INTERFACE_METHODS, parent.container);
+    }
     attachChild(parent, widget) {
         parent.addRow(widget);
     }
@@ -14,6 +19,9 @@ class ExpanderRowActionNode extends VirtualContainerNode {
     static matches(type) {
         return type === "ExpanderRowAction";
     }
+    canBeChildOf(parent) {
+        return matchesInterface(EXPANDER_ROW_INTERFACE_METHODS, parent.container);
+    }
     attachChild(parent, widget) {
         parent.addAction(widget);
     }

package/dist/nodes/fixed-child.js

@@ -1,3 +1,4 @@
+import * as Gtk from "@gtkx/ffi/gtk";
 import { registerNodeClass } from "../registry.js";
 import { PositionalChildNode } from "./abstract/positional-child.js";
 import { hasChanged } from "./internal/utils.js";
@@ -6,6 +7,9 @@ class FixedChildNode extends PositionalChildNode {
     static matches(type) {
         return type === "FixedChild";
     }
+    canBeChildOf(parent) {
+        return parent.container instanceof Gtk.Fixed;
+    }
     onChildChange(oldChild) {
         super.onChildChange(oldChild);
         if (this.child) {

package/dist/nodes/grid-child.js

@@ -1,4 +1,5 @@
 import { isObjectEqual } from "@gtkx/ffi";
+import * as Gtk from "@gtkx/ffi/gtk";
 import { registerNodeClass } from "../registry.js";
 import { PositionalChildNode } from "./abstract/positional-child.js";
 import { hasChanged } from "./internal/utils.js";
@@ -7,6 +8,9 @@ class GridChildNode extends PositionalChildNode {
     static matches(type) {
         return type === "GridChild";
     }
+    canBeChildOf(parent) {
+        return parent.container instanceof Gtk.Grid;
+    }
     attachToParent(parent, child) {
         const grid = parent;
         const column = this.props.column ?? 0;