@ultraviolet/form 2.13.3 → 2.13.4

package/dist/components/CheckboxField/index.js

@@ -21,10 +21,14 @@ const CheckboxField = ({
   "data-testid": dataTestId,
   shouldUnregister = false
 }) => {
-  const { getError } = useErrors();
+  const {
+    getError
+  } = useErrors();
   const {
     field,
-    fieldState: { error }
+    fieldState: {
+      error
+    }
   } = useController({
     name,
     disabled,
@@ -34,36 +38,15 @@ const CheckboxField = ({
       ...rules
     }
   });
-  return /* @__PURE__ */ jsx(
-    Checkbox,
-    {
-      id,
-      name: field.name,
-      onChange: (event) => {
-        field.onChange(event.target.checked);
-        onChange?.(
-          event.target.checked
-        );
-      },
-      onBlur: (event) => {
-        field.onBlur();
-        onBlur?.(event);
-      },
-      onFocus,
-      size,
-      progress,
-      disabled: field.disabled,
-      checked: !!field.value,
-      error: getError({ label: label ?? "" }, error),
-      ref: field.ref,
-      className,
-      required,
-      "data-testid": dataTestId,
-      helper,
-      tooltip,
-      children
-    }
-  );
+  return /* @__PURE__ */ jsx(Checkbox, { id, name: field.name, onChange: (event) => {
+    field.onChange(event.target.checked);
+    onChange?.(event.target.checked);
+  }, onBlur: (event) => {
+    field.onBlur();
+    onBlur?.(event);
+  }, onFocus, size, progress, disabled: field.disabled, checked: !!field.value, error: getError({
+    label: label ?? ""
+  }, error), ref: field.ref, className, required, "data-testid": dataTestId, helper, tooltip, children });
 };
 export {
   CheckboxField

package/dist/components/CheckboxGroupField/index.js

@@ -23,31 +23,32 @@ const CheckboxGroupField = ({
   shouldUnregister = false,
   rules
 }) => {
-  const { getError } = useErrors();
-  const validate = useCallback(
-    (value) => {
-      const requiredChildren = Children.map(children, (child) => {
-        if (isValidElement(child)) {
-          if (child.props.required) {
-            return child.props.name;
-          }
-          return null;
+  const {
+    getError
+  } = useErrors();
+  const validate = useCallback((value) => {
+    const requiredChildren = Children.map(children, (child) => {
+      if (isValidElement(child)) {
+        if (child.props.required) {
+          return child.props.name;
         }
         return null;
-      })?.filter(Boolean) ?? [];
-      if (!required && arraysContainSameValues(value, requiredChildren)) {
-        return true;
-      }
-      if (value.length >= Children.count(children)) {
-        return true;
       }
-      return false;
-    },
-    [children, required]
-  );
+      return null;
+    })?.filter(Boolean) ?? [];
+    if (!required && arraysContainSameValues(value, requiredChildren)) {
+      return true;
+    }
+    if (value.length >= Children.count(children)) {
+      return true;
+    }
+    return false;
+  }, [children, required]);
   const {
     field,
-    fieldState: { error }
+    fieldState: {
+      error
+    }
   } = useController({
     name,
     shouldUnregister,
@@ -56,35 +57,17 @@ const CheckboxGroupField = ({
       ...rules
     }
   });
-  return /* @__PURE__ */ jsx(
-    CheckboxGroup,
-    {
-      legend,
-      name,
-      value: field.value,
-      onChange: (event) => {
-        const fieldValue = field.value;
-        if (fieldValue?.includes(event.currentTarget.value)) {
-          field.onChange(
-            fieldValue?.filter(
-              (currentValue) => currentValue !== event.currentTarget.value
-            )
-          );
-        } else {
-          field.onChange([...field.value, event.currentTarget.value]);
-        }
-        onChange?.(
-          event.currentTarget.value
-        );
-      },
-      error: getError({ label }, error) ?? customError,
-      className,
-      direction,
-      helper,
-      required,
-      children
+  return /* @__PURE__ */ jsx(CheckboxGroup, { legend, name, value: field.value, onChange: (event) => {
+    const fieldValue = field.value;
+    if (fieldValue?.includes(event.currentTarget.value)) {
+      field.onChange(fieldValue?.filter((currentValue) => currentValue !== event.currentTarget.value));
+    } else {
+      field.onChange([...field.value, event.currentTarget.value]);
     }
-  );
+    onChange?.(event.currentTarget.value);
+  }, error: getError({
+    label
+  }, error) ?? customError, className, direction, helper, required, children });
 };
 CheckboxGroupField.Checkbox = CheckboxGroup.Checkbox;
 export {

package/dist/components/DateField/index.js

@@ -25,10 +25,14 @@ const DateField = ({
   "data-testid": dataTestId,
   shouldUnregister = false
 }) => {
-  const { getError } = useErrors();
+  const {
+    getError
+  } = useErrors();
   const {
     field,
-    fieldState: { error }
+    fieldState: {
+      error
+    }
   } = useController({
     name,
     shouldUnregister,
@@ -42,47 +46,28 @@ const DateField = ({
       required
     }
   });
-  return /* @__PURE__ */ jsx(
-    DateInput,
-    {
-      name: field.name,
-      label,
-      value: field.value,
-      format: format || ((value) => value ? parseDate(value).toLocaleDateString() : ""),
-      locale,
-      required,
-      onChange: (val) => {
-        if (val && val instanceof Date) {
-          onChange?.(val);
-          const newDate = parseDate(val);
-          if (isEmpty(field.value)) {
-            field.onChange(newDate);
-            return;
-          }
-          const currentDate = parseDate(field.value);
-          newDate.setHours(currentDate.getHours(), currentDate.getMinutes());
-          field.onChange(newDate);
-        } else if (Array.isArray(val)) {
-          field.onChange(val);
-        }
-      },
-      onBlur: (e) => {
-        field.onBlur();
-        onBlur?.(e);
-      },
-      onFocus,
-      maxDate,
-      minDate,
-      error: getError({ minDate, maxDate, label }, error),
-      disabled,
-      autoFocus,
-      excludeDates,
-      selectsRange,
-      "data-testid": dataTestId,
-      startDate: selectsRange && Array.isArray(field.value) ? field.value[0] : void 0,
-      endDate: selectsRange && Array.isArray(field.value) ? field.value[1] : void 0
+  return /* @__PURE__ */ jsx(DateInput, { name: field.name, label, value: field.value, format: format || ((value) => value ? parseDate(value).toLocaleDateString() : ""), locale, required, onChange: (val) => {
+    if (val && val instanceof Date) {
+      onChange?.(val);
+      const newDate = parseDate(val);
+      if (isEmpty(field.value)) {
+        field.onChange(newDate);
+        return;
+      }
+      const currentDate = parseDate(field.value);
+      newDate.setHours(currentDate.getHours(), currentDate.getMinutes());
+      field.onChange(newDate);
+    } else if (Array.isArray(val)) {
+      field.onChange(val);
     }
-  );
+  }, onBlur: (e) => {
+    field.onBlur();
+    onBlur?.(e);
+  }, onFocus, maxDate, minDate, error: getError({
+    minDate,
+    maxDate,
+    label
+  }, error), disabled, autoFocus, excludeDates, selectsRange, "data-testid": dataTestId, startDate: selectsRange && Array.isArray(field.value) ? field.value[0] : void 0, endDate: selectsRange && Array.isArray(field.value) ? field.value[1] : void 0 });
 };
 export {
   DateField

package/dist/components/Form/index.js

@@ -4,9 +4,7 @@ import { useForm, FormProvider } from "react-hook-form";
 import { FORM_ERROR } from "../../constants.js";
 import { defaultErrors } from "./defaultErrors.js";
 import { ErrorProvider } from "../../providers/ErrorContext/index.js";
-const FormSubmitContext = React.createContext(
-  {}
-);
+const FormSubmitContext = React.createContext({});
 const Form = ({
   children,
   methods: methodsProp,
@@ -40,37 +38,31 @@ const Form = ({
       });
     }
   });
-  const formSubmitContextValue = useMemo(
-    () => ({ handleSubmit }),
-    [handleSubmit]
-  );
-  return /* @__PURE__ */ jsx(FormProvider, { ...methods, children: /* @__PURE__ */ jsx(FormSubmitContext.Provider, { value: formSubmitContextValue, children: /* @__PURE__ */ jsx(ErrorProvider, { errors: { ...defaultErrors, ...errors }, children: /* @__PURE__ */ jsx(
-    "form",
-    {
-      onSubmit: async (e) => {
-        e.preventDefault();
-        e.stopPropagation();
-        await handleSubmit(e);
-      },
-      name,
-      noValidate: true,
-      children: typeof children === "function" ? children({
-        values: methods.watch(),
-        hasValidationErrors: !methods.formState.isValid,
-        errors: methods.formState.errors,
-        submitting: methods.formState.isSubmitting,
-        pristine: !methods.formState.isDirty,
-        handleSubmit,
-        submitError: !!methods.formState.errors?.root?.["submit"],
-        valid: methods.formState.isValid,
-        form: {
-          change: methods.setValue,
-          reset: methods.reset,
-          submit: handleSubmit
-        }
-      }) : children
+  const formSubmitContextValue = useMemo(() => ({
+    handleSubmit
+  }), [handleSubmit]);
+  return /* @__PURE__ */ jsx(FormProvider, { ...methods, children: /* @__PURE__ */ jsx(FormSubmitContext.Provider, { value: formSubmitContextValue, children: /* @__PURE__ */ jsx(ErrorProvider, { errors: {
+    ...defaultErrors,
+    ...errors
+  }, children: /* @__PURE__ */ jsx("form", { onSubmit: async (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    await handleSubmit(e);
+  }, name, noValidate: true, children: typeof children === "function" ? children({
+    values: methods.watch(),
+    hasValidationErrors: !methods.formState.isValid,
+    errors: methods.formState.errors,
+    submitting: methods.formState.isSubmitting,
+    pristine: !methods.formState.isDirty,
+    handleSubmit,
+    submitError: !!methods.formState.errors?.root?.["submit"],
+    valid: methods.formState.isValid,
+    form: {
+      change: methods.setValue,
+      reset: methods.reset,
+      submit: handleSubmit
     }
-  ) }) }) });
+  }) : children }) }) }) });
 };
 export {
   Form,

package/dist/components/KeyValueField/index.js

@@ -11,59 +11,22 @@ const KeyValueField = ({
   readonly = false,
   control
 }) => {
-  const { fields, append, remove } = useFieldArray({
+  const {
+    fields,
+    append,
+    remove
+  } = useFieldArray({
     name,
     control
   });
   const canAdd = fields.length !== void 0 && fields.length < maxSize;
   const maxSizeReachedTooltip = addButton.maxSizeReachedTooltip ?? `Cannot add more than ${maxSize} elements`;
   return /* @__PURE__ */ jsxs(Stack, { gap: 3, children: [
-    fields.length ? /* @__PURE__ */ jsx(Stack, { gap: 3, children: fields.map((field, index) => /* @__PURE__ */ jsxs(
-      Row,
-      {
-        templateColumns: "1fr 1fr auto",
-        gap: 2,
-        alignItems: "end",
-        children: [
-          /* @__PURE__ */ jsx(
-            TextInputField,
-            {
-              readOnly: readonly,
-              required: inputKey.required,
-              name: `${name}.${index}.key`,
-              label: inputKey.label,
-              regex: inputKey.regex
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            TextInputField,
-            {
-              readOnly: readonly,
-              required: inputValue.required,
-              name: `${name}.${index}.value`,
-              label: inputValue.label,
-              placeholder: inputValue.placeholder,
-              type: inputValue.type,
-              autoComplete: "off",
-              regex: inputValue.regex
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            Button,
-            {
-              disabled: readonly,
-              "data-testid": `remove-button-${index}`,
-              icon: "delete",
-              variant: "outlined",
-              sentiment: "danger",
-              size: "large",
-              onClick: () => remove(index)
-            }
-          )
-        ]
-      },
-      field.id
-    )) }) : null,
+    fields.length ? /* @__PURE__ */ jsx(Stack, { gap: 3, children: fields.map((field, index) => /* @__PURE__ */ jsxs(Row, { templateColumns: "1fr 1fr auto", gap: 2, alignItems: "end", children: [
+      /* @__PURE__ */ jsx(TextInputField, { readOnly: readonly, required: inputKey.required, name: `${name}.${index}.key`, label: inputKey.label, regex: inputKey.regex }),
+      /* @__PURE__ */ jsx(TextInputField, { readOnly: readonly, required: inputValue.required, name: `${name}.${index}.value`, label: inputValue.label, placeholder: inputValue.placeholder, type: inputValue.type, autoComplete: "off", regex: inputValue.regex }),
+      /* @__PURE__ */ jsx(Button, { disabled: readonly, "data-testid": `remove-button-${index}`, icon: "delete", variant: "outlined", sentiment: "danger", size: "large", onClick: () => remove(index) })
+    ] }, field.id)) }) : null,
     /* @__PURE__ */ jsx(Stack, { direction: "row", justifyContent: "flex-start", children: /* @__PURE__ */ jsx(
       Button,
       {
@@ -74,7 +37,10 @@ const KeyValueField = ({
         fullWidth: addButton.fullWidth,
         disabled: !canAdd || readonly,
         tooltip: !canAdd ? maxSizeReachedTooltip : addButton.tooltip,
-        onClick: () => append({ key: "", value: "" }),
+        onClick: () => append({
+          key: "",
+          value: ""
+        }),
         children: addButton.name
       }
     ) })

package/dist/components/NumberInputField/index.js

@@ -21,10 +21,14 @@ const NumberInputField = ({
   label,
   shouldUnregister = false
 }) => {
-  const { getError } = useErrors();
+  const {
+    getError
+  } = useErrors();
   const {
     field,
-    fieldState: { error }
+    fieldState: {
+      error
+    }
   } = useController({
     name,
     shouldUnregister,
@@ -35,36 +39,17 @@ const NumberInputField = ({
       ...rules
     }
   });
-  return /* @__PURE__ */ jsx(
-    NumberInput,
-    {
-      name: field.name,
-      value: field.value,
-      disabled,
-      onBlur: (event) => {
-        field.onBlur();
-        onBlur?.(event);
-      },
-      onChange: (event) => {
-        field.onChange(event ?? null);
-        onChange?.(event);
-      },
-      onFocus,
-      maxValue,
-      minValue,
-      onMinCrossed,
-      onMaxCrossed,
-      size,
-      step,
-      text,
-      className,
-      label,
-      error: getError(
-        { label: label ?? "", max: maxValue, min: minValue },
-        error
-      )
-    }
-  );
+  return /* @__PURE__ */ jsx(NumberInput, { name: field.name, value: field.value, disabled, onBlur: (event) => {
+    field.onBlur();
+    onBlur?.(event);
+  }, onChange: (event) => {
+    field.onChange(event ?? null);
+    onChange?.(event);
+  }, onFocus, maxValue, minValue, onMinCrossed, onMaxCrossed, size, step, text, className, label, error: getError({
+    label: label ?? "",
+    max: maxValue,
+    min: minValue
+  }, error) });
 };
 export {
   NumberInputField

package/dist/components/NumberInputFieldV2/index.js

@@ -28,10 +28,14 @@ const NumberInputFieldV2 = ({
   readOnly,
   shouldUnregister = false
 }) => {
-  const { getError } = useErrors();
+  const {
+    getError
+  } = useErrors();
   const {
     field,
-    fieldState: { error }
+    fieldState: {
+      error
+    }
   } = useController({
     name,
     shouldUnregister,
@@ -42,41 +46,17 @@ const NumberInputFieldV2 = ({
       ...rules
     }
   });
-  return /* @__PURE__ */ jsx(
-    NumberInputV2,
-    {
-      name: field.name,
-      value: field.value,
-      disabled,
-      onBlur: (event) => {
-        field.onBlur();
-        onBlur?.(event);
-      },
-      onChange: (newValue) => {
-        field.onChange(newValue);
-        onChange?.(newValue);
-      },
-      max,
-      min,
-      size,
-      step,
-      className,
-      "data-testid": dataTestId,
-      id,
-      label,
-      labelDescription,
-      placeholder,
-      error: getError({ label: label ?? "", max, min }, error),
-      success,
-      helper,
-      tooltip,
-      unit,
-      "aria-label": ariaLabel,
-      autoFocus,
-      readOnly,
-      required
-    }
-  );
+  return /* @__PURE__ */ jsx(NumberInputV2, { name: field.name, value: field.value, disabled, onBlur: (event) => {
+    field.onBlur();
+    onBlur?.(event);
+  }, onChange: (newValue) => {
+    field.onChange(newValue);
+    onChange?.(newValue);
+  }, max, min, size, step, className, "data-testid": dataTestId, id, label, labelDescription, placeholder, error: getError({
+    label: label ?? "",
+    max,
+    min
+  }, error), success, helper, tooltip, unit, "aria-label": ariaLabel, autoFocus, readOnly, required });
 };
 export {
   NumberInputFieldV2

package/dist/components/RadioField/index.js

@@ -18,10 +18,14 @@ const RadioField = ({
   tooltip,
   shouldUnregister = false
 }) => {
-  const { getError } = useErrors();
+  const {
+    getError
+  } = useErrors();
   const {
     field,
-    fieldState: { error }
+    fieldState: {
+      error
+    }
   } = useController({
     name,
     shouldUnregister,
@@ -30,31 +34,15 @@ const RadioField = ({
       ...rules
     }
   });
-  return /* @__PURE__ */ jsx(
-    Radio,
-    {
-      name: field.name,
-      checked: field.value === value,
-      className,
-      "data-testid": dataTestId,
-      disabled,
-      error: getError({ label: typeof label === "string" ? label : "" }, error),
-      id,
-      onChange: () => {
-        field.onChange(value);
-        onChange?.(value);
-      },
-      onBlur: (event) => {
-        field.onBlur();
-        onBlur?.(event);
-      },
-      onFocus,
-      required,
-      value: value ?? "",
-      label,
-      tooltip
-    }
-  );
+  return /* @__PURE__ */ jsx(Radio, { name: field.name, checked: field.value === value, className, "data-testid": dataTestId, disabled, error: getError({
+    label: typeof label === "string" ? label : ""
+  }, error), id, onChange: () => {
+    field.onChange(value);
+    onChange?.(value);
+  }, onBlur: (event) => {
+    field.onBlur();
+    onBlur?.(event);
+  }, onFocus, required, value: value ?? "", label, tooltip });
 };
 export {
   RadioField

package/dist/components/RadioGroupField/index.js

@@ -16,10 +16,14 @@ const RadioGroupField = ({
   direction,
   shouldUnregister = false
 }) => {
-  const { getError } = useErrors();
+  const {
+    getError
+  } = useErrors();
   const {
     field,
-    fieldState: { error }
+    fieldState: {
+      error
+    }
   } = useController({
     name,
     shouldUnregister,
@@ -28,26 +32,12 @@ const RadioGroupField = ({
       ...rules
     }
   });
-  return /* @__PURE__ */ jsx(
-    RadioGroup,
-    {
-      className,
-      name: field.name,
-      onChange: (event) => {
-        field.onChange(event);
-        onChange?.(
-          event.target.value
-        );
-      },
-      required,
-      value: field.value,
-      legend,
-      error: getError({ label }, error) ?? customError,
-      helper,
-      direction,
-      children
-    }
-  );
+  return /* @__PURE__ */ jsx(RadioGroup, { className, name: field.name, onChange: (event) => {
+    field.onChange(event);
+    onChange?.(event.target.value);
+  }, required, value: field.value, legend, error: getError({
+    label
+  }, error) ?? customError, helper, direction, children });
 };
 RadioGroupField.Radio = RadioGroup.Radio;
 export {