@peachy/react 0.0.8 → 0.0.10

package/dist/extra.d.mts

@@ -1,11 +1,6 @@
-import Gtk from "gi://Gtk?version=4.0";
+import { PeachyExtraMethods } from "./types.mjs";
 
 //#region src/extra.d.ts
-interface ReactionExtraProps<T extends Gtk.Widget> {
-  appendChild?(parentInstance: T, child: Gtk.Widget): void;
-  insertBefore?(parentInstance: T, child: Gtk.Widget, before: Gtk.Widget | null): void;
-  removeChild?(parentInstance: T, child: Gtk.Widget): void;
-}
-declare const extraMap: Map<GObject.GType, ReactionExtraProps<Gtk.Widget>>;
+declare const extraMap: Map<GObject.GType, PeachyExtraMethods<Gtk.Widget, {}>>;
 //#endregion
-export { ReactionExtraProps, extraMap };
+export { extraMap };

package/dist/extra.mjs

@@ -2,6 +2,18 @@ import { getMetadata } from "./utilities/metadata.mjs";
 import Gtk from "gi://Gtk?version=4.0";
 
 //#region src/extra.ts
+/**
+* GTK has some limitations, so here we try to solve some of them
+*
+* For example, it's not that clear how to add children to an element, every Widget
+* has it's own API, here we map each Object (or an Interface) on how to something
+* for example:
+*
+* - how to append a child to this object
+* - how to remove a child from this object
+* - how to insert a child before another child
+* - how to save/restore state for this object (between updates, not currently saved)
+*/
 let builder;
 const extraMap = new Map([
 	[Gtk.Buildable.$gtype, { appendChild: (parentInstance, child) => {
@@ -38,6 +50,51 @@ const extraMap = new Map([
 			const siblingRow = sibling instanceof Gtk.ListBoxRow ? sibling : sibling.get_ancestor(Gtk.ListBoxRow.$gtype);
 			parentInstance.insert(child, siblingRow?.get_index() ?? 0);
 		}
+	}],
+	[Gtk.Editable.$gtype, {
+		saveState(instance) {
+			return { cursorPosition: instance.get_position() };
+		},
+		restoreState(instance, state) {
+			instance.set_position(state.cursorPosition);
+		}
+	}],
+	[Gtk.Widget.$gtype, {
+		appendChild(parentInstance, child) {
+			if (child instanceof Gtk.EventController) {
+				parentInstance.add_controller(child);
+				return;
+			}
+			if ("child" in parentInstance) {
+				parentInstance.child = child;
+				return;
+			}
+			if ("content" in parentInstance) {
+				parentInstance.content = child;
+				return;
+			}
+			if (child instanceof Gtk.Widget) child.set_parent(parentInstance);
+			console.warn(`Don't know how to append child to ${parentInstance.constructor.name}, please provide an implementation for it in the extraMap`);
+		},
+		removeChild(parentInstance, child) {
+			if (child instanceof Gtk.EventController) {
+				parentInstance.remove_controller(child);
+				return;
+			}
+			if ("child" in parentInstance) {
+				parentInstance.child = null;
+				return;
+			}
+			if ("content" in parentInstance) {
+				parentInstance.content = null;
+				return;
+			}
+			if (child instanceof Gtk.Widget) {
+				child.unparent();
+				return;
+			}
+			console.warn(`Don't know how to remove child from ${parentInstance.constructor.name}, please provide an implementation for it in the extraMap`);
+		}
 	}]
 ]);
 

package/dist/global.d.mts

@@ -1,3 +1,4 @@
+import GObject from "gi://GObject?version=2.0";
 import { Key, Ref } from "react";
 
 //#region src/global.d.ts
@@ -20,8 +21,8 @@ declare module "gi://Gtk?version=4.0" {
     namespace Widget {
       interface ConstructorProps {
         /**
-                 * React children
-                 */
+         * React children
+         */
         children: any;
       }
     }
@@ -32,8 +33,8 @@ declare module "gi://Gtk?version=3.0" {
     namespace Widget {
       interface ConstructorProps {
         /**
-                 * React children
-                 */
+         * React children
+         */
         children: any;
       }
     }

package/dist/hostconfig.d.mts

@@ -0,0 +1,7 @@
+import Gtk from "gi://Gtk?version=4.0";
+import { HostConfig } from "react-reconciler";
+
+//#region src/hostconfig.d.ts
+declare const hostConfig: HostConfig<string, Record<string, unknown>, Gtk.Widget, Gtk.Widget, Gtk.Label, Gtk.Widget, null, any, any, any, any, any, any, any>;
+//#endregion
+export { hostConfig };

package/dist/hostconfig.mjs

@@ -0,0 +1,111 @@
+import { setMetadataFromProps } from "./utilities/metadata.mjs";
+import { typeMap } from "./type-map.mjs";
+import { appendChild, insertBefore, removeChild } from "./utilities/children.mjs";
+import { getEventListeners, getEventName, getProperties, updateWidget } from "./utilities/diff.mjs";
+import Gtk from "gi://Gtk?version=4.0";
+import GLib from "gi://GLib?version=2.0";
+import { DefaultEventPriority, NoEventPriority } from "react-reconciler/constants";
+
+//#region src/hostconfig.ts
+const emptyObject = {};
+let updatePriority = NoEventPriority;
+const hostConfig = {
+	appendInitialChild(parentInstance, child) {
+		appendChild(parentInstance, child);
+	},
+	createInstance(type, props, rootContainerInstance, hostContext, internalInstanceHandle) {
+		const klass = typeMap.get(type);
+		if (!klass) throw new Error(`Unknown type: ${type}`);
+		return new klass(getProperties(props));
+	},
+	createTextInstance(text, rootContainerInstance, internalInstanceHandle) {
+		return Gtk.Label.new(text);
+	},
+	finalizeInitialChildren(widget, type, props) {
+		const events = getEventListeners(props);
+		Object.keys(events).forEach((name) => {
+			const eventType = getEventName(name);
+			widget.connect(eventType, events[name]);
+		});
+		setMetadataFromProps(widget, props);
+		return false;
+	},
+	getPublicInstance(inst) {
+		return inst;
+	},
+	prepareForCommit(container) {
+		return null;
+	},
+	resetAfterCommit() {},
+	getRootHostContext(rootInstance) {
+		return emptyObject;
+	},
+	getChildHostContext(parentHostContext, type) {
+		return emptyObject;
+	},
+	shouldSetTextContent(type, props) {
+		return false;
+	},
+	supportsMutation: true,
+	supportsHydration: false,
+	supportsPersistence: false,
+	supportsMicrotasks: true,
+	scheduleTimeout: (fn, delay) => {
+		GLib.timeout_add(GLib.PRIORITY_DEFAULT, delay, () => {
+			fn();
+			return GLib.SOURCE_REMOVE;
+		});
+	},
+	scheduleMicrotask: (fn) => {
+		GLib.idle_add(GLib.PRIORITY_HIGH_IDLE, () => {
+			fn();
+			return GLib.SOURCE_REMOVE;
+		});
+	},
+	removeChild(parentInstance, child) {
+		removeChild(parentInstance, child);
+	},
+	removeChildFromContainer(parentInstance, child) {
+		removeChild(parentInstance, child);
+	},
+	insertBefore(parentInstance, child, beforeChild) {
+		insertBefore(parentInstance, child, beforeChild);
+	},
+	insertInContainerBefore(parentInstance, child, beforeChild) {
+		insertBefore(parentInstance, child, beforeChild);
+	},
+	clearContainer(container) {},
+	appendChild(parentInstance, child) {
+		appendChild(parentInstance, child);
+	},
+	appendChildToContainer(container, child) {
+		appendChild(container, child);
+	},
+	detachDeletedInstance(node) {},
+	commitUpdate(widget, type, oldProps, newProps, internalInstanceHandle) {
+		updateWidget(widget, oldProps, newProps);
+	},
+	commitTextUpdate(textInstance, oldText, newText) {
+		textInstance.label = newText;
+	},
+	resolveUpdatePriority: function() {
+		if (updatePriority !== NoEventPriority) return updatePriority;
+		return DefaultEventPriority;
+	},
+	setCurrentUpdatePriority: function(newPriority) {
+		updatePriority = newPriority;
+	},
+	getCurrentUpdatePriority: function() {
+		return updatePriority;
+	},
+	resolveEventTimeStamp() {
+		return -1.1;
+	},
+	resolveEventType() {
+		return null;
+	},
+	trackSchedulerEvent() {}
+};
+
+//#endregion
+export { hostConfig };

package/dist/index.mjs

@@ -1,118 +1,12 @@
-import { setMetadataFromProps } from "./utilities/metadata.mjs";
 import "./global.d.mts";
-import { typeMap } from "./type-map.mjs";
-import { appendChild, insertBefore, removeChild } from "./utilities/children.mjs";
-import { getEventListeners, getEventName, getProperties, updateWidget } from "./utilities/diff.mjs";
-import Gtk from "gi://Gtk?version=4.0";
+import { hostConfig } from "./hostconfig.mjs";
 import "reflect-metadata";
-import GLib from "gi://GLib?version=2.0";
 import Reconciler from "react-reconciler";
-import { DefaultEventPriority, NoEventPriority } from "react-reconciler/constants";
 
 //#region src/index.ts
-const emptyObject = {};
-let updatePriority = NoEventPriority;
-const reconciler = Reconciler({
-	appendInitialChild(parentInstance, child) {
-		appendChild(parentInstance, child);
-	},
-	createInstance(type, props, rootContainerInstance, hostContext, internalInstanceHandle) {
-		const klass = typeMap.get(type);
-		if (!klass) throw new Error(`Unknown type: ${type}`);
-		return new klass(getProperties(props));
-	},
-	createTextInstance(text, rootContainerInstance, internalInstanceHandle) {
-		return Gtk.Label.new(text);
-	},
-	finalizeInitialChildren(widget, type, props) {
-		const events = getEventListeners(props);
-		Object.keys(events).forEach((name) => {
-			const eventType = getEventName(name);
-			widget.connect(eventType, events[name]);
-		});
-		setMetadataFromProps(widget, props);
-		return false;
-	},
-	getPublicInstance(inst) {
-		return inst;
-	},
-	prepareForCommit() {
-		return null;
-	},
-	resetAfterCommit() {},
-	getRootHostContext(rootInstance) {
-		return emptyObject;
-	},
-	getChildHostContext(parentHostContext, type) {
-		return emptyObject;
-	},
-	shouldSetTextContent(type, props) {
-		return false;
-	},
-	supportsMutation: true,
-	supportsHydration: false,
-	supportsPersistence: false,
-	supportsMicrotasks: true,
-	scheduleTimeout: (fn, delay) => {
-		GLib.timeout_add(GLib.PRIORITY_DEFAULT, delay, () => {
-			fn();
-			return GLib.SOURCE_REMOVE;
-		});
-	},
-	scheduleMicrotask: (fn) => {
-		GLib.idle_add(GLib.PRIORITY_HIGH_IDLE, () => {
-			fn();
-			return GLib.SOURCE_REMOVE;
-		});
-	},
-	removeChild(parentInstance, child) {
-		removeChild(parentInstance, child);
-	},
-	removeChildFromContainer(parentInstance, child) {
-		removeChild(parentInstance, child);
-	},
-	insertBefore(parentInstance, child, beforeChild) {
-		insertBefore(parentInstance, child, beforeChild);
-	},
-	insertInContainerBefore(parentInstance, child, beforeChild) {
-		insertBefore(parentInstance, child, beforeChild);
-	},
-	clearContainer(container) {},
-	appendChild(parentInstance, child) {
-		appendChild(parentInstance, child);
-	},
-	appendChildToContainer(container, child) {
-		appendChild(container, child);
-	},
-	detachDeletedInstance(node) {
-		node.unparent();
-	},
-	commitUpdate(widget, type, oldProps, newProps, internalInstanceHandle) {
-		updateWidget(widget, oldProps, newProps);
-	},
-	commitTextUpdate(textInstance, oldText, newText) {
-		textInstance.label = newText;
-	},
-	resolveUpdatePriority: function() {
-		if (updatePriority !== NoEventPriority) return updatePriority;
-		return DefaultEventPriority;
-	},
-	setCurrentUpdatePriority: function(newPriority) {
-		updatePriority = newPriority;
-	},
-	getCurrentUpdatePriority: function() {
-		return updatePriority;
-	},
-	resolveEventTimeStamp() {
-		return -1.1;
-	},
-	resolveEventType() {
-		return null;
-	},
-	trackSchedulerEvent() {}
-});
+const reconciler = Reconciler(hostConfig);
 const render = (jsx, root, callback) => {
-	const container = reconciler.createContainer(root, 0, null, false, null, "peachy", console.error, console.error, console.error, () => {}, null);
+	const container = reconciler.createContainer(root, 0, null, false, null, "peachy", console.error, console.error, console.error, () => {});
 	reconciler.updateContainer(jsx, container, null, callback);
 };
 reconciler.injectIntoDevTools({

package/dist/jsx-runtime.d.mts

@@ -1,9 +1,9 @@
-import * as react0 from "react";
+import * as react from "react";
 import * as React from "react/jsx-runtime";
 
 //#region src/jsx-runtime.d.ts
 declare const jsx: typeof React.jsx;
 declare const jsxs: typeof React.jsxs;
-declare const Fragment: react0.ExoticComponent<react0.FragmentProps>;
+declare const Fragment: react.ExoticComponent<react.FragmentProps>;
 //#endregion
 export { Fragment, jsx, jsxs };

package/dist/types.d.mts

@@ -1,8 +1,17 @@
+import GObject from "gi://GObject?version=2.0";
+
 //#region src/types.d.ts
 type Props = Record<string, unknown>;
 type Listener = (...args: any[]) => any;
 interface ReactionMetadata {
   childType?: string;
 }
+interface PeachyExtraMethods<T extends Gtk.Widget, State = {}> {
+  appendChild?(parentInstance: T, child: GObject.Object): void;
+  insertBefore?(parentInstance: T, child: GObject.Object, before: GObject.Object | null): void;
+  removeChild?(parentInstance: T, child: GObject.Object): void;
+  saveState?(instance: T): State;
+  restoreState?(instance: T, state: State): void;
+}
 //#endregion
-export { Listener, Props, ReactionMetadata };
+export { Listener, PeachyExtraMethods, Props, ReactionMetadata };

package/dist/utilities/children.mjs

@@ -1,52 +1,21 @@
-import { extraMap } from "../extra.mjs";
-import { getGtype } from "./type.mjs";
-import GObject from "gi://GObject?version=2.0";
+import { getExtraMethod } from "./extra.mjs";
 
 //#region src/utilities/children.ts
 function appendChild(parentInstance, child) {
-	const gtype = getGtype(parentInstance);
-	for (const [type, props] of extraMap) if (GObject.type_is_a(gtype, type)) {
-		if (props.appendChild) {
-			props.appendChild(parentInstance, child);
-			return;
-		}
-	}
-	if ("child" in parentInstance) {
-		parentInstance.child = child;
-		return;
-	}
-	if ("content" in parentInstance) {
-		parentInstance.content = child;
-		return;
-	}
-	child.set_parent(parentInstance);
+	getExtraMethod(parentInstance, "appendChild")?.(parentInstance, child);
 }
 function insertBefore(parentInstance, child, sibling) {
-	const gtype = getGtype(parentInstance);
-	for (const [type, props] of extraMap) if (GObject.type_is_a(gtype, type)) {
-		if (props.insertBefore) return props.insertBefore(parentInstance, child, sibling);
-	}
+	const insertBefore = getExtraMethod(parentInstance, "insertBefore");
+	if (insertBefore) return insertBefore(parentInstance, child, sibling);
 	const children = getAllChildren(parentInstance);
-	children.forEach((child$1) => removeChild(parentInstance, child$1));
+	children.forEach((child) => removeChild(parentInstance, child));
 	const childIndex = children.findIndex((c) => c === sibling);
 	if (childIndex !== -1) children.splice(childIndex, 0, child);
 	else children.push(child);
-	children.forEach((child$1) => appendChild(parentInstance, child$1));
+	children.forEach((child) => appendChild(parentInstance, child));
 }
 function removeChild(parentInstance, child) {
-	const gtype = getGtype(parentInstance);
-	for (const [type, props] of extraMap) if (GObject.type_is_a(gtype, type)) {
-		if (props.removeChild) return props.removeChild(parentInstance, child);
-	}
-	if ("child" in parentInstance) {
-		parentInstance.child = null;
-		return;
-	}
-	if ("content" in parentInstance) {
-		parentInstance.content = null;
-		return;
-	}
-	child.unparent();
+	getExtraMethod(parentInstance, "removeChild")?.(parentInstance, child);
 }
 function getAllChildren(parentInstance) {
 	const children = [];

package/dist/utilities/diff.mjs

@@ -2,44 +2,43 @@ import { setMetadataFromProps } from "./metadata.mjs";
 import GObject from "gi://GObject?version=2.0";
 
 //#region src/utilities/diff.ts
-const INTERNAL_PROP_NAMES = [
+const INTERNAL_PROP_NAMES = new Set([
 	"childType",
 	"ref",
-	"key"
-];
-const getEventName = (event) => event.substring(2).replace(/([A-Z])/g, "-$1").toLowerCase().replace(/^-/, "").replace(/:-?/, "::");
-const isEvent = (key) => key.startsWith("on");
-const isProperty = (key) => key !== "children" && !isEvent(key) && !INTERNAL_PROP_NAMES.includes(key);
-const isNew = (prev, next) => (key) => prev[key] !== next[key];
-const isGone = (prev, next) => (key) => !(key in next);
+	"key",
+	"children"
+]);
 function updateWidget(widget, prev, next) {
-	Object.keys(prev).filter(isEvent).filter((key) => !(key in next) || isNew(prev, next)(key)).forEach((name) => {
-		if (GObject.signal_handlers_disconnect_by_func(widget, prev[name]) === 0) console.warn(`No signal handler found for ${name}`);
-	});
-	Object.keys(prev).filter(isProperty).filter(isGone(prev, next)).forEach((name) => {
-		widget[name] = void 0;
-	});
-	Object.keys(next).filter(isProperty).filter(isNew(prev, next)).forEach((name) => {
-		widget[name] = next[name];
-	});
-	Object.keys(next).filter(isEvent).filter(isNew(prev, next)).forEach((name) => {
-		const eventType = getEventName(name);
-		widget.connect(eventType, next[name]);
-	});
+	widget.freeze_notify();
+	try {
+		for (const key of Object.keys(prev)) {
+			if (INTERNAL_PROP_NAMES.has(key)) continue;
+			const isChanged = prev[key] !== next[key];
+			const isRemoved = !(key in next);
+			if (isEvent(key) && (isRemoved || isChanged)) {
+				if (GObject.signal_handlers_disconnect_by_func(widget, prev[key]) === 0) console.warn(`No signal handler found for ${key}`);
+			} else if (!isEvent(key) && isRemoved) widget[key] = void 0;
+		}
+		for (const key of Object.keys(next)) {
+			if (INTERNAL_PROP_NAMES.has(key)) continue;
+			if (prev[key] === next[key]) continue;
+			if (isEvent(key)) widget.connect(getEventName(key), next[key]);
+			else widget[key] = next[key];
+		}
+	} finally {
+		widget.thaw_notify();
+	}
 	setMetadataFromProps(widget, next);
 }
 function getProperties(props) {
-	return Object.keys(props).filter(isProperty).reduce((acc, key) => {
-		acc[key] = props[key];
-		return acc;
-	}, {});
+	return Object.fromEntries(Object.entries(props).filter(([key]) => isProperty(key)));
 }
 function getEventListeners(props) {
-	return Object.keys(props).filter(isEvent).reduce((acc, key) => {
-		acc[key] = props[key];
-		return acc;
-	}, {});
+	return Object.fromEntries(Object.entries(props).filter(([key]) => isEvent(key)));
 }
+const getEventName = (event) => event.substring(2).replace(/([A-Z])/g, "-$1").toLowerCase().replace(/^-/, "").replace(/:-?/, "::");
+const isEvent = (key) => key.startsWith("on");
+const isProperty = (key) => !isEvent(key) && !INTERNAL_PROP_NAMES.has(key);
 
 //#endregion
 export { getEventListeners, getEventName, getProperties, updateWidget };

package/dist/utilities/extra.mjs

@@ -0,0 +1,16 @@
+import { extraMap } from "../extra.mjs";
+import { getGtype } from "./type.mjs";
+import GObject from "gi://GObject?version=2.0";
+
+//#region src/utilities/extra.ts
+function getExtraMethod(object, method) {
+	const gtype = getGtype(object);
+	for (const [type, props] of extraMap) if (GObject.type_is_a(gtype, type)) {
+		const methodImplementation = props[method];
+		if (methodImplementation) return methodImplementation;
+	}
+	return null;
+}
+
+//#endregion
+export { getExtraMethod };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@peachy/react",
-  "version": "0.0.8",
+  "version": "0.0.10",
   "description": "Run GJS applications with react",
   "main": "./dist/index.mjs",
   "exports": {
@@ -16,16 +16,17 @@
   },
   "author": "Angelo Verlain <hey@vixalien.com>",
   "dependencies": {
-    "@peachy/types": "^2025.1.18",
-    "react": "^19.2.3",
+    "@peachy/types": "^2025.2.4",
+    "react": "^19.2.4",
     "react-reconciler": "^0.33.0",
     "reflect-metadata": "^0.2.2",
-    "@peachy/core": "0.0.8"
+    "@peachy/core": "0.0.10"
   },
   "devDependencies": {
-    "@types/react": "^19.2.8",
-    "@types/react-reconciler": "^0.32.3",
-    "tsdown": "0.20.0-beta.4",
+    "@types/node": "^25.2.1",
+    "@types/react": "^19.2.13",
+    "@types/react-reconciler": "^0.33.0",
+    "tsdown": "0.20.3",
     "typescript": "^5.9.3"
   },
   "files": [

package/tsconfig.json

@@ -7,8 +7,10 @@
   "include": [
     // when installed locally
     "./node_modules/@peachy/types/types/index.d.ts",
+    "./node_modules/@peachy/core/node_modules/@peachy/plugin-resources/src/types/global.d.ts",
     // when installed via npm/pnpm
     "../types/types/index.d.ts",
+    "../plugin-resources/src/types/global.d.ts",
     "${configDir}/src/**/*",
   ],
 }