@rolster/react-forms 18.4.1 → 18.5.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/cjs/index.js +65 -64
- package/dist/cjs/index.js.map +1 -1
- package/dist/es/index.js +65 -64
- package/dist/es/index.js.map +1 -1
- package/dist/esm/form-array/form-array-control.hook.d.ts +6 -6
- package/dist/esm/form-array/form-array-control.hook.js +9 -9
- package/dist/esm/form-array/form-array-group.hook.d.ts +2 -2
- package/dist/esm/form-array/form-array-group.hook.js +2 -2
- package/dist/esm/form-array/form-array.hook.js +17 -17
- package/dist/esm/form-array/form-array.hook.js.map +1 -1
- package/dist/esm/form-control.hook.d.ts +4 -4
- package/dist/esm/form-control.hook.js +29 -28
- package/dist/esm/form-control.hook.js.map +1 -1
- package/dist/esm/form-group.hook.js +3 -3
- package/dist/esm/form-group.hook.js.map +1 -1
- package/dist/esm/form-ref.hook.js +2 -2
- package/dist/esm/types.d.ts +1 -1
- package/package.json +3 -3
|
@@ -1,32 +1,32 @@
|
|
|
1
1
|
import { createFormArrayOptions } from '@rolster/forms/arguments';
|
|
2
|
-
import { arrayIsValid,
|
|
2
|
+
import { arrayIsValid, controlsToValue, groupAllChecked, groupPartialChecked } from '@rolster/forms/helpers';
|
|
3
3
|
import { useEffect, useRef, useState } from 'react';
|
|
4
4
|
import { RolsterArrayGroup } from './form-array-group.hook';
|
|
5
5
|
export function useFormArray(options, arrayValidators) {
|
|
6
6
|
const arrayOptions = createFormArrayOptions(options, arrayValidators);
|
|
7
7
|
const { validators } = arrayOptions;
|
|
8
8
|
const groups = arrayOptions.groups || [];
|
|
9
|
-
const [
|
|
9
|
+
const [state, setState] = useState({
|
|
10
10
|
controls: groups.map(({ controls }) => controls),
|
|
11
11
|
disabled: false,
|
|
12
12
|
groups,
|
|
13
|
-
|
|
13
|
+
value: groups.map(({ controls }) => controlsToValue(controls)),
|
|
14
14
|
validators
|
|
15
15
|
});
|
|
16
16
|
const currentState = useRef(groups);
|
|
17
17
|
useEffect(() => {
|
|
18
18
|
const subscriber = (options) => {
|
|
19
|
-
|
|
19
|
+
setState((state) => ({
|
|
20
20
|
...state,
|
|
21
|
-
groups:
|
|
21
|
+
groups: state.groups.map((group) => group.uuid === options.uuid
|
|
22
22
|
? new RolsterArrayGroup(options)
|
|
23
23
|
: group)
|
|
24
24
|
}));
|
|
25
25
|
};
|
|
26
|
-
|
|
26
|
+
state.groups.forEach((group) => {
|
|
27
27
|
group.subscribe(subscriber);
|
|
28
28
|
});
|
|
29
|
-
}, [
|
|
29
|
+
}, [state]);
|
|
30
30
|
const errors = validators ? arrayIsValid({ groups, validators }) : [];
|
|
31
31
|
const error = errors[0];
|
|
32
32
|
const valid = errors.length === 0 && groupAllChecked(groups, 'valid');
|
|
@@ -35,44 +35,44 @@ export function useFormArray(options, arrayValidators) {
|
|
|
35
35
|
const touched = groupPartialChecked(groups, 'touched');
|
|
36
36
|
const touchedAll = groupAllChecked(groups, 'touched');
|
|
37
37
|
function disable() {
|
|
38
|
-
|
|
38
|
+
setState((state) => ({ ...state, disabled: true }));
|
|
39
39
|
}
|
|
40
40
|
function enable() {
|
|
41
|
-
|
|
41
|
+
setState((state) => ({ ...state, disabled: false }));
|
|
42
42
|
}
|
|
43
43
|
function setGroups(groups) {
|
|
44
|
-
|
|
44
|
+
setState((currentState) => ({
|
|
45
45
|
...currentState,
|
|
46
46
|
groups,
|
|
47
47
|
controls: groups.map(({ controls }) => controls),
|
|
48
|
-
|
|
48
|
+
value: groups.map(({ controls }) => controlsToValue(controls))
|
|
49
49
|
}));
|
|
50
50
|
}
|
|
51
51
|
function push(group) {
|
|
52
|
-
setGroups([...
|
|
52
|
+
setGroups([...state.groups, group]);
|
|
53
53
|
}
|
|
54
54
|
function merge(groups) {
|
|
55
|
-
setGroups([...
|
|
55
|
+
setGroups([...state.groups, ...groups]);
|
|
56
56
|
}
|
|
57
57
|
function set(groups) {
|
|
58
58
|
setGroups(groups);
|
|
59
59
|
}
|
|
60
60
|
function remove({ uuid }) {
|
|
61
|
-
setGroups(
|
|
61
|
+
setGroups(state.groups.filter((group) => group.uuid !== uuid));
|
|
62
62
|
}
|
|
63
63
|
function reset() {
|
|
64
64
|
setGroups(currentState.current);
|
|
65
65
|
}
|
|
66
66
|
function setValidators(validators) {
|
|
67
|
-
|
|
67
|
+
setState((state) => ({ ...state, validators }));
|
|
68
68
|
}
|
|
69
69
|
return {
|
|
70
|
-
...
|
|
70
|
+
...state,
|
|
71
71
|
dirty,
|
|
72
72
|
dirtyAll,
|
|
73
73
|
disable,
|
|
74
74
|
enable,
|
|
75
|
-
enabled: !
|
|
75
|
+
enabled: !state.disabled,
|
|
76
76
|
error,
|
|
77
77
|
errors,
|
|
78
78
|
invalid: !valid,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"form-array.hook.js","sourceRoot":"","sources":["../../../src/form-array/form-array.hook.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EACL,YAAY,EACZ,eAAe,EACf,eAAe,EACf,mBAAmB,EACpB,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAOpD,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAgC5D,MAAM,UAAU,YAAY,CAK1B,OAA6D,EAC7D,eAA0C;IAE1C,MAAM,YAAY,GAAG,sBAAsB,CAKzC,OAAO,EAAE,eAAe,CAAC,CAAC;IAE5B,MAAM,EAAE,UAAU,EAAE,GAAG,YAAY,CAAC;IACpC,MAAM,MAAM,GAAG,YAAY,CAAC,MAAM,IAAI,EAAE,CAAC;IAEzC,MAAM,CAAC,
|
|
1
|
+
{"version":3,"file":"form-array.hook.js","sourceRoot":"","sources":["../../../src/form-array/form-array.hook.ts"],"names":[],"mappings":"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"}
|
|
@@ -5,17 +5,17 @@ interface ReactControlOptions<T = any> extends FormControlOptions<T> {
|
|
|
5
5
|
touched?: boolean;
|
|
6
6
|
}
|
|
7
7
|
type ReactStateOptions<T> = Omit<ReactControlOptions<T>, 'validators'>;
|
|
8
|
-
type ReactValidatorsOptions<T> = Omit<ReactControlOptions<T>, '
|
|
8
|
+
type ReactValidatorsOptions<T> = Omit<ReactControlOptions<T>, 'value'>;
|
|
9
9
|
export declare function useReactControl<E extends HTMLElement, T>(): ReactFormControl<E, T | undefined>;
|
|
10
10
|
export declare function useReactControl<E extends HTMLElement, T>(options: ReactStateOptions<T>): ReactFormControl<E, T>;
|
|
11
11
|
export declare function useReactControl<E extends HTMLElement, T>(options: ReactValidatorsOptions<T>): ReactFormControl<E, T | undefined>;
|
|
12
|
-
export declare function useReactControl<E extends HTMLElement, T>(
|
|
12
|
+
export declare function useReactControl<E extends HTMLElement, T>(value: T, validators?: ValidatorFn<T>[]): ReactFormControl<E, T>;
|
|
13
13
|
export declare function useFormControl<T>(): ReactHtmlControl<T | undefined>;
|
|
14
14
|
export declare function useFormControl<T>(options: ReactStateOptions<T>): ReactHtmlControl<T>;
|
|
15
15
|
export declare function useFormControl<T>(options: ReactValidatorsOptions<T>): ReactHtmlControl<T | undefined>;
|
|
16
|
-
export declare function useFormControl<T>(
|
|
16
|
+
export declare function useFormControl<T>(value: T, validators?: ValidatorFn<T>[]): ReactHtmlControl<T>;
|
|
17
17
|
export declare function useInputControl<T>(): ReactInputControl<T | undefined>;
|
|
18
18
|
export declare function useInputControl<T>(options: ReactStateOptions<T>): ReactInputControl<T>;
|
|
19
19
|
export declare function useInputControl<T>(options: ReactValidatorsOptions<T>): ReactInputControl<T | undefined>;
|
|
20
|
-
export declare function useInputControl<T>(
|
|
20
|
+
export declare function useInputControl<T>(value: T, validators?: ValidatorFn<T>[]): ReactInputControl<T>;
|
|
21
21
|
export {};
|
|
@@ -2,72 +2,73 @@ import { createFormControlOptions } from '@rolster/forms/arguments';
|
|
|
2
2
|
import { controlIsValid } from '@rolster/forms/helpers';
|
|
3
3
|
import { useRef, useState } from 'react';
|
|
4
4
|
function useControl(controlOptions, controlValidators) {
|
|
5
|
-
const {
|
|
6
|
-
const [
|
|
5
|
+
const { value, touched, validators } = createFormControlOptions(controlOptions, controlValidators);
|
|
6
|
+
const [state, setState] = useState({
|
|
7
7
|
dirty: false,
|
|
8
8
|
disabled: false,
|
|
9
9
|
focused: false,
|
|
10
|
-
state: state,
|
|
11
10
|
touched: !!touched,
|
|
12
|
-
validators
|
|
11
|
+
validators,
|
|
12
|
+
value
|
|
13
13
|
});
|
|
14
|
-
const
|
|
14
|
+
const initialValue = useRef(value);
|
|
15
15
|
const elementRef = useRef(null);
|
|
16
|
-
const errors =
|
|
16
|
+
const errors = state.validators
|
|
17
|
+
? controlIsValid({
|
|
18
|
+
value: state.value,
|
|
19
|
+
validators: state.validators
|
|
20
|
+
})
|
|
21
|
+
: [];
|
|
17
22
|
const valid = errors.length === 0;
|
|
18
23
|
function focus() {
|
|
19
|
-
|
|
24
|
+
setState((state) => ({ ...state, focused: true }));
|
|
20
25
|
}
|
|
21
26
|
function blur() {
|
|
22
|
-
|
|
27
|
+
setState((state) => ({ ...state, focused: false, touched: true }));
|
|
23
28
|
}
|
|
24
29
|
function disable() {
|
|
25
|
-
|
|
30
|
+
setState((state) => ({ ...state, disabled: true }));
|
|
26
31
|
}
|
|
27
32
|
function enable() {
|
|
28
|
-
|
|
33
|
+
setState((state) => ({ ...state, disabled: false }));
|
|
29
34
|
}
|
|
30
35
|
function touch() {
|
|
31
|
-
|
|
36
|
+
setState((state) => ({ ...state, touched: true }));
|
|
32
37
|
}
|
|
33
|
-
function
|
|
34
|
-
|
|
35
|
-
...currentState,
|
|
36
|
-
dirty: true,
|
|
37
|
-
state
|
|
38
|
-
}));
|
|
38
|
+
function setValue(value) {
|
|
39
|
+
setState((state) => ({ ...state, dirty: true, value }));
|
|
39
40
|
}
|
|
40
41
|
function setValidators(validators) {
|
|
41
|
-
|
|
42
|
+
setState((state) => ({ ...state, validators }));
|
|
42
43
|
}
|
|
43
44
|
function reset() {
|
|
44
|
-
|
|
45
|
-
...
|
|
45
|
+
setState((state) => ({
|
|
46
|
+
...state,
|
|
46
47
|
dirty: false,
|
|
47
|
-
|
|
48
|
+
value: initialValue.current,
|
|
48
49
|
touched: false
|
|
49
50
|
}));
|
|
50
51
|
}
|
|
51
52
|
return {
|
|
52
|
-
...
|
|
53
|
+
...state,
|
|
53
54
|
blur,
|
|
54
55
|
disable,
|
|
55
56
|
elementRef,
|
|
56
57
|
enable,
|
|
57
|
-
enabled: !
|
|
58
|
+
enabled: !state.disabled,
|
|
58
59
|
error: errors[0],
|
|
59
60
|
errors,
|
|
60
61
|
focus,
|
|
61
62
|
invalid: !valid,
|
|
62
|
-
pristine: !
|
|
63
|
+
pristine: !state.dirty,
|
|
63
64
|
reset,
|
|
64
|
-
setState,
|
|
65
65
|
setValidators,
|
|
66
|
+
setValue,
|
|
66
67
|
touch,
|
|
67
|
-
unfocused: !
|
|
68
|
-
untouched: !
|
|
68
|
+
unfocused: !state.focused,
|
|
69
|
+
untouched: !state.touched,
|
|
69
70
|
valid,
|
|
70
|
-
wrong:
|
|
71
|
+
wrong: state.touched && !valid
|
|
71
72
|
};
|
|
72
73
|
}
|
|
73
74
|
export function useReactControl(options, validators) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"form-control.hook.js","sourceRoot":"","sources":["../../src/form-control.hook.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,wBAAwB,EAAE,MAAM,0BAA0B,CAAC;AACpE,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAExD,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAgBzC,SAAS,UAAU,CACjB,cAA2C,EAC3C,iBAAoC;IAEpC,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,GAAG,wBAAwB,CAG7D,cAAc,EAAE,iBAAiB,CAAC,CAAC;IAErC,MAAM,CAAC,
|
|
1
|
+
{"version":3,"file":"form-control.hook.js","sourceRoot":"","sources":["../../src/form-control.hook.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { createFormGroupOptions } from '@rolster/forms/arguments';
|
|
2
|
-
import { controlsAllChecked, controlsPartialChecked,
|
|
2
|
+
import { controlsAllChecked, controlsPartialChecked, controlsToValue, groupIsValid } from '@rolster/forms/helpers';
|
|
3
3
|
import { useState } from 'react';
|
|
4
4
|
export function useFormGroup(options, groupValidators) {
|
|
5
5
|
const groupOptions = createFormGroupOptions(options, groupValidators);
|
|
@@ -7,7 +7,7 @@ export function useFormGroup(options, groupValidators) {
|
|
|
7
7
|
const { controls } = groupOptions;
|
|
8
8
|
const errors = validators ? groupIsValid({ controls, validators }) : [];
|
|
9
9
|
const valid = errors.length === 0 && controlsAllChecked(controls, 'valid');
|
|
10
|
-
const
|
|
10
|
+
const value = controlsToValue(controls);
|
|
11
11
|
const dirty = controlsPartialChecked(controls, 'dirty');
|
|
12
12
|
const dirtyAll = controlsAllChecked(controls, 'dirty');
|
|
13
13
|
const touched = controlsPartialChecked(controls, 'touched');
|
|
@@ -28,12 +28,12 @@ export function useFormGroup(options, groupValidators) {
|
|
|
28
28
|
pristineAll: !dirtyAll,
|
|
29
29
|
reset,
|
|
30
30
|
setValidators,
|
|
31
|
-
state,
|
|
32
31
|
touched,
|
|
33
32
|
touchedAll,
|
|
34
33
|
untouched: !touched,
|
|
35
34
|
untouchedAll: !touchedAll,
|
|
36
35
|
valid,
|
|
36
|
+
value,
|
|
37
37
|
wrong: touched && !valid
|
|
38
38
|
};
|
|
39
39
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"form-group.hook.js","sourceRoot":"","sources":["../../src/form-group.hook.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EACL,kBAAkB,EAClB,sBAAsB,EACtB,eAAe,EACf,YAAY,EACb,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAUjC,MAAM,UAAU,YAAY,CAC1B,OAAgC,EAChC,eAAuC;IAEvC,MAAM,YAAY,GAAG,sBAAsB,CACzC,OAAO,EACP,eAAe,CAChB,CAAC;IAEF,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;IAEtE,MAAM,EAAE,QAAQ,EAAE,GAAG,YAAY,CAAC;IAElC,MAAM,MAAM,GAAG,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,EAAE,QAAQ,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IACxE,MAAM,KAAK,GAAG,MAAM,CAAC,MAAM,KAAK,CAAC,IAAI,kBAAkB,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IAC3E,MAAM,KAAK,GAAG,eAAe,CAAC,QAAQ,CAAC,CAAC;IACxC,MAAM,KAAK,GAAG,sBAAsB,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IACxD,MAAM,QAAQ,GAAG,kBAAkB,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IACvD,MAAM,OAAO,GAAG,sBAAsB,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;IAC5D,MAAM,UAAU,GAAG,kBAAkB,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;IAE3D,SAAS,KAAK;QACZ,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;YAC1C,OAAO,CAAC,KAAK,EAAE,CAAC;QAClB,CAAC,CAAC,CAAC;IACL,CAAC;IAED,OAAO;QACL,QAAQ;QACR,KAAK;QACL,QAAQ;QACR,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC;QAChB,MAAM;QACN,OAAO,EAAE,CAAC,KAAK;QACf,QAAQ,EAAE,CAAC,KAAK;QAChB,WAAW,EAAE,CAAC,QAAQ;QACtB,KAAK;QACL,aAAa;QACb,
|
|
1
|
+
{"version":3,"file":"form-group.hook.js","sourceRoot":"","sources":["../../src/form-group.hook.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EACL,kBAAkB,EAClB,sBAAsB,EACtB,eAAe,EACf,YAAY,EACb,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAUjC,MAAM,UAAU,YAAY,CAC1B,OAAgC,EAChC,eAAuC;IAEvC,MAAM,YAAY,GAAG,sBAAsB,CACzC,OAAO,EACP,eAAe,CAChB,CAAC;IAEF,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;IAEtE,MAAM,EAAE,QAAQ,EAAE,GAAG,YAAY,CAAC;IAElC,MAAM,MAAM,GAAG,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,EAAE,QAAQ,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IACxE,MAAM,KAAK,GAAG,MAAM,CAAC,MAAM,KAAK,CAAC,IAAI,kBAAkB,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IAC3E,MAAM,KAAK,GAAG,eAAe,CAAC,QAAQ,CAAC,CAAC;IACxC,MAAM,KAAK,GAAG,sBAAsB,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IACxD,MAAM,QAAQ,GAAG,kBAAkB,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IACvD,MAAM,OAAO,GAAG,sBAAsB,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;IAC5D,MAAM,UAAU,GAAG,kBAAkB,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;IAE3D,SAAS,KAAK;QACZ,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;YAC1C,OAAO,CAAC,KAAK,EAAE,CAAC;QAClB,CAAC,CAAC,CAAC;IACL,CAAC;IAED,OAAO;QACL,QAAQ;QACR,KAAK;QACL,QAAQ;QACR,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC;QAChB,MAAM;QACN,OAAO,EAAE,CAAC,KAAK;QACf,QAAQ,EAAE,CAAC,KAAK;QAChB,WAAW,EAAE,CAAC,QAAQ;QACtB,KAAK;QACL,aAAa;QACb,OAAO;QACP,UAAU;QACV,SAAS,EAAE,CAAC,OAAO;QACnB,YAAY,EAAE,CAAC,UAAU;QACzB,KAAK;QACL,KAAK;QACL,KAAK,EAAE,OAAO,IAAI,CAAC,KAAK;KACzB,CAAC;AACJ,CAAC"}
|
|
@@ -21,7 +21,7 @@ export function useTextRefControl(options, validators) {
|
|
|
21
21
|
return useInputRefControl({
|
|
22
22
|
...createFormControlOptions(options, validators),
|
|
23
23
|
setValue: (control, value) => {
|
|
24
|
-
control.
|
|
24
|
+
control.setValue(value);
|
|
25
25
|
}
|
|
26
26
|
});
|
|
27
27
|
}
|
|
@@ -29,7 +29,7 @@ export function useNumberRefControl(options, validators) {
|
|
|
29
29
|
return useInputRefControl({
|
|
30
30
|
...createFormControlOptions(options, validators),
|
|
31
31
|
setValue: (control, value) => {
|
|
32
|
-
control.
|
|
32
|
+
control.setValue(+value);
|
|
33
33
|
}
|
|
34
34
|
});
|
|
35
35
|
}
|
package/dist/esm/types.d.ts
CHANGED
|
@@ -9,7 +9,7 @@ export type ReactInputControl<T = any> = ReactFormControl<HTMLInputElement, T>;
|
|
|
9
9
|
export type ReactControls<T extends ReactFormControl = ReactFormControl> = AbstractControls<T>;
|
|
10
10
|
export type ReactGroup<C extends ReactControls = ReactControls> = AbstractFormGroup<C>;
|
|
11
11
|
export interface ReactArrayControlOptions<T = any> extends FormArrayControlOptions<T> {
|
|
12
|
-
|
|
12
|
+
initialValue: T;
|
|
13
13
|
dirty?: boolean;
|
|
14
14
|
disabled?: boolean;
|
|
15
15
|
focused?: boolean;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@rolster/react-forms",
|
|
3
|
-
"version": "18.
|
|
3
|
+
"version": "18.5.0",
|
|
4
4
|
"description": "It implements a set of classes that allow managing the control of states of the input components in React",
|
|
5
5
|
"module": "dist/esm/index.js",
|
|
6
6
|
"main": "dist/cjs/index.js",
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"prepublishOnly": "npm run build"
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
|
-
"@rolster/forms": "^2.
|
|
29
|
+
"@rolster/forms": "^2.5.2",
|
|
30
30
|
"@rolster/validators": "^1.0.5",
|
|
31
31
|
"uuid": "^9.0.1"
|
|
32
32
|
},
|
|
@@ -52,7 +52,7 @@
|
|
|
52
52
|
},
|
|
53
53
|
"repository": {
|
|
54
54
|
"type": "git",
|
|
55
|
-
"url": "https://github.com/rolster-developments/
|
|
55
|
+
"url": "https://github.com/rolster-developments/react-forms.git"
|
|
56
56
|
},
|
|
57
57
|
"keywords": [
|
|
58
58
|
"rolster",
|