@gtkx/react 0.1.17 → 0.1.19

package/dist/generated/jsx.js

@@ -1,3 +1,4 @@
+import "react";
 export const CONSTRUCTOR_PARAMS = {
     AppChooserButton: [{ name: "contentType", hasDefault: false }],
     AppChooserDialog: [

package/dist/index.d.ts

@@ -1,5 +1,6 @@
 export { createRef } from "@gtkx/ffi";
 export * from "./generated/jsx.js";
 export { createPortal } from "./portal.js";
+export { reconciler } from "./reconciler.js";
 export { render } from "./render.js";
 export declare const quit: () => boolean;

package/dist/index.js

@@ -1,12 +1,13 @@
 export { createRef } from "@gtkx/ffi";
 export * from "./generated/jsx.js";
 export { createPortal } from "./portal.js";
+export { reconciler } from "./reconciler.js";
 export { render } from "./render.js";
 import { stop } from "@gtkx/ffi";
 import { reconciler } from "./reconciler.js";
 import { container } from "./render.js";
 export const quit = () => {
-    reconciler.updateContainer(null, container, null, () => {
+    reconciler.getInstance().updateContainer(null, container, null, () => {
         stop();
     });
     return true;

package/dist/node.d.ts

@@ -5,8 +5,8 @@ export declare abstract class Node<T extends Gtk.Widget | undefined = Gtk.Widget
     protected signalHandlers: Map<string, number>;
     protected widget: T;
     protected isVirtual(): boolean;
-    constructor(type: string, props: Props, currentApp?: unknown);
-    protected createWidget(type: string, props: Props, currentApp?: unknown): T;
+    constructor(type: string, props: Props, app: Gtk.Application);
+    protected createWidget(type: string, props: Props, app: Gtk.Application): T;
     getWidget(): T;
     appendChild(child: Node): void;
     removeChild(child: Node): void;
@@ -18,6 +18,6 @@ export declare abstract class Node<T extends Gtk.Widget | undefined = Gtk.Widget
     protected setSignalProperty(widget: Gtk.Widget, key: string, handler: unknown): void;
     protected setSignalHandler(widget: Gtk.Widget, eventName: string, handler: (...args: unknown[]) => unknown): void;
     protected setProperty(widget: Gtk.Widget, key: string, value: unknown): void;
-    mount(): void;
-    dispose(): void;
+    mount(_app: Gtk.Application): void;
+    dispose(_app: Gtk.Application): void;
 }

package/dist/node.js

@@ -8,7 +8,6 @@ const extractConstructorArgs = (type, props) => {
         return [];
     return params.map((p) => props[p.name]);
 };
-const normalizeType = (type) => (type.endsWith(".Root") ? type.slice(0, -5) : type);
 export class Node {
     static matches(_type) {
         return false;
@@ -18,21 +17,20 @@ export class Node {
     isVirtual() {
         return false;
     }
-    constructor(type, props, currentApp) {
-        this.widget = (this.isVirtual() ? undefined : this.createWidget(type, props, currentApp));
+    constructor(type, props, app) {
+        this.widget = (this.isVirtual() ? undefined : this.createWidget(type, props, app));
         this.updateProps({}, props);
     }
-    createWidget(type, props, currentApp) {
-        const normalizedType = normalizeType(type);
+    createWidget(type, props, app) {
+        const normalizedType = type.split(".")[0] || type;
         const WidgetClass = Gtk[normalizedType];
-        if (!WidgetClass || typeof WidgetClass !== "function") {
+        if (!WidgetClass) {
             throw new Error(`Unknown GTK widget type: ${normalizedType}`);
         }
         if (normalizedType === "ApplicationWindow") {
-            return new WidgetClass(currentApp);
+            return new WidgetClass(app);
         }
-        const args = extractConstructorArgs(normalizedType, props);
-        return new WidgetClass(...args);
+        return new WidgetClass(...extractConstructorArgs(normalizedType, props));
     }
     getWidget() {
         return this.widget;
@@ -121,6 +119,6 @@ export class Node {
             setter.call(widget, value);
         }
     }
-    mount() { }
-    dispose() { }
+    mount(_app) { }
+    dispose(_app) { }
 }

package/dist/nodes/dropdown.d.ts

@@ -17,7 +17,7 @@ export declare class DropDownNode extends Node<Gtk.DropDown> {
     static matches(type: string): boolean;
     private store;
     private onSelectionChanged?;
-    constructor(type: string, props: Props, currentApp?: unknown);
+    constructor(type: string, props: Props, app: Gtk.Application);
     getStore(): DropDownStore;
     protected consumedProps(): Set<string>;
     updateProps(oldProps: Props, newProps: Props): void;
@@ -26,7 +26,7 @@ export declare class DropDownItemNode extends Node<never> {
     static matches(type: string): boolean;
     protected isVirtual(): boolean;
     private item;
-    constructor(type: string, props: Props, _currentApp?: unknown);
+    constructor(type: string, props: Props, app: Gtk.Application);
     getItem(): unknown;
     attachToParent(parent: Node): void;
     detachFromParent(parent: Node): void;

package/dist/nodes/dropdown.js

@@ -36,8 +36,8 @@ export class DropDownNode extends Node {
     }
     store;
     onSelectionChanged;
-    constructor(type, props, currentApp) {
-        super(type, props, currentApp);
+    constructor(type, props, app) {
+        super(type, props, app);
         const labelFn = props.itemLabel ?? ((item) => String(item));
         this.onSelectionChanged = props.onSelectionChanged;
         this.store = new DropDownStore(labelFn);
@@ -75,8 +75,8 @@ export class DropDownItemNode extends Node {
         return true;
     }
     item;
-    constructor(type, props, _currentApp) {
-        super(type, props);
+    constructor(type, props, app) {
+        super(type, props, app);
         this.item = props.item;
     }
     getItem() {

package/dist/nodes/grid.d.ts

@@ -13,7 +13,7 @@ export declare class GridChildNode extends Node<never> {
     private rowSpan;
     private childWidget;
     private parentGrid;
-    constructor(type: string, props: Props, _currentApp?: unknown);
+    constructor(type: string, props: Props, app: Gtk.Application);
     appendChild(child: Node): void;
     removeChild(child: Node): void;
     private attachChildToGrid;

package/dist/nodes/grid.js

@@ -17,8 +17,8 @@ export class GridChildNode extends Node {
     rowSpan;
     childWidget = null;
     parentGrid = null;
-    constructor(type, props, _currentApp) {
-        super(type, props);
+    constructor(type, props, app) {
+        super(type, props, app);
         this.column = props.column ?? 0;
         this.row = props.row ?? 0;
         this.columnSpan = props.columnSpan ?? 1;

package/dist/nodes/list.d.ts

@@ -9,18 +9,18 @@ export declare class ListViewNode extends Node<Gtk.ListView> {
     private items;
     private renderItem;
     private factorySignalHandlers;
-    constructor(type: string, props: Props, currentApp?: unknown);
+    constructor(type: string, props: Props, app: Gtk.Application);
     addItem(item: unknown): void;
     removeItem(item: unknown): void;
     protected consumedProps(): Set<string>;
     updateProps(oldProps: Props, newProps: Props): void;
-    dispose(): void;
+    dispose(app: Gtk.Application): void;
 }
 export declare class ListItemNode extends Node {
     static matches(type: string): boolean;
     protected isVirtual(): boolean;
     private item;
-    constructor(type: string, props: Props, _currentApp?: unknown);
+    constructor(type: string, props: Props, app: Gtk.Application);
     getItem(): unknown;
     attachToParent(parent: Node): void;
     detachFromParent(parent: Node): void;

package/dist/nodes/list.js

@@ -12,8 +12,8 @@ export class ListViewNode extends Node {
     items = [];
     renderItem = null;
     factorySignalHandlers = new Map();
-    constructor(type, props, currentApp) {
-        super(type, props, currentApp);
+    constructor(type, props, app) {
+        super(type, props, app);
         this.stringList = new Gtk.StringList([]);
         this.selectionModel = new Gtk.SingleSelection(this.stringList);
         this.factory = new Gtk.SignalListItemFactory();
@@ -61,8 +61,8 @@ export class ListViewNode extends Node {
         }
         super.updateProps(oldProps, newProps);
     }
-    dispose() {
-        super.dispose();
+    dispose(app) {
+        super.dispose(app);
         this.widget.setModel(undefined);
         this.widget.setFactory(undefined);
     }
@@ -80,8 +80,8 @@ export class ListItemNode extends Node {
         return true;
     }
     item;
-    constructor(type, props, _currentApp) {
-        super(type, props);
+    constructor(type, props, app) {
+        super(type, props, app);
         this.item = props.item;
     }
     getItem() {

package/dist/nodes/slot.d.ts

@@ -1,3 +1,4 @@
+import type * as Gtk from "@gtkx/ffi/gtk";
 import type { Props } from "../factory.js";
 import { Node } from "../node.js";
 export declare class SlotNode extends Node<never> {
@@ -5,7 +6,7 @@ export declare class SlotNode extends Node<never> {
     protected isVirtual(): boolean;
     private child;
     private slotName;
-    constructor(type: string, props: Props, _currentApp?: unknown);
+    constructor(type: string, props: Props, app: Gtk.Application);
     appendChild(child: Node): void;
     removeChild(_child: Node): void;
     attachToParent(parent: Node): void;

package/dist/nodes/slot.js

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

package/dist/nodes/widget.d.ts

@@ -2,7 +2,7 @@ import * as Gtk from "@gtkx/ffi/gtk";
 import type { Props } from "../factory.js";
 import { Node } from "../node.js";
 export declare class WidgetWrapper extends Node<Gtk.Widget> {
-    constructor(widget: Gtk.Widget);
+    constructor(widget: Gtk.Widget, app: Gtk.Application);
     protected isVirtual(): boolean;
 }
 export declare class WidgetNode extends Node<Gtk.Widget> {
@@ -11,6 +11,6 @@ export declare class WidgetNode extends Node<Gtk.Widget> {
     detachFromParent(parent: Node): void;
     protected consumedProps(): Set<string>;
     updateProps(oldProps: Props, newProps: Props): void;
-    mount(): void;
-    dispose(): void;
+    mount(app: Gtk.Application): void;
+    dispose(app: Gtk.Application): void;
 }

package/dist/nodes/widget.js

@@ -1,6 +1,5 @@
 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 = [
     {
@@ -15,8 +14,8 @@ const COMBINED_PROPS = [
     },
 ];
 export class WidgetWrapper extends Node {
-    constructor(widget) {
-        super("", {});
+    constructor(widget, app) {
+        super("", {}, app);
         this.widget = widget;
     }
     isVirtual() {
@@ -95,10 +94,9 @@ export class WidgetNode extends Node {
         }
         super.updateProps(oldProps, newProps);
     }
-    mount() {
+    mount(app) {
         if (this.widget instanceof Gtk.AboutDialog) {
-            const app = getCurrentApp();
-            const activeWindow = app?.getActiveWindow();
+            const activeWindow = app.getActiveWindow();
             if (activeWindow) {
                 this.widget.setTransientFor(activeWindow);
             }
@@ -107,8 +105,8 @@ export class WidgetNode extends Node {
             this.widget.present();
         }
     }
-    dispose() {
-        super.dispose();
+    dispose(app) {
+        super.dispose(app);
         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 ROOT_CONTAINER: unique symbol;
 export declare const createPortal: (children: ReactNode, container?: unknown, key?: string | null) => ReactPortal;

package/dist/portal.js

@@ -1,10 +1,10 @@
-export const ROOT_CONTAINER = Symbol("ROOT_CONTAINER");
+import * as Gtk from "@gtkx/ffi/gtk";
 export const createPortal = (children, container, key) => {
     return {
         $$typeof: Symbol.for("react.portal"),
         key: key ?? null,
         children,
-        containerInfo: container ?? ROOT_CONTAINER,
+        containerInfo: container ?? Gtk.Application.getDefault(),
         implementation: null,
     };
 };

package/dist/reconciler.d.ts

@@ -1,21 +1,22 @@
-import type * as Gtk from "@gtkx/ffi/gtk";
 import type { Application } from "@gtkx/ffi/gtk";
-import Reconciler from "react-reconciler";
+import * as Gtk from "@gtkx/ffi/gtk";
+import ReactReconciler from "react-reconciler";
 import type { Node } from "./node.js";
-import { ROOT_CONTAINER } from "./portal.js";
-type Container = Gtk.Widget | typeof ROOT_CONTAINER;
+type Container = Gtk.Application | Gtk.Widget;
 type TextInstance = Node;
-export declare class GtkReconciler {
-    private reconciler;
-    private currentApp;
+type SuspenseInstance = never;
+type PublicInstance = Gtk.Widget;
+type FormInstance = never;
+type ReconcilerInstance = ReactReconciler.Reconciler<Container, Node, TextInstance, SuspenseInstance, FormInstance, PublicInstance>;
+export declare class Reconciler {
+    private instance;
+    private app;
     constructor();
-    setCurrentApp(app: Application): void;
-    getCurrentApp(): Application | null;
-    getReconciler(): typeof this.reconciler;
+    getApp(): Application;
+    setApp(app: Application): void;
+    getInstance(): ReconcilerInstance;
     private createHostConfig;
     private createReconcilerContext;
 }
-export declare const reconciler: Reconciler.Reconciler<Container, Node<Gtk.Widget | undefined>, TextInstance, never, never, Gtk.Widget>;
-export declare const setCurrentApp: (app: Application) => void;
-export declare const getCurrentApp: () => Application | null;
+export declare const reconciler: Reconciler;
 export {};

package/dist/reconciler.js

@@ -1,22 +1,25 @@
+import * as Gtk from "@gtkx/ffi/gtk";
 import React from "react";
-import Reconciler from "react-reconciler";
+import ReactReconciler from "react-reconciler";
 import { createNode } from "./factory.js";
 import { WidgetWrapper } from "./nodes/widget.js";
-import { ROOT_CONTAINER } from "./portal.js";
-export class GtkReconciler {
-    reconciler;
-    currentApp = null;
+export class Reconciler {
+    instance;
+    app = null;
     constructor() {
-        this.reconciler = Reconciler(this.createHostConfig());
+        this.instance = ReactReconciler(this.createHostConfig());
     }
-    setCurrentApp(app) {
-        this.currentApp = app;
+    getApp() {
+        if (!this.app) {
+            throw new Error("Tried to get GTK Application before it was set.");
+        }
+        return this.app;
     }
-    getCurrentApp() {
-        return this.currentApp;
+    setApp(app) {
+        this.app = app;
     }
-    getReconciler() {
-        return this.reconciler;
+    getInstance() {
+        return this.instance;
     }
     createHostConfig() {
         return {
@@ -28,30 +31,33 @@ export class GtkReconciler {
             getRootHostContext: () => ({}),
             getChildHostContext: (parentHostContext) => parentHostContext,
             shouldSetTextContent: () => false,
-            createInstance: (type, props) => createNode(type, props, this.currentApp),
-            createTextInstance: (text) => createNode("Label.Root", { label: text }, this.currentApp),
+            createInstance: (type, props) => createNode(type, props, this.getApp()),
+            createTextInstance: (text) => createNode("Label.Root", { label: text }, this.getApp()),
             appendInitialChild: (parent, child) => parent.appendChild(child),
             finalizeInitialChildren: () => true,
             commitUpdate: (instance, _type, oldProps, newProps) => {
                 instance.updateProps(oldProps, newProps);
             },
             commitMount: (instance) => {
-                instance.mount();
+                instance.mount(this.getApp());
             },
             appendChild: (parent, child) => parent.appendChild(child),
             removeChild: (parent, child) => parent.removeChild(child),
             insertBefore: (parent, child, beforeChild) => parent.insertBefore(child, beforeChild),
             removeChildFromContainer: (container, child) => {
-                if (container !== ROOT_CONTAINER)
-                    child.detachFromParent(new WidgetWrapper(container));
+                if (container instanceof Gtk.Widget) {
+                    child.detachFromParent(new WidgetWrapper(container, this.getApp()));
+                }
             },
             appendChildToContainer: (container, child) => {
-                if (container !== ROOT_CONTAINER)
-                    child.attachToParent(new WidgetWrapper(container));
+                if (container instanceof Gtk.Widget) {
+                    child.attachToParent(new WidgetWrapper(container, this.getApp()));
+                }
             },
             insertInContainerBefore: (container, child, _beforeChild) => {
-                if (container !== ROOT_CONTAINER)
-                    child.attachToParent(new WidgetWrapper(container));
+                if (container instanceof Gtk.Widget) {
+                    child.attachToParent(new WidgetWrapper(container, this.getApp()));
+                }
             },
             prepareForCommit: () => null,
             resetAfterCommit: () => { },
@@ -79,7 +85,7 @@ export class GtkReconciler {
             prepareScopeUpdate: () => { },
             getInstanceFromScope: () => null,
             detachDeletedInstance: (instance) => {
-                instance.dispose();
+                instance.dispose(this.getApp());
             },
             resetFormInstance: () => { },
             requestPostPaintCallback: () => { },
@@ -99,7 +105,4 @@ export class GtkReconciler {
         return context;
     }
 }
-const gtkReconciler = new GtkReconciler();
-export const reconciler = gtkReconciler.getReconciler();
-export const setCurrentApp = (app) => gtkReconciler.setCurrentApp(app);
-export const getCurrentApp = () => gtkReconciler.getCurrentApp();
+export const reconciler = new Reconciler();

package/dist/render.js

@@ -1,13 +1,13 @@
 import { start } from "@gtkx/ffi";
-import { ROOT_CONTAINER } from "./portal.js";
-import { reconciler, setCurrentApp } from "./reconciler.js";
+import { reconciler } from "./reconciler.js";
 export let container = null;
 export const render = (element, appId, flags) => {
     const app = start(appId, flags);
-    setCurrentApp(app);
-    container = reconciler.createContainer(ROOT_CONTAINER, 0, null, false, false, "", (error, info) => {
-        console.error("React reconciler error:", error, info);
-    }, null, null, null, null);
-    reconciler.updateContainer(element, container, null, () => { });
+    const instance = reconciler.getInstance();
+    reconciler.setApp(app);
+    container = instance.createContainer(app, 0, null, false, null, "", (error, info) => {
+        console.error("Uncaught error in GTKX application:", error, info);
+    }, (_error, _info) => { }, (_error, _info) => { }, () => { }, null);
+    instance.updateContainer(element, container, null, () => { });
     return app;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gtkx/react",
-  "version": "0.1.17",
+  "version": "0.1.19",
   "description": "Build GTK4 desktop applications with React and TypeScript",
   "keywords": [
     "gtk",
@@ -28,7 +28,10 @@
     "./package.json": "./package.json",
     ".": {
       "types": "./dist/index.d.ts",
-      "development": "./src/index.ts",
+      "development": {
+        "types": "./src/index.ts",
+        "default": "./src/index.ts"
+      },
       "default": "./dist/index.js"
     }
   },
@@ -37,13 +40,13 @@
   ],
   "dependencies": {
     "react-reconciler": "0.33.0",
-    "@gtkx/ffi": "0.1.17"
+    "@gtkx/ffi": "0.1.19"
   },
   "devDependencies": {
-    "@gtkx/gir": "0.1.17"
+    "@gtkx/gir": "0.1.19"
   },
   "peerDependencies": {
-    "react": "19"
+    "react": "^19"
   },
   "scripts": {
     "build": "tsc -b",