@gtkx/react 0.20.0 → 1.0.0-rc.1

package/README.md

@@ -1,106 +1,173 @@
 <p align="center">
- <img src="https://raw.githubusercontent.com/eugeniodepalo/gtkx/main/logo.svg" alt="GTKX" width="60" height="60">
+  <img src="https://raw.githubusercontent.com/gtkx-org/gtkx/main/logo.svg" alt="GTKX" width="100" />
 </p>
 
 <h1 align="center">GTKX</h1>
 
 <p align="center">
- <strong>Build native GTK4 desktop applications with React and TypeScript.</strong>
+  The React framework for Linux.<br />
+  Build GTK4 and Adwaita apps in TypeScript, with React components and hooks driving GNOME's own widgets. What you ship is a GNOME app.
 </p>
 
 <p align="center">
- <a href="https://www.npmjs.com/package/@gtkx/react"><img src="https://img.shields.io/npm/v/@gtkx/react.svg" alt="npm version"></a>
- <a href="https://github.com/gtkx-org/gtkx/actions"><img src="https://img.shields.io/github/actions/workflow/status/eugeniodepalo/gtkx/ci.yml" alt="CI"></a>
- <a href="https://github.com/gtkx-org/gtkx/blob/main/LICENSE"><img src="https://img.shields.io/badge/license-MPL--2.0-blue.svg" alt="License"></a>
- <a href="https://github.com/gtkx-org/gtkx/discussions"><img src="https://img.shields.io/badge/discussions-GitHub-blue" alt="GitHub Discussions"></a>
+  <a href="https://www.npmjs.com/package/create-gtkx"><img src="https://img.shields.io/npm/v/create-gtkx?color=cb3837&logo=npm&label=create-gtkx" alt="npm version" /></a>
+  <a href="https://www.npmjs.com/package/create-gtkx"><img src="https://img.shields.io/npm/dm/create-gtkx?color=cb3837&logo=npm&label=downloads" alt="npm downloads" /></a>
+  <img src="https://img.shields.io/badge/node-%E2%89%A524-339933?logo=node.js&logoColor=white" alt="Node >= 24" />
+  <a href="https://github.com/gtkx-org/gtkx/blob/main/LICENSE"><img src="https://img.shields.io/badge/license-MPL--2.0-blue.svg" alt="License: MPL-2.0" /></a>
+  <a href="https://github.com/gtkx-org/gtkx/actions/workflows/ci.yml"><img src="https://img.shields.io/github/actions/workflow/status/gtkx-org/gtkx/ci.yml?branch=main&logo=github&label=CI" alt="CI status" /></a>
+  <img src="https://img.shields.io/badge/TypeScript-strict-3178c6?logo=typescript&logoColor=white" alt="TypeScript" />
+</p>
+
+<p align="center">
+  <a href="https://gtkx.dev">Homepage</a> &middot;
+  <a href="https://gtkx.dev/guide/why-gtkx">Documentation</a> &middot;
+  <a href="https://github.com/gtkx-org/gtkx/tree/main/examples">Examples</a> &middot;
+  <a href="https://github.com/gtkx-org/gtkx/blob/main/CONTRIBUTING.md">Contributing</a>
 </p>
 
 ---
 
-GTKX lets you write Linux desktop applications using React. Your components render as native GTK4 widgets through a Rust FFI bridge—no webviews, no Electron, just native performance with the developer experience you already know.
+GTKX generates fully typed bindings for the entire GTK4 and Adwaita surface directly from GObject-Introspection. On top of those bindings you get the React programming model: components and hooks driving GObject instances, with Fast Refresh while you develop.
 
-## Quick Start
+<p align="center">
+  <img src="https://raw.githubusercontent.com/gtkx-org/gtkx/main/examples/tutorial/assets/screenshot.png" alt="The Tasks app: an Adwaita window with a sidebar of smart views and colored lists on the left, and a boxed task list on the right." />
+</p>
 
-```bash
-npx @gtkx/cli create my-app
-cd my-app
-npm run dev
-```
+<p align="center">
+  <em>The Tasks app you build in the <a href="https://gtkx.dev/tutorial/">tutorial</a>.</em>
+</p>
+
+## Demo
 
-## Example
+The intrinsic elements in this snippet render GTK4 widgets, and ordinary React hooks and events drive them:
 
 ```tsx
-import {
-  GtkApplicationWindow,
-  GtkBox,
-  GtkButton,
-  GtkLabel,
-  quit,
-  render,
-} from "@gtkx/react";
-import * as Gtk from "@gtkx/ffi/gtk";
+import * as Gtk from "@gtkx/gi/gtk";
+import { GtkApplication, GtkApplicationWindow, GtkBox, GtkButton, GtkLabel } from "@gtkx/jsx/gtk";
+import { createRoot, quit } from "@gtkx/react";
 import { useState } from "react";
 
-const App = () => {
+const Counter = () => {
   const [count, setCount] = useState(0);
 
   return (
     <GtkApplicationWindow
-      title="Counter"
-      defaultWidth={300}
-      defaultHeight={200}
-      onClose={quit}
+      title="Hello GTKX"
+      defaultWidth={400}
+      defaultHeight={300}
+      onCloseRequest={quit}
     >
       <GtkBox
         orientation={Gtk.Orientation.VERTICAL}
         spacing={20}
+        marginTop={40}
+        marginBottom={40}
+        marginStart={40}
+        marginEnd={40}
         valign={Gtk.Align.CENTER}
+        halign={Gtk.Align.CENTER}
       >
-        <GtkLabel label={`Count: ${count}`} cssClasses={["title-1"]} />
-        <GtkButton label="Increment" onClicked={() => setCount((c) => c + 1)} />
+        <GtkLabel cssClasses={["title-1"]}>Welcome to GTKX!</GtkLabel>
+        <GtkLabel cssClasses={["title-2"]}>{`Count: ${count}`}</GtkLabel>
+        <GtkButton
+          label="Increment"
+          onClicked={() => setCount((c) => c + 1)}
+          cssClasses={["suggested-action", "pill"]}
+        />
       </GtkBox>
     </GtkApplicationWindow>
   );
 };
 
-render(<App />, "com.example.counter");
+const App = () => (
+  <GtkApplication>
+    <Counter />
+  </GtkApplication>
+);
+
+createRoot().render(<App />);
 ```
 
-## Features
+This is the [`hello-world`](https://github.com/gtkx-org/gtkx/tree/main/examples/hello-world) example, with `app.tsx` and `index.tsx` combined into a single snippet. `@gtkx/gi` and `@gtkx/jsx` are per-project bindings generated by the CLI, not packages you install from npm.
 
-- **React 19** — Hooks, concurrent features, and the component model you know
-- **Native GTK4 widgets** — Real native controls, not web components in a webview
-- **Adwaita support** — Modern GNOME styling with Libadwaita components
-- **Declarative animations** — Framer Motion-like API using native Adwaita animations
-- **Hot Module Replacement** — Fast refresh during development
-- **TypeScript first** — Full type safety with auto-generated bindings
-- **CSS-in-JS styling** — Familiar styling patterns adapted for GTK
-- **Testing utilities** — Component testing similar to Testing Library
+## Why GTKX
 
-## Examples
+### A declarative layer for the GNOME stack
+
+GTK4 is mature, and GtkBuilder XML can lay out a static interface, but nothing re-renders that interface when your application state changes, and nothing hot-reloads it as you work. GTKX adds that missing layer, and the tooling around it, on top of the stack you already know:
+
+- a React reconciler that exposes every GObject as a JSX element,
+- a CLI for scaffolding, development, and production builds,
+- a dev server with Fast Refresh that patches your running UI in place,
+- CSS-in-JS styling and high-level list, grid, and dialog components,
+- a Testing Library-style API for querying and driving your widgets in tests,
+- and a Model Context Protocol (MCP) server that exposes your live app to AI agents.
+
+### The full GNOME API surface
+
+React Native and similar frameworks hide the native toolkit so one API can run everywhere. GTKX exposes it: GTK4, Adwaita, and any other GObject-Introspection library on your system. Linux-only by design.
+
+### Why Node.js, and why generated bindings
+
+GTKX runs on Node.js, which puts native modules, the npm ecosystem, and the tooling built for Node.js APIs within reach. GJS is GNOME's own runtime, built on SpiderMonkey rather than V8; node-gtk runs on Node.js but is lightly maintained, on the older nan/V8 ABI rather than N-API, and still centered on GTK3. The [why-gtkx guide](https://gtkx.dev/guide/why-gtkx) covers the comparison in full.
+
+GTKX generates the TypeScript types and the native FFI calls from the same GObject-Introspection data, so the types cannot drift from the calls they back. Codegen covers the whole GTK4 and Adwaita surface.
+
+At runtime, the native Rust core calls straight into the system GTK4, Adwaita, and GLib libraries through libffi, without loading libgirepository at all.
 
-Explore complete applications in the [`examples/`](./examples) directory:
+## Quick start
 
-- **[gtk-demo](./examples/gtk-demo)** — Full replica of the official GTK demo app
-- **[hello-world](./examples/hello-world)** — Minimal application showing a counter
-- **[todo](./examples/todo)** — Full-featured todo application with Adwaita styling and testing
-- **[x-showcase](./examples/x-showcase)** — Showcase of all x.\* virtual components
-- **[browser](./examples/browser)** — Simple browser using WebKitWebView
-- **[deploying](./examples/deploying)** — Example of packaging and distributing a GTKX app
+GTKX is Linux-only and needs Node.js 24 or later. See [Requirements](#requirements).
+
+Scaffold a new app with the `create-gtkx` initializer:
+
+```sh
+npm create gtkx@rc
+```
+
+The same command works with other package managers: `pnpm create gtkx@rc` or `yarn create gtkx@rc`.
+
+Then run your new app:
+
+```sh
+cd my-app
+npm run dev
+```
+
+To go further, follow the [tutorial](https://gtkx.dev/tutorial/).
 
 ## Documentation
 
-Visit [https://gtkx.dev](https://gtkx.dev) for the full documentation.
+The documentation at **[gtkx.dev](https://gtkx.dev)** includes a step-by-step tutorial that builds a complete GNOME app, from scaffolding to packaging and shipping, plus guides and a full API reference.
 
-## Contributing
+**[Read the docs &rarr;](https://gtkx.dev/guide/why-gtkx)**
 
-Contributions are welcome! Please see the [contributing guidelines](./CONTRIBUTING.md) and check out the [good first issues](https://github.com/gtkx-org/gtkx/labels/good%20first%20issue).
+## Requirements
 
-## Community
+GTKX is Linux-only. You need:
+
+- Linux with the GTK4 (4.20 or later), Adwaita (1.8 or later), and GLib development libraries
+- Node.js 24 or later
+
+The `@gtkx/native` addon ships prebuilt for x64 and arm64 glibc Linux; other targets need to build it from the GTKX repository, which requires a Rust toolchain.
+
+## Examples
+
+Explore the [example apps](https://github.com/gtkx-org/gtkx/tree/main/examples):
+
+- [`hello-world`](https://github.com/gtkx-org/gtkx/tree/main/examples/hello-world): the counter above.
+- [`gtk-demo`](https://github.com/gtkx-org/gtkx/tree/main/examples/gtk-demo): a React port of the official GTK4 widget showcase, covering lists, dialogs, gestures, CSS, and OpenGL.
+- [`browser`](https://github.com/gtkx-org/gtkx/tree/main/examples/browser): a WebKitWebView-based web browser.
+- [`tutorial`](https://github.com/gtkx-org/gtkx/tree/main/examples/tutorial): the Tasks app the documentation builds.
+
+## Status
+
+GTKX 1.0 is at the release candidate stage.
+
+## Contributing
 
-- [GitHub Discussions](https://github.com/gtkx-org/gtkx/discussions) — Questions, ideas, and general discussion
-- [Issue Tracker](https://github.com/gtkx-org/gtkx/issues) — Bug reports and feature requests
+Contributions are welcome. See [CONTRIBUTING.md](https://github.com/gtkx-org/gtkx/blob/main/CONTRIBUTING.md), the [Code of Conduct](https://github.com/gtkx-org/gtkx/blob/main/CODE_OF_CONDUCT.md), and the [security policy](https://github.com/gtkx-org/gtkx/blob/main/SECURITY.md). Building the repo needs Node.js 24 or later, pnpm, and a Rust toolchain.
 
 ## License
 
-[MPL-2.0](./LICENSE)
+GTKX is licensed under [MPL-2.0](https://github.com/gtkx-org/gtkx/blob/main/LICENSE).

package/dist/components/application.d.ts

@@ -0,0 +1,10 @@
+import type * as Gtk from "@gtkx/gi/gtk";
+import { type ElementType, type ReactNode, type Ref } from "react";
+type ApplicationComponentProps = {
+    applicationId?: string | null | undefined;
+    children?: ReactNode | undefined;
+    ref?: Ref<Gtk.Application | null> | undefined;
+};
+export declare const createApplicationComponent: (Component: ElementType) => ((props: ApplicationComponentProps) => ReactNode);
+export {};
+//# sourceMappingURL=application.d.ts.map

package/dist/components/application.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"application.d.ts","sourceRoot":"","sources":["../../src/components/application.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,GAAG,MAAM,cAAc,CAAC;AAEzC,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,SAAS,EAAE,KAAK,GAAG,EAAyB,MAAM,OAAO,CAAC;AAM1F,KAAK,yBAAyB,GAAG;IAC7B,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IAC1C,QAAQ,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IACjC,GAAG,CAAC,EAAE,GAAG,CAAC,GAAG,CAAC,WAAW,GAAG,IAAI,CAAC,GAAG,SAAS,CAAC;CACjD,CAAC;AAEF,eAAO,MAAM,0BAA0B,cACxB,WAAW,KACvB,CAAC,CAAC,KAAK,EAAE,yBAAyB,KAAK,SAAS,CAyBlD,CAAC"}

package/dist/components/application.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { applicationId as defaultApplicationId } from "virtual:gtkx-config";
+import { quitApplication, runApplication } from "@gtkx/runtime";
+import { useCallback, useState } from "react";
+import { ApplicationContext } from "../hooks/use-application.js";
+import { useMergeRefs } from "../hooks/use-merge-refs.js";
+const POST_ACTIVATE_PROPS = new Set(["menubar"]);
+export const createApplicationComponent = (Component) => {
+    return ({ applicationId = defaultApplicationId, children, ref, ...rest }) => {
+        const [app, setApp] = useState(null);
+        const handleMount = useCallback((instance) => {
+            runApplication(instance);
+            setApp(instance);
+            return () => {
+                quitApplication(instance);
+                setApp(null);
+            };
+        }, []);
+        const mergedRef = useMergeRefs(ref, handleMount);
+        const appliedProps = app
+            ? rest
+            : Object.fromEntries(Object.entries(rest).filter(([key]) => !POST_ACTIVATE_PROPS.has(key)));
+        return (_jsx(Component, { ref: mergedRef, applicationId: applicationId, ...appliedProps, children: app ? _jsx(ApplicationContext.Provider, { value: app, children: children }) : null }));
+    };
+};
+//# sourceMappingURL=application.js.map

package/dist/components/application.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"application.js","sourceRoot":"","sources":["../../src/components/application.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,IAAI,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAE5E,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAChE,OAAO,EAA8C,WAAW,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC1F,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D,MAAM,mBAAmB,GAAG,IAAI,GAAG,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;AAQjD,MAAM,CAAC,MAAM,0BAA0B,GAAG,CACtC,SAAsB,EAC2B,EAAE;IACnD,OAAO,CAAC,EAAE,aAAa,GAAG,oBAAoB,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,IAAI,EAA6B,EAAa,EAAE;QAC9G,MAAM,CAAC,GAAG,EAAE,MAAM,CAAC,GAAG,QAAQ,CAAyB,IAAI,CAAC,CAAC;QAE7D,MAAM,WAAW,GAAG,WAAW,CAAC,CAAC,QAAyB,EAAE,EAAE;YAC1D,cAAc,CAAC,QAAQ,CAAC,CAAC;YACzB,MAAM,CAAC,QAAQ,CAAC,CAAC;YAEjB,OAAO,GAAG,EAAE;gBACR,eAAe,CAAC,QAAQ,CAAC,CAAC;gBAC1B,MAAM,CAAC,IAAI,CAAC,CAAC;YACjB,CAAC,CAAC;QACN,CAAC,EAAE,EAAE,CAAC,CAAC;QAEP,MAAM,SAAS,GAAG,YAAY,CAAkB,GAAG,EAAE,WAAW,CAAC,CAAC;QAClE,MAAM,YAAY,GAAG,GAAG;YACpB,CAAC,CAAC,IAAI;YACN,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,EAAE,CAAC,CAAC,mBAAmB,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;QAEhG,OAAO,CACH,KAAC,SAAS,IAAC,GAAG,EAAE,SAAS,EAAE,aAAa,EAAE,aAAa,KAAM,YAAY,YACpE,GAAG,CAAC,CAAC,CAAC,KAAC,kBAAkB,CAAC,QAAQ,IAAC,KAAK,EAAE,GAAG,YAAG,QAAQ,GAA+B,CAAC,CAAC,CAAC,IAAI,GACvF,CACf,CAAC;IACN,CAAC,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { applicationId as defaultApplicationId } from \"virtual:gtkx-config\";\nimport type * as Gtk from \"@gtkx/gi/gtk\";\nimport { quitApplication, runApplication } from \"@gtkx/runtime\";\nimport { type ElementType, type ReactNode, type Ref, useCallback, useState } from \"react\";\nimport { ApplicationContext } from \"../hooks/use-application.js\";\nimport { useMergeRefs } from \"../hooks/use-merge-refs.js\";\n\nconst POST_ACTIVATE_PROPS = new Set([\"menubar\"]);\n\ntype ApplicationComponentProps = {\n    applicationId?: string | null | undefined;\n    children?: ReactNode | undefined;\n    ref?: Ref<Gtk.Application | null> | undefined;\n};\n\nexport const createApplicationComponent = (\n    Component: ElementType,\n): ((props: ApplicationComponentProps) => ReactNode) => {\n    return ({ applicationId = defaultApplicationId, children, ref, ...rest }: ApplicationComponentProps): ReactNode => {\n        const [app, setApp] = useState<Gtk.Application | null>(null);\n\n        const handleMount = useCallback((instance: Gtk.Application) => {\n            runApplication(instance);\n            setApp(instance);\n\n            return () => {\n                quitApplication(instance);\n                setApp(null);\n            };\n        }, []);\n\n        const mergedRef = useMergeRefs<Gtk.Application>(ref, handleMount);\n        const appliedProps = app\n            ? rest\n            : Object.fromEntries(Object.entries(rest).filter(([key]) => !POST_ACTIVATE_PROPS.has(key)));\n\n        return (\n            <Component ref={mergedRef} applicationId={applicationId} {...appliedProps}>\n                {app ? <ApplicationContext.Provider value={app}>{children}</ApplicationContext.Provider> : null}\n            </Component>\n        );\n    };\n};\n"]}

package/dist/components/window.d.ts

@@ -0,0 +1,8 @@
+import type * as Gtk from "@gtkx/gi/gtk";
+import { type ElementType, type ReactNode, type Ref } from "react";
+type WindowComponentProps = {
+    ref?: Ref<Gtk.Window | null> | undefined;
+};
+export declare const createWindowComponent: (Component: ElementType) => ((props: WindowComponentProps) => ReactNode);
+export {};
+//# sourceMappingURL=window.d.ts.map

package/dist/components/window.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"window.d.ts","sourceRoot":"","sources":["../../src/components/window.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,GAAG,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,SAAS,EAAE,KAAK,GAAG,EAA0C,MAAM,OAAO,CAAC;AAI3G,KAAK,oBAAoB,GAAG;IACxB,GAAG,CAAC,EAAE,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,SAAS,CAAC;CAC5C,CAAC;AAEF,eAAO,MAAM,qBAAqB,cAAe,WAAW,KAAG,CAAC,CAAC,KAAK,EAAE,oBAAoB,KAAK,SAAS,CA0BzG,CAAC"}

package/dist/components/window.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback, useLayoutEffect, useState } from "react";
+import { useMergeRefs } from "../hooks/use-merge-refs.js";
+import { ParentWindowContext } from "../hooks/use-parent-window.js";
+export const createWindowComponent = (Component) => {
+    return ({ ref, ...rest }) => {
+        const [window, setWindow] = useState(null);
+        const handleMount = useCallback((window) => {
+            setWindow(window);
+            return () => {
+                window.setDefaultWidget(null);
+                window.destroy();
+                setWindow(null);
+            };
+        }, []);
+        useLayoutEffect(() => {
+            window?.present();
+        }, [window]);
+        const mergedRef = useMergeRefs(ref, handleMount);
+        return (_jsx(ParentWindowContext.Provider, { value: window, children: _jsx(Component, { ref: mergedRef, ...rest }) }));
+    };
+};
+//# sourceMappingURL=window.js.map

package/dist/components/window.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"window.js","sourceRoot":"","sources":["../../src/components/window.tsx"],"names":[],"mappings":";AACA,OAAO,EAA8C,WAAW,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC3G,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,mBAAmB,EAAE,MAAM,+BAA+B,CAAC;AAMpE,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,SAAsB,EAAgD,EAAE;IAC1G,OAAO,CAAC,EAAE,GAAG,EAAE,GAAG,IAAI,EAAwB,EAAa,EAAE;QACzD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAoB,IAAI,CAAC,CAAC;QAE9D,MAAM,WAAW,GAAG,WAAW,CAAC,CAAC,MAAkB,EAAE,EAAE;YACnD,SAAS,CAAC,MAAM,CAAC,CAAC;YAElB,OAAO,GAAG,EAAE;gBACR,MAAM,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC;gBAC9B,MAAM,CAAC,OAAO,EAAE,CAAC;gBACjB,SAAS,CAAC,IAAI,CAAC,CAAC;YACpB,CAAC,CAAC;QACN,CAAC,EAAE,EAAE,CAAC,CAAC;QAEP,eAAe,CAAC,GAAG,EAAE;YACjB,MAAM,EAAE,OAAO,EAAE,CAAC;QACtB,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;QAEb,MAAM,SAAS,GAAG,YAAY,CAAC,GAAG,EAAE,WAAW,CAAC,CAAC;QAEjD,OAAO,CACH,KAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,MAAM,YACvC,KAAC,SAAS,IAAC,GAAG,EAAE,SAAS,KAAM,IAAI,GAAI,GACZ,CAClC,CAAC;IACN,CAAC,CAAC;AACN,CAAC,CAAC","sourcesContent":["import type * as Gtk from \"@gtkx/gi/gtk\";\nimport { type ElementType, type ReactNode, type Ref, useCallback, useLayoutEffect, useState } from \"react\";\nimport { useMergeRefs } from \"../hooks/use-merge-refs.js\";\nimport { ParentWindowContext } from \"../hooks/use-parent-window.js\";\n\ntype WindowComponentProps = {\n    ref?: Ref<Gtk.Window | null> | undefined;\n};\n\nexport const createWindowComponent = (Component: ElementType): ((props: WindowComponentProps) => ReactNode) => {\n    return ({ ref, ...rest }: WindowComponentProps): ReactNode => {\n        const [window, setWindow] = useState<Gtk.Window | null>(null);\n\n        const handleMount = useCallback((window: Gtk.Window) => {\n            setWindow(window);\n\n            return () => {\n                window.setDefaultWidget(null);\n                window.destroy();\n                setWindow(null);\n            };\n        }, []);\n\n        useLayoutEffect(() => {\n            window?.present();\n        }, [window]);\n\n        const mergedRef = useMergeRefs(ref, handleMount);\n\n        return (\n            <ParentWindowContext.Provider value={window}>\n                <Component ref={mergedRef} {...rest} />\n            </ParentWindowContext.Provider>\n        );\n    };\n};\n"]}

package/dist/hooks/use-application.d.ts

@@ -0,0 +1,8 @@
+import type * as Gtk from "@gtkx/gi/gtk";
+import { type Context } from "react";
+export declare const ApplicationContext: Context<Gtk.Application | null>;
+/**
+ * Returns the `Gtk.Application` provided by the nearest `Application` ancestor, throwing if used outside one.
+ */
+export declare const useApplication: () => Gtk.Application;
+//# sourceMappingURL=use-application.d.ts.map

package/dist/hooks/use-application.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-application.d.ts","sourceRoot":"","sources":["../../src/hooks/use-application.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,GAAG,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,KAAK,OAAO,EAAsB,MAAM,OAAO,CAAC;AAEzD,eAAO,MAAM,kBAAkB,EAAE,OAAO,CAAC,GAAG,CAAC,WAAW,GAAG,IAAI,CAA+C,CAAC;AAE/G;;GAEG;AACH,eAAO,MAAM,cAAc,QAAO,GAAG,CAAC,WAQrC,CAAC"}

package/dist/hooks/use-application.js

@@ -0,0 +1,13 @@
+import { createContext, use } from "react";
+export const ApplicationContext = createContext(null);
+/**
+ * Returns the `Gtk.Application` provided by the nearest `Application` ancestor, throwing if used outside one.
+ */
+export const useApplication = () => {
+    const context = use(ApplicationContext);
+    if (!context) {
+        throw new Error("Expected ApplicationContext: useApplication must be called within Application");
+    }
+    return context;
+};
+//# sourceMappingURL=use-application.js.map

package/dist/hooks/use-application.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-application.js","sourceRoot":"","sources":["../../src/hooks/use-application.ts"],"names":[],"mappings":"AACA,OAAO,EAAgB,aAAa,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAEzD,MAAM,CAAC,MAAM,kBAAkB,GAAoC,aAAa,CAAyB,IAAI,CAAC,CAAC;AAE/G;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,GAAoB,EAAE;IAChD,MAAM,OAAO,GAAG,GAAG,CAAC,kBAAkB,CAAC,CAAC;IAExC,IAAI,CAAC,OAAO,EAAE,CAAC;QACX,MAAM,IAAI,KAAK,CAAC,+EAA+E,CAAC,CAAC;IACrG,CAAC;IAED,OAAO,OAAO,CAAC;AACnB,CAAC,CAAC","sourcesContent":["import type * as Gtk from \"@gtkx/gi/gtk\";\nimport { type Context, createContext, use } from \"react\";\n\nexport const ApplicationContext: Context<Gtk.Application | null> = createContext<Gtk.Application | null>(null);\n\n/**\n * Returns the `Gtk.Application` provided by the nearest `Application` ancestor, throwing if used outside one.\n */\nexport const useApplication = (): Gtk.Application => {\n    const context = use(ApplicationContext);\n\n    if (!context) {\n        throw new Error(\"Expected ApplicationContext: useApplication must be called within Application\");\n    }\n\n    return context;\n};\n"]}

package/dist/hooks/use-bind-setting.d.ts

@@ -0,0 +1,6 @@
+import * as Gio from "@gtkx/gi/gio";
+import type * as GObject from "@gtkx/gi/gobject";
+import type { ObjectProp } from "../utils/object-prop.js";
+import { type SchemaRef } from "./use-setting.js";
+export declare function useBindSetting<K extends object, P extends keyof K & string>(schema: SchemaRef<K>, key: P, object: ObjectProp<GObject.Object>, property: string, flags?: Gio.SettingsBindFlags): void;
+//# sourceMappingURL=use-bind-setting.d.ts.map

package/dist/hooks/use-bind-setting.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-bind-setting.d.ts","sourceRoot":"","sources":["../../src/hooks/use-bind-setting.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,GAAG,MAAM,cAAc,CAAC;AACpC,OAAO,KAAK,KAAK,OAAO,MAAM,kBAAkB,CAAC;AAEjD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAE1D,OAAO,EAAE,KAAK,SAAS,EAAuB,MAAM,kBAAkB,CAAC;AAEvE,wBAAgB,cAAc,CAAC,CAAC,SAAS,MAAM,EAAE,CAAC,SAAS,MAAM,CAAC,GAAG,MAAM,EACvE,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC,EACpB,GAAG,EAAE,CAAC,EACN,MAAM,EAAE,UAAU,CAAC,OAAO,CAAC,MAAM,CAAC,EAClC,QAAQ,EAAE,MAAM,EAChB,KAAK,CAAC,EAAE,GAAG,CAAC,iBAAiB,GAC9B,IAAI,CAAC"}

package/dist/hooks/use-bind-setting.js

@@ -0,0 +1,19 @@
+import * as Gio from "@gtkx/gi/gio";
+import { toKebabCase } from "@gtkx/utils";
+import { useObjectAttachment } from "./use-object-attachment.js";
+import { useSettingsInstance } from "./use-setting.js";
+export function useBindSetting(schema, key, object, property, flags = Gio.SettingsBindFlags.DEFAULT) {
+    const settings = useSettingsInstance(schema);
+    const propertyName = toKebabCase(property);
+    useObjectAttachment(object, {
+        attach: (obj) => {
+            settings.bind(key, obj, propertyName, flags);
+            return obj;
+        },
+        detach: (obj) => {
+            Gio.Settings.unbind(obj, propertyName);
+        },
+        isSame: (attachment, current) => attachment === current,
+    });
+}
+//# sourceMappingURL=use-bind-setting.js.map

package/dist/hooks/use-bind-setting.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-bind-setting.js","sourceRoot":"","sources":["../../src/hooks/use-bind-setting.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,GAAG,MAAM,cAAc,CAAC;AAEpC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,OAAO,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AACjE,OAAO,EAAkB,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AASvE,MAAM,UAAU,cAAc,CAC1B,MAAiB,EACjB,GAAW,EACX,MAAkC,EAClC,QAAgB,EAChB,KAAK,GAA0B,GAAG,CAAC,iBAAiB,CAAC,OAAO;IAE5D,MAAM,QAAQ,GAAG,mBAAmB,CAAC,MAAM,CAAC,CAAC;IAC7C,MAAM,YAAY,GAAG,WAAW,CAAC,QAAQ,CAAC,CAAC;IAE3C,mBAAmB,CAAiC,MAAM,EAAE;QACxD,MAAM,EAAE,CAAC,GAAG,EAAE,EAAE;YACZ,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,YAAY,EAAE,KAAK,CAAC,CAAC;YAC7C,OAAO,GAAG,CAAC;QACf,CAAC;QACD,MAAM,EAAE,CAAC,GAAG,EAAE,EAAE;YACZ,GAAG,CAAC,QAAQ,CAAC,MAAM,CAAC,GAAG,EAAE,YAAY,CAAC,CAAC;QAC3C,CAAC;QACD,MAAM,EAAE,CAAC,UAAU,EAAE,OAAO,EAAE,EAAE,CAAC,UAAU,KAAK,OAAO;KAC1D,CAAC,CAAC;AACP,CAAC","sourcesContent":["import * as Gio from \"@gtkx/gi/gio\";\nimport type * as GObject from \"@gtkx/gi/gobject\";\nimport { toKebabCase } from \"@gtkx/utils\";\nimport type { ObjectProp } from \"../utils/object-prop.js\";\nimport { useObjectAttachment } from \"./use-object-attachment.js\";\nimport { type SchemaRef, useSettingsInstance } from \"./use-setting.js\";\n\nexport function useBindSetting<K extends object, P extends keyof K & string>(\n    schema: SchemaRef<K>,\n    key: P,\n    object: ObjectProp<GObject.Object>,\n    property: string,\n    flags?: Gio.SettingsBindFlags,\n): void;\nexport function useBindSetting(\n    schema: SchemaRef,\n    key: string,\n    object: ObjectProp<GObject.Object>,\n    property: string,\n    flags: Gio.SettingsBindFlags = Gio.SettingsBindFlags.DEFAULT,\n): void {\n    const settings = useSettingsInstance(schema);\n    const propertyName = toKebabCase(property);\n\n    useObjectAttachment<GObject.Object, GObject.Object>(object, {\n        attach: (obj) => {\n            settings.bind(key, obj, propertyName, flags);\n            return obj;\n        },\n        detach: (obj) => {\n            Gio.Settings.unbind(obj, propertyName);\n        },\n        isSame: (attachment, current) => attachment === current,\n    });\n}\n"]}

package/dist/hooks/use-merge-refs.d.ts

@@ -0,0 +1,3 @@
+import { type Ref, type RefCallback } from "react";
+export declare const useMergeRefs: <T>(...refs: Array<Ref<T | null> | undefined>) => RefCallback<T>;
+//# sourceMappingURL=use-merge-refs.d.ts.map

package/dist/hooks/use-merge-refs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-merge-refs.d.ts","sourceRoot":"","sources":["../../src/hooks/use-merge-refs.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,GAAG,EAAE,KAAK,WAAW,EAAwC,MAAM,OAAO,CAAC;AAqBzF,eAAO,MAAM,YAAY,GAAI,CAAC,WAAW,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,SAAS,CAAC,KAAG,WAAW,CAAC,CAAC,CA+BxF,CAAC"}

package/dist/hooks/use-merge-refs.js

@@ -0,0 +1,48 @@
+import { useCallback, useLayoutEffect, useRef } from "react";
+const attachRef = (ref, value) => {
+    if (typeof ref === "function") {
+        const cleanup = ref(value);
+        return typeof cleanup === "function" ? cleanup : () => ref(null);
+    }
+    if (ref) {
+        ref.current = value;
+        return () => {
+            ref.current = null;
+        };
+    }
+    return undefined;
+};
+export const useMergeRefs = (...refs) => {
+    const latestRefs = useRef(refs);
+    latestRefs.current = refs;
+    const attachedRef = useRef(null);
+    useLayoutEffect(() => {
+        const attached = attachedRef.current;
+        if (attached === null)
+            return;
+        const next = latestRefs.current;
+        for (let index = next.length; index < attached.entries.length; index += 1) {
+            attached.entries[index]?.cleanup?.();
+        }
+        attached.entries = next.map((ref, index) => {
+            const entry = attached.entries[index];
+            if (entry !== undefined && entry.ref === ref)
+                return entry;
+            entry?.cleanup?.();
+            return { ref, cleanup: attachRef(ref, attached.value) };
+        });
+    });
+    return useCallback((value) => {
+        const entries = latestRefs.current.map((ref) => ({ ref, cleanup: attachRef(ref, value) }));
+        attachedRef.current = { value, entries };
+        return () => {
+            const attached = attachedRef.current;
+            attachedRef.current = null;
+            if (attached) {
+                for (const entry of attached.entries)
+                    entry.cleanup?.();
+            }
+        };
+    }, []);
+};
+//# sourceMappingURL=use-merge-refs.js.map

package/dist/hooks/use-merge-refs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-merge-refs.js","sourceRoot":"","sources":["../../src/hooks/use-merge-refs.ts"],"names":[],"mappings":"AAAA,OAAO,EAA8B,WAAW,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAOzF,MAAM,SAAS,GAAG,CAAI,GAA8B,EAAE,KAAQ,EAA4B,EAAE;IACxF,IAAI,OAAO,GAAG,KAAK,UAAU,EAAE,CAAC;QAC5B,MAAM,OAAO,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC;QAC3B,OAAO,OAAO,OAAO,KAAK,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;IACrE,CAAC;IACD,IAAI,GAAG,EAAE,CAAC;QACN,GAAG,CAAC,OAAO,GAAG,KAAK,CAAC;QACpB,OAAO,GAAG,EAAE;YACR,GAAG,CAAC,OAAO,GAAG,IAAI,CAAC;QACvB,CAAC,CAAC;IACN,CAAC;IACD,OAAO,SAAS,CAAC;AACrB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,CAAI,GAAG,IAAsC,EAAkB,EAAE;IACzF,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAChC,UAAU,CAAC,OAAO,GAAG,IAAI,CAAC;IAC1B,MAAM,WAAW,GAAG,MAAM,CAAoD,IAAI,CAAC,CAAC;IAEpF,eAAe,CAAC,GAAG,EAAE;QACjB,MAAM,QAAQ,GAAG,WAAW,CAAC,OAAO,CAAC;QACrC,IAAI,QAAQ,KAAK,IAAI;YAAE,OAAO;QAC9B,MAAM,IAAI,GAAG,UAAU,CAAC,OAAO,CAAC;QAChC,KAAK,IAAI,KAAK,GAAG,IAAI,CAAC,MAAM,EAAE,KAAK,GAAG,QAAQ,CAAC,OAAO,CAAC,MAAM,EAAE,KAAK,IAAI,CAAC,EAAE,CAAC;YACxE,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,OAAO,EAAE,EAAE,CAAC;QACzC,CAAC;QACD,QAAQ,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE;YACvC,MAAM,KAAK,GAAG,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;YACtC,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG;gBAAE,OAAO,KAAK,CAAC;YAC3D,KAAK,EAAE,OAAO,EAAE,EAAE,CAAC;YACnB,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE,SAAS,CAAC,GAAG,EAAE,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAC;QAC5D,CAAC,CAAC,CAAC;IACP,CAAC,CAAC,CAAC;IAEH,OAAO,WAAW,CAAC,CAAC,KAAQ,EAAE,EAAE;QAC5B,MAAM,OAAO,GAAG,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,OAAO,EAAE,SAAS,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC;QAC3F,WAAW,CAAC,OAAO,GAAG,EAAE,KAAK,EAAE,OAAO,EAAE,CAAC;QACzC,OAAO,GAAG,EAAE;YACR,MAAM,QAAQ,GAAG,WAAW,CAAC,OAAO,CAAC;YACrC,WAAW,CAAC,OAAO,GAAG,IAAI,CAAC;YAC3B,IAAI,QAAQ,EAAE,CAAC;gBACX,KAAK,MAAM,KAAK,IAAI,QAAQ,CAAC,OAAO;oBAAE,KAAK,CAAC,OAAO,EAAE,EAAE,CAAC;YAC5D,CAAC;QACL,CAAC,CAAC;IACN,CAAC,EAAE,EAAE,CAAC,CAAC;AACX,CAAC,CAAC","sourcesContent":["import { type Ref, type RefCallback, useCallback, useLayoutEffect, useRef } from \"react\";\n\ntype MergedRefEntry<T> = {\n    ref: Ref<T | null> | undefined;\n    cleanup: (() => void) | undefined;\n};\n\nconst attachRef = <T>(ref: Ref<T | null> | undefined, value: T): (() => void) | undefined => {\n    if (typeof ref === \"function\") {\n        const cleanup = ref(value);\n        return typeof cleanup === \"function\" ? cleanup : () => ref(null);\n    }\n    if (ref) {\n        ref.current = value;\n        return () => {\n            ref.current = null;\n        };\n    }\n    return undefined;\n};\n\nexport const useMergeRefs = <T>(...refs: Array<Ref<T | null> | undefined>): RefCallback<T> => {\n    const latestRefs = useRef(refs);\n    latestRefs.current = refs;\n    const attachedRef = useRef<{ value: T; entries: MergedRefEntry<T>[] } | null>(null);\n\n    useLayoutEffect(() => {\n        const attached = attachedRef.current;\n        if (attached === null) return;\n        const next = latestRefs.current;\n        for (let index = next.length; index < attached.entries.length; index += 1) {\n            attached.entries[index]?.cleanup?.();\n        }\n        attached.entries = next.map((ref, index) => {\n            const entry = attached.entries[index];\n            if (entry !== undefined && entry.ref === ref) return entry;\n            entry?.cleanup?.();\n            return { ref, cleanup: attachRef(ref, attached.value) };\n        });\n    });\n\n    return useCallback((value: T) => {\n        const entries = latestRefs.current.map((ref) => ({ ref, cleanup: attachRef(ref, value) }));\n        attachedRef.current = { value, entries };\n        return () => {\n            const attached = attachedRef.current;\n            attachedRef.current = null;\n            if (attached) {\n                for (const entry of attached.entries) entry.cleanup?.();\n            }\n        };\n    }, []);\n};\n"]}

package/dist/hooks/use-object-attachment.d.ts

@@ -0,0 +1,10 @@
+import type * as GObject from "@gtkx/gi/gobject";
+import { type ObjectProp } from "../utils/object-prop.js";
+type ObjectAttachmentOps<T extends GObject.Object, A> = {
+    attach(object: T): A;
+    detach(attachment: A): void;
+    isSame(attachment: A, object: T): boolean;
+};
+export declare const useObjectAttachment: <T extends GObject.Object, A>(object: ObjectProp<T>, ops: ObjectAttachmentOps<T, A>) => void;
+export {};
+//# sourceMappingURL=use-object-attachment.d.ts.map

package/dist/hooks/use-object-attachment.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-object-attachment.d.ts","sourceRoot":"","sources":["../../src/hooks/use-object-attachment.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,OAAO,MAAM,kBAAkB,CAAC;AAEjD,OAAO,EAAE,KAAK,UAAU,EAAqB,MAAM,yBAAyB,CAAC;AAE7E,KAAK,mBAAmB,CAAC,CAAC,SAAS,OAAO,CAAC,MAAM,EAAE,CAAC,IAAI;IACpD,MAAM,CAAC,MAAM,EAAE,CAAC,GAAG,CAAC,CAAC;IACrB,MAAM,CAAC,UAAU,EAAE,CAAC,GAAG,IAAI,CAAC;IAC5B,MAAM,CAAC,UAAU,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,GAAG,OAAO,CAAC;CAC7C,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,CAAC,SAAS,OAAO,CAAC,MAAM,EAAE,CAAC,UACnD,UAAU,CAAC,CAAC,CAAC,OAChB,mBAAmB,CAAC,CAAC,EAAE,CAAC,CAAC,KAC/B,IAqBF,CAAC"}

package/dist/hooks/use-object-attachment.js

@@ -0,0 +1,24 @@
+import { useLayoutEffect, useRef } from "react";
+import { resolveObjectProp } from "../utils/object-prop.js";
+export const useObjectAttachment = (object, ops) => {
+    const attachmentRef = useRef(null);
+    const drop = () => {
+        const attachment = attachmentRef.current;
+        if (attachment !== null) {
+            ops.detach(attachment);
+            attachmentRef.current = null;
+        }
+    };
+    useLayoutEffect(() => {
+        const resolved = resolveObjectProp(object);
+        const attachment = attachmentRef.current;
+        if (attachment !== null && resolved !== null && ops.isSame(attachment, resolved))
+            return;
+        drop();
+        if (resolved === null)
+            return;
+        attachmentRef.current = ops.attach(resolved);
+    });
+    useLayoutEffect(() => () => drop(), []);
+};
+//# sourceMappingURL=use-object-attachment.js.map

package/dist/hooks/use-object-attachment.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-object-attachment.js","sourceRoot":"","sources":["../../src/hooks/use-object-attachment.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,EAAmB,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAQ7E,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAC/B,MAAqB,EACrB,GAA8B,EAC1B,EAAE;IACN,MAAM,aAAa,GAAG,MAAM,CAAW,IAAI,CAAC,CAAC;IAE7C,MAAM,IAAI,GAAG,GAAS,EAAE;QACpB,MAAM,UAAU,GAAG,aAAa,CAAC,OAAO,CAAC;QACzC,IAAI,UAAU,KAAK,IAAI,EAAE,CAAC;YACtB,GAAG,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;YACvB,aAAa,CAAC,OAAO,GAAG,IAAI,CAAC;QACjC,CAAC;IACL,CAAC,CAAC;IAEF,eAAe,CAAC,GAAG,EAAE;QACjB,MAAM,QAAQ,GAAG,iBAAiB,CAAC,MAAM,CAAC,CAAC;QAC3C,MAAM,UAAU,GAAG,aAAa,CAAC,OAAO,CAAC;QACzC,IAAI,UAAU,KAAK,IAAI,IAAI,QAAQ,KAAK,IAAI,IAAI,GAAG,CAAC,MAAM,CAAC,UAAU,EAAE,QAAQ,CAAC;YAAE,OAAO;QACzF,IAAI,EAAE,CAAC;QACP,IAAI,QAAQ,KAAK,IAAI;YAAE,OAAO;QAC9B,aAAa,CAAC,OAAO,GAAG,GAAG,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;IACjD,CAAC,CAAC,CAAC;IAEH,eAAe,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE,CAAC,IAAI,EAAE,EAAE,EAAE,CAAC,CAAC;AAC5C,CAAC,CAAC","sourcesContent":["import type * as GObject from \"@gtkx/gi/gobject\";\nimport { useLayoutEffect, useRef } from \"react\";\nimport { type ObjectProp, resolveObjectProp } from \"../utils/object-prop.js\";\n\ntype ObjectAttachmentOps<T extends GObject.Object, A> = {\n    attach(object: T): A;\n    detach(attachment: A): void;\n    isSame(attachment: A, object: T): boolean;\n};\n\nexport const useObjectAttachment = <T extends GObject.Object, A>(\n    object: ObjectProp<T>,\n    ops: ObjectAttachmentOps<T, A>,\n): void => {\n    const attachmentRef = useRef<A | null>(null);\n\n    const drop = (): void => {\n        const attachment = attachmentRef.current;\n        if (attachment !== null) {\n            ops.detach(attachment);\n            attachmentRef.current = null;\n        }\n    };\n\n    useLayoutEffect(() => {\n        const resolved = resolveObjectProp(object);\n        const attachment = attachmentRef.current;\n        if (attachment !== null && resolved !== null && ops.isSame(attachment, resolved)) return;\n        drop();\n        if (resolved === null) return;\n        attachmentRef.current = ops.attach(resolved);\n    });\n\n    useLayoutEffect(() => () => drop(), []);\n};\n"]}

package/dist/hooks/use-object-value.d.ts

@@ -0,0 +1,4 @@
+import type * as GObject from "@gtkx/gi/gobject";
+import { type ObjectProp } from "../utils/object-prop.js";
+export declare function useObjectValue<T extends GObject.Object, V>(object: ObjectProp<T>, signal: string, read: (object: T | null) => V): V;
+//# sourceMappingURL=use-object-value.d.ts.map

package/dist/hooks/use-object-value.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-object-value.d.ts","sourceRoot":"","sources":["../../src/hooks/use-object-value.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,OAAO,MAAM,kBAAkB,CAAC;AAGjD,OAAO,EAAE,KAAK,UAAU,EAAqB,MAAM,yBAAyB,CAAC;AAQ7E,wBAAgB,cAAc,CAAC,CAAC,SAAS,OAAO,CAAC,MAAM,EAAE,CAAC,EACtD,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC,EACrB,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,CAAC,MAAM,EAAE,CAAC,GAAG,IAAI,KAAK,CAAC,GAC9B,CAAC,CAkCH"}

package/dist/hooks/use-object-value.js

@@ -0,0 +1,32 @@
+import { useCallback, useRef, useSyncExternalStore } from "react";
+import { resolveObjectProp } from "../utils/object-prop.js";
+export function useObjectValue(object, signal, read) {
+    const resolved = resolveObjectProp(object);
+    const readRef = useRef(read);
+    readRef.current = read;
+    const cacheRef = useRef(null);
+    const readNow = useCallback(() => {
+        const cache = { object: resolved, signal, value: readRef.current(resolved) };
+        cacheRef.current = cache;
+        return cache;
+    }, [resolved, signal]);
+    const getSnapshot = useCallback(() => {
+        const cache = cacheRef.current;
+        if (cache !== null && cache.object === resolved && cache.signal === signal) {
+            return cache.value;
+        }
+        return readNow().value;
+    }, [resolved, signal, readNow]);
+    const subscribe = useCallback((onStoreChange) => {
+        if (resolved === null)
+            return () => { };
+        const handler = () => {
+            readNow();
+            onStoreChange();
+        };
+        resolved.on(signal, handler);
+        return () => resolved.off(signal, handler);
+    }, [resolved, signal, readNow]);
+    return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+}
+//# sourceMappingURL=use-object-value.js.map

package/dist/hooks/use-object-value.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-object-value.js","sourceRoot":"","sources":["../../src/hooks/use-object-value.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAClE,OAAO,EAAmB,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAQ7E,MAAM,UAAU,cAAc,CAC1B,MAAqB,EACrB,MAAc,EACd,IAA6B;IAE7B,MAAM,QAAQ,GAAG,iBAAiB,CAAC,MAAM,CAAC,CAAC;IAC3C,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAC7B,OAAO,CAAC,OAAO,GAAG,IAAI,CAAC;IACvB,MAAM,QAAQ,GAAG,MAAM,CAAgC,IAAI,CAAC,CAAC;IAE7D,MAAM,OAAO,GAAG,WAAW,CAAC,GAA2B,EAAE;QACrD,MAAM,KAAK,GAAG,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC;QAC7E,QAAQ,CAAC,OAAO,GAAG,KAAK,CAAC;QACzB,OAAO,KAAK,CAAC;IACjB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC,CAAC;IAEvB,MAAM,WAAW,GAAG,WAAW,CAAC,GAAM,EAAE;QACpC,MAAM,KAAK,GAAG,QAAQ,CAAC,OAAO,CAAC;QAC/B,IAAI,KAAK,KAAK,IAAI,IAAI,KAAK,CAAC,MAAM,KAAK,QAAQ,IAAI,KAAK,CAAC,MAAM,KAAK,MAAM,EAAE,CAAC;YACzE,OAAO,KAAK,CAAC,KAAK,CAAC;QACvB,CAAC;QACD,OAAO,OAAO,EAAE,CAAC,KAAK,CAAC;IAC3B,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IAEhC,MAAM,SAAS,GAAG,WAAW,CACzB,CAAC,aAAyB,EAAgB,EAAE;QACxC,IAAI,QAAQ,KAAK,IAAI;YAAE,OAAO,GAAG,EAAE,GAAE,CAAC,CAAC;QACvC,MAAM,OAAO,GAAkB,GAAG,EAAE;YAChC,OAAO,EAAE,CAAC;YACV,aAAa,EAAE,CAAC;QACpB,CAAC,CAAC;QACF,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QAC7B,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC/C,CAAC,EACD,CAAC,QAAQ,EAAE,MAAM,EAAE,OAAO,CAAC,CAC9B,CAAC;IAEF,OAAO,oBAAoB,CAAC,SAAS,EAAE,WAAW,EAAE,WAAW,CAAC,CAAC;AACrE,CAAC","sourcesContent":["import type * as GObject from \"@gtkx/gi/gobject\";\nimport type { SignalHandler } from \"@gtkx/runtime\";\nimport { useCallback, useRef, useSyncExternalStore } from \"react\";\nimport { type ObjectProp, resolveObjectProp } from \"../utils/object-prop.js\";\n\ntype ObjectValueCache<T extends GObject.Object, V> = {\n    object: T | null;\n    signal: string;\n    value: V;\n};\n\nexport function useObjectValue<T extends GObject.Object, V>(\n    object: ObjectProp<T>,\n    signal: string,\n    read: (object: T | null) => V,\n): V {\n    const resolved = resolveObjectProp(object);\n    const readRef = useRef(read);\n    readRef.current = read;\n    const cacheRef = useRef<ObjectValueCache<T, V> | null>(null);\n\n    const readNow = useCallback((): ObjectValueCache<T, V> => {\n        const cache = { object: resolved, signal, value: readRef.current(resolved) };\n        cacheRef.current = cache;\n        return cache;\n    }, [resolved, signal]);\n\n    const getSnapshot = useCallback((): V => {\n        const cache = cacheRef.current;\n        if (cache !== null && cache.object === resolved && cache.signal === signal) {\n            return cache.value;\n        }\n        return readNow().value;\n    }, [resolved, signal, readNow]);\n\n    const subscribe = useCallback(\n        (onStoreChange: () => void): (() => void) => {\n            if (resolved === null) return () => {};\n            const handler: SignalHandler = () => {\n                readNow();\n                onStoreChange();\n            };\n            resolved.on(signal, handler);\n            return () => resolved.off(signal, handler);\n        },\n        [resolved, signal, readNow],\n    );\n\n    return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n"]}

package/dist/hooks/use-parent-window.d.ts

@@ -0,0 +1,8 @@
+import type * as Gtk from "@gtkx/gi/gtk";
+import { type Context } from "react";
+export declare const ParentWindowContext: Context<Gtk.Window | null>;
+/**
+ * Returns the `Gtk.Window` provided by the nearest window ancestor, or `null` when there is none.
+ */
+export declare const useParentWindow: () => Gtk.Window | null;
+//# sourceMappingURL=use-parent-window.d.ts.map

package/dist/hooks/use-parent-window.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-parent-window.d.ts","sourceRoot":"","sources":["../../src/hooks/use-parent-window.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,GAAG,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,KAAK,OAAO,EAAsB,MAAM,OAAO,CAAC;AAEzD,eAAO,MAAM,mBAAmB,EAAE,OAAO,CAAC,GAAG,CAAC,MAAM,GAAG,IAAI,CAA0C,CAAC;AAEtG;;GAEG;AACH,eAAO,MAAM,eAAe,QAAO,GAAG,CAAC,MAAM,GAAG,IAAgC,CAAC"}

package/dist/hooks/use-parent-window.js

@@ -0,0 +1,7 @@
+import { createContext, use } from "react";
+export const ParentWindowContext = createContext(null);
+/**
+ * Returns the `Gtk.Window` provided by the nearest window ancestor, or `null` when there is none.
+ */
+export const useParentWindow = () => use(ParentWindowContext);
+//# sourceMappingURL=use-parent-window.js.map

package/dist/hooks/use-parent-window.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-parent-window.js","sourceRoot":"","sources":["../../src/hooks/use-parent-window.ts"],"names":[],"mappings":"AACA,OAAO,EAAgB,aAAa,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAEzD,MAAM,CAAC,MAAM,mBAAmB,GAA+B,aAAa,CAAoB,IAAI,CAAC,CAAC;AAEtG;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,GAAsB,EAAE,CAAC,GAAG,CAAC,mBAAmB,CAAC,CAAC","sourcesContent":["import type * as Gtk from \"@gtkx/gi/gtk\";\nimport { type Context, createContext, use } from \"react\";\n\nexport const ParentWindowContext: Context<Gtk.Window | null> = createContext<Gtk.Window | null>(null);\n\n/**\n * Returns the `Gtk.Window` provided by the nearest window ancestor, or `null` when there is none.\n */\nexport const useParentWindow = (): Gtk.Window | null => use(ParentWindowContext);\n"]}