react-form-action/dist/client.d.mts

State management helpers for the react form actions.

import * as React from 'react';
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 { ZodFormattedError } from 'zod';
import { RenderProp, RP } from 'react-render-prop-type';

type ActionProps<Data, Error, ValidationError> = PropsWithChildren<{
    action: FormAction<Data, Error, ValidationError>;
    initialData: Data;
    permalink?: string;
}>;
type ActionStatusFlags<T extends ActionState<unknown, unknown, unknown>["type"] | unknown = unknown> = {
    isInitial: T extends "initial" ? true : false;
    isInvalid: T extends "invalid" ? true : false;
    isFailure: T extends "failure" ? true : false;
    isSuccess: T extends "success" ? true : false;
};
type ActionContextState<T extends ActionState<unknown, unknown, unknown>> = T & ActionStatusFlags<T["type"]> & {
    /**
     * The dispatch function returned from React.useActionState()
     */
    action: (payload: FormData) => void;
    isPending: boolean;
};
/**
 * NOTE: ActionContextState<ActionState<...>> would not allow discriminate the union inside of the ActionState.
 */
type SpreadActionContext<Data = unknown, Error = unknown, ValidationError = unknown> = ActionContextState<InitialState<Data>> | ActionContextState<InvalidState<ValidationError>> | ActionContextState<FailureState<Error>> | ActionContextState<SuccessState<Data>>;
/**
 * A hook to consume the form action state from the context.
 */
declare function useActionContext<Data, Error, ValidationError>(action?: FormAction<Data, Error, ValidationError>): SpreadActionContext<Data, Error, ValidationError>;
declare function Action<Data, Error, ValidationError>({ children, action: formAction, initialData, permalink, }: ActionProps<Data, Error, ValidationError>): React__default.JSX.Element;

type FormProps = Omit<JSX.IntrinsicElements["form"], "action"> & {
    /**
     * Opt-in into automatic form reset by using the form "action" prop.
     * By default, the onSubmit with a custom transition which opts-out of the implicit form reset.
     * See for more. https://github.com/facebook/react/issues/29034
     * @default false
     */
    autoReset?: boolean;
};
declare function Form({ autoReset, ...props }: FormProps): JSX.Element;

declare const SEPARATOR: ".";
type Paths<Err> = {
    [k in keyof Err]: k extends string ? Err[k] extends object ? `${k}${typeof SEPARATOR}${Paths<Err[k]>}` : k : never;
}[keyof Err];
type InferZodErrorPaths<Errors> = Errors extends ZodFormattedError<infer E> ? Paths<E> : never;
type ZodFieldErrorProps<Errors extends ZodFormattedError<any>, Name extends "" | InferZodErrorPaths<Errors>> = {
    errors: Errors;
    name: Name;
} & Partial<RenderProp<ZodFieldErrorChildrenProps<Name>>>;
type ZodFieldErrorChildrenProps<Name> = {
    name: Name;
    error?: string;
    errors: readonly string[];
};
declare const noError: Readonly<{
    _errors: readonly string[];
}>;
declare function ZodFieldError<Errors extends ZodFormattedError<any>, Name extends "" | InferZodErrorPaths<Errors> = "">({ errors, name, children, }: ZodFieldErrorProps<Errors, Name>): React__default.ReactNode;

/**
 * Creates a typed components for actions created with the formAction builder.
 */
declare function createComponents<Data, Error, ValidationError extends ZodFormattedError<any>>(action: FormAction<Data, Error, ValidationError>): {
    FieldError: <Name extends "" | InferZodErrorPaths<ValidationError>>({ name, children, }: {
        name: Name;
    } & Partial<RenderProp<ZodFieldErrorChildrenProps<Name>>>) => React__default.JSX.Element;
    Success: ({ children, }: PropsWithChildren | RP<{
        isSuccess: false;
        data: Data | null;
    } | {
        isSuccess: true;
        data: Data;
    }>) => React__default.ReactNode;
};

/**
 * Conditionally renders the children, when the form action is in the "pending" state.
 */
declare function Pending({ children, }: PropsWithChildren | RP<{
    isPending: boolean;
}>): React.ReactNode;

export { Action, type ActionContextState, type ActionProps, Form, type FormProps, type InferZodErrorPaths, type Paths, Pending, ZodFieldError, type ZodFieldErrorChildrenProps, type ZodFieldErrorProps, createComponents, noError, useActionContext };