@gtkx/react 0.6.0 → 0.7.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gtkx/react",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "description": "Build GTK4 desktop applications with React and TypeScript",
   "keywords": [
     "gtk",
@@ -19,7 +19,7 @@
   "repository": {
     "type": "git",
     "url": "https://github.com/eugeniodepalo/gtkx.git",
-    "directory": "packages/gtkx"
+    "directory": "packages/react"
   },
   "license": "MPL-2.0",
   "author": "Eugenio Depalo <eugeniodepalo@gmail.com>",
@@ -36,10 +36,10 @@
   ],
   "dependencies": {
     "react-reconciler": "0.33.0",
-    "@gtkx/ffi": "0.6.0"
+    "@gtkx/ffi": "0.7.0"
   },
   "devDependencies": {
-    "@gtkx/gir": "0.6.0"
+    "@gtkx/gir": "0.7.0"
   },
   "peerDependencies": {
     "react": "^19"

package/dist/nodes/dropdown.d.ts

@@ -1,39 +0,0 @@
-import * as Gtk from "@gtkx/ffi/gtk";
-import { type ItemContainer } from "../container-interfaces.js";
-import type { Props } from "../factory.js";
-import { Node } from "../node.js";
-type ItemLabelFn = (item: unknown) => string;
-interface DropDownState {
-    store: DropDownStore;
-    onSelectionChanged?: (item: unknown, index: number) => void;
-}
-declare class DropDownStore {
-    private stringList;
-    private items;
-    private labelFn;
-    constructor(labelFn: ItemLabelFn);
-    getModel(): Gtk.StringList;
-    append(item: unknown): void;
-    remove(item: unknown): void;
-    getItem(index: number): unknown;
-    get length(): number;
-}
-export declare class DropDownNode extends Node<Gtk.DropDown, DropDownState> implements ItemContainer<unknown> {
-    static matches(type: string): boolean;
-    initialize(props: Props): void;
-    addItem(item: unknown): void;
-    insertItemBefore(item: unknown, _beforeItem: unknown): void;
-    removeItem(item: unknown): void;
-    protected consumedProps(): Set<string>;
-    updateProps(oldProps: Props, newProps: Props): void;
-}
-export declare class DropDownItemNode extends Node<never> {
-    static matches(type: string): boolean;
-    protected isVirtual(): boolean;
-    private item;
-    initialize(props: Props): void;
-    getItem(): unknown;
-    attachToParent(parent: Node): void;
-    detachFromParent(parent: Node): void;
-}
-export {};

package/dist/nodes/dropdown.js

@@ -1,103 +0,0 @@
-import { getInterface } from "@gtkx/ffi";
-import * as Gio from "@gtkx/ffi/gio";
-import * as Gtk from "@gtkx/ffi/gtk";
-import { isItemContainer } from "../container-interfaces.js";
-import { Node } from "../node.js";
-class DropDownStore {
-    stringList;
-    items = [];
-    labelFn;
-    constructor(labelFn) {
-        this.stringList = new Gtk.StringList([]);
-        this.labelFn = labelFn;
-    }
-    getModel() {
-        return this.stringList;
-    }
-    append(item) {
-        const label = this.labelFn(item);
-        this.stringList.append(label);
-        this.items.push(item);
-    }
-    remove(item) {
-        const index = this.items.indexOf(item);
-        if (index !== -1) {
-            this.stringList.remove(index);
-            this.items.splice(index, 1);
-        }
-    }
-    getItem(index) {
-        return this.items[index];
-    }
-    get length() {
-        return this.items.length;
-    }
-}
-export class DropDownNode extends Node {
-    static matches(type) {
-        return type === "DropDown.Root";
-    }
-    initialize(props) {
-        const labelFn = props.itemLabel ?? ((item) => String(item));
-        const store = new DropDownStore(labelFn);
-        const onSelectionChanged = props.onSelectionChanged;
-        this.state = { store, onSelectionChanged };
-        super.initialize(props);
-        this.widget.setModel(getInterface(store.getModel(), Gio.ListModel));
-        if (onSelectionChanged) {
-            const handler = () => {
-                const index = this.widget.getSelected();
-                const item = this.state.store.getItem(index);
-                this.state.onSelectionChanged?.(item, index);
-            };
-            this.connectSignal(this.widget, "notify::selected", handler);
-        }
-    }
-    addItem(item) {
-        this.state.store.append(item);
-    }
-    insertItemBefore(item, _beforeItem) {
-        this.addItem(item);
-    }
-    removeItem(item) {
-        this.state.store.remove(item);
-    }
-    consumedProps() {
-        const consumed = super.consumedProps();
-        consumed.add("itemLabel");
-        consumed.add("onSelectionChanged");
-        return consumed;
-    }
-    updateProps(oldProps, newProps) {
-        if (oldProps.onSelectionChanged !== newProps.onSelectionChanged) {
-            this.state.onSelectionChanged = newProps.onSelectionChanged;
-        }
-        super.updateProps(oldProps, newProps);
-    }
-}
-export class DropDownItemNode extends Node {
-    static matches(type) {
-        return type === "DropDown.Item";
-    }
-    isVirtual() {
-        return true;
-    }
-    item;
-    initialize(props) {
-        super.initialize(props);
-        this.item = props.item;
-    }
-    getItem() {
-        return this.item;
-    }
-    attachToParent(parent) {
-        if (!isItemContainer(parent))
-            return;
-        parent.addItem(this.item);
-    }
-    detachFromParent(parent) {
-        if (!isItemContainer(parent))
-            return;
-        parent.removeItem(this.item);
-    }
-}

package/dist/nodes/list.d.ts

@@ -1,43 +0,0 @@
-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";
-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;
-    initialize(props: Props): void;
-    private initializeStateWithPlaceholders;
-    private createGtkModels;
-    private connectFactorySignals;
-    private syncStringList;
-    addItem(item: unknown): void;
-    insertItemBefore(item: unknown, beforeItem: unknown): void;
-    removeItem(item: unknown): void;
-    protected consumedProps(): Set<string>;
-    updateProps(oldProps: Props, newProps: Props): void;
-}
-export declare class ListItemNode extends Node {
-    static matches(type: string): boolean;
-    protected isVirtual(): boolean;
-    private item;
-    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

@@ -1,153 +0,0 @@
-import { getInterface, getObject, getObjectId } from "@gtkx/ffi";
-import * as Gio from "@gtkx/ffi/gio";
-import * as Gtk from "@gtkx/ffi/gtk";
-import { scheduleFlush } from "../batch.js";
-import { isItemContainer } from "../container-interfaces.js";
-import { createFiberRoot } from "../fiber-root.js";
-import { Node } from "../node.js";
-import { reconciler } from "../reconciler.js";
-export class ListViewNode extends Node {
-    static matches(type) {
-        return type === "ListView.Root" || type === "GridView.Root";
-    }
-    initialize(props) {
-        this.initializeStateWithPlaceholders(props);
-        super.initialize(props);
-        this.createGtkModels();
-        this.connectFactorySignals();
-        this.widget.setModel(this.state.selectionModel);
-        this.widget.setFactory(this.state.factory);
-    }
-    initializeStateWithPlaceholders(props) {
-        this.state = {
-            stringList: null,
-            selectionModel: null,
-            factory: null,
-            renderItem: props.renderItem,
-            listItemCache: new Map(),
-            items: [],
-            committedLength: 0,
-        };
-    }
-    createGtkModels() {
-        const stringList = new Gtk.StringList([]);
-        const selectionModel = new Gtk.SingleSelection(getInterface(stringList, Gio.ListModel));
-        const factory = new Gtk.SignalListItemFactory();
-        this.state.stringList = stringList;
-        this.state.selectionModel = selectionModel;
-        this.state.factory = factory;
-    }
-    connectFactorySignals() {
-        const factory = this.state.factory;
-        factory.connect("setup", (_self, listItemObj) => {
-            const listItem = getObject(listItemObj.id);
-            const id = getObjectId(listItemObj.id);
-            const box = new Gtk.Box(Gtk.Orientation.VERTICAL, 0);
-            listItem.setChild(box);
-            const fiberRoot = createFiberRoot(box);
-            this.state.listItemCache.set(id, { box, fiberRoot });
-            const element = this.state.renderItem(null);
-            reconciler.getInstance().updateContainer(element, fiberRoot, null, () => { });
-        });
-        factory.connect("bind", (_self, listItemObj) => {
-            const listItem = getObject(listItemObj.id);
-            const id = getObjectId(listItemObj.id);
-            const info = this.state.listItemCache.get(id);
-            if (!info)
-                return;
-            const position = listItem.getPosition();
-            const item = this.state.items[position];
-            const element = this.state.renderItem(item);
-            reconciler.getInstance().updateContainer(element, info.fiberRoot, null, () => { });
-        });
-        factory.connect("unbind", (_self, listItemObj) => {
-            const id = getObjectId(listItemObj.id);
-            const info = this.state.listItemCache.get(id);
-            if (!info)
-                return;
-            reconciler.getInstance().updateContainer(null, info.fiberRoot, null, () => { });
-        });
-        factory.connect("teardown", (_self, listItemObj) => {
-            const id = getObjectId(listItemObj.id);
-            const info = this.state.listItemCache.get(id);
-            if (info) {
-                reconciler.getInstance().updateContainer(null, info.fiberRoot, null, () => { });
-                this.state.listItemCache.delete(id);
-            }
-        });
-    }
-    syncStringList = () => {
-        const newLength = this.state.items.length;
-        if (newLength === this.state.committedLength)
-            return;
-        const placeholders = Array.from({ length: newLength }, () => "");
-        this.state.stringList.splice(0, this.state.committedLength, placeholders);
-        this.state.committedLength = newLength;
-    };
-    addItem(item) {
-        this.state.items.push(item);
-        scheduleFlush(this.syncStringList);
-    }
-    insertItemBefore(item, beforeItem) {
-        const beforeIndex = this.state.items.indexOf(beforeItem);
-        if (beforeIndex === -1) {
-            this.state.items.push(item);
-        }
-        else {
-            this.state.items.splice(beforeIndex, 0, item);
-        }
-        scheduleFlush(this.syncStringList);
-    }
-    removeItem(item) {
-        const index = this.state.items.indexOf(item);
-        if (index !== -1) {
-            this.state.items.splice(index, 1);
-            scheduleFlush(this.syncStringList);
-        }
-    }
-    consumedProps() {
-        const consumed = super.consumedProps();
-        consumed.add("renderItem");
-        return consumed;
-    }
-    updateProps(oldProps, newProps) {
-        if (oldProps.renderItem !== newProps.renderItem) {
-            this.state.renderItem = newProps.renderItem;
-        }
-        super.updateProps(oldProps, newProps);
-    }
-}
-export class ListItemNode extends Node {
-    static matches(type) {
-        return type === "ListView.Item" || type === "GridView.Item";
-    }
-    isVirtual() {
-        return true;
-    }
-    item;
-    initialize(props) {
-        this.item = props.item;
-        super.initialize(props);
-    }
-    getItem() {
-        return this.item;
-    }
-    attachToParent(parent) {
-        if (isItemContainer(parent)) {
-            parent.addItem(this.item);
-        }
-    }
-    attachToParentBefore(parent, before) {
-        if (isItemContainer(parent) && before instanceof ListItemNode) {
-            parent.insertItemBefore(this.item, before.getItem());
-        }
-        else {
-            this.attachToParent(parent);
-        }
-    }
-    detachFromParent(parent) {
-        if (isItemContainer(parent)) {
-            parent.removeItem(this.item);
-        }
-    }
-}