@faasjs/react 3.7.0-beta.0 → 3.7.0-beta.10

package/README.md

@@ -34,7 +34,7 @@ React plugin for FaasJS.
 ## Install
 
 ```sh
-npm install @faasjs/react
+npm install @faasjs/react react
 ```
 
 ## Functions
@@ -45,6 +45,8 @@ npm install @faasjs/react
 - [FaasDataWrapper](functions/FaasDataWrapper.md)
 - [FaasReactClient](functions/FaasReactClient.md)
 - [Form](functions/Form.md)
+- [FormContextProvider](functions/FormContextProvider.md)
+- [FormItem](functions/FormItem.md)
 - [getClient](functions/getClient.md)
 - [OptionalWrapper](functions/OptionalWrapper.md)
 - [useConstant](functions/useConstant.md)
@@ -53,7 +55,10 @@ npm install @faasjs/react
 - [useEqualMemo](functions/useEqualMemo.md)
 - [useEqualMemoize](functions/useEqualMemoize.md)
 - [useFaas](functions/useFaas.md)
+- [useFormContext](functions/useFormContext.md)
+- [usePrevious](functions/usePrevious.md)
 - [useSplittingState](functions/useSplittingState.md)
+- [validValues](functions/validValues.md)
 - [withFaasData](functions/withFaasData.md)
 
 ## Classes
@@ -76,8 +81,27 @@ npm install @faasjs/react
 - [FaasParams](type-aliases/FaasParams.md)
 - [FaasReactClientInstance](type-aliases/FaasReactClientInstance.md)
 - [FaasReactClientOptions](type-aliases/FaasReactClientOptions.md)
+- [FormButtonElementProps](type-aliases/FormButtonElementProps.md)
+- [FormContextProps](type-aliases/FormContextProps.md)
+- [FormDefaultRulesOptions](type-aliases/FormDefaultRulesOptions.md)
+- [FormElementTypes](type-aliases/FormElementTypes.md)
+- [FormInputElementProps](type-aliases/FormInputElementProps.md)
+- [FormItemName](type-aliases/FormItemName.md)
+- [FormItemProps](type-aliases/FormItemProps.md)
+- [FormLabelElementProps](type-aliases/FormLabelElementProps.md)
+- [FormLang](type-aliases/FormLang.md)
+- [FormProps](type-aliases/FormProps.md)
+- [FormRule](type-aliases/FormRule.md)
+- [FormRules](type-aliases/FormRules.md)
+- [InferFormRulesOptions](type-aliases/InferFormRulesOptions.md)
 - [OnError](type-aliases/OnError.md)
 - [OptionalWrapperProps](type-aliases/OptionalWrapperProps.md)
 - [Options](type-aliases/Options.md)
 - [ResponseHeaders](type-aliases/ResponseHeaders.md)
 - [useFaasOptions](type-aliases/useFaasOptions.md)
+
+## Variables
+
+- [FormDefaultElements](variables/FormDefaultElements.md)
+- [FormDefaultLang](variables/FormDefaultLang.md)
+- [FormDefaultRules](variables/FormDefaultRules.md)

package/dist/index.d.mts

@@ -2,6 +2,7 @@ import { FaasAction, FaasData, FaasParams } from '@faasjs/types';
 export { FaasAction, FaasData, FaasParams } from '@faasjs/types';
 import { Response, BaseUrl, ResponseError, Options, FaasBrowserClient } from '@faasjs/browser';
 export { Options, Response, ResponseError, ResponseHeaders } from '@faasjs/browser';
+import * as react from 'react';
 import { ReactNode, Dispatch, SetStateAction, ReactElement, Component, ComponentType, ComponentProps, JSXElementConstructor } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
@@ -56,6 +57,14 @@ declare function useEqualMemo<T>(callback: () => T, dependencies: any[]): T;
  * @returns The result of the `useCallback` hook with memoized dependencies.
  */
 declare function useEqualCallback<T extends (...args: any[]) => any>(callback: T, dependencies: any[]): T;
+/**
+ * Hook to store the previous value of a state or prop.
+ *
+ * @template T - The type of the value.
+ * @param {T} value - The current value to be stored.
+ * @returns {T | undefined} - The previous value, or undefined if there is no previous value.
+ */
+declare function usePrevious<T>(value: T): T | undefined;
 
 /**
  * Creates a splitting context with the given default value.
@@ -123,7 +132,7 @@ declare function createSplittingContext<T extends Record<string, any>>(defaultVa
      * ```
      */
     Provider<NewT extends T = T>(props: {
-        value?: NewT;
+        value?: Partial<NewT>;
         children: ReactNode;
         /**
          * Whether to use memoization for the children.
@@ -134,6 +143,20 @@ declare function createSplittingContext<T extends Record<string, any>>(defaultVa
          * `any[]`: memoize the children with specific dependencies.
          */
         memo?: true | any[];
+        /**
+         * An object containing initial values that will be automatically converted into state variables using {@link useSplittingState} hook. Each property will create both a state value and its setter following the pattern: value/setValue.
+         *
+         * @example
+         * ```tsx
+         * <Provider
+         *  initializeStates={{
+         *    value: 0,
+         *  }}
+         * >
+         *   // Children will have access to: value, setValue
+         * </Provider>
+         */
+        initializeStates?: Partial<NewT>;
     }): ReactNode;
     /**
      * The hook to use the splitting context.
@@ -152,7 +175,7 @@ declare function createSplittingContext<T extends Record<string, any>>(defaultVa
     use: <NewT extends T = T>() => Readonly<NewT>;
 };
 
-type SetPrefix<S extends string | number | symbol> = S extends string ? (S extends `${infer First}${infer Rest}` ? `set${Capitalize<First>}${Rest}` : never) : never;
+type SetPrefix<S extends string | number | symbol> = S extends string ? S extends `${infer First}${infer Rest}` ? `set${Capitalize<First>}${Rest}` : never : never;
 type StateSetters<T> = {
     [K in keyof T as SetPrefix<K>]: Dispatch<SetStateAction<T[K]>>;
 };
@@ -211,6 +234,7 @@ type FaasDataWrapperProps<PathOrData extends FaasAction> = {
 };
 declare function FaasDataWrapper<PathOrData extends FaasAction>(props: FaasDataWrapperProps<PathOrData>): JSX.Element;
 declare namespace FaasDataWrapper {
+    var displayName: string;
     var whyDidYouRender: boolean;
 }
 /**
@@ -262,6 +286,14 @@ type FaasReactClientOptions = {
     /** @default `/` */
     baseUrl?: BaseUrl;
     options?: Options;
+    /**
+     * @example
+     * ```ts
+     * onError: (action, params) => async (res) => {
+     *   console.error(action, params, res)
+     * }
+     * ```
+     */
     onError?: OnError;
 };
 type FaasReactClientInstance = {
@@ -335,6 +367,7 @@ declare class ErrorBoundary extends Component<ErrorBoundaryProps, {
         componentStack?: string;
     };
 }> {
+    static displayName: string;
     static whyDidYouRender: boolean;
     constructor(props: ErrorBoundaryProps);
     componentDidCatch(error: Error | null, info: any): void;
@@ -371,64 +404,123 @@ declare const OptionalWrapper: React.FC<OptionalWrapperProps> & {
     whyDidYouRender: boolean;
 };
 
-type FormRules = {
-    type?: 'string' | 'number';
-    required?: boolean;
+type FormButtonElementProps = {
+    children?: React.ReactNode;
+    disabled: boolean;
+    submit: () => Promise<void>;
 };
 
-type FormInputComponentProps = {
+type FormInputElementProps = {
     name: string;
     value: any;
     onChange: (value: any) => void;
 };
-type FormInputComponent<Extra extends Record<string, any> = Record<string, any>> = ComponentType<FormInputComponentProps & Extra>;
-type InferFormInputProps<T extends FormInputComponent | JSXElementConstructor<any>> = T extends FormInputComponent ? Omit<ComponentProps<T>, 'name' | 'value' | 'onChange'> : Omit<ComponentProps<T>, 'name' | 'value'>;
-type FormInputProps<FormElements extends FormElementTypes = FormElementTypes> = {
-    Input: FormInputComponent;
-} | {
-    type?: 'input';
-    props?: InferFormInputProps<FormElements['input']>;
-} | {
-    type: 'select';
-    props?: InferFormInputProps<FormElements['select']>;
-};
 
-type FormLabelProps<FormElements extends FormElementTypes = FormElementTypes> = {
+type FormLabelElementProps = {
     name: string;
-    rules?: FormRules;
-    label?: {
-        title?: ReactNode;
-        description?: ReactNode;
-        Label?: React.ComponentType<FormLabelProps>;
-    };
-    input?: FormInputProps<FormElements>;
+    title?: ReactNode;
+    description?: ReactNode;
+    error?: Error;
+    /** as Input element */
+    children: ReactNode;
 };
 
-type FormButtonProps = {
-    children?: React.ReactNode;
-    disabled?: boolean;
-    onClick?: () => void;
+type FormElementTypes = {
+    Label: ComponentType<FormLabelElementProps>;
+    Input: ComponentType<FormInputElementProps>;
+    Button: ComponentType<FormButtonElementProps>;
 };
+declare const FormDefaultElements: FormElementTypes;
 
-type FormSelectOption = {
-    value: string | number;
-    label: string;
+declare const FormDefaultLang: {
+    submit: string;
+    required: string;
+    string: string;
+    number: string;
 };
-type FormElementTypes = {
-    label: ComponentType<FormLabelProps>;
-    input: FormInputComponent;
-    select: FormInputComponent<{
-        options?: FormSelectOption[];
-    }>;
-    button: ComponentType<FormButtonProps>;
+type FormLang = typeof FormDefaultLang;
+
+type FormRule<Options = any> = (value: any, options?: Options, lang?: FormLang) => Promise<void>;
+type InferRuleOption<T> = T extends (value: any, options: infer O, lang?: FormLang) => Promise<void> ? O : never;
+type FormRules = Record<string, FormRule>;
+type InferFormRulesOptions<T> = {
+    [K in keyof T]: InferRuleOption<T[K]>;
+};
+declare const FormDefaultRules: FormRules;
+type FormDefaultRulesOptions = InferFormRulesOptions<typeof FormDefaultRules>;
+declare function validValues(rules: FormRules, items: FormItemProps[], values: Record<string, any>, lang: FormLang): Promise<Record<string, Error>>;
+
+type InferFormInputProps<T extends ComponentType<FormInputElementProps> | JSXElementConstructor<any>> = T extends ComponentType<FormInputElementProps> ? Omit<ComponentProps<T>, 'name' | 'value' | 'onChange'> : Omit<ComponentProps<T>, 'name' | 'value'>;
+type FormInputProps<FormElements extends FormElementTypes = FormElementTypes> = {
+    Input?: ComponentType<FormInputElementProps>;
+    props?: InferFormInputProps<FormElements['Input']>;
 };
 
-type FormProps<Values extends Record<string, any> = Record<string, any>, FormElements extends FormElementTypes = FormElementTypes> = {
-    items: FormLabelProps<FormElements>[];
+type FormItemName = string;
+type FormItemProps<FormElements extends FormElementTypes = FormElementTypes, FormRulesOptions extends Record<string, any> = FormDefaultRulesOptions> = {
+    name: FormItemName;
+    label?: Omit<FormLabelElementProps, 'name' | 'children'> & {
+        Label?: ComponentType<FormLabelElementProps>;
+    };
+    input?: FormInputProps<FormElements>;
+    rules?: FormRulesOptions;
+};
+declare function FormItem(props: FormItemProps): react_jsx_runtime.JSX.Element;
+declare namespace FormItem {
+    var displayName: string;
+    var whyDidYouRender: boolean;
+}
+
+type FormProps<Values extends Record<string, any> = Record<string, any>, FormElements extends FormElementTypes = FormElementTypes, Rules extends FormRules = typeof FormDefaultRules> = {
+    items: FormItemProps<FormElements, InferFormRulesOptions<Rules>>[];
     onSubmit?: (values: Values) => Promise<void>;
-    elements?: FormElements;
+    Elements?: Partial<FormElements>;
+    lang?: Partial<FormLang>;
     defaultValues?: Values;
+    rules?: typeof FormDefaultRules & Rules;
+};
+/**
+ * FormContainer component is a wrapper that provides context and state management for form elements.
+ * It initializes form states such as values, errors, submitting status, elements, language, and rules.
+ *
+ * @template Values - The type of form values, defaults to Record<string, any>.
+ * @template FormElements - The type of form elements, defaults to FormElementTypes.
+ * @template Rules - The type of form rules, defaults to FormDefaultRules.
+ *
+ * @param {FormProps<Values, FormElements, Rules>} props - The properties for the FormContainer component.
+ * @param {Values} props.defaultValues - The default values for the form fields.
+ * @param {FormElements} props.Elements - The form elements to be used in the form.
+ * @param {Rules} props.rules - The validation rules for the form fields.
+ * @param {FormLang} props.lang - The language settings for the form.
+ * @param {Partial<FormContextProps>} props - Additional properties for the form context.
+ *
+ * @returns {JSX.Element} The FormContainer component.
+ */
+declare function FormContainer<Values extends Record<string, any> = Record<string, any>, FormElements extends FormElementTypes = FormElementTypes, Rules extends FormRules = typeof FormDefaultRules>({ defaultValues, Elements, rules, lang, ...props }: FormProps<Values, FormElements, Rules>): react_jsx_runtime.JSX.Element;
+declare namespace FormContainer {
+    var displayName: string;
+    var whyDidYouRender: boolean;
+}
+
+type FormContextProps<Values extends Record<string, any> = Record<string, any>, Rules extends FormRules = typeof FormDefaultRules> = {
+    items: FormLabelElementProps[];
+    onSubmit: (values: Values) => Promise<void>;
+    Elements: FormElementTypes;
+    lang: FormLang;
+    rules: typeof FormDefaultRules & Rules;
+    submitting: boolean;
+    setSubmitting: Dispatch<SetStateAction<boolean>>;
+    values: Values;
+    setValues: Dispatch<SetStateAction<Values>>;
+    errors: Record<string, Error>;
+    setErrors: Dispatch<SetStateAction<Record<string, Error>>>;
 };
-declare function FormContainer<Values extends Record<string, any> = Record<string, any>, FormElements extends FormElementTypes = FormElementTypes>({ defaultValues, elements, ...props }: FormProps<Values, FormElements>): react_jsx_runtime.JSX.Element;
+declare const FormContextProvider: <NewT extends FormContextProps<Record<string, any>, FormRules> = FormContextProps<Record<string, any>, FormRules>>(props: {
+    value?: Partial<NewT>;
+    children: react.ReactNode;
+    memo?: true | any[];
+    initializeStates?: Partial<NewT>;
+}) => react.ReactNode;
+declare const useFormContext: <NewT extends FormContextProps<Record<string, any>, FormRules> = FormContextProps<Record<string, any>, FormRules>>() => Readonly<NewT>;
 
-export { ErrorBoundary, type ErrorBoundaryProps, type ErrorChildrenProps, type FaasDataInjection, FaasDataWrapper, type FaasDataWrapperProps, FaasReactClient, type FaasReactClientInstance, type FaasReactClientOptions, FormContainer as Form, type OnError, OptionalWrapper, type OptionalWrapperProps, createSplittingContext, equal, faas, getClient, useConstant, useEqualCallback, useEqualEffect, useEqualMemo, useEqualMemoize, useFaas, type useFaasOptions, useSplittingState, withFaasData };
+export { ErrorBoundary, type ErrorBoundaryProps, type ErrorChildrenProps, type FaasDataInjection, FaasDataWrapper, type FaasDataWrapperProps, FaasReactClient, type FaasReactClientInstance, type FaasReactClientOptions, FormContainer as Form, type FormButtonElementProps, type FormContextProps, FormContextProvider, FormDefaultElements, FormDefaultLang, FormDefaultRules, type FormDefaultRulesOptions, type FormElementTypes, type FormInputElementProps, FormItem, type FormItemName, type FormItemProps, type FormLabelElementProps, type FormLang, type FormProps, type FormRule, type FormRules, type InferFormRulesOptions, type OnError, OptionalWrapper, type OptionalWrapperProps, createSplittingContext, equal, faas, getClient, useConstant, useEqualCallback, useEqualEffect, useEqualMemo, useEqualMemoize, useFaas, type useFaasOptions, useFormContext, usePrevious, useSplittingState, validValues, withFaasData };

package/dist/index.d.ts

@@ -2,6 +2,7 @@ import { FaasAction, FaasData, FaasParams } from '@faasjs/types';
 export { FaasAction, FaasData, FaasParams } from '@faasjs/types';
 import { Response, BaseUrl, ResponseError, Options, FaasBrowserClient } from '@faasjs/browser';
 export { Options, Response, ResponseError, ResponseHeaders } from '@faasjs/browser';
+import * as react from 'react';
 import { ReactNode, Dispatch, SetStateAction, ReactElement, Component, ComponentType, ComponentProps, JSXElementConstructor } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
@@ -56,6 +57,14 @@ declare function useEqualMemo<T>(callback: () => T, dependencies: any[]): T;
  * @returns The result of the `useCallback` hook with memoized dependencies.
  */
 declare function useEqualCallback<T extends (...args: any[]) => any>(callback: T, dependencies: any[]): T;
+/**
+ * Hook to store the previous value of a state or prop.
+ *
+ * @template T - The type of the value.
+ * @param {T} value - The current value to be stored.
+ * @returns {T | undefined} - The previous value, or undefined if there is no previous value.
+ */
+declare function usePrevious<T>(value: T): T | undefined;
 
 /**
  * Creates a splitting context with the given default value.
@@ -123,7 +132,7 @@ declare function createSplittingContext<T extends Record<string, any>>(defaultVa
      * ```
      */
     Provider<NewT extends T = T>(props: {
-        value?: NewT;
+        value?: Partial<NewT>;
         children: ReactNode;
         /**
          * Whether to use memoization for the children.
@@ -134,6 +143,20 @@ declare function createSplittingContext<T extends Record<string, any>>(defaultVa
          * `any[]`: memoize the children with specific dependencies.
          */
         memo?: true | any[];
+        /**
+         * An object containing initial values that will be automatically converted into state variables using {@link useSplittingState} hook. Each property will create both a state value and its setter following the pattern: value/setValue.
+         *
+         * @example
+         * ```tsx
+         * <Provider
+         *  initializeStates={{
+         *    value: 0,
+         *  }}
+         * >
+         *   // Children will have access to: value, setValue
+         * </Provider>
+         */
+        initializeStates?: Partial<NewT>;
     }): ReactNode;
     /**
      * The hook to use the splitting context.
@@ -152,7 +175,7 @@ declare function createSplittingContext<T extends Record<string, any>>(defaultVa
     use: <NewT extends T = T>() => Readonly<NewT>;
 };
 
-type SetPrefix<S extends string | number | symbol> = S extends string ? (S extends `${infer First}${infer Rest}` ? `set${Capitalize<First>}${Rest}` : never) : never;
+type SetPrefix<S extends string | number | symbol> = S extends string ? S extends `${infer First}${infer Rest}` ? `set${Capitalize<First>}${Rest}` : never : never;
 type StateSetters<T> = {
     [K in keyof T as SetPrefix<K>]: Dispatch<SetStateAction<T[K]>>;
 };
@@ -211,6 +234,7 @@ type FaasDataWrapperProps<PathOrData extends FaasAction> = {
 };
 declare function FaasDataWrapper<PathOrData extends FaasAction>(props: FaasDataWrapperProps<PathOrData>): JSX.Element;
 declare namespace FaasDataWrapper {
+    var displayName: string;
     var whyDidYouRender: boolean;
 }
 /**
@@ -262,6 +286,14 @@ type FaasReactClientOptions = {
     /** @default `/` */
     baseUrl?: BaseUrl;
     options?: Options;
+    /**
+     * @example
+     * ```ts
+     * onError: (action, params) => async (res) => {
+     *   console.error(action, params, res)
+     * }
+     * ```
+     */
     onError?: OnError;
 };
 type FaasReactClientInstance = {
@@ -335,6 +367,7 @@ declare class ErrorBoundary extends Component<ErrorBoundaryProps, {
         componentStack?: string;
     };
 }> {
+    static displayName: string;
     static whyDidYouRender: boolean;
     constructor(props: ErrorBoundaryProps);
     componentDidCatch(error: Error | null, info: any): void;
@@ -371,64 +404,123 @@ declare const OptionalWrapper: React.FC<OptionalWrapperProps> & {
     whyDidYouRender: boolean;
 };
 
-type FormRules = {
-    type?: 'string' | 'number';
-    required?: boolean;
+type FormButtonElementProps = {
+    children?: React.ReactNode;
+    disabled: boolean;
+    submit: () => Promise<void>;
 };
 
-type FormInputComponentProps = {
+type FormInputElementProps = {
     name: string;
     value: any;
     onChange: (value: any) => void;
 };
-type FormInputComponent<Extra extends Record<string, any> = Record<string, any>> = ComponentType<FormInputComponentProps & Extra>;
-type InferFormInputProps<T extends FormInputComponent | JSXElementConstructor<any>> = T extends FormInputComponent ? Omit<ComponentProps<T>, 'name' | 'value' | 'onChange'> : Omit<ComponentProps<T>, 'name' | 'value'>;
-type FormInputProps<FormElements extends FormElementTypes = FormElementTypes> = {
-    Input: FormInputComponent;
-} | {
-    type?: 'input';
-    props?: InferFormInputProps<FormElements['input']>;
-} | {
-    type: 'select';
-    props?: InferFormInputProps<FormElements['select']>;
-};
 
-type FormLabelProps<FormElements extends FormElementTypes = FormElementTypes> = {
+type FormLabelElementProps = {
     name: string;
-    rules?: FormRules;
-    label?: {
-        title?: ReactNode;
-        description?: ReactNode;
-        Label?: React.ComponentType<FormLabelProps>;
-    };
-    input?: FormInputProps<FormElements>;
+    title?: ReactNode;
+    description?: ReactNode;
+    error?: Error;
+    /** as Input element */
+    children: ReactNode;
 };
 
-type FormButtonProps = {
-    children?: React.ReactNode;
-    disabled?: boolean;
-    onClick?: () => void;
+type FormElementTypes = {
+    Label: ComponentType<FormLabelElementProps>;
+    Input: ComponentType<FormInputElementProps>;
+    Button: ComponentType<FormButtonElementProps>;
 };
+declare const FormDefaultElements: FormElementTypes;
 
-type FormSelectOption = {
-    value: string | number;
-    label: string;
+declare const FormDefaultLang: {
+    submit: string;
+    required: string;
+    string: string;
+    number: string;
 };
-type FormElementTypes = {
-    label: ComponentType<FormLabelProps>;
-    input: FormInputComponent;
-    select: FormInputComponent<{
-        options?: FormSelectOption[];
-    }>;
-    button: ComponentType<FormButtonProps>;
+type FormLang = typeof FormDefaultLang;
+
+type FormRule<Options = any> = (value: any, options?: Options, lang?: FormLang) => Promise<void>;
+type InferRuleOption<T> = T extends (value: any, options: infer O, lang?: FormLang) => Promise<void> ? O : never;
+type FormRules = Record<string, FormRule>;
+type InferFormRulesOptions<T> = {
+    [K in keyof T]: InferRuleOption<T[K]>;
+};
+declare const FormDefaultRules: FormRules;
+type FormDefaultRulesOptions = InferFormRulesOptions<typeof FormDefaultRules>;
+declare function validValues(rules: FormRules, items: FormItemProps[], values: Record<string, any>, lang: FormLang): Promise<Record<string, Error>>;
+
+type InferFormInputProps<T extends ComponentType<FormInputElementProps> | JSXElementConstructor<any>> = T extends ComponentType<FormInputElementProps> ? Omit<ComponentProps<T>, 'name' | 'value' | 'onChange'> : Omit<ComponentProps<T>, 'name' | 'value'>;
+type FormInputProps<FormElements extends FormElementTypes = FormElementTypes> = {
+    Input?: ComponentType<FormInputElementProps>;
+    props?: InferFormInputProps<FormElements['Input']>;
 };
 
-type FormProps<Values extends Record<string, any> = Record<string, any>, FormElements extends FormElementTypes = FormElementTypes> = {
-    items: FormLabelProps<FormElements>[];
+type FormItemName = string;
+type FormItemProps<FormElements extends FormElementTypes = FormElementTypes, FormRulesOptions extends Record<string, any> = FormDefaultRulesOptions> = {
+    name: FormItemName;
+    label?: Omit<FormLabelElementProps, 'name' | 'children'> & {
+        Label?: ComponentType<FormLabelElementProps>;
+    };
+    input?: FormInputProps<FormElements>;
+    rules?: FormRulesOptions;
+};
+declare function FormItem(props: FormItemProps): react_jsx_runtime.JSX.Element;
+declare namespace FormItem {
+    var displayName: string;
+    var whyDidYouRender: boolean;
+}
+
+type FormProps<Values extends Record<string, any> = Record<string, any>, FormElements extends FormElementTypes = FormElementTypes, Rules extends FormRules = typeof FormDefaultRules> = {
+    items: FormItemProps<FormElements, InferFormRulesOptions<Rules>>[];
     onSubmit?: (values: Values) => Promise<void>;
-    elements?: FormElements;
+    Elements?: Partial<FormElements>;
+    lang?: Partial<FormLang>;
     defaultValues?: Values;
+    rules?: typeof FormDefaultRules & Rules;
+};
+/**
+ * FormContainer component is a wrapper that provides context and state management for form elements.
+ * It initializes form states such as values, errors, submitting status, elements, language, and rules.
+ *
+ * @template Values - The type of form values, defaults to Record<string, any>.
+ * @template FormElements - The type of form elements, defaults to FormElementTypes.
+ * @template Rules - The type of form rules, defaults to FormDefaultRules.
+ *
+ * @param {FormProps<Values, FormElements, Rules>} props - The properties for the FormContainer component.
+ * @param {Values} props.defaultValues - The default values for the form fields.
+ * @param {FormElements} props.Elements - The form elements to be used in the form.
+ * @param {Rules} props.rules - The validation rules for the form fields.
+ * @param {FormLang} props.lang - The language settings for the form.
+ * @param {Partial<FormContextProps>} props - Additional properties for the form context.
+ *
+ * @returns {JSX.Element} The FormContainer component.
+ */
+declare function FormContainer<Values extends Record<string, any> = Record<string, any>, FormElements extends FormElementTypes = FormElementTypes, Rules extends FormRules = typeof FormDefaultRules>({ defaultValues, Elements, rules, lang, ...props }: FormProps<Values, FormElements, Rules>): react_jsx_runtime.JSX.Element;
+declare namespace FormContainer {
+    var displayName: string;
+    var whyDidYouRender: boolean;
+}
+
+type FormContextProps<Values extends Record<string, any> = Record<string, any>, Rules extends FormRules = typeof FormDefaultRules> = {
+    items: FormLabelElementProps[];
+    onSubmit: (values: Values) => Promise<void>;
+    Elements: FormElementTypes;
+    lang: FormLang;
+    rules: typeof FormDefaultRules & Rules;
+    submitting: boolean;
+    setSubmitting: Dispatch<SetStateAction<boolean>>;
+    values: Values;
+    setValues: Dispatch<SetStateAction<Values>>;
+    errors: Record<string, Error>;
+    setErrors: Dispatch<SetStateAction<Record<string, Error>>>;
 };
-declare function FormContainer<Values extends Record<string, any> = Record<string, any>, FormElements extends FormElementTypes = FormElementTypes>({ defaultValues, elements, ...props }: FormProps<Values, FormElements>): react_jsx_runtime.JSX.Element;
+declare const FormContextProvider: <NewT extends FormContextProps<Record<string, any>, FormRules> = FormContextProps<Record<string, any>, FormRules>>(props: {
+    value?: Partial<NewT>;
+    children: react.ReactNode;
+    memo?: true | any[];
+    initializeStates?: Partial<NewT>;
+}) => react.ReactNode;
+declare const useFormContext: <NewT extends FormContextProps<Record<string, any>, FormRules> = FormContextProps<Record<string, any>, FormRules>>() => Readonly<NewT>;
 
-export { ErrorBoundary, type ErrorBoundaryProps, type ErrorChildrenProps, type FaasDataInjection, FaasDataWrapper, type FaasDataWrapperProps, FaasReactClient, type FaasReactClientInstance, type FaasReactClientOptions, FormContainer as Form, type OnError, OptionalWrapper, type OptionalWrapperProps, createSplittingContext, equal, faas, getClient, useConstant, useEqualCallback, useEqualEffect, useEqualMemo, useEqualMemoize, useFaas, type useFaasOptions, useSplittingState, withFaasData };
+export { ErrorBoundary, type ErrorBoundaryProps, type ErrorChildrenProps, type FaasDataInjection, FaasDataWrapper, type FaasDataWrapperProps, FaasReactClient, type FaasReactClientInstance, type FaasReactClientOptions, FormContainer as Form, type FormButtonElementProps, type FormContextProps, FormContextProvider, FormDefaultElements, FormDefaultLang, FormDefaultRules, type FormDefaultRulesOptions, type FormElementTypes, type FormInputElementProps, FormItem, type FormItemName, type FormItemProps, type FormLabelElementProps, type FormLang, type FormProps, type FormRule, type FormRules, type InferFormRulesOptions, type OnError, OptionalWrapper, type OptionalWrapperProps, createSplittingContext, equal, faas, getClient, useConstant, useEqualCallback, useEqualEffect, useEqualMemo, useEqualMemoize, useFaas, type useFaasOptions, useFormContext, usePrevious, useSplittingState, validValues, withFaasData };