@saas-ui/forms 2.0.0-next.14 → 2.0.0-next.16

package/dist/index.d.ts

@@ -1,36 +1,13 @@
 import * as React$1 from 'react';
 import React__default from 'react';
-import * as _chakra_ui_system_dist_system_types from '@chakra-ui/system/dist/system.types';
-import { ButtonProps, NumberInputProps as NumberInputProps$1, InputProps, RadioProps, RadioGroupProps, SystemProps, StackDirection, MenuProps, MenuListProps, MenuItemOptionProps, SelectProps as SelectProps$1, TextareaProps, SwitchProps, CheckboxProps, UsePinInputProps, FormControlProps, SimpleGridProps, ResponsiveValue, FormLabelProps, HTMLChakraProps, ThemingProps } from '@chakra-ui/react';
-import { FocusableElement } from '@chakra-ui/utils';
 import * as react_hook_form from 'react-hook-form';
 import { FieldValues, FieldPath, RegisterOptions, UseFormReturn as UseFormReturn$1, UseFieldArrayReturn, UseFormProps, WatchObserver, SubmitHandler, SubmitErrorHandler, ResolverOptions, ResolverResult, FormProviderProps as FormProviderProps$1 } from 'react-hook-form';
 export { BatchFieldArrayUpdate, ChangeHandler, Control, Controller, ControllerFieldState, ControllerProps, ControllerRenderProps, CriteriaMode, CustomElement, DeepMap, DeepPartial, DeepPartialSkipArrayKey, DefaultValues, DelayCallback, EmptyObject, ErrorOption, EventType, FieldArray, FieldArrayMethodProps, FieldArrayWithId, Field as FieldDef, FieldElement, FieldError, FieldErrors, FieldName, FieldNamesMarkedBoolean, FieldRefs, FieldValue, FieldValues, FormProviderProps, FormState, FormStateProxy, FormStateSubjectRef, GetIsDirty, InternalFieldErrors, InternalFieldName, InternalNameSet, IsAny, IsFlatObject, KeepStateOptions, LiteralUnion, Message, Mode, MultipleFieldErrors, Names, NativeFieldValue, NestedValue, NonUndefined, Noop, Primitive, ReadFormState, Ref, RefCallBack, RegisterOptions, Resolver, ResolverError, ResolverOptions, ResolverResult, ResolverSuccess, SetFieldValue, SetValueConfig, Subjects, SubmitErrorHandler, SubmitHandler, TriggerConfig, UnpackNestedValue, UseControllerProps, UseControllerReturn, UseFieldArrayProps, UseFieldArrayReturn, UseFormClearErrors, UseFormGetValues, UseFormHandleSubmit, UseFormProps, UseFormRegister, UseFormRegisterReturn, UseFormReset, UseFormResetField, UseFormReturn, UseFormSetError, UseFormSetFocus, UseFormSetValue, UseFormStateProps, UseFormStateReturn, UseFormTrigger, UseFormUnregister, UseFormWatch, UseWatchProps, Validate, ValidateResult, ValidationMode, ValidationRule, ValidationValue, ValidationValueMessage, WatchInternal, WatchObserver, appendErrors, useController, useFieldArray, useForm, useFormState, useWatch } from 'react-hook-form';
 import { MaybeRenderProp } from '@chakra-ui/react-utils';
 import { UseStepperReturn, UseStepperProps, StepperStepsProps } from '@saas-ui/core';
-
-interface SubmitButtonProps extends ButtonProps {
-    /**
-     * Disable the submit button if the form is untouched.
-     *
-     * Change the default behavior by updating
-     * `SubmitButton.defaultProps.disableIfUntouched`
-     */
-    disableIfUntouched?: boolean;
-    /**
-     * Disable the submit button if the form is invalid.
-     *
-     * Change the default behavior by updating
-     * `SubmitButton.defaultProps.disableIfInvalid`
-     */
-    disableIfInvalid?: boolean;
-}
-/**
- * A button with type submit and default color scheme primary and isLoading state when the form is submitting.
- *
- * @see Docs https://saas-ui.dev/docs/components/forms/form
- */
-declare const SubmitButton: _chakra_ui_system_dist_system_types.ComponentWithAs<"button", SubmitButtonProps>;
+import { NumberInputProps as NumberInputProps$1, InputProps, RadioProps, RadioGroupProps, SystemProps, StackDirection, MenuProps, ButtonProps, MenuListProps, MenuItemOptionProps, SelectProps as SelectProps$1, TextareaProps, SwitchProps, CheckboxProps, UsePinInputProps, FormControlProps, SimpleGridProps, ResponsiveValue, FormLabelProps, HTMLChakraProps, ThemingProps } from '@chakra-ui/react';
+import { FocusableElement } from '@chakra-ui/utils';
+import * as _chakra_ui_system_dist_system_types from '@chakra-ui/system/dist/system.types';
 
 interface NumberInputOptions {
     /**
@@ -197,6 +174,29 @@ declare const defaultFieldTypes: {
 };
 type DefaultFields = typeof defaultFieldTypes;
 
+interface SubmitButtonProps extends ButtonProps {
+    /**
+     * Disable the submit button if the form is untouched.
+     *
+     * Change the default behavior by updating
+     * `SubmitButton.defaultProps.disableIfUntouched`
+     */
+    disableIfUntouched?: boolean;
+    /**
+     * Disable the submit button if the form is invalid.
+     *
+     * Change the default behavior by updating
+     * `SubmitButton.defaultProps.disableIfInvalid`
+     */
+    disableIfInvalid?: boolean;
+}
+/**
+ * A button with type submit and default color scheme primary and isLoading state when the form is submitting.
+ *
+ * @see Docs https://saas-ui.dev/docs/components/forms/form
+ */
+declare const SubmitButton: _chakra_ui_system_dist_system_types.ComponentWithAs<"button", SubmitButtonProps>;
+
 type FieldOption = {
     label?: string;
     value: string;
@@ -256,11 +256,11 @@ type DefaultFieldOverrides = {
 type FieldOverrides<FieldDefs, TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = {
     [K in FieldPathWithArray<TFieldValues, TName>]?: Omit<MergeFieldProps<FieldDefs extends never ? DefaultFields : ShallowMerge<DefaultFields, FieldDefs>, TFieldValues>, 'name'>;
 };
-type WithFields<TFormProps extends FormProps<any, any, any, any>, FieldDefs> = TFormProps extends FormProps<infer TFieldValues, infer TContext> ? Omit<TFormProps, 'children' | 'fields'> & {
+type WithFields<TFormProps extends FormProps<any, any, any, any>, FieldDefs, ExtraOverrides = object> = TFormProps extends FormProps<infer TFieldValues, infer TContext> ? Omit<TFormProps, 'children' | 'fields'> & {
     children?: FormChildren<FieldDefs, TFieldValues, TContext>;
     fields?: FieldOverrides<FieldDefs, TFieldValues> & {
         submit?: SubmitButtonProps;
-    };
+    } & ExtraOverrides;
 } : never;
 
 type FieldResolver = {
@@ -522,7 +522,7 @@ interface FormRenderContext<TFieldValues extends FieldValues = FieldValues, TCon
     ArrayField: React$1.FC<ArrayFieldProps<TFieldValues> & React$1.RefAttributes<UseArrayFieldReturn>>;
     ObjectField: React$1.FC<ObjectFieldProps<TFieldValues>>;
 }
-interface FormOptions<TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TSchema = any, TFieldTypes = FieldProps<TFieldValues>> {
+interface FormOptions<TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TSchema = unknown, TFieldTypes = FieldProps<TFieldValues>> {
     /**
      * The form schema.
      */
@@ -556,19 +556,76 @@ interface FormOptions<TFieldValues extends FieldValues = FieldValues, TContext e
      */
     fields?: DefaultFieldOverrides;
 }
-interface FormProps<TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TSchema = any, TFieldTypes = FieldProps<TFieldValues>> extends UseFormProps<TFieldValues, TContext>, Omit<HTMLChakraProps<'form'>, 'children' | 'onChange' | 'onSubmit' | 'onError'>, FormOptions<TFieldValues, TContext, TSchema, TFieldTypes> {
+interface FormProps<TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TSchema = unknown, TFieldTypes = FieldProps<TFieldValues>> extends UseFormProps<TFieldValues, TContext>, Omit<HTMLChakraProps<'form'>, 'children' | 'onChange' | 'onSubmit' | 'onError'>, FormOptions<TFieldValues, TContext, TSchema, TFieldTypes> {
 }
 /**
  * The wrapper component provides context, state, and focus management.
  *
  * @see Docs https://saas-ui.dev/docs/components/forms/form
  */
-declare const Form$1: (<TFieldValues extends FieldValues, TContext extends object = object, TSchema = any, TFieldTypes = FieldProps<TFieldValues>>(props: FormProps<TFieldValues, TContext, TSchema, TFieldTypes> & {
-    ref?: React$1.ForwardedRef<HTMLFormElement> | undefined;
+declare const Form$1: FormComponent;
+type FormComponent = (<TFieldValues extends FieldValues, TContext extends object = object, TSchema = unknown, TFieldTypes = FieldProps<TFieldValues>>(props: FormProps<TFieldValues, TContext, TSchema, TFieldTypes> & {
+    ref?: React$1.ForwardedRef<HTMLFormElement>;
 }) => React$1.ReactElement) & {
-    displayName?: string | undefined;
+    displayName?: string;
 };
-type GetResolver = <TFieldValues extends FieldValues, TContext extends object>(schema: any) => (values: TFieldValues, context: TContext | undefined, options: ResolverOptions<TFieldValues>) => Promise<ResolverResult<TFieldValues>>;
+type GetResolver = <TFieldValues extends FieldValues, TContext extends object>(schema: unknown) => (values: TFieldValues, context: TContext | undefined, options: ResolverOptions<TFieldValues>) => Promise<ResolverResult<TFieldValues>>;
+
+interface StepState {
+    name: string;
+    schema?: any;
+    resolver?: any;
+    isActive?: boolean;
+    isCompleted?: boolean;
+    onSubmit?: FormStepSubmitHandler;
+}
+type FormStepSubmitHandler<TFieldValues extends FieldValues = FieldValues> = (data: TFieldValues, stepper: UseStepperReturn) => Promise<void>;
+interface StepFormContext extends UseStepperReturn {
+    updateStep(state: StepState): void;
+    steps: Record<string, StepState>;
+}
+declare const StepFormProvider: React$1.Provider<StepFormContext>;
+declare const useStepFormContext: () => StepFormContext;
+
+interface StepFormRenderContext<TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TFieldTypes = FieldProps<TFieldValues>> extends UseStepFormReturn<TFieldValues> {
+    Field: React$1.FC<TFieldTypes & React$1.RefAttributes<FocusableElement>>;
+    DisplayIf: React$1.FC<DisplayIfProps<TFieldValues>>;
+    ArrayField: React$1.FC<ArrayFieldProps<TFieldValues> & React$1.RefAttributes<UseArrayFieldReturn>>;
+    ObjectField: React$1.FC<ObjectFieldProps<TFieldValues>>;
+}
+interface UseStepFormProps<TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TFieldTypes = FieldProps<TFieldValues>> extends Omit<UseStepperProps, 'onChange'>, Omit<FormProps<TFieldValues, TContext, any, TFieldTypes>, 'children'> {
+    children: MaybeRenderProp<StepFormRenderContext<TFieldValues, TContext, TFieldTypes>>;
+}
+interface UseStepFormReturn<TFieldValues extends FieldValues = FieldValues> extends UseStepperReturn {
+    getFormProps(): {
+        onSubmit: SubmitHandler<TFieldValues>;
+        schema?: any;
+        resolver?: any;
+    };
+    updateStep(step: any): void;
+    steps: Record<string, any>;
+}
+declare function useStepForm<TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TFieldTypes = FieldProps<TFieldValues>>(props: UseStepFormProps<TFieldValues, TContext, TFieldTypes>): UseStepFormReturn<TFieldValues>;
+interface UseFormStepProps {
+    name: string;
+    schema?: any;
+    resolver?: any;
+    onSubmit?: FormStepSubmitHandler;
+}
+declare function useFormStep(props: UseFormStepProps): StepState;
+
+interface CreateFormProps<FieldDefs> {
+    resolver?: GetResolver;
+    fieldResolver?: GetFieldResolver;
+    fields?: FieldDefs extends Record<string, React__default.FC<any>> ? FieldDefs : never;
+}
+type FormType<FieldDefs, ExtraProps = object, ExtraOverrides = object> = (<TFieldValues extends FieldValues, TContext extends object = object, TSchema = unknown>(props: WithFields<FormProps<TFieldValues, TContext, TSchema>, FieldDefs, ExtraOverrides> & {
+    ref?: React__default.ForwardedRef<HTMLFormElement>;
+} & ExtraProps) => React__default.ReactElement) & {
+    displayName?: string;
+    id?: string;
+};
+declare function createForm<FieldDefs>({ resolver, fieldResolver, fields, }?: CreateFormProps<FieldDefs>): FormType<FieldDefs, object, object>;
 
 interface DisplayFieldProps extends FormControlProps, Omit<FieldProps, 'type' | 'label'> {
 }
@@ -617,53 +674,8 @@ declare const FieldsProvider: React__default.FC<{
 }>;
 declare const useField: (type: string) => React__default.FC<any>;
 
-interface StepState {
-    name: string;
-    schema?: any;
-    resolver?: any;
-    isActive?: boolean;
-    isCompleted?: boolean;
-    onSubmit?: FormStepSubmitHandler;
-}
-type FormStepSubmitHandler<TFieldValues extends FieldValues = FieldValues> = (data: TFieldValues, stepper: UseStepperReturn) => Promise<void>;
-interface StepFormContext extends UseStepperReturn {
-    updateStep(state: StepState): void;
-    steps: Record<string, StepState>;
-}
-declare const StepFormProvider: React$1.Provider<StepFormContext>;
-declare const useStepFormContext: () => StepFormContext;
-
-interface UseStepFormProps<TFieldValues extends FieldValues = FieldValues> extends Omit<UseStepperProps, 'onChange'>, Omit<FormProps<TFieldValues>, 'children'> {
-    children: MaybeRenderProp<UseStepFormReturn<TFieldValues>>;
+interface StepFormProps<TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TFieldTypes = FieldProps<TFieldValues>> extends UseStepFormProps<TFieldValues, TContext, TFieldTypes> {
 }
-interface UseStepFormReturn<TFieldValues extends FieldValues = FieldValues> extends UseStepperReturn {
-    getFormProps(): {
-        onSubmit: SubmitHandler<TFieldValues>;
-        schema?: any;
-        resolver?: any;
-    };
-    updateStep(step: any): void;
-    steps: Record<string, any>;
-}
-declare function useStepForm<TFieldValues extends FieldValues = FieldValues>(props: UseStepFormProps<TFieldValues>): UseStepFormReturn<TFieldValues>;
-interface UseFormStepProps {
-    name: string;
-    schema?: any;
-    resolver?: any;
-    onSubmit?: FormStepSubmitHandler;
-}
-declare function useFormStep(props: UseFormStepProps): StepState;
-
-interface StepFormProps<TFieldValues extends FieldValues = FieldValues, TContext extends object = object> extends UseStepFormProps<TFieldValues> {
-}
-/**
- * The wrapper component provides context, state, and focus management.
- *
- * @see Docs https://saas-ui.dev/docs/components/forms/step-form
- */
-declare const StepForm: <TFieldValues extends FieldValues>(props: StepFormProps<TFieldValues, object> & {
-    ref?: React$1.ForwardedRef<HTMLFormElement> | undefined;
-}) => React$1.ReactElement;
 interface FormStepOptions {
     /**
      * The step name
@@ -762,22 +774,6 @@ declare const InputRightButton: _chakra_ui_system_dist_system_types.ComponentWit
  */
 declare const BaseField: React$1.FC<BaseFieldProps>;
 
-interface CreateFormProps<FieldDefs> {
-    resolver?: GetResolver;
-    fieldResolver?: GetFieldResolver;
-    fields?: FieldDefs extends Record<string, React__default.FC<any>> ? FieldDefs : never;
-}
-declare function createForm<FieldDefs, Schema = any>({ resolver, fieldResolver, fields, }?: CreateFormProps<FieldDefs>): (<TFieldValues extends FieldValues, TContext extends object = object, TSchema extends Schema = Schema>(props: Omit<FormProps<TFieldValues, TContext, TSchema, FieldProps<TFieldValues>>, "children" | "fields"> & {
-    children?: FormChildren<FieldDefs, TFieldValues, TContext>;
-    fields?: (FieldOverrides<FieldDefs, TFieldValues, react_hook_form.Path<TFieldValues>> & {
-        submit?: SubmitButtonProps | undefined;
-    }) | undefined;
-} & {
-    ref?: React__default.ForwardedRef<HTMLFormElement> | undefined;
-}) => React__default.ReactElement) & {
-    displayName?: string | undefined;
-};
-
 interface CreateFieldOptions {
     isControlled?: boolean;
     hideLabel?: boolean;
@@ -793,15 +789,17 @@ interface CreateFieldOptions {
  */
 declare const createField: <TProps extends object>(component: React$1.FC<TProps>, options?: CreateFieldOptions) => React$1.FC<TProps & BaseFieldProps<react_hook_form.FieldValues, string>>;
 
-declare const Form: (<TFieldValues extends react_hook_form.FieldValues, TContext extends object = object, TSchema extends any = any>(props: Omit<FormProps<TFieldValues, TContext, TSchema, FieldProps<TFieldValues>>, "children" | "fields"> & {
-    children?: FormChildren<unknown, TFieldValues, TContext>;
-    fields?: (FieldOverrides<unknown, TFieldValues, react_hook_form.Path<TFieldValues>> & {
-        submit?: SubmitButtonProps | undefined;
-    }) | undefined;
-} & {
+declare const Form: FormType<unknown, object, object>;
+/**
+ * The wrapper component provides context, state, and focus management.
+ *
+ * @see Docs https://saas-ui.dev/docs/components/forms/step-form
+ */
+declare const StepForm: (<TFieldValues extends react_hook_form.FieldValues = react_hook_form.FieldValues, TContext extends object = object, TFieldTypes = FieldProps<TFieldValues>>(props: UseStepFormProps<TFieldValues, TContext, TFieldTypes> & {
     ref?: React$1.ForwardedRef<HTMLFormElement> | undefined;
 }) => React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>>) & {
     displayName?: string | undefined;
+    id?: string | undefined;
 };
 
-export { ArrayField, ArrayFieldAddButton, ArrayFieldButtonProps, ArrayFieldContainer, ArrayFieldContainerProps, ArrayFieldOptions, ArrayFieldProps, ArrayFieldProvider, ArrayFieldRemoveButton, ArrayFieldRow, ArrayFieldRowContainer, ArrayFieldRowFields, ArrayFieldRowFieldsProps, ArrayFieldRowProvider, ArrayFieldRows, ArrayFieldRowsProps, AutoFields, BaseField, BaseFieldProps, Form$1 as BaseForm, CheckboxField, CreateFieldOptions, CreateFormProps, DefaultFields, DisplayField, DisplayFieldProps, DisplayIf, DisplayIfProps, Field, FieldOptions, FieldProps, FieldResolver, FieldRules, FieldsProps, FieldsProvider, Form, FormLayout, FormLayoutProps, FormLegend, FormProps, FormProvider, FormRenderContext, FormStep, FormStepOptions, FormStepProps, FormStepSubmitHandler, FormStepper, FormStepperProps, FormValue, GetFieldResolver, InputField, InputFieldProps, InputRightButton, InputRightButtonProps, NativeSelect, NativeSelectField, NativeSelectProps, NextButton, NextButtonProps, NumberInputField, NumberInputFieldProps, ObjectField, ObjectFieldProps, ObjectSchema, Option, PasswordInput, PasswordInputField, PasswordInputProps, PinField, PinFieldProps, PrevButton, RadioField, RadioInput, RadioInputProps, RadioOption, RadioOptions, Select, SelectButton, SelectButtonProps, SelectField, SelectList, SelectListProps, SelectOption, SelectProps, StepForm, StepFormContext, StepFormProps, StepFormProvider, StepState, SubmitButton, SubmitButtonProps, SwitchField, TextareaField, UseArrayFieldReturn, UseArrayFieldRowProps, UseArrayFieldRowReturn, UseFormStepProps, UseStepFormProps, UseStepFormReturn, WatchField, WatchFieldProps, WithFields, createField, createForm, defaultFieldTypes, objectFieldResolver, useArrayField, useArrayFieldAddButton, useArrayFieldContext, useArrayFieldRemoveButton, useArrayFieldRow, useArrayFieldRowContext, useField, useFormContext, useFormStep, useStepForm, useStepFormContext };
+export { ArrayField, ArrayFieldAddButton, ArrayFieldButtonProps, ArrayFieldContainer, ArrayFieldContainerProps, ArrayFieldOptions, ArrayFieldProps, ArrayFieldProvider, ArrayFieldRemoveButton, ArrayFieldRow, ArrayFieldRowContainer, ArrayFieldRowFields, ArrayFieldRowFieldsProps, ArrayFieldRowProvider, ArrayFieldRows, ArrayFieldRowsProps, AutoFields, BaseField, BaseFieldProps, Form$1 as BaseForm, CheckboxField, CreateFieldOptions, CreateFormProps, DefaultFieldOverrides, DefaultFields, DisplayField, DisplayFieldProps, DisplayIf, DisplayIfProps, Field, FieldOptions, FieldProps, FieldResolver, FieldRules, FieldsProps, FieldsProvider, Form, FormComponent, FormLayout, FormLayoutProps, FormLegend, FormProps, FormProvider, FormRenderContext, FormStep, FormStepOptions, FormStepProps, FormStepSubmitHandler, FormStepper, FormStepperProps, FormType, FormValue, GetFieldResolver, InputField, InputFieldProps, InputRightButton, InputRightButtonProps, NativeSelect, NativeSelectField, NativeSelectProps, NextButton, NextButtonProps, NumberInputField, NumberInputFieldProps, ObjectField, ObjectFieldProps, ObjectSchema, Option, PasswordInput, PasswordInputField, PasswordInputProps, PinField, PinFieldProps, PrevButton, RadioField, RadioInput, RadioInputProps, RadioOption, RadioOptions, Select, SelectButton, SelectButtonProps, SelectField, SelectList, SelectListProps, SelectOption, SelectProps, StepForm, StepFormContext, StepFormProps, StepFormProvider, StepState, SubmitButton, SubmitButtonProps, SwitchField, TextareaField, UseArrayFieldReturn, UseArrayFieldRowProps, UseArrayFieldRowReturn, UseFormStepProps, UseStepFormProps, UseStepFormReturn, WatchField, WatchFieldProps, WithFields, createField, createForm, defaultFieldTypes, objectFieldResolver, useArrayField, useArrayFieldAddButton, useArrayFieldContext, useArrayFieldRemoveButton, useArrayFieldRow, useArrayFieldRowContext, useField, useFormContext, useFormStep, useStepForm, useStepFormContext };