@gtkx/forms 0.0.1

package/README.md

@@ -0,0 +1,174 @@
+<p align="center">
+  <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">
+  The React framework for Linux, built on GTK.<br />
+  Write native GTK4 desktop applications with React and TypeScript.
+  Real GTK widgets, the GNOME stack, and standard web tooling.
+</p>
+
+<p align="center">
+  <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/getting-started">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>
+
+---
+
+<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>
+
+<p align="center">
+  <em>The Tasks app you build in the <a href="https://gtkx.dev/tutorial/">tutorial</a>.</em>
+</p>
+
+## Demo
+
+The intrinsic elements in this snippet render GTK4 widgets, and ordinary React hooks and events drive them:
+
+```tsx
+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 Counter = () => {
+  const [count, setCount] = useState(0);
+
+  return (
+    <GtkApplicationWindow
+      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 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>
+  );
+};
+
+const App = () => (
+  <GtkApplication>
+    <Counter />
+  </GtkApplication>
+);
+
+createRoot().render(<App />);
+```
+
+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.
+
+## Why GTKX
+
+### 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, React Hook Form-powered Adwaita controls, React Spring animations, React Navigation stack, tab, drawer, and split view navigators, 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 what running on Node.js means day to day.
+
+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.
+
+## Quick start
+
+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
+```
+
+The same command works with other package managers: `pnpm create gtkx` or `yarn create gtkx`.
+
+Then run your new app:
+
+```sh
+cd my-app
+npm run dev
+```
+
+To go further, follow the [tutorial](https://gtkx.dev/tutorial/).
+
+## 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.
+
+**[Read the docs &rarr;](https://gtkx.dev/guide/why-gtkx)**
+
+## Requirements
+
+GTKX is Linux-only. You need:
+
+- Linux with the GTK4 (4.20 or later) and GLib development libraries, plus Adwaita (1.8 or later) once your project binds `Adw-1`
+- 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.
+- [`animations`](https://github.com/gtkx-org/gtkx/tree/main/examples/animations): a tour of `@gtkx/animated`, React Spring animations driven by the GTK frame clock.
+- [`navigation`](https://github.com/gtkx-org/gtkx/tree/main/examples/navigation): a tour of `@gtkx/navigation`, React Navigation's stack, tab, and drawer navigators rendered with libadwaita.
+- [`tutorial`](https://github.com/gtkx-org/gtkx/tree/main/examples/tutorial): the Tasks app the documentation builds.
+
+## Status
+
+GTKX is stable and ready for production use.
+
+## Contributing
+
+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
+
+GTKX is licensed under [MPL-2.0](https://github.com/gtkx-org/gtkx/blob/main/LICENSE).

package/dist/combo-row.d.ts

@@ -0,0 +1,7 @@
+import type { ReactNode } from "react";
+import { type FieldValues } from "react-hook-form";
+import type { ComboRowProps, FormFieldPath } from "./types.js";
+/** Renders an ID-based Adwaita combo row controlled by React Hook Form. */
+declare function ComboRow<TFieldValues extends FieldValues = FieldValues, TName extends FormFieldPath<TFieldValues, string> = FormFieldPath<TFieldValues, string>, TTransformedValues = TFieldValues, TItem = unknown, TSection = unknown>(props: ComboRowProps<TFieldValues, TName, TTransformedValues, TItem, TSection>): ReactNode;
+export { ComboRow };
+//# sourceMappingURL=combo-row.d.ts.map

package/dist/combo-row.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"combo-row.d.ts","sourceRoot":"","sources":["../src/combo-row.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,KAAK,WAAW,EAAiB,MAAM,iBAAiB,CAAC;AAClE,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAG/D,2EAA2E;AAC3E,iBAAS,QAAQ,CACb,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,aAAa,CAAC,YAAY,EAAE,MAAM,CAAC,GAAG,aAAa,CAAC,YAAY,EAAE,MAAM,CAAC,EACvF,kBAAkB,GAAG,YAAY,EACjC,KAAK,GAAG,OAAO,EACf,QAAQ,GAAG,OAAO,EACpB,KAAK,EAAE,aAAa,CAAC,YAAY,EAAE,KAAK,EAAE,kBAAkB,EAAE,KAAK,EAAE,QAAQ,CAAC,GAAG,SAAS,CAgC3F;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}

package/dist/combo-row.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ComboRow as BaseComboRow } from "@gtkx/components/adw";
+import { useController } from "react-hook-form";
+import { useFieldWidget, widgetProps } from "./internal/field.js";
+/** Renders an ID-based Adwaita combo row controlled by React Hook Form. */
+function ComboRow(props) {
+    const { field, fieldState } = useController(props);
+    const rowProps = widgetProps(props);
+    const binding = useFieldWidget({
+        controllerRef: field.ref,
+        forwardedRef: rowProps.ref,
+        controllers: rowProps.controllers,
+        cssClasses: rowProps.cssClasses,
+        sensitive: rowProps.sensitive,
+        tooltipText: rowProps.tooltipText,
+        disabled: field.disabled,
+        isInvalid: fieldState.invalid,
+        errorMessage: fieldState.error?.message,
+    }, field.onBlur);
+    const selectedId = typeof field.value === "string" ? field.value : null;
+    return (_jsx(BaseComboRow, { ...rowProps, ...binding, selectedId: selectedId, onSelectionChanged: (id) => {
+            field.onChange(id);
+            rowProps.onSelectionChanged?.(id);
+        } }));
+}
+export { ComboRow };
+//# sourceMappingURL=combo-row.js.map

package/dist/combo-row.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"combo-row.js","sourceRoot":"","sources":["../src/combo-row.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,QAAQ,IAAI,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAChE,OAAO,EAAoB,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAElE,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAElE,2EAA2E;AAC3E,SAAS,QAAQ,CAMf,KAA8E;IAC5E,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,GAAG,aAAa,CAA0C,KAAK,CAAC,CAAC;IAC5F,MAAM,QAAQ,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;IAEpC,MAAM,OAAO,GAAG,cAAc,CAC1B;QACI,aAAa,EAAE,KAAK,CAAC,GAAG;QACxB,YAAY,EAAE,QAAQ,CAAC,GAAG;QAC1B,WAAW,EAAE,QAAQ,CAAC,WAAW;QACjC,UAAU,EAAE,QAAQ,CAAC,UAAU;QAC/B,SAAS,EAAE,QAAQ,CAAC,SAAS;QAC7B,WAAW,EAAE,QAAQ,CAAC,WAAW;QACjC,QAAQ,EAAE,KAAK,CAAC,QAAQ;QACxB,SAAS,EAAE,UAAU,CAAC,OAAO;QAC7B,YAAY,EAAE,UAAU,CAAC,KAAK,EAAE,OAAO;KAC1C,EACD,KAAK,CAAC,MAAM,CACf,CAAC;IAEF,MAAM,UAAU,GAAG,OAAO,KAAK,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC;IAExE,OAAO,CACH,KAAC,YAAY,OACL,QAAQ,KACR,OAAO,EACX,UAAU,EAAE,UAAU,EACtB,kBAAkB,EAAE,CAAC,EAAE,EAAE,EAAE;YACvB,KAAK,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;YACnB,QAAQ,CAAC,kBAAkB,EAAE,CAAC,EAAE,CAAC,CAAC;QACtC,CAAC,GACH,CACL,CAAC;AACN,CAAC;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC","sourcesContent":["import type * as Adw from \"@gtkx/gi/adw\";\nimport type { ReactNode } from \"react\";\nimport { ComboRow as BaseComboRow } from \"@gtkx/components/adw\";\nimport { type FieldValues, useController } from \"react-hook-form\";\nimport type { ComboRowProps, FormFieldPath } from \"./types.js\";\nimport { useFieldWidget, widgetProps } from \"./internal/field.js\";\n\n/** Renders an ID-based Adwaita combo row controlled by React Hook Form. */\nfunction ComboRow<\n    TFieldValues extends FieldValues = FieldValues,\n    TName extends FormFieldPath<TFieldValues, string> = FormFieldPath<TFieldValues, string>,\n    TTransformedValues = TFieldValues,\n    TItem = unknown,\n    TSection = unknown,\n>(props: ComboRowProps<TFieldValues, TName, TTransformedValues, TItem, TSection>): ReactNode {\n    const { field, fieldState } = useController<TFieldValues, TName, TTransformedValues>(props);\n    const rowProps = widgetProps(props);\n\n    const binding = useFieldWidget<Adw.ComboRow>(\n        {\n            controllerRef: field.ref,\n            forwardedRef: rowProps.ref,\n            controllers: rowProps.controllers,\n            cssClasses: rowProps.cssClasses,\n            sensitive: rowProps.sensitive,\n            tooltipText: rowProps.tooltipText,\n            disabled: field.disabled,\n            isInvalid: fieldState.invalid,\n            errorMessage: fieldState.error?.message,\n        },\n        field.onBlur,\n    );\n\n    const selectedId = typeof field.value === \"string\" ? field.value : null;\n\n    return (\n        <BaseComboRow\n            {...rowProps}\n            {...binding}\n            selectedId={selectedId}\n            onSelectionChanged={(id) => {\n                field.onChange(id);\n                rowProps.onSelectionChanged?.(id);\n            }}\n        />\n    );\n}\n\nexport { ComboRow };\n"]}

package/dist/entry-row.d.ts

@@ -0,0 +1,7 @@
+import type { ReactNode } from "react";
+import { type FieldValues } from "react-hook-form";
+import type { EntryRowProps, FormFieldPath } from "./types.js";
+/** Renders an `Adw.EntryRow` controlled by React Hook Form. */
+declare function EntryRow<TFieldValues extends FieldValues = FieldValues, TName extends FormFieldPath<TFieldValues, string> = FormFieldPath<TFieldValues, string>, TTransformedValues = TFieldValues>(props: EntryRowProps<TFieldValues, TName, TTransformedValues>): ReactNode;
+export { EntryRow };
+//# sourceMappingURL=entry-row.d.ts.map

package/dist/entry-row.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"entry-row.d.ts","sourceRoot":"","sources":["../src/entry-row.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,KAAK,WAAW,EAAiB,MAAM,iBAAiB,CAAC;AAClE,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAO/D,+DAA+D;AAC/D,iBAAS,QAAQ,CACb,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,aAAa,CAAC,YAAY,EAAE,MAAM,CAAC,GAAG,aAAa,CAAC,YAAY,EAAE,MAAM,CAAC,EACvF,kBAAkB,GAAG,YAAY,EACnC,KAAK,EAAE,aAAa,CAAC,YAAY,EAAE,KAAK,EAAE,kBAAkB,CAAC,GAAG,SAAS,CAiC1E;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}

package/dist/entry-row.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { AdwEntryRow } from "@gtkx/jsx/adw";
+import { useController } from "react-hook-form";
+import { useFieldWidget, widgetProps } from "./internal/field.js";
+const selectText = (row) => {
+    row.selectRegion(0, -1);
+};
+/** Renders an `Adw.EntryRow` controlled by React Hook Form. */
+function EntryRow(props) {
+    const { field, fieldState } = useController(props);
+    const rowProps = widgetProps(props);
+    const binding = useFieldWidget({
+        controllerRef: field.ref,
+        forwardedRef: rowProps.ref,
+        controllers: rowProps.controllers,
+        cssClasses: rowProps.cssClasses,
+        sensitive: rowProps.sensitive,
+        tooltipText: rowProps.tooltipText,
+        disabled: field.disabled,
+        isInvalid: fieldState.invalid,
+        errorMessage: fieldState.error?.message,
+        select: selectText,
+    }, field.onBlur);
+    const value = typeof field.value === "string" ? field.value : "";
+    return (_jsx(AdwEntryRow, { ...rowProps, ...binding, text: value, onNotifyText: (text, row) => {
+            field.onChange(text ?? "");
+            rowProps.onNotifyText?.(text, row);
+        } }));
+}
+export { EntryRow };
+//# sourceMappingURL=entry-row.js.map

package/dist/entry-row.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"entry-row.js","sourceRoot":"","sources":["../src/entry-row.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAoB,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAElE,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAElE,MAAM,UAAU,GAAG,CAAC,GAAiB,EAAQ,EAAE;IAC3C,GAAG,CAAC,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;AAC5B,CAAC,CAAC;AAEF,+DAA+D;AAC/D,SAAS,QAAQ,CAIf,KAA6D;IAC3D,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,GAAG,aAAa,CAA0C,KAAK,CAAC,CAAC;IAC5F,MAAM,QAAQ,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;IAEpC,MAAM,OAAO,GAAG,cAAc,CAC1B;QACI,aAAa,EAAE,KAAK,CAAC,GAAG;QACxB,YAAY,EAAE,QAAQ,CAAC,GAAG;QAC1B,WAAW,EAAE,QAAQ,CAAC,WAAW;QACjC,UAAU,EAAE,QAAQ,CAAC,UAAU;QAC/B,SAAS,EAAE,QAAQ,CAAC,SAAS;QAC7B,WAAW,EAAE,QAAQ,CAAC,WAAW;QACjC,QAAQ,EAAE,KAAK,CAAC,QAAQ;QACxB,SAAS,EAAE,UAAU,CAAC,OAAO;QAC7B,YAAY,EAAE,UAAU,CAAC,KAAK,EAAE,OAAO;QACvC,MAAM,EAAE,UAAU;KACrB,EACD,KAAK,CAAC,MAAM,CACf,CAAC;IAEF,MAAM,KAAK,GAAG,OAAO,KAAK,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC;IAEjE,OAAO,CACH,KAAC,WAAW,OACJ,QAAQ,KACR,OAAO,EACX,IAAI,EAAE,KAAK,EACX,YAAY,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,EAAE;YACxB,KAAK,CAAC,QAAQ,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC;YAC3B,QAAQ,CAAC,YAAY,EAAE,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;QACvC,CAAC,GACH,CACL,CAAC;AACN,CAAC;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC","sourcesContent":["import type * as Adw from \"@gtkx/gi/adw\";\nimport type { ReactNode } from \"react\";\nimport { AdwEntryRow } from \"@gtkx/jsx/adw\";\nimport { type FieldValues, useController } from \"react-hook-form\";\nimport type { EntryRowProps, FormFieldPath } from \"./types.js\";\nimport { useFieldWidget, widgetProps } from \"./internal/field.js\";\n\nconst selectText = (row: Adw.EntryRow): void => {\n    row.selectRegion(0, -1);\n};\n\n/** Renders an `Adw.EntryRow` controlled by React Hook Form. */\nfunction EntryRow<\n    TFieldValues extends FieldValues = FieldValues,\n    TName extends FormFieldPath<TFieldValues, string> = FormFieldPath<TFieldValues, string>,\n    TTransformedValues = TFieldValues,\n>(props: EntryRowProps<TFieldValues, TName, TTransformedValues>): ReactNode {\n    const { field, fieldState } = useController<TFieldValues, TName, TTransformedValues>(props);\n    const rowProps = widgetProps(props);\n\n    const binding = useFieldWidget<Adw.EntryRow>(\n        {\n            controllerRef: field.ref,\n            forwardedRef: rowProps.ref,\n            controllers: rowProps.controllers,\n            cssClasses: rowProps.cssClasses,\n            sensitive: rowProps.sensitive,\n            tooltipText: rowProps.tooltipText,\n            disabled: field.disabled,\n            isInvalid: fieldState.invalid,\n            errorMessage: fieldState.error?.message,\n            select: selectText,\n        },\n        field.onBlur,\n    );\n\n    const value = typeof field.value === \"string\" ? field.value : \"\";\n\n    return (\n        <AdwEntryRow\n            {...rowProps}\n            {...binding}\n            text={value}\n            onNotifyText={(text, row) => {\n                field.onChange(text ?? \"\");\n                rowProps.onNotifyText?.(text, row);\n            }}\n        />\n    );\n}\n\nexport { EntryRow };\n"]}

package/dist/index.d.ts

@@ -0,0 +1,9 @@
+export { ComboRow } from "./combo-row.js";
+export { EntryRow } from "./entry-row.js";
+export { PasswordEntryRow } from "./password-entry-row.js";
+export { SpinRow } from "./spin-row.js";
+export { SwitchRow } from "./switch-row.js";
+export type { ComboRowProps, EntryRowProps, FormFieldPath, FormFieldProps, PasswordEntryRowProps, SpinRowProps, SwitchRowProps, } from "./types.js";
+export { Controller, FormProvider, useController, useFieldArray, useForm, useFormContext, useFormState, useWatch, } from "react-hook-form";
+export type { ArrayPath, Control, ControllerFieldState, ControllerProps, ControllerRenderProps, DeepPartial, DefaultValues, ErrorOption, FieldArrayPath, FieldArrayWithId, FieldError, FieldErrors, FieldPath, FieldPathByValue, FieldPathValue, FieldPathValues, FieldValues, FormProviderProps, KeepStateOptions, Path, PathValue, RegisterOptions, Resolver, ResolverOptions, ResolverResult, SetFocusOptions, SetValueConfig, SubmitErrorHandler, SubmitHandler, UseControllerProps, UseControllerReturn, UseFieldArrayProps, UseFieldArrayReturn, UseFormProps, UseFormReturn, UseFormStateProps, UseFormStateReturn, UseWatchProps, Validate, ValidationRule, WatchObserver, } from "react-hook-form";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,YAAY,EACR,aAAa,EACb,aAAa,EACb,aAAa,EACb,cAAc,EACd,qBAAqB,EACrB,YAAY,EACZ,cAAc,GACjB,MAAM,YAAY,CAAC;AACpB,OAAO,EACH,UAAU,EACV,YAAY,EACZ,aAAa,EACb,aAAa,EACb,OAAO,EACP,cAAc,EACd,YAAY,EACZ,QAAQ,GACX,MAAM,iBAAiB,CAAC;AACzB,YAAY,EACR,SAAS,EACT,OAAO,EACP,oBAAoB,EACpB,eAAe,EACf,qBAAqB,EACrB,WAAW,EACX,aAAa,EACb,WAAW,EACX,cAAc,EACd,gBAAgB,EAChB,UAAU,EACV,WAAW,EACX,SAAS,EACT,gBAAgB,EAChB,cAAc,EACd,eAAe,EACf,WAAW,EACX,iBAAiB,EACjB,gBAAgB,EAChB,IAAI,EACJ,SAAS,EACT,eAAe,EACf,QAAQ,EACR,eAAe,EACf,cAAc,EACd,eAAe,EACf,cAAc,EACd,kBAAkB,EAClB,aAAa,EACb,kBAAkB,EAClB,mBAAmB,EACnB,kBAAkB,EAClB,mBAAmB,EACnB,YAAY,EACZ,aAAa,EACb,iBAAiB,EACjB,kBAAkB,EAClB,aAAa,EACb,QAAQ,EACR,cAAc,EACd,aAAa,GAChB,MAAM,iBAAiB,CAAC"}

package/dist/index.js

@@ -0,0 +1,7 @@
+export { ComboRow } from "./combo-row.js";
+export { EntryRow } from "./entry-row.js";
+export { PasswordEntryRow } from "./password-entry-row.js";
+export { SpinRow } from "./spin-row.js";
+export { SwitchRow } from "./switch-row.js";
+export { Controller, FormProvider, useController, useFieldArray, useForm, useFormContext, useFormState, useWatch, } from "react-hook-form";
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAU5C,OAAO,EACH,UAAU,EACV,YAAY,EACZ,aAAa,EACb,aAAa,EACb,OAAO,EACP,cAAc,EACd,YAAY,EACZ,QAAQ,GACX,MAAM,iBAAiB,CAAC","sourcesContent":["export { ComboRow } from \"./combo-row.js\";\nexport { EntryRow } from \"./entry-row.js\";\nexport { PasswordEntryRow } from \"./password-entry-row.js\";\nexport { SpinRow } from \"./spin-row.js\";\nexport { SwitchRow } from \"./switch-row.js\";\nexport type {\n    ComboRowProps,\n    EntryRowProps,\n    FormFieldPath,\n    FormFieldProps,\n    PasswordEntryRowProps,\n    SpinRowProps,\n    SwitchRowProps,\n} from \"./types.js\";\nexport {\n    Controller,\n    FormProvider,\n    useController,\n    useFieldArray,\n    useForm,\n    useFormContext,\n    useFormState,\n    useWatch,\n} from \"react-hook-form\";\nexport type {\n    ArrayPath,\n    Control,\n    ControllerFieldState,\n    ControllerProps,\n    ControllerRenderProps,\n    DeepPartial,\n    DefaultValues,\n    ErrorOption,\n    FieldArrayPath,\n    FieldArrayWithId,\n    FieldError,\n    FieldErrors,\n    FieldPath,\n    FieldPathByValue,\n    FieldPathValue,\n    FieldPathValues,\n    FieldValues,\n    FormProviderProps,\n    KeepStateOptions,\n    Path,\n    PathValue,\n    RegisterOptions,\n    Resolver,\n    ResolverOptions,\n    ResolverResult,\n    SetFocusOptions,\n    SetValueConfig,\n    SubmitErrorHandler,\n    SubmitHandler,\n    UseControllerProps,\n    UseControllerReturn,\n    UseFieldArrayProps,\n    UseFieldArrayReturn,\n    UseFormProps,\n    UseFormReturn,\n    UseFormStateProps,\n    UseFormStateReturn,\n    UseWatchProps,\n    Validate,\n    ValidationRule,\n    WatchObserver,\n} from \"react-hook-form\";\n"]}

package/dist/internal/field.d.ts

@@ -0,0 +1,31 @@
+import type { RefCallBack } from "react-hook-form";
+import * as Gtk from "@gtkx/gi/gtk";
+import { type ReactElement, type ReactNode, type Ref, type RefCallback } from "react";
+type FormFieldPropName = "control" | "defaultValue" | "disabled" | "exact" | "name" | "rules" | "shouldUnregister";
+type FieldWidget = Gtk.Widget & {
+    grabFocus: () => boolean;
+};
+type FieldWidgetOptions<Widget extends FieldWidget> = {
+    controllerRef: RefCallBack;
+    forwardedRef: Ref<Widget> | undefined;
+    controllers: ReactNode | null | undefined;
+    cssClasses: string[] | null | undefined;
+    sensitive: boolean | null | undefined;
+    tooltipText: string | null | undefined;
+    disabled: boolean | undefined;
+    isInvalid: boolean;
+    errorMessage: string | undefined;
+    select?: ((widget: Widget) => void) | undefined;
+};
+type FieldWidgetBinding<Widget extends FieldWidget> = {
+    ref: RefCallback<Widget>;
+    controllers: ReactElement;
+    cssClasses: string[] | null | undefined;
+    sensitive: boolean | null | undefined;
+    tooltipText: string | null | undefined;
+    accessibleInvalid: Gtk.AccessibleInvalidState;
+};
+declare const useFieldWidget: <Widget extends FieldWidget>(options: FieldWidgetOptions<Widget>, onBlur: () => void) => FieldWidgetBinding<Widget>;
+declare const widgetProps: <Props extends Partial<Record<FormFieldPropName, unknown>>>(props: Props) => Omit<Props, FormFieldPropName>;
+export { useFieldWidget, widgetProps };
+//# sourceMappingURL=field.d.ts.map

package/dist/internal/field.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"field.d.ts","sourceRoot":"","sources":["../../src/internal/field.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,KAAK,GAAG,MAAM,cAAc,CAAC;AAGpC,OAAO,EAAE,KAAK,YAAY,EAAE,KAAK,SAAS,EAAE,KAAK,GAAG,EAAE,KAAK,WAAW,EAAe,MAAM,OAAO,CAAC;AAEnG,KAAK,iBAAiB,GAChB,SAAS,GACX,cAAc,GACd,UAAU,GACV,OAAO,GACP,MAAM,GACN,OAAO,GACP,kBAAkB,CAAC;AAEvB,KAAK,WAAW,GAAG,GAAG,CAAC,MAAM,GAAG;IAC5B,SAAS,EAAE,MAAM,OAAO,CAAC;CAC5B,CAAC;AAEF,KAAK,kBAAkB,CAAC,MAAM,SAAS,WAAW,IAAI;IAClD,aAAa,EAAE,WAAW,CAAC;IAC3B,YAAY,EAAE,GAAG,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;IACtC,WAAW,EAAE,SAAS,GAAG,IAAI,GAAG,SAAS,CAAC;IAC1C,UAAU,EAAE,MAAM,EAAE,GAAG,IAAI,GAAG,SAAS,CAAC;IACxC,SAAS,EAAE,OAAO,GAAG,IAAI,GAAG,SAAS,CAAC;IACtC,WAAW,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IACvC,QAAQ,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,MAAM,GAAG,SAAS,CAAC;IACjC,MAAM,CAAC,EAAE,CAAC,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;CACnD,CAAC;AAEF,KAAK,kBAAkB,CAAC,MAAM,SAAS,WAAW,IAAI;IAClD,GAAG,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACzB,WAAW,EAAE,YAAY,CAAC;IAC1B,UAAU,EAAE,MAAM,EAAE,GAAG,IAAI,GAAG,SAAS,CAAC;IACxC,SAAS,EAAE,OAAO,GAAG,IAAI,GAAG,SAAS,CAAC;IACtC,WAAW,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IACvC,iBAAiB,EAAE,GAAG,CAAC,sBAAsB,CAAC;CACjD,CAAC;AA4DF,QAAA,MAAM,cAAc,GAAI,MAAM,SAAS,WAAW,EAC9C,SAAS,kBAAkB,CAAC,MAAM,CAAC,EACnC,QAAQ,MAAM,IAAI,KACnB,kBAAkB,CAAC,MAAM,CAY1B,CAAC;AAEH,QAAA,MAAM,WAAW,GAAI,KAAK,SAAS,OAAO,CAAC,MAAM,CAAC,iBAAiB,EAAE,OAAO,CAAC,CAAC,EAC1E,OAAO,KAAK,KACb,IAAI,CAAC,KAAK,EAAE,iBAAiB,CAAuC,CAAC;AAExE,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,CAAC"}

package/dist/internal/field.js

@@ -0,0 +1,56 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import * as Gtk from "@gtkx/gi/gtk";
+import { GtkEventControllerFocus } from "@gtkx/jsx/gtk";
+import { omit } from "@gtkx/utils";
+import { useCallback } from "react";
+const FORM_FIELD_PROP_NAMES = [
+    "control",
+    "defaultValue",
+    "disabled",
+    "exact",
+    "name",
+    "rules",
+    "shouldUnregister",
+];
+const setRef = (ref, widget) => {
+    if (typeof ref === "function") {
+        ref(widget);
+    }
+    else if (ref !== undefined && ref !== null) {
+        ref.current = widget;
+    }
+};
+const withErrorClass = (cssClasses, isInvalid) => {
+    if (!isInvalid || cssClasses?.includes("error") === true) {
+        return cssClasses;
+    }
+    return [...(cssClasses ?? []), "error"];
+};
+const useFieldWidgetRef = ({ controllerRef, forwardedRef, select, }) => useCallback((widget) => {
+    setRef(forwardedRef, widget);
+    if (widget === null) {
+        controllerRef(null);
+        return;
+    }
+    controllerRef({
+        focus: () => {
+            widget.grabFocus();
+        },
+        ...(select !== undefined && {
+            select: () => {
+                select(widget);
+            },
+        }),
+    });
+}, [controllerRef, forwardedRef, select]);
+const useFieldWidget = (options, onBlur) => ({
+    ref: useFieldWidgetRef(options),
+    controllers: (_jsxs(_Fragment, { children: [options.controllers, _jsx(GtkEventControllerFocus, { onLeave: onBlur })] })),
+    cssClasses: withErrorClass(options.cssClasses, options.isInvalid),
+    sensitive: options.disabled === true ? false : options.sensitive,
+    tooltipText: options.isInvalid && options.errorMessage !== undefined ? options.errorMessage : options.tooltipText,
+    accessibleInvalid: options.isInvalid ? Gtk.AccessibleInvalidState.TRUE : Gtk.AccessibleInvalidState.FALSE,
+});
+const widgetProps = (props) => omit(props, FORM_FIELD_PROP_NAMES);
+export { useFieldWidget, widgetProps };
+//# sourceMappingURL=field.js.map

package/dist/internal/field.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"field.js","sourceRoot":"","sources":["../../src/internal/field.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { RefCallBack } from \"react-hook-form\";\nimport * as Gtk from \"@gtkx/gi/gtk\";\nimport { GtkEventControllerFocus } from \"@gtkx/jsx/gtk\";\nimport { omit } from \"@gtkx/utils\";\nimport { type ReactElement, type ReactNode, type Ref, type RefCallback, useCallback } from \"react\";\n\ntype FormFieldPropName =\n    | \"control\" |\n    \"defaultValue\" |\n    \"disabled\" |\n    \"exact\" |\n    \"name\" |\n    \"rules\" |\n    \"shouldUnregister\";\n\ntype FieldWidget = Gtk.Widget & {\n    grabFocus: () => boolean;\n};\n\ntype FieldWidgetOptions<Widget extends FieldWidget> = {\n    controllerRef: RefCallBack;\n    forwardedRef: Ref<Widget> | undefined;\n    controllers: ReactNode | null | undefined;\n    cssClasses: string[] | null | undefined;\n    sensitive: boolean | null | undefined;\n    tooltipText: string | null | undefined;\n    disabled: boolean | undefined;\n    isInvalid: boolean;\n    errorMessage: string | undefined;\n    select?: ((widget: Widget) => void) | undefined;\n};\n\ntype FieldWidgetBinding<Widget extends FieldWidget> = {\n    ref: RefCallback<Widget>;\n    controllers: ReactElement;\n    cssClasses: string[] | null | undefined;\n    sensitive: boolean | null | undefined;\n    tooltipText: string | null | undefined;\n    accessibleInvalid: Gtk.AccessibleInvalidState;\n};\n\nconst FORM_FIELD_PROP_NAMES: FormFieldPropName[] = [\n    \"control\",\n    \"defaultValue\",\n    \"disabled\",\n    \"exact\",\n    \"name\",\n    \"rules\",\n    \"shouldUnregister\",\n];\n\nconst setRef = <Widget,>(ref: Ref<Widget> | undefined, widget: Widget | null): void => {\n    if (typeof ref === \"function\") {\n        ref(widget);\n    } else if (ref !== undefined && ref !== null) {\n        ref.current = widget;\n    }\n};\n\nconst withErrorClass = (\n    cssClasses: string[] | null | undefined,\n    isInvalid: boolean,\n): string[] | null | undefined => {\n    if (!isInvalid || cssClasses?.includes(\"error\") === true) {\n        return cssClasses;\n    }\n\n    return [...(cssClasses ?? []), \"error\"];\n};\n\nconst useFieldWidgetRef = <Widget extends FieldWidget>({\n    controllerRef,\n    forwardedRef,\n    select,\n}: Pick<FieldWidgetOptions<Widget>, \"controllerRef\" | \"forwardedRef\" | \"select\">): RefCallback<Widget> =>\n    useCallback(\n        (widget) => {\n            setRef(forwardedRef, widget);\n\n            if (widget === null) {\n                controllerRef(null);\n\n                return;\n            }\n\n            controllerRef({\n                focus: () => {\n                    widget.grabFocus();\n                },\n                ...(select !== undefined && {\n                    select: () => {\n                        select(widget);\n                    },\n                }),\n            });\n        },\n        [controllerRef, forwardedRef, select],\n    );\n\nconst useFieldWidget = <Widget extends FieldWidget>(\n    options: FieldWidgetOptions<Widget>,\n    onBlur: () => void,\n): FieldWidgetBinding<Widget> => ({\n    ref: useFieldWidgetRef(options),\n    controllers: (\n        <>\n            {options.controllers}\n            <GtkEventControllerFocus onLeave={onBlur} />\n        </>\n    ),\n    cssClasses: withErrorClass(options.cssClasses, options.isInvalid),\n    sensitive: options.disabled === true ? false : options.sensitive,\n    tooltipText: options.isInvalid && options.errorMessage !== undefined ? options.errorMessage : options.tooltipText,\n    accessibleInvalid: options.isInvalid ? Gtk.AccessibleInvalidState.TRUE : Gtk.AccessibleInvalidState.FALSE,\n});\n\nconst widgetProps = <Props extends Partial<Record<FormFieldPropName, unknown>>>(\n    props: Props,\n): Omit<Props, FormFieldPropName> => omit(props, FORM_FIELD_PROP_NAMES);\n\nexport { useFieldWidget, widgetProps };\n"]}

package/dist/password-entry-row.d.ts

@@ -0,0 +1,7 @@
+import type { ReactNode } from "react";
+import { type FieldValues } from "react-hook-form";
+import type { FormFieldPath, PasswordEntryRowProps } from "./types.js";
+/** Renders an `Adw.PasswordEntryRow` controlled by React Hook Form. */
+declare function PasswordEntryRow<TFieldValues extends FieldValues = FieldValues, TName extends FormFieldPath<TFieldValues, string> = FormFieldPath<TFieldValues, string>, TTransformedValues = TFieldValues>(props: PasswordEntryRowProps<TFieldValues, TName, TTransformedValues>): ReactNode;
+export { PasswordEntryRow };
+//# sourceMappingURL=password-entry-row.d.ts.map

package/dist/password-entry-row.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"password-entry-row.d.ts","sourceRoot":"","sources":["../src/password-entry-row.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,KAAK,WAAW,EAAiB,MAAM,iBAAiB,CAAC;AAClE,OAAO,KAAK,EAAE,aAAa,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAOvE,uEAAuE;AACvE,iBAAS,gBAAgB,CACrB,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,aAAa,CAAC,YAAY,EAAE,MAAM,CAAC,GAAG,aAAa,CAAC,YAAY,EAAE,MAAM,CAAC,EACvF,kBAAkB,GAAG,YAAY,EACnC,KAAK,EAAE,qBAAqB,CAAC,YAAY,EAAE,KAAK,EAAE,kBAAkB,CAAC,GAAG,SAAS,CAiClF;AAED,OAAO,EAAE,gBAAgB,EAAE,CAAC"}

package/dist/password-entry-row.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { AdwPasswordEntryRow } from "@gtkx/jsx/adw";
+import { useController } from "react-hook-form";
+import { useFieldWidget, widgetProps } from "./internal/field.js";
+const selectText = (row) => {
+    row.selectRegion(0, -1);
+};
+/** Renders an `Adw.PasswordEntryRow` controlled by React Hook Form. */
+function PasswordEntryRow(props) {
+    const { field, fieldState } = useController(props);
+    const rowProps = widgetProps(props);
+    const binding = useFieldWidget({
+        controllerRef: field.ref,
+        forwardedRef: rowProps.ref,
+        controllers: rowProps.controllers,
+        cssClasses: rowProps.cssClasses,
+        sensitive: rowProps.sensitive,
+        tooltipText: rowProps.tooltipText,
+        disabled: field.disabled,
+        isInvalid: fieldState.invalid,
+        errorMessage: fieldState.error?.message,
+        select: selectText,
+    }, field.onBlur);
+    const value = typeof field.value === "string" ? field.value : "";
+    return (_jsx(AdwPasswordEntryRow, { ...rowProps, ...binding, text: value, onNotifyText: (text, row) => {
+            field.onChange(text ?? "");
+            rowProps.onNotifyText?.(text, row);
+        } }));
+}
+export { PasswordEntryRow };
+//# sourceMappingURL=password-entry-row.js.map

package/dist/password-entry-row.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"password-entry-row.js","sourceRoot":"","sources":["../src/password-entry-row.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAC;AACpD,OAAO,EAAoB,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAElE,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAElE,MAAM,UAAU,GAAG,CAAC,GAAyB,EAAQ,EAAE;IACnD,GAAG,CAAC,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;AAC5B,CAAC,CAAC;AAEF,uEAAuE;AACvE,SAAS,gBAAgB,CAIvB,KAAqE;IACnE,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,GAAG,aAAa,CAA0C,KAAK,CAAC,CAAC;IAC5F,MAAM,QAAQ,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;IAEpC,MAAM,OAAO,GAAG,cAAc,CAC1B;QACI,aAAa,EAAE,KAAK,CAAC,GAAG;QACxB,YAAY,EAAE,QAAQ,CAAC,GAAG;QAC1B,WAAW,EAAE,QAAQ,CAAC,WAAW;QACjC,UAAU,EAAE,QAAQ,CAAC,UAAU;QAC/B,SAAS,EAAE,QAAQ,CAAC,SAAS;QAC7B,WAAW,EAAE,QAAQ,CAAC,WAAW;QACjC,QAAQ,EAAE,KAAK,CAAC,QAAQ;QACxB,SAAS,EAAE,UAAU,CAAC,OAAO;QAC7B,YAAY,EAAE,UAAU,CAAC,KAAK,EAAE,OAAO;QACvC,MAAM,EAAE,UAAU;KACrB,EACD,KAAK,CAAC,MAAM,CACf,CAAC;IAEF,MAAM,KAAK,GAAG,OAAO,KAAK,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC;IAEjE,OAAO,CACH,KAAC,mBAAmB,OACZ,QAAQ,KACR,OAAO,EACX,IAAI,EAAE,KAAK,EACX,YAAY,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,EAAE;YACxB,KAAK,CAAC,QAAQ,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC;YAC3B,QAAQ,CAAC,YAAY,EAAE,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;QACvC,CAAC,GACH,CACL,CAAC;AACN,CAAC;AAED,OAAO,EAAE,gBAAgB,EAAE,CAAC","sourcesContent":["import type * as Adw from \"@gtkx/gi/adw\";\nimport type { ReactNode } from \"react\";\nimport { AdwPasswordEntryRow } from \"@gtkx/jsx/adw\";\nimport { type FieldValues, useController } from \"react-hook-form\";\nimport type { FormFieldPath, PasswordEntryRowProps } from \"./types.js\";\nimport { useFieldWidget, widgetProps } from \"./internal/field.js\";\n\nconst selectText = (row: Adw.PasswordEntryRow): void => {\n    row.selectRegion(0, -1);\n};\n\n/** Renders an `Adw.PasswordEntryRow` controlled by React Hook Form. */\nfunction PasswordEntryRow<\n    TFieldValues extends FieldValues = FieldValues,\n    TName extends FormFieldPath<TFieldValues, string> = FormFieldPath<TFieldValues, string>,\n    TTransformedValues = TFieldValues,\n>(props: PasswordEntryRowProps<TFieldValues, TName, TTransformedValues>): ReactNode {\n    const { field, fieldState } = useController<TFieldValues, TName, TTransformedValues>(props);\n    const rowProps = widgetProps(props);\n\n    const binding = useFieldWidget<Adw.PasswordEntryRow>(\n        {\n            controllerRef: field.ref,\n            forwardedRef: rowProps.ref,\n            controllers: rowProps.controllers,\n            cssClasses: rowProps.cssClasses,\n            sensitive: rowProps.sensitive,\n            tooltipText: rowProps.tooltipText,\n            disabled: field.disabled,\n            isInvalid: fieldState.invalid,\n            errorMessage: fieldState.error?.message,\n            select: selectText,\n        },\n        field.onBlur,\n    );\n\n    const value = typeof field.value === \"string\" ? field.value : \"\";\n\n    return (\n        <AdwPasswordEntryRow\n            {...rowProps}\n            {...binding}\n            text={value}\n            onNotifyText={(text, row) => {\n                field.onChange(text ?? \"\");\n                rowProps.onNotifyText?.(text, row);\n            }}\n        />\n    );\n}\n\nexport { PasswordEntryRow };\n"]}

package/dist/spin-row.d.ts

@@ -0,0 +1,7 @@
+import type { ReactNode } from "react";
+import { type FieldValues } from "react-hook-form";
+import type { FormFieldPath, SpinRowProps } from "./types.js";
+/** Renders an `Adw.SpinRow` controlled by React Hook Form. */
+declare function SpinRow<TFieldValues extends FieldValues = FieldValues, TName extends FormFieldPath<TFieldValues, number> = FormFieldPath<TFieldValues, number>, TTransformedValues = TFieldValues>(props: SpinRowProps<TFieldValues, TName, TTransformedValues>): ReactNode;
+export { SpinRow };
+//# sourceMappingURL=spin-row.d.ts.map

package/dist/spin-row.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"spin-row.d.ts","sourceRoot":"","sources":["../src/spin-row.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,KAAK,WAAW,EAAiB,MAAM,iBAAiB,CAAC;AAClE,OAAO,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAO9D,8DAA8D;AAC9D,iBAAS,OAAO,CACZ,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,aAAa,CAAC,YAAY,EAAE,MAAM,CAAC,GAAG,aAAa,CAAC,YAAY,EAAE,MAAM,CAAC,EACvF,kBAAkB,GAAG,YAAY,EACnC,KAAK,EAAE,YAAY,CAAC,YAAY,EAAE,KAAK,EAAE,kBAAkB,CAAC,GAAG,SAAS,CAiCzE;AAED,OAAO,EAAE,OAAO,EAAE,CAAC"}

package/dist/spin-row.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { AdwSpinRow } from "@gtkx/jsx/adw";
+import { useController } from "react-hook-form";
+import { useFieldWidget, widgetProps } from "./internal/field.js";
+const selectText = (row) => {
+    row.selectRegion(0, -1);
+};
+/** Renders an `Adw.SpinRow` controlled by React Hook Form. */
+function SpinRow(props) {
+    const { field, fieldState } = useController(props);
+    const rowProps = widgetProps(props);
+    const binding = useFieldWidget({
+        controllerRef: field.ref,
+        forwardedRef: rowProps.ref,
+        controllers: rowProps.controllers,
+        cssClasses: rowProps.cssClasses,
+        sensitive: rowProps.sensitive,
+        tooltipText: rowProps.tooltipText,
+        disabled: field.disabled,
+        isInvalid: fieldState.invalid,
+        errorMessage: fieldState.error?.message,
+        select: selectText,
+    }, field.onBlur);
+    const value = typeof field.value === "number" ? field.value : 0;
+    return (_jsx(AdwSpinRow, { ...rowProps, ...binding, value: value, onNotifyValue: (nextValue, row) => {
+            field.onChange(nextValue ?? 0);
+            rowProps.onNotifyValue?.(nextValue, row);
+        } }));
+}
+export { SpinRow };
+//# sourceMappingURL=spin-row.js.map

package/dist/spin-row.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"spin-row.js","sourceRoot":"","sources":["../src/spin-row.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAoB,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAElE,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAElE,MAAM,UAAU,GAAG,CAAC,GAAgB,EAAQ,EAAE;IAC1C,GAAG,CAAC,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;AAC5B,CAAC,CAAC;AAEF,8DAA8D;AAC9D,SAAS,OAAO,CAId,KAA4D;IAC1D,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,GAAG,aAAa,CAA0C,KAAK,CAAC,CAAC;IAC5F,MAAM,QAAQ,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;IAEpC,MAAM,OAAO,GAAG,cAAc,CAC1B;QACI,aAAa,EAAE,KAAK,CAAC,GAAG;QACxB,YAAY,EAAE,QAAQ,CAAC,GAAG;QAC1B,WAAW,EAAE,QAAQ,CAAC,WAAW;QACjC,UAAU,EAAE,QAAQ,CAAC,UAAU;QAC/B,SAAS,EAAE,QAAQ,CAAC,SAAS;QAC7B,WAAW,EAAE,QAAQ,CAAC,WAAW;QACjC,QAAQ,EAAE,KAAK,CAAC,QAAQ;QACxB,SAAS,EAAE,UAAU,CAAC,OAAO;QAC7B,YAAY,EAAE,UAAU,CAAC,KAAK,EAAE,OAAO;QACvC,MAAM,EAAE,UAAU;KACrB,EACD,KAAK,CAAC,MAAM,CACf,CAAC;IAEF,MAAM,KAAK,GAAG,OAAO,KAAK,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;IAEhE,OAAO,CACH,KAAC,UAAU,OACH,QAAQ,KACR,OAAO,EACX,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,CAAC,SAAS,EAAE,GAAG,EAAE,EAAE;YAC9B,KAAK,CAAC,QAAQ,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC;YAC/B,QAAQ,CAAC,aAAa,EAAE,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC;QAC7C,CAAC,GACH,CACL,CAAC;AACN,CAAC;AAED,OAAO,EAAE,OAAO,EAAE,CAAC","sourcesContent":["import type * as Adw from \"@gtkx/gi/adw\";\nimport type { ReactNode } from \"react\";\nimport { AdwSpinRow } from \"@gtkx/jsx/adw\";\nimport { type FieldValues, useController } from \"react-hook-form\";\nimport type { FormFieldPath, SpinRowProps } from \"./types.js\";\nimport { useFieldWidget, widgetProps } from \"./internal/field.js\";\n\nconst selectText = (row: Adw.SpinRow): void => {\n    row.selectRegion(0, -1);\n};\n\n/** Renders an `Adw.SpinRow` controlled by React Hook Form. */\nfunction SpinRow<\n    TFieldValues extends FieldValues = FieldValues,\n    TName extends FormFieldPath<TFieldValues, number> = FormFieldPath<TFieldValues, number>,\n    TTransformedValues = TFieldValues,\n>(props: SpinRowProps<TFieldValues, TName, TTransformedValues>): ReactNode {\n    const { field, fieldState } = useController<TFieldValues, TName, TTransformedValues>(props);\n    const rowProps = widgetProps(props);\n\n    const binding = useFieldWidget<Adw.SpinRow>(\n        {\n            controllerRef: field.ref,\n            forwardedRef: rowProps.ref,\n            controllers: rowProps.controllers,\n            cssClasses: rowProps.cssClasses,\n            sensitive: rowProps.sensitive,\n            tooltipText: rowProps.tooltipText,\n            disabled: field.disabled,\n            isInvalid: fieldState.invalid,\n            errorMessage: fieldState.error?.message,\n            select: selectText,\n        },\n        field.onBlur,\n    );\n\n    const value = typeof field.value === \"number\" ? field.value : 0;\n\n    return (\n        <AdwSpinRow\n            {...rowProps}\n            {...binding}\n            value={value}\n            onNotifyValue={(nextValue, row) => {\n                field.onChange(nextValue ?? 0);\n                rowProps.onNotifyValue?.(nextValue, row);\n            }}\n        />\n    );\n}\n\nexport { SpinRow };\n"]}

package/dist/switch-row.d.ts

@@ -0,0 +1,7 @@
+import type { ReactNode } from "react";
+import { type FieldValues } from "react-hook-form";
+import type { FormFieldPath, SwitchRowProps } from "./types.js";
+/** Renders an `Adw.SwitchRow` controlled by React Hook Form. */
+declare function SwitchRow<TFieldValues extends FieldValues = FieldValues, TName extends FormFieldPath<TFieldValues, boolean> = FormFieldPath<TFieldValues, boolean>, TTransformedValues = TFieldValues>(props: SwitchRowProps<TFieldValues, TName, TTransformedValues>): ReactNode;
+export { SwitchRow };
+//# sourceMappingURL=switch-row.d.ts.map

package/dist/switch-row.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch-row.d.ts","sourceRoot":"","sources":["../src/switch-row.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,KAAK,WAAW,EAAiB,MAAM,iBAAiB,CAAC;AAClE,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAGhE,gEAAgE;AAChE,iBAAS,SAAS,CACd,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,aAAa,CAAC,YAAY,EAAE,OAAO,CAAC,GAAG,aAAa,CAAC,YAAY,EAAE,OAAO,CAAC,EACzF,kBAAkB,GAAG,YAAY,EACnC,KAAK,EAAE,cAAc,CAAC,YAAY,EAAE,KAAK,EAAE,kBAAkB,CAAC,GAAG,SAAS,CA8B3E;AAED,OAAO,EAAE,SAAS,EAAE,CAAC"}

package/dist/switch-row.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { AdwSwitchRow } from "@gtkx/jsx/adw";
+import { useController } from "react-hook-form";
+import { useFieldWidget, widgetProps } from "./internal/field.js";
+/** Renders an `Adw.SwitchRow` controlled by React Hook Form. */
+function SwitchRow(props) {
+    const { field, fieldState } = useController(props);
+    const rowProps = widgetProps(props);
+    const binding = useFieldWidget({
+        controllerRef: field.ref,
+        forwardedRef: rowProps.ref,
+        controllers: rowProps.controllers,
+        cssClasses: rowProps.cssClasses,
+        sensitive: rowProps.sensitive,
+        tooltipText: rowProps.tooltipText,
+        disabled: field.disabled,
+        isInvalid: fieldState.invalid,
+        errorMessage: fieldState.error?.message,
+    }, field.onBlur);
+    return (_jsx(AdwSwitchRow, { ...rowProps, ...binding, active: field.value === true, onNotifyActive: (active, row) => {
+            field.onChange(active === true);
+            rowProps.onNotifyActive?.(active, row);
+        } }));
+}
+export { SwitchRow };
+//# sourceMappingURL=switch-row.js.map

package/dist/switch-row.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch-row.js","sourceRoot":"","sources":["../src/switch-row.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAC7C,OAAO,EAAoB,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAElE,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAElE,gEAAgE;AAChE,SAAS,SAAS,CAIhB,KAA8D;IAC5D,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,GAAG,aAAa,CAA0C,KAAK,CAAC,CAAC;IAC5F,MAAM,QAAQ,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;IAEpC,MAAM,OAAO,GAAG,cAAc,CAC1B;QACI,aAAa,EAAE,KAAK,CAAC,GAAG;QACxB,YAAY,EAAE,QAAQ,CAAC,GAAG;QAC1B,WAAW,EAAE,QAAQ,CAAC,WAAW;QACjC,UAAU,EAAE,QAAQ,CAAC,UAAU;QAC/B,SAAS,EAAE,QAAQ,CAAC,SAAS;QAC7B,WAAW,EAAE,QAAQ,CAAC,WAAW;QACjC,QAAQ,EAAE,KAAK,CAAC,QAAQ;QACxB,SAAS,EAAE,UAAU,CAAC,OAAO;QAC7B,YAAY,EAAE,UAAU,CAAC,KAAK,EAAE,OAAO;KAC1C,EACD,KAAK,CAAC,MAAM,CACf,CAAC;IAEF,OAAO,CACH,KAAC,YAAY,OACL,QAAQ,KACR,OAAO,EACX,MAAM,EAAE,KAAK,CAAC,KAAK,KAAK,IAAI,EAC5B,cAAc,EAAE,CAAC,MAAM,EAAE,GAAG,EAAE,EAAE;YAC5B,KAAK,CAAC,QAAQ,CAAC,MAAM,KAAK,IAAI,CAAC,CAAC;YAChC,QAAQ,CAAC,cAAc,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;QAC3C,CAAC,GACH,CACL,CAAC;AACN,CAAC;AAED,OAAO,EAAE,SAAS,EAAE,CAAC","sourcesContent":["import type * as Adw from \"@gtkx/gi/adw\";\nimport type { ReactNode } from \"react\";\nimport { AdwSwitchRow } from \"@gtkx/jsx/adw\";\nimport { type FieldValues, useController } from \"react-hook-form\";\nimport type { FormFieldPath, SwitchRowProps } from \"./types.js\";\nimport { useFieldWidget, widgetProps } from \"./internal/field.js\";\n\n/** Renders an `Adw.SwitchRow` controlled by React Hook Form. */\nfunction SwitchRow<\n    TFieldValues extends FieldValues = FieldValues,\n    TName extends FormFieldPath<TFieldValues, boolean> = FormFieldPath<TFieldValues, boolean>,\n    TTransformedValues = TFieldValues,\n>(props: SwitchRowProps<TFieldValues, TName, TTransformedValues>): ReactNode {\n    const { field, fieldState } = useController<TFieldValues, TName, TTransformedValues>(props);\n    const rowProps = widgetProps(props);\n\n    const binding = useFieldWidget<Adw.SwitchRow>(\n        {\n            controllerRef: field.ref,\n            forwardedRef: rowProps.ref,\n            controllers: rowProps.controllers,\n            cssClasses: rowProps.cssClasses,\n            sensitive: rowProps.sensitive,\n            tooltipText: rowProps.tooltipText,\n            disabled: field.disabled,\n            isInvalid: fieldState.invalid,\n            errorMessage: fieldState.error?.message,\n        },\n        field.onBlur,\n    );\n\n    return (\n        <AdwSwitchRow\n            {...rowProps}\n            {...binding}\n            active={field.value === true}\n            onNotifyActive={(active, row) => {\n                field.onChange(active === true);\n                rowProps.onNotifyActive?.(active, row);\n            }}\n        />\n    );\n}\n\nexport { SwitchRow };\n"]}

package/dist/types.d.ts

@@ -0,0 +1,19 @@
+import type { ComboRowProps as BaseComboRowProps } from "@gtkx/components/adw";
+import type { AdwEntryRowProps, AdwPasswordEntryRowProps, AdwSpinRowProps, AdwSwitchRowProps } from "@gtkx/jsx/adw";
+import type { FieldPath, FieldPathByValue, FieldValues, UseControllerProps } from "react-hook-form";
+/** A form field path whose value can be represented by a GTKX control. */
+type FormFieldPath<TFieldValues extends FieldValues, TValue> = FieldPathByValue<TFieldValues, TValue | null | undefined>;
+/** React Hook Form controller options shared by every GTKX form field. */
+type FormFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>, TTransformedValues = TFieldValues> = UseControllerProps<TFieldValues, TName, TTransformedValues>;
+/** Props for an Adwaita entry row controlled by React Hook Form. */
+type EntryRowProps<TFieldValues extends FieldValues = FieldValues, TName extends FormFieldPath<TFieldValues, string> = FormFieldPath<TFieldValues, string>, TTransformedValues = TFieldValues> = Omit<AdwEntryRowProps, "accessibleInvalid" | "text"> & FormFieldProps<TFieldValues, TName, TTransformedValues>;
+/** Props for an Adwaita password entry row controlled by React Hook Form. */
+type PasswordEntryRowProps<TFieldValues extends FieldValues = FieldValues, TName extends FormFieldPath<TFieldValues, string> = FormFieldPath<TFieldValues, string>, TTransformedValues = TFieldValues> = Omit<AdwPasswordEntryRowProps, "accessibleInvalid" | "text"> & FormFieldProps<TFieldValues, TName, TTransformedValues>;
+/** Props for an Adwaita switch row controlled by React Hook Form. */
+type SwitchRowProps<TFieldValues extends FieldValues = FieldValues, TName extends FormFieldPath<TFieldValues, boolean> = FormFieldPath<TFieldValues, boolean>, TTransformedValues = TFieldValues> = Omit<AdwSwitchRowProps, "accessibleInvalid" | "active"> & FormFieldProps<TFieldValues, TName, TTransformedValues>;
+/** Props for an Adwaita spin row controlled by React Hook Form. */
+type SpinRowProps<TFieldValues extends FieldValues = FieldValues, TName extends FormFieldPath<TFieldValues, number> = FormFieldPath<TFieldValues, number>, TTransformedValues = TFieldValues> = Omit<AdwSpinRowProps, "accessibleInvalid" | "text" | "value"> & FormFieldProps<TFieldValues, TName, TTransformedValues>;
+/** Props for an ID-based Adwaita combo row controlled by React Hook Form. */
+type ComboRowProps<TFieldValues extends FieldValues = FieldValues, TName extends FormFieldPath<TFieldValues, string> = FormFieldPath<TFieldValues, string>, TTransformedValues = TFieldValues, TItem = unknown, TSection = unknown> = Omit<BaseComboRowProps<TItem, TSection>, "accessibleInvalid" | "selectedId"> & FormFieldProps<TFieldValues, TName, TTransformedValues>;
+export { type ComboRowProps, type EntryRowProps, type FormFieldPath, type FormFieldProps, type PasswordEntryRowProps, type SpinRowProps, type SwitchRowProps, };
+//# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

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

package/dist/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAgEA,OAAO,EAQN,CAAC","sourcesContent":["import type { ComboRowProps as BaseComboRowProps } from \"@gtkx/components/adw\";\nimport type {\n    AdwEntryRowProps,\n    AdwPasswordEntryRowProps,\n    AdwSpinRowProps,\n    AdwSwitchRowProps,\n} from \"@gtkx/jsx/adw\";\nimport type { FieldPath, FieldPathByValue, FieldValues, UseControllerProps } from \"react-hook-form\";\n\n/** A form field path whose value can be represented by a GTKX control. */\ntype FormFieldPath<TFieldValues extends FieldValues, TValue> = FieldPathByValue<\n    TFieldValues,\n    TValue | null | undefined\n>;\n\n/** React Hook Form controller options shared by every GTKX form field. */\ntype FormFieldProps<\n    TFieldValues extends FieldValues = FieldValues,\n    TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n    TTransformedValues = TFieldValues,\n> = UseControllerProps<TFieldValues, TName, TTransformedValues>;\n\n/** Props for an Adwaita entry row controlled by React Hook Form. */\ntype EntryRowProps<\n    TFieldValues extends FieldValues = FieldValues,\n    TName extends FormFieldPath<TFieldValues, string> = FormFieldPath<TFieldValues, string>,\n    TTransformedValues = TFieldValues,\n> = Omit<AdwEntryRowProps, \"accessibleInvalid\" | \"text\"> &\n    FormFieldProps<TFieldValues, TName, TTransformedValues>;\n\n/** Props for an Adwaita password entry row controlled by React Hook Form. */\ntype PasswordEntryRowProps<\n    TFieldValues extends FieldValues = FieldValues,\n    TName extends FormFieldPath<TFieldValues, string> = FormFieldPath<TFieldValues, string>,\n    TTransformedValues = TFieldValues,\n> = Omit<AdwPasswordEntryRowProps, \"accessibleInvalid\" | \"text\"> &\n    FormFieldProps<TFieldValues, TName, TTransformedValues>;\n\n/** Props for an Adwaita switch row controlled by React Hook Form. */\ntype SwitchRowProps<\n    TFieldValues extends FieldValues = FieldValues,\n    TName extends FormFieldPath<TFieldValues, boolean> = FormFieldPath<TFieldValues, boolean>,\n    TTransformedValues = TFieldValues,\n> = Omit<AdwSwitchRowProps, \"accessibleInvalid\" | \"active\"> &\n    FormFieldProps<TFieldValues, TName, TTransformedValues>;\n\n/** Props for an Adwaita spin row controlled by React Hook Form. */\ntype SpinRowProps<\n    TFieldValues extends FieldValues = FieldValues,\n    TName extends FormFieldPath<TFieldValues, number> = FormFieldPath<TFieldValues, number>,\n    TTransformedValues = TFieldValues,\n> = Omit<AdwSpinRowProps, \"accessibleInvalid\" | \"text\" | \"value\"> &\n    FormFieldProps<TFieldValues, TName, TTransformedValues>;\n\n/** Props for an ID-based Adwaita combo row controlled by React Hook Form. */\ntype ComboRowProps<\n    TFieldValues extends FieldValues = FieldValues,\n    TName extends FormFieldPath<TFieldValues, string> = FormFieldPath<TFieldValues, string>,\n    TTransformedValues = TFieldValues,\n    TItem = unknown,\n    TSection = unknown,\n> = Omit<BaseComboRowProps<TItem, TSection>, \"accessibleInvalid\" | \"selectedId\"> &\n    FormFieldProps<TFieldValues, TName, TTransformedValues>;\n\nexport {\n    type ComboRowProps,\n    type EntryRowProps,\n    type FormFieldPath,\n    type FormFieldProps,\n    type PasswordEntryRowProps,\n    type SpinRowProps,\n    type SwitchRowProps,\n};\n"]}

package/package.json

@@ -0,0 +1,71 @@
+{
+    "name": "@gtkx/forms",
+    "version": "0.0.1",
+    "description": "React Hook Form controls for building Adwaita forms.",
+    "keywords": [
+        "gtkx",
+        "gtk",
+        "gtk4",
+        "adwaita",
+        "react",
+        "react-hook-form",
+        "forms",
+        "linux",
+        "desktop"
+    ],
+    "homepage": "https://gtkx.dev",
+    "bugs": {
+        "url": "https://github.com/gtkx-org/gtkx/issues"
+    },
+    "repository": {
+        "type": "git",
+        "url": "git+https://github.com/gtkx-org/gtkx.git",
+        "directory": "packages/forms"
+    },
+    "license": "MPL-2.0",
+    "author": "Eugenio Depalo <eugeniodepalo@gmail.com>",
+    "type": "module",
+    "exports": {
+        "./package.json": "./package.json",
+        ".": {
+            "source": "./src/index.ts",
+            "types": "./dist/index.d.ts",
+            "default": "./dist/index.js"
+        }
+    },
+    "sideEffects": false,
+    "files": [
+        "dist",
+        "src"
+    ],
+    "scripts": {
+        "release": "tsx ../../scripts/release-package.ts"
+    },
+    "nx": {
+        "targets": {
+            "lint": {
+                "options": {
+                    "cwd": ".",
+                    "command": "eslint {projectRoot}"
+                }
+            }
+        }
+    },
+    "engines": {
+        "node": ">=24"
+    },
+    "dependencies": {
+        "@gtkx/components": "workspace:*",
+        "@gtkx/utils": "workspace:*",
+        "react-hook-form": "^7.86.0"
+    },
+    "peerDependencies": {
+        "react": "^19.2"
+    },
+    "devDependencies": {
+        "@gtkx/config": "workspace:*",
+        "@gtkx/testing": "workspace:*",
+        "@gtkx/vitest": "workspace:*",
+        "vitest": "catalog:"
+    }
+}

package/src/combo-row.tsx

@@ -0,0 +1,49 @@
+import type * as Adw from "@gtkx/gi/adw";
+import type { ReactNode } from "react";
+import { ComboRow as BaseComboRow } from "@gtkx/components/adw";
+import { type FieldValues, useController } from "react-hook-form";
+import type { ComboRowProps, FormFieldPath } from "./types.js";
+import { useFieldWidget, widgetProps } from "./internal/field.js";
+
+/** Renders an ID-based Adwaita combo row controlled by React Hook Form. */
+function ComboRow<
+    TFieldValues extends FieldValues = FieldValues,
+    TName extends FormFieldPath<TFieldValues, string> = FormFieldPath<TFieldValues, string>,
+    TTransformedValues = TFieldValues,
+    TItem = unknown,
+    TSection = unknown,
+>(props: ComboRowProps<TFieldValues, TName, TTransformedValues, TItem, TSection>): ReactNode {
+    const { field, fieldState } = useController<TFieldValues, TName, TTransformedValues>(props);
+    const rowProps = widgetProps(props);
+
+    const binding = useFieldWidget<Adw.ComboRow>(
+        {
+            controllerRef: field.ref,
+            forwardedRef: rowProps.ref,
+            controllers: rowProps.controllers,
+            cssClasses: rowProps.cssClasses,
+            sensitive: rowProps.sensitive,
+            tooltipText: rowProps.tooltipText,
+            disabled: field.disabled,
+            isInvalid: fieldState.invalid,
+            errorMessage: fieldState.error?.message,
+        },
+        field.onBlur,
+    );
+
+    const selectedId = typeof field.value === "string" ? field.value : null;
+
+    return (
+        <BaseComboRow
+            {...rowProps}
+            {...binding}
+            selectedId={selectedId}
+            onSelectionChanged={(id) => {
+                field.onChange(id);
+                rowProps.onSelectionChanged?.(id);
+            }}
+        />
+    );
+}
+
+export { ComboRow };

package/src/entry-row.tsx

@@ -0,0 +1,52 @@
+import type * as Adw from "@gtkx/gi/adw";
+import type { ReactNode } from "react";
+import { AdwEntryRow } from "@gtkx/jsx/adw";
+import { type FieldValues, useController } from "react-hook-form";
+import type { EntryRowProps, FormFieldPath } from "./types.js";
+import { useFieldWidget, widgetProps } from "./internal/field.js";
+
+const selectText = (row: Adw.EntryRow): void => {
+    row.selectRegion(0, -1);
+};
+
+/** Renders an `Adw.EntryRow` controlled by React Hook Form. */
+function EntryRow<
+    TFieldValues extends FieldValues = FieldValues,
+    TName extends FormFieldPath<TFieldValues, string> = FormFieldPath<TFieldValues, string>,
+    TTransformedValues = TFieldValues,
+>(props: EntryRowProps<TFieldValues, TName, TTransformedValues>): ReactNode {
+    const { field, fieldState } = useController<TFieldValues, TName, TTransformedValues>(props);
+    const rowProps = widgetProps(props);
+
+    const binding = useFieldWidget<Adw.EntryRow>(
+        {
+            controllerRef: field.ref,
+            forwardedRef: rowProps.ref,
+            controllers: rowProps.controllers,
+            cssClasses: rowProps.cssClasses,
+            sensitive: rowProps.sensitive,
+            tooltipText: rowProps.tooltipText,
+            disabled: field.disabled,
+            isInvalid: fieldState.invalid,
+            errorMessage: fieldState.error?.message,
+            select: selectText,
+        },
+        field.onBlur,
+    );
+
+    const value = typeof field.value === "string" ? field.value : "";
+
+    return (
+        <AdwEntryRow
+            {...rowProps}
+            {...binding}
+            text={value}
+            onNotifyText={(text, row) => {
+                field.onChange(text ?? "");
+                rowProps.onNotifyText?.(text, row);
+            }}
+        />
+    );
+}
+
+export { EntryRow };

package/src/index.ts

@@ -0,0 +1,67 @@
+export { ComboRow } from "./combo-row.js";
+export { EntryRow } from "./entry-row.js";
+export { PasswordEntryRow } from "./password-entry-row.js";
+export { SpinRow } from "./spin-row.js";
+export { SwitchRow } from "./switch-row.js";
+export type {
+    ComboRowProps,
+    EntryRowProps,
+    FormFieldPath,
+    FormFieldProps,
+    PasswordEntryRowProps,
+    SpinRowProps,
+    SwitchRowProps,
+} from "./types.js";
+export {
+    Controller,
+    FormProvider,
+    useController,
+    useFieldArray,
+    useForm,
+    useFormContext,
+    useFormState,
+    useWatch,
+} from "react-hook-form";
+export type {
+    ArrayPath,
+    Control,
+    ControllerFieldState,
+    ControllerProps,
+    ControllerRenderProps,
+    DeepPartial,
+    DefaultValues,
+    ErrorOption,
+    FieldArrayPath,
+    FieldArrayWithId,
+    FieldError,
+    FieldErrors,
+    FieldPath,
+    FieldPathByValue,
+    FieldPathValue,
+    FieldPathValues,
+    FieldValues,
+    FormProviderProps,
+    KeepStateOptions,
+    Path,
+    PathValue,
+    RegisterOptions,
+    Resolver,
+    ResolverOptions,
+    ResolverResult,
+    SetFocusOptions,
+    SetValueConfig,
+    SubmitErrorHandler,
+    SubmitHandler,
+    UseControllerProps,
+    UseControllerReturn,
+    UseFieldArrayProps,
+    UseFieldArrayReturn,
+    UseFormProps,
+    UseFormReturn,
+    UseFormStateProps,
+    UseFormStateReturn,
+    UseWatchProps,
+    Validate,
+    ValidationRule,
+    WatchObserver,
+} from "react-hook-form";

package/src/internal/field.tsx

@@ -0,0 +1,121 @@
+import type { RefCallBack } from "react-hook-form";
+import * as Gtk from "@gtkx/gi/gtk";
+import { GtkEventControllerFocus } from "@gtkx/jsx/gtk";
+import { omit } from "@gtkx/utils";
+import { type ReactElement, type ReactNode, type Ref, type RefCallback, useCallback } from "react";
+
+type FormFieldPropName =
+    | "control" |
+    "defaultValue" |
+    "disabled" |
+    "exact" |
+    "name" |
+    "rules" |
+    "shouldUnregister";
+
+type FieldWidget = Gtk.Widget & {
+    grabFocus: () => boolean;
+};
+
+type FieldWidgetOptions<Widget extends FieldWidget> = {
+    controllerRef: RefCallBack;
+    forwardedRef: Ref<Widget> | undefined;
+    controllers: ReactNode | null | undefined;
+    cssClasses: string[] | null | undefined;
+    sensitive: boolean | null | undefined;
+    tooltipText: string | null | undefined;
+    disabled: boolean | undefined;
+    isInvalid: boolean;
+    errorMessage: string | undefined;
+    select?: ((widget: Widget) => void) | undefined;
+};
+
+type FieldWidgetBinding<Widget extends FieldWidget> = {
+    ref: RefCallback<Widget>;
+    controllers: ReactElement;
+    cssClasses: string[] | null | undefined;
+    sensitive: boolean | null | undefined;
+    tooltipText: string | null | undefined;
+    accessibleInvalid: Gtk.AccessibleInvalidState;
+};
+
+const FORM_FIELD_PROP_NAMES: FormFieldPropName[] = [
+    "control",
+    "defaultValue",
+    "disabled",
+    "exact",
+    "name",
+    "rules",
+    "shouldUnregister",
+];
+
+const setRef = <Widget,>(ref: Ref<Widget> | undefined, widget: Widget | null): void => {
+    if (typeof ref === "function") {
+        ref(widget);
+    } else if (ref !== undefined && ref !== null) {
+        ref.current = widget;
+    }
+};
+
+const withErrorClass = (
+    cssClasses: string[] | null | undefined,
+    isInvalid: boolean,
+): string[] | null | undefined => {
+    if (!isInvalid || cssClasses?.includes("error") === true) {
+        return cssClasses;
+    }
+
+    return [...(cssClasses ?? []), "error"];
+};
+
+const useFieldWidgetRef = <Widget extends FieldWidget>({
+    controllerRef,
+    forwardedRef,
+    select,
+}: Pick<FieldWidgetOptions<Widget>, "controllerRef" | "forwardedRef" | "select">): RefCallback<Widget> =>
+    useCallback(
+        (widget) => {
+            setRef(forwardedRef, widget);
+
+            if (widget === null) {
+                controllerRef(null);
+
+                return;
+            }
+
+            controllerRef({
+                focus: () => {
+                    widget.grabFocus();
+                },
+                ...(select !== undefined && {
+                    select: () => {
+                        select(widget);
+                    },
+                }),
+            });
+        },
+        [controllerRef, forwardedRef, select],
+    );
+
+const useFieldWidget = <Widget extends FieldWidget>(
+    options: FieldWidgetOptions<Widget>,
+    onBlur: () => void,
+): FieldWidgetBinding<Widget> => ({
+    ref: useFieldWidgetRef(options),
+    controllers: (
+        <>
+            {options.controllers}
+            <GtkEventControllerFocus onLeave={onBlur} />
+        </>
+    ),
+    cssClasses: withErrorClass(options.cssClasses, options.isInvalid),
+    sensitive: options.disabled === true ? false : options.sensitive,
+    tooltipText: options.isInvalid && options.errorMessage !== undefined ? options.errorMessage : options.tooltipText,
+    accessibleInvalid: options.isInvalid ? Gtk.AccessibleInvalidState.TRUE : Gtk.AccessibleInvalidState.FALSE,
+});
+
+const widgetProps = <Props extends Partial<Record<FormFieldPropName, unknown>>>(
+    props: Props,
+): Omit<Props, FormFieldPropName> => omit(props, FORM_FIELD_PROP_NAMES);
+
+export { useFieldWidget, widgetProps };

package/src/password-entry-row.tsx

@@ -0,0 +1,52 @@
+import type * as Adw from "@gtkx/gi/adw";
+import type { ReactNode } from "react";
+import { AdwPasswordEntryRow } from "@gtkx/jsx/adw";
+import { type FieldValues, useController } from "react-hook-form";
+import type { FormFieldPath, PasswordEntryRowProps } from "./types.js";
+import { useFieldWidget, widgetProps } from "./internal/field.js";
+
+const selectText = (row: Adw.PasswordEntryRow): void => {
+    row.selectRegion(0, -1);
+};
+
+/** Renders an `Adw.PasswordEntryRow` controlled by React Hook Form. */
+function PasswordEntryRow<
+    TFieldValues extends FieldValues = FieldValues,
+    TName extends FormFieldPath<TFieldValues, string> = FormFieldPath<TFieldValues, string>,
+    TTransformedValues = TFieldValues,
+>(props: PasswordEntryRowProps<TFieldValues, TName, TTransformedValues>): ReactNode {
+    const { field, fieldState } = useController<TFieldValues, TName, TTransformedValues>(props);
+    const rowProps = widgetProps(props);
+
+    const binding = useFieldWidget<Adw.PasswordEntryRow>(
+        {
+            controllerRef: field.ref,
+            forwardedRef: rowProps.ref,
+            controllers: rowProps.controllers,
+            cssClasses: rowProps.cssClasses,
+            sensitive: rowProps.sensitive,
+            tooltipText: rowProps.tooltipText,
+            disabled: field.disabled,
+            isInvalid: fieldState.invalid,
+            errorMessage: fieldState.error?.message,
+            select: selectText,
+        },
+        field.onBlur,
+    );
+
+    const value = typeof field.value === "string" ? field.value : "";
+
+    return (
+        <AdwPasswordEntryRow
+            {...rowProps}
+            {...binding}
+            text={value}
+            onNotifyText={(text, row) => {
+                field.onChange(text ?? "");
+                rowProps.onNotifyText?.(text, row);
+            }}
+        />
+    );
+}
+
+export { PasswordEntryRow };

package/src/spin-row.tsx

@@ -0,0 +1,52 @@
+import type * as Adw from "@gtkx/gi/adw";
+import type { ReactNode } from "react";
+import { AdwSpinRow } from "@gtkx/jsx/adw";
+import { type FieldValues, useController } from "react-hook-form";
+import type { FormFieldPath, SpinRowProps } from "./types.js";
+import { useFieldWidget, widgetProps } from "./internal/field.js";
+
+const selectText = (row: Adw.SpinRow): void => {
+    row.selectRegion(0, -1);
+};
+
+/** Renders an `Adw.SpinRow` controlled by React Hook Form. */
+function SpinRow<
+    TFieldValues extends FieldValues = FieldValues,
+    TName extends FormFieldPath<TFieldValues, number> = FormFieldPath<TFieldValues, number>,
+    TTransformedValues = TFieldValues,
+>(props: SpinRowProps<TFieldValues, TName, TTransformedValues>): ReactNode {
+    const { field, fieldState } = useController<TFieldValues, TName, TTransformedValues>(props);
+    const rowProps = widgetProps(props);
+
+    const binding = useFieldWidget<Adw.SpinRow>(
+        {
+            controllerRef: field.ref,
+            forwardedRef: rowProps.ref,
+            controllers: rowProps.controllers,
+            cssClasses: rowProps.cssClasses,
+            sensitive: rowProps.sensitive,
+            tooltipText: rowProps.tooltipText,
+            disabled: field.disabled,
+            isInvalid: fieldState.invalid,
+            errorMessage: fieldState.error?.message,
+            select: selectText,
+        },
+        field.onBlur,
+    );
+
+    const value = typeof field.value === "number" ? field.value : 0;
+
+    return (
+        <AdwSpinRow
+            {...rowProps}
+            {...binding}
+            value={value}
+            onNotifyValue={(nextValue, row) => {
+                field.onChange(nextValue ?? 0);
+                rowProps.onNotifyValue?.(nextValue, row);
+            }}
+        />
+    );
+}
+
+export { SpinRow };

package/src/switch-row.tsx

@@ -0,0 +1,45 @@
+import type * as Adw from "@gtkx/gi/adw";
+import type { ReactNode } from "react";
+import { AdwSwitchRow } from "@gtkx/jsx/adw";
+import { type FieldValues, useController } from "react-hook-form";
+import type { FormFieldPath, SwitchRowProps } from "./types.js";
+import { useFieldWidget, widgetProps } from "./internal/field.js";
+
+/** Renders an `Adw.SwitchRow` controlled by React Hook Form. */
+function SwitchRow<
+    TFieldValues extends FieldValues = FieldValues,
+    TName extends FormFieldPath<TFieldValues, boolean> = FormFieldPath<TFieldValues, boolean>,
+    TTransformedValues = TFieldValues,
+>(props: SwitchRowProps<TFieldValues, TName, TTransformedValues>): ReactNode {
+    const { field, fieldState } = useController<TFieldValues, TName, TTransformedValues>(props);
+    const rowProps = widgetProps(props);
+
+    const binding = useFieldWidget<Adw.SwitchRow>(
+        {
+            controllerRef: field.ref,
+            forwardedRef: rowProps.ref,
+            controllers: rowProps.controllers,
+            cssClasses: rowProps.cssClasses,
+            sensitive: rowProps.sensitive,
+            tooltipText: rowProps.tooltipText,
+            disabled: field.disabled,
+            isInvalid: fieldState.invalid,
+            errorMessage: fieldState.error?.message,
+        },
+        field.onBlur,
+    );
+
+    return (
+        <AdwSwitchRow
+            {...rowProps}
+            {...binding}
+            active={field.value === true}
+            onNotifyActive={(active, row) => {
+                field.onChange(active === true);
+                rowProps.onNotifyActive?.(active, row);
+            }}
+        />
+    );
+}
+
+export { SwitchRow };

package/src/types.ts

@@ -0,0 +1,73 @@
+import type { ComboRowProps as BaseComboRowProps } from "@gtkx/components/adw";
+import type {
+    AdwEntryRowProps,
+    AdwPasswordEntryRowProps,
+    AdwSpinRowProps,
+    AdwSwitchRowProps,
+} from "@gtkx/jsx/adw";
+import type { FieldPath, FieldPathByValue, FieldValues, UseControllerProps } from "react-hook-form";
+
+/** A form field path whose value can be represented by a GTKX control. */
+type FormFieldPath<TFieldValues extends FieldValues, TValue> = FieldPathByValue<
+    TFieldValues,
+    TValue | null | undefined
+>;
+
+/** React Hook Form controller options shared by every GTKX form field. */
+type FormFieldProps<
+    TFieldValues extends FieldValues = FieldValues,
+    TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
+    TTransformedValues = TFieldValues,
+> = UseControllerProps<TFieldValues, TName, TTransformedValues>;
+
+/** Props for an Adwaita entry row controlled by React Hook Form. */
+type EntryRowProps<
+    TFieldValues extends FieldValues = FieldValues,
+    TName extends FormFieldPath<TFieldValues, string> = FormFieldPath<TFieldValues, string>,
+    TTransformedValues = TFieldValues,
+> = Omit<AdwEntryRowProps, "accessibleInvalid" | "text"> &
+    FormFieldProps<TFieldValues, TName, TTransformedValues>;
+
+/** Props for an Adwaita password entry row controlled by React Hook Form. */
+type PasswordEntryRowProps<
+    TFieldValues extends FieldValues = FieldValues,
+    TName extends FormFieldPath<TFieldValues, string> = FormFieldPath<TFieldValues, string>,
+    TTransformedValues = TFieldValues,
+> = Omit<AdwPasswordEntryRowProps, "accessibleInvalid" | "text"> &
+    FormFieldProps<TFieldValues, TName, TTransformedValues>;
+
+/** Props for an Adwaita switch row controlled by React Hook Form. */
+type SwitchRowProps<
+    TFieldValues extends FieldValues = FieldValues,
+    TName extends FormFieldPath<TFieldValues, boolean> = FormFieldPath<TFieldValues, boolean>,
+    TTransformedValues = TFieldValues,
+> = Omit<AdwSwitchRowProps, "accessibleInvalid" | "active"> &
+    FormFieldProps<TFieldValues, TName, TTransformedValues>;
+
+/** Props for an Adwaita spin row controlled by React Hook Form. */
+type SpinRowProps<
+    TFieldValues extends FieldValues = FieldValues,
+    TName extends FormFieldPath<TFieldValues, number> = FormFieldPath<TFieldValues, number>,
+    TTransformedValues = TFieldValues,
+> = Omit<AdwSpinRowProps, "accessibleInvalid" | "text" | "value"> &
+    FormFieldProps<TFieldValues, TName, TTransformedValues>;
+
+/** Props for an ID-based Adwaita combo row controlled by React Hook Form. */
+type ComboRowProps<
+    TFieldValues extends FieldValues = FieldValues,
+    TName extends FormFieldPath<TFieldValues, string> = FormFieldPath<TFieldValues, string>,
+    TTransformedValues = TFieldValues,
+    TItem = unknown,
+    TSection = unknown,
+> = Omit<BaseComboRowProps<TItem, TSection>, "accessibleInvalid" | "selectedId"> &
+    FormFieldProps<TFieldValues, TName, TTransformedValues>;
+
+export {
+    type ComboRowProps,
+    type EntryRowProps,
+    type FormFieldPath,
+    type FormFieldProps,
+    type PasswordEntryRowProps,
+    type SpinRowProps,
+    type SwitchRowProps,
+};