@rachelallyson/hero-hook-form 1.0.1 → 1.1.0

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/dist/index.js CHANGED
@@ -1,5 +1,12 @@
1
+ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
2
+ get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
3
+ }) : x)(function(x) {
4
+ if (typeof require !== "undefined") return require.apply(this, arguments);
5
+ throw Error('Dynamic require of "' + x + '" is not supported');
6
+ });
7
+
1
8
  // src/components/Form.tsx
2
- import React12 from "react";
9
+ import React13 from "react";
3
10
  import { Button as Button2 } from "@heroui/react";
4
11
 
5
12
  // src/hooks/useFormHelper.ts
@@ -68,7 +75,7 @@ function useFormHelper({
68
75
  }
69
76
 
70
77
  // src/components/FormField.tsx
71
- import React11 from "react";
78
+ import React12 from "react";
72
79
  import { useWatch } from "react-hook-form";
73
80
 
74
81
  // src/fields/CheckboxField.tsx
@@ -344,13 +351,60 @@ function FileField(props) {
344
351
  );
345
352
  }
346
353
 
347
- // src/fields/InputField.tsx
354
+ // src/fields/FontPickerField.tsx
348
355
  import React5 from "react";
349
356
  import { Controller as Controller4 } from "react-hook-form";
357
+ var FontPickerComponent = null;
358
+ try {
359
+ const fontPickerModule = __require("@rachelallyson/heroui-font-picker");
360
+ FontPickerComponent = fontPickerModule.FontPicker;
361
+ } catch (e) {
362
+ console.debug("Font picker package not available - FontPickerField will show fallback UI");
363
+ }
364
+ function FontPickerField(props) {
365
+ const {
366
+ className,
367
+ control,
368
+ description,
369
+ fontPickerProps,
370
+ isDisabled,
371
+ label,
372
+ name,
373
+ rules
374
+ } = props;
375
+ if (!FontPickerComponent) {
376
+ return /* @__PURE__ */ React5.createElement("div", { className }, /* @__PURE__ */ React5.createElement("div", { className: "space-y-2" }, label && /* @__PURE__ */ React5.createElement("label", { className: "block text-sm font-medium text-foreground" }, label), description && /* @__PURE__ */ React5.createElement("p", { className: "text-sm text-muted-foreground" }, description), /* @__PURE__ */ React5.createElement("div", { className: "p-4 border border-warning-200 bg-warning-50 rounded-medium" }, /* @__PURE__ */ React5.createElement("p", { className: "text-warning-800 text-sm" }, "Font picker requires the @rachelallyson/heroui-font-picker package. Please install it as a peer dependency for advanced font selection features."))));
377
+ }
378
+ return /* @__PURE__ */ React5.createElement(
379
+ Controller4,
380
+ {
381
+ control,
382
+ name,
383
+ render: ({ field, fieldState }) => /* @__PURE__ */ React5.createElement(
384
+ FontPickerComponent,
385
+ {
386
+ label,
387
+ description,
388
+ value: field.value ?? "",
389
+ onSelectionChange: (value) => field.onChange(value),
390
+ errorMessage: fieldState.error?.message,
391
+ isDisabled,
392
+ className,
393
+ ...fontPickerProps
394
+ }
395
+ ),
396
+ rules
397
+ }
398
+ );
399
+ }
400
+
401
+ // src/fields/InputField.tsx
402
+ import React6 from "react";
403
+ import { Controller as Controller5 } from "react-hook-form";
350
404
  function CoercedInput(props) {
351
405
  const { description, disabled, errorMessage, field, inputProps, label } = props;
352
406
  const defaults = useHeroHookFormDefaults();
353
- return /* @__PURE__ */ React5.createElement(
407
+ return /* @__PURE__ */ React6.createElement(
354
408
  Input,
355
409
  {
356
410
  ...defaults.input,
@@ -378,12 +432,12 @@ function InputField(props) {
378
432
  rules,
379
433
  transform
380
434
  } = props;
381
- return /* @__PURE__ */ React5.createElement(
382
- Controller4,
435
+ return /* @__PURE__ */ React6.createElement(
436
+ Controller5,
383
437
  {
384
438
  control,
385
439
  name,
386
- render: ({ field, fieldState }) => /* @__PURE__ */ React5.createElement("div", { className }, /* @__PURE__ */ React5.createElement(
440
+ render: ({ field, fieldState }) => /* @__PURE__ */ React6.createElement("div", { className }, /* @__PURE__ */ React6.createElement(
387
441
  CoercedInput,
388
442
  {
389
443
  description,
@@ -412,8 +466,8 @@ function InputField(props) {
412
466
  }
413
467
 
414
468
  // src/fields/RadioGroupField.tsx
415
- import React6 from "react";
416
- import { Controller as Controller5 } from "react-hook-form";
469
+ import React7 from "react";
470
+ import { Controller as Controller6 } from "react-hook-form";
417
471
  function RadioGroupField(props) {
418
472
  const {
419
473
  className,
@@ -427,12 +481,12 @@ function RadioGroupField(props) {
427
481
  rules
428
482
  } = props;
429
483
  const defaults = useHeroHookFormDefaults();
430
- return /* @__PURE__ */ React6.createElement(
431
- Controller5,
484
+ return /* @__PURE__ */ React7.createElement(
485
+ Controller6,
432
486
  {
433
487
  control,
434
488
  name,
435
- render: ({ field, fieldState }) => /* @__PURE__ */ React6.createElement("div", { className }, /* @__PURE__ */ React6.createElement(
489
+ render: ({ field, fieldState }) => /* @__PURE__ */ React7.createElement("div", { className }, /* @__PURE__ */ React7.createElement(
436
490
  RadioGroup,
437
491
  {
438
492
  ...defaults.radioGroup,
@@ -445,7 +499,7 @@ function RadioGroupField(props) {
445
499
  onBlur: field.onBlur,
446
500
  onValueChange: (val) => field.onChange(val)
447
501
  },
448
- options.map((opt) => /* @__PURE__ */ React6.createElement(
502
+ options.map((opt) => /* @__PURE__ */ React7.createElement(
449
503
  Radio,
450
504
  {
451
505
  key: String(opt.value),
@@ -454,15 +508,15 @@ function RadioGroupField(props) {
454
508
  },
455
509
  opt.label
456
510
  ))
457
- ), fieldState.error?.message ? /* @__PURE__ */ React6.createElement("p", { className: "text-tiny text-danger mt-1" }, fieldState.error.message) : null),
511
+ ), fieldState.error?.message ? /* @__PURE__ */ React7.createElement("p", { className: "text-tiny text-danger mt-1" }, fieldState.error.message) : null),
458
512
  rules
459
513
  }
460
514
  );
461
515
  }
462
516
 
463
517
  // src/fields/SelectField.tsx
464
- import React7 from "react";
465
- import { Controller as Controller6 } from "react-hook-form";
518
+ import React8 from "react";
519
+ import { Controller as Controller7 } from "react-hook-form";
466
520
  function SelectField(props) {
467
521
  const {
468
522
  className,
@@ -477,14 +531,14 @@ function SelectField(props) {
477
531
  selectProps
478
532
  } = props;
479
533
  const defaults = useHeroHookFormDefaults();
480
- return /* @__PURE__ */ React7.createElement(
481
- Controller6,
534
+ return /* @__PURE__ */ React8.createElement(
535
+ Controller7,
482
536
  {
483
537
  control,
484
538
  name,
485
539
  render: ({ field, fieldState }) => {
486
540
  const selectedKey = field.value;
487
- return /* @__PURE__ */ React7.createElement("div", { className }, /* @__PURE__ */ React7.createElement(
541
+ return /* @__PURE__ */ React8.createElement("div", { className }, /* @__PURE__ */ React8.createElement(
488
542
  Select,
489
543
  {
490
544
  ...defaults.select,
@@ -502,7 +556,7 @@ function SelectField(props) {
502
556
  field.onChange(next);
503
557
  }
504
558
  },
505
- options.map((opt) => /* @__PURE__ */ React7.createElement(
559
+ options.map((opt) => /* @__PURE__ */ React8.createElement(
506
560
  SelectItem,
507
561
  {
508
562
  key: String(opt.value),
@@ -519,12 +573,12 @@ function SelectField(props) {
519
573
  }
520
574
 
521
575
  // src/fields/SliderField.tsx
522
- import React8 from "react";
523
- import { Controller as Controller7 } from "react-hook-form";
576
+ import React9 from "react";
577
+ import { Controller as Controller8 } from "react-hook-form";
524
578
  function CoercedSlider(props) {
525
579
  const { description, disabled, errorMessage, field, label, sliderProps } = props;
526
580
  const defaults = useHeroHookFormDefaults();
527
- return /* @__PURE__ */ React8.createElement(
581
+ return /* @__PURE__ */ React9.createElement(
528
582
  Slider,
529
583
  {
530
584
  ...defaults.slider,
@@ -552,12 +606,12 @@ function SliderField(props) {
552
606
  sliderProps,
553
607
  transform
554
608
  } = props;
555
- return /* @__PURE__ */ React8.createElement(
556
- Controller7,
609
+ return /* @__PURE__ */ React9.createElement(
610
+ Controller8,
557
611
  {
558
612
  control,
559
613
  name,
560
- render: ({ field, fieldState }) => /* @__PURE__ */ React8.createElement("div", { className }, /* @__PURE__ */ React8.createElement(
614
+ render: ({ field, fieldState }) => /* @__PURE__ */ React9.createElement("div", { className }, /* @__PURE__ */ React9.createElement(
561
615
  CoercedSlider,
562
616
  {
563
617
  description,
@@ -577,8 +631,8 @@ function SliderField(props) {
577
631
  }
578
632
 
579
633
  // src/fields/SwitchField.tsx
580
- import React9 from "react";
581
- import { Controller as Controller8 } from "react-hook-form";
634
+ import React10 from "react";
635
+ import { Controller as Controller9 } from "react-hook-form";
582
636
  function SwitchField(props) {
583
637
  const {
584
638
  className,
@@ -591,12 +645,12 @@ function SwitchField(props) {
591
645
  switchProps
592
646
  } = props;
593
647
  const defaults = useHeroHookFormDefaults();
594
- return /* @__PURE__ */ React9.createElement(
595
- Controller8,
648
+ return /* @__PURE__ */ React10.createElement(
649
+ Controller9,
596
650
  {
597
651
  control,
598
652
  name,
599
- render: ({ field, fieldState }) => /* @__PURE__ */ React9.createElement("div", { className }, /* @__PURE__ */ React9.createElement(
653
+ render: ({ field, fieldState }) => /* @__PURE__ */ React10.createElement("div", { className }, /* @__PURE__ */ React10.createElement(
600
654
  Switch,
601
655
  {
602
656
  ...defaults.switch,
@@ -607,15 +661,15 @@ function SwitchField(props) {
607
661
  onValueChange: (val) => field.onChange(val)
608
662
  },
609
663
  label
610
- ), description ? /* @__PURE__ */ React9.createElement("p", { className: "text-small text-default-400" }, description) : null, fieldState.error?.message ? /* @__PURE__ */ React9.createElement("p", { className: "text-tiny text-danger mt-1" }, fieldState.error.message) : null),
664
+ ), description ? /* @__PURE__ */ React10.createElement("p", { className: "text-small text-default-400" }, description) : null, fieldState.error?.message ? /* @__PURE__ */ React10.createElement("p", { className: "text-tiny text-danger mt-1" }, fieldState.error.message) : null),
611
665
  rules
612
666
  }
613
667
  );
614
668
  }
615
669
 
616
670
  // src/fields/TextareaField.tsx
617
- import React10 from "react";
618
- import { Controller as Controller9 } from "react-hook-form";
671
+ import React11 from "react";
672
+ import { Controller as Controller10 } from "react-hook-form";
619
673
  function TextareaField(props) {
620
674
  const {
621
675
  className,
@@ -628,12 +682,12 @@ function TextareaField(props) {
628
682
  textareaProps
629
683
  } = props;
630
684
  const defaults = useHeroHookFormDefaults();
631
- return /* @__PURE__ */ React10.createElement(
632
- Controller9,
685
+ return /* @__PURE__ */ React11.createElement(
686
+ Controller10,
633
687
  {
634
688
  control,
635
689
  name,
636
- render: ({ field, fieldState }) => /* @__PURE__ */ React10.createElement("div", { className }, /* @__PURE__ */ React10.createElement(
690
+ render: ({ field, fieldState }) => /* @__PURE__ */ React11.createElement("div", { className }, /* @__PURE__ */ React11.createElement(
637
691
  Textarea,
638
692
  {
639
693
  ...defaults.textarea,
@@ -682,7 +736,7 @@ function FormField({
682
736
  };
683
737
  switch (config.type) {
684
738
  case "input":
685
- return /* @__PURE__ */ React11.createElement(
739
+ return /* @__PURE__ */ React12.createElement(
686
740
  InputField,
687
741
  {
688
742
  ...baseProps,
@@ -692,7 +746,7 @@ function FormField({
692
746
  }
693
747
  );
694
748
  case "textarea":
695
- return /* @__PURE__ */ React11.createElement(
749
+ return /* @__PURE__ */ React12.createElement(
696
750
  TextareaField,
697
751
  {
698
752
  ...baseProps,
@@ -702,7 +756,7 @@ function FormField({
702
756
  }
703
757
  );
704
758
  case "select":
705
- return /* @__PURE__ */ React11.createElement(
759
+ return /* @__PURE__ */ React12.createElement(
706
760
  SelectField,
707
761
  {
708
762
  ...baseProps,
@@ -716,7 +770,7 @@ function FormField({
716
770
  }
717
771
  );
718
772
  case "checkbox":
719
- return /* @__PURE__ */ React11.createElement(
773
+ return /* @__PURE__ */ React12.createElement(
720
774
  CheckboxField,
721
775
  {
722
776
  ...baseProps,
@@ -726,7 +780,7 @@ function FormField({
726
780
  }
727
781
  );
728
782
  case "radio":
729
- return /* @__PURE__ */ React11.createElement(
783
+ return /* @__PURE__ */ React12.createElement(
730
784
  RadioGroupField,
731
785
  {
732
786
  ...baseProps,
@@ -740,7 +794,7 @@ function FormField({
740
794
  }
741
795
  );
742
796
  case "switch":
743
- return /* @__PURE__ */ React11.createElement(
797
+ return /* @__PURE__ */ React12.createElement(
744
798
  SwitchField,
745
799
  {
746
800
  ...baseProps,
@@ -750,7 +804,7 @@ function FormField({
750
804
  }
751
805
  );
752
806
  case "slider":
753
- return /* @__PURE__ */ React11.createElement(
807
+ return /* @__PURE__ */ React12.createElement(
754
808
  SliderField,
755
809
  {
756
810
  ...baseProps,
@@ -760,7 +814,7 @@ function FormField({
760
814
  }
761
815
  );
762
816
  case "date":
763
- return /* @__PURE__ */ React11.createElement(
817
+ return /* @__PURE__ */ React12.createElement(
764
818
  DateField,
765
819
  {
766
820
  ...baseProps,
@@ -770,7 +824,7 @@ function FormField({
770
824
  }
771
825
  );
772
826
  case "file":
773
- return /* @__PURE__ */ React11.createElement(
827
+ return /* @__PURE__ */ React12.createElement(
774
828
  FileField,
775
829
  {
776
830
  ...baseProps,
@@ -781,6 +835,16 @@ function FormField({
781
835
  multiple: config.multiple
782
836
  }
783
837
  );
838
+ case "fontPicker":
839
+ return /* @__PURE__ */ React12.createElement(
840
+ FontPickerField,
841
+ {
842
+ ...baseProps,
843
+ control,
844
+ defaultValue: config.defaultValue,
845
+ fontPickerProps: config.fontPickerProps
846
+ }
847
+ );
784
848
  case "custom":
785
849
  return config.render({
786
850
  control,
@@ -832,12 +896,12 @@ function ConfigurableForm({
832
896
  });
833
897
  const renderFields = () => {
834
898
  if (layout === "grid") {
835
- return /* @__PURE__ */ React12.createElement(
899
+ return /* @__PURE__ */ React13.createElement(
836
900
  "div",
837
901
  {
838
902
  className: `grid gap-${spacing} ${columns === 1 ? "grid-cols-1" : columns === 2 ? "grid-cols-1 md:grid-cols-2" : "grid-cols-1 md:grid-cols-2 lg:grid-cols-3"}`
839
903
  },
840
- fields.map((field) => /* @__PURE__ */ React12.createElement(
904
+ fields.map((field) => /* @__PURE__ */ React13.createElement(
841
905
  FormField,
842
906
  {
843
907
  key: field.name,
@@ -849,7 +913,7 @@ function ConfigurableForm({
849
913
  );
850
914
  }
851
915
  if (layout === "horizontal") {
852
- return /* @__PURE__ */ React12.createElement("div", { className: `grid gap-${spacing} grid-cols-1 md:grid-cols-2` }, fields.map((field) => /* @__PURE__ */ React12.createElement(
916
+ return /* @__PURE__ */ React13.createElement("div", { className: `grid gap-${spacing} grid-cols-1 md:grid-cols-2` }, fields.map((field) => /* @__PURE__ */ React13.createElement(
853
917
  FormField,
854
918
  {
855
919
  key: field.name,
@@ -859,7 +923,7 @@ function ConfigurableForm({
859
923
  }
860
924
  )));
861
925
  }
862
- return /* @__PURE__ */ React12.createElement("div", { className: `space-y-${spacing}` }, fields.map((field) => /* @__PURE__ */ React12.createElement(
926
+ return /* @__PURE__ */ React13.createElement("div", { className: `space-y-${spacing}` }, fields.map((field) => /* @__PURE__ */ React13.createElement(
863
927
  FormField,
864
928
  {
865
929
  key: field.name,
@@ -873,23 +937,23 @@ function ConfigurableForm({
873
937
  e.preventDefault();
874
938
  void handleSubmit();
875
939
  };
876
- return /* @__PURE__ */ React12.createElement("form", { className, role: "form", onSubmit: handleFormSubmit }, title && /* @__PURE__ */ React12.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React12.createElement("h2", { className: "text-xl font-semibold text-foreground mb-2" }, title), subtitle && /* @__PURE__ */ React12.createElement("p", { className: "text-sm text-muted-foreground" }, subtitle)), isSubmitted && isSuccess && /* @__PURE__ */ React12.createElement(
940
+ return /* @__PURE__ */ React13.createElement("form", { className, role: "form", onSubmit: handleFormSubmit }, title && /* @__PURE__ */ React13.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React13.createElement("h2", { className: "text-xl font-semibold text-foreground mb-2" }, title), subtitle && /* @__PURE__ */ React13.createElement("p", { className: "text-sm text-muted-foreground" }, subtitle)), isSubmitted && isSuccess && /* @__PURE__ */ React13.createElement(
877
941
  "div",
878
942
  {
879
943
  className: "mb-6 p-4 bg-success-50 border border-success-200 rounded-lg",
880
944
  "data-testid": "success-message"
881
945
  },
882
- /* @__PURE__ */ React12.createElement("p", { className: "text-success-800 font-medium" }, "Success!"),
883
- /* @__PURE__ */ React12.createElement("p", { className: "text-success-700 text-sm mt-1" }, "Your request has been processed successfully.")
884
- ), error && /* @__PURE__ */ React12.createElement(
946
+ /* @__PURE__ */ React13.createElement("p", { className: "text-success-800 font-medium" }, "Success!"),
947
+ /* @__PURE__ */ React13.createElement("p", { className: "text-success-700 text-sm mt-1" }, "Your request has been processed successfully.")
948
+ ), error && /* @__PURE__ */ React13.createElement(
885
949
  "div",
886
950
  {
887
951
  className: "mb-6 p-4 bg-danger-50 border border-danger-200 rounded-lg",
888
952
  "data-testid": "error-message"
889
953
  },
890
- /* @__PURE__ */ React12.createElement("p", { className: "text-danger-800 font-medium" }, "Error"),
891
- /* @__PURE__ */ React12.createElement("p", { className: "text-danger-700 text-sm mt-1" }, error)
892
- ), renderFields(), /* @__PURE__ */ React12.createElement("div", { className: "mt-6 flex gap-3 justify-end" }, /* @__PURE__ */ React12.createElement(
954
+ /* @__PURE__ */ React13.createElement("p", { className: "text-danger-800 font-medium" }, "Error"),
955
+ /* @__PURE__ */ React13.createElement("p", { className: "text-danger-700 text-sm mt-1" }, error)
956
+ ), renderFields(), /* @__PURE__ */ React13.createElement("div", { className: "mt-6 flex gap-3 justify-end" }, /* @__PURE__ */ React13.createElement(
893
957
  Button2,
894
958
  {
895
959
  color: "primary",
@@ -899,7 +963,7 @@ function ConfigurableForm({
899
963
  ...submitButtonProps
900
964
  },
901
965
  submitButtonText
902
- ), showResetButton && /* @__PURE__ */ React12.createElement(
966
+ ), showResetButton && /* @__PURE__ */ React13.createElement(
903
967
  Button2,
904
968
  {
905
969
  isDisabled: isSubmitting,
@@ -911,11 +975,24 @@ function ConfigurableForm({
911
975
  )));
912
976
  }
913
977
 
978
+ // src/hooks/useHeroForm.ts
979
+ import { useFormContext } from "react-hook-form";
980
+ function useHeroForm() {
981
+ const form = useFormContext();
982
+ const defaults = useHeroHookFormDefaults();
983
+ return {
984
+ // All React Hook Form methods and state
985
+ ...form,
986
+ // Hero Hook Form styling defaults
987
+ defaults
988
+ };
989
+ }
990
+
914
991
  // src/providers/FormProvider.tsx
915
- import React13 from "react";
992
+ import React14 from "react";
916
993
  import { FormProvider as RHFProvider } from "react-hook-form";
917
994
  function FormProvider(props) {
918
- return /* @__PURE__ */ React13.createElement(RHFProvider, { ...props.methods }, /* @__PURE__ */ React13.createElement(
995
+ return /* @__PURE__ */ React14.createElement(RHFProvider, { ...props.methods }, /* @__PURE__ */ React14.createElement(
919
996
  "form",
920
997
  {
921
998
  className: props.className,
@@ -928,15 +1005,14 @@ function FormProvider(props) {
928
1005
  }
929
1006
 
930
1007
  // src/submit/SubmitButton.tsx
931
- import React14 from "react";
932
- import { useFormContext } from "react-hook-form";
1008
+ import React15 from "react";
933
1009
  function SubmitButton(props) {
934
- const ctx = useFormContext();
1010
+ const ctx = useFormContext2();
935
1011
  const loading = props.isLoading ?? ctx.formState.isSubmitting;
936
1012
  const isDisabledFromProps = props.buttonProps?.isDisabled ?? false;
937
1013
  const isDisabled = Boolean(isDisabledFromProps) || Boolean(loading);
938
1014
  const defaults = useHeroHookFormDefaults();
939
- return /* @__PURE__ */ React14.createElement(
1015
+ return /* @__PURE__ */ React15.createElement(
940
1016
  Button,
941
1017
  {
942
1018
  type: "submit",
@@ -944,7 +1020,7 @@ function SubmitButton(props) {
944
1020
  ...props.buttonProps,
945
1021
  isDisabled
946
1022
  },
947
- loading ? /* @__PURE__ */ React14.createElement("span", { className: "inline-flex items-center gap-2" }, /* @__PURE__ */ React14.createElement(Spinner, { size: "sm" }), "Submitting\u2026") : props.children
1023
+ loading ? /* @__PURE__ */ React15.createElement("span", { className: "inline-flex items-center gap-2" }, /* @__PURE__ */ React15.createElement(Spinner, { size: "sm" }), "Submitting\u2026") : props.children
948
1024
  );
949
1025
  }
950
1026
 
@@ -1136,8 +1212,11 @@ var commonValidations = {
1136
1212
  url: createUrlSchema()
1137
1213
  };
1138
1214
 
1215
+ // src/index.ts
1216
+ import { useFormContext as useFormContext2 } from "react-hook-form";
1217
+
1139
1218
  // src/components/ZodForm.tsx
1140
- import React15 from "react";
1219
+ import React16 from "react";
1141
1220
  import { Button as Button3 } from "@heroui/react";
1142
1221
 
1143
1222
  // src/zod-integration.ts
@@ -1173,6 +1252,13 @@ function useZodForm(config) {
1173
1252
  }
1174
1253
  return useForm2(config);
1175
1254
  }
1255
+ function createZodFormConfig(schema, fields, defaultValues) {
1256
+ return {
1257
+ schema,
1258
+ fields,
1259
+ ...defaultValues && { defaultValues }
1260
+ };
1261
+ }
1176
1262
 
1177
1263
  // src/components/ZodForm.tsx
1178
1264
  function ZodForm({
@@ -1194,7 +1280,7 @@ function ZodForm({
1194
1280
  title
1195
1281
  }) {
1196
1282
  const form = useZodForm(config);
1197
- const [submissionState, setSubmissionState] = React15.useState({
1283
+ const [submissionState, setSubmissionState] = React16.useState({
1198
1284
  error: void 0,
1199
1285
  isSubmitted: false,
1200
1286
  isSubmitting: false,
@@ -1251,12 +1337,12 @@ function ZodForm({
1251
1337
  };
1252
1338
  const renderFields = () => {
1253
1339
  if (layout === "grid") {
1254
- return /* @__PURE__ */ React15.createElement(
1340
+ return /* @__PURE__ */ React16.createElement(
1255
1341
  "div",
1256
1342
  {
1257
1343
  className: `grid gap-${spacing} ${columns === 1 ? "grid-cols-1" : columns === 2 ? "grid-cols-1 md:grid-cols-2" : "grid-cols-1 md:grid-cols-2 lg:grid-cols-3"}`
1258
1344
  },
1259
- config.fields.map((field) => /* @__PURE__ */ React15.createElement(
1345
+ config.fields.map((field) => /* @__PURE__ */ React16.createElement(
1260
1346
  FormField,
1261
1347
  {
1262
1348
  key: field.name,
@@ -1268,7 +1354,7 @@ function ZodForm({
1268
1354
  );
1269
1355
  }
1270
1356
  if (layout === "horizontal") {
1271
- return /* @__PURE__ */ React15.createElement("div", { className: `grid gap-${spacing} grid-cols-1 md:grid-cols-2` }, config.fields.map((field) => /* @__PURE__ */ React15.createElement(
1357
+ return /* @__PURE__ */ React16.createElement("div", { className: `grid gap-${spacing} grid-cols-1 md:grid-cols-2` }, config.fields.map((field) => /* @__PURE__ */ React16.createElement(
1272
1358
  FormField,
1273
1359
  {
1274
1360
  key: field.name,
@@ -1278,7 +1364,7 @@ function ZodForm({
1278
1364
  }
1279
1365
  )));
1280
1366
  }
1281
- return /* @__PURE__ */ React15.createElement("div", { className: `space-y-${spacing}` }, config.fields.map((field) => /* @__PURE__ */ React15.createElement(
1367
+ return /* @__PURE__ */ React16.createElement("div", { className: `space-y-${spacing}` }, config.fields.map((field) => /* @__PURE__ */ React16.createElement(
1282
1368
  FormField,
1283
1369
  {
1284
1370
  key: field.name,
@@ -1292,7 +1378,7 @@ function ZodForm({
1292
1378
  e.preventDefault();
1293
1379
  void handleSubmit();
1294
1380
  };
1295
- React15.useEffect(() => {
1381
+ React16.useEffect(() => {
1296
1382
  if (config.onError && Object.keys(form.formState.errors).length > 0) {
1297
1383
  config.onError(form.formState.errors);
1298
1384
  }
@@ -1307,23 +1393,23 @@ function ZodForm({
1307
1393
  values: form.getValues()
1308
1394
  });
1309
1395
  }
1310
- return /* @__PURE__ */ React15.createElement("form", { className, role: "form", onSubmit: handleFormSubmit }, title && /* @__PURE__ */ React15.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React15.createElement("h2", { className: "text-xl font-semibold text-foreground mb-2" }, title), subtitle && /* @__PURE__ */ React15.createElement("p", { className: "text-sm text-muted-foreground" }, subtitle)), submissionState.isSubmitted && submissionState.isSuccess && /* @__PURE__ */ React15.createElement(
1396
+ return /* @__PURE__ */ React16.createElement("form", { className, role: "form", onSubmit: handleFormSubmit }, title && /* @__PURE__ */ React16.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React16.createElement("h2", { className: "text-xl font-semibold text-foreground mb-2" }, title), subtitle && /* @__PURE__ */ React16.createElement("p", { className: "text-sm text-muted-foreground" }, subtitle)), submissionState.isSubmitted && submissionState.isSuccess && /* @__PURE__ */ React16.createElement(
1311
1397
  "div",
1312
1398
  {
1313
1399
  className: "mb-6 p-4 bg-success-50 border border-success-200 rounded-lg",
1314
1400
  "data-testid": "success-message"
1315
1401
  },
1316
- /* @__PURE__ */ React15.createElement("p", { className: "text-success-800 font-medium" }, "Success!"),
1317
- /* @__PURE__ */ React15.createElement("p", { className: "text-success-700 text-sm mt-1" }, "Your request has been processed successfully.")
1318
- ), submissionState.error && errorDisplay !== "none" && /* @__PURE__ */ React15.createElement(
1402
+ /* @__PURE__ */ React16.createElement("p", { className: "text-success-800 font-medium" }, "Success!"),
1403
+ /* @__PURE__ */ React16.createElement("p", { className: "text-success-700 text-sm mt-1" }, "Your request has been processed successfully.")
1404
+ ), submissionState.error && errorDisplay !== "none" && /* @__PURE__ */ React16.createElement(
1319
1405
  "div",
1320
1406
  {
1321
1407
  className: "mb-6 p-4 bg-danger-50 border border-danger-200 rounded-lg",
1322
1408
  "data-testid": "error-message"
1323
1409
  },
1324
- /* @__PURE__ */ React15.createElement("p", { className: "text-danger-800 font-medium" }, "Error"),
1325
- /* @__PURE__ */ React15.createElement("p", { className: "text-danger-700 text-sm mt-1" }, submissionState.error)
1326
- ), renderFields(), /* @__PURE__ */ React15.createElement("div", { className: "mt-6 flex gap-3 justify-end" }, /* @__PURE__ */ React15.createElement(
1410
+ /* @__PURE__ */ React16.createElement("p", { className: "text-danger-800 font-medium" }, "Error"),
1411
+ /* @__PURE__ */ React16.createElement("p", { className: "text-danger-700 text-sm mt-1" }, submissionState.error)
1412
+ ), renderFields(), /* @__PURE__ */ React16.createElement("div", { className: "mt-6 flex gap-3 justify-end" }, /* @__PURE__ */ React16.createElement(
1327
1413
  Button3,
1328
1414
  {
1329
1415
  color: "primary",
@@ -1333,7 +1419,7 @@ function ZodForm({
1333
1419
  ...submitButtonProps
1334
1420
  },
1335
1421
  submitButtonText
1336
- ), showResetButton && /* @__PURE__ */ React15.createElement(
1422
+ ), showResetButton && /* @__PURE__ */ React16.createElement(
1337
1423
  Button3,
1338
1424
  {
1339
1425
  isDisabled: submissionState.isSubmitting,
@@ -1349,6 +1435,7 @@ export {
1349
1435
  ConfigurableForm,
1350
1436
  DateField,
1351
1437
  FileField,
1438
+ FontPickerField,
1352
1439
  FormField,
1353
1440
  FormProvider,
1354
1441
  HeroHookFormProvider,
@@ -1380,13 +1467,16 @@ export {
1380
1467
  createRequiredCheckboxSchema,
1381
1468
  createRequiredSchema,
1382
1469
  createUrlSchema,
1470
+ createZodFormConfig,
1383
1471
  getFieldError,
1384
1472
  getFormErrors,
1385
1473
  hasFieldError,
1386
1474
  hasFormErrors,
1387
1475
  simulateFieldInput,
1388
1476
  simulateFormSubmission,
1477
+ useFormContext2 as useFormContext,
1389
1478
  useFormHelper,
1479
+ useHeroForm,
1390
1480
  useHeroHookFormDefaults,
1391
1481
  useZodForm,
1392
1482
  waitForFormState