import React, { type JSX } from "react";
import { type BaseSchema, type InferOutput, type ObjectIssue, type ObjectSchema } from "valibot";
/**
 * Represents a Valibot object schema used to define the structure and validation rules of a form.
 *
 * @remarks
 * This type enforces that the top-level schema is an object schema, where keys correspond to form field names.
 */
export type FormSchema = ObjectSchema<{
    [key: string]: BaseSchema<any, any, any>;
}, any>;
/**
 * Context object for the Form component.
 *
 * @internal
 */
type FormCtx = {
    /**
     * The Valibot schema used for validation.
     */
    schema?: FormSchema;
    /**
     * A unique identifier for the form instance.
     */
    formId: string;
};
/**
 * React Context that provides form metadata to child components.
 *
 * @internal
 */
export declare let FormContext: React.Context<FormCtx>;
/**
 * Hook to access the current form's context.
 *
 * @returns The form context containing the schema and form ID.
 *
 * @example
 * ```tsx
 * function MyInput() {
 *   const { formId, schema } = useFormContext();
 *   // ...
 * }
 * ```
 */
export declare function useFormContext(): FormCtx;
/**
 * Type definition for the form submission handler.
 *
 * @param value - The validated and parsed form data, inferred from the schema.
 */
export type SubmitHandler<T extends FormSchema> = (value: InferOutput<T>) => void | Promise<void>;
/**
 * Props for the {@link Form} component.
 */
export type FormProps<T extends FormSchema> = Omit<JSX.IntrinsicElements["form"], "onSubmit"> & {
    /**
     * The Valibot schema to validate the form against.
     */
    schema: T;
    /**
     * Callback fired when the form is successfully validated and submitted.
     * It receives the parsed data matching the schema.
     */
    onSubmit?: SubmitHandler<T>;
    /**
     * Callback fired when validation fails.
     * It receives an array of validation issues.
     */
    onSchemaIssues?: (issues: Array<ObjectIssue>) => void;
};
/**
 * A type-safe Form component that integrates with Valibot for schema validation.
 *
 * @remarks
 * This component handles form submission, data parsing, validation, and error reporting.
 * It automatically manages the form's submission state (pending/submitted) via a global atom family.
 *
 * Key features:
 * - **Automatic Validation**: Validates all fields against the provided `schema` on submit.
 * - **Type Safety**: The `onSubmit` handler receives strongly-typed data inferred from the schema.
 * - **Error Handling**: Focuses the first invalid field and sets custom validity messages using the browser's Constraint Validation API.
 * - **State Management**: Tracks submission status (`isPending`, `isSubmitted`) which can be accessed via {@link useFormStatus}.
 * - **Radio/Checkbox Handling**: Correctly parses `RadioNodeList` and checkbox groups into arrays or single values.
 *
 * @param props - The component props.
 * @returns The rendered form element wrapped in a context provider.
 *
 * @example
 * ```tsx
 * import { object, string, email } from 'valibot';
 * import { Form } from '@packages/werkbank/component/form';
 *
 * const schema = object({
 *   email: string([email()]),
 *   password: string(),
 * });
 *
 * function LoginForm() {
 *   return (
 *     <Form
 *       schema={schema}
 *       onSubmit={(data) => {
 *         // data is typed as { email: string; password: string }
 *         console.log(data);
 *       }}
 *     >
 *       <input name="email" type="email" />
 *       <input name="password" type="password" />
 *       <button type="submit">Login</button>
 *     </Form>
 *   );
 * }
 * ```
 */
export declare function Form<T extends ObjectSchema<any, any>>({ schema, onSubmit, onSchemaIssues, children, id, ...props }: FormProps<T>): JSX.Element;
/**
 * Represents the internal state of a form.
 */
export type FormState = {
    /**
     * Whether the form has been submitted at least once (even if validation failed).
     * This is often used to show validation errors only after the first submission attempt.
     */
    isSubmitted: boolean;
    /**
     * Whether the form submission is currently in progress (async `onSubmit`).
     */
    isPending: boolean;
};
/**
 * An atom family that stores the state for each form instance.
 *
 * @internal
 */
export declare let formFamily: import("../../state").AtomFamily<[_id: string], FormState, {
    submitted: (state: import("immer").WritableDraft<FormState>, value: boolean) => void;
    pending: (state: import("immer").WritableDraft<FormState>, value: boolean) => void;
}>;
/**
 * Hook to access the status of the nearest parent {@link Form}.
 *
 * @returns The current form state (`isSubmitted`, `isPending`).
 *
 * @example
 * ```tsx
 * function SubmitButton() {
 *   const { isPending } = useFormStatus();
 *   return <button disabled={isPending}>Submit</button>;
 * }
 * ```
 */
export declare function useFormStatus(): FormState;
export {};