@ultraviolet/form 3.4.0 → 3.6.0

package/dist/components/CheckboxField/index.cjs

@@ -5,24 +5,17 @@ const ui = require("@ultraviolet/ui");
 const reactHookForm = require("react-hook-form");
 const index = require("../../providers/ErrorContext/index.cjs");
 const CheckboxField = ({
-  id,
   control,
   name,
   label,
-  size,
-  progress,
   disabled,
   required,
-  className,
   children,
   onChange,
   onBlur,
-  onFocus,
-  helper,
-  tooltip,
-  "data-testid": dataTestId,
   shouldUnregister = false,
-  validate
+  validate,
+  ...props
 }) => {
   const {
     getError
@@ -42,14 +35,14 @@ const CheckboxField = ({
       validate
     }
   });
-  return /* @__PURE__ */ jsxRuntime.jsx(ui.Checkbox, { id, name: field.name, onChange: (event) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(ui.Checkbox, { ...props, 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({
+  }, disabled: field.disabled, checked: !!field.value, error: getError({
     label: label ?? ""
-  }, error), ref: field.ref, className, required, "data-testid": dataTestId, helper, tooltip, children });
+  }, error), ref: field.ref, children });
 };
 exports.CheckboxField = CheckboxField;

package/dist/components/CheckboxField/index.d.ts

@@ -2,9 +2,9 @@ import { Checkbox } from '@ultraviolet/ui';
 import type { ComponentProps, ReactNode } from 'react';
 import type { FieldPath, FieldValues } from 'react-hook-form';
 import type { BaseFieldProps } from '../../types';
-type CheckboxFieldProps<TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues>> = Omit<BaseFieldProps<TFieldValues, TFieldName>, 'value'> & Partial<Pick<ComponentProps<typeof Checkbox>, 'id' | 'disabled' | 'onBlur' | 'onFocus' | 'progress' | 'size' | 'data-testid' | 'helper' | 'tooltip'>> & {
+type CheckboxFieldProps<TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues>> = Omit<BaseFieldProps<TFieldValues, TFieldName>, 'value'> & Omit<ComponentProps<typeof Checkbox>, 'value' | 'onChange' | 'aria-label'> & {
     className?: string;
     children?: ReactNode;
 };
-export declare const CheckboxField: <TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ id, control, name, label, size, progress, disabled, required, className, children, onChange, onBlur, onFocus, helper, tooltip, "data-testid": dataTestId, shouldUnregister, validate, }: CheckboxFieldProps<TFieldValues, TFieldName>) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const CheckboxField: <TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ control, name, label, disabled, required, children, onChange, onBlur, shouldUnregister, validate, ...props }: CheckboxFieldProps<TFieldValues, TFieldName>) => import("@emotion/react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/CheckboxField/index.js

@@ -3,24 +3,17 @@ import { Checkbox } from "@ultraviolet/ui";
 import { useController } from "react-hook-form";
 import { useErrors } from "../../providers/ErrorContext/index.js";
 const CheckboxField = ({
-  id,
   control,
   name,
   label,
-  size,
-  progress,
   disabled,
   required,
-  className,
   children,
   onChange,
   onBlur,
-  onFocus,
-  helper,
-  tooltip,
-  "data-testid": dataTestId,
   shouldUnregister = false,
-  validate
+  validate,
+  ...props
 }) => {
   const {
     getError
@@ -40,15 +33,15 @@ const CheckboxField = ({
       validate
     }
   });
-  return /* @__PURE__ */ jsx(Checkbox, { id, name: field.name, onChange: (event) => {
+  return /* @__PURE__ */ jsx(Checkbox, { ...props, 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({
+  }, disabled: field.disabled, checked: !!field.value, error: getError({
     label: label ?? ""
-  }, error), ref: field.ref, className, required, "data-testid": dataTestId, helper, tooltip, children });
+  }, error), ref: field.ref, children });
 };
 export {
   CheckboxField

package/dist/components/CheckboxGroupField/index.cjs

@@ -12,11 +12,7 @@ const arraysContainSameValues = (array1, array2) => {
   return array2.every((value) => array1.includes(value));
 };
 const CheckboxGroupField = ({
-  legend,
-  className,
   control,
-  helper,
-  direction,
   children,
   onChange,
   label = "",
@@ -24,7 +20,8 @@ const CheckboxGroupField = ({
   name,
   required = false,
   shouldUnregister = false,
-  validate
+  validate,
+  ...props
 }) => {
   const {
     getError
@@ -63,7 +60,7 @@ const CheckboxGroupField = ({
       }
     }
   });
-  return /* @__PURE__ */ jsxRuntime.jsx(ui.CheckboxGroup, { legend, name, value: field.value, onChange: (event) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(ui.CheckboxGroup, { ...props, value: field.value, onChange: (event) => {
     const fieldValue = field.value;
     if (fieldValue?.includes(event.currentTarget.value)) {
       field.onChange(fieldValue?.filter((currentValue) => currentValue !== event.currentTarget.value));
@@ -73,7 +70,7 @@ const CheckboxGroupField = ({
     onChange?.(event.currentTarget.value);
   }, error: getError({
     label
-  }, error) ?? customError, className, direction, helper, required, children });
+  }, error) ?? customError, name, children });
 };
 CheckboxGroupField.Checkbox = ui.CheckboxGroup.Checkbox;
 exports.CheckboxGroupField = CheckboxGroupField;

package/dist/components/CheckboxGroupField/index.d.ts

@@ -2,9 +2,9 @@ import { CheckboxGroup } from '@ultraviolet/ui';
 import type { ComponentProps } from 'react';
 import type { FieldPath, FieldValues } from 'react-hook-form';
 import type { BaseFieldProps } from '../../types';
-type CheckboxGroupFieldProps<TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TFieldName> & Partial<Pick<ComponentProps<typeof CheckboxGroup>, 'className' | 'helper' | 'required' | 'direction' | 'children' | 'error' | 'legend'>> & Required<Pick<ComponentProps<typeof CheckboxGroup>, 'legend'>>;
+type CheckboxGroupFieldProps<TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TFieldName> & Omit<ComponentProps<typeof CheckboxGroup>, 'value' | 'onChange'>;
 export declare const CheckboxGroupField: {
-    <TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ legend, className, control, helper, direction, children, onChange, label, error: customError, name, required, shouldUnregister, validate, }: CheckboxGroupFieldProps<TFieldValues, TFieldName>): import("@emotion/react/jsx-runtime").JSX.Element;
+    <TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ control, children, onChange, label, error: customError, name, required, shouldUnregister, validate, ...props }: CheckboxGroupFieldProps<TFieldValues, TFieldName>): import("@emotion/react/jsx-runtime").JSX.Element;
     Checkbox: ({ onFocus, onBlur, disabled, error, name, value, children, helper, className, autoFocus, "data-testid": dataTestId, required, }: Omit<({
         error?: string | import("react").ReactNode;
         size?: number;

package/dist/components/CheckboxGroupField/index.js

@@ -10,11 +10,7 @@ const arraysContainSameValues = (array1, array2) => {
   return array2.every((value) => array1.includes(value));
 };
 const CheckboxGroupField = ({
-  legend,
-  className,
   control,
-  helper,
-  direction,
   children,
   onChange,
   label = "",
@@ -22,7 +18,8 @@ const CheckboxGroupField = ({
   name,
   required = false,
   shouldUnregister = false,
-  validate
+  validate,
+  ...props
 }) => {
   const {
     getError
@@ -61,7 +58,7 @@ const CheckboxGroupField = ({
       }
     }
   });
-  return /* @__PURE__ */ jsx(CheckboxGroup, { legend, name, value: field.value, onChange: (event) => {
+  return /* @__PURE__ */ jsx(CheckboxGroup, { ...props, value: field.value, onChange: (event) => {
     const fieldValue = field.value;
     if (fieldValue?.includes(event.currentTarget.value)) {
       field.onChange(fieldValue?.filter((currentValue) => currentValue !== event.currentTarget.value));
@@ -71,7 +68,7 @@ const CheckboxGroupField = ({
     onChange?.(event.currentTarget.value);
   }, error: getError({
     label
-  }, error) ?? customError, className, direction, helper, required, children });
+  }, error) ?? customError, name, children });
 };
 CheckboxGroupField.Checkbox = CheckboxGroup.Checkbox;
 export {

package/dist/components/DateField/index.cjs

@@ -27,7 +27,8 @@ const DateField = ({
   selectsRange,
   size,
   "data-testid": dataTestId,
-  shouldUnregister = false
+  shouldUnregister = false,
+  showMonthYearPicker
 }) => {
   const {
     getError
@@ -71,6 +72,6 @@ const DateField = ({
     minDate: minDate$1,
     maxDate: maxDate$1,
     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 });
+  }, error), disabled, autoFocus, excludeDates, selectsRange, showMonthYearPicker, "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 });
 };
 exports.DateField = DateField;

package/dist/components/DateField/index.d.ts

@@ -12,5 +12,5 @@ type DateFieldProps<TFieldValues extends FieldValues, TFieldName extends FieldPa
     onFocus?: (value: FocusEvent<HTMLElement>) => void;
     autoFocus?: boolean;
 };
-export declare const DateField: <TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ required, name, control, label, format, locale, maxDate, minDate, disabled, onChange, onBlur, onFocus, validate, autoFocus, excludeDates, selectsRange, size, "data-testid": dataTestId, shouldUnregister, }: DateFieldProps<TFieldValues, TFieldName>) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const DateField: <TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ required, name, control, label, format, locale, maxDate, minDate, disabled, onChange, onBlur, onFocus, validate, autoFocus, excludeDates, selectsRange, size, "data-testid": dataTestId, shouldUnregister, showMonthYearPicker, }: DateFieldProps<TFieldValues, TFieldName>) => import("@emotion/react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/DateField/index.js

@@ -25,7 +25,8 @@ const DateField = ({
   selectsRange,
   size,
   "data-testid": dataTestId,
-  shouldUnregister = false
+  shouldUnregister = false,
+  showMonthYearPicker
 }) => {
   const {
     getError
@@ -69,7 +70,7 @@ const DateField = ({
     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 });
+  }, error), disabled, autoFocus, excludeDates, selectsRange, showMonthYearPicker, "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/RadioField/index.cjs

@@ -5,11 +5,8 @@ const ui = require("@ultraviolet/ui");
 const reactHookForm = require("react-hook-form");
 const index = require("../../providers/ErrorContext/index.cjs");
 const RadioField = ({
-  className,
   control,
-  "data-testid": dataTestId,
   disabled,
-  id,
   name,
   onBlur,
   label = "",
@@ -17,9 +14,9 @@ const RadioField = ({
   onFocus,
   required,
   value,
-  tooltip,
   shouldUnregister = false,
-  validate
+  validate,
+  ...props
 }) => {
   const {
     getError
@@ -38,14 +35,14 @@ const RadioField = ({
       validate
     }
   });
-  return /* @__PURE__ */ jsxRuntime.jsx(ui.Radio, { name: field.name, checked: field.value === value, className, "data-testid": dataTestId, disabled, error: getError({
+  return /* @__PURE__ */ jsxRuntime.jsx(ui.Radio, { ...props, name: field.name, checked: field.value === value, disabled, error: getError({
     label: typeof label === "string" ? label : ""
-  }, error), id, onChange: () => {
+  }, error), onChange: () => {
     field.onChange(value);
     onChange?.(value);
   }, onBlur: (event) => {
     field.onBlur();
     onBlur?.(event);
-  }, onFocus, required, value: value ?? "", label, tooltip });
+  }, onFocus, required, value: value ?? "", label });
 };
 exports.RadioField = RadioField;

package/dist/components/RadioField/index.d.ts

@@ -2,11 +2,9 @@ import { Radio } from '@ultraviolet/ui';
 import type { ComponentProps } from 'react';
 import type { FieldPath, FieldValues } from 'react-hook-form';
 import type { BaseFieldProps } from '../../types';
-type RadioFieldProps<TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues>> = Omit<BaseFieldProps<TFieldValues, TFieldName>, 'label'> & Partial<Pick<ComponentProps<typeof Radio>, 'disabled' | 'id' | 'onBlur' | 'onFocus' | 'data-testid' | 'tooltip' | 'label'>> & {
-    className?: string;
-};
+type RadioFieldProps<TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues>> = Omit<BaseFieldProps<TFieldValues, TFieldName>, 'label'> & Omit<ComponentProps<typeof Radio>, 'value' | 'onChange' | 'aria-label'>;
 /**
  * @deprecated This component is deprecated, use `RadioGroupField` instead.
  */
-export declare const RadioField: <TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ className, control, "data-testid": dataTestId, disabled, id, name, onBlur, label, onChange, onFocus, required, value, tooltip, shouldUnregister, validate, }: RadioFieldProps<TFieldValues, TFieldName>) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const RadioField: <TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ control, disabled, name, onBlur, label, onChange, onFocus, required, value, shouldUnregister, validate, ...props }: RadioFieldProps<TFieldValues, TFieldName>) => import("@emotion/react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/RadioField/index.js

@@ -3,11 +3,8 @@ import { Radio } from "@ultraviolet/ui";
 import { useController } from "react-hook-form";
 import { useErrors } from "../../providers/ErrorContext/index.js";
 const RadioField = ({
-  className,
   control,
-  "data-testid": dataTestId,
   disabled,
-  id,
   name,
   onBlur,
   label = "",
@@ -15,9 +12,9 @@ const RadioField = ({
   onFocus,
   required,
   value,
-  tooltip,
   shouldUnregister = false,
-  validate
+  validate,
+  ...props
 }) => {
   const {
     getError
@@ -36,15 +33,15 @@ const RadioField = ({
       validate
     }
   });
-  return /* @__PURE__ */ jsx(Radio, { name: field.name, checked: field.value === value, className, "data-testid": dataTestId, disabled, error: getError({
+  return /* @__PURE__ */ jsx(Radio, { ...props, name: field.name, checked: field.value === value, disabled, error: getError({
     label: typeof label === "string" ? label : ""
-  }, error), id, onChange: () => {
+  }, error), onChange: () => {
     field.onChange(value);
     onChange?.(value);
   }, onBlur: (event) => {
     field.onBlur();
     onBlur?.(event);
-  }, onFocus, required, value: value ?? "", label, tooltip });
+  }, onFocus, required, value: value ?? "", label });
 };
 export {
   RadioField

package/dist/components/RadioGroupField/index.cjs

@@ -5,19 +5,17 @@ const ui = require("@ultraviolet/ui");
 const reactHookForm = require("react-hook-form");
 const index = require("../../providers/ErrorContext/index.cjs");
 const RadioGroupField = ({
-  className,
   control,
-  legend = "",
   name,
   onChange,
   required,
   children,
   label = "",
   error: customError,
-  helper,
-  direction,
   shouldUnregister = false,
-  validate
+  validate,
+  legend,
+  ...props
 }) => {
   const {
     getError
@@ -36,12 +34,12 @@ const RadioGroupField = ({
       validate
     }
   });
-  return /* @__PURE__ */ jsxRuntime.jsx(ui.RadioGroup, { className, name: field.name, onChange: (event) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(ui.RadioGroup, { ...props, name: field.name, onChange: (event) => {
     field.onChange(event);
     onChange?.(event.target.value);
-  }, required, value: field.value, legend, error: getError({
+  }, required, value: field.value, error: getError({
     label
-  }, error) ?? customError, helper, direction, children });
+  }, error) ?? customError, legend: legend ?? "", children });
 };
 RadioGroupField.Radio = ui.RadioGroup.Radio;
 exports.RadioGroupField = RadioGroupField;

package/dist/components/RadioGroupField/index.d.ts

@@ -2,11 +2,9 @@ import { RadioGroup } from '@ultraviolet/ui';
 import type { ComponentProps, JSX } from 'react';
 import type { FieldPath, FieldValues } from 'react-hook-form';
 import type { BaseFieldProps } from '../../types';
-type RadioGroupFieldProps<TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TFieldName> & Partial<Pick<ComponentProps<typeof RadioGroup>, 'legend' | 'children' | 'error' | 'helper' | 'direction'>> & {
-    className?: string;
-};
+type RadioGroupFieldProps<TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TFieldName> & Omit<ComponentProps<typeof RadioGroup>, 'value' | 'onChange' | 'legend'> & Partial<Pick<ComponentProps<typeof RadioGroup>, 'legend'>>;
 export declare const RadioGroupField: {
-    <TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ className, control, legend, name, onChange, required, children, label, error: customError, helper, direction, shouldUnregister, validate, }: RadioGroupFieldProps<TFieldValues, TFieldName>): JSX.Element;
+    <TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ control, name, onChange, required, children, label, error: customError, shouldUnregister, validate, legend, ...props }: RadioGroupFieldProps<TFieldValues, TFieldName>): JSX.Element;
     Radio: ({ onFocus, onBlur, disabled, error, name, value, label, helper, className, autoFocus, onKeyDown, tooltip, "data-testid": dataTestId, }: Omit<({
         error?: import("react").ReactNode;
         checked?: boolean;

package/dist/components/RadioGroupField/index.js

@@ -3,19 +3,17 @@ import { RadioGroup } from "@ultraviolet/ui";
 import { useController } from "react-hook-form";
 import { useErrors } from "../../providers/ErrorContext/index.js";
 const RadioGroupField = ({
-  className,
   control,
-  legend = "",
   name,
   onChange,
   required,
   children,
   label = "",
   error: customError,
-  helper,
-  direction,
   shouldUnregister = false,
-  validate
+  validate,
+  legend,
+  ...props
 }) => {
   const {
     getError
@@ -34,12 +32,12 @@ const RadioGroupField = ({
       validate
     }
   });
-  return /* @__PURE__ */ jsx(RadioGroup, { className, name: field.name, onChange: (event) => {
+  return /* @__PURE__ */ jsx(RadioGroup, { ...props, name: field.name, onChange: (event) => {
     field.onChange(event);
     onChange?.(event.target.value);
-  }, required, value: field.value, legend, error: getError({
+  }, required, value: field.value, error: getError({
     label
-  }, error) ?? customError, helper, direction, children });
+  }, error) ?? customError, legend: legend ?? "", children });
 };
 RadioGroupField.Radio = RadioGroup.Radio;
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ultraviolet/form",
-  "version": "3.4.0",
+  "version": "3.6.0",
   "description": "Ultraviolet Form",
   "homepage": "https://github.com/scaleway/ultraviolet#readme",
   "repository": {
@@ -51,8 +51,8 @@
     }
   ],
   "peerDependencies": {
-    "@emotion/react": "11.11.4",
-    "@emotion/styled": "11.11.5",
+    "@emotion/react": "11.13.0",
+    "@emotion/styled": "11.13.0",
     "react": "18.x",
     "react-dom": "18.x",
     "react-hook-form": "7.52.1"
@@ -68,11 +68,11 @@
   },
   "dependencies": {
     "@babel/runtime": "7.24.8",
-    "@emotion/react": "11.11.4",
-    "@emotion/styled": "11.11.5",
+    "@emotion/react": "11.13.0",
+    "@emotion/styled": "11.13.0",
     "react-select": "5.8.0",
     "react-hook-form": "7.52.1",
-    "@ultraviolet/ui": "1.63.0",
+    "@ultraviolet/ui": "1.65.0",
     "@ultraviolet/themes": "1.12.2"
   },
   "scripts": {