@gtkx/react 0.6.0 → 0.7.0

package/dist/nodes/notebook.d.ts

@@ -2,6 +2,7 @@ import * as Gtk from "@gtkx/ffi/gtk";
 import { type ChildContainer, type PageContainer } from "../container-interfaces.js";
 import type { Props } from "../factory.js";
 import { Node } from "../node.js";
+import { VirtualSlotNode } from "./virtual-slot.js";
 export declare class NotebookNode extends Node<Gtk.Notebook> implements PageContainer, ChildContainer {
     static matches(type: string): boolean;
     addPage(child: Gtk.Widget, label: string): void;
@@ -12,20 +13,18 @@ export declare class NotebookNode extends Node<Gtk.Notebook> implements PageCont
     insertChildBefore(child: Gtk.Widget, before: Gtk.Widget): void;
     detachChild(child: Gtk.Widget): void;
 }
-export declare class NotebookPageNode extends Node {
+type NotebookPageProps = {
+    label: string;
+};
+export declare class NotebookPageNode extends VirtualSlotNode<PageContainer, NotebookPageProps> {
+    static consumedPropNames: string[];
     static matches(type: string): boolean;
-    protected isVirtual(): boolean;
-    private label;
-    private childWidget;
-    private parentContainer;
-    initialize(props: Props): void;
-    getLabel(): string;
-    setChildWidget(widget: Gtk.Widget): void;
-    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>;
+    protected isValidContainer(parent: Node): parent is Node & PageContainer;
+    protected extractSlotProps(props: Props): NotebookPageProps;
+    protected addToContainer(container: PageContainer, child: Gtk.Widget, props: NotebookPageProps): void;
+    protected insertBeforeInContainer(container: PageContainer, child: Gtk.Widget, props: NotebookPageProps, before: Gtk.Widget): void;
+    protected removeFromContainer(container: PageContainer, child: Gtk.Widget): void;
+    protected updateInContainer(container: PageContainer, child: Gtk.Widget, props: NotebookPageProps): void;
     updateProps(oldProps: Props, newProps: Props): void;
 }
+export {};

package/dist/nodes/notebook.js

@@ -1,7 +1,7 @@
 import * as Gtk from "@gtkx/ffi/gtk";
 import { isPageContainer } from "../container-interfaces.js";
 import { Node } from "../node.js";
-import { getStringProp } from "../props.js";
+import { VirtualSlotNode } from "./virtual-slot.js";
 export class NotebookNode extends Node {
     static matches(type) {
         return type === "Notebook" || type === "Notebook.Root";
@@ -49,71 +49,33 @@ export class NotebookNode extends Node {
         this.removePage(child);
     }
 }
-export class NotebookPageNode extends Node {
+export class NotebookPageNode extends VirtualSlotNode {
+    static consumedPropNames = ["label"];
     static matches(type) {
         return type === "Notebook.Page";
     }
-    isVirtual() {
-        return true;
+    isValidContainer(parent) {
+        return isPageContainer(parent);
     }
-    label = "";
-    childWidget = null;
-    parentContainer = null;
-    initialize(props) {
-        this.label = getStringProp(props, "label", "");
-        super.initialize(props);
+    extractSlotProps(props) {
+        return {
+            label: props.label ?? "",
+        };
     }
-    getLabel() {
-        return this.label;
+    addToContainer(container, child, props) {
+        container.addPage(child, props.label);
     }
-    setChildWidget(widget) {
-        this.childWidget = widget;
+    insertBeforeInContainer(container, child, props, before) {
+        container.insertPageBefore(child, props.label, before);
     }
-    getChildWidget() {
-        return this.childWidget;
+    removeFromContainer(container, child) {
+        container.removePage(child);
     }
-    appendChild(child) {
-        const childWidget = child.getWidget();
-        if (childWidget) {
-            this.childWidget = childWidget;
-        }
-    }
-    attachToParent(parent) {
-        if (isPageContainer(parent) && this.childWidget) {
-            this.parentContainer = parent;
-            parent.addPage(this.childWidget, this.label);
-        }
-    }
-    attachToParentBefore(parent, before) {
-        if (isPageContainer(parent) && this.childWidget) {
-            this.parentContainer = parent;
-            const beforePage = before instanceof NotebookPageNode ? before.getChildWidget() : before.getWidget();
-            if (beforePage) {
-                parent.insertPageBefore(this.childWidget, this.label, beforePage);
-            }
-            else {
-                parent.addPage(this.childWidget, this.label);
-            }
-        }
-    }
-    detachFromParent(parent) {
-        if (isPageContainer(parent) && this.childWidget) {
-            parent.removePage(this.childWidget);
-            this.parentContainer = null;
-        }
-    }
-    consumedProps() {
-        const consumed = super.consumedProps();
-        consumed.add("label");
-        return consumed;
+    updateInContainer(container, child, props) {
+        container.updatePageLabel(child, props.label);
     }
     updateProps(oldProps, newProps) {
-        if (oldProps.label !== newProps.label) {
-            this.label = getStringProp(newProps, "label", "");
-            if (this.parentContainer && this.childWidget) {
-                this.parentContainer.updatePageLabel(this.childWidget, this.label);
-            }
-        }
+        this.updateSlotPropsIfChanged(oldProps, newProps, ["label"]);
         super.updateProps(oldProps, newProps);
     }
 }

package/dist/nodes/paged-stack.d.ts

@@ -0,0 +1,39 @@
+import type * as Gtk from "@gtkx/ffi/gtk";
+import type { ChildContainer, StackPageContainer, StackPageProps } from "../container-interfaces.js";
+import type { Props } from "../factory.js";
+import { Node } from "../node.js";
+import { type StackPageLike } from "./stack-page-props.js";
+type StackWidget = Gtk.Widget & {
+    getChildByName(name: string): Gtk.Widget | null;
+    setVisibleChild(child: Gtk.Widget): void;
+    remove(child: Gtk.Widget): void;
+    getPage(child: Gtk.Widget): StackPageLike;
+};
+/**
+ * Abstract node for paged stack widgets (Gtk.Stack, Adw.ViewStack).
+ * Handles visible child deferral and common page operations.
+ */
+export declare abstract class PagedStackNode<T extends StackWidget> extends Node<T> implements StackPageContainer, ChildContainer {
+    static consumedPropNames: string[];
+    private pendingVisibleChildName;
+    /**
+     * Add a page to the stack widget. Must be implemented by subclasses
+     * due to API differences between Gtk.Stack and Adw.ViewStack.
+     */
+    abstract addStackPage(child: Gtk.Widget, props: StackPageProps): void;
+    /**
+     * Add a child directly to the stack widget (without page props).
+     * Must be implemented by subclasses due to API differences.
+     */
+    protected abstract addChildToWidget(child: Gtk.Widget): void;
+    protected applyPendingVisibleChild(): void;
+    insertStackPageBefore(child: Gtk.Widget, props: StackPageProps, _beforeChild: Gtk.Widget): void;
+    removeStackPage(child: Gtk.Widget): void;
+    updateStackPageProps(child: Gtk.Widget, props: StackPageProps): void;
+    attachChild(child: Gtk.Widget): void;
+    insertChildBefore(child: Gtk.Widget, _before: Gtk.Widget): void;
+    detachChild(child: Gtk.Widget): void;
+    private setVisibleChildOrDefer;
+    updateProps(oldProps: Props, newProps: Props): void;
+}
+export {};

package/dist/nodes/paged-stack.js

@@ -0,0 +1,54 @@
+import { Node } from "../node.js";
+import { applyStackPageProps } from "./stack-page-props.js";
+/**
+ * Abstract node for paged stack widgets (Gtk.Stack, Adw.ViewStack).
+ * Handles visible child deferral and common page operations.
+ */
+export class PagedStackNode extends Node {
+    static consumedPropNames = ["visibleChildName"];
+    pendingVisibleChildName = null;
+    applyPendingVisibleChild() {
+        if (this.pendingVisibleChildName !== null) {
+            const child = this.widget.getChildByName(this.pendingVisibleChildName);
+            if (child) {
+                this.widget.setVisibleChild(child);
+                this.pendingVisibleChildName = null;
+            }
+        }
+    }
+    insertStackPageBefore(child, props, _beforeChild) {
+        this.addStackPage(child, props);
+    }
+    removeStackPage(child) {
+        this.widget.remove(child);
+    }
+    updateStackPageProps(child, props) {
+        const page = this.widget.getPage(child);
+        applyStackPageProps(page, props);
+    }
+    attachChild(child) {
+        this.addChildToWidget(child);
+    }
+    insertChildBefore(child, _before) {
+        this.addChildToWidget(child);
+    }
+    detachChild(child) {
+        this.widget.remove(child);
+    }
+    setVisibleChildOrDefer(name) {
+        const child = this.widget.getChildByName(name);
+        if (child) {
+            this.widget.setVisibleChild(child);
+            this.pendingVisibleChildName = null;
+        }
+        else {
+            this.pendingVisibleChildName = name;
+        }
+    }
+    updateProps(oldProps, newProps) {
+        if (newProps.visibleChildName !== undefined) {
+            this.setVisibleChildOrDefer(newProps.visibleChildName);
+        }
+        super.updateProps(oldProps, newProps);
+    }
+}

package/dist/nodes/selectable-list.d.ts

@@ -0,0 +1,41 @@
+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";
+export type SelectableListState = {
+    itemsById: Map<string, unknown>;
+    itemOrder: string[];
+    committedOrder: string[];
+    stringList: Gtk.StringList;
+    selectionModel: Gtk.SingleSelection | Gtk.MultiSelection;
+    selectionMode: Gtk.SelectionMode;
+    selected: string[];
+    onSelectionChanged?: (ids: string[]) => void;
+    selectionHandlerId: number | null;
+    needsSync: boolean;
+    needsInitialSelection: boolean;
+};
+type SelectableListWidget = Gtk.Widget & {
+    setModel(model: Gtk.SelectionModel): void;
+};
+export declare abstract class SelectableListNode<T extends SelectableListWidget, S extends SelectableListState> extends Node<T, S> implements ItemContainer<unknown> {
+    protected initializeSelectionState(props: Props): SelectableListState;
+    protected applySelectionModel(): void;
+    protected cleanupSelection(): void;
+    protected updateSelectionProps(oldProps: Props, newProps: Props): void;
+    private recreateSelectionModel;
+    getItems(): unknown[];
+    getItemById(id: string): unknown;
+    addItem(id: string, data: unknown): void;
+    insertItemBefore(id: string, data: unknown, beforeId: string): void;
+    removeItem(id: string): void;
+    updateItem(id: string, data: unknown): void;
+    protected scheduleSync(): void;
+    protected syncModel: () => void;
+    protected applyInitialSelection(): void;
+    protected applySelection(ids: string[]): void;
+    protected getSelectedIds(): string[];
+    protected connectSelectionHandler(): void;
+    protected disconnectSelectionHandler(): void;
+}
+export {};

package/dist/nodes/selectable-list.js

@@ -0,0 +1,228 @@
+import { getInterface } 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 { scheduleFlush } from "../batch.js";
+import { Node } from "../node.js";
+import { getCallbackChange } from "../props.js";
+export class SelectableListNode extends Node {
+    initializeSelectionState(props) {
+        const selectionMode = props.selectionMode ?? Gtk.SelectionMode.SINGLE;
+        const stringList = new Gtk.StringList([]);
+        const listModel = getInterface(stringList.id, Gio.ListModel);
+        const selectionModel = selectionMode === Gtk.SelectionMode.MULTIPLE
+            ? new Gtk.MultiSelection(listModel)
+            : new Gtk.SingleSelection(listModel);
+        if (selectionModel instanceof Gtk.SingleSelection) {
+            selectionModel.setAutoselect(false);
+            selectionModel.setCanUnselect(true);
+        }
+        return {
+            itemsById: new Map(),
+            itemOrder: [],
+            committedOrder: [],
+            stringList,
+            selectionModel,
+            selectionMode,
+            selected: props.selected ?? [],
+            onSelectionChanged: props.onSelectionChanged,
+            selectionHandlerId: null,
+            needsSync: false,
+            needsInitialSelection: true,
+        };
+    }
+    applySelectionModel() {
+        this.widget.setModel(this.state.selectionModel);
+    }
+    cleanupSelection() {
+        this.disconnectSelectionHandler();
+    }
+    updateSelectionProps(oldProps, newProps) {
+        const oldSelectionMode = oldProps.selectionMode;
+        const newSelectionMode = newProps.selectionMode;
+        const effectiveOldMode = oldSelectionMode ?? Gtk.SelectionMode.SINGLE;
+        const effectiveNewMode = newSelectionMode ?? Gtk.SelectionMode.SINGLE;
+        if (effectiveOldMode !== effectiveNewMode) {
+            this.recreateSelectionModel(effectiveNewMode);
+        }
+        const oldCallback = oldProps.onSelectionChanged;
+        const newCallback = newProps.onSelectionChanged;
+        const change = getCallbackChange(oldCallback, newCallback);
+        if (change.action !== "none") {
+            this.state.onSelectionChanged = change.callback;
+            if (change.action === "disconnect") {
+                this.disconnectSelectionHandler();
+            }
+            else if (change.action === "connect") {
+                this.connectSelectionHandler();
+            }
+        }
+        const oldSelected = oldProps.selected;
+        const newSelected = newProps.selected;
+        if (oldSelected !== newSelected && newSelected !== undefined) {
+            this.state.selected = newSelected;
+            this.applySelection(newSelected);
+        }
+    }
+    recreateSelectionModel(newSelectionMode) {
+        const currentSelection = this.getSelectedIds();
+        const hadHandler = this.state.selectionHandlerId !== null;
+        this.disconnectSelectionHandler();
+        const listModel = getInterface(this.state.stringList.id, Gio.ListModel);
+        const newSelectionModel = newSelectionMode === Gtk.SelectionMode.MULTIPLE
+            ? new Gtk.MultiSelection(listModel)
+            : new Gtk.SingleSelection(listModel);
+        if (newSelectionModel instanceof Gtk.SingleSelection) {
+            newSelectionModel.setAutoselect(false);
+            newSelectionModel.setCanUnselect(true);
+        }
+        this.state.selectionModel = newSelectionModel;
+        this.state.selectionMode = newSelectionMode;
+        this.applySelectionModel();
+        this.applySelection(currentSelection);
+        if (hadHandler && this.state.onSelectionChanged) {
+            this.connectSelectionHandler();
+        }
+    }
+    getItems() {
+        return this.state.itemOrder.map((id) => this.state.itemsById.get(id));
+    }
+    getItemById(id) {
+        return this.state.itemsById.get(id);
+    }
+    addItem(id, data) {
+        this.state.itemsById.set(id, data);
+        const existingIndex = this.state.itemOrder.indexOf(id);
+        if (existingIndex !== -1) {
+            this.state.itemOrder.splice(existingIndex, 1);
+        }
+        this.state.itemOrder.push(id);
+        this.scheduleSync();
+    }
+    insertItemBefore(id, data, beforeId) {
+        this.state.itemsById.set(id, data);
+        const existingIndex = this.state.itemOrder.indexOf(id);
+        if (existingIndex !== -1) {
+            this.state.itemOrder.splice(existingIndex, 1);
+        }
+        const beforeIndex = this.state.itemOrder.indexOf(beforeId);
+        if (beforeIndex === -1) {
+            this.state.itemOrder.push(id);
+        }
+        else {
+            this.state.itemOrder.splice(beforeIndex, 0, id);
+        }
+        this.scheduleSync();
+    }
+    removeItem(id) {
+        const index = this.state.itemOrder.indexOf(id);
+        if (index !== -1) {
+            this.state.itemOrder.splice(index, 1);
+            this.state.itemsById.delete(id);
+            this.scheduleSync();
+        }
+    }
+    updateItem(id, data) {
+        if (this.state.itemsById.has(id)) {
+            this.state.itemsById.set(id, data);
+        }
+    }
+    scheduleSync() {
+        if (!this.state.needsSync) {
+            this.state.needsSync = true;
+            scheduleFlush(this.syncModel);
+        }
+    }
+    syncModel = () => {
+        if (!this.state.needsSync)
+            return;
+        this.state.needsSync = false;
+        const oldOrder = this.state.committedOrder;
+        const newOrder = this.state.itemOrder;
+        let firstDiff = 0;
+        const minLen = Math.min(oldOrder.length, newOrder.length);
+        while (firstDiff < minLen && oldOrder[firstDiff] === newOrder[firstDiff]) {
+            firstDiff++;
+        }
+        let oldEndOffset = 0;
+        let newEndOffset = 0;
+        while (oldEndOffset < oldOrder.length - firstDiff &&
+            newEndOffset < newOrder.length - firstDiff &&
+            oldOrder[oldOrder.length - 1 - oldEndOffset] === newOrder[newOrder.length - 1 - newEndOffset]) {
+            oldEndOffset++;
+            newEndOffset++;
+        }
+        const removeCount = oldOrder.length - firstDiff - oldEndOffset;
+        const addItems = newOrder.slice(firstDiff, newOrder.length - newEndOffset);
+        if (removeCount > 0 || addItems.length > 0) {
+            this.state.stringList.splice(firstDiff, removeCount, addItems);
+        }
+        this.state.committedOrder = [...newOrder];
+        if (this.state.needsInitialSelection && this.state.itemOrder.length > 0) {
+            this.state.needsInitialSelection = false;
+            queueMicrotask(() => {
+                if (this.hasParent()) {
+                    this.applyInitialSelection();
+                }
+            });
+        }
+    };
+    applyInitialSelection() {
+        this.applySelection(this.state.selected);
+        if (this.state.onSelectionChanged) {
+            this.connectSelectionHandler();
+            this.state.onSelectionChanged(this.getSelectedIds());
+        }
+    }
+    applySelection(ids) {
+        if (this.state.selectionMode === Gtk.SelectionMode.MULTIPLE) {
+            const multiSelection = this.state.selectionModel;
+            multiSelection.unselectAll();
+            for (const id of ids) {
+                const index = this.state.itemOrder.indexOf(id);
+                if (index !== -1) {
+                    multiSelection.selectItem(index, false);
+                }
+            }
+        }
+        else {
+            const singleSelection = this.state.selectionModel;
+            const firstId = ids[0];
+            if (firstId !== undefined) {
+                const index = this.state.itemOrder.indexOf(firstId);
+                if (index !== -1) {
+                    singleSelection.setSelected(index);
+                }
+            }
+            else {
+                singleSelection.setSelected(Gtk.INVALID_LIST_POSITION);
+            }
+        }
+    }
+    getSelectedIds() {
+        const selection = this.state.selectionModel.getSelection();
+        const count = Number(selection.getSize());
+        const selectedIds = [];
+        for (let i = 0; i < count; i++) {
+            const position = selection.getNth(i);
+            const id = this.state.itemOrder[position];
+            if (id !== undefined) {
+                selectedIds.push(id);
+            }
+        }
+        return selectedIds;
+    }
+    connectSelectionHandler() {
+        if (this.state.selectionHandlerId !== null)
+            return;
+        this.state.selectionHandlerId = this.state.selectionModel.connect("selection-changed", () => {
+            this.state.onSelectionChanged?.(this.getSelectedIds());
+        });
+    }
+    disconnectSelectionHandler() {
+        if (this.state.selectionHandlerId !== null) {
+            GObject.signalHandlerDisconnect(this.state.selectionModel, this.state.selectionHandlerId);
+            this.state.selectionHandlerId = null;
+        }
+    }
+}

package/dist/nodes/stack-page-props.d.ts

@@ -0,0 +1,11 @@
+import type { StackPageProps } from "../container-interfaces.js";
+export type StackPageLike = {
+    setName(name: string): void;
+    setTitle(title: string): void;
+    setIconName(iconName: string): void;
+    setNeedsAttention(needsAttention: boolean): void;
+    setVisible(visible: boolean): void;
+    setUseUnderline(useUnderline: boolean): void;
+    setBadgeNumber?(badgeNumber: number): void;
+};
+export declare function applyStackPageProps(page: StackPageLike, props: StackPageProps): void;

package/dist/nodes/stack-page-props.js

@@ -0,0 +1,23 @@
+export function applyStackPageProps(page, props) {
+    if (props.name !== undefined) {
+        page.setName(props.name);
+    }
+    if (props.title !== undefined) {
+        page.setTitle(props.title);
+    }
+    if (props.iconName !== undefined) {
+        page.setIconName(props.iconName);
+    }
+    if (props.needsAttention !== undefined) {
+        page.setNeedsAttention(props.needsAttention);
+    }
+    if (props.visible !== undefined) {
+        page.setVisible(props.visible);
+    }
+    if (props.useUnderline !== undefined) {
+        page.setUseUnderline(props.useUnderline);
+    }
+    if (props.badgeNumber !== undefined && page.setBadgeNumber) {
+        page.setBadgeNumber(props.badgeNumber);
+    }
+}

package/dist/nodes/stack.d.ts

@@ -1,36 +1,22 @@
 import type * as Gtk from "@gtkx/ffi/gtk";
-import { type ChildContainer, type StackPageContainer, type StackPageProps } from "../container-interfaces.js";
+import { 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 {
+import type { Node } from "../node.js";
+import { PagedStackNode } from "./paged-stack.js";
+import { VirtualSlotNode } from "./virtual-slot.js";
+export declare class StackNode extends PagedStackNode<Gtk.Stack> {
     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>;
-    private setVisibleChildOrDefer;
-    updateProps(oldProps: Props, newProps: Props): void;
+    protected addChildToWidget(child: Gtk.Widget): void;
 }
-export declare class StackPageNode extends Node {
+export declare class StackPageNode extends VirtualSlotNode<StackPageContainer, StackPageProps> {
+    static consumedPropNames: string[];
     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>;
+    protected isValidContainer(parent: Node): parent is Node & StackPageContainer;
+    protected extractSlotProps(props: Props): StackPageProps;
+    protected addToContainer(container: StackPageContainer, child: Gtk.Widget, props: StackPageProps): void;
+    protected insertBeforeInContainer(container: StackPageContainer, child: Gtk.Widget, props: StackPageProps, before: Gtk.Widget): void;
+    protected removeFromContainer(container: StackPageContainer, child: Gtk.Widget): void;
+    protected updateInContainer(container: StackPageContainer, child: Gtk.Widget, props: StackPageProps): void;
     updateProps(oldProps: Props, newProps: Props): void;
 }