@gtkx/react 0.20.0 → 1.0.0-rc.1

package/dist/render.js

@@ -1,159 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { start, stop } from "@gtkx/ffi";
-import { createContext, useContext } from "react";
-import { formatBoundaryError, formatRenderError } from "./errors.js";
-import { getSignalStore } from "./nodes/internal/signal-store.js";
-import { reconciler } from "./reconciler.js";
-/**
- * React Context providing access to the GTK Application instance.
- *
- * Use {@link useApplication} to access the application in components.
- *
- * @example
- * ```tsx
- * const App = () => {
- * const app = useApplication();
- * console.log(app.applicationId);
- * return <GtkLabel label="Hello" />;
- * };
- * ```
- */
-export const ApplicationContext = createContext(null);
-/**
- * Hook to access the GTK Application instance.
- *
- * Must be called within a component rendered by {@link render}.
- * Throws an error if called outside the application context.
- *
- * @returns The GTK Application instance
- *
- * @example
- * ```tsx
- * const MyComponent = () => {
- * const app = useApplication();
- * return <GtkLabel label={app.applicationId} />;
- * };
- * ```
- *
- * @see {@link ApplicationContext} for the underlying context
- */
-export const useApplication = () => {
-    const context = useContext(ApplicationContext);
-    if (!context) {
-        throw new Error("Expected ApplicationContext: useApplication must be called within Application");
-    }
-    return context;
-};
-let container = null;
-let app = null;
-let isHotReloading = false;
-/**
- * Sets the hot reloading state.
- *
- * Used internally by the dev server to prevent quit() from closing
- * the application during HMR updates.
- *
- * @internal
- */
-export const setHotReloading = (value) => {
-    isHotReloading = value;
-};
-/**
- * Renders a React element tree into a GTK4 application window.
- *
- * This is the main entry point for GTKX applications. It initializes the GTK4
- * runtime, creates an application container, and begins the React reconciliation
- * process.
- *
- * @param element - The root React element to render
- * @param appId - Application ID in reverse domain notation (e.g., "com.example.myapp")
- * @param flags - Optional GIO application flags for customizing behavior
- *
- * @example
- * ```tsx
- * import { render, quit } from "@gtkx/react";
- *
- * const App = () => (
- * <GtkApplicationWindow title="My App" onClose={quit}>
- * <GtkLabel label="Hello, GTKX!" />
- * </GtkApplicationWindow>
- * );
- *
- * render(<App />, "com.example.myapp");
- * ```
- *
- * @see {@link quit} for shutting down the application
- * @see {@link update} for hot-reloading the rendered tree
- */
-export const render = (element, appId, flags) => {
-    const application = start(appId, flags);
-    app = application;
-    const instance = reconciler.getInstance();
-    container = instance.createContainer(application, 1, null, false, null, "", (error) => {
-        getSignalStore(application).forceUnblockAll();
-        throw formatRenderError(error);
-    }, (error) => {
-        getSignalStore(application).forceUnblockAll();
-        const formattedError = formatBoundaryError(error);
-        console.error(formattedError.toString());
-    }, () => { }, () => { });
-    instance.updateContainer(_jsx(ApplicationContext.Provider, { value: application, children: element }), container, null, () => { });
-};
-/**
- * Updates the rendered React element tree.
- *
- * Used primarily for hot module replacement (HMR) during development.
- * Replaces the current component tree with a new element without
- * reinitializing the GTK application.
- *
- * @param element - The new root React element to render
- *
- * @example
- * ```tsx
- * // In HMR handler
- * if (import.meta.hot) {
- * import.meta.hot.accept(() => {
- * update(<App />);
- * });
- * }
- * ```
- *
- * @see {@link render} for initial rendering
- */
-export const update = (element) => {
-    return new Promise((resolve) => {
-        reconciler
-            .getInstance()
-            .updateContainer(_jsx(ApplicationContext.Provider, { value: app, children: element }), container, null, resolve);
-    });
-};
-/**
- * Gracefully shuts down the GTK application.
- *
- * Unmounts the React component tree and stops the GTK main loop.
- * Typically used as the `onClose` handler for the application window.
- *
- * @example
- * ```tsx
- * import { quit } from "@gtkx/react";
- *
- * const App = () => (
- * <GtkApplicationWindow title="My App" onClose={quit}>
- * <GtkButton label="Quit" onClicked={quit} />
- * </GtkApplicationWindow>
- * );
- * ```
- *
- * @see {@link render} for starting the application
- */
-export const quit = () => {
-    if (isHotReloading) {
-        return;
-    }
-    reconciler.getInstance().updateContainer(null, container, null, () => {
-        setTimeout(() => {
-            stop();
-        }, 0);
-    });
-};
-//# sourceMappingURL=render.js.map

package/dist/render.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"render.js","sourceRoot":"","sources":["../src/render.tsx"],"names":[],"mappings":"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"}

package/dist/types.d.ts

@@ -1,5 +0,0 @@
-import type * as Gtk from "@gtkx/ffi/gtk";
-export type Container = Gtk.Widget | Gtk.Application | Gtk.EventController | Gtk.ListItem | Gtk.ListHeader;
-export type Props = Record<string, unknown>;
-export type ContainerClass = typeof Gtk.Widget | typeof Gtk.Application | typeof Gtk.EventController | typeof Gtk.ListItem | typeof Gtk.ListHeader;
-//# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,GAAG,MAAM,eAAe,CAAC;AAE1C,MAAM,MAAM,SAAS,GAAG,GAAG,CAAC,MAAM,GAAG,GAAG,CAAC,WAAW,GAAG,GAAG,CAAC,eAAe,GAAG,GAAG,CAAC,QAAQ,GAAG,GAAG,CAAC,UAAU,CAAC;AAE3G,MAAM,MAAM,KAAK,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAE5C,MAAM,MAAM,cAAc,GACpB,OAAO,GAAG,CAAC,MAAM,GACjB,OAAO,GAAG,CAAC,WAAW,GACtB,OAAO,GAAG,CAAC,eAAe,GAC1B,OAAO,GAAG,CAAC,QAAQ,GACnB,OAAO,GAAG,CAAC,UAAU,CAAC"}

package/dist/types.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":""}

package/src/components/list.tsx

@@ -1,83 +0,0 @@
-import type * as Adw from "@gtkx/ffi/adw";
-import type * as Gtk from "@gtkx/ffi/gtk";
-import { createElement, Fragment, type ReactNode, type Ref, useReducer, useRef } from "react";
-import type {
-    AdwComboRowProps,
-    GtkColumnViewProps,
-    GtkDropDownProps,
-    GtkGridViewProps,
-    GtkListViewProps,
-} from "../generated/jsx.js";
-import type { DropDownProps, GridViewProps, ListItem, ListViewProps } from "../jsx.js";
-import type { BoundItem } from "../nodes/internal/bound-item.js";
-import { createPortal } from "../portal.js";
-
-type GenericListViewProps<T, S> = Omit<GtkListViewProps, keyof ListViewProps> & ListViewProps<T, S>;
-type GenericGridViewProps<T> = Omit<GtkGridViewProps, keyof GridViewProps> & GridViewProps<T>;
-type GenericDropDownProps<T, S> = Omit<GtkDropDownProps, keyof DropDownProps> & DropDownProps<T, S>;
-type GenericComboRowProps<T, S> = Omit<AdwComboRowProps, keyof DropDownProps> & DropDownProps<T, S>;
-type GenericColumnViewProps<T, S> = Omit<GtkColumnViewProps, "items" | "renderHeader"> & {
-    items?: ListItem<T, S>[];
-    renderHeader?: ((item: S) => ReactNode) | null;
-};
-
-function useListHandle() {
-    const [, rerender] = useReducer((x: number) => x + 1, 0);
-    const boundItemsRef = useRef<BoundItem[]>([]);
-    const headerBoundItemsRef = useRef<BoundItem[]>([]);
-    return { rerender, boundItemsRef, headerBoundItemsRef };
-}
-
-function renderListElement(intrinsicName: string, handle: ReturnType<typeof useListHandle>, props: object): ReactNode {
-    const { rerender, boundItemsRef, headerBoundItemsRef } = handle;
-
-    const portals: ReactNode[] = [];
-    for (const [content, container, key] of boundItemsRef.current) {
-        portals.push(createPortal(content, container, key));
-    }
-    for (const [content, container, key] of headerBoundItemsRef.current) {
-        portals.push(createPortal(content, container, key));
-    }
-
-    return createElement(
-        Fragment,
-        null,
-        createElement(intrinsicName, {
-            ...(props as Record<string, unknown>),
-            __boundItemsRef: boundItemsRef,
-            __rerender: rerender,
-            __headerBoundItemsRef: headerBoundItemsRef,
-        }),
-        ...portals,
-    );
-}
-
-export function GtkListView<T = unknown, S = unknown>(
-    props: GenericListViewProps<T, S> & { children?: ReactNode; ref?: Ref<Gtk.ListView> },
-): ReactNode {
-    return renderListElement("GtkListView", useListHandle(), props);
-}
-
-export function GtkGridView<T = unknown>(
-    props: GenericGridViewProps<T> & { children?: ReactNode; ref?: Ref<Gtk.GridView> },
-): ReactNode {
-    return renderListElement("GtkGridView", useListHandle(), props);
-}
-
-export function GtkColumnView<T = unknown, S = unknown>(
-    props: GenericColumnViewProps<T, S> & { children?: ReactNode; ref?: Ref<Gtk.ColumnView> },
-): ReactNode {
-    return renderListElement("GtkColumnView", useListHandle(), props);
-}
-
-export function GtkDropDown<T = unknown, S = unknown>(
-    props: GenericDropDownProps<T, S> & { children?: ReactNode; ref?: Ref<Gtk.DropDown> },
-): ReactNode {
-    return renderListElement("GtkDropDown", useListHandle(), props);
-}
-
-export function AdwComboRow<T = unknown, S = unknown>(
-    props: GenericComboRowProps<T, S> & { children?: ReactNode; ref?: Ref<Adw.ComboRow> },
-): ReactNode {
-    return renderListElement("AdwComboRow", useListHandle(), props);
-}

package/src/errors.ts

@@ -1,52 +0,0 @@
-export class GtkxError extends Error {
-    constructor(
-        message: string,
-        public widgetType?: string,
-        public componentStack?: string,
-    ) {
-        super(message);
-        this.name = "GtkxError";
-
-        if (Error.captureStackTrace) {
-            Error.captureStackTrace(this, GtkxError);
-        }
-    }
-
-    override toString(): string {
-        const parts = [`GtkxError: ${this.message}`];
-
-        if (this.widgetType) {
-            parts.push(`Widget Type: ${this.widgetType}`);
-        }
-
-        if (this.componentStack) {
-            parts.push(`Component Stack:\n${this.componentStack}`);
-        }
-
-        return parts.join("\n");
-    }
-}
-
-export function formatRenderError(error: unknown, widgetType?: string): GtkxError {
-    if (error instanceof GtkxError) {
-        return error;
-    }
-
-    if (error instanceof Error) {
-        console.error("[formatRenderError] Original error stack:", error.stack);
-    }
-
-    const message = error instanceof Error ? error.message : String(error);
-    const formattedMessage = widgetType ? `Failed to render ${widgetType}: ${message}` : `Render error: ${message}`;
-
-    return new GtkxError(formattedMessage, widgetType);
-}
-
-export function formatBoundaryError(error: unknown): GtkxError {
-    if (error instanceof GtkxError) {
-        return error;
-    }
-
-    const message = error instanceof Error ? error.message : String(error);
-    return new GtkxError(`Error caught by boundary: ${message}`);
-}

package/src/factory.ts

@@ -1,62 +0,0 @@
-import { NAMESPACE_REGISTRY } from "./generated/registry.js";
-import type { Node } from "./node.js";
-import { NODE_REGISTRY, type NodeClass } from "./registry.js";
-import type { Container, ContainerClass, Props } from "./types.js";
-
-export const resolveContainerClass = (type: string): ContainerClass | null => {
-    for (const [prefix, namespace] of NAMESPACE_REGISTRY) {
-        if (type.startsWith(prefix)) {
-            const className = type.slice(prefix.length);
-            return namespace[className] as ContainerClass;
-        }
-    }
-    return null;
-};
-
-// biome-ignore lint/suspicious/noExplicitAny: Required for instanceof checks against GTK class hierarchy
-type ClassKey = abstract new (...args: any[]) => any;
-
-type RegistryKey = string | ClassKey | readonly (string | ClassKey)[];
-
-const matchesSingleKey = (key: string | ClassKey, typeName: string, target: object | null): boolean => {
-    if (typeof key === "string") {
-        return key === typeName;
-    }
-    return !!target && (target instanceof key || target === key || Object.prototype.isPrototypeOf.call(key, target));
-};
-
-const matchesKey = (key: RegistryKey, typeName: string, target: object | null): boolean => {
-    if (typeof key === "string" || typeof key === "function") {
-        return matchesSingleKey(key, typeName, target);
-    }
-    return key.some((k) => matchesSingleKey(k, typeName, target));
-};
-
-export const createNode = (
-    typeName: string,
-    props: Props,
-    existingContainer: Container | undefined,
-    rootContainer: Container,
-): Node => {
-    const containerClass = resolveContainerClass(typeName);
-
-    for (const [key, NodeClass] of NODE_REGISTRY) {
-        if (!matchesKey(key, typeName, existingContainer ?? containerClass)) continue;
-        return instantiateNode(NodeClass, typeName, props, existingContainer, containerClass, rootContainer);
-    }
-
-    throw new Error(`Unable to find node class for type '${typeName}'`);
-};
-
-const instantiateNode = (
-    NodeClass: NodeClass,
-    typeName: string,
-    props: Props,
-    existingContainer: Container | undefined,
-    containerClass: ContainerClass | null,
-    rootContainer: Container,
-): Node => {
-    const container =
-        existingContainer ?? (containerClass && NodeClass.createContainer(props, containerClass, rootContainer));
-    return new NodeClass(typeName, props, container, rootContainer);
-};