@gtkx/react 0.1.49 → 0.1.51

package/dist/nodes/grid.js

@@ -19,18 +19,18 @@ export class GridChildNode extends Node {
     isVirtual() {
         return true;
     }
-    column;
-    row;
-    columnSpan;
-    rowSpan;
+    column = 0;
+    row = 0;
+    columnSpan = 1;
+    rowSpan = 1;
     childWidget = null;
     parentContainer = null;
-    constructor(type, props) {
-        super(type, props);
+    initialize(props) {
         this.column = getNumberProp(props, "column", 0);
         this.row = getNumberProp(props, "row", 0);
         this.columnSpan = getNumberProp(props, "columnSpan", 1);
         this.rowSpan = getNumberProp(props, "rowSpan", 1);
+        super.initialize(props);
     }
     appendChild(child) {
         const widget = child.getWidget();

package/dist/nodes/list.d.ts

@@ -1,17 +1,25 @@
 import * as Gtk from "@gtkx/ffi/gtk";
+import type Reconciler from "react-reconciler";
 import { type ItemContainer } from "../container-interfaces.js";
 import type { Props } from "../factory.js";
 import { Node } from "../node.js";
-export declare class ListViewNode extends Node<Gtk.ListView | Gtk.GridView> implements ItemContainer<unknown> {
+import type { RenderItemFn } from "../types.js";
+interface ListItemInfo {
+    box: Gtk.Box;
+    fiberRoot: Reconciler.FiberRoot;
+}
+interface ListViewState {
+    stringList: Gtk.StringList;
+    selectionModel: Gtk.SingleSelection;
+    factory: Gtk.SignalListItemFactory;
+    renderItem: RenderItemFn<unknown>;
+    listItemCache: Map<number, ListItemInfo>;
+    items: unknown[];
+    committedLength: number;
+}
+export declare class ListViewNode extends Node<Gtk.ListView | Gtk.GridView, ListViewState> implements ItemContainer<unknown> {
     static matches(type: string): boolean;
-    private stringList;
-    private selectionModel;
-    private factory;
-    private items;
-    private renderItem;
-    private listItemCache;
-    private committedLength;
-    constructor(type: string, props: Props);
+    initialize(props: Props): void;
     private syncStringList;
     addItem(item: unknown): void;
     insertItemBefore(item: unknown, beforeItem: unknown): void;
@@ -23,9 +31,10 @@ export declare class ListItemNode extends Node {
     static matches(type: string): boolean;
     protected isVirtual(): boolean;
     private item;
-    constructor(type: string, props: Props);
+    initialize(props: Props): void;
     getItem(): unknown;
     attachToParent(parent: Node): void;
     attachToParentBefore(parent: Node, before: Node): void;
     detachFromParent(parent: Node): void;
 }
+export {};

package/dist/nodes/list.js

@@ -9,84 +9,89 @@ export class ListViewNode extends Node {
     static matches(type) {
         return type === "ListView.Root" || type === "GridView.Root";
     }
-    stringList;
-    selectionModel;
-    factory;
-    items = [];
-    renderItem;
-    listItemCache = new Map();
-    committedLength = 0;
-    constructor(type, props) {
-        super(type, props);
-        this.stringList = new Gtk.StringList([]);
-        this.selectionModel = new Gtk.SingleSelection(this.stringList);
-        this.factory = new Gtk.SignalListItemFactory();
-        this.renderItem = props.renderItem;
-        this.factory.connect("setup", (_self, listItemObj) => {
+    initialize(props) {
+        // Initialize state before super.initialize() since updateProps accesses this.state
+        this.state = {
+            stringList: null,
+            selectionModel: null,
+            factory: null,
+            renderItem: props.renderItem,
+            listItemCache: new Map(),
+            items: [],
+            committedLength: 0,
+        };
+        super.initialize(props);
+        const stringList = new Gtk.StringList([]);
+        const selectionModel = new Gtk.SingleSelection(stringList);
+        const factory = new Gtk.SignalListItemFactory();
+        this.state.stringList = stringList;
+        this.state.selectionModel = selectionModel;
+        this.state.factory = factory;
+        factory.connect("setup", (_self, listItemObj) => {
             const listItem = getObject(listItemObj.ptr, Gtk.ListItem);
             const id = getObjectId(listItemObj.ptr);
             const box = new Gtk.Box(Gtk.Orientation.VERTICAL, 0);
             listItem.setChild(box);
             const fiberRoot = createFiberRoot(box);
-            this.listItemCache.set(id, { box, fiberRoot });
-            const element = this.renderItem(null);
+            this.state.listItemCache.set(id, { box, fiberRoot });
+            const element = this.state.renderItem(null);
             reconciler.getInstance().updateContainer(element, fiberRoot, null, () => { });
         });
-        this.factory.connect("bind", (_self, listItemObj) => {
+        factory.connect("bind", (_self, listItemObj) => {
             const listItem = getObject(listItemObj.ptr, Gtk.ListItem);
             const id = getObjectId(listItemObj.ptr);
-            const info = this.listItemCache.get(id);
+            const info = this.state.listItemCache.get(id);
             if (!info)
                 return;
             const position = listItem.getPosition();
-            const item = this.items[position];
-            const element = this.renderItem(item);
+            const item = this.state.items[position];
+            const element = this.state.renderItem(item);
             reconciler.getInstance().updateContainer(element, info.fiberRoot, null, () => { });
         });
-        this.factory.connect("unbind", (_self, listItemObj) => {
+        factory.connect("unbind", (_self, listItemObj) => {
             const id = getObjectId(listItemObj.ptr);
-            const info = this.listItemCache.get(id);
+            const info = this.state.listItemCache.get(id);
             if (!info)
                 return;
             reconciler.getInstance().updateContainer(null, info.fiberRoot, null, () => { });
         });
-        this.factory.connect("teardown", (_self, listItemObj) => {
+        factory.connect("teardown", (_self, listItemObj) => {
             const id = getObjectId(listItemObj.ptr);
-            const info = this.listItemCache.get(id);
+            const info = this.state.listItemCache.get(id);
             if (info) {
                 reconciler.getInstance().updateContainer(null, info.fiberRoot, null, () => { });
-                this.listItemCache.delete(id);
+                this.state.listItemCache.delete(id);
             }
         });
-        this.widget.setModel(this.selectionModel);
-        this.widget.setFactory(this.factory);
+        this.widget.setModel(selectionModel);
+        this.widget.setFactory(factory);
     }
     syncStringList = () => {
-        const newLength = this.items.length;
-        if (newLength === this.committedLength)
+        const newLength = this.state.items.length;
+        if (newLength === this.state.committedLength)
             return;
         const placeholders = Array.from({ length: newLength }, () => "");
-        this.stringList.splice(0, this.committedLength, placeholders);
-        this.committedLength = newLength;
+        this.state.stringList.splice(0, this.state.committedLength, placeholders);
+        this.state.committedLength = newLength;
     };
     addItem(item) {
-        this.items.push(item);
+        this.state.items.push(item);
         scheduleFlush(this.syncStringList);
     }
     insertItemBefore(item, beforeItem) {
-        const beforeIndex = this.items.indexOf(beforeItem);
+        const beforeIndex = this.state.items.indexOf(beforeItem);
         if (beforeIndex === -1) {
-            this.items.push(item);
+            this.state.items.push(item);
         }
         else {
-            this.items.splice(beforeIndex, 0, item);
+            this.state.items.splice(beforeIndex, 0, item);
         }
         scheduleFlush(this.syncStringList);
     }
     removeItem(item) {
-        const index = this.items.indexOf(item);
+        const index = this.state.items.indexOf(item);
         if (index !== -1) {
-            this.items.splice(index, 1);
+            this.state.items.splice(index, 1);
             scheduleFlush(this.syncStringList);
         }
     }
@@ -97,7 +102,7 @@ export class ListViewNode extends Node {
     }
     updateProps(oldProps, newProps) {
         if (oldProps.renderItem !== newProps.renderItem) {
-            this.renderItem = newProps.renderItem;
+            this.state.renderItem = newProps.renderItem;
         }
         super.updateProps(oldProps, newProps);
     }
@@ -110,9 +115,9 @@ export class ListItemNode extends Node {
         return true;
     }
     item;
-    constructor(type, props) {
-        super(type, props);
+    initialize(props) {
         this.item = props.item;
+        super.initialize(props);
     }
     getItem() {
         return this.item;

package/dist/nodes/menu.d.ts

@@ -0,0 +1,84 @@
+import * as Gio from "@gtkx/ffi/gio";
+import * as Gtk from "@gtkx/ffi/gtk";
+import type { Props } from "../factory.js";
+import { Node } from "../node.js";
+interface MenuEntry {
+    type: "item" | "section" | "submenu";
+    label?: string;
+    action?: string;
+    menu?: Gio.Menu;
+}
+interface MenuContainer {
+    getMenu(): Gio.Menu;
+    addMenuEntry(entry: MenuEntry): void;
+    removeMenuEntry(entry: MenuEntry): void;
+}
+declare abstract class MenuContainerNode<T extends Gtk.Widget | undefined> extends Node<T> implements MenuContainer {
+    protected menu: Gio.Menu;
+    protected entries: MenuEntry[];
+    private rebuildScheduled;
+    getMenu(): Gio.Menu;
+    addMenuEntry(entry: MenuEntry): void;
+    removeMenuEntry(entry: MenuEntry): void;
+    private scheduleRebuild;
+    protected rebuildMenu(): void;
+    protected onMenuRebuilt(): void;
+}
+export declare class PopoverMenuRootNode extends MenuContainerNode<Gtk.PopoverMenu> {
+    static matches(type: string): boolean;
+    initialize(props: Props): void;
+    protected onMenuRebuilt(): void;
+}
+export declare class PopoverMenuBarNode extends MenuContainerNode<Gtk.PopoverMenuBar> {
+    static matches(type: string): boolean;
+    initialize(props: Props): void;
+    protected onMenuRebuilt(): void;
+}
+export declare class ApplicationMenuNode extends MenuContainerNode<never> {
+    static matches(type: string): boolean;
+    protected isVirtual(): boolean;
+    detachFromParent(_parent: Node): void;
+    attachToParent(parent: Node): void;
+    mount(): void;
+    protected onMenuRebuilt(): void;
+}
+export declare class MenuItemNode extends Node<never> {
+    static matches(type: string): boolean;
+    protected isVirtual(): boolean;
+    private entry;
+    private action;
+    private actionName;
+    private signalHandlerId;
+    private onActivateCallback;
+    private currentAccels;
+    private isAttached;
+    initialize(props: Props): void;
+    attachToParent(parent: Node): void;
+    detachFromParent(parent: Node): void;
+    protected consumedProps(): Set<string>;
+    updateProps(oldProps: Props, newProps: Props): void;
+    private setupAction;
+    private cleanupAction;
+    private updateAccels;
+}
+export declare class MenuSectionNode extends MenuContainerNode<never> {
+    static matches(type: string): boolean;
+    protected isVirtual(): boolean;
+    private entry;
+    initialize(props: Props): void;
+    attachToParent(parent: Node): void;
+    detachFromParent(parent: Node): void;
+    protected consumedProps(): Set<string>;
+    updateProps(oldProps: Props, newProps: Props): void;
+}
+export declare class MenuSubmenuNode extends MenuContainerNode<never> {
+    static matches(type: string): boolean;
+    protected isVirtual(): boolean;
+    private entry;
+    initialize(props: Props): void;
+    attachToParent(parent: Node): void;
+    detachFromParent(parent: Node): void;
+    protected consumedProps(): Set<string>;
+    updateProps(oldProps: Props, newProps: Props): void;
+}
+export {};

package/dist/nodes/menu.js

@@ -0,0 +1,279 @@
+import { getCurrentApp } from "@gtkx/ffi";
+import * as Gio from "@gtkx/ffi/gio";
+import * as GObject from "@gtkx/ffi/gobject";
+import * as Gtk from "@gtkx/ffi/gtk";
+import { Node } from "../node.js";
+import { RootNode } from "./root.js";
+let actionCounter = 0;
+const generateActionName = () => `gtkx_menu_action_${actionCounter++}`;
+const isMenuContainer = (node) => "getMenu" in node && "addMenuEntry" in node && "removeMenuEntry" in node;
+class MenuContainerNode extends Node {
+    menu = new Gio.Menu();
+    entries = [];
+    rebuildScheduled = false;
+    getMenu() {
+        return this.menu;
+    }
+    addMenuEntry(entry) {
+        this.entries.push(entry);
+        this.scheduleRebuild();
+    }
+    removeMenuEntry(entry) {
+        const index = this.entries.indexOf(entry);
+        if (index !== -1) {
+            this.entries.splice(index, 1);
+            this.scheduleRebuild();
+        }
+    }
+    scheduleRebuild() {
+        if (this.rebuildScheduled)
+            return;
+        this.rebuildScheduled = true;
+        queueMicrotask(() => {
+            this.rebuildScheduled = false;
+            this.rebuildMenu();
+        });
+    }
+    rebuildMenu() {
+        this.menu.removeAll();
+        for (const entry of this.entries) {
+            if (entry.type === "item") {
+                this.menu.append(entry.label ?? null, entry.action ?? null);
+            }
+            else if (entry.type === "section" && entry.menu) {
+                this.menu.appendSection(entry.menu, entry.label ?? null);
+            }
+            else if (entry.type === "submenu" && entry.menu) {
+                this.menu.appendSubmenu(entry.menu, entry.label ?? null);
+            }
+        }
+        this.onMenuRebuilt();
+    }
+    onMenuRebuilt() { }
+}
+export class PopoverMenuRootNode extends MenuContainerNode {
+    static matches(type) {
+        return type === "PopoverMenu.Root";
+    }
+    initialize(props) {
+        this.widget = new Gtk.PopoverMenu(this.menu);
+        super.initialize(props);
+    }
+    onMenuRebuilt() {
+        this.widget.setMenuModel(this.menu);
+    }
+}
+export class PopoverMenuBarNode extends MenuContainerNode {
+    static matches(type) {
+        return type === "PopoverMenuBar";
+    }
+    initialize(props) {
+        this.widget = new Gtk.PopoverMenuBar(this.menu);
+        super.initialize(props);
+    }
+    onMenuRebuilt() {
+        this.widget.setMenuModel(this.menu);
+    }
+}
+export class ApplicationMenuNode extends MenuContainerNode {
+    static matches(type) {
+        return type === "ApplicationMenu";
+    }
+    isVirtual() {
+        return true;
+    }
+    detachFromParent(_parent) {
+        getCurrentApp().setMenubar(null);
+    }
+    attachToParent(parent) {
+        if (!(parent instanceof RootNode)) {
+            throw new Error("ApplicationMenu must be a direct child of a fragment at the root level");
+        }
+    }
+    mount() {
+        getCurrentApp().setMenubar(this.menu);
+    }
+    onMenuRebuilt() {
+        getCurrentApp().setMenubar(this.menu);
+    }
+}
+export class MenuItemNode extends Node {
+    static matches(type) {
+        return type === "Menu.Item";
+    }
+    isVirtual() {
+        return true;
+    }
+    entry = { type: "item" };
+    action = null;
+    actionName = null;
+    signalHandlerId = null;
+    onActivateCallback;
+    currentAccels;
+    isAttached = false;
+    initialize(props) {
+        this.onActivateCallback = props.onActivate;
+        this.currentAccels = props.accels;
+        this.entry.label = props.label;
+        super.initialize(props);
+    }
+    attachToParent(parent) {
+        if (!isMenuContainer(parent))
+            return;
+        this.isAttached = true;
+        this.setupAction();
+        parent.addMenuEntry(this.entry);
+    }
+    detachFromParent(parent) {
+        if (!isMenuContainer(parent))
+            return;
+        parent.removeMenuEntry(this.entry);
+        this.cleanupAction();
+        this.isAttached = false;
+    }
+    consumedProps() {
+        const consumed = super.consumedProps();
+        consumed.add("label");
+        consumed.add("onActivate");
+        consumed.add("accels");
+        return consumed;
+    }
+    updateProps(oldProps, newProps) {
+        // If entry doesn't exist yet, fields aren't initialized
+        // This happens when base class constructor calls updateProps
+        // before derived class field initializers run - skip in that case
+        if (!this.entry) {
+            super.updateProps(oldProps, newProps);
+            return;
+        }
+        const labelChanged = oldProps.label !== newProps.label;
+        const hadCallback = oldProps.onActivate !== undefined;
+        const hasCallback = newProps.onActivate !== undefined;
+        const accelsChanged = oldProps.accels !== newProps.accels;
+        // Always update the callback reference - the signal handler uses this
+        this.onActivateCallback = newProps.onActivate;
+        this.currentAccels = newProps.accels;
+        if (labelChanged) {
+            this.entry.label = newProps.label;
+        }
+        // Only cleanup/setup action if the presence of a callback changed
+        // (not when the callback reference changes - we store the ref and call it)
+        if (this.isAttached && hadCallback !== hasCallback) {
+            this.cleanupAction();
+            this.setupAction();
+        }
+        if (accelsChanged && this.actionName) {
+            this.updateAccels(this.currentAccels);
+        }
+        super.updateProps(oldProps, newProps);
+    }
+    setupAction() {
+        if (!this.onActivateCallback)
+            return;
+        this.actionName = generateActionName();
+        this.action = new Gio.SimpleAction(this.actionName);
+        this.signalHandlerId = this.action.connect("activate", () => {
+            // Call the current callback (may have been updated via updateProps)
+            this.onActivateCallback?.();
+        });
+        const app = getCurrentApp();
+        app.addAction(this.action);
+        this.entry.action = `app.${this.actionName}`;
+        if (this.currentAccels) {
+            this.updateAccels(this.currentAccels);
+        }
+    }
+    cleanupAction() {
+        if (this.actionName) {
+            const app = getCurrentApp();
+            app.removeAction(this.actionName);
+            if (this.currentAccels) {
+                app.setAccelsForAction(`app.${this.actionName}`, []);
+            }
+        }
+        if (this.action && this.signalHandlerId !== null) {
+            GObject.signalHandlerDisconnect(this.action, this.signalHandlerId);
+        }
+        this.action = null;
+        this.actionName = null;
+        this.signalHandlerId = null;
+        this.entry.action = undefined;
+    }
+    updateAccels(accels) {
+        if (!this.actionName)
+            return;
+        const app = getCurrentApp();
+        const accelArray = accels ? (Array.isArray(accels) ? accels : [accels]) : [];
+        app.setAccelsForAction(`app.${this.actionName}`, accelArray);
+    }
+}
+export class MenuSectionNode extends MenuContainerNode {
+    static matches(type) {
+        return type === "Menu.Section";
+    }
+    isVirtual() {
+        return true;
+    }
+    entry = { type: "section" };
+    initialize(props) {
+        this.entry.menu = this.menu;
+        this.entry.label = props.label;
+        super.initialize(props);
+    }
+    attachToParent(parent) {
+        if (!isMenuContainer(parent))
+            return;
+        parent.addMenuEntry(this.entry);
+    }
+    detachFromParent(parent) {
+        if (!isMenuContainer(parent))
+            return;
+        parent.removeMenuEntry(this.entry);
+    }
+    consumedProps() {
+        const consumed = super.consumedProps();
+        consumed.add("label");
+        return consumed;
+    }
+    updateProps(oldProps, newProps) {
+        if (oldProps.label !== newProps.label && this.entry) {
+            this.entry.label = newProps.label;
+        }
+        super.updateProps(oldProps, newProps);
+    }
+}
+export class MenuSubmenuNode extends MenuContainerNode {
+    static matches(type) {
+        return type === "Menu.Submenu";
+    }
+    isVirtual() {
+        return true;
+    }
+    entry = { type: "submenu" };
+    initialize(props) {
+        this.entry.menu = this.menu;
+        this.entry.label = props.label;
+        super.initialize(props);
+    }
+    attachToParent(parent) {
+        if (!isMenuContainer(parent))
+            return;
+        parent.addMenuEntry(this.entry);
+    }
+    detachFromParent(parent) {
+        if (!isMenuContainer(parent))
+            return;
+        parent.removeMenuEntry(this.entry);
+    }
+    consumedProps() {
+        const consumed = super.consumedProps();
+        consumed.add("label");
+        return consumed;
+    }
+    updateProps(oldProps, newProps) {
+        if (oldProps.label !== newProps.label && this.entry) {
+            this.entry.label = newProps.label;
+        }
+        super.updateProps(oldProps, newProps);
+    }
+}

package/dist/nodes/notebook.d.ts

@@ -18,7 +18,7 @@ export declare class NotebookPageNode extends Node {
     private label;
     private childWidget;
     private parentContainer;
-    constructor(type: string, props: Props);
+    initialize(props: Props): void;
     getLabel(): string;
     setChildWidget(widget: Gtk.Widget): void;
     getChildWidget(): Gtk.Widget | null;

package/dist/nodes/notebook.js

@@ -56,12 +56,12 @@ export class NotebookPageNode extends Node {
     isVirtual() {
         return true;
     }
-    label;
+    label = "";
     childWidget = null;
     parentContainer = null;
-    constructor(type, props) {
-        super(type, props);
+    initialize(props) {
         this.label = getStringProp(props, "label", "");
+        super.initialize(props);
     }
     getLabel() {
         return this.label;

package/dist/nodes/root.js

@@ -8,6 +8,6 @@ export class RootNode extends Node {
         return true;
     }
     constructor() {
-        super("", {});
+        super("");
     }
 }

package/dist/nodes/slot.d.ts

@@ -1,4 +1,3 @@
-import type { Props } from "../factory.js";
 import { Node } from "../node.js";
 export declare class SlotNode extends Node<never> {
     static matches(type: string): boolean;
@@ -6,7 +5,7 @@ export declare class SlotNode extends Node<never> {
     private child;
     private slotName;
     private parentNode;
-    constructor(type: string, props: Props);
+    constructor(type: string);
     private updateParentSlot;
     appendChild(child: Node): void;
     removeChild(_child: Node): void;

package/dist/nodes/slot.js

@@ -15,8 +15,8 @@ export class SlotNode extends Node {
     child = null;
     slotName;
     parentNode = null;
-    constructor(type, props) {
-        super(type, props);
+    constructor(type) {
+        super(type);
         const dotIndex = type.indexOf(".");
         if (dotIndex === -1) {
             throw new Error(`Invalid slot type: ${type}`);

package/dist/nodes/stack.d.ts

@@ -0,0 +1,35 @@
+import type * as Gtk from "@gtkx/ffi/gtk";
+import { type ChildContainer, type StackPageContainer, type StackPageProps } from "../container-interfaces.js";
+import type { Props } from "../factory.js";
+import { Node } from "../node.js";
+export declare class StackNode extends Node<Gtk.Stack> implements StackPageContainer, ChildContainer {
+    static matches(type: string): boolean;
+    private pendingVisibleChildName;
+    addStackPage(child: Gtk.Widget, props: StackPageProps): void;
+    private applyPendingVisibleChild;
+    insertStackPageBefore(child: Gtk.Widget, props: StackPageProps, _beforeChild: Gtk.Widget): void;
+    removeStackPage(child: Gtk.Widget): void;
+    updateStackPageProps(child: Gtk.Widget, props: StackPageProps): void;
+    private applyStackPageProps;
+    attachChild(child: Gtk.Widget): void;
+    insertChildBefore(child: Gtk.Widget, _before: Gtk.Widget): void;
+    detachChild(child: Gtk.Widget): void;
+    protected consumedProps(): Set<string>;
+    updateProps(oldProps: Props, newProps: Props): void;
+}
+export declare class StackPageNode extends Node {
+    static matches(type: string): boolean;
+    protected isVirtual(): boolean;
+    private pageProps;
+    private childWidget;
+    private parentContainer;
+    initialize(props: Props): void;
+    private extractPageProps;
+    getChildWidget(): Gtk.Widget | null;
+    appendChild(child: Node): void;
+    attachToParent(parent: Node): void;
+    attachToParentBefore(parent: Node, before: Node): void;
+    detachFromParent(parent: Node): void;
+    protected consumedProps(): Set<string>;
+    updateProps(oldProps: Props, newProps: Props): void;
+}