@gtkx/react 0.1.12 → 0.1.14

package/dist/nodes/list.js

@@ -1,46 +1,33 @@
+import { wrapPtr } from "@gtkx/ffi";
 import * as Gtk from "@gtkx/ffi/gtk";
-import { appendChild, disconnectSignalHandlers, isConnectable, removeChild } from "../widget-capabilities.js";
-const isListViewWidget = (widget) => "setModel" in widget &&
-    typeof widget.setModel === "function" &&
-    "setFactory" in widget &&
-    typeof widget.setFactory === "function";
-const LIST_VIEW_TYPES = ["ListView", "ListView.Root"];
-export class ListViewNode {
-    static needsWidget = true;
-    static matches(type, widget) {
-        if (!LIST_VIEW_TYPES.includes(type) && !type.startsWith("ListView"))
-            return false;
-        return widget !== null && isListViewWidget(widget);
+import { Node } from "../node.js";
+const LIST_WIDGETS = ["ListView", "ColumnView", "GridView"];
+export class ListViewNode extends Node {
+    static matches(type) {
+        return LIST_WIDGETS.map((w) => `${w}.Root`).includes(type);
     }
-    widget;
     stringList;
     selectionModel;
     factory;
     items = [];
     renderItem = null;
-    signalHandlers = new Map();
     factorySignalHandlers = new Map();
-    constructor(_type, widget, props) {
-        if (!isListViewWidget(widget)) {
-            throw new Error("ListViewNode requires a ListView widget");
-        }
-        this.widget = widget;
+    constructor(type, props, currentApp) {
+        super(type, props, currentApp);
         this.stringList = new Gtk.StringList([]);
         this.selectionModel = new Gtk.SingleSelection(this.stringList);
         this.factory = new Gtk.SignalListItemFactory();
         this.renderItem = props.renderItem;
-        const setupHandlerId = this.factory.connect("setup", (listItemPtr) => {
-            const listItem = Object.create(Gtk.ListItem.prototype);
-            listItem.ptr = listItemPtr;
+        const setupHandlerId = this.factory.connect("setup", (_self, listItemObj) => {
+            const listItem = wrapPtr(listItemObj, Gtk.ListItem);
             if (this.renderItem) {
                 const widget = this.renderItem(null);
                 listItem.setChild(widget);
             }
         });
         this.factorySignalHandlers.set("setup", setupHandlerId);
-        const bindHandlerId = this.factory.connect("bind", (listItemPtr) => {
-            const listItem = Object.create(Gtk.ListItem.prototype);
-            listItem.ptr = listItemPtr;
+        const bindHandlerId = this.factory.connect("bind", (_self, listItemObj) => {
+            const listItem = wrapPtr(listItemObj, Gtk.ListItem);
             const position = listItem.getPosition();
             const item = this.items[position];
             if (this.renderItem && item !== undefined) {
@@ -49,32 +36,8 @@ export class ListViewNode {
             }
         });
         this.factorySignalHandlers.set("bind", bindHandlerId);
-        this.widget.setModel(this.selectionModel.ptr);
-        this.widget.setFactory(this.factory.ptr);
-    }
-    getWidget() {
-        return this.widget;
-    }
-    appendChild(child) {
-        child.attachToParent(this);
-    }
-    removeChild(child) {
-        child.detachFromParent(this);
-    }
-    insertBefore(child, _before) {
-        this.appendChild(child);
-    }
-    attachToParent(parent) {
-        const parentWidget = parent.getWidget?.();
-        if (parentWidget) {
-            appendChild(parentWidget, this.widget);
-        }
-    }
-    detachFromParent(parent) {
-        const parentWidget = parent.getWidget?.();
-        if (parentWidget) {
-            removeChild(parentWidget, this.widget);
-        }
+        this.widget.setModel(this.selectionModel);
+        this.widget.setFactory(this.factory);
     }
     addItem(item) {
         this.items.push(item);
@@ -87,52 +50,25 @@ export class ListViewNode {
             this.stringList.remove(index);
         }
     }
+    consumedProps() {
+        const consumed = super.consumedProps();
+        consumed.add("renderItem");
+        return consumed;
+    }
     updateProps(oldProps, newProps) {
         if (oldProps.renderItem !== newProps.renderItem) {
             this.renderItem = newProps.renderItem;
         }
-        const consumedProps = new Set(["children", "renderItem"]);
-        const allKeys = new Set([...Object.keys(oldProps), ...Object.keys(newProps)]);
-        for (const key of allKeys) {
-            if (consumedProps.has(key))
-                continue;
-            const oldValue = oldProps[key];
-            const newValue = newProps[key];
-            if (oldValue === newValue)
-                continue;
-            if (key.startsWith("on")) {
-                const eventName = key
-                    .slice(2)
-                    .replace(/([A-Z])/g, "-$1")
-                    .toLowerCase()
-                    .replace(/^-/, "");
-                const oldHandlerId = this.signalHandlers.get(eventName);
-                if (oldHandlerId !== undefined && isConnectable(this.widget)) {
-                    this.signalHandlers.delete(eventName);
-                }
-                if (typeof newValue === "function" && isConnectable(this.widget)) {
-                    const handlerId = this.widget.connect(eventName, newValue);
-                    this.signalHandlers.set(eventName, handlerId);
-                }
-                continue;
-            }
-            const setterName = `set${key.charAt(0).toUpperCase()}${key.slice(1)}`;
-            const setter = this.widget[setterName];
-            if (typeof setter === "function") {
-                setter.call(this.widget, newValue);
-            }
-        }
+        super.updateProps(oldProps, newProps);
     }
-    mount() { }
     dispose() {
-        disconnectSignalHandlers(this.widget, this.signalHandlers);
-        disconnectSignalHandlers(this.factory, this.factorySignalHandlers);
+        super.dispose();
+        this.widget.setModel(undefined);
+        this.widget.setFactory(undefined);
     }
 }
-const LIST_WIDGETS = ["ListView", "ColumnView", "GridView"];
-export class ListItemNode {
-    static needsWidget = false;
-    static matches(type, _widget) {
+export class ListItemNode extends Node {
+    static matches(type) {
         const dotIndex = type.indexOf(".");
         if (dotIndex === -1)
             return false;
@@ -140,16 +76,17 @@ export class ListItemNode {
         const suffix = type.slice(dotIndex + 1);
         return suffix === "Item" && LIST_WIDGETS.includes(widgetType);
     }
+    isVirtual() {
+        return true;
+    }
     item;
-    constructor(_type, _widget, props) {
+    constructor(type, props, _currentApp) {
+        super(type, props);
         this.item = props.item;
     }
     getItem() {
         return this.item;
     }
-    appendChild(_child) { }
-    removeChild(_child) { }
-    insertBefore(_child, _before) { }
     attachToParent(parent) {
         if (parent instanceof ListViewNode) {
             parent.addItem(this.item);
@@ -160,6 +97,4 @@ export class ListItemNode {
             parent.removeItem(this.item);
         }
     }
-    updateProps(_oldProps, _newProps) { }
-    mount() { }
 }

package/dist/nodes/overlay.d.ts

@@ -1,29 +1,9 @@
 import type * as Gtk from "@gtkx/ffi/gtk";
-import type { Props } from "../factory.js";
-import type { Node } from "../node.js";
-interface OverlayWidget extends Gtk.Widget {
-    setChild(child: unknown): void;
-    addOverlay(widget: unknown): void;
-    removeOverlay(widget: unknown): void;
-}
-export declare class OverlayNode implements Node<OverlayWidget> {
-    static needsWidget: boolean;
-    static matches(type: string, widget: Gtk.Widget | null): widget is OverlayWidget;
-    private widget;
+import { Node } from "../node.js";
+export declare class OverlayNode extends Node<Gtk.Overlay> {
+    static matches(type: string): boolean;
     private mainChild;
     private overlayChildren;
-    private signalHandlers;
-    constructor(_type: string, widget: Gtk.Widget, _props: Props);
-    getWidget(): OverlayWidget;
-    appendChild(child: Node): void;
-    removeChild(child: Node): void;
-    insertBefore(child: Node, _before: Node): void;
-    attachToParent(parent: Node): void;
-    detachFromParent(parent: Node): void;
     attachChild(childWidget: Gtk.Widget): void;
     detachChild(childWidget: Gtk.Widget): void;
-    updateProps(oldProps: Props, newProps: Props): void;
-    mount(): void;
-    dispose(): void;
 }
-export {};

package/dist/nodes/overlay.js

@@ -1,59 +1,18 @@
-import { appendChild, disconnectSignalHandlers, isConnectable, removeChild } from "../widget-capabilities.js";
-const isOverlayWidget = (widget) => "setChild" in widget &&
-    typeof widget.setChild === "function" &&
-    "addOverlay" in widget &&
-    typeof widget.addOverlay === "function" &&
-    "removeOverlay" in widget &&
-    typeof widget.removeOverlay === "function";
-export class OverlayNode {
-    static needsWidget = true;
-    static matches(type, widget) {
-        if (type !== "Overlay" && type !== "Overlay.Root")
-            return false;
-        return widget !== null && isOverlayWidget(widget);
+import { Node } from "../node.js";
+export class OverlayNode extends Node {
+    static matches(type) {
+        return type === "Overlay" || type === "Overlay.Root";
     }
-    widget;
     mainChild = null;
     overlayChildren = [];
-    signalHandlers = new Map();
-    constructor(_type, widget, _props) {
-        if (!isOverlayWidget(widget)) {
-            throw new Error("OverlayNode requires an Overlay widget");
-        }
-        this.widget = widget;
-    }
-    getWidget() {
-        return this.widget;
-    }
-    appendChild(child) {
-        child.attachToParent(this);
-    }
-    removeChild(child) {
-        child.detachFromParent(this);
-    }
-    insertBefore(child, _before) {
-        this.appendChild(child);
-    }
-    attachToParent(parent) {
-        const parentWidget = parent.getWidget?.();
-        if (parentWidget) {
-            appendChild(parentWidget, this.widget);
-        }
-    }
-    detachFromParent(parent) {
-        const parentWidget = parent.getWidget?.();
-        if (parentWidget) {
-            removeChild(parentWidget, this.widget);
-        }
-    }
     attachChild(childWidget) {
         if (this.mainChild === null) {
             this.mainChild = childWidget;
-            this.widget.setChild(childWidget.ptr);
+            this.widget.setChild(childWidget);
         }
         else {
             this.overlayChildren.push(childWidget);
-            this.widget.addOverlay(childWidget.ptr);
+            this.widget.addOverlay(childWidget);
         }
     }
     detachChild(childWidget) {
@@ -65,45 +24,8 @@ export class OverlayNode {
             const index = this.overlayChildren.indexOf(childWidget);
             if (index !== -1) {
                 this.overlayChildren.splice(index, 1);
-                this.widget.removeOverlay(childWidget.ptr);
+                this.widget.removeOverlay(childWidget);
             }
         }
     }
-    updateProps(oldProps, newProps) {
-        const consumedProps = new Set(["children"]);
-        const allKeys = new Set([...Object.keys(oldProps), ...Object.keys(newProps)]);
-        for (const key of allKeys) {
-            if (consumedProps.has(key))
-                continue;
-            const oldValue = oldProps[key];
-            const newValue = newProps[key];
-            if (oldValue === newValue)
-                continue;
-            if (key.startsWith("on")) {
-                const eventName = key
-                    .slice(2)
-                    .replace(/([A-Z])/g, "-$1")
-                    .toLowerCase()
-                    .replace(/^-/, "");
-                const oldHandlerId = this.signalHandlers.get(eventName);
-                if (oldHandlerId !== undefined && isConnectable(this.widget)) {
-                    this.signalHandlers.delete(eventName);
-                }
-                if (typeof newValue === "function" && isConnectable(this.widget)) {
-                    const handlerId = this.widget.connect(eventName, newValue);
-                    this.signalHandlers.set(eventName, handlerId);
-                }
-                continue;
-            }
-            const setterName = `set${key.charAt(0).toUpperCase()}${key.slice(1)}`;
-            const setter = this.widget[setterName];
-            if (typeof setter === "function") {
-                setter.call(this.widget, newValue);
-            }
-        }
-    }
-    mount() { }
-    dispose() {
-        disconnectSignalHandlers(this.widget, this.signalHandlers);
-    }
 }

package/dist/nodes/slot.d.ts

@@ -1,17 +1,13 @@
-import type * as Gtk from "@gtkx/ffi/gtk";
 import type { Props } from "../factory.js";
-import type { Node } from "../node.js";
-export declare class SlotNode implements Node {
-    static needsWidget: boolean;
-    static matches(type: string, _widget: Gtk.Widget | null): _widget is Gtk.Widget;
+import { Node } from "../node.js";
+export declare class SlotNode extends Node<never> {
+    static matches(type: string): boolean;
+    protected isVirtual(): boolean;
     private child;
     private slotName;
-    constructor(type: string, _widget: Gtk.Widget, _props: Props);
+    constructor(type: string, props: Props, _currentApp?: unknown);
     appendChild(child: Node): void;
     removeChild(_child: Node): void;
-    insertBefore(child: Node, _before: Node): void;
-    updateProps(_oldProps: Props, _newProps: Props): void;
-    mount(): void;
     attachToParent(parent: Node): void;
     detachFromParent(parent: Node): void;
 }

package/dist/nodes/slot.js

@@ -1,17 +1,21 @@
-export class SlotNode {
-    static needsWidget = false;
-    static matches(type, _widget) {
+import { Node } from "../node.js";
+export class SlotNode extends Node {
+    static matches(type) {
         if (!type.includes("."))
             return false;
         const parts = type.split(".");
         if (parts.length !== 2)
             return false;
         const suffix = parts[1];
-        return suffix !== "Item" && suffix !== "Root";
+        return suffix !== "Root";
+    }
+    isVirtual() {
+        return true;
     }
     child = null;
     slotName;
-    constructor(type, _widget, _props) {
+    constructor(type, props, _currentApp) {
+        super(type, props);
         const dotIndex = type.indexOf(".");
         if (dotIndex === -1) {
             throw new Error(`Invalid slot type: ${type}`);
@@ -19,21 +23,16 @@ export class SlotNode {
         this.slotName = type.substring(dotIndex + 1);
     }
     appendChild(child) {
-        if (child.getWidget) {
+        if (child.getWidget()) {
             this.child = child;
         }
     }
     removeChild(_child) {
         this.child = null;
     }
-    insertBefore(child, _before) {
-        this.appendChild(child);
-    }
-    updateProps(_oldProps, _newProps) { }
-    mount() { }
     attachToParent(parent) {
-        const parentWidget = parent.getWidget?.();
-        const childWidget = this.child?.getWidget?.();
+        const parentWidget = parent.getWidget();
+        const childWidget = this.child?.getWidget();
         if (!parentWidget || !childWidget)
             return;
         const setterName = `set${this.slotName}`;
@@ -43,7 +42,7 @@ export class SlotNode {
         }
     }
     detachFromParent(parent) {
-        const parentWidget = parent.getWidget?.();
+        const parentWidget = parent.getWidget();
         if (!parentWidget)
             return;
         const setterName = `set${this.slotName}`;

package/dist/nodes/widget.d.ts

@@ -1,18 +1,11 @@
-import type * as Gtk from "@gtkx/ffi/gtk";
+import * as Gtk from "@gtkx/ffi/gtk";
 import type { Props } from "../factory.js";
-import type { Node } from "../node.js";
-export declare class WidgetNode implements Node {
-    static needsWidget: boolean;
-    static matches(_type: string, widget: Gtk.Widget | null): widget is Gtk.Widget;
-    private widget;
-    private signalHandlers;
-    constructor(_type: string, widget: Gtk.Widget, _props: Props);
-    getWidget(): Gtk.Widget;
-    appendChild(child: Node): void;
-    removeChild(child: Node): void;
-    insertBefore(child: Node, _before: Node): void;
+import { Node } from "../node.js";
+export declare class WidgetNode extends Node<Gtk.Widget> {
+    static matches(_type: string): boolean;
     attachToParent(parent: Node): void;
     detachFromParent(parent: Node): void;
+    protected consumedProps(): Set<string>;
     updateProps(oldProps: Props, newProps: Props): void;
     mount(): void;
     dispose(): void;

package/dist/nodes/widget.js

@@ -1,13 +1,12 @@
-import * as GObject from "@gtkx/ffi/gobject";
-import { appendChild, disconnectSignalHandlers, isConnectable, isDefaultSizable, isPresentable, removeChild, } from "../widget-capabilities.js";
-import { ActionBarNode } from "./action-bar.js";
-import { NotebookNode } from "./notebook.js";
+import * as Gtk from "@gtkx/ffi/gtk";
+import { Node } from "../node.js";
+import { getCurrentApp } from "../reconciler.js";
 import { OverlayNode } from "./overlay.js";
 const COMBINED_PROPS = [
     {
         props: ["defaultWidth", "defaultHeight"],
         apply: (widget) => (values) => {
-            if (isDefaultSizable(widget)) {
+            if (widget instanceof Gtk.Window) {
                 const width = values.defaultWidth ?? -1;
                 const height = values.defaultHeight ?? -1;
                 widget.setDefaultSize(width, height);
@@ -15,122 +14,94 @@ const COMBINED_PROPS = [
         },
     },
 ];
-export class WidgetNode {
-    static needsWidget = true;
-    static matches(_type, widget) {
-        return widget !== null;
-    }
-    widget;
-    signalHandlers = new Map();
-    constructor(_type, widget, _props) {
-        this.widget = widget;
-    }
-    getWidget() {
-        return this.widget;
-    }
-    appendChild(child) {
-        child.attachToParent(this);
-    }
-    removeChild(child) {
-        child.detachFromParent(this);
-    }
-    insertBefore(child, _before) {
-        this.appendChild(child);
+export class WidgetNode extends Node {
+    static matches(_type) {
+        return true;
     }
     attachToParent(parent) {
-        if (parent instanceof NotebookNode) {
-            parent.attachChild(this.widget);
+        if (this.widget instanceof Gtk.AboutDialog) {
             return;
         }
         if (parent instanceof OverlayNode) {
             parent.attachChild(this.widget);
             return;
         }
-        if (parent instanceof ActionBarNode) {
-            parent.attachChild(this.widget);
+        const parentWidget = parent.getWidget();
+        if (!parentWidget)
+            return;
+        if (parentWidget instanceof Gtk.ActionBar) {
+            parentWidget.packStart(this.widget);
             return;
         }
-        const parentWidget = parent.getWidget?.();
-        if (parentWidget) {
-            appendChild(parentWidget, this.widget);
+        if (parentWidget instanceof Gtk.Notebook) {
+            parentWidget.appendPage(this.widget);
+            return;
         }
+        super.attachToParent(parent);
     }
     detachFromParent(parent) {
-        if (parent instanceof NotebookNode) {
-            parent.detachChild(this.widget);
+        if (this.widget instanceof Gtk.AboutDialog) {
             return;
         }
         if (parent instanceof OverlayNode) {
             parent.detachChild(this.widget);
             return;
         }
-        if (parent instanceof ActionBarNode) {
-            parent.detachChild(this.widget);
+        const parentWidget = parent.getWidget();
+        if (!parentWidget)
+            return;
+        if (parentWidget instanceof Gtk.ActionBar) {
+            parentWidget.remove(this.widget);
             return;
         }
-        const parentWidget = parent.getWidget?.();
-        if (parentWidget) {
-            removeChild(parentWidget, this.widget);
+        if (parentWidget instanceof Gtk.Notebook) {
+            const pageNum = parentWidget.pageNum(this.widget);
+            if (pageNum >= 0) {
+                parentWidget.removePage(pageNum);
+            }
+            return;
         }
+        super.detachFromParent(parent);
+    }
+    consumedProps() {
+        const consumed = super.consumedProps();
+        consumed.add("application");
+        for (const handler of COMBINED_PROPS) {
+            for (const prop of handler.props) {
+                consumed.add(prop);
+            }
+        }
+        return consumed;
     }
     updateProps(oldProps, newProps) {
-        const consumedProps = new Set(["children", "application"]);
         for (const handler of COMBINED_PROPS) {
             const hasAnyChanged = handler.props.some((prop) => oldProps[prop] !== newProps[prop]);
             if (hasAnyChanged) {
                 const values = {};
                 for (const prop of handler.props) {
                     values[prop] = newProps[prop];
-                    consumedProps.add(prop);
                 }
                 handler.apply(this.widget)(values);
             }
-            else {
-                for (const prop of handler.props) {
-                    consumedProps.add(prop);
-                }
-            }
-        }
-        const allKeys = new Set([...Object.keys(oldProps), ...Object.keys(newProps)]);
-        for (const key of allKeys) {
-            if (consumedProps.has(key))
-                continue;
-            const oldValue = oldProps[key];
-            const newValue = newProps[key];
-            if (oldValue === newValue)
-                continue;
-            if (key.startsWith("on")) {
-                const eventName = key
-                    .slice(2)
-                    .replace(/([A-Z])/g, "-$1")
-                    .toLowerCase()
-                    .replace(/^-/, "");
-                const oldHandlerId = this.signalHandlers.get(eventName);
-                if (oldHandlerId !== undefined) {
-                    GObject.signalHandlerDisconnect(this.widget, oldHandlerId);
-                    this.signalHandlers.delete(eventName);
-                }
-                if (typeof newValue === "function" && isConnectable(this.widget)) {
-                    const handlerId = this.widget.connect(eventName, newValue);
-                    this.signalHandlers.set(eventName, handlerId);
-                }
-                continue;
-            }
-            if (newValue === undefined)
-                continue;
-            const setterName = `set${key.charAt(0).toUpperCase()}${key.slice(1)}`;
-            const setter = this.widget[setterName];
-            if (typeof setter === "function") {
-                setter.call(this.widget, newValue);
-            }
         }
+        super.updateProps(oldProps, newProps);
     }
     mount() {
-        if (isPresentable(this.widget)) {
+        if (this.widget instanceof Gtk.AboutDialog) {
+            const app = getCurrentApp();
+            const activeWindow = app?.getActiveWindow();
+            if (activeWindow) {
+                this.widget.setTransientFor(activeWindow);
+            }
+        }
+        if (this.widget instanceof Gtk.Window) {
             this.widget.present();
         }
     }
     dispose() {
-        disconnectSignalHandlers(this.widget, this.signalHandlers);
+        super.dispose();
+        if (this.widget instanceof Gtk.Window) {
+            this.widget.close();
+        }
     }
 }

package/dist/portal.d.ts

@@ -1,3 +1,2 @@
 import type { ReactNode, ReactPortal } from "react";
-export declare const isRootPortalContainer: (container: unknown) => boolean;
 export declare const createPortal: (children: ReactNode, container?: unknown, key?: string | null) => ReactPortal;

package/dist/portal.js

@@ -1,5 +1,4 @@
 const ROOT_PORTAL_CONTAINER = Symbol("ROOT_PORTAL_CONTAINER");
-export const isRootPortalContainer = (container) => container === ROOT_PORTAL_CONTAINER;
 export const createPortal = (children, container, key) => {
     return {
         $$typeof: Symbol.for("react.portal"),

package/dist/predicates.d.ts

@@ -0,0 +1,13 @@
+import type * as Gtk from "@gtkx/ffi/gtk";
+export interface Appendable extends Gtk.Widget {
+    append(child: unknown): void;
+}
+export interface SingleChild extends Gtk.Widget {
+    setChild(child: unknown): void;
+}
+export interface Removable extends Gtk.Widget {
+    remove(child: unknown): void;
+}
+export declare const isAppendable: (widget: Gtk.Widget) => widget is Appendable;
+export declare const isSingleChild: (widget: Gtk.Widget) => widget is SingleChild;
+export declare const isRemovable: (widget: Gtk.Widget) => widget is Removable;

package/dist/predicates.js

@@ -0,0 +1,3 @@
+export const isAppendable = (widget) => "append" in widget && typeof widget.append === "function";
+export const isSingleChild = (widget) => "setChild" in widget && typeof widget.setChild === "function";
+export const isRemovable = (widget) => "remove" in widget && typeof widget.remove === "function";