@gtkx/react 0.18.9 → 0.20.0

package/src/nodes/column-view.ts

@@ -1,217 +0,0 @@
-import * as Gtk from "@gtkx/ffi/gtk";
-import type { GtkColumnViewProps } from "../jsx.js";
-import type { Node } from "../node.js";
-import type { Container } from "../types.js";
-import { ColumnViewColumnNode } from "./column-view-column.js";
-import { ContainerSlotNode } from "./container-slot.js";
-import { EventControllerNode } from "./event-controller.js";
-import { filterProps, hasChanged } from "./internal/props.js";
-import { ListItemNode } from "./list-item.js";
-import { ListModel, type ListModelProps } from "./models/list.js";
-import { SlotNode } from "./slot.js";
-import { WidgetNode } from "./widget.js";
-
-const OWN_PROPS = ["sortColumn", "sortOrder", "onSortChanged", "estimatedRowHeight"] as const;
-
-type ColumnViewProps = Pick<GtkColumnViewProps, (typeof OWN_PROPS)[number]> & ListModelProps;
-type ColumnViewChild = ListItemNode | ColumnViewColumnNode | EventControllerNode | SlotNode | ContainerSlotNode;
-
-export class ColumnViewNode extends WidgetNode<Gtk.ColumnView, ColumnViewProps, ColumnViewChild> {
-    private handleSortChange: (() => void) | null = null;
-    private list: ListModel;
-
-    public override isValidChild(child: Node): boolean {
-        return (
-            child instanceof ListItemNode ||
-            child instanceof ColumnViewColumnNode ||
-            child instanceof EventControllerNode ||
-            child instanceof SlotNode ||
-            child instanceof ContainerSlotNode
-        );
-    }
-    private columnNodes = new Set<ColumnViewColumnNode>();
-    private estimatedRowHeight: number | null = null;
-
-    constructor(typeName: string, props: ColumnViewProps, container: Gtk.ColumnView, rootContainer: Container) {
-        super(typeName, props, container, rootContainer);
-        this.list = new ListModel(
-            { owner: this, signalStore: this.signalStore },
-            {
-                selectionMode: props.selectionMode,
-                selected: props.selected,
-                onSelectionChanged: props.onSelectionChanged,
-            },
-        );
-        this.list.getStore().setOnItemUpdated((id) => {
-            for (const column of this.columnNodes) {
-                column.rebindItem(id);
-            }
-        });
-    }
-
-    public override appendChild(child: ColumnViewChild): void {
-        super.appendChild(child);
-
-        if (child instanceof ListItemNode) {
-            this.list.appendChild(child);
-            return;
-        }
-
-        if (!(child instanceof ColumnViewColumnNode)) return;
-
-        const existingColumn = this.findColumnInView(child.getColumn());
-
-        if (existingColumn) {
-            this.container.removeColumn(existingColumn);
-        }
-
-        child.setStore(this.list.getStore());
-        child.setEstimatedRowHeight(this.estimatedRowHeight);
-        this.container.appendColumn(child.getColumn());
-        child.attachToColumnView(this.container);
-        this.columnNodes.add(child);
-    }
-
-    public override insertBefore(child: ColumnViewChild, before: ColumnViewChild): void {
-        super.insertBefore(child, before);
-
-        if (child instanceof ListItemNode) {
-            if (before instanceof ListItemNode) {
-                this.list.insertBefore(child, before);
-            }
-            return;
-        }
-
-        if (!(child instanceof ColumnViewColumnNode)) return;
-
-        const existingColumn = this.findColumnInView(child.getColumn());
-
-        if (existingColumn) {
-            this.container.removeColumn(existingColumn);
-        }
-
-        child.setStore(this.list.getStore());
-        child.setEstimatedRowHeight(this.estimatedRowHeight);
-
-        if (before instanceof ColumnViewColumnNode) {
-            const beforeIndex = this.getColumnIndex(before.getColumn());
-            this.container.insertColumn(beforeIndex, child.getColumn());
-        } else {
-            this.container.appendColumn(child.getColumn());
-        }
-
-        child.attachToColumnView(this.container);
-        this.columnNodes.add(child);
-    }
-
-    public override removeChild(child: ColumnViewChild): void {
-        if (child instanceof ListItemNode) {
-            this.list.removeChild(child);
-            super.removeChild(child);
-            return;
-        }
-
-        if (child instanceof ColumnViewColumnNode) {
-            child.detachFromColumnView();
-
-            const existingColumn = this.findColumnInView(child.getColumn());
-
-            if (existingColumn) {
-                this.container.removeColumn(existingColumn);
-            }
-
-            child.setStore(null);
-            this.columnNodes.delete(child);
-        }
-
-        super.removeChild(child);
-    }
-
-    public override finalizeInitialChildren(props: ColumnViewProps): boolean {
-        super.finalizeInitialChildren(props);
-        return true;
-    }
-
-    public override commitUpdate(oldProps: ColumnViewProps | null, newProps: ColumnViewProps): void {
-        super.commitUpdate(oldProps ? filterProps(oldProps, OWN_PROPS) : null, filterProps(newProps, OWN_PROPS));
-        this.applyOwnProps(oldProps, newProps);
-        this.list.updateProps(oldProps ? filterProps(oldProps, OWN_PROPS) : null, filterProps(newProps, OWN_PROPS));
-    }
-
-    public override commitMount(): void {
-        super.commitMount();
-        this.list.flushBatch();
-        this.container.setModel(this.list.getSelectionModel());
-    }
-
-    public override detachDeletedInstance(): void {
-        this.columnNodes.clear();
-        super.detachDeletedInstance();
-    }
-
-    private applyOwnProps(oldProps: ColumnViewProps | null, newProps: ColumnViewProps): void {
-        if (hasChanged(oldProps, newProps, "onSortChanged")) {
-            const sorter = this.container.getSorter();
-            const onSortChanged = newProps.onSortChanged;
-
-            if (sorter instanceof Gtk.ColumnViewSorter) {
-                this.handleSortChange = () => {
-                    onSortChanged?.(sorter.getPrimarySortColumn()?.getId() ?? null, sorter.getPrimarySortOrder());
-                };
-
-                this.signalStore.set(this, sorter, "changed", this.handleSortChange);
-            }
-        }
-
-        if (hasChanged(oldProps, newProps, "sortColumn") || hasChanged(oldProps, newProps, "sortOrder")) {
-            const sortColumn = newProps.sortColumn;
-            const sortOrder = newProps.sortOrder ?? Gtk.SortType.ASCENDING;
-
-            if (!sortColumn) {
-                this.container.sortByColumn(sortOrder, undefined);
-            } else {
-                this.container.sortByColumn(sortOrder, this.getColumn(sortColumn));
-            }
-        }
-
-        if (hasChanged(oldProps, newProps, "estimatedRowHeight")) {
-            this.estimatedRowHeight = newProps.estimatedRowHeight ?? null;
-            for (const column of this.columnNodes) {
-                column.setEstimatedRowHeight(this.estimatedRowHeight);
-            }
-        }
-    }
-
-    private findColumn<T>(predicate: (column: Gtk.ColumnViewColumn, index: number) => T | null): T | null {
-        const columns = this.container.getColumns();
-        for (let i = 0; i < columns.getNItems(); i++) {
-            const column = columns.getObject(i);
-            if (!(column instanceof Gtk.ColumnViewColumn)) continue;
-            const result = predicate(column, i);
-            if (result !== null) return result;
-        }
-        return null;
-    }
-
-    private getColumn(columnId: string): Gtk.ColumnViewColumn {
-        const column = this.findColumn((col) => (col.getId() === columnId ? col : null));
-        if (!column) {
-            throw new Error(`Unable to find column '${columnId}' in ${this.typeName}`);
-        }
-        return column;
-    }
-
-    private getColumnIndex(column: Gtk.ColumnViewColumn): number {
-        const targetId = column.getId();
-        const index = this.findColumn((col, i) => (col.getId() === targetId ? i : null));
-        if (index === null) {
-            throw new Error(`Unable to find column '${targetId}' in ${this.typeName}`);
-        }
-        return index;
-    }
-
-    private findColumnInView(column: Gtk.ColumnViewColumn): Gtk.ColumnViewColumn | null {
-        const targetId = column.getId();
-        return this.findColumn((col) => (col.getId() === targetId ? col : null));
-    }
-}

package/src/nodes/drop-down.ts

@@ -1,108 +0,0 @@
-import type { AdwComboRowProps, GtkDropDownProps } from "../jsx.js";
-import type { Node } from "../node.js";
-import type { DropDownWidget } from "../registry.js";
-import type { Container } from "../types.js";
-import { ContainerSlotNode } from "./container-slot.js";
-import { EventControllerNode } from "./event-controller.js";
-import { filterProps, hasChanged } from "./internal/props.js";
-import { SimpleListStore } from "./internal/simple-list-store.js";
-import { ListItemNode } from "./list-item.js";
-import { SlotNode } from "./slot.js";
-import { WidgetNode } from "./widget.js";
-
-const OWN_PROPS = ["selectedId", "onSelectionChanged"] as const;
-
-type DropDownProps = Pick<GtkDropDownProps | AdwComboRowProps, (typeof OWN_PROPS)[number]>;
-
-type DropDownChild = ListItemNode | EventControllerNode | SlotNode | ContainerSlotNode;
-
-export class DropDownNode extends WidgetNode<DropDownWidget, DropDownProps, DropDownChild> {
-    private store = new SimpleListStore();
-    private initialSelectedId: string | null | undefined;
-
-    public override isValidChild(child: Node): boolean {
-        return (
-            child instanceof ListItemNode ||
-            child instanceof EventControllerNode ||
-            child instanceof SlotNode ||
-            child instanceof ContainerSlotNode
-        );
-    }
-
-    constructor(typeName: string, props: DropDownProps, container: DropDownWidget, rootContainer: Container) {
-        super(typeName, props, container, rootContainer);
-        this.store.beginBatch();
-        this.initialSelectedId = props.selectedId;
-        this.container.setModel(this.store.getModel());
-    }
-
-    public override finalizeInitialChildren(props: DropDownProps): boolean {
-        super.finalizeInitialChildren(props);
-        this.store.flushBatch();
-        this.reapplyInitialSelectedId();
-        return false;
-    }
-
-    private reapplyInitialSelectedId(): void {
-        if (this.initialSelectedId == null) return;
-        const index = this.store.getIndexById(this.initialSelectedId);
-        this.initialSelectedId = undefined;
-        if (index !== null) {
-            this.container.setSelected(index);
-        }
-    }
-
-    public override appendChild(child: DropDownChild): void {
-        super.appendChild(child);
-        if (child instanceof ListItemNode) {
-            child.setStore(this.store);
-            this.store.addItem(child.props.id, child.props.value as string);
-        }
-    }
-
-    public override insertBefore(child: DropDownChild, before: DropDownChild): void {
-        super.insertBefore(child, before);
-        if (child instanceof ListItemNode && before instanceof ListItemNode) {
-            child.setStore(this.store);
-            this.store.insertItemBefore(child.props.id, before.props.id, child.props.value as string);
-        }
-    }
-
-    public override removeChild(child: DropDownChild): void {
-        if (child instanceof ListItemNode) {
-            this.store.removeItem(child.props.id);
-        }
-        super.removeChild(child);
-    }
-
-    public override commitUpdate(oldProps: DropDownProps | null, newProps: DropDownProps): void {
-        super.commitUpdate(oldProps ? filterProps(oldProps, OWN_PROPS) : null, filterProps(newProps, OWN_PROPS));
-        this.applyOwnProps(oldProps, newProps);
-    }
-
-    private applyOwnProps(oldProps: DropDownProps | null, newProps: DropDownProps): void {
-        if (hasChanged(oldProps, newProps, "onSelectionChanged")) {
-            const onSelectionChanged = newProps.onSelectionChanged;
-
-            const handleSelectionChange = onSelectionChanged
-                ? () => {
-                      const selectedIndex = this.container.getSelected();
-                      const id = this.store.getIdAtIndex(selectedIndex);
-                      if (id !== null) {
-                          onSelectionChanged(id);
-                      }
-                  }
-                : undefined;
-
-            this.signalStore.set(this, this.container, "notify::selected", handleSelectionChange);
-        }
-
-        if (hasChanged(oldProps, newProps, "selectedId")) {
-            const index = newProps.selectedId != null ? this.store.getIndexById(newProps.selectedId) : null;
-
-            if (index !== null) {
-                this.container.setSelected(index);
-            }
-        }
-    }
-}

package/src/nodes/grid-view.ts

@@ -1,109 +0,0 @@
-import type * as Gtk from "@gtkx/ffi/gtk";
-import type { GtkGridViewProps } from "../jsx.js";
-import type { Node } from "../node.js";
-import type { Container } from "../types.js";
-import { ContainerSlotNode } from "./container-slot.js";
-import { EventControllerNode } from "./event-controller.js";
-import { GridItemRenderer } from "./internal/grid-item-renderer.js";
-import { filterProps, hasChanged } from "./internal/props.js";
-import { ListItemNode } from "./list-item.js";
-import { GridModel, type GridModelProps } from "./models/grid.js";
-import { SlotNode } from "./slot.js";
-import { WidgetNode } from "./widget.js";
-
-const OWN_PROPS = ["renderItem", "estimatedItemHeight"] as const;
-
-type GridViewProps = Pick<GtkGridViewProps, (typeof OWN_PROPS)[number]> & GridModelProps;
-
-type GridViewChild = ListItemNode | EventControllerNode | SlotNode | ContainerSlotNode;
-
-export class GridViewNode extends WidgetNode<Gtk.GridView, GridViewProps, GridViewChild> {
-    private itemRenderer: GridItemRenderer;
-    private grid: GridModel;
-
-    constructor(typeName: string, props: GridViewProps, container: Gtk.GridView, rootContainer: Container) {
-        super(typeName, props, container, rootContainer);
-        this.grid = new GridModel(
-            { owner: this, signalStore: this.signalStore },
-            {
-                selectionMode: props.selectionMode,
-                selected: props.selected,
-                onSelectionChanged: props.onSelectionChanged,
-            },
-        );
-        this.itemRenderer = new GridItemRenderer(this.signalStore);
-        this.itemRenderer.setStore(this.grid.getStore());
-        this.grid.getStore().setOnItemUpdated((id) => this.itemRenderer.rebindItem(id));
-        this.container.setFactory(this.itemRenderer.getFactory());
-    }
-
-    public override isValidChild(child: Node): boolean {
-        if (child instanceof EventControllerNode || child instanceof SlotNode || child instanceof ContainerSlotNode)
-            return true;
-        if (!(child instanceof ListItemNode)) return false;
-        if (child.getChildNodes().length > 0) {
-            throw new Error("GtkGridView does not support nested ListItems. Use GtkListView for tree lists.");
-        }
-        return true;
-    }
-
-    public override appendChild(child: GridViewChild): void {
-        super.appendChild(child);
-        if (child instanceof ListItemNode) {
-            this.grid.appendChild(child);
-        }
-    }
-
-    public override insertBefore(child: GridViewChild, before: GridViewChild): void {
-        super.insertBefore(child, before);
-        if (child instanceof ListItemNode && before instanceof ListItemNode) {
-            this.grid.insertBefore(child, before);
-        }
-    }
-
-    public override removeChild(child: GridViewChild): void {
-        if (child instanceof ListItemNode) {
-            this.grid.removeChild(child);
-        }
-        super.removeChild(child);
-    }
-
-    public override finalizeInitialChildren(props: GridViewProps): boolean {
-        super.finalizeInitialChildren(props);
-        return true;
-    }
-
-    public override commitUpdate(oldProps: GridViewProps | null, newProps: GridViewProps): void {
-        super.commitUpdate(oldProps ? filterProps(oldProps, OWN_PROPS) : null, filterProps(newProps, OWN_PROPS));
-        this.applyOwnProps(oldProps, newProps);
-    }
-
-    public override commitMount(): void {
-        super.commitMount();
-        this.grid.flushBatch();
-        this.container.setModel(this.grid.getSelectionModel());
-    }
-
-    public override detachDeletedInstance(): void {
-        this.itemRenderer.dispose();
-        super.detachDeletedInstance();
-    }
-
-    private applyOwnProps(oldProps: GridViewProps | null, newProps: GridViewProps): void {
-        if (hasChanged(oldProps, newProps, "renderItem")) {
-            this.itemRenderer.setRenderFn(newProps.renderItem ?? null);
-        }
-
-        if (hasChanged(oldProps, newProps, "estimatedItemHeight")) {
-            this.itemRenderer.setEstimatedItemHeight(newProps.estimatedItemHeight ?? null);
-        }
-
-        const previousModel = this.grid.getSelectionModel();
-        this.grid.updateProps(oldProps ? filterProps(oldProps, OWN_PROPS) : null, filterProps(newProps, OWN_PROPS));
-        const currentModel = this.grid.getSelectionModel();
-
-        if (previousModel !== currentModel) {
-            this.container.setModel(currentModel);
-        }
-    }
-}

package/src/nodes/internal/base-item-renderer.ts

@@ -1,108 +0,0 @@
-import * as Gtk from "@gtkx/ffi/gtk";
-import type { ReactNode } from "react";
-import type Reconciler from "react-reconciler";
-import { createFiberRoot } from "../../fiber-root.js";
-import { reconciler } from "../../reconciler.js";
-import type { SignalStore } from "./signal-store.js";
-
-export abstract class BaseItemRenderer<TStore = unknown> {
-    protected factory: Gtk.SignalListItemFactory;
-    protected fiberRoots = new Map<Gtk.ListItem, Reconciler.FiberRoot>();
-    protected tornDown = new Set<Gtk.ListItem>();
-    protected estimatedItemHeight: number | null = null;
-    private store: TStore | null = null;
-    protected signalStore: SignalStore;
-
-    constructor(signalStore: SignalStore) {
-        this.signalStore = signalStore;
-        this.factory = new Gtk.SignalListItemFactory();
-        this.initializeFactory();
-    }
-
-    public getFactory(): Gtk.SignalListItemFactory {
-        return this.factory;
-    }
-
-    public setEstimatedItemHeight(height: number | null): void {
-        this.estimatedItemHeight = height;
-    }
-
-    public setStore(store: TStore | null): void {
-        this.store = store;
-    }
-
-    protected getStore(): TStore {
-        if (!this.store) {
-            throw new Error(`Expected store to be set on ${this.constructor.name}`);
-        }
-        return this.store;
-    }
-
-    public dispose(): void {
-        this.signalStore.clear(this);
-        this.fiberRoots.clear();
-        this.tornDown.clear();
-    }
-
-    protected abstract renderItem(listItem: Gtk.ListItem): ReactNode;
-    protected abstract onSetup(listItem: Gtk.ListItem): Gtk.Widget;
-    protected abstract onBind(listItem: Gtk.ListItem, fiberRoot: Reconciler.FiberRoot): void;
-    protected abstract onUnbind(listItem: Gtk.ListItem): void;
-
-    protected onSetupComplete(_listItem: Gtk.ListItem): void {}
-    protected onTeardown(_listItem: Gtk.ListItem): void {}
-
-    protected createBox(): Gtk.Box {
-        const box = new Gtk.Box(Gtk.Orientation.HORIZONTAL);
-        box.setValign(Gtk.Align.CENTER);
-
-        if (this.estimatedItemHeight !== null) {
-            box.setSizeRequest(-1, this.estimatedItemHeight);
-        }
-
-        return box;
-    }
-
-    protected clearBoxSizeRequest(box: Gtk.Widget): void {
-        if (box instanceof Gtk.Box) {
-            box.setSizeRequest(-1, -1);
-        }
-    }
-
-    private initializeFactory(): void {
-        this.signalStore.set(this, this.factory, "setup", (listItem: Gtk.ListItem) => {
-            const container = this.onSetup(listItem);
-            const fiberRoot = createFiberRoot(container);
-            this.fiberRoots.set(listItem, fiberRoot);
-            const element = this.renderItem(listItem);
-            reconciler.getInstance().updateContainer(element, fiberRoot, null, () => {
-                if (this.tornDown.has(listItem)) return;
-                this.onSetupComplete(listItem);
-            });
-        });
-
-        this.signalStore.set(this, this.factory, "bind", (listItem: Gtk.ListItem) => {
-            const fiberRoot = this.fiberRoots.get(listItem);
-            if (!fiberRoot) return;
-            this.onBind(listItem, fiberRoot);
-        });
-
-        this.signalStore.set(this, this.factory, "unbind", (listItem: Gtk.ListItem) => {
-            this.onUnbind(listItem);
-        });
-
-        this.signalStore.set(this, this.factory, "teardown", (listItem: Gtk.ListItem) => {
-            const fiberRoot = this.fiberRoots.get(listItem);
-
-            if (fiberRoot) {
-                this.tornDown.add(listItem);
-                this.onTeardown(listItem);
-                reconciler.getInstance().updateContainer(null, fiberRoot, null, () => {});
-                queueMicrotask(() => {
-                    this.fiberRoots.delete(listItem);
-                    this.tornDown.delete(listItem);
-                });
-            }
-        });
-    }
-}

package/src/nodes/internal/grid-item-renderer.ts

@@ -1,78 +0,0 @@
-import * as Gtk from "@gtkx/ffi/gtk";
-import type { ReactNode } from "react";
-import type Reconciler from "react-reconciler";
-import { reconciler } from "../../reconciler.js";
-import { BaseItemRenderer } from "./base-item-renderer.js";
-import type { ListStore } from "./list-store.js";
-
-type GridRenderItemFn<T> = (item: T | null) => ReactNode;
-
-export class GridItemRenderer extends BaseItemRenderer<ListStore> {
-    private renderFn: GridRenderItemFn<unknown> | null = () => null;
-    private boundItems = new Map<string, Gtk.ListItem>();
-
-    public setRenderFn(renderFn: GridRenderItemFn<unknown> | null): void {
-        this.renderFn = renderFn;
-        this.rebindAllItems();
-    }
-
-    public rebindAllItems(): void {
-        for (const id of this.boundItems.keys()) {
-            this.rebindItem(id);
-        }
-    }
-
-    public rebindItem(id: string): void {
-        const listItem = this.boundItems.get(id);
-        if (!listItem) return;
-
-        const fiberRoot = this.fiberRoots.get(listItem);
-        if (!fiberRoot) return;
-
-        const item = this.getStore().getItem(id);
-        const element = this.renderFn?.(item);
-
-        reconciler.getInstance().updateContainer(element, fiberRoot, null, () => {});
-    }
-
-    protected override renderItem(_listItem: Gtk.ListItem): ReactNode {
-        return this.renderFn?.(null);
-    }
-
-    private getItemFromListItem(listItem: Gtk.ListItem): string | null {
-        const stringObject = listItem.getItem();
-        if (!(stringObject instanceof Gtk.StringObject)) return null;
-        return stringObject.getString();
-    }
-
-    protected override onSetup(listItem: Gtk.ListItem): Gtk.Widget {
-        const box = this.createBox();
-        listItem.setChild(box);
-        return box;
-    }
-
-    protected override onBind(listItem: Gtk.ListItem, fiberRoot: Reconciler.FiberRoot): void {
-        const id = this.getItemFromListItem(listItem);
-        if (id !== null) {
-            this.boundItems.set(id, listItem);
-        }
-
-        const item = id !== null ? this.getStore().getItem(id) : null;
-        const element = this.renderFn?.(item);
-
-        reconciler.getInstance().updateContainer(element, fiberRoot, null, () => {
-            if (this.tornDown.has(listItem)) return;
-            if (this.estimatedItemHeight !== null) return;
-            const currentFiberRoot = this.fiberRoots.get(listItem);
-            if (!currentFiberRoot) return;
-            this.clearBoxSizeRequest(currentFiberRoot.containerInfo);
-        });
-    }
-
-    protected override onUnbind(listItem: Gtk.ListItem): void {
-        const id = this.getItemFromListItem(listItem);
-        if (id !== null) {
-            this.boundItems.delete(id);
-        }
-    }
-}