@rachelallyson/hero-hook-form 1.0.0 → 1.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -25,26 +25,45 @@ Build beautiful, accessible forms with full TypeScript support, validation, and
25
25
 
26
26
  ## 🚀 Quick Start
27
27
 
28
+ ### Option 1: All-in-One HeroUI Package (Recommended for Development)
29
+
30
+ ```bash
31
+ npm install @rachelallyson/hero-hook-form @heroui/react react-hook-form zod
32
+ ```
33
+
34
+ ### Option 2: Individual HeroUI Packages (Recommended for Production)
35
+
28
36
  ```bash
29
- npm install @rachelallyson/hero-hook-form react-hook-form @heroui/react
37
+ npm install @rachelallyson/hero-hook-form react-hook-form zod
38
+ npm install @heroui/button @heroui/input @heroui/select # Only what you need
30
39
  ```
31
40
 
41
+ ### Basic Usage
42
+
32
43
  ```tsx
33
- import { useForm } from "react-hook-form";
34
- import { Form, InputField, SubmitButton } from "@rachelallyson/hero-hook-form/react";
44
+ import { ZodForm } from "@rachelallyson/hero-hook-form";
45
+ import { z } from "zod";
46
+
47
+ const schema = z.object({
48
+ email: z.string().email("Invalid email"),
49
+ name: z.string().min(1, "Name is required"),
50
+ });
51
+
52
+ const config = {
53
+ schema,
54
+ fields: [
55
+ { name: "name", type: "input", label: "Name" },
56
+ { name: "email", type: "input", label: "Email", inputProps: { type: "email" } },
57
+ ],
58
+ };
35
59
 
36
60
  export function ContactForm() {
37
- const methods = useForm();
38
-
39
- return (
40
- <Form methods={methods} onSubmit={console.log}>
41
- <InputField control={methods.control} label="Email" name="email" />
42
- <SubmitButton>Send</SubmitButton>
43
- </Form>
44
- );
61
+ return <ZodForm config={config} onSubmit={console.log} />;
45
62
  }
46
63
  ```
47
64
 
65
+ > 📚 **See [Installation Guide](./docs/installation.md) for detailed setup instructions and bundle optimization tips.**
66
+
48
67
  ## 📊 Why Hero Hook Form?
49
68
 
50
69
  | Feature | Manual Setup | Hero Hook Form |
package/dist/index.d.ts CHANGED
@@ -1,8 +1,9 @@
1
- import React, { ComponentProps } from 'react';
1
+ import React$1, { ComponentProps } from 'react';
2
2
  import { Button } from '@heroui/react';
3
3
  import * as react_hook_form from 'react-hook-form';
4
- import { FieldValues, Path, RegisterOptions, Control, UseFormProps, SubmitHandler, UseFormReturn, UseFormSetError } from 'react-hook-form';
4
+ import { FieldValues, Path, RegisterOptions, Control, UseFormReturn, FieldErrors, UseFormProps, SubmitHandler, UseFormSetError } from 'react-hook-form';
5
5
  import * as zod from 'zod';
6
+ import { z } from 'zod';
6
7
  import * as _internationalized_date from '@internationalized/date';
7
8
  import { CalendarDate } from '@internationalized/date';
8
9
  import { Checkbox } from '@heroui/checkbox';
@@ -37,7 +38,11 @@ interface BaseFormFieldConfig<TFieldValues extends FieldValues> {
37
38
  isDisabled?: boolean;
38
39
  rules?: RegisterOptions<TFieldValues, Path<TFieldValues>>;
39
40
  condition?: (values: Partial<TFieldValues>) => boolean;
41
+ dependsOn?: Path<TFieldValues>;
42
+ dependsOnValue?: unknown;
40
43
  group?: string;
44
+ ariaLabel?: string;
45
+ ariaDescribedBy?: string;
41
46
  }
42
47
  interface StringFieldConfig<TFieldValues extends FieldValues> extends BaseFormFieldConfig<TFieldValues> {
43
48
  type: "input" | "textarea" | "select";
@@ -82,7 +87,17 @@ interface FileFieldConfig<TFieldValues extends FieldValues> extends BaseFormFiel
82
87
  multiple?: boolean;
83
88
  accept?: string;
84
89
  }
85
- type FormFieldConfig<TFieldValues extends FieldValues> = StringFieldConfig<TFieldValues> | BooleanFieldConfig<TFieldValues> | RadioFieldConfig<TFieldValues> | SliderFieldConfig<TFieldValues> | DateFieldConfig<TFieldValues> | FileFieldConfig<TFieldValues>;
90
+ interface CustomFieldConfig<TFieldValues extends FieldValues> extends BaseFormFieldConfig<TFieldValues> {
91
+ type: "custom";
92
+ render: (field: {
93
+ name: Path<TFieldValues>;
94
+ control: Control<TFieldValues>;
95
+ form: UseFormReturn<TFieldValues>;
96
+ errors: FieldErrors<TFieldValues>;
97
+ isSubmitting: boolean;
98
+ }) => React.ReactNode;
99
+ }
100
+ type FormFieldConfig<TFieldValues extends FieldValues> = StringFieldConfig<TFieldValues> | BooleanFieldConfig<TFieldValues> | RadioFieldConfig<TFieldValues> | SliderFieldConfig<TFieldValues> | DateFieldConfig<TFieldValues> | FileFieldConfig<TFieldValues> | CustomFieldConfig<TFieldValues>;
86
101
  interface FormConfig<TFieldValues extends FieldValues> {
87
102
  fields: FormFieldConfig<TFieldValues>[];
88
103
  layout?: "vertical" | "horizontal" | "grid" | "custom";
@@ -100,6 +115,16 @@ type ZodFormFieldConfig<TFieldValues extends FieldValues> = Omit<StringFieldConf
100
115
  interface ZodFormConfig<TFieldValues extends FieldValues> extends UseFormProps<TFieldValues> {
101
116
  schema?: zod.ZodSchema<TFieldValues>;
102
117
  fields: ZodFormFieldConfig<TFieldValues>[];
118
+ onError?: (errors: FieldErrors<TFieldValues>) => void;
119
+ errorDisplay?: "inline" | "toast" | "modal" | "none";
120
+ render?: (formState: {
121
+ form: UseFormReturn<TFieldValues>;
122
+ isSubmitting: boolean;
123
+ isSubmitted: boolean;
124
+ isSuccess: boolean;
125
+ errors: FieldErrors<TFieldValues>;
126
+ values: TFieldValues;
127
+ }) => React.ReactNode;
103
128
  }
104
129
  interface FormValidationError {
105
130
  message: string;
@@ -137,6 +162,33 @@ interface FieldGroup<TFieldValues extends FieldValues> {
137
162
  defaultCollapsed?: boolean;
138
163
  fields: FormFieldConfig<TFieldValues>[];
139
164
  }
165
+ interface ValidationUtils {
166
+ createMinLengthSchema: (min: number, fieldName: string) => zod.ZodString;
167
+ createMaxLengthSchema: (max: number, fieldName: string) => zod.ZodString;
168
+ createEmailSchema: () => zod.ZodString;
169
+ createRequiredSchema: (fieldName: string) => zod.ZodString;
170
+ createUrlSchema: () => zod.ZodString;
171
+ createPhoneSchema: () => zod.ZodString;
172
+ }
173
+ interface FormTestUtils<TFieldValues extends FieldValues> {
174
+ getField: (name: Path<TFieldValues>) => {
175
+ value: unknown;
176
+ error: unknown;
177
+ isDirty: boolean;
178
+ isTouched: boolean;
179
+ };
180
+ submitForm: () => Promise<void>;
181
+ resetForm: () => void;
182
+ getFormState: () => {
183
+ values: TFieldValues;
184
+ errors: FieldErrors<TFieldValues>;
185
+ isSubmitting: boolean;
186
+ isSubmitted: boolean;
187
+ isSuccess: boolean;
188
+ };
189
+ setFieldValue: (name: Path<TFieldValues>, value: unknown) => void;
190
+ triggerValidation: (name?: Path<TFieldValues>) => Promise<boolean>;
191
+ }
140
192
 
141
193
  interface FormProps$1<T extends FieldValues> {
142
194
  className?: string;
@@ -149,45 +201,45 @@ interface FormProps$1<T extends FieldValues> {
149
201
  resetButtonText?: string;
150
202
  showResetButton?: boolean;
151
203
  spacing?: "2" | "4" | "6" | "8" | "lg";
152
- submitButtonProps?: Partial<React.ComponentProps<typeof Button>>;
204
+ submitButtonProps?: Partial<React$1.ComponentProps<typeof Button>>;
153
205
  submitButtonText?: string;
154
206
  subtitle?: string;
155
207
  title?: string;
156
208
  defaultValues?: Partial<T>;
157
209
  }
158
- declare function ConfigurableForm<T extends FieldValues>({ className, columns, defaultValues, fields, layout, onError, onSubmit, onSuccess, resetButtonText, showResetButton, spacing, submitButtonProps, submitButtonText, subtitle, title, }: FormProps$1<T>): React.JSX.Element;
210
+ declare function ConfigurableForm<T extends FieldValues>({ className, columns, defaultValues, fields, layout, onError, onSubmit, onSuccess, resetButtonText, showResetButton, spacing, submitButtonProps, submitButtonText, subtitle, title, }: FormProps$1<T>): React$1.JSX.Element;
159
211
 
160
212
  interface FormFieldProps<TFieldValues extends FieldValues> {
161
213
  config: FormFieldConfig<TFieldValues>;
162
214
  form: UseFormReturn<TFieldValues>;
163
215
  submissionState: FormSubmissionState;
164
216
  }
165
- declare function FormField<TFieldValues extends FieldValues>({ config, form, submissionState, }: FormFieldProps<TFieldValues>): React.JSX.Element | null;
217
+ declare function FormField<TFieldValues extends FieldValues>({ config, form, submissionState, }: FormFieldProps<TFieldValues>): string | number | bigint | boolean | Iterable<React$1.ReactNode> | Promise<string | number | bigint | boolean | React$1.ReactPortal | React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>> | Iterable<React$1.ReactNode> | null | undefined> | React$1.JSX.Element | null | undefined;
166
218
 
167
219
  type CheckboxFieldProps<TFieldValues extends FieldValues> = FieldBaseProps<TFieldValues, boolean> & WithControl<TFieldValues> & {
168
- checkboxProps?: Omit<React.ComponentProps<typeof Checkbox>, "isSelected" | "onValueChange" | "isInvalid" | "errorMessage" | "isDisabled">;
220
+ checkboxProps?: Omit<React$1.ComponentProps<typeof Checkbox>, "isSelected" | "onValueChange" | "isInvalid" | "errorMessage" | "isDisabled">;
169
221
  };
170
- declare function CheckboxField<TFieldValues extends FieldValues>(props: CheckboxFieldProps<TFieldValues>): React.JSX.Element;
222
+ declare function CheckboxField<TFieldValues extends FieldValues>(props: CheckboxFieldProps<TFieldValues>): React$1.JSX.Element;
171
223
 
172
224
  type DateFieldProps<TFieldValues extends FieldValues> = FieldBaseProps<TFieldValues, CalendarDate | null> & WithControl<TFieldValues> & {
173
- dateProps?: Omit<React.ComponentProps<typeof DateInput>, "value" | "onChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled">;
225
+ dateProps?: Omit<React$1.ComponentProps<typeof DateInput>, "value" | "onChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled">;
174
226
  transform?: (value: CalendarDate | null) => CalendarDate | null;
175
227
  };
176
- declare function DateField<TFieldValues extends FieldValues>(props: DateFieldProps<TFieldValues>): React.JSX.Element;
228
+ declare function DateField<TFieldValues extends FieldValues>(props: DateFieldProps<TFieldValues>): React$1.JSX.Element;
177
229
 
178
230
  type FileFieldProps<TFieldValues extends FieldValues> = FieldBaseProps<TFieldValues, FileList | null> & WithControl<TFieldValues> & {
179
- fileProps?: Omit<React.ComponentProps<typeof Input>, "value" | "onValueChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled" | "type">;
231
+ fileProps?: Omit<React$1.ComponentProps<typeof Input>, "value" | "onValueChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled" | "type">;
180
232
  transform?: (value: FileList | null) => FileList | null;
181
233
  multiple?: boolean;
182
234
  accept?: string;
183
235
  };
184
- declare function FileField<TFieldValues extends FieldValues>(props: FileFieldProps<TFieldValues>): React.JSX.Element;
236
+ declare function FileField<TFieldValues extends FieldValues>(props: FileFieldProps<TFieldValues>): React$1.JSX.Element;
185
237
 
186
238
  type InputFieldProps<TFieldValues extends FieldValues> = FieldBaseProps<TFieldValues, string> & WithControl<TFieldValues> & {
187
- inputProps?: Omit<React.ComponentProps<typeof Input>, "value" | "onValueChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled">;
239
+ inputProps?: Omit<React$1.ComponentProps<typeof Input>, "value" | "onValueChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled">;
188
240
  transform?: (value: string) => string;
189
241
  };
190
- declare function InputField<TFieldValues extends FieldValues>(props: InputFieldProps<TFieldValues>): React.JSX.Element;
242
+ declare function InputField<TFieldValues extends FieldValues>(props: InputFieldProps<TFieldValues>): React$1.JSX.Element;
191
243
 
192
244
  interface RadioOption<TValue extends string | number> {
193
245
  label: string;
@@ -197,9 +249,9 @@ interface RadioOption<TValue extends string | number> {
197
249
  }
198
250
  type RadioGroupFieldProps<TFieldValues extends FieldValues, TValue extends string | number = string> = FieldBaseProps<TFieldValues, TValue> & WithControl<TFieldValues> & {
199
251
  options: readonly RadioOption<TValue>[];
200
- radioGroupProps?: Omit<React.ComponentProps<typeof RadioGroup>, "value" | "onValueChange" | "label">;
252
+ radioGroupProps?: Omit<React$1.ComponentProps<typeof RadioGroup>, "value" | "onValueChange" | "label">;
201
253
  };
202
- declare function RadioGroupField<TFieldValues extends FieldValues, TValue extends string | number = string>(props: RadioGroupFieldProps<TFieldValues, TValue>): React.JSX.Element;
254
+ declare function RadioGroupField<TFieldValues extends FieldValues, TValue extends string | number = string>(props: RadioGroupFieldProps<TFieldValues, TValue>): React$1.JSX.Element;
203
255
 
204
256
  interface SelectOption<TValue extends string | number> {
205
257
  label: string;
@@ -210,25 +262,25 @@ interface SelectOption<TValue extends string | number> {
210
262
  type SelectFieldProps<TFieldValues extends FieldValues, TValue extends string | number = string> = FieldBaseProps<TFieldValues, TValue> & WithControl<TFieldValues> & {
211
263
  options: readonly SelectOption<TValue>[];
212
264
  placeholder?: string;
213
- selectProps?: Omit<React.ComponentProps<typeof Select>, "selectedKeys" | "onSelectionChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled">;
265
+ selectProps?: Omit<React$1.ComponentProps<typeof Select>, "selectedKeys" | "onSelectionChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled">;
214
266
  };
215
- declare function SelectField<TFieldValues extends FieldValues, TValue extends string | number = string>(props: SelectFieldProps<TFieldValues, TValue>): React.JSX.Element;
267
+ declare function SelectField<TFieldValues extends FieldValues, TValue extends string | number = string>(props: SelectFieldProps<TFieldValues, TValue>): React$1.JSX.Element;
216
268
 
217
269
  type SliderFieldProps<TFieldValues extends FieldValues> = FieldBaseProps<TFieldValues, number> & WithControl<TFieldValues> & {
218
- sliderProps?: Omit<React.ComponentProps<typeof Slider>, "value" | "onValueChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled">;
270
+ sliderProps?: Omit<React$1.ComponentProps<typeof Slider>, "value" | "onValueChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled">;
219
271
  transform?: (value: number) => number;
220
272
  };
221
- declare function SliderField<TFieldValues extends FieldValues>(props: SliderFieldProps<TFieldValues>): React.JSX.Element;
273
+ declare function SliderField<TFieldValues extends FieldValues>(props: SliderFieldProps<TFieldValues>): React$1.JSX.Element;
222
274
 
223
275
  type SwitchFieldProps<TFieldValues extends FieldValues> = FieldBaseProps<TFieldValues, boolean> & WithControl<TFieldValues> & {
224
- switchProps?: Omit<React.ComponentProps<typeof Switch>, "isSelected" | "onValueChange" | "isInvalid" | "isDisabled">;
276
+ switchProps?: Omit<React$1.ComponentProps<typeof Switch>, "isSelected" | "onValueChange" | "isInvalid" | "isDisabled">;
225
277
  };
226
- declare function SwitchField<TFieldValues extends FieldValues>(props: SwitchFieldProps<TFieldValues>): React.JSX.Element;
278
+ declare function SwitchField<TFieldValues extends FieldValues>(props: SwitchFieldProps<TFieldValues>): React$1.JSX.Element;
227
279
 
228
280
  type TextareaFieldProps<TFieldValues extends FieldValues> = FieldBaseProps<TFieldValues, string> & WithControl<TFieldValues> & {
229
- textareaProps?: Omit<React.ComponentProps<typeof Textarea>, "value" | "onValueChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled">;
281
+ textareaProps?: Omit<React$1.ComponentProps<typeof Textarea>, "value" | "onValueChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled">;
230
282
  };
231
- declare function TextareaField<TFieldValues extends FieldValues>(props: TextareaFieldProps<TFieldValues>): React.JSX.Element;
283
+ declare function TextareaField<TFieldValues extends FieldValues>(props: TextareaFieldProps<TFieldValues>): React$1.JSX.Element;
232
284
 
233
285
  interface UseFormHelperOptions<T extends FieldValues> {
234
286
  onError?: (error: FormValidationError) => void;
@@ -248,9 +300,9 @@ declare function useFormHelper<T extends FieldValues>({ defaultValues, methods,
248
300
  submissionState: FormSubmissionState;
249
301
  };
250
302
 
251
- type InputProps = React.ComponentProps<typeof Input>;
252
- type TextareaProps = React.ComponentProps<typeof Textarea>;
253
- type SelectProps = React.ComponentProps<typeof Select>;
303
+ type InputProps = React$1.ComponentProps<typeof Input>;
304
+ type TextareaProps = React$1.ComponentProps<typeof Textarea>;
305
+ type SelectProps = React$1.ComponentProps<typeof Select>;
254
306
  type SharedTextLikeColor = Extract<InputProps["color"], Extract<TextareaProps["color"], SelectProps["color"]>>;
255
307
  type SharedTextLikeSize = Extract<InputProps["size"], Extract<TextareaProps["size"], SelectProps["size"]>>;
256
308
  type SharedTextLikeVariant = Extract<InputProps["variant"], Extract<TextareaProps["variant"], SelectProps["variant"]>>;
@@ -265,13 +317,13 @@ type CommonFieldDefaults = Partial<{
265
317
  }>;
266
318
  type InputDefaults = Partial<Omit<InputProps, "value" | "onValueChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled">>;
267
319
  type TextareaDefaults = Partial<Omit<TextareaProps, "value" | "onValueChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled">>;
268
- type CheckboxDefaults = Partial<Omit<React.ComponentProps<typeof Checkbox>, "isSelected" | "onValueChange" | "isInvalid" | "errorMessage" | "isDisabled">>;
269
- type RadioGroupDefaults = Partial<Omit<React.ComponentProps<typeof RadioGroup>, "value" | "onValueChange" | "label">>;
320
+ type CheckboxDefaults = Partial<Omit<React$1.ComponentProps<typeof Checkbox>, "isSelected" | "onValueChange" | "isInvalid" | "errorMessage" | "isDisabled">>;
321
+ type RadioGroupDefaults = Partial<Omit<React$1.ComponentProps<typeof RadioGroup>, "value" | "onValueChange" | "label">>;
270
322
  type SelectDefaults = Partial<Omit<SelectProps, "selectedKeys" | "onSelectionChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled">>;
271
- type DateInputDefaults = Partial<Omit<React.ComponentProps<typeof DateInput>, "value" | "onValueChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled">>;
272
- type SliderDefaults = Partial<Omit<React.ComponentProps<typeof Slider>, "value" | "onValueChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled">>;
273
- type SwitchDefaults = Partial<Omit<React.ComponentProps<typeof Switch>, "isSelected" | "onValueChange" | "isInvalid" | "isDisabled">>;
274
- type ButtonDefaults = Partial<Omit<React.ComponentProps<typeof Button$1>, "type" | "isLoading">>;
323
+ type DateInputDefaults = Partial<Omit<React$1.ComponentProps<typeof DateInput>, "value" | "onValueChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled">>;
324
+ type SliderDefaults = Partial<Omit<React$1.ComponentProps<typeof Slider>, "value" | "onValueChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled">>;
325
+ type SwitchDefaults = Partial<Omit<React$1.ComponentProps<typeof Switch>, "isSelected" | "onValueChange" | "isInvalid" | "isDisabled">>;
326
+ type ButtonDefaults = Partial<Omit<React$1.ComponentProps<typeof Button$1>, "type" | "isLoading">>;
275
327
  interface HeroHookFormDefaultsConfig {
276
328
  common?: CommonFieldDefaults;
277
329
  input?: InputDefaults;
@@ -285,28 +337,28 @@ interface HeroHookFormDefaultsConfig {
285
337
  submitButton?: ButtonDefaults;
286
338
  }
287
339
  interface HeroHookFormProviderProps {
288
- children: React.ReactNode;
340
+ children: React$1.ReactNode;
289
341
  defaults?: HeroHookFormDefaultsConfig;
290
342
  }
291
- declare function HeroHookFormProvider(props: HeroHookFormProviderProps): React.JSX.Element;
343
+ declare function HeroHookFormProvider(props: HeroHookFormProviderProps): React$1.JSX.Element;
292
344
  declare function useHeroHookFormDefaults(): Required<Pick<HeroHookFormDefaultsConfig, "input" | "textarea" | "checkbox" | "radioGroup" | "select" | "dateInput" | "slider" | "switch" | "submitButton">>;
293
345
 
294
346
  interface FormProps<TFieldValues extends FieldValues> {
295
347
  methods: UseFormReturn<TFieldValues>;
296
348
  onSubmit: SubmitHandler<TFieldValues>;
297
349
  className?: string;
298
- children: React.ReactNode;
350
+ children: React$1.ReactNode;
299
351
  id?: string;
300
352
  noValidate?: boolean;
301
353
  }
302
- declare function FormProvider<TFieldValues extends FieldValues>(props: FormProps<TFieldValues>): React.JSX.Element;
354
+ declare function FormProvider<TFieldValues extends FieldValues>(props: FormProps<TFieldValues>): React$1.JSX.Element;
303
355
 
304
356
  interface SubmitButtonProps {
305
- children: React.ReactNode;
357
+ children: React$1.ReactNode;
306
358
  isLoading?: boolean;
307
- buttonProps?: Omit<React.ComponentProps<typeof Button$1>, "type" | "isLoading">;
359
+ buttonProps?: Omit<React$1.ComponentProps<typeof Button$1>, "type" | "isLoading">;
308
360
  }
309
- declare function SubmitButton(props: SubmitButtonProps): React.JSX.Element;
361
+ declare function SubmitButton(props: SubmitButtonProps): React$1.JSX.Element;
310
362
 
311
363
  interface ServerFieldError<TFieldValues extends FieldValues> {
312
364
  path: Path<TFieldValues>;
@@ -319,6 +371,136 @@ interface ServerFormError<TFieldValues extends FieldValues> {
319
371
  }
320
372
  declare function applyServerErrors<TFieldValues extends FieldValues>(setError: UseFormSetError<TFieldValues>, serverError: ServerFormError<TFieldValues>): void;
321
373
 
374
+ /**
375
+ * Testing utilities for forms
376
+ * These utilities help with testing form behavior and state
377
+ */
378
+ /**
379
+ * Creates form test utilities for a given form instance
380
+ */
381
+ declare function createFormTestUtils<TFieldValues extends FieldValues>(form: UseFormReturn<TFieldValues>): FormTestUtils<TFieldValues>;
382
+ /**
383
+ * Mock form data for testing
384
+ */
385
+ declare function createMockFormData<TFieldValues extends FieldValues>(overrides?: Partial<TFieldValues>): TFieldValues;
386
+ /**
387
+ * Mock form errors for testing
388
+ */
389
+ declare function createMockFormErrors<TFieldValues extends FieldValues>(overrides?: Partial<FieldErrors<TFieldValues>>): FieldErrors<TFieldValues>;
390
+ /**
391
+ * Wait for form state to change (useful for async operations)
392
+ */
393
+ declare function waitForFormState<TFieldValues extends FieldValues>(form: UseFormReturn<TFieldValues>, condition: (state: unknown) => boolean, timeout?: number): Promise<void>;
394
+ /**
395
+ * Simulate user input on a field
396
+ */
397
+ declare function simulateFieldInput<TFieldValues extends FieldValues>(form: UseFormReturn<TFieldValues>, name: Path<TFieldValues>, value: unknown): void;
398
+ /**
399
+ * Simulate form submission
400
+ */
401
+ declare function simulateFormSubmission<TFieldValues extends FieldValues>(form: UseFormReturn<TFieldValues>, onSubmit: (data: TFieldValues) => void | Promise<void>): Promise<void>;
402
+ /**
403
+ * Check if form has validation errors
404
+ */
405
+ declare function hasFormErrors<TFieldValues extends FieldValues>(form: UseFormReturn<TFieldValues>): boolean;
406
+ /**
407
+ * Get all form errors as a flat array
408
+ */
409
+ declare function getFormErrors<TFieldValues extends FieldValues>(form: UseFormReturn<TFieldValues>): string[];
410
+ /**
411
+ * Check if a specific field has an error
412
+ */
413
+ declare function hasFieldError<TFieldValues extends FieldValues>(form: UseFormReturn<TFieldValues>, name: Path<TFieldValues>): boolean;
414
+ /**
415
+ * Get error message for a specific field
416
+ */
417
+ declare function getFieldError<TFieldValues extends FieldValues>(form: UseFormReturn<TFieldValues>, name: Path<TFieldValues>): string | undefined;
418
+
419
+ /**
420
+ * Validation utility functions for common form validation patterns
421
+ * These utilities help create consistent validation schemas across forms
422
+ */
423
+ /**
424
+ * Creates a minimum length validation schema
425
+ */
426
+ declare const createMinLengthSchema: (min: number, fieldName: string) => z.ZodString;
427
+ /**
428
+ * Creates a maximum length validation schema
429
+ */
430
+ declare const createMaxLengthSchema: (max: number, fieldName: string) => z.ZodString;
431
+ /**
432
+ * Creates an email validation schema
433
+ */
434
+ declare const createEmailSchema: () => z.ZodEmail;
435
+ /**
436
+ * Creates a required field validation schema
437
+ */
438
+ declare const createRequiredSchema: (fieldName: string) => z.ZodString;
439
+ /**
440
+ * Creates a URL validation schema
441
+ */
442
+ declare const createUrlSchema: () => z.ZodString;
443
+ /**
444
+ * Creates a phone number validation schema
445
+ */
446
+ declare const createPhoneSchema: () => z.ZodString;
447
+ /**
448
+ * Creates a password validation schema with common requirements
449
+ */
450
+ declare const createPasswordSchema: (minLength?: number) => z.ZodString;
451
+ /**
452
+ * Creates a confirm password validation schema
453
+ */
454
+ declare const createConfirmPasswordSchema: (passwordField: string) => z.ZodString;
455
+ /**
456
+ * Creates a number validation schema with range
457
+ */
458
+ declare const createNumberRangeSchema: (min: number, max: number, fieldName: string) => z.ZodNumber;
459
+ /**
460
+ * Creates a date validation schema
461
+ */
462
+ declare const createDateSchema: (fieldName: string) => z.ZodDate;
463
+ /**
464
+ * Creates a future date validation schema
465
+ */
466
+ declare const createFutureDateSchema: (fieldName: string) => z.ZodDate;
467
+ /**
468
+ * Creates a past date validation schema
469
+ */
470
+ declare const createPastDateSchema: (fieldName: string) => z.ZodDate;
471
+ /**
472
+ * Creates a file validation schema
473
+ */
474
+ declare const createFileSchema: (maxSizeInMB?: number, allowedTypes?: string[]) => z.ZodCustom<File, File>;
475
+ /**
476
+ * Creates a checkbox validation schema (must be checked)
477
+ */
478
+ declare const createRequiredCheckboxSchema: (fieldName: string) => z.ZodBoolean;
479
+ /**
480
+ * Creates a conditional validation schema
481
+ */
482
+ declare const createConditionalSchema: <T>(condition: (data: unknown) => boolean, schema: z.ZodSchema<T>, errorMessage?: string) => z.ZodAny;
483
+ /**
484
+ * Common validation patterns for forms
485
+ */
486
+ declare const commonValidations: {
487
+ conditional: <T>(condition: (data: unknown) => boolean, schema: z.ZodSchema<T>, errorMessage?: string) => z.ZodAny;
488
+ confirmPassword: (passwordField: string) => z.ZodString;
489
+ date: (fieldName: string) => z.ZodDate;
490
+ email: z.ZodEmail;
491
+ file: (maxSizeInMB?: number, allowedTypes?: string[]) => z.ZodCustom<File, File>;
492
+ futureDate: (fieldName: string) => z.ZodDate;
493
+ maxLength: (max: number, fieldName: string) => z.ZodString;
494
+ minLength: (min: number, fieldName: string) => z.ZodString;
495
+ numberRange: (min: number, max: number, fieldName: string) => z.ZodNumber;
496
+ password: (minLength?: number) => z.ZodString;
497
+ pastDate: (fieldName: string) => z.ZodDate;
498
+ phone: z.ZodString;
499
+ required: (fieldName: string) => z.ZodString;
500
+ requiredCheckbox: (fieldName: string) => z.ZodBoolean;
501
+ url: z.ZodString;
502
+ };
503
+
322
504
  interface ZodFormProps<T extends FieldValues> {
323
505
  className?: string;
324
506
  columns?: 1 | 2 | 3;
@@ -330,33 +512,25 @@ interface ZodFormProps<T extends FieldValues> {
330
512
  resetButtonText?: string;
331
513
  showResetButton?: boolean;
332
514
  spacing?: "2" | "4" | "6" | "8" | "lg";
333
- submitButtonProps?: Partial<React.ComponentProps<typeof Button>>;
515
+ submitButtonProps?: Partial<React$1.ComponentProps<typeof Button>>;
334
516
  submitButtonText?: string;
335
517
  subtitle?: string;
336
518
  title?: string;
519
+ errorDisplay?: "inline" | "toast" | "modal" | "none";
520
+ render?: (formState: {
521
+ form: UseFormReturn<T>;
522
+ isSubmitting: boolean;
523
+ isSubmitted: boolean;
524
+ isSuccess: boolean;
525
+ errors: FieldErrors<T>;
526
+ values: T;
527
+ }) => React$1.ReactNode;
337
528
  }
338
- declare function ZodForm<T extends FieldValues>({ className, columns, config, layout, onError, onSubmit, onSuccess, resetButtonText, showResetButton, spacing, submitButtonProps, submitButtonText, subtitle, title, }: ZodFormProps<T>): React.JSX.Element;
529
+ declare function ZodForm<T extends FieldValues>({ className, columns, config, errorDisplay, layout, onError, onSubmit, onSuccess, render, resetButtonText, showResetButton, spacing, submitButtonProps, submitButtonText, subtitle, title, }: ZodFormProps<T>): string | number | bigint | boolean | Iterable<React$1.ReactNode> | Promise<string | number | bigint | boolean | React$1.ReactPortal | React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>> | Iterable<React$1.ReactNode> | null | undefined> | React$1.JSX.Element | null | undefined;
339
530
 
340
531
  /**
341
532
  * Hook for using Zod validation with React Hook Form
342
- * This hook is only available when zod and @hookform/resolvers are installed
343
- *
344
- * TODO: Remove type assertion when @hookform/resolvers adds official Zod v4 support
345
- *
346
- * Current issue: @hookform/resolvers v5.2.1 is not compatible with Zod v4 due to
347
- * internal type structure changes. The resolver expects Zod3Type<Output, Input> but
348
- * Zod v4 uses a different internal structure (_zod.output vs _output).
349
- *
350
- * Related issues:
351
- * - GitHub Issue: https://github.com/react-hook-form/resolvers/issues/813
352
- * - GitHub PR: https://github.com/react-hook-form/resolvers/pull/803
353
- *
354
- * Workaround: Use type assertion until official support is added
355
- */
356
- /**
357
- * Hook for using Zod validation with React Hook Form
358
- * Uses Zod's built-in type inference to avoid type assertion issues
359
533
  */
360
534
  declare function useZodForm<TFieldValues extends FieldValues>(config: ZodFormConfig<TFieldValues>): react_hook_form.UseFormReturn<TFieldValues, any, TFieldValues>;
361
535
 
362
- export { type BaseFormFieldConfig, type BooleanFieldConfig, type ButtonDefaults, type CheckboxDefaults, CheckboxField, type CheckboxFieldProps, type CommonFieldDefaults, type ConditionalValidation, ConfigurableForm, DateField, type DateFieldConfig, type DateFieldProps, type DateInputDefaults, type FieldBaseProps, type FieldGroup, FileField, type FileFieldConfig, type FileFieldProps, type FormConfig, FormField, type FormFieldConfig, type FormProps, FormProvider, type FormStep, type FormSubmissionState, type FormValidationError, type HeroHookFormDefaultsConfig, HeroHookFormProvider, type HeroHookFormProviderProps, type InputDefaults, InputField, type InputFieldProps, type RadioFieldConfig, type RadioGroupDefaults, RadioGroupField, type RadioGroupFieldProps, type SelectDefaults, SelectField, type SelectFieldProps, type ServerFieldError, type ServerFormError, type SliderDefaults, SliderField, type SliderFieldConfig, type SliderFieldProps, type StringFieldConfig, SubmitButton, type SubmitButtonProps, type SwitchDefaults, SwitchField, type SwitchFieldProps, type TextareaDefaults, TextareaField, type TextareaFieldProps, type WithControl, type WizardFormConfig, ZodForm, type ZodFormConfig, type ZodFormFieldConfig, applyServerErrors, useFormHelper, useHeroHookFormDefaults, useZodForm };
536
+ export { type BaseFormFieldConfig, type BooleanFieldConfig, type ButtonDefaults, type CheckboxDefaults, CheckboxField, type CheckboxFieldProps, type CommonFieldDefaults, type ConditionalValidation, ConfigurableForm, type CustomFieldConfig, DateField, type DateFieldConfig, type DateFieldProps, type DateInputDefaults, type FieldBaseProps, type FieldGroup, FileField, type FileFieldConfig, type FileFieldProps, type FormConfig, FormField, type FormFieldConfig, type FormProps, FormProvider, type FormStep, type FormSubmissionState, type FormTestUtils, type FormValidationError, type HeroHookFormDefaultsConfig, HeroHookFormProvider, type HeroHookFormProviderProps, type InputDefaults, InputField, type InputFieldProps, type RadioFieldConfig, type RadioGroupDefaults, RadioGroupField, type RadioGroupFieldProps, type SelectDefaults, SelectField, type SelectFieldProps, type ServerFieldError, type ServerFormError, type SliderDefaults, SliderField, type SliderFieldConfig, type SliderFieldProps, type StringFieldConfig, SubmitButton, type SubmitButtonProps, type SwitchDefaults, SwitchField, type SwitchFieldProps, type TextareaDefaults, TextareaField, type TextareaFieldProps, type ValidationUtils, type WithControl, type WizardFormConfig, ZodForm, type ZodFormConfig, type ZodFormFieldConfig, applyServerErrors, commonValidations, createConditionalSchema, createConfirmPasswordSchema, createDateSchema, createEmailSchema, createFileSchema, createFormTestUtils, createFutureDateSchema, createMaxLengthSchema, createMinLengthSchema, createMockFormData, createMockFormErrors, createNumberRangeSchema, createPasswordSchema, createPastDateSchema, createPhoneSchema, createRequiredCheckboxSchema, createRequiredSchema, createUrlSchema, getFieldError, getFormErrors, hasFieldError, hasFormErrors, simulateFieldInput, simulateFormSubmission, useFormHelper, useHeroHookFormDefaults, useZodForm, waitForFormState };