@ultraviolet/form 2.8.8 → 2.9.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.
@@ -1,8 +1,15 @@
1
1
  import { CheckboxGroup } from '@ultraviolet/ui';
2
+ import { useCallback, Children, isValidElement } from 'react';
2
3
  import { useController } from 'react-hook-form';
3
4
  import { jsx } from '@emotion/react/jsx-runtime';
4
5
  import { useErrors } from '../../providers/ErrorContext/index.js';
5
6
 
7
+ const arraysContainSameValues = (array1, array2) => {
8
+ if (array1.length === 0) {
9
+ return false;
10
+ }
11
+ return array2.every(value => array1.includes(value));
12
+ };
6
13
  const CheckboxGroupField = ({
7
14
  legend,
8
15
  className,
@@ -14,11 +21,30 @@ const CheckboxGroupField = ({
14
21
  error: customError,
15
22
  name,
16
23
  required = false,
17
- shouldUnregister = false
24
+ shouldUnregister = false,
25
+ rules
18
26
  }) => {
19
27
  const {
20
28
  getError
21
29
  } = useErrors();
30
+ const validate = useCallback(value => {
31
+ const requiredChildren = Children.map(children, child => {
32
+ if ( /*#__PURE__*/isValidElement(child)) {
33
+ if (child.props.required) {
34
+ return child.props.name;
35
+ }
36
+ return null;
37
+ }
38
+ return null;
39
+ })?.filter(Boolean) ?? [];
40
+ if (!required && arraysContainSameValues(value, requiredChildren)) {
41
+ return true;
42
+ }
43
+ if (value.length >= Children.count(children)) {
44
+ return true;
45
+ }
46
+ return false;
47
+ }, [children, required]);
22
48
  const {
23
49
  field,
24
50
  fieldState: {
@@ -26,7 +52,11 @@ const CheckboxGroupField = ({
26
52
  }
27
53
  } = useController({
28
54
  name,
29
- shouldUnregister
55
+ shouldUnregister,
56
+ rules: {
57
+ validate,
58
+ ...rules
59
+ }
30
60
  });
31
61
  return jsx(CheckboxGroup, {
32
62
  legend: legend,
@@ -58,6 +58,7 @@ const Form = ({
58
58
  await handleSubmit(e);
59
59
  },
60
60
  name: name,
61
+ noValidate: true,
61
62
  children: typeof children === 'function' ? children({
62
63
  values: methods.watch(),
63
64
  hasValidationErrors: !methods.formState.isValid,
@@ -5,8 +5,8 @@ import { useErrors } from '../../providers/ErrorContext/index.js';
5
5
 
6
6
  const NumberInputFieldV2 = ({
7
7
  disabled,
8
- max,
9
- min,
8
+ max = Number.MAX_SAFE_INTEGER,
9
+ min = 0,
10
10
  name,
11
11
  onChange,
12
12
  onBlur,
package/dist/index.d.ts CHANGED
@@ -50,8 +50,8 @@ declare const CheckboxField: <TFieldValues extends FieldValues, TName extends Fi
50
50
 
51
51
  type CheckboxGroupFieldProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TName> & Partial<Pick<ComponentProps<typeof CheckboxGroup>, 'className' | 'helper' | 'required' | 'direction' | 'children' | 'error' | 'legend'>> & Required<Pick<ComponentProps<typeof CheckboxGroup>, 'legend'>>;
52
52
  declare const CheckboxGroupField: {
53
- <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ legend, className, helper, direction, children, onChange, label, error: customError, name, required, shouldUnregister, }: CheckboxGroupFieldProps<TFieldValues, TName>): _emotion_react_jsx_runtime.JSX.Element;
54
- Checkbox: ({ onFocus, onBlur, disabled, error, name, value, children, helper, className, autoFocus, "data-testid": dataTestId, }: Omit<({
53
+ <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ legend, className, helper, direction, children, onChange, label, error: customError, name, required, shouldUnregister, rules, }: CheckboxGroupFieldProps<TFieldValues, TName>): _emotion_react_jsx_runtime.JSX.Element;
54
+ Checkbox: ({ onFocus, onBlur, disabled, error, name, value, children, helper, className, autoFocus, "data-testid": dataTestId, required, }: Omit<({
55
55
  error?: react.ReactNode;
56
56
  size?: number | undefined;
57
57
  progress?: boolean | undefined;
@@ -71,7 +71,7 @@ declare const CheckboxGroupField: {
71
71
  children?: undefined;
72
72
  } & {
73
73
  'aria-label': string;
74
- }))) & react.RefAttributes<HTMLInputElement>, "required" | "onChange" | "checked"> & {
74
+ }))) & react.RefAttributes<HTMLInputElement>, "onChange" | "checked"> & {
75
75
  value: string;
76
76
  }) => _emotion_react_jsx_runtime.JSX.Element;
77
77
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ultraviolet/form",
3
- "version": "2.8.8",
3
+ "version": "2.9.0",
4
4
  "description": "Ultraviolet Form",
5
5
  "homepage": "https://github.com/scaleway/ultraviolet#readme",
6
6
  "repository": {
@@ -36,24 +36,24 @@
36
36
  "@emotion/styled": "11.11.0",
37
37
  "react": "18.x",
38
38
  "react-dom": "18.x",
39
- "react-hook-form": "7.51.1"
39
+ "react-hook-form": "7.51.2"
40
40
  },
41
41
  "devDependencies": {
42
- "@babel/core": "7.24.0",
42
+ "@babel/core": "7.24.3",
43
43
  "@types/final-form-focus": "1.1.7",
44
- "@types/react": "18.2.61",
45
- "@types/react-dom": "18.2.19",
44
+ "@types/react": "18.2.64",
45
+ "@types/react-dom": "18.2.21",
46
46
  "react": "18.2.0",
47
47
  "react-dom": "18.2.0"
48
48
  },
49
49
  "dependencies": {
50
- "@babel/runtime": "7.24.0",
50
+ "@babel/runtime": "7.24.1",
51
51
  "@emotion/babel-plugin": "11.11.0",
52
52
  "@emotion/react": "11.11.4",
53
53
  "@emotion/styled": "11.11.0",
54
54
  "react-select": "5.8.0",
55
- "react-hook-form": "7.51.1",
56
- "@ultraviolet/ui": "1.43.2"
55
+ "react-hook-form": "7.51.2",
56
+ "@ultraviolet/ui": "1.45.0"
57
57
  },
58
58
  "scripts": {
59
59
  "build": "rollup -c ../../rollup.config.mjs",