@beignet/react-hook-form 0.0.24 → 0.0.26

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @beignet/react-hook-form
 
+## 0.0.26
+
+### Patch Changes
+
+- 104302c: Refresh package-shipped TanStack Intent skills and add package skills for Drizzle database providers, Better Auth, React Hook Form, and React uploads.
+
+## 0.0.25
+
 ## 0.0.24
 
 ## 0.0.23

package/README.md

@@ -18,6 +18,14 @@ npm install @beignet/react-hook-form @beignet/core react-hook-form @hookform/res
 
 This package requires TypeScript 5.0 or higher for proper type inference.
 
+## Agent skills
+
+This package ships a TanStack Intent skill for coding agents:
+`@beignet/react-hook-form#forms`. Load it when adding contract-backed forms,
+React Hook Form setup, Standard Schema resolver behavior, `rootFormError`,
+React Query mutations, transforming body schemas, feature component
+boundaries, or field/server error mapping in a Beignet app.
+
 ## Usage
 
 ### Basic form

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@beignet/react-hook-form",
-  "version": "0.0.24",
+  "version": "0.0.26",
   "type": "module",
   "description": "React Hook Form integration for Beignet with Standard Schema support",
   "main": "./dist/index.js",
@@ -17,6 +17,7 @@
     "!src/**/*.test.ts",
     "!src/**/*.test.tsx",
     "!src/**/*.test-d.ts",
+    "skills",
     "README.md",
     "CHANGELOG.md"
   ],
@@ -34,7 +35,8 @@
     "api",
     "typescript",
     "react-hook-form",
-    "standard-schema"
+    "standard-schema",
+    "tanstack-intent"
   ],
   "license": "MIT",
   "repository": {

package/skills/forms/SKILL.md

@@ -0,0 +1,143 @@
+---
+name: forms
+description: "Build Beignet React Hook Form integration with @beignet/react-hook-form: createReactHookForm, contract body schemas, formOptions, useForm, Standard Schema resolver behavior, rootFormError, React Query mutations, transforming schemas, feature component boundaries, field/server error mapping, and client/server import fixes. Use when adding or debugging forms in a Beignet React app."
+---
+
+# Beignet React Hook Form
+
+Use this skill when working in a Beignet React app that depends on
+`@beignet/react-hook-form`. Read the nearest feature component, feature
+schemas/contracts, root `client/` helpers, and existing form patterns before
+adding a new form.
+
+## Setup
+
+Create the adapter once in root `client/` or reuse the app's existing helper.
+
+```ts
+import { createReactHookForm } from "@beignet/react-hook-form";
+
+export const rhf = createReactHookForm();
+```
+
+Feature forms should import contracts, schemas, feature client helpers, React
+Hook Form, React Query, and UI components only. They must not import use cases,
+routes, providers, infra adapters, `server/`, or `app-context.ts`.
+
+## Contract Requirements
+
+React Hook Form binds to the contract body schema. If a contract has no
+`.body(...)`, `rhf(contract)` throws because there are no form fields or body
+validation to infer.
+
+Keep shared form DTOs in `features/<feature>/schemas.ts`, then reuse them from
+contracts, use cases, tests, and components.
+
+## Form Pattern
+
+```tsx
+"use client";
+
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import { rootFormError } from "@beignet/react-hook-form";
+import { rhf } from "@/client/forms";
+import { createTodo } from "@/features/todos/contracts";
+import {
+  createTodoMutationOptions,
+  invalidateTodos,
+} from "@/features/todos/client/queries";
+
+const createTodoForm = rhf(createTodo);
+
+export function CreateTodoForm() {
+  const queryClient = useQueryClient();
+  const form = createTodoForm.useForm({
+    defaultValues: { title: "" },
+  });
+
+  const mutation = useMutation({
+    ...createTodoMutationOptions(),
+    onSuccess: () => {
+      form.reset();
+      invalidateTodos(queryClient);
+    },
+    onError: (error) => {
+      form.setError(
+        "root",
+        rootFormError(error, "Could not create the todo."),
+      );
+    },
+  });
+
+  return (
+    <form
+      onSubmit={form.handleSubmit((values) => {
+        form.clearErrors("root");
+        mutation.mutate({ body: values });
+      })}
+    >
+      {/* fields */}
+    </form>
+  );
+}
+```
+
+Use `formOptions(...)` when a component or wrapper wants options without
+calling the hook directly.
+
+## Input And Output Types
+
+React Hook Form field state uses the schema input type. `handleSubmit` receives
+the schema output type after validation, coercion, defaults, and transforms.
+
+For plain, defaulted, or coerced schemas, submitting `values` as the contract
+body usually works. If a schema transform changes a field's type so the parsed
+output no longer matches the contract body input, send raw field values from
+`form.getValues()` after validation instead of `values`.
+
+## Error Mapping
+
+Use `rootFormError(error, fallback, overrides?)` for mutation or endpoint
+failures when the server error belongs at the form level.
+
+```ts
+form.setError(
+  "root",
+  rootFormError(error, "Could not update profile.", {
+    HANDLE_UNAVAILABLE: "That handle is already taken.",
+  }),
+);
+```
+
+Map a server error to a field only when the server response identifies a
+specific field and the field exists in the body schema. Keep route-owned error
+codes declared on the contract with `.errors(...)`.
+
+## Gotchas
+
+- `rhf(contract)` only understands the request body. Path params, query
+  params, headers, tenant IDs, and auth-derived values belong in mutation
+  variables or app context, not form fields.
+- Contracts without `.body(...)` are not form contracts.
+- `handleSubmit` returns parsed schema output. For transforms that change field
+  types, submit `form.getValues()` after validation when the contract client
+  expects body input.
+- Keep the root form helper in `client/forms.ts` unless the app already uses a
+  different local convention.
+- Do not import use cases or server modules to reuse validation. Move shared
+  validation to `features/<feature>/schemas.ts`.
+
+## Validation
+
+Leave the generated Standard Schema resolver enabled by default. Use
+`resolverEnabled: false` only for deliberate partial or multi-step flows, and
+keep final validation in use cases.
+
+After form changes, run from the app root:
+
+```bash
+beignet lint
+beignet doctor --strict
+bun run typecheck
+bun run test
+```