@gtkx/react 0.9.4 → 0.10.0

package/dist/nodes/slot.js

@@ -1,67 +1,99 @@
-import { Node } from "../node.js";
-export class SlotNode extends Node {
+import { toCamelCase } from "@gtkx/gir";
+import { PROPS } from "../generated/internal.js";
+import { registerNodeClass } from "../registry.js";
+import { scheduleAfterCommit } from "../scheduler.js";
+import { VirtualNode } from "./virtual.js";
+import { WidgetNode } from "./widget.js";
+export class SlotNode extends VirtualNode {
+    static priority = 2;
     static matches(type) {
-        if (!type.includes("."))
-            return false;
-        const parts = type.split(".");
-        if (parts.length !== 2)
-            return false;
-        const suffix = parts[1];
-        return suffix !== "Root";
+        return type === "Slot";
     }
-    isVirtual() {
-        return true;
+    parent;
+    child;
+    setParent(parent) {
+        this.parent = parent;
     }
-    child = null;
-    slotName;
-    constructor(type) {
-        super(type);
-        const dotIndex = type.indexOf(".");
-        if (dotIndex === -1) {
-            throw new Error(`Invalid slot type: ${type}`);
+    unmount() {
+        if (this.parent && this.child) {
+            const oldChild = this.child;
+            this.child = undefined;
+            this.onChildChange(oldChild);
+        }
+        this.parent = undefined;
+        super.unmount();
+    }
+    getId() {
+        const id = this.props.id;
+        if (!id) {
+            throw new Error("Expected 'id' prop to be present on Slot");
         }
-        this.slotName = type.substring(dotIndex + 1);
+        return toCamelCase(id);
     }
-    updateParentSlot() {
-        if (!this.parent)
-            return;
-        const parentWidget = this.parent.getWidget();
-        const childWidget = this.child?.getWidget();
-        if (!parentWidget)
-            return;
-        const setterName = `set${this.slotName}`;
-        const setter = parentWidget[setterName];
-        if (typeof setter === "function") {
-            setter.call(parentWidget, childWidget?.id ?? null);
+    getParent() {
+        if (!this.parent) {
+            throw new Error(`Expected parent widget to be set on '${this.getId()}' SlotNode`);
         }
+        return this.parent;
+    }
+    getChild() {
+        if (!this.child) {
+            throw new Error(`Expected child widget to be set on '${this.getId()}' SlotNode`);
+        }
+        return this.child;
     }
     appendChild(child) {
-        child.parent = this;
-        if (child.getWidget()) {
-            this.child = child;
-            this.updateParentSlot();
+        if (!(child instanceof WidgetNode)) {
+            throw new Error(`Cannot append '${child.typeName}' to 'Slot': expected Widget`);
         }
+        const oldChild = this.child;
+        this.child = child.container;
+        scheduleAfterCommit(() => {
+            if (this.parent) {
+                this.onChildChange(oldChild);
+            }
+        });
     }
-    removeChild(child) {
-        child.unmount();
-        this.child = null;
-        this.updateParentSlot();
-        child.parent = null;
+    removeChild() {
+        const oldChild = this.child;
+        scheduleAfterCommit(() => {
+            if (oldChild === this.child) {
+                this.child = undefined;
+            }
+            if (this.parent) {
+                this.onChildChange(oldChild);
+            }
+        });
     }
-    mount() {
-        this.updateParentSlot();
+    onChildChange(oldChild) {
+        const parent = this.getParent();
+        const parentType = parent.constructor.glibTypeName;
+        const [_, setterName] = PROPS[parentType]?.[this.getId()] ?? [];
+        if (!setterName) {
+            throw new Error(`Unable to find property for Slot '${this.getId()}' on type '${parentType}'`);
+        }
+        const setter = parent[setterName];
+        if (typeof setter !== "function") {
+            throw new Error(`Expected setter function for Slot '${this.getId()}' on type '${parentType}'`);
+        }
+        if (oldChild && !this.child) {
+            const root = oldChild.getRoot();
+            const focusWidget = root?.getFocus?.();
+            if (focusWidget && this.isDescendantOf(focusWidget, oldChild)) {
+                parent.grabFocus();
+            }
+        }
+        setter.call(parent, this.child);
     }
-    unmount() {
-        if (this.parent) {
-            const parentWidget = this.parent.getWidget();
-            if (parentWidget) {
-                const setterName = `set${this.slotName}`;
-                const setter = parentWidget[setterName];
-                if (typeof setter === "function") {
-                    setter.call(parentWidget, null);
-                }
+    isDescendantOf(widget, ancestor) {
+        let current = widget;
+        while (current) {
+            if (current.equals(ancestor)) {
+                return true;
             }
+            current = current.getParent();
         }
-        super.unmount();
+        return false;
     }
 }
+registerNodeClass(SlotNode);

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

@@ -0,0 +1 @@
+export {};

package/dist/nodes/stack-page.js

@@ -0,0 +1,80 @@
+import * as Adw from "@gtkx/ffi/adw";
+import { registerNodeClass } from "../registry.js";
+import { SlotNode } from "./slot.js";
+class StackPageNode extends SlotNode {
+    static priority = 1;
+    page;
+    static matches(type) {
+        return type === "StackPage";
+    }
+    updateProps(oldProps, newProps) {
+        super.updateProps(oldProps, newProps);
+        if (!this.page) {
+            return;
+        }
+        if (newProps.title && (!oldProps || oldProps.title !== newProps.title)) {
+            this.page.setTitle(newProps.title);
+        }
+        if (newProps.iconName && (!oldProps || oldProps.iconName !== newProps.iconName)) {
+            this.page.setIconName(newProps.iconName);
+        }
+        if (!oldProps || oldProps.needsAttention !== newProps.needsAttention) {
+            this.page.setNeedsAttention(newProps.needsAttention ?? false);
+        }
+        if (!oldProps || oldProps.visible !== newProps.visible) {
+            this.page.setVisible(newProps.visible ?? true);
+        }
+        if (!oldProps || oldProps.useUnderline !== newProps.useUnderline) {
+            this.page.setUseUnderline(newProps.useUnderline ?? false);
+        }
+        if ("setBadgeNumber" in this.page && (!oldProps || oldProps.badgeNumber !== newProps.badgeNumber)) {
+            this.page.setBadgeNumber?.(newProps.badgeNumber ?? 0);
+        }
+    }
+    addPage() {
+        const child = this.getChild();
+        const parent = this.getParent();
+        let page;
+        if (parent instanceof Adw.ViewStack) {
+            if (this.props.title && this.props.iconName) {
+                page = parent.addTitledWithIcon(child, this.props.title, this.props.iconName, this.props.name);
+            }
+            else if (this.props.title) {
+                page = parent.addTitled(child, this.props.title, this.props.name);
+            }
+            else if (this.props.name) {
+                page = parent.addNamed(child, this.props.name);
+            }
+            else {
+                page = parent.add(child);
+            }
+        }
+        else {
+            if (this.props.title) {
+                page = parent.addTitled(child, this.props.title, this.props.name);
+            }
+            else if (this.props.name) {
+                page = parent.addNamed(child, this.props.name);
+            }
+            else {
+                page = parent.addChild(child);
+            }
+        }
+        this.page = page;
+        this.updateProps(null, this.props);
+    }
+    removePage(oldChild) {
+        const parent = this.getParent();
+        if (!oldChild) {
+            return;
+        }
+        parent.remove(oldChild);
+    }
+    onChildChange(oldChild) {
+        this.removePage(oldChild);
+        if (this.child) {
+            this.addPage();
+        }
+    }
+}
+registerNodeClass(StackPageNode);

package/dist/nodes/stack.d.ts

@@ -1,22 +1 @@
-import type * as Gtk from "@gtkx/ffi/gtk";
-import type { StackPageContainer, StackPageProps } from "../containers.js";
-import type { Props } from "../factory.js";
-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;
-    addStackPage(child: Gtk.Widget, props: StackPageProps): void;
-    protected addChildToWidget(child: Gtk.Widget): void;
-}
-export declare class StackPageNode extends VirtualSlotNode<StackPageContainer, StackPageProps> {
-    static consumedPropNames: string[];
-    static matches(type: string): boolean;
-    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;
-}
+export {};

package/dist/nodes/stack.js

@@ -1,64 +1,25 @@
-import { isStackPageContainer } from "../predicates.js";
-import { PagedStackNode } from "./paged-stack.js";
-import { applyStackPageProps } from "./stack-page-props.js";
-import { VirtualSlotNode } from "./virtual-slot.js";
-const STACK_PAGE_PROP_KEYS = ["name", "title", "iconName", "needsAttention", "visible", "useUnderline", "badgeNumber"];
-export class StackNode extends PagedStackNode {
-    static matches(type) {
-        return type === "Stack" || type === "Stack.Root";
-    }
-    addStackPage(child, props) {
-        const { name, title } = props;
-        let stackPage;
-        if (title !== undefined) {
-            stackPage = this.widget.addTitled(child, title, name);
-        }
-        else if (name !== undefined) {
-            stackPage = this.widget.addNamed(child, name);
-        }
-        else {
-            stackPage = this.widget.addChild(child);
-        }
-        applyStackPageProps(stackPage, props);
-        this.applyPendingVisibleChild();
-    }
-    addChildToWidget(child) {
-        this.widget.addChild(child);
-    }
-}
-export class StackPageNode extends VirtualSlotNode {
-    static consumedPropNames = STACK_PAGE_PROP_KEYS;
-    static matches(type) {
-        return type === "Stack.Page" || type === "AdwViewStack.Page";
-    }
-    isValidContainer(parent) {
-        return isStackPageContainer(parent);
-    }
-    extractSlotProps(props) {
-        return {
-            name: props.name,
-            title: props.title,
-            iconName: props.iconName,
-            needsAttention: props.needsAttention,
-            visible: props.visible,
-            useUnderline: props.useUnderline,
-            badgeNumber: props.badgeNumber,
-        };
-    }
-    addToContainer(container, child, props) {
-        container.addStackPage(child, props);
-    }
-    insertBeforeInContainer(container, child, props, before) {
-        container.insertStackPageBefore(child, props, before);
-    }
-    removeFromContainer(container, child) {
-        container.removeStackPage(child);
-    }
-    updateInContainer(container, child, props) {
-        container.updateStackPageProps(child, props);
+import * as Adw from "@gtkx/ffi/adw";
+import * as Gtk from "@gtkx/ffi/gtk";
+import { registerNodeClass } from "../registry.js";
+import { scheduleAfterCommit } from "../scheduler.js";
+import { filterProps, isContainerType } from "./internal/utils.js";
+import { WidgetNode } from "./widget.js";
+const PROPS = ["visibleChildName"];
+class StackNode extends WidgetNode {
+    static priority = 1;
+    static matches(_type, containerOrClass) {
+        return isContainerType(Gtk.Stack, containerOrClass) || isContainerType(Adw.ViewStack, containerOrClass);
     }
     updateProps(oldProps, newProps) {
-        this.updateSlotPropsIfChanged(oldProps, newProps, STACK_PAGE_PROP_KEYS);
-        super.updateProps(oldProps, newProps);
+        if (newProps.visibleChildName && this.container.getVisibleChildName() !== newProps.visibleChildName) {
+            const visibleChildName = newProps.visibleChildName;
+            scheduleAfterCommit(() => {
+                if (this.container.getChildByName(visibleChildName)) {
+                    this.container.setVisibleChildName(visibleChildName);
+                }
+            });
+        }
+        super.updateProps(filterProps(oldProps ?? {}, PROPS), filterProps(newProps, PROPS));
     }
 }
+registerNodeClass(StackNode);

package/dist/nodes/toast-overlay.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/nodes/toast-overlay.js

@@ -0,0 +1,35 @@
+import * as Adw from "@gtkx/ffi/adw";
+import { registerNodeClass } from "../registry.js";
+import { isContainerType } from "./internal/utils.js";
+import { ToastNode } from "./toast.js";
+import { WidgetNode } from "./widget.js";
+class ToastOverlayNode extends WidgetNode {
+    static priority = 1;
+    static matches(_type, containerOrClass) {
+        return isContainerType(Adw.ToastOverlay, containerOrClass);
+    }
+    appendChild(child) {
+        if (child instanceof ToastNode) {
+            child.setParent(this.container);
+            return;
+        }
+        if (child instanceof WidgetNode) {
+            this.container.setChild(child.container);
+            return;
+        }
+        throw new Error(`Cannot append '${child.typeName}' to 'ToastOverlay': expected Widget or Toast`);
+    }
+    insertBefore(child, _before) {
+        this.appendChild(child);
+    }
+    removeChild(child) {
+        if (child instanceof ToastNode) {
+            child.unmount();
+            return;
+        }
+        if (child instanceof WidgetNode) {
+            this.container.setChild(undefined);
+        }
+    }
+}
+registerNodeClass(ToastOverlayNode);

package/dist/nodes/toast.d.ts

@@ -0,0 +1,17 @@
+import * as Adw from "@gtkx/ffi/adw";
+import type { ToastProps } from "../jsx.js";
+import { VirtualNode } from "./virtual.js";
+type Props = ToastProps;
+export declare class ToastNode extends VirtualNode<Props> {
+    static priority: number;
+    static matches(type: string): boolean;
+    private toast?;
+    private parent?;
+    setParent(parent?: Adw.ToastOverlay): void;
+    private createToast;
+    private showToast;
+    updateProps(oldProps: Props | null, newProps: Props): void;
+    mount(): void;
+    unmount(): void;
+}
+export {};

package/dist/nodes/toast.js

@@ -0,0 +1,77 @@
+import * as Adw from "@gtkx/ffi/adw";
+import { registerNodeClass } from "../registry.js";
+import { VirtualNode } from "./virtual.js";
+export class ToastNode extends VirtualNode {
+    static priority = 1;
+    static matches(type) {
+        return type === "Toast";
+    }
+    toast;
+    parent;
+    setParent(parent) {
+        this.parent = parent;
+    }
+    createToast() {
+        const toast = new Adw.Toast(this.props.title);
+        if (this.props.timeout !== undefined) {
+            toast.setTimeout(this.props.timeout);
+        }
+        if (this.props.priority !== undefined) {
+            toast.setPriority(this.props.priority);
+        }
+        if (this.props.buttonLabel) {
+            toast.setButtonLabel(this.props.buttonLabel);
+        }
+        if (this.props.actionName) {
+            toast.setActionName(this.props.actionName);
+        }
+        if (this.props.useMarkup !== undefined) {
+            toast.setUseMarkup(this.props.useMarkup);
+        }
+        return toast;
+    }
+    showToast() {
+        if (!this.parent || this.toast)
+            return;
+        this.toast = this.createToast();
+        if (this.props.onButtonClicked) {
+            this.signalStore.set(this.toast, "button-clicked", () => {
+                this.props.onButtonClicked?.();
+            });
+        }
+        this.signalStore.set(this.toast, "dismissed", () => {
+            this.props.onDismissed?.();
+        });
+        this.parent.addToast(this.toast);
+    }
+    updateProps(oldProps, newProps) {
+        super.updateProps(oldProps, newProps);
+        if (!this.toast)
+            return;
+        if (!oldProps || oldProps.title !== newProps.title) {
+            this.toast.setTitle(newProps.title);
+        }
+        if (!oldProps || oldProps.buttonLabel !== newProps.buttonLabel) {
+            this.toast.setButtonLabel(newProps.buttonLabel);
+        }
+        if (!oldProps || oldProps.actionName !== newProps.actionName) {
+            this.toast.setActionName(newProps.actionName);
+        }
+        if (!oldProps || oldProps.useMarkup !== newProps.useMarkup) {
+            this.toast.setUseMarkup(newProps.useMarkup ?? false);
+        }
+    }
+    mount() {
+        super.mount();
+        this.showToast();
+    }
+    unmount() {
+        if (this.toast) {
+            this.toast.dismiss();
+            this.props.onDismissed?.();
+        }
+        this.parent = undefined;
+        super.unmount();
+    }
+}
+registerNodeClass(ToastNode);

package/dist/nodes/toolbar-child.d.ts

@@ -0,0 +1,9 @@
+import type * as Gtk from "@gtkx/ffi/gtk";
+import { SlotNode } from "./slot.js";
+export declare class ToolbarChildNode extends SlotNode {
+    static priority: number;
+    static matches(type: string): boolean;
+    private getToolbar;
+    private getPosition;
+    protected onChildChange(oldChild: Gtk.Widget | undefined): void;
+}

package/dist/nodes/toolbar-child.js

@@ -0,0 +1,33 @@
+import { registerNodeClass } from "../registry.js";
+import { SlotNode } from "./slot.js";
+export class ToolbarChildNode extends SlotNode {
+    static priority = 1;
+    static matches(type) {
+        return type === "Toolbar.Top" || type === "Toolbar.Bottom";
+    }
+    getToolbar() {
+        if (!this.parent) {
+            throw new Error("Expected ToolbarView reference to be set on ToolbarChildNode");
+        }
+        return this.parent;
+    }
+    getPosition() {
+        return this.typeName === "Toolbar.Top" ? "top" : "bottom";
+    }
+    onChildChange(oldChild) {
+        const toolbar = this.getToolbar();
+        if (oldChild) {
+            toolbar.remove(oldChild);
+        }
+        if (this.child) {
+            const position = this.getPosition();
+            if (position === "top") {
+                toolbar.addTopBar(this.child);
+            }
+            else {
+                toolbar.addBottomBar(this.child);
+            }
+        }
+    }
+}
+registerNodeClass(ToolbarChildNode);

package/dist/nodes/toolbar.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/nodes/toolbar.js

@@ -0,0 +1,42 @@
+import * as Adw from "@gtkx/ffi/adw";
+import { registerNodeClass } from "../registry.js";
+import { isContainerType } from "./internal/utils.js";
+import { ToolbarChildNode } from "./toolbar-child.js";
+import { WidgetNode } from "./widget.js";
+class ToolbarNode extends WidgetNode {
+    static priority = 0;
+    static matches(_type, containerOrClass) {
+        return isContainerType(Adw.ToolbarView, containerOrClass);
+    }
+    appendChild(child) {
+        if (child instanceof ToolbarChildNode) {
+            child.setParent(this.container);
+            return;
+        }
+        if (!(child instanceof WidgetNode)) {
+            throw new Error(`Cannot append '${child.typeName}' to 'ToolbarView': expected Widget`);
+        }
+        this.container.setContent(child.container);
+    }
+    insertBefore(child) {
+        if (child instanceof ToolbarChildNode) {
+            child.setParent(this.container);
+            return;
+        }
+        if (!(child instanceof WidgetNode)) {
+            throw new Error(`Cannot insert '${child.typeName}' to 'ToolbarView': expected Widget`);
+        }
+        this.container.setContent(child.container);
+    }
+    removeChild(child) {
+        if (child instanceof ToolbarChildNode) {
+            child.unmount();
+            return;
+        }
+        if (!(child instanceof WidgetNode)) {
+            throw new Error(`Cannot remove '${child.typeName}' from 'ToolbarView': expected Widget`);
+        }
+        this.container.setContent(undefined);
+    }
+}
+registerNodeClass(ToolbarNode);

package/dist/nodes/tree-list-item.d.ts

@@ -0,0 +1,20 @@
+import type { TreeListItemProps } from "../jsx.js";
+import type { Node } from "../node.js";
+import type { TreeStore } from "./internal/tree-store.js";
+import { VirtualNode } from "./virtual.js";
+type Props = Partial<TreeListItemProps>;
+export declare class TreeListItemNode extends VirtualNode<Props> {
+    static priority: number;
+    private store?;
+    private parentItemId?;
+    private childNodes;
+    static matches(type: string): boolean;
+    setStore(store?: TreeStore): void;
+    setParentItemId(parentId?: string): void;
+    getParentItemId(): string | undefined;
+    appendChild(child: Node): void;
+    insertBefore(child: Node, before: Node): void;
+    removeChild(child: Node): void;
+    updateProps(oldProps: Props | null, newProps: Props): void;
+}
+export {};