@gtkx/react 0.15.0 → 0.16.0

package/dist/nodes/navigation-page.js

@@ -1,6 +1,6 @@
-import { batch } from "@gtkx/ffi";
 import * as Adw from "@gtkx/ffi/adw";
 import { registerNodeClass } from "../registry.js";
+import { hasChanged } from "./internal/utils.js";
 import { SlotNode } from "./slot.js";
 export class NavigationPageNode extends SlotNode {
     static priority = 1;
@@ -9,48 +9,43 @@ export class NavigationPageNode extends SlotNode {
     }
     updateProps(oldProps, newProps) {
         super.updateProps(oldProps, newProps);
+        this.applyOwnProps(oldProps, newProps);
+    }
+    applyOwnProps(oldProps, newProps) {
         const child = this.child;
         if (!(child instanceof Adw.NavigationPage)) {
             return;
         }
-        if (!oldProps || oldProps.id !== newProps.id) {
-            if (newProps.id !== undefined) {
-                child.setTag(newProps.id);
-            }
+        if (hasChanged(oldProps, newProps, "id") && newProps.id !== undefined) {
+            child.setTag(newProps.id);
         }
-        if (!oldProps || oldProps.title !== newProps.title) {
-            if (newProps.title !== undefined) {
-                child.setTitle(newProps.title);
-            }
+        if (hasChanged(oldProps, newProps, "title") && newProps.title !== undefined) {
+            child.setTitle(newProps.title);
         }
-        if (!oldProps || oldProps.canPop !== newProps.canPop) {
-            if (newProps.canPop !== undefined) {
-                child.setCanPop(newProps.canPop);
-            }
+        if (hasChanged(oldProps, newProps, "canPop") && newProps.canPop !== undefined) {
+            child.setCanPop(newProps.canPop);
         }
     }
     onChildChange(oldChild) {
-        batch(() => {
-            const navigationView = this.getParent();
-            const title = this.props.title ?? "";
-            if (this.child) {
-                this.child = this.props.id
-                    ? Adw.NavigationPage.newWithTag(this.child, title, this.props.id)
-                    : new Adw.NavigationPage(this.child, title);
-                this.updateProps(null, this.props);
-            }
-            if (navigationView instanceof Adw.NavigationView) {
-                if (oldChild instanceof Adw.NavigationPage) {
-                    navigationView.remove(oldChild);
-                }
-                if (this.child) {
-                    navigationView.add(this.child);
-                }
+        const navigationView = this.getParent();
+        const title = this.props.title ?? "";
+        if (this.child) {
+            this.child = this.props.id
+                ? Adw.NavigationPage.newWithTag(this.child, title, this.props.id)
+                : new Adw.NavigationPage(this.child, title);
+            this.updateProps(null, this.props);
+        }
+        if (navigationView instanceof Adw.NavigationView) {
+            if (oldChild instanceof Adw.NavigationPage) {
+                navigationView.remove(oldChild);
             }
-            else {
-                super.onChildChange(oldChild);
+            if (this.child) {
+                navigationView.add(this.child);
             }
-        });
+        }
+        else {
+            super.onChildChange(oldChild);
+        }
     }
 }
 registerNodeClass(NavigationPageNode);

package/dist/nodes/navigation-view.js

@@ -1,16 +1,15 @@
 import * as Adw from "@gtkx/ffi/adw";
 import { registerNodeClass } from "../registry.js";
-import { scheduleAfterCommit } from "../scheduler.js";
-import { signalStore } from "./internal/signal-store.js";
-import { filterProps, isContainerType } from "./internal/utils.js";
+import { CommitPriority, scheduleAfterCommit } from "../scheduler.js";
+import { filterProps, hasChanged, matchesAnyClass, primitiveArrayEqual } from "./internal/utils.js";
 import { NavigationPageNode } from "./navigation-page.js";
 import { SlotNode } from "./slot.js";
 import { WidgetNode } from "./widget.js";
-const PROPS = ["history", "onHistoryChanged"];
+const OWN_PROPS = ["history", "onHistoryChanged"];
 class NavigationViewNode extends WidgetNode {
     static priority = 1;
     static matches(_type, containerOrClass) {
-        return isContainerType(Adw.NavigationView, containerOrClass);
+        return matchesAnyClass([Adw.NavigationView], containerOrClass);
     }
     appendChild(child) {
         if (child instanceof NavigationPageNode) {
@@ -45,35 +44,38 @@ class NavigationViewNode extends WidgetNode {
         throw new Error(`Cannot remove '${child.typeName}' from 'NavigationView': expected x.NavigationPage or Widget`);
     }
     updateProps(oldProps, newProps) {
+        super.updateProps(oldProps ? filterProps(oldProps, OWN_PROPS) : null, filterProps(newProps, OWN_PROPS));
+        this.applyOwnProps(oldProps, newProps);
+    }
+    applyOwnProps(oldProps, newProps) {
         const oldHistory = oldProps?.history;
         const newHistory = newProps.history;
-        if (newHistory && !this.arraysEqual(oldHistory, newHistory)) {
+        if (newHistory && !primitiveArrayEqual(oldHistory, newHistory)) {
             this.syncHistory(newHistory);
         }
-        if (!oldProps || oldProps.onHistoryChanged !== newProps.onHistoryChanged) {
+        if (hasChanged(oldProps, newProps, "onHistoryChanged")) {
             const onHistoryChanged = newProps.onHistoryChanged;
             if (onHistoryChanged) {
                 const handleHistoryChanged = () => {
                     const history = this.getCurrentHistory();
                     onHistoryChanged(history);
                 };
-                signalStore.set(this, this.container, "popped", handleHistoryChanged);
-                signalStore.set(this, this.container, "pushed", handleHistoryChanged);
-                signalStore.set(this, this.container, "replaced", handleHistoryChanged);
+                this.signalStore.set(this, this.container, "popped", handleHistoryChanged);
+                this.signalStore.set(this, this.container, "pushed", handleHistoryChanged);
+                this.signalStore.set(this, this.container, "replaced", handleHistoryChanged);
             }
             else {
-                signalStore.set(this, this.container, "popped", null);
-                signalStore.set(this, this.container, "pushed", null);
-                signalStore.set(this, this.container, "replaced", null);
+                this.signalStore.set(this, this.container, "popped", null);
+                this.signalStore.set(this, this.container, "pushed", null);
+                this.signalStore.set(this, this.container, "replaced", null);
             }
         }
-        super.updateProps(filterProps(oldProps ?? {}, PROPS), filterProps(newProps, PROPS));
     }
     syncHistory(history) {
         const container = this.container;
         scheduleAfterCommit(() => {
             container.replaceWithTags(history, history.length);
-        });
+        }, CommitPriority.NORMAL);
     }
     getCurrentHistory() {
         const stack = this.container.getNavigationStack();
@@ -88,18 +90,5 @@ class NavigationViewNode extends WidgetNode {
         }
         return history;
     }
-    arraysEqual(a, b) {
-        if (a === b)
-            return true;
-        if (!a || !b)
-            return false;
-        if (a.length !== b.length)
-            return false;
-        for (let i = 0; i < a.length; i++) {
-            if (a[i] !== b[i])
-                return false;
-        }
-        return true;
-    }
 }
 registerNodeClass(NavigationViewNode);

package/dist/nodes/notebook-page-tab.d.ts

@@ -4,10 +4,10 @@ import { SlotNode } from "./slot.js";
 type Props = Partial<SlotProps>;
 export declare class NotebookPageTabNode extends SlotNode<Props> {
     static priority: number;
-    private notebook?;
-    private page?;
+    private notebook;
+    private page;
     static matches(type: string): boolean;
-    setPage(notebook?: Gtk.Notebook, page?: Gtk.Widget): void;
+    setPage(notebook: Gtk.Notebook | null, page: Gtk.Widget | null): void;
     updateProps(oldProps: Props | null, newProps: Props): void;
     private getNotebook;
     private getPage;

package/dist/nodes/notebook-page-tab.js

@@ -1,10 +1,9 @@
-import { batch } from "@gtkx/ffi";
 import { registerNodeClass } from "../registry.js";
 import { SlotNode } from "./slot.js";
 export class NotebookPageTabNode extends SlotNode {
     static priority = 1;
-    notebook;
-    page;
+    notebook = null;
+    page = null;
     static matches(type) {
         return type === "NotebookPageTab";
     }
@@ -29,17 +28,15 @@ export class NotebookPageTabNode extends SlotNode {
         return this.page;
     }
     onChildChange(_oldChild) {
-        batch(() => {
-            if (!this.notebook || !this.page) {
-                return;
-            }
-            const notebook = this.getNotebook();
-            const page = this.getPage();
-            if (notebook.pageNum(page) === -1) {
-                return;
-            }
-            notebook.setTabLabel(page, this.child);
-        });
+        if (!this.notebook || !this.page) {
+            return;
+        }
+        const notebook = this.getNotebook();
+        const page = this.getPage();
+        if (notebook.pageNum(page) === -1) {
+            return;
+        }
+        notebook.setTabLabel(page, this.child);
     }
 }
 registerNodeClass(NotebookPageTabNode);

package/dist/nodes/notebook-page.d.ts

@@ -5,18 +5,20 @@ import { SlotNode } from "./slot.js";
 type Props = Partial<NotebookPageProps>;
 export declare class NotebookPageNode extends SlotNode<Props> {
     static priority: number;
-    position?: number | null;
-    private tabNode?;
+    position: number | null;
+    private tabNode;
     static matches(type: string): boolean;
-    setNotebook(notebook?: Gtk.Notebook): void;
-    setPosition(position?: number | null): void;
+    setParent(parent: Gtk.Widget | null): void;
+    setPosition(position: number | null): void;
     private getNotebook;
     private updateTabNode;
     appendChild(child: Node): void;
-    removeChild(child?: Node): void;
+    removeChild(child: Node): void;
     unmount(): void;
     updateProps(oldProps: Props | null, newProps: Props): void;
+    protected applyOwnProps(oldProps: Props | null, newProps: Props): void;
     private attachPage;
+    private applyPageProps;
     private detachPage;
     protected onChildChange(oldChild: Gtk.Widget | null): void;
 }

package/dist/nodes/notebook-page.js

@@ -1,19 +1,19 @@
-import { batch } from "@gtkx/ffi";
 import * as Gtk from "@gtkx/ffi/gtk";
 import { registerNodeClass } from "../registry.js";
-import { scheduleAfterCommit } from "../scheduler.js";
+import { CommitPriority, scheduleAfterCommit } from "../scheduler.js";
+import { hasChanged } from "./internal/utils.js";
 import { NotebookPageTabNode } from "./notebook-page-tab.js";
 import { SlotNode } from "./slot.js";
 import { WidgetNode } from "./widget.js";
 export class NotebookPageNode extends SlotNode {
     static priority = 1;
-    position;
-    tabNode;
+    position = null;
+    tabNode = null;
     static matches(type) {
         return type === "NotebookPage";
     }
-    setNotebook(notebook) {
-        this.setParent(notebook);
+    setParent(parent) {
+        super.setParent(parent);
         this.updateTabNode();
     }
     setPosition(position) {
@@ -35,7 +35,7 @@ export class NotebookPageNode extends SlotNode {
             this.tabNode = child;
             scheduleAfterCommit(() => {
                 this.updateTabNode();
-            });
+            }, CommitPriority.NORMAL);
             return;
         }
         if (!(child instanceof WidgetNode)) {
@@ -48,26 +48,31 @@ export class NotebookPageNode extends SlotNode {
                 this.onChildChange(oldChild ?? null);
             }
             this.updateTabNode();
-        });
+        }, CommitPriority.NORMAL);
     }
     removeChild(child) {
         if (child instanceof NotebookPageTabNode) {
-            this.tabNode = undefined;
+            this.tabNode = null;
             return;
         }
-        super.removeChild();
+        super.removeChild(child);
     }
     unmount() {
-        this.tabNode = undefined;
+        this.tabNode = null;
         super.unmount();
     }
     updateProps(oldProps, newProps) {
         super.updateProps(oldProps, newProps);
-        if (!oldProps || oldProps.label !== newProps.label) {
-            if (this.child && this.parent && !this.tabNode?.child) {
-                const tabLabel = this.getNotebook().getTabLabel(this.child);
-                tabLabel.setLabel(newProps.label ?? "");
-            }
+        this.applyOwnProps(oldProps, newProps);
+    }
+    applyOwnProps(oldProps, newProps) {
+        if (hasChanged(oldProps, newProps, "label") && this.child && this.parent && !this.tabNode?.child) {
+            const tabLabel = this.getNotebook().getTabLabel(this.child);
+            tabLabel.setLabel(newProps.label ?? "");
+        }
+        const pagePropsChanged = hasChanged(oldProps, newProps, "tabExpand") || hasChanged(oldProps, newProps, "tabFill");
+        if (this.child && this.parent && pagePropsChanged) {
+            this.applyPageProps();
         }
     }
     attachPage() {
@@ -84,9 +89,26 @@ export class NotebookPageNode extends SlotNode {
         }
         if (this.position != null) {
             notebook.insertPage(child, this.position, tabLabel);
+        }
+        else {
+            notebook.appendPage(child, tabLabel);
+        }
+        this.applyPageProps();
+    }
+    applyPageProps() {
+        const child = this.child;
+        if (!child || !this.parent)
             return;
+        const notebook = this.getNotebook();
+        const page = notebook.getPage(child);
+        if (!page)
+            return;
+        if (this.props.tabExpand !== undefined) {
+            page.setTabExpand(this.props.tabExpand);
+        }
+        if (this.props.tabFill !== undefined) {
+            page.setTabFill(this.props.tabFill);
         }
-        notebook.appendPage(child, tabLabel);
     }
     detachPage(childToDetach) {
         const notebook = this.getNotebook();
@@ -94,14 +116,12 @@ export class NotebookPageNode extends SlotNode {
         notebook.removePage(pageNum);
     }
     onChildChange(oldChild) {
-        batch(() => {
-            if (oldChild) {
-                this.detachPage(oldChild);
-            }
-            if (this.child) {
-                this.attachPage();
-            }
-        });
+        if (oldChild) {
+            this.detachPage(oldChild);
+        }
+        if (this.child) {
+            this.attachPage();
+        }
     }
 }
 registerNodeClass(NotebookPageNode);

package/dist/nodes/notebook.js

@@ -12,7 +12,7 @@ class NotebookNode extends WidgetNode {
         if (!(child instanceof NotebookPageNode)) {
             throw new Error(`Cannot append '${child.typeName}' to 'Notebook': expected x.NotebookPage`);
         }
-        child.setNotebook(this.container);
+        child.setParent(this.container);
     }
     insertBefore(child, before) {
         if (!(child instanceof NotebookPageNode) || !(before instanceof NotebookPageNode)) {
@@ -20,7 +20,7 @@ class NotebookNode extends WidgetNode {
         }
         const beforePosition = this.container.pageNum(before.getChild());
         child.setPosition(beforePosition);
-        child.setNotebook(this.container);
+        child.setParent(this.container);
     }
     removeChild(child) {
         if (!(child instanceof NotebookPageNode)) {

package/dist/nodes/overlay-child.js

@@ -1,49 +1,109 @@
-import { batch, isObjectEqual } from "@gtkx/ffi";
+import { isObjectEqual } from "@gtkx/ffi";
 import { registerNodeClass } from "../registry.js";
-import { SlotNode } from "./slot.js";
-class OverlayChildNode extends SlotNode {
+import { CommitPriority, scheduleAfterCommit } from "../scheduler.js";
+import { VirtualNode } from "./virtual.js";
+import { WidgetNode } from "./widget.js";
+class OverlayChildNode extends VirtualNode {
     static priority = 1;
     static matches(type) {
         return type === "OverlayChild";
     }
-    getOverlay() {
-        if (!this.parent) {
-            throw new Error("Expected parent widget to be set on OverlayChildNode");
+    parent = null;
+    children = new Set();
+    canBeChildOf(parent) {
+        return parent instanceof WidgetNode;
+    }
+    attachTo(parent) {
+        if (parent instanceof WidgetNode) {
+            this.parent = parent.container;
         }
-        return this.parent;
     }
-    updateProps(oldProps, newProps) {
-        super.updateProps(oldProps, newProps);
-        if (!this.parent || !this.child) {
-            return;
+    detachFrom(_parent) { }
+    unmount() {
+        if (this.parent && this.children.size > 0) {
+            const parent = this.parent;
+            const children = [...this.children];
+            this.children.clear();
+            for (const child of children) {
+                const currentParent = child.getParent();
+                if (currentParent && isObjectEqual(currentParent, parent)) {
+                    parent.removeOverlay(child);
+                }
+            }
         }
-        const overlay = this.getOverlay();
-        if (!oldProps || oldProps.measure !== newProps.measure) {
-            overlay.setMeasureOverlay(this.child, newProps.measure ?? false);
+        this.parent = null;
+        super.unmount();
+    }
+    appendChild(child) {
+        if (!(child instanceof WidgetNode)) {
+            throw new Error(`Cannot append '${child.typeName}' to '${this.typeName}': expected Widget`);
         }
-        if (!oldProps || oldProps.clipOverlay !== newProps.clipOverlay) {
-            overlay.setClipOverlay(this.child, newProps.clipOverlay ?? false);
+        const widget = child.container;
+        this.children.add(widget);
+        scheduleAfterCommit(() => {
+            if (this.parent) {
+                this.attachChild(widget);
+            }
+        }, CommitPriority.NORMAL);
+    }
+    insertBefore(child, _before) {
+        if (!(child instanceof WidgetNode)) {
+            throw new Error(`Cannot insert '${child.typeName}' into '${this.typeName}': expected Widget`);
         }
+        const widget = child.container;
+        this.children.add(widget);
+        scheduleAfterCommit(() => {
+            if (this.parent) {
+                this.attachChild(widget);
+            }
+        }, CommitPriority.NORMAL);
     }
-    onChildChange(oldChild) {
-        const overlay = this.getOverlay();
-        batch(() => {
-            if (oldChild) {
-                const parent = oldChild.getParent();
-                if (parent && isObjectEqual(parent, overlay)) {
-                    overlay.removeOverlay(oldChild);
+    removeChild(child) {
+        if (!(child instanceof WidgetNode)) {
+            throw new Error(`Cannot remove '${child.typeName}' from '${this.typeName}': expected Widget`);
+        }
+        const widget = child.container;
+        const parent = this.parent;
+        this.children.delete(widget);
+        scheduleAfterCommit(() => {
+            if (parent) {
+                const currentParent = widget.getParent();
+                if (currentParent && isObjectEqual(currentParent, parent)) {
+                    parent.removeOverlay(widget);
                 }
             }
-            if (this.child) {
-                overlay.addOverlay(this.child);
-                if (this.props.measure !== undefined) {
-                    overlay.setMeasureOverlay(this.child, this.props.measure);
+        }, CommitPriority.HIGH);
+    }
+    updateProps(oldProps, newProps) {
+        super.updateProps(oldProps, newProps);
+        if (!this.parent) {
+            return;
+        }
+        const measureChanged = oldProps?.measure !== newProps.measure;
+        const clipOverlayChanged = oldProps?.clipOverlay !== newProps.clipOverlay;
+        if (measureChanged || clipOverlayChanged) {
+            const parent = this.parent;
+            for (const child of this.children) {
+                if (measureChanged) {
+                    parent.setMeasureOverlay(child, newProps.measure ?? false);
                 }
-                if (this.props.clipOverlay !== undefined) {
-                    overlay.setClipOverlay(this.child, this.props.clipOverlay);
+                if (clipOverlayChanged) {
+                    parent.setClipOverlay(child, newProps.clipOverlay ?? false);
                 }
             }
-        });
+        }
+    }
+    attachChild(widget) {
+        if (!this.parent) {
+            return;
+        }
+        this.parent.addOverlay(widget);
+        if (this.props.measure !== undefined) {
+            this.parent.setMeasureOverlay(widget, this.props.measure);
+        }
+        if (this.props.clipOverlay !== undefined) {
+            this.parent.setClipOverlay(widget, this.props.clipOverlay);
+        }
     }
 }
 registerNodeClass(OverlayChildNode);

package/dist/nodes/pack-child.d.ts

@@ -1,14 +1 @@
-import type * as Gtk from "@gtkx/ffi/gtk";
-import { VirtualChildNode } from "./virtual-child.js";
-type PackableWidget = Gtk.Widget & {
-    packStart(child: Gtk.Widget): void;
-    packEnd(child: Gtk.Widget): void;
-    remove(child: Gtk.Widget): void;
-};
-export declare class PackChild extends VirtualChildNode<PackableWidget> {
-    static priority: number;
-    static matches(type: string): boolean;
-    protected getPositionLabel(): string;
-    protected attachChild(parent: PackableWidget, widget: Gtk.Widget): void;
-}
 export {};

package/dist/nodes/pack-child.js

@@ -1,20 +1,22 @@
 import { registerNodeClass } from "../registry.js";
-import { VirtualChildNode } from "./virtual-child.js";
-export class PackChild extends VirtualChildNode {
+import { VirtualContainerNode } from "./abstract/virtual-container.js";
+class PackStartNode extends VirtualContainerNode {
     static priority = 1;
     static matches(type) {
-        return type === "PackStart" || type === "PackEnd";
+        return type === "PackStart";
     }
-    getPositionLabel() {
-        return this.typeName === "PackStart" ? "start" : "end";
+    attachChild(parent, widget) {
+        parent.packStart(widget);
+    }
+}
+class PackEndNode extends VirtualContainerNode {
+    static priority = 1;
+    static matches(type) {
+        return type === "PackEnd";
     }
     attachChild(parent, widget) {
-        if (this.getPositionLabel() === "start") {
-            parent.packStart(widget);
-        }
-        else {
-            parent.packEnd(widget);
-        }
+        parent.packEnd(widget);
     }
 }
-registerNodeClass(PackChild);
+registerNodeClass(PackStartNode);
+registerNodeClass(PackEndNode);

package/dist/nodes/pack.d.ts

@@ -1 +1,6 @@
-export {};
+import type * as Gtk from "@gtkx/ffi/gtk";
+export type PackableWidget = Gtk.Widget & {
+    packStart(child: Gtk.Widget): void;
+    packEnd(child: Gtk.Widget): void;
+    remove(child: Gtk.Widget): void;
+};

package/dist/nodes/pack.js

@@ -1,46 +1,13 @@
 import { PACK_INTERFACE_METHODS } from "../generated/internal.js";
 import { registerNodeClass } from "../registry.js";
+import { PositionalParentNode } from "./abstract/positional-parent.js";
 import { matchesInterface } from "./internal/utils.js";
-import { PackChild } from "./pack-child.js";
-import { SlotNode } from "./slot.js";
-import { WidgetNode } from "./widget.js";
-class PackNode extends WidgetNode {
+class PackNode extends PositionalParentNode {
     static priority = 0;
+    acceptedPositionalChildTypes = new Set(["PackStart", "PackEnd"]);
+    containerTypeName = "Pack";
     static matches(_type, containerOrClass) {
         return matchesInterface(PACK_INTERFACE_METHODS, containerOrClass);
     }
-    appendChild(child) {
-        if (child instanceof PackChild) {
-            child.setParent(this.container);
-            return;
-        }
-        if (child instanceof SlotNode || child instanceof WidgetNode) {
-            super.appendChild(child);
-            return;
-        }
-        throw new Error(`Cannot append '${child.typeName}' to 'Pack': expected x.PackStart, x.PackEnd, or Widget`);
-    }
-    insertBefore(child, before) {
-        if (child instanceof PackChild) {
-            child.setParent(this.container);
-            return;
-        }
-        if (child instanceof SlotNode || child instanceof WidgetNode) {
-            super.insertBefore(child, before);
-            return;
-        }
-        throw new Error(`Cannot insert '${child.typeName}' into 'Pack': expected x.PackStart, x.PackEnd, or Widget`);
-    }
-    removeChild(child) {
-        if (child instanceof PackChild) {
-            child.unmount();
-            return;
-        }
-        if (child instanceof SlotNode || child instanceof WidgetNode) {
-            super.removeChild(child);
-            return;
-        }
-        throw new Error(`Cannot remove '${child.typeName}' from 'Pack': expected x.PackStart, x.PackEnd, or Widget`);
-    }
 }
 registerNodeClass(PackNode);