react-form-action 2.8.0 → 2.9.1

package/README.md

@@ -17,10 +17,11 @@ End-to-end typesafe success, error & validation state control for Next.js form a
 - ✅ Define bindable arguments with the `.args([])` method.
 - ✅ Reuse error handling with the `.error(handler)`.
 
-**React Context access with the `<Action action={myFormAction} />` component**
+**React Context access with the `<Action action={myFormAction} args={[...]} />` component**
 
-- ✅ The `useActionState()` accessible via the `useActionContext()` hook.
+- ✅ The `React.useActionState()` accessible via the `useActionContext()` hook.
 - ✅ Computes progress flags like `isInvalid`, `isSuccess` based on the envelope type.
+- ✅ Binds the action with the arguments from the _args_ prop.
 
 **Context-bound `<Form />` component**
 
@@ -193,16 +194,17 @@ export const signUp = authAction
 The `formAction` builder supports action arguments binding:
 
 ```ts
-// app/[locale]/update-user/[userId]/action.tsx
 import { formAction } from "react-form-action";
 
-export const updateUser = formAction
-  .args([z.string().uuid(), z.enum("fr", "en")])
-  .run(async ({ args: [userId] }) => {
-    return userId;
-    //     ^? string
+const i18nAction = formAction.args([z.enum("fr", "en")]);
+
+export const updateUser = i18nAction
+  .args([z.string().uuid()])
+  .run(async ({ args: [_, userId] }) => {
+    //          ^? ["fr" | "en", string]
+    // ...
   })
-  .error(({ args: [_, locale] }) => {
+  .error(({ args: [locale] }) => {
     return locale === "fr"
       ? "Échec de la mise à jour de l'utilisateur"
       : "Failed to update user";
@@ -210,26 +212,20 @@ export const updateUser = formAction
 ```
 
 ```tsx
-// app/[locale]/update-user/[userId]/page.tsx
 import { Action } from "react-form-action/client";
+import { locale } from "next/root-params";
 
-import { locale as localeParam } from "next/root-params";
 import { updateUser } from "./action";
 import { UpdateUserForm } from "./form";
 
 export default function Page({
   params,
 }: PageProps<"/[locale]/update-user/[userId]">) {
-  const locale = await localeParam();
   const { userId } = await params;
 
   return (
-    <Action
-      action={updateUser}
-      args={[userId, await localeParam()]}
-      initialData=""
-    >
-      <SubscribeForm />
+    <Action action={updateUser} args={[await locale(), userId]} initialData="">
+      <UpdateUserForm />
     </Action>
   );
 }

package/dist/client.d.mts

@@ -3,7 +3,7 @@ import React__default, { PropsWithChildren, JSX } from 'react';
 import { F as FormAction, A as ActionState, I as InitialState, a as InvalidState, b as FailureState, S as SuccessState } from './createFormAction-DjhozgiG.mjs';
 import { $ZodErrorTree } from 'zod/v4/core';
 
-type ActionProps<Data, Error, ValidationError, Arguments extends unknown[] = []> = PropsWithChildren<Arguments extends [unknown] ? {
+type ActionProps<Data, Error, ValidationError, Arguments extends unknown[] = []> = PropsWithChildren<Arguments extends [unknown, ...unknown[]] ? {
     action: FormAction<Data, Error, ValidationError, FormData, Arguments>;
     args: Arguments;
     initialData: Data;

package/dist/client.mjs

@@ -1 +1 @@
-"use client";import{a as f}from"./chunk-LPB4R2UB.mjs";import S from"react";import{useActionState as F,createContext as P,use as y}from"react";var c={isInitial:!1,isInvalid:!1,isFailure:!1,isSuccess:!1},E=P(null);function s(e){let t=y(E);if(!t)throw new Error("ActionContext must be initialized before use. Is your useActionContext hook wrapped with an <Action> Component?");return t}function v({children:e,action:t,initialData:a,args:i,permalink:r}){let o=i?t.bind(null,...i):t,[n,l,d]=F(o,f(a),r),u=n.type==="initial"?{...n,...c,action:l,isPending:d,isInitial:!0}:n.type==="invalid"?{...n,...c,action:l,isPending:d,isInvalid:!0}:n.type==="failure"?{...n,...c,action:l,isPending:d,isFailure:!0}:{...n,...c,action:l,isPending:d,isSuccess:!0};return S.createElement(E,{value:u},e)}import h,{startTransition as g}from"react";function I({autoReset:e=!1,...t}){let{action:a}=s();return h.createElement("form",{...e?{action:a}:{onSubmit:r=>{r.preventDefault();let o=r.currentTarget;g(()=>{a(new FormData(o))})}},...t})}import m from"react";import x from"react";var C=".",p=Object.freeze({errors:Object.freeze([])});function A({errors:e,name:t,children:a=({error:i})=>x.createElement(x.Fragment,null,i)}){if(t.length===0)return a({name:t,error:e.errors[0],errors:e.errors});let i=t.split(C),r=e;for(;i.length;){let o=i.shift();if(!r.properties){r=p;break}r=r.properties[o]??p}return a({name:t,error:r.errors[0],errors:r.errors})}function J(e){function t({name:r,children:o}){let{isInvalid:n,validationError:l}=s(e);return m.createElement(A,{errors:l??p,name:r},o??(({error:u})=>n&&m.createElement(m.Fragment,null,u)))}function a({children:r}){let{isSuccess:o,data:n}=s(e);return typeof r=="function"?r(o?{isSuccess:o,data:n}:{isSuccess:o,data:n}):o&&r}function i({children:r}){let{isInvalid:o,validationError:n}=s(e);return typeof r=="function"?r(o?{isInvalid:o,validationError:n}:{isInvalid:o,validationError:n}):o&&r}return{FieldError:t,Success:a,Invalid:i}}function q({children:e}){let{isPending:t}=s();return typeof e=="function"?e({isPending:t}):t&&e}export{v as Action,I as Form,q as Pending,A as ZodFieldError,J as createComponents,p as noError,s as useActionContext};
+"use client";import{a as f}from"./chunk-LPB4R2UB.mjs";import S from"react";import{useActionState as F,createContext as P,use as y}from"react";var c={isInitial:!1,isInvalid:!1,isFailure:!1,isSuccess:!1},E=P(null);function s(e){let t=y(E);if(!t)throw new Error("ActionContext must be initialized before use. Is your useActionContext hook wrapped with an <Action> Component?");return t}function v({children:e,action:t,initialData:a,args:i,permalink:r}){let o=i?t.bind(null,...i):t,[n,l,d]=F(o,f(a),r),u=n.type==="initial"?{...n,...c,action:l,isPending:d,isInitial:!0}:n.type==="invalid"?{...n,...c,action:l,isPending:d,isInvalid:!0}:n.type==="failure"?{...n,...c,action:l,isPending:d,isFailure:!0}:{...n,...c,action:l,isPending:d,isSuccess:!0};return S.createElement(E,{value:u},e)}import h,{startTransition as g}from"react";function I({autoReset:e=!1,...t}){let{action:a}=s();return h.createElement("form",{...e?{action:a}:{onSubmit:r=>{r.preventDefault();let o=r.currentTarget;g(()=>{a(new FormData(o))})}},...t})}import m from"react";import x from"react";var k=".",p=Object.freeze({errors:Object.freeze([])});function A({errors:e,name:t,children:a=({error:i})=>x.createElement(x.Fragment,null,i)}){if(t.length===0)return a({name:t,error:e.errors[0],errors:e.errors});let i=t.split(k),r=e;for(;i.length;){let o=i.shift();if(!r.properties){r=p;break}r=r.properties[o]??p}return a({name:t,error:r.errors[0],errors:r.errors})}function J(e){function t({name:r,children:o}){let{isInvalid:n,validationError:l}=s(e);return m.createElement(A,{errors:l??p,name:r},o??(({error:u})=>n&&m.createElement(m.Fragment,null,u)))}function a({children:r}){let{isSuccess:o,data:n}=s(e);return typeof r=="function"?r(o?{isSuccess:o,data:n}:{isSuccess:o,data:n}):o&&r}function i({children:r}){let{isInvalid:o,validationError:n}=s(e);return typeof r=="function"?r(o?{isInvalid:o,validationError:n}:{isInvalid:o,validationError:n}):o&&r}return{FieldError:t,Success:a,Invalid:i}}function q({children:e}){let{isPending:t}=s();return typeof e=="function"?e({isPending:t}):t&&e}export{v as Action,I as Form,q as Pending,A as ZodFieldError,J as createComponents,p as noError,s as useActionContext};

package/dist/index.d.mts

@@ -1,7 +1,7 @@
 import { A as ActionState, a as InvalidState, b as FailureState, S as SuccessState } from './createFormAction-DjhozgiG.mjs';
 export { F as FormAction, I as InitialState, c as createFormAction, i as initial } from './createFormAction-DjhozgiG.mjs';
-import { ZodType, ZodTuple, ZodObject, z } from 'zod/v4';
-import { $ZodShape, $ZodErrorTree } from 'zod/v4/core';
+import { ZodType, z, ZodTuple, ZodObject } from 'zod/v4';
+import { $ZodType, $ZodShape, $ZodErrorTree } from 'zod/v4/core';
 
 declare const emptyInput: unique symbol;
 type EmptyInput = typeof emptyInput;
@@ -9,44 +9,44 @@ type Flatten<T> = Identity<{
     [K in keyof T]: T[K];
 }>;
 type Identity<T> = T;
-type ErrorHandler<Context, Err, Args extends ZodTuple> = (params: {
+type ErrorHandler<Context, Err, Args> = (params: {
     error: unknown;
     ctx: Context;
-    args: z.infer<Args>;
+    args: Args;
 }) => Promise<Err>;
 type InitialContext = Record<"formData", FormData>;
 /**
  * Action without schema has no input.
  */
-type Action<Data, Context, Args extends ZodTuple> = (params: {
-    args: z.infer<Args>;
+type Action<Data, Context, Args extends unknown[]> = (params: {
+    args: Args;
     ctx: Context;
 }) => Promise<Data>;
 /**
  * Action with schema will get parsed formData as the input.
  */
-type SchemaAction<Data, Context, Args extends ZodTuple, Schema extends ZodType> = (params: {
-    args: z.infer<Args>;
+type SchemaAction<Data, Context, Args extends unknown[], Schema extends ZodType> = (params: {
+    args: Args;
     ctx: Context;
-    input: z.infer<Schema>;
+    input: z.output<Schema>;
 }) => Promise<Data>;
-type FormActionBuilder<Schema extends ZodType | EmptyInput, TErr = unknown, Context = InitialContext, Args extends ZodTuple = ZodTuple<[], null>> = {
-    args: <T extends [ZodType, ...ZodType[]]>(args: T) => FormActionBuilder<Schema, TErr, Context, ZodTuple<T, null>>;
-    input: <T extends ZodObject>(newInput: T extends ZodObject ? T : "The schema output must be an object.") => FormActionBuilder<Schema extends ZodObject<infer O1 extends $ZodShape> ? T extends ZodObject<infer O2 extends $ZodShape> ? ZodObject<O1 & O2> : never : T, TErr, Context, Args>;
+type FormActionBuilder<Schema extends ZodType | EmptyInput, Args extends $ZodType[] = [], TErr = unknown, Context = InitialContext, PlainArgs extends unknown[] = z.output<ZodTuple<Args, null>>> = {
+    args: <T extends [$ZodType, ...$ZodType[]]>(args: T) => FormActionBuilder<Schema, [...Args, ...T], TErr, Context>;
+    input: <T extends ZodObject>(newInput: T extends ZodObject ? T : "The schema output must be an object.") => FormActionBuilder<Schema extends ZodObject<infer O1 extends $ZodShape> ? T extends ZodObject<infer O2 extends $ZodShape> ? ZodObject<O1 & O2> : never : T, Args, TErr, Context>;
     /**
      * A finishing call on the builder completing your action.
      * @param action async function to execute. It will receive parsed formData as input, when the builder was initialized with a schema.
      * @returns runnable server action exportable from a module.
      */
-    run: Schema extends ZodType ? <Data>(action: SchemaAction<Data, Flatten<Context>, Args, Schema>) => (...args: [
-        ...z.infer<Args>,
-        state: ActionState<Data, TErr, $ZodErrorTree<z.output<Schema>> & $ZodErrorTree<z.output<Args>>>,
+    run: Schema extends ZodType ? <Data>(action: SchemaAction<Data, Flatten<Context>, PlainArgs, Schema>) => (...args: [
+        ...PlainArgs,
+        state: ActionState<Data, TErr, $ZodErrorTree<z.output<Schema>> & $ZodErrorTree<PlainArgs>>,
         payload: FormData
-    ]) => Promise<Flatten<InvalidState<$ZodErrorTree<z.output<Schema>> & $ZodErrorTree<z.output<Args>>> | FailureState<TErr> | SuccessState<Data>>> : <Data>(action: Action<Data, Flatten<Context>, Args>) => (...args: [
-        ...z.infer<Args>,
-        state: ActionState<Data, TErr, $ZodErrorTree<z.output<Args>>>,
+    ]) => Promise<Flatten<InvalidState<$ZodErrorTree<z.output<Schema>> & $ZodErrorTree<PlainArgs>> | FailureState<TErr> | SuccessState<Data>>> : <Data>(action: Action<Data, Flatten<Context>, PlainArgs>) => (...args: [
+        ...PlainArgs,
+        state: ActionState<Data, TErr, $ZodErrorTree<PlainArgs>>,
         payload: FormData
-    ]) => Promise<Flatten<InvalidState<$ZodErrorTree<z.output<Args>>> | FailureState<TErr> | SuccessState<Data>>>;
+    ]) => Promise<Flatten<InvalidState<$ZodErrorTree<PlainArgs>> | FailureState<TErr> | SuccessState<Data>>>;
     /**
      * A chainable context enhancing helper.
      * @param middleware A function which receives the current context, and returns an object which will be added to the context.
@@ -54,15 +54,15 @@ type FormActionBuilder<Schema extends ZodType | EmptyInput, TErr = unknown, Cont
      */
     use: <NewContext extends Record<string, unknown>>(middleware: ({ ctx }: {
         ctx: Context;
-    }) => Promise<NewContext>) => FormActionBuilder<Schema, TErr, Context & NewContext, Args>;
+    }) => Promise<NewContext>) => FormActionBuilder<Schema, Args, TErr, Context & NewContext>;
     /**
      * A chainable error handler to handle errors thrown while running the action passed to .run().
      * It does not receive errors thrown from the context/middleware.
      * @param processError A function which receives action's errors.
      * @returns FormActionBuilder
      */
-    error: <TErr>(processError: ErrorHandler<Context, TErr, Args>) => FormActionBuilder<Schema, TErr, Context, Args>;
+    error: <TErr>(processError: ErrorHandler<Context, TErr, PlainArgs>) => FormActionBuilder<Schema, Args, TErr, Context>;
 };
-declare const formAction: FormActionBuilder<typeof emptyInput, unknown, InitialContext, z.ZodTuple<[], null>>;
+declare const formAction: FormActionBuilder<typeof emptyInput, [], unknown, InitialContext, []>;
 
 export { ActionState, FailureState, InvalidState, SuccessState, formAction };

package/dist/index.mjs

@@ -1 +1 @@
-import{a as h,b as f}from"./chunk-LPB4R2UB.mjs";import{z as T}from"zod/v4";import{zfd as C}from"zod-form-data";var m=Symbol();function c(e,u=[],n,a){async function A(t){let r={formData:t};for(let d of u){let i=await d({ctx:r});r={...r,...i}}return r}return{args(t){return c(e,u,n,T.tuple(t))},input(t){if(e===m)return c(t,u,n,a);if(e._zod.def.checks)throw new Error("Previous input is not augmentable because it contains an effect.");if(t._zod.def.checks)throw new Error("Your input contains effect which prevents merging it with the previous inputs.");if(e._zod.def.type==="object"){let r=T.object({...e.shape,...t.shape});return c(r,u)}else throw Error("Merging inputs works only for object schemas without effects.")},use(t){return c(e,[...u,t],n,a)},error(t){return c(e,u,t,a)},run:e===m?t=>f(({success:r,failure:d,invalid:i},...s)=>async(E,g)=>{let p=await A(g);if(a){let o=a.safeParse(s);if(!o.success)return i(T.treeifyError(o.error))}try{return r(await t({args:s,ctx:p}))}catch(o){if(n)return d(await n({args:s,error:o,ctx:p}));throw o}}):e===m?void 0:t=>f(({success:r,failure:d,invalid:i},...s)=>{let E=C.formData(e);return async(g,p)=>{let o=await A(p);if(a){let x=a.safeParse(s);if(!x.success)return i(T.treeifyError(x.error))}let l=E.safeParse(p);if(!l.success)return i(T.treeifyError(l.error));let y=l.data;try{return r(await t({args:s,input:y,ctx:o}))}catch(x){if(n)return d(await n({args:s,error:x,ctx:o}));throw x}}})}}var j=c(m);export{f as createFormAction,j as formAction,h as initial};
+import{a as w,b as A}from"./chunk-LPB4R2UB.mjs";import{z as c}from"zod/v4";import{zfd as C}from"zod-form-data";var T=Symbol();function d(r,i=[],a,n){async function f(t){let e={formData:t};for(let p of i){let u=await p({ctx:e});e={...e,...u}}return e}return{args(t){let e=n?[...n,...t]:t;return d(r,i,a,e)},input(t){if(r===T)return d(t,i,a,n);if(r._zod.def.checks)throw new Error("Previous input is not augmentable because it contains an effect.");if(t._zod.def.checks)throw new Error("Your input contains effect which prevents merging it with the previous inputs.");if(r._zod.def.type==="object"){let e=c.object({...r.shape,...t.shape});return d(e,i)}else throw Error("Merging inputs works only for object schemas without effects.")},use(t){return d(r,[...i,t],a,n)},error(t){return d(r,i,t,n)},run:r===T?t=>A(({success:e,failure:p,invalid:u},...s)=>async(y,g)=>{let x=await f(g);if(n){let o=c.tuple(n).safeParse(s);if(!o.success)return u(c.treeifyError(o.error))}try{return e(await t({args:s,ctx:x}))}catch(o){if(a)return p(await a({args:s,error:o,ctx:x}));throw o}}):r===T?void 0:t=>A(({success:e,failure:p,invalid:u},...s)=>{let y=C.formData(r);return async(g,x)=>{let o=await f(x);if(n){let l=c.tuple(n).safeParse(s);if(!l.success)return u(c.treeifyError(l.error))}let m=y.safeParse(x);if(!m.success)return u(c.treeifyError(m.error));let E=m.data;try{return e(await t({args:s,input:E,ctx:o}))}catch(l){if(a)return p(await a({args:s,error:l,ctx:o}));throw l}}})}}var k=d(T);export{A as createFormAction,k as formAction,w as initial};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-form-action",
-  "version": "2.8.0",
+  "version": "2.9.1",
   "description": "State management helpers for the react form actions.",
   "repository": {
     "type": "git",