@gtkx/react 0.6.1 → 0.7.0

package/dist/nodes/virtual-slot.js

@@ -0,0 +1,71 @@
+import { Node } from "../node.js";
+export class VirtualSlotNode extends Node {
+    isVirtual() {
+        return true;
+    }
+    childWidget = null;
+    parentContainer = null;
+    _slotProps;
+    get slotProps() {
+        if (this._slotProps === undefined) {
+            throw new Error("slotProps accessed before initialization");
+        }
+        return this._slotProps;
+    }
+    set slotProps(value) {
+        this._slotProps = value;
+    }
+    initialize(props) {
+        this.slotProps = this.extractSlotProps(props);
+        super.initialize(props);
+    }
+    getChildWidget() {
+        return this.childWidget;
+    }
+    appendChild(child) {
+        const childWidget = child.getWidget();
+        if (childWidget) {
+            this.childWidget = childWidget;
+        }
+    }
+    attachToParent(parent) {
+        if (this.isValidContainer(parent) && this.childWidget) {
+            this.parentContainer = parent;
+            this.addToContainer(parent, this.childWidget, this.slotProps);
+        }
+    }
+    attachToParentBefore(parent, before) {
+        if (this.isValidContainer(parent) && this.childWidget) {
+            this.parentContainer = parent;
+            const beforeWidget = this.getBeforeWidget(before);
+            if (beforeWidget) {
+                this.insertBeforeInContainer(parent, this.childWidget, this.slotProps, beforeWidget);
+            }
+            else {
+                this.addToContainer(parent, this.childWidget, this.slotProps);
+            }
+        }
+    }
+    getBeforeWidget(before) {
+        if (before instanceof VirtualSlotNode) {
+            return before.getChildWidget();
+        }
+        return before.getWidget() ?? null;
+    }
+    detachFromParent(parent) {
+        if (this.isValidContainer(parent) && this.childWidget) {
+            this.removeFromContainer(parent, this.childWidget);
+            this.parentContainer = null;
+        }
+    }
+    updateSlotPropsIfChanged(oldProps, newProps, propKeys) {
+        const changed = propKeys.some((key) => oldProps[key] !== newProps[key]);
+        if (changed) {
+            this.slotProps = this.extractSlotProps(newProps);
+            if (this.parentContainer && this.childWidget) {
+                this.updateInContainer(this.parentContainer, this.childWidget, this.slotProps);
+            }
+        }
+        return changed;
+    }
+}

package/dist/nodes/widget.d.ts

@@ -7,7 +7,4 @@ import { Node } from "../node.js";
  */
 export declare class WidgetNode extends Node<Gtk.Widget> {
     static matches(_type: string): boolean;
-    attachToParent(parent: Node): void;
-    attachToParentBefore(parent: Node, before: Node): void;
-    detachFromParent(parent: Node): void;
 }

package/dist/nodes/widget.js

@@ -1,4 +1,3 @@
-import { isChildContainer } from "../container-interfaces.js";
 import { Node } from "../node.js";
 /**
  * Catch-all node for standard GTK widgets that don't need special handling.
@@ -9,31 +8,4 @@ export class WidgetNode extends Node {
     static matches(_type) {
         return true;
     }
-    attachToParent(parent) {
-        if (isChildContainer(parent)) {
-            parent.attachChild(this.widget);
-            return;
-        }
-        super.attachToParent(parent);
-    }
-    attachToParentBefore(parent, before) {
-        if (isChildContainer(parent)) {
-            const beforeWidget = before.getWidget();
-            if (beforeWidget) {
-                parent.insertChildBefore(this.widget, beforeWidget);
-            }
-            else {
-                parent.attachChild(this.widget);
-            }
-            return;
-        }
-        super.attachToParentBefore(parent, before);
-    }
-    detachFromParent(parent) {
-        if (isChildContainer(parent)) {
-            parent.detachChild(this.widget);
-            return;
-        }
-        super.detachFromParent(parent);
-    }
 }

package/dist/nodes/window.d.ts

@@ -2,10 +2,10 @@ import * as Gtk from "@gtkx/ffi/gtk";
 import type { Props } from "../factory.js";
 import { Node } from "../node.js";
 export declare class WindowNode extends Node<Gtk.Window> {
+    static consumedPropNames: string[];
     static matches(type: string): boolean;
     protected createWidget(type: string, _props: Props): Gtk.Window;
     detachFromParent(_parent: Node): void;
     mount(): void;
-    protected consumedProps(): Set<string>;
     updateProps(oldProps: Props, newProps: Props): void;
 }

package/dist/nodes/window.js

@@ -1,22 +1,22 @@
 import { getCurrentApp } from "@gtkx/ffi";
 import * as Adw from "@gtkx/ffi/adw";
 import * as Gtk from "@gtkx/ffi/gtk";
-import { Node } from "../node.js";
-import { getNumberProp } from "../props.js";
+import { Node, normalizeWidgetType } from "../node.js";
 const WINDOW_TYPES = new Set(["Window", "ApplicationWindow", "AdwWindow", "AdwApplicationWindow"]);
 export class WindowNode extends Node {
+    static consumedPropNames = ["defaultWidth", "defaultHeight"];
     static matches(type) {
-        return WINDOW_TYPES.has(type.split(".")[0] || type);
+        return WINDOW_TYPES.has(normalizeWidgetType(type));
     }
     createWidget(type, _props) {
-        const normalizedType = type.split(".")[0] || type;
-        if (normalizedType === "ApplicationWindow") {
+        const widgetType = normalizeWidgetType(type);
+        if (widgetType === "ApplicationWindow") {
             return new Gtk.ApplicationWindow(getCurrentApp());
         }
-        if (normalizedType === "AdwApplicationWindow") {
+        if (widgetType === "AdwApplicationWindow") {
             return new Adw.ApplicationWindow(getCurrentApp());
         }
-        if (normalizedType === "AdwWindow") {
+        if (widgetType === "AdwWindow") {
             return new Adw.Window();
         }
         return new Gtk.Window();
@@ -27,18 +27,12 @@ export class WindowNode extends Node {
     mount() {
         this.widget.present();
     }
-    consumedProps() {
-        const consumed = super.consumedProps();
-        consumed.add("defaultWidth");
-        consumed.add("defaultHeight");
-        return consumed;
-    }
     updateProps(oldProps, newProps) {
         const widthChanged = oldProps.defaultWidth !== newProps.defaultWidth;
         const heightChanged = oldProps.defaultHeight !== newProps.defaultHeight;
         if (widthChanged || heightChanged) {
-            const width = getNumberProp(newProps, "defaultWidth", -1);
-            const height = getNumberProp(newProps, "defaultHeight", -1);
+            const width = newProps.defaultWidth ?? -1;
+            const height = newProps.defaultHeight ?? -1;
             this.widget.setDefaultSize(width, height);
         }
         super.updateProps(oldProps, newProps);

package/dist/predicates.d.ts

@@ -27,4 +27,12 @@ export declare const isSingleChild: (widget: Gtk.Widget) => widget is SingleChil
  * Type guard that checks if a GTK widget supports removing children via a remove method.
  */
 export declare const isRemovable: (widget: Gtk.Widget) => widget is Removable;
+/**
+ * Type guard that checks if a GTK widget is a FlowBoxChild.
+ */
+export declare const isFlowBoxChild: (widget: Gtk.Widget) => widget is Gtk.FlowBoxChild;
+/**
+ * Type guard that checks if a GTK widget is a ListBoxRow.
+ */
+export declare const isListBoxRow: (widget: Gtk.Widget) => widget is Gtk.ListBoxRow;
 export {};

package/dist/predicates.js

@@ -14,3 +14,11 @@ export const isSingleChild = (widget) => "setChild" in widget && typeof widget.s
  * Type guard that checks if a GTK widget supports removing children via a remove method.
  */
 export const isRemovable = (widget) => "remove" in widget && typeof widget.remove === "function";
+/**
+ * Type guard that checks if a GTK widget is a FlowBoxChild.
+ */
+export const isFlowBoxChild = (widget) => "getIndex" in widget && "getChild" in widget && typeof widget.getIndex === "function";
+/**
+ * Type guard that checks if a GTK widget is a ListBoxRow.
+ */
+export const isListBoxRow = (widget) => "getIndex" in widget && "isSelected" in widget && typeof widget.getIndex === "function";

package/dist/props.d.ts

@@ -1,5 +1,7 @@
-import type { Props } from "./factory.js";
-/** Extracts a number property from props with a default value. */
-export declare const getNumberProp: (props: Props, key: string, defaultValue: number) => number;
-/** Extracts a string property from props with a default value. */
-export declare const getStringProp: (props: Props, key: string, defaultValue: string) => string;
+type CallbackAction = "connect" | "disconnect" | "none";
+type CallbackChange<T> = {
+    callback: T | undefined;
+    action: CallbackAction;
+};
+export declare const getCallbackChange: <T>(oldCallback: T | undefined, newCallback: T | undefined) => CallbackChange<T>;
+export {};

package/dist/props.js

@@ -1,10 +1,12 @@
-/** Extracts a number property from props with a default value. */
-export const getNumberProp = (props, key, defaultValue) => {
-    const value = props[key];
-    return typeof value === "number" ? value : defaultValue;
-};
-/** Extracts a string property from props with a default value. */
-export const getStringProp = (props, key, defaultValue) => {
-    const value = props[key];
-    return typeof value === "string" ? value : defaultValue;
+export const getCallbackChange = (oldCallback, newCallback) => {
+    if (oldCallback === newCallback) {
+        return { callback: newCallback, action: "none" };
+    }
+    if (oldCallback && !newCallback) {
+        return { callback: undefined, action: "disconnect" };
+    }
+    if (!oldCallback && newCallback) {
+        return { callback: newCallback, action: "connect" };
+    }
+    return { callback: newCallback, action: "none" };
 };

package/dist/reconciler/host-config.d.ts

@@ -0,0 +1,19 @@
+import type * as Gtk from "@gtkx/ffi/gtk";
+import type ReactReconciler from "react-reconciler";
+import { type Props, type ROOT_NODE_CONTAINER } from "../factory.js";
+import type { Node } from "../node.js";
+type Container = Gtk.Widget | typeof ROOT_NODE_CONTAINER;
+type TextInstance = Node;
+type SuspenseInstance = never;
+type HydratableInstance = never;
+type PublicInstance = Gtk.Widget;
+type HostContext = Record<string, never>;
+type ChildSet = never;
+type TimeoutHandle = number;
+type NoTimeout = -1;
+type TransitionStatus = number;
+type FormInstance = never;
+type HostConfig = ReactReconciler.HostConfig<string, Props, Container, Node, TextInstance, SuspenseInstance, HydratableInstance, FormInstance, PublicInstance, HostContext, ChildSet, TimeoutHandle, NoTimeout, TransitionStatus>;
+export type ReconcilerInstance = ReactReconciler.Reconciler<Container, Node, TextInstance, SuspenseInstance, FormInstance, PublicInstance>;
+export declare function createHostConfig(createNodeFromContainer: (container: Container) => Node): HostConfig;
+export {};

package/dist/reconciler/host-config.js

@@ -0,0 +1,89 @@
+import { beginBatch, endBatch } from "@gtkx/ffi";
+import React from "react";
+import { beginCommit, endCommit } from "../batch.js";
+import { createNode } from "../factory.js";
+export function createHostConfig(createNodeFromContainer) {
+    return {
+        supportsMutation: true,
+        supportsPersistence: false,
+        supportsHydration: false,
+        isPrimaryRenderer: true,
+        noTimeout: -1,
+        getRootHostContext: () => ({}),
+        getChildHostContext: (parentHostContext) => parentHostContext,
+        shouldSetTextContent: () => false,
+        createInstance: (type, props) => createNode(type, props),
+        createTextInstance: (text) => createNode("Label", { label: text }),
+        appendInitialChild: (parent, child) => parent.appendChild(child),
+        finalizeInitialChildren: () => true,
+        commitUpdate: (instance, _type, oldProps, newProps) => {
+            instance.updateProps(oldProps, newProps);
+        },
+        commitMount: (instance) => {
+            instance.mount();
+        },
+        appendChild: (parent, child) => parent.appendChild(child),
+        removeChild: (parent, child) => parent.removeChild(child),
+        insertBefore: (parent, child, beforeChild) => parent.insertBefore(child, beforeChild),
+        removeChildFromContainer: (container, child) => {
+            const parent = createNodeFromContainer(container);
+            parent.removeChild(child);
+        },
+        appendChildToContainer: (container, child) => {
+            const parent = createNodeFromContainer(container);
+            parent.appendChild(child);
+        },
+        insertInContainerBefore: (container, child, beforeChild) => {
+            const parent = createNodeFromContainer(container);
+            parent.insertBefore(child, beforeChild);
+        },
+        prepareForCommit: () => {
+            beginBatch();
+            beginCommit();
+            return null;
+        },
+        resetAfterCommit: () => {
+            endCommit();
+            endBatch();
+        },
+        commitTextUpdate: (textInstance, oldText, newText) => {
+            textInstance.updateProps({ label: oldText }, { label: newText });
+        },
+        clearContainer: () => { },
+        preparePortalMount: () => { },
+        scheduleTimeout: (fn, delay) => {
+            const timeoutId = setTimeout(fn, delay ?? 0);
+            return typeof timeoutId === "number" ? timeoutId : Number(timeoutId);
+        },
+        cancelTimeout: (id) => {
+            clearTimeout(id);
+        },
+        getPublicInstance: (instance) => instance.getWidget(),
+        getCurrentUpdatePriority: () => 2,
+        setCurrentUpdatePriority: () => { },
+        resolveUpdatePriority: () => 2,
+        NotPendingTransition: null,
+        HostTransitionContext: createReconcilerContext(0),
+        getInstanceFromNode: () => null,
+        beforeActiveInstanceBlur: () => { },
+        afterActiveInstanceBlur: () => { },
+        prepareScopeUpdate: () => { },
+        getInstanceFromScope: () => null,
+        detachDeletedInstance: () => { },
+        resetFormInstance: () => { },
+        requestPostPaintCallback: () => { },
+        shouldAttemptEagerTransition: () => false,
+        trackSchedulerEvent: () => { },
+        resolveEventType: () => null,
+        resolveEventTimeStamp: () => Date.now(),
+        maySuspendCommit: () => false,
+        preloadInstance: () => false,
+        startSuspendingCommit: () => { },
+        suspendInstance: () => { },
+        waitForCommitToBeReady: () => null,
+    };
+}
+function createReconcilerContext(value) {
+    const context = React.createContext(value);
+    return context;
+}

package/dist/reconciler.d.ts

@@ -1,33 +1,9 @@
-import type * as Gtk from "@gtkx/ffi/gtk";
-import ReactReconciler from "react-reconciler";
-import { type ROOT_NODE_CONTAINER } from "./factory.js";
-import type { Node } from "./node.js";
-type Container = Gtk.Widget | typeof ROOT_NODE_CONTAINER;
-type TextInstance = Node;
-type SuspenseInstance = never;
-type PublicInstance = Gtk.Widget;
-type FormInstance = never;
-type ReconcilerInstance = ReactReconciler.Reconciler<Container, Node, TextInstance, SuspenseInstance, FormInstance, PublicInstance>;
-/**
- * GTKX React reconciler class.
- */
+import { type ReconcilerInstance } from "./reconciler/host-config.js";
 declare class Reconciler {
     private instance;
-    /** Creates a new GTK reconciler instance. */
     constructor();
-    /**
-     * Gets the underlying React reconciler instance.
-     * @returns The react-reconciler instance
-     */
     getInstance(): ReconcilerInstance;
-    private createHostConfig;
-    /**
-     * Creates a React context compatible with the reconciler's internal type.
-     * Cast is necessary because React.Context and ReactReconciler.ReactContext
-     * are structurally identical at runtime but declared as separate types.
-     */
-    private createReconcilerContext;
-    private createNodeFromContainer;
+    private injectDevTools;
 }
 /**
  * The singleton GTKX React reconciler instance.

package/dist/reconciler.js

@@ -1,118 +1,27 @@
-import { beginBatch, endBatch } from "@gtkx/ffi";
-import React from "react";
 import ReactReconciler from "react-reconciler";
-import { beginCommit, endCommit } from "./batch.js";
+import packageJson from "../package.json" with { type: "json" };
 import { createNode } from "./factory.js";
-/**
- * GTKX React reconciler class.
- */
+import { createHostConfig } from "./reconciler/host-config.js";
 class Reconciler {
     instance;
-    /** Creates a new GTK reconciler instance. */
     constructor() {
-        this.instance = ReactReconciler(this.createHostConfig());
+        const createNodeFromContainer = (container) => {
+            return createNode(container.constructor.name, {}, container);
+        };
+        this.instance = ReactReconciler(createHostConfig(createNodeFromContainer));
+        this.injectDevTools();
     }
-    /**
-     * Gets the underlying React reconciler instance.
-     * @returns The react-reconciler instance
-     */
     getInstance() {
         return this.instance;
     }
-    createHostConfig() {
-        return {
-            supportsMutation: true,
-            supportsPersistence: false,
-            supportsHydration: false,
-            isPrimaryRenderer: true,
-            noTimeout: -1,
-            getRootHostContext: () => ({}),
-            getChildHostContext: (parentHostContext) => parentHostContext,
-            shouldSetTextContent: () => false,
-            createInstance: (type, props) => {
-                return createNode(type, props);
-            },
-            createTextInstance: (text) => createNode("Label", { label: text }),
-            appendInitialChild: (parent, child) => parent.appendChild(child),
-            finalizeInitialChildren: () => true,
-            commitUpdate: (instance, _type, oldProps, newProps) => {
-                instance.updateProps(oldProps, newProps);
-            },
-            commitMount: (instance) => {
-                instance.mount();
-            },
-            appendChild: (parent, child) => parent.appendChild(child),
-            removeChild: (parent, child) => parent.removeChild(child),
-            insertBefore: (parent, child, beforeChild) => parent.insertBefore(child, beforeChild),
-            removeChildFromContainer: (container, child) => {
-                const parent = this.createNodeFromContainer(container);
-                parent.removeChild(child);
-            },
-            appendChildToContainer: (container, child) => {
-                const parent = this.createNodeFromContainer(container);
-                parent.appendChild(child);
-            },
-            insertInContainerBefore: (container, child, beforeChild) => {
-                const parent = this.createNodeFromContainer(container);
-                parent.insertBefore(child, beforeChild);
-            },
-            prepareForCommit: () => {
-                beginBatch();
-                beginCommit();
-                return null;
-            },
-            resetAfterCommit: () => {
-                endCommit();
-                endBatch();
-            },
-            commitTextUpdate: (textInstance, oldText, newText) => {
-                textInstance.updateProps({ label: oldText }, { label: newText });
-            },
-            clearContainer: () => { },
-            preparePortalMount: () => { },
-            scheduleTimeout: (fn, delay) => {
-                const timeoutId = setTimeout(fn, delay ?? 0);
-                return typeof timeoutId === "number" ? timeoutId : Number(timeoutId);
-            },
-            cancelTimeout: (id) => {
-                clearTimeout(id);
-            },
-            getPublicInstance: (instance) => instance.getWidget(),
-            getCurrentUpdatePriority: () => 2,
-            setCurrentUpdatePriority: () => { },
-            resolveUpdatePriority: () => 2,
-            NotPendingTransition: null,
-            HostTransitionContext: this.createReconcilerContext(0),
-            getInstanceFromNode: () => null,
-            beforeActiveInstanceBlur: () => { },
-            afterActiveInstanceBlur: () => { },
-            prepareScopeUpdate: () => { },
-            getInstanceFromScope: () => null,
-            detachDeletedInstance: () => { },
-            resetFormInstance: () => { },
-            requestPostPaintCallback: () => { },
-            shouldAttemptEagerTransition: () => false,
-            trackSchedulerEvent: () => { },
-            resolveEventType: () => null,
-            resolveEventTimeStamp: () => Date.now(),
-            maySuspendCommit: () => false,
-            preloadInstance: () => false,
-            startSuspendingCommit: () => { },
-            suspendInstance: () => { },
-            waitForCommitToBeReady: () => null,
-        };
-    }
-    /**
-     * Creates a React context compatible with the reconciler's internal type.
-     * Cast is necessary because React.Context and ReactReconciler.ReactContext
-     * are structurally identical at runtime but declared as separate types.
-     */
-    createReconcilerContext(value) {
-        const context = React.createContext(value);
-        return context;
-    }
-    createNodeFromContainer(container) {
-        return createNode(container.constructor.name, {}, container);
+    injectDevTools() {
+        if (process.env.NODE_ENV === "production")
+            return;
+        this.instance.injectIntoDevTools({
+            bundleType: 1,
+            version: packageJson.version,
+            rendererPackageName: "@gtkx/react",
+        });
     }
 }
 /**

package/dist/render.d.ts

@@ -1,7 +1,6 @@
 import type { ApplicationFlags } from "@gtkx/ffi/gio";
 import type { ReactNode } from "react";
-/** The root container for the React reconciler. */
-export declare let container: unknown;
+export declare const getContainer: () => unknown;
 /**
  * Renders a React element tree as a GTK application.
  * This is the main entry point for GTKX applications.

package/dist/render.js

@@ -1,8 +1,18 @@
 import { start } from "@gtkx/ffi";
+import { formatBoundaryError, formatRenderError } from "./errors.js";
 import { ROOT_NODE_CONTAINER } from "./factory.js";
 import { reconciler } from "./reconciler.js";
-/** The root container for the React reconciler. */
-export let container = null;
+let container = null;
+export const getContainer = () => container;
+const APP_ID_PATTERN = /^[a-zA-Z][a-zA-Z0-9_]*(\.[a-zA-Z][a-zA-Z0-9_]*)+$/;
+function validateAppId(appId) {
+    if (!appId || typeof appId !== "string") {
+        throw new Error("appId must be a non-empty string");
+    }
+    if (!APP_ID_PATTERN.test(appId)) {
+        throw new Error(`Invalid appId "${appId}". App ID must be in reverse-DNS format (e.g., "com.example.myapp")`);
+    }
+}
 /**
  * Renders a React element tree as a GTK application.
  * This is the main entry point for GTKX applications.
@@ -22,12 +32,14 @@ export let container = null;
  * @param flags - Optional GIO application flags
  */
 export const render = (element, appId, flags) => {
+    validateAppId(appId);
     start(appId, flags);
     const instance = reconciler.getInstance();
     container = instance.createContainer(ROOT_NODE_CONTAINER, 0, null, false, null, "", (error) => {
-        throw error;
+        throw formatRenderError(error);
     }, (error) => {
-        console.error("Error caught by ErrorBoundary:", error);
+        const formattedError = formatBoundaryError(error);
+        console.error(formattedError.toString());
     }, () => { }, () => { }, null);
     instance.updateContainer(element, container, null, () => { });
 };

package/dist/types.d.ts

@@ -8,13 +8,25 @@ export type SlotProps = {
     children?: ReactNode;
 };
 /**
- * Props passed to list item components.
+ * Props passed to list item components (ListView, GridView, ColumnView).
  * @typeParam I - The type of the data item
  */
 export type ListItemProps<I = unknown> = {
+    /** Unique identifier for this item. Used for selection. */
+    id: string;
     /** The data item to render. */
     item: I;
 };
+/**
+ * Props for string list items (DropDown, ComboRow).
+ * Similar to HTML select option elements.
+ */
+export type StringListItemProps = {
+    /** Unique identifier for this item. Used for selection. */
+    id: string;
+    /** Display text shown in the dropdown. */
+    label: string;
+};
 export type GridChildProps = SlotProps & {
     column?: number;
     row?: number;
@@ -34,14 +46,6 @@ export type ListViewRenderProps<T = unknown> = {
     /** Render function called for each item in the list. */
     renderItem: RenderItemFn<T>;
 };
-/**
- * Comparison function for sorting items by column.
- * Returns negative if a < b, 0 if a === b, positive if a > b.
- * @param a - First item to compare
- * @param b - Second item to compare
- * @param columnId - The ID of the column being sorted
- */
-export type ColumnSortFn<T, C extends string = string> = (a: T, b: T, columnId: C) => number;
 /**
  * Props for individual columns in a ColumnView.
  * @typeParam T - The type of the data items displayed in the column
@@ -66,18 +70,17 @@ export type ColumnViewColumnProps<T = unknown> = {
 };
 /**
  * Props for the ColumnView root component.
- * @typeParam T - The type of the data items in the view
+ * Sorting is handled by the parent component - sort your items before rendering
+ * and pass them as ColumnView.Item children in the desired order.
  * @typeParam C - The union type of column IDs
  */
-export type ColumnViewRootProps<T = unknown, C extends string = string> = {
-    /** The ID of the currently sorted column, or null if unsorted. */
+export type ColumnViewRootProps<C extends string = string> = {
+    /** The ID of the currently sorted column, or null if unsorted. Controls the sort indicator UI. */
     sortColumn?: C | null;
-    /** The current sort direction. */
+    /** The current sort direction. Controls the sort indicator UI. */
     sortOrder?: SortType;
-    /** Callback fired when the user changes the sort column or order. */
+    /** Callback fired when the user clicks a column header to change sort. */
     onSortChange?: (column: C | null, order: SortType) => void;
-    /** Custom comparison function for sorting items. */
-    sortFn?: ColumnSortFn<T, C>;
 };
 export type NotebookPageProps = SlotProps & {
     label: string;