@bookinglab/booking-ui-react 1.11.2 → 1.12.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.
Files changed (7) hide show
  1. package/dist/index.d.cts +12 -0
  2. package/dist/index.d.ts +12 -0
  3. package/dist/index.js +223 -97
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.mjs +142 -20
  6. package/dist/index.mjs.map +1 -1
  7. package/package.json +1 -1
package/dist/index.d.cts CHANGED
@@ -859,6 +859,18 @@ interface BookingFormClassNames {
859
859
  errorText?: string;
860
860
  /** Submit button */
861
861
  button?: string;
862
+ /** Date field <fieldset> wrapper */
863
+ dateFieldset?: string;
864
+ /** Date field <legend> */
865
+ dateLegend?: string;
866
+ /** Flex row containing day/month/year items */
867
+ dateInputGroup?: string;
868
+ /** Each day/month/year wrapper */
869
+ dateInputItem?: string;
870
+ /** Small "Day"/"Month"/"Year" label */
871
+ dateInputLabel?: string;
872
+ /** Date sub-input element (falls back to `input` / `inputError`) */
873
+ dateInput?: string;
862
874
  }
863
875
  interface BookingFormProps {
864
876
  questions: Question[];
package/dist/index.d.ts CHANGED
@@ -859,6 +859,18 @@ interface BookingFormClassNames {
859
859
  errorText?: string;
860
860
  /** Submit button */
861
861
  button?: string;
862
+ /** Date field <fieldset> wrapper */
863
+ dateFieldset?: string;
864
+ /** Date field <legend> */
865
+ dateLegend?: string;
866
+ /** Flex row containing day/month/year items */
867
+ dateInputGroup?: string;
868
+ /** Each day/month/year wrapper */
869
+ dateInputItem?: string;
870
+ /** Small "Day"/"Month"/"Year" label */
871
+ dateInputLabel?: string;
872
+ /** Date sub-input element (falls back to `input` / `inputError`) */
873
+ dateInput?: string;
862
874
  }
863
875
  interface BookingFormProps {
864
876
  questions: Question[];
package/dist/index.js CHANGED
@@ -1,12 +1,129 @@
1
1
  'use strict';
2
2
 
3
- var react = require('react');
3
+ var React = require('react');
4
4
  var jsxRuntime = require('react/jsx-runtime');
5
5
 
6
+ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
+
8
+ var React__default = /*#__PURE__*/_interopDefault(React);
9
+
6
10
  var __defProp = Object.defineProperty;
7
11
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
8
12
  var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
9
13
  var cx = (...classes) => classes.filter(Boolean).join(" ");
14
+ function DateInputGroup({
15
+ question,
16
+ value,
17
+ onChange,
18
+ inputId,
19
+ hasError,
20
+ errorId,
21
+ fieldsetCls,
22
+ legendCls,
23
+ groupCls,
24
+ itemCls,
25
+ sublabelCls,
26
+ dateInputCls,
27
+ renderHelpText,
28
+ renderError
29
+ }) {
30
+ const parseValue = (raw) => {
31
+ const m = raw.match(/^(\d{4})-(\d{2})-(\d{2})$/);
32
+ if (!m) return { day: "", month: "", year: "" };
33
+ return { year: m[1], month: String(Number(m[2])), day: String(Number(m[3])) };
34
+ };
35
+ const [parts, setParts] = React.useState(() => parseValue(value));
36
+ const lastEmittedRef = React__default.default.useRef(value);
37
+ React.useEffect(() => {
38
+ if (value !== lastEmittedRef.current) {
39
+ setParts(parseValue(value));
40
+ lastEmittedRef.current = value;
41
+ }
42
+ }, [value]);
43
+ const buildValue = (d, m, y) => {
44
+ if (!/^\d{1,2}$/.test(d) || !/^\d{1,2}$/.test(m) || !/^\d{4}$/.test(y)) return "";
45
+ const dn = Number(d), mn = Number(m), yn = Number(y);
46
+ const date = new Date(yn, mn - 1, dn);
47
+ if (date.getFullYear() !== yn || date.getMonth() !== mn - 1 || date.getDate() !== dn) return "";
48
+ return `${String(yn).padStart(4, "0")}-${String(mn).padStart(2, "0")}-${String(dn).padStart(2, "0")}`;
49
+ };
50
+ const handleSubChange = (part, v) => {
51
+ const sanitized = v.replace(/[^\d]/g, "");
52
+ const max = part === "year" ? 4 : 2;
53
+ const next = { ...parts, [part]: sanitized.slice(0, max) };
54
+ setParts(next);
55
+ const combined = buildValue(next.day, next.month, next.year);
56
+ lastEmittedRef.current = combined;
57
+ onChange(combined);
58
+ };
59
+ const dayId = `${inputId}-day`;
60
+ const monthId = `${inputId}-month`;
61
+ const yearId = `${inputId}-year`;
62
+ return /* @__PURE__ */ jsxRuntime.jsxs("fieldset", { className: fieldsetCls, "aria-describedby": hasError ? errorId : void 0, children: [
63
+ /* @__PURE__ */ jsxRuntime.jsxs("legend", { className: legendCls, children: [
64
+ question.name,
65
+ question.required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-red-500 ml-1", "aria-hidden": "true", children: "*" })
66
+ ] }),
67
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: groupCls, role: "group", children: [
68
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: itemCls, children: [
69
+ /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: dayId, className: sublabelCls, children: "Day" }),
70
+ /* @__PURE__ */ jsxRuntime.jsx(
71
+ "input",
72
+ {
73
+ id: dayId,
74
+ type: "text",
75
+ inputMode: "numeric",
76
+ pattern: "[0-9]*",
77
+ maxLength: 2,
78
+ value: parts.day,
79
+ onChange: (e) => handleSubChange("day", e.target.value),
80
+ className: cx(dateInputCls, "w-16"),
81
+ "aria-invalid": hasError ? true : void 0,
82
+ "aria-required": question.required || void 0
83
+ }
84
+ )
85
+ ] }),
86
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: itemCls, children: [
87
+ /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: monthId, className: sublabelCls, children: "Month" }),
88
+ /* @__PURE__ */ jsxRuntime.jsx(
89
+ "input",
90
+ {
91
+ id: monthId,
92
+ type: "text",
93
+ inputMode: "numeric",
94
+ pattern: "[0-9]*",
95
+ maxLength: 2,
96
+ value: parts.month,
97
+ onChange: (e) => handleSubChange("month", e.target.value),
98
+ className: cx(dateInputCls, "w-16"),
99
+ "aria-invalid": hasError ? true : void 0,
100
+ "aria-required": question.required || void 0
101
+ }
102
+ )
103
+ ] }),
104
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: itemCls, children: [
105
+ /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: yearId, className: sublabelCls, children: "Year" }),
106
+ /* @__PURE__ */ jsxRuntime.jsx(
107
+ "input",
108
+ {
109
+ id: yearId,
110
+ type: "text",
111
+ inputMode: "numeric",
112
+ pattern: "[0-9]*",
113
+ maxLength: 4,
114
+ value: parts.year,
115
+ onChange: (e) => handleSubChange("year", e.target.value),
116
+ className: cx(dateInputCls, "w-24"),
117
+ "aria-invalid": hasError ? true : void 0,
118
+ "aria-required": question.required || void 0
119
+ }
120
+ )
121
+ ] })
122
+ ] }),
123
+ renderHelpText(),
124
+ renderError()
125
+ ] });
126
+ }
10
127
  function FormField({
11
128
  question,
12
129
  value,
@@ -149,25 +266,34 @@ function FormField({
149
266
  renderHelpText(),
150
267
  renderError()
151
268
  ] });
152
- case "date":
153
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classNames?.fieldWrapper ?? defaultFieldWrapper, children: [
154
- renderLabel(),
155
- /* @__PURE__ */ jsxRuntime.jsx(
156
- "input",
157
- {
158
- id: inputId,
159
- type: "date",
160
- value: value || "",
161
- onChange: (e) => onChange(e.target.value),
162
- min: question.settings?.min?.toString(),
163
- max: question.settings?.max?.toString(),
164
- className: inputClasses,
165
- ...ariaProps
166
- }
167
- ),
168
- renderHelpText(),
169
- renderError()
170
- ] });
269
+ case "date": {
270
+ const dateInputBase = classNames?.dateInput ?? classNames?.input ?? defaultInput;
271
+ const dateInputCls = hasError ? cx(dateInputBase, classNames?.inputError ?? defaultInputError) : dateInputBase;
272
+ const sublabelCls = classNames?.dateInputLabel ?? "block text-xs font-medium mb-1 text-gray-700";
273
+ const itemCls = classNames?.dateInputItem ?? "flex flex-col";
274
+ const groupCls = classNames?.dateInputGroup ?? "flex flex-row gap-3 items-end";
275
+ const legendCls = classNames?.dateLegend ?? labelClasses;
276
+ const fieldsetCls = classNames?.dateFieldset ?? (classNames?.fieldWrapper ?? defaultFieldWrapper);
277
+ return /* @__PURE__ */ jsxRuntime.jsx(
278
+ DateInputGroup,
279
+ {
280
+ question,
281
+ value: typeof value === "string" ? value : "",
282
+ onChange,
283
+ inputId,
284
+ hasError,
285
+ errorId,
286
+ fieldsetCls,
287
+ legendCls,
288
+ groupCls,
289
+ itemCls,
290
+ sublabelCls,
291
+ dateInputCls,
292
+ renderHelpText,
293
+ renderError
294
+ }
295
+ );
296
+ }
171
297
  case "number":
172
298
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classNames?.fieldWrapper ?? defaultFieldWrapper, children: [
173
299
  renderLabel(),
@@ -227,10 +353,10 @@ function BookingForm({
227
353
  ...classNamesProp,
228
354
  label: classNamesProp?.label ?? labelClassName
229
355
  };
230
- const [values, setValues] = react.useState({});
231
- const [errors, setErrors] = react.useState({});
232
- const [touched, setTouched] = react.useState({});
233
- const isQuestionVisible = react.useCallback(
356
+ const [values, setValues] = React.useState({});
357
+ const [errors, setErrors] = React.useState({});
358
+ const [touched, setTouched] = React.useState({});
359
+ const isQuestionVisible = React.useCallback(
234
360
  (question) => {
235
361
  const { settings } = question;
236
362
  if (!settings?.conditional_answers) {
@@ -323,7 +449,7 @@ function BookingForm({
323
449
  [values, questions]
324
450
  );
325
451
  const visibleQuestions = questions.filter((q) => isAdmin || !q.admin_only).filter(isQuestionVisible);
326
- const validateField = react.useCallback((question, value) => {
452
+ const validateField = React.useCallback((question, value) => {
327
453
  if (question.detail_type === "heading") return null;
328
454
  if (question.required) {
329
455
  if (value === void 0 || value === "" || value === null) {
@@ -344,7 +470,7 @@ function BookingForm({
344
470
  }
345
471
  return null;
346
472
  }, []);
347
- const validateAll = react.useCallback(() => {
473
+ const validateAll = React.useCallback(() => {
348
474
  const newErrors = {};
349
475
  let isValid2 = true;
350
476
  visibleQuestions.forEach((question) => {
@@ -357,7 +483,7 @@ function BookingForm({
357
483
  setErrors(newErrors);
358
484
  return isValid2;
359
485
  }, [visibleQuestions, values, validateField]);
360
- react.useEffect(() => {
486
+ React.useEffect(() => {
361
487
  const visibleIds = new Set(visibleQuestions.map((q) => q.id));
362
488
  setErrors((prev) => {
363
489
  let changed = false;
@@ -560,7 +686,7 @@ var DEFAULT_FIELDS = [
560
686
  }
561
687
  ];
562
688
  var HIDEABLE_FIELDS = ["address1", "address2", "city", "postcode"];
563
- var RegistrationForm = react.forwardRef(
689
+ var RegistrationForm = React.forwardRef(
564
690
  ({
565
691
  fields = DEFAULT_FIELDS,
566
692
  additionalFields,
@@ -572,10 +698,10 @@ var RegistrationForm = react.forwardRef(
572
698
  classNames = {},
573
699
  fieldSettings = {}
574
700
  }, ref) => {
575
- const formId = react.useId();
576
- const [values, setValues] = react.useState({});
577
- const [errors, setErrors] = react.useState({});
578
- const [touched, setTouched] = react.useState({});
701
+ const formId = React.useId();
702
+ const [values, setValues] = React.useState({});
703
+ const [errors, setErrors] = React.useState({});
704
+ const [touched, setTouched] = React.useState({});
579
705
  const visibleFields = fields.filter((field) => {
580
706
  if (HIDEABLE_FIELDS.includes(field.name)) {
581
707
  const setting = fieldSettings[field.name];
@@ -584,7 +710,7 @@ var RegistrationForm = react.forwardRef(
584
710
  return true;
585
711
  });
586
712
  const allFields = additionalFields ? [...visibleFields, ...additionalFields] : visibleFields;
587
- const validateMatching = react.useCallback(
713
+ const validateMatching = React.useCallback(
588
714
  (fieldName, value, currentValues) => {
589
715
  if (fieldName === "verifyEmail") {
590
716
  if (value && currentValues.email && value !== currentValues.email) {
@@ -600,7 +726,7 @@ var RegistrationForm = react.forwardRef(
600
726
  },
601
727
  []
602
728
  );
603
- const validateField = react.useCallback(
729
+ const validateField = React.useCallback(
604
730
  (field, value, currentValues) => {
605
731
  if (field.required && (!value || value.trim() === "")) {
606
732
  return "This field is required";
@@ -615,7 +741,7 @@ var RegistrationForm = react.forwardRef(
615
741
  },
616
742
  [validateMatching]
617
743
  );
618
- const validateAll = react.useCallback(() => {
744
+ const validateAll = React.useCallback(() => {
619
745
  const newErrors = {};
620
746
  let isValid2 = true;
621
747
  for (const field of allFields) {
@@ -629,7 +755,7 @@ var RegistrationForm = react.forwardRef(
629
755
  setErrors(newErrors);
630
756
  return isValid2;
631
757
  }, [allFields, values, validateField]);
632
- const checkIsValid = react.useCallback(
758
+ const checkIsValid = React.useCallback(
633
759
  (currentValues) => {
634
760
  for (const field of allFields) {
635
761
  const value = currentValues[field.name] || "";
@@ -640,7 +766,7 @@ var RegistrationForm = react.forwardRef(
640
766
  },
641
767
  [allFields, validateField]
642
768
  );
643
- const handleChange = react.useCallback(
769
+ const handleChange = React.useCallback(
644
770
  (fieldName, value) => {
645
771
  const newValues = { ...values, [fieldName]: value };
646
772
  setValues(newValues);
@@ -694,14 +820,14 @@ var RegistrationForm = react.forwardRef(
694
820
  },
695
821
  [values, touched, allFields, validateField, onChange, checkIsValid]
696
822
  );
697
- const handleCheckboxChange = react.useCallback(
823
+ const handleCheckboxChange = React.useCallback(
698
824
  (fieldName, checked) => {
699
825
  const value = checked ? "true" : "";
700
826
  handleChange(fieldName, value);
701
827
  },
702
828
  [handleChange]
703
829
  );
704
- const handleBlur = react.useCallback(
830
+ const handleBlur = React.useCallback(
705
831
  (fieldName) => {
706
832
  setTouched((prev) => ({ ...prev, [fieldName]: true }));
707
833
  if (validateOnBlur) {
@@ -723,7 +849,7 @@ var RegistrationForm = react.forwardRef(
723
849
  },
724
850
  [validateOnBlur, allFields, values, validateField]
725
851
  );
726
- const handleSubmit = react.useCallback(
852
+ const handleSubmit = React.useCallback(
727
853
  (e) => {
728
854
  e.preventDefault();
729
855
  const allTouched = {};
@@ -737,7 +863,7 @@ var RegistrationForm = react.forwardRef(
737
863
  },
738
864
  [allFields, validateAll, onSubmit, values]
739
865
  );
740
- react.useImperativeHandle(
866
+ React.useImperativeHandle(
741
867
  ref,
742
868
  () => ({
743
869
  reset: () => {
@@ -853,7 +979,7 @@ var RegistrationForm = react.forwardRef(
853
979
  );
854
980
  RegistrationForm.displayName = "RegistrationForm";
855
981
  var cx2 = (...classes) => classes.filter(Boolean).join(" ");
856
- var ContactDetailsForm = react.forwardRef(
982
+ var ContactDetailsForm = React.forwardRef(
857
983
  ({
858
984
  questions = [],
859
985
  onSubmit,
@@ -867,13 +993,13 @@ var ContactDetailsForm = react.forwardRef(
867
993
  hideSubmitButton = false,
868
994
  isSubmitted = false
869
995
  }, ref) => {
870
- const formId = react.useId();
871
- const [firstName, setFirstName] = react.useState(initialValues?.firstName || "");
872
- const [lastName, setLastName] = react.useState(initialValues?.lastName || "");
873
- const [emailValue, setEmailValue] = react.useState(initialValues?.email || "");
874
- const [contactErrors, setContactErrors] = react.useState({});
875
- const [contactTouched, setContactTouched] = react.useState({});
876
- const [questionValues, setQuestionValues] = react.useState(() => {
996
+ const formId = React.useId();
997
+ const [firstName, setFirstName] = React.useState(initialValues?.firstName || "");
998
+ const [lastName, setLastName] = React.useState(initialValues?.lastName || "");
999
+ const [emailValue, setEmailValue] = React.useState(initialValues?.email || "");
1000
+ const [contactErrors, setContactErrors] = React.useState({});
1001
+ const [contactTouched, setContactTouched] = React.useState({});
1002
+ const [questionValues, setQuestionValues] = React.useState(() => {
877
1003
  if (!initialValues?.questions) return {};
878
1004
  const init = {};
879
1005
  for (const [key, val] of Object.entries(initialValues.questions)) {
@@ -881,8 +1007,8 @@ var ContactDetailsForm = react.forwardRef(
881
1007
  }
882
1008
  return init;
883
1009
  });
884
- const [questionErrors, setQuestionErrors] = react.useState({});
885
- const [questionTouched, setQuestionTouched] = react.useState({});
1010
+ const [questionErrors, setQuestionErrors] = React.useState({});
1011
+ const [questionTouched, setQuestionTouched] = React.useState({});
886
1012
  const getFieldRequired = (name) => {
887
1013
  const s = fieldSettings[name];
888
1014
  return s?.required !== void 0 ? s.required : true;
@@ -896,7 +1022,7 @@ var ContactDetailsForm = react.forwardRef(
896
1022
  { name: "lastName", label: "Last name", value: lastName, setter: setLastName },
897
1023
  { name: "email", label: "Email", value: emailValue, setter: setEmailValue }
898
1024
  ];
899
- const validateContactField = react.useCallback((name, value) => {
1025
+ const validateContactField = React.useCallback((name, value) => {
900
1026
  const isRequired = getFieldRequired(name);
901
1027
  if (name === "email") {
902
1028
  const validators = isRequired ? compose(required, email) : email;
@@ -904,7 +1030,7 @@ var ContactDetailsForm = react.forwardRef(
904
1030
  }
905
1031
  return isRequired ? required(value) : null;
906
1032
  }, [fieldSettings]);
907
- const validateQuestionField = react.useCallback((question, value) => {
1033
+ const validateQuestionField = React.useCallback((question, value) => {
908
1034
  if (question.detail_type === "heading") return null;
909
1035
  if (question.disabled) return null;
910
1036
  if (question.required) {
@@ -926,7 +1052,7 @@ var ContactDetailsForm = react.forwardRef(
926
1052
  }
927
1053
  return null;
928
1054
  }, []);
929
- const validateAllContacts = react.useCallback(() => {
1055
+ const validateAllContacts = React.useCallback(() => {
930
1056
  const errs = {};
931
1057
  let valid = true;
932
1058
  for (const f of contactFields) {
@@ -940,7 +1066,7 @@ var ContactDetailsForm = react.forwardRef(
940
1066
  setContactErrors(errs);
941
1067
  return valid;
942
1068
  }, [firstName, lastName, emailValue, validateContactField, fieldSettings]);
943
- const validateAllQuestions = react.useCallback(() => {
1069
+ const validateAllQuestions = React.useCallback(() => {
944
1070
  const errs = {};
945
1071
  let valid = true;
946
1072
  for (const q of questions) {
@@ -953,7 +1079,7 @@ var ContactDetailsForm = react.forwardRef(
953
1079
  setQuestionErrors(errs);
954
1080
  return valid;
955
1081
  }, [questions, questionValues, validateQuestionField]);
956
- const buildOutput = react.useCallback(() => {
1082
+ const buildOutput = React.useCallback(() => {
957
1083
  const q = {};
958
1084
  const answers = [];
959
1085
  for (const question of questions) {
@@ -977,7 +1103,7 @@ var ContactDetailsForm = react.forwardRef(
977
1103
  }
978
1104
  return { firstName, lastName, email: emailValue, q, answers };
979
1105
  }, [firstName, lastName, emailValue, questions, questionValues]);
980
- const handleContactChange = react.useCallback((name, value) => {
1106
+ const handleContactChange = React.useCallback((name, value) => {
981
1107
  const setter = name === "firstName" ? setFirstName : name === "lastName" ? setLastName : setEmailValue;
982
1108
  setter(value);
983
1109
  if (contactTouched[name]) {
@@ -989,7 +1115,7 @@ var ContactDetailsForm = react.forwardRef(
989
1115
  });
990
1116
  }
991
1117
  }, [contactTouched, validateContactField]);
992
- const handleContactBlur = react.useCallback((name, value) => {
1118
+ const handleContactBlur = React.useCallback((name, value) => {
993
1119
  setContactTouched((prev) => ({ ...prev, [name]: true }));
994
1120
  if (validateOnBlur) {
995
1121
  const err = validateContactField(name, value);
@@ -1000,7 +1126,7 @@ var ContactDetailsForm = react.forwardRef(
1000
1126
  });
1001
1127
  }
1002
1128
  }, [validateOnBlur, validateContactField]);
1003
- const handleQuestionChange = react.useCallback((questionId, value) => {
1129
+ const handleQuestionChange = React.useCallback((questionId, value) => {
1004
1130
  setQuestionValues((prev) => ({ ...prev, [questionId]: value }));
1005
1131
  setQuestionTouched((prev) => ({ ...prev, [questionId]: true }));
1006
1132
  if (questionTouched[questionId]) {
@@ -1015,7 +1141,7 @@ var ContactDetailsForm = react.forwardRef(
1015
1141
  }
1016
1142
  }
1017
1143
  }, [questionTouched, questions, validateQuestionField]);
1018
- const handleQuestionBlur = react.useCallback((questionId) => {
1144
+ const handleQuestionBlur = React.useCallback((questionId) => {
1019
1145
  setQuestionTouched((prev) => ({ ...prev, [questionId]: true }));
1020
1146
  if (validateOnBlur) {
1021
1147
  const question = questions.find((q) => q.id === questionId);
@@ -1029,7 +1155,7 @@ var ContactDetailsForm = react.forwardRef(
1029
1155
  }
1030
1156
  }
1031
1157
  }, [validateOnBlur, questions, questionValues, validateQuestionField]);
1032
- const handleSubmit = react.useCallback((e) => {
1158
+ const handleSubmit = React.useCallback((e) => {
1033
1159
  e.preventDefault();
1034
1160
  const allContactTouched = {};
1035
1161
  for (const f of contactFields) allContactTouched[f.name] = true;
@@ -1043,7 +1169,7 @@ var ContactDetailsForm = react.forwardRef(
1043
1169
  onSubmit(buildOutput());
1044
1170
  }
1045
1171
  }, [contactFields, questions, validateAllContacts, validateAllQuestions, onSubmit, buildOutput]);
1046
- react.useImperativeHandle(ref, () => ({
1172
+ React.useImperativeHandle(ref, () => ({
1047
1173
  reset: () => {
1048
1174
  setFirstName(initialValues?.firstName || "");
1049
1175
  setLastName(initialValues?.lastName || "");
@@ -1272,13 +1398,13 @@ var ContactDetailsForm = react.forwardRef(
1272
1398
  return null;
1273
1399
  }
1274
1400
  };
1275
- react.useEffect(() => {
1401
+ React.useEffect(() => {
1276
1402
  if (isSubmitted) {
1277
1403
  validateAllContacts();
1278
1404
  validateAllQuestions();
1279
1405
  }
1280
1406
  }, [isSubmitted]);
1281
- react.useEffect(() => {
1407
+ React.useEffect(() => {
1282
1408
  if (hideSubmitButton && _onChange) {
1283
1409
  const contactValid = !contactFields.some((f) => {
1284
1410
  if (getFieldDisabled(f.name)) return false;
@@ -1305,7 +1431,7 @@ var FIELDS = [
1305
1431
  { name: "newPassword", label: "New Password" },
1306
1432
  { name: "confirmNewPassword", label: "Confirm New Password" }
1307
1433
  ];
1308
- var ResetPasswordForm = react.forwardRef(
1434
+ var ResetPasswordForm = React.forwardRef(
1309
1435
  ({
1310
1436
  onSubmit,
1311
1437
  onChange,
@@ -1314,15 +1440,15 @@ var ResetPasswordForm = react.forwardRef(
1314
1440
  className = "",
1315
1441
  classNames = {}
1316
1442
  }, ref) => {
1317
- const formId = react.useId();
1318
- const [values, setValues] = react.useState({
1443
+ const formId = React.useId();
1444
+ const [values, setValues] = React.useState({
1319
1445
  currentPassword: "",
1320
1446
  newPassword: "",
1321
1447
  confirmNewPassword: ""
1322
1448
  });
1323
- const [errors, setErrors] = react.useState({});
1324
- const [touched, setTouched] = react.useState({});
1325
- const validateField = react.useCallback(
1449
+ const [errors, setErrors] = React.useState({});
1450
+ const [touched, setTouched] = React.useState({});
1451
+ const validateField = React.useCallback(
1326
1452
  (name, val, allValues) => {
1327
1453
  if (!val || val.trim() === "") return "This field is required";
1328
1454
  if (name === "confirmNewPassword" && val !== allValues.newPassword) {
@@ -1332,7 +1458,7 @@ var ResetPasswordForm = react.forwardRef(
1332
1458
  },
1333
1459
  []
1334
1460
  );
1335
- const checkIsValid = react.useCallback(
1461
+ const checkIsValid = React.useCallback(
1336
1462
  (v) => {
1337
1463
  for (const field of FIELDS) {
1338
1464
  if (validateField(field.name, v[field.name], v)) return false;
@@ -1341,7 +1467,7 @@ var ResetPasswordForm = react.forwardRef(
1341
1467
  },
1342
1468
  [validateField]
1343
1469
  );
1344
- const handleChange = react.useCallback(
1470
+ const handleChange = React.useCallback(
1345
1471
  (name, val) => {
1346
1472
  const newValues = { ...values, [name]: val };
1347
1473
  setValues(newValues);
@@ -1371,7 +1497,7 @@ var ResetPasswordForm = react.forwardRef(
1371
1497
  },
1372
1498
  [values, touched, validateField, onChange, checkIsValid]
1373
1499
  );
1374
- const handleBlur = react.useCallback(
1500
+ const handleBlur = React.useCallback(
1375
1501
  (name) => {
1376
1502
  setTouched((prev) => ({ ...prev, [name]: true }));
1377
1503
  if (validateOnBlur) {
@@ -1389,7 +1515,7 @@ var ResetPasswordForm = react.forwardRef(
1389
1515
  },
1390
1516
  [validateOnBlur, values, validateField]
1391
1517
  );
1392
- const handleSubmit = react.useCallback(
1518
+ const handleSubmit = React.useCallback(
1393
1519
  (e) => {
1394
1520
  e.preventDefault();
1395
1521
  const allTouched = {};
@@ -1414,7 +1540,7 @@ var ResetPasswordForm = react.forwardRef(
1414
1540
  },
1415
1541
  [values, validateField, onSubmit]
1416
1542
  );
1417
- react.useImperativeHandle(ref, () => ({
1543
+ React.useImperativeHandle(ref, () => ({
1418
1544
  reset: () => {
1419
1545
  setValues({ currentPassword: "", newPassword: "", confirmNewPassword: "" });
1420
1546
  setErrors({});
@@ -4367,30 +4493,30 @@ function SchemaFormBuilder(props) {
4367
4493
  onVenueSet,
4368
4494
  onProcessing
4369
4495
  } = props;
4370
- const [formValues, setFormValues] = react.useState({});
4371
- const [formFields, setFormFields] = react.useState([]);
4372
- const [schema, setSchema] = react.useState(null);
4373
- const [showSubmit, setShowSubmit] = react.useState(showSubmitProp ?? false);
4374
- const [loading, setLoading] = react.useState(true);
4375
- const [suggestions, setSuggestions] = react.useState([]);
4376
- const [, _setSearching] = react.useState(false);
4377
- const [searchText, setSearchText] = react.useState("");
4378
- const [touchedFields, setTouchedFields] = react.useState(/* @__PURE__ */ new Set());
4379
- const [dirtyFields, setDirtyFields] = react.useState(/* @__PURE__ */ new Set());
4380
- const formServicesRef = react.useRef({});
4381
- const extraItemsRef = react.useRef([]);
4382
- const pendingExtraItemFetchesRef = react.useRef(/* @__PURE__ */ new Set());
4383
- const venueSearchTimerRef = react.useRef(null);
4384
- const activeFormIdRef = react.useRef("");
4385
- const initialisedRef = react.useRef(false);
4386
- const validatorMapRef = react.useRef(/* @__PURE__ */ new Map());
4387
- react.useEffect(() => {
4496
+ const [formValues, setFormValues] = React.useState({});
4497
+ const [formFields, setFormFields] = React.useState([]);
4498
+ const [schema, setSchema] = React.useState(null);
4499
+ const [showSubmit, setShowSubmit] = React.useState(showSubmitProp ?? false);
4500
+ const [loading, setLoading] = React.useState(true);
4501
+ const [suggestions, setSuggestions] = React.useState([]);
4502
+ const [, _setSearching] = React.useState(false);
4503
+ const [searchText, setSearchText] = React.useState("");
4504
+ const [touchedFields, setTouchedFields] = React.useState(/* @__PURE__ */ new Set());
4505
+ const [dirtyFields, setDirtyFields] = React.useState(/* @__PURE__ */ new Set());
4506
+ const formServicesRef = React.useRef({});
4507
+ const extraItemsRef = React.useRef([]);
4508
+ const pendingExtraItemFetchesRef = React.useRef(/* @__PURE__ */ new Set());
4509
+ const venueSearchTimerRef = React.useRef(null);
4510
+ const activeFormIdRef = React.useRef("");
4511
+ const initialisedRef = React.useRef(false);
4512
+ const validatorMapRef = React.useRef(/* @__PURE__ */ new Map());
4513
+ React.useEffect(() => {
4388
4514
  if (initialisedRef.current && formUpdateId === activeFormIdRef.current && !initialSchema) return;
4389
4515
  initialisedRef.current = true;
4390
4516
  activeFormIdRef.current = formUpdateId ?? formId;
4391
4517
  initialiseForm(formUpdateId ?? formId);
4392
4518
  }, [formId, formUpdateId, initialSchema]);
4393
- react.useEffect(() => {
4519
+ React.useEffect(() => {
4394
4520
  if (formFields.length > 0) {
4395
4521
  refreshVisibility();
4396
4522
  }
@@ -4417,7 +4543,7 @@ function SchemaFormBuilder(props) {
4417
4543
  });
4418
4544
  }
4419
4545
  }, [formValues]);
4420
- react.useEffect(() => {
4546
+ React.useEffect(() => {
4421
4547
  if (!formFields.length) return;
4422
4548
  const visibleFieldsWithExtraItems = formFields.filter(
4423
4549
  (f) => f.page === currentPage && (f.visible || f.is_visible) && (f["extra-item"] || f.resource_ids)
@@ -4426,14 +4552,14 @@ function SchemaFormBuilder(props) {
4426
4552
  void setExtraItems(field);
4427
4553
  }
4428
4554
  }, [formFields, formValues]);
4429
- react.useEffect(() => {
4555
+ React.useEffect(() => {
4430
4556
  return () => {
4431
4557
  if (venueSearchTimerRef.current) {
4432
4558
  clearTimeout(venueSearchTimerRef.current);
4433
4559
  }
4434
4560
  };
4435
4561
  }, []);
4436
- const setFieldValue = react.useCallback(
4562
+ const setFieldValue = React.useCallback(
4437
4563
  (fieldName, value, _options) => {
4438
4564
  setFormValues((prev) => ({ ...prev, [fieldName]: value }));
4439
4565
  persistAnswer(formId, fieldName, value);