@digigov/form 0.5.2 → 0.5.3
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/CHANGELOG.md +8 -1
- package/Field/index.js +19 -16
- package/es/Field/index.js +20 -16
- package/es/index.js +8 -4
- package/esm/Field/index.js +20 -16
- package/esm/index.js +9 -5
- package/index.js +8 -4
- package/libs/form/src/Field/index.d.ts +1 -0
- package/libs/form/src/index.d.ts +4 -1
- package/libs-ui/react-core/src/ArrowIcon/index.d.ts +4 -3
- package/libs-ui/react-core/src/CaretIcon/index.d.ts +4 -3
- package/libs-ui/react-core/src/SvgIcon/index.d.ts +20 -0
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,6 +1,13 @@
|
|
|
1
1
|
# Change Log - @digigov/form
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Mon, 28 Feb 2022 15:04:49 GMT and should not be manually modified.
|
|
4
|
+
|
|
5
|
+
## 0.5.3
|
|
6
|
+
Mon, 28 Feb 2022 15:04:49 GMT
|
|
7
|
+
|
|
8
|
+
### Patches
|
|
9
|
+
|
|
10
|
+
- pass custom component registry to formbuilder
|
|
4
11
|
|
|
5
12
|
## 0.5.1
|
|
6
13
|
Thu, 24 Feb 2022 14:51:06 GMT
|
package/Field/index.js
CHANGED
|
@@ -195,7 +195,8 @@ var useField = function useField(name, customField) {
|
|
|
195
195
|
control = _useContext.control,
|
|
196
196
|
register = _useContext.register,
|
|
197
197
|
errors = _useContext.errors,
|
|
198
|
-
registerField = _useContext.registerField
|
|
198
|
+
registerField = _useContext.registerField,
|
|
199
|
+
componentRegistry = _useContext.componentRegistry;
|
|
199
200
|
|
|
200
201
|
(0, _react.useMemo)(function () {
|
|
201
202
|
return (customField === null || customField === void 0 ? void 0 : customField.type) && registerField((0, _extends2["default"])({}, customField, {
|
|
@@ -206,42 +207,43 @@ var useField = function useField(name, customField) {
|
|
|
206
207
|
field: customField || fieldsMap[name],
|
|
207
208
|
control: control,
|
|
208
209
|
register: register,
|
|
210
|
+
componentRegistry: componentRegistry,
|
|
209
211
|
error: errors[name]
|
|
210
212
|
};
|
|
211
213
|
};
|
|
212
214
|
|
|
213
|
-
function calculateField(children, field) {
|
|
215
|
+
function calculateField(children, field, componentRegistry) {
|
|
214
216
|
var _field$extra;
|
|
215
217
|
|
|
216
218
|
var calculatedField = (0, _extends2["default"])({}, field);
|
|
219
|
+
var FieldComponentRegistry = (0, _extends2["default"])({}, FIELD_COMPONENTS, componentRegistry);
|
|
217
220
|
|
|
218
221
|
if (children) {
|
|
219
222
|
calculatedField.component = children;
|
|
220
223
|
} else if (typeof field.component === 'function') {// leave as is
|
|
221
224
|
} else if (!field.component && !field.type) {
|
|
222
|
-
var
|
|
225
|
+
var _FieldComponentRegist;
|
|
223
226
|
|
|
224
|
-
calculatedField.component =
|
|
225
|
-
calculatedField.controlled = ((
|
|
227
|
+
calculatedField.component = FieldComponentRegistry.string.component;
|
|
228
|
+
calculatedField.controlled = ((_FieldComponentRegist = FieldComponentRegistry.string) === null || _FieldComponentRegist === void 0 ? void 0 : _FieldComponentRegist.controlled) || false;
|
|
226
229
|
} else if (typeof (field === null || field === void 0 ? void 0 : (_field$extra = field.extra) === null || _field$extra === void 0 ? void 0 : _field$extra.component) === 'string' && ALTERNATIVE_COMPONENTS[field.extra.component]) {
|
|
227
230
|
var _ALTERNATIVE_COMPONEN;
|
|
228
231
|
|
|
229
232
|
calculatedField.controlled = ((_ALTERNATIVE_COMPONEN = ALTERNATIVE_COMPONENTS[field.extra.component]) === null || _ALTERNATIVE_COMPONEN === void 0 ? void 0 : _ALTERNATIVE_COMPONEN.controlled) || false;
|
|
230
233
|
calculatedField.component = ALTERNATIVE_COMPONENTS[field.extra.component].component;
|
|
231
|
-
} else if (!field.component && field.type &&
|
|
232
|
-
var
|
|
234
|
+
} else if (!field.component && field.type && FieldComponentRegistry[field.type]) {
|
|
235
|
+
var _FieldComponentRegist2;
|
|
233
236
|
|
|
234
|
-
calculatedField.component =
|
|
235
|
-
calculatedField.wrapper =
|
|
236
|
-
calculatedField.controlled = ((
|
|
237
|
+
calculatedField.component = FieldComponentRegistry[field.type].component;
|
|
238
|
+
calculatedField.wrapper = FieldComponentRegistry[field.type].wrapper;
|
|
239
|
+
calculatedField.controlled = ((_FieldComponentRegist2 = FieldComponentRegistry[field.type]) === null || _FieldComponentRegist2 === void 0 ? void 0 : _FieldComponentRegist2.controlled) || false;
|
|
237
240
|
} else {
|
|
238
|
-
var
|
|
241
|
+
var _FieldComponentRegist3;
|
|
239
242
|
|
|
240
|
-
calculatedField.component =
|
|
241
|
-
calculatedField.controlled = ((
|
|
243
|
+
calculatedField.component = FieldComponentRegistry.string.component;
|
|
244
|
+
calculatedField.controlled = ((_FieldComponentRegist3 = FieldComponentRegistry.string) === null || _FieldComponentRegist3 === void 0 ? void 0 : _FieldComponentRegist3.controlled) || false;
|
|
242
245
|
}
|
|
243
246
|
|
|
244
|
-
calculatedField.wrapper = calculatedField.wrapper || 'label';
|
|
245
247
|
return calculatedField;
|
|
246
248
|
}
|
|
247
249
|
|
|
@@ -254,10 +256,11 @@ var Field = function Field(_ref3) {
|
|
|
254
256
|
field = _useField.field,
|
|
255
257
|
control = _useField.control,
|
|
256
258
|
register = _useField.register,
|
|
257
|
-
error = _useField.error
|
|
259
|
+
error = _useField.error,
|
|
260
|
+
componentRegistry = _useField.componentRegistry;
|
|
258
261
|
|
|
259
262
|
var calculatedField = (0, _react.useMemo)(function () {
|
|
260
|
-
return calculateField(children, field);
|
|
263
|
+
return calculateField(children, field, componentRegistry);
|
|
261
264
|
}, [field]);
|
|
262
265
|
|
|
263
266
|
if (calculatedField.condition) {
|
package/es/Field/index.js
CHANGED
|
@@ -157,7 +157,8 @@ var useField = function useField(name, customField) {
|
|
|
157
157
|
control = _useContext.control,
|
|
158
158
|
register = _useContext.register,
|
|
159
159
|
errors = _useContext.errors,
|
|
160
|
-
registerField = _useContext.registerField
|
|
160
|
+
registerField = _useContext.registerField,
|
|
161
|
+
componentRegistry = _useContext.componentRegistry;
|
|
161
162
|
|
|
162
163
|
useMemo(function () {
|
|
163
164
|
return (customField === null || customField === void 0 ? void 0 : customField.type) && registerField(_extends({}, customField, {
|
|
@@ -168,42 +169,44 @@ var useField = function useField(name, customField) {
|
|
|
168
169
|
field: customField || fieldsMap[name],
|
|
169
170
|
control: control,
|
|
170
171
|
register: register,
|
|
172
|
+
componentRegistry: componentRegistry,
|
|
171
173
|
error: errors[name]
|
|
172
174
|
};
|
|
173
175
|
};
|
|
174
176
|
|
|
175
|
-
function calculateField(children, field) {
|
|
177
|
+
function calculateField(children, field, componentRegistry) {
|
|
176
178
|
var _field$extra;
|
|
177
179
|
|
|
178
180
|
var calculatedField = _extends({}, field);
|
|
179
181
|
|
|
182
|
+
var FieldComponentRegistry = _extends({}, FIELD_COMPONENTS, componentRegistry);
|
|
183
|
+
|
|
180
184
|
if (children) {
|
|
181
185
|
calculatedField.component = children;
|
|
182
186
|
} else if (typeof field.component === 'function') {// leave as is
|
|
183
187
|
} else if (!field.component && !field.type) {
|
|
184
|
-
var
|
|
188
|
+
var _FieldComponentRegist;
|
|
185
189
|
|
|
186
|
-
calculatedField.component =
|
|
187
|
-
calculatedField.controlled = ((
|
|
190
|
+
calculatedField.component = FieldComponentRegistry.string.component;
|
|
191
|
+
calculatedField.controlled = ((_FieldComponentRegist = FieldComponentRegistry.string) === null || _FieldComponentRegist === void 0 ? void 0 : _FieldComponentRegist.controlled) || false;
|
|
188
192
|
} else if (typeof (field === null || field === void 0 ? void 0 : (_field$extra = field.extra) === null || _field$extra === void 0 ? void 0 : _field$extra.component) === 'string' && ALTERNATIVE_COMPONENTS[field.extra.component]) {
|
|
189
193
|
var _ALTERNATIVE_COMPONEN;
|
|
190
194
|
|
|
191
195
|
calculatedField.controlled = ((_ALTERNATIVE_COMPONEN = ALTERNATIVE_COMPONENTS[field.extra.component]) === null || _ALTERNATIVE_COMPONEN === void 0 ? void 0 : _ALTERNATIVE_COMPONEN.controlled) || false;
|
|
192
196
|
calculatedField.component = ALTERNATIVE_COMPONENTS[field.extra.component].component;
|
|
193
|
-
} else if (!field.component && field.type &&
|
|
194
|
-
var
|
|
197
|
+
} else if (!field.component && field.type && FieldComponentRegistry[field.type]) {
|
|
198
|
+
var _FieldComponentRegist2;
|
|
195
199
|
|
|
196
|
-
calculatedField.component =
|
|
197
|
-
calculatedField.wrapper =
|
|
198
|
-
calculatedField.controlled = ((
|
|
200
|
+
calculatedField.component = FieldComponentRegistry[field.type].component;
|
|
201
|
+
calculatedField.wrapper = FieldComponentRegistry[field.type].wrapper;
|
|
202
|
+
calculatedField.controlled = ((_FieldComponentRegist2 = FieldComponentRegistry[field.type]) === null || _FieldComponentRegist2 === void 0 ? void 0 : _FieldComponentRegist2.controlled) || false;
|
|
199
203
|
} else {
|
|
200
|
-
var
|
|
204
|
+
var _FieldComponentRegist3;
|
|
201
205
|
|
|
202
|
-
calculatedField.component =
|
|
203
|
-
calculatedField.controlled = ((
|
|
206
|
+
calculatedField.component = FieldComponentRegistry.string.component;
|
|
207
|
+
calculatedField.controlled = ((_FieldComponentRegist3 = FieldComponentRegistry.string) === null || _FieldComponentRegist3 === void 0 ? void 0 : _FieldComponentRegist3.controlled) || false;
|
|
204
208
|
}
|
|
205
209
|
|
|
206
|
-
calculatedField.wrapper = calculatedField.wrapper || 'label';
|
|
207
210
|
return calculatedField;
|
|
208
211
|
}
|
|
209
212
|
|
|
@@ -216,10 +219,11 @@ export var Field = function Field(_ref3) {
|
|
|
216
219
|
field = _useField.field,
|
|
217
220
|
control = _useField.control,
|
|
218
221
|
register = _useField.register,
|
|
219
|
-
error = _useField.error
|
|
222
|
+
error = _useField.error,
|
|
223
|
+
componentRegistry = _useField.componentRegistry;
|
|
220
224
|
|
|
221
225
|
var calculatedField = useMemo(function () {
|
|
222
|
-
return calculateField(children, field);
|
|
226
|
+
return calculateField(children, field, componentRegistry);
|
|
223
227
|
}, [field]);
|
|
224
228
|
|
|
225
229
|
if (calculatedField.condition) {
|
package/es/index.js
CHANGED
|
@@ -27,7 +27,8 @@ export var FormBase = function FormBase(_ref) {
|
|
|
27
27
|
initial = _ref.initial,
|
|
28
28
|
reValidateMode = _ref.reValidateMode,
|
|
29
29
|
shouldFocusError = _ref.shouldFocusError,
|
|
30
|
-
criteriaMode = _ref.criteriaMode
|
|
30
|
+
criteriaMode = _ref.criteriaMode,
|
|
31
|
+
componentRegistry = _ref.componentRegistry;
|
|
31
32
|
var form = useForm({
|
|
32
33
|
resolver: resolver,
|
|
33
34
|
mode: mode,
|
|
@@ -52,7 +53,8 @@ export var FormBase = function FormBase(_ref) {
|
|
|
52
53
|
register: form.register,
|
|
53
54
|
registerField: registerField,
|
|
54
55
|
errors: form.errors,
|
|
55
|
-
reset: form.reset
|
|
56
|
+
reset: form.reset,
|
|
57
|
+
componentRegistry: componentRegistry
|
|
56
58
|
};
|
|
57
59
|
return /*#__PURE__*/React.createElement(FormContext.Provider, {
|
|
58
60
|
value: ctx
|
|
@@ -83,7 +85,8 @@ export function FormBuilder(_ref2) {
|
|
|
83
85
|
criteriaMode = _ref2$criteriaMode === void 0 ? 'firstError' : _ref2$criteriaMode,
|
|
84
86
|
_ref2$auto = _ref2.auto,
|
|
85
87
|
auto = _ref2$auto === void 0 ? false : _ref2$auto,
|
|
86
|
-
validatorRegistry = _ref2.validatorRegistry
|
|
88
|
+
validatorRegistry = _ref2.validatorRegistry,
|
|
89
|
+
componentRegistry = _ref2.componentRegistry;
|
|
87
90
|
var fieldsState = useRef(fields);
|
|
88
91
|
var setFieldsState = useCallback(function (newFields) {
|
|
89
92
|
fieldsState.current = newFields;
|
|
@@ -135,7 +138,8 @@ export function FormBuilder(_ref2) {
|
|
|
135
138
|
mode: mode,
|
|
136
139
|
shouldFocusError: shouldFocusError,
|
|
137
140
|
criteriaMode: criteriaMode,
|
|
138
|
-
onSubmit: onSubmit
|
|
141
|
+
onSubmit: onSubmit,
|
|
142
|
+
componentRegistry: componentRegistry
|
|
139
143
|
}, fieldChildren, children);
|
|
140
144
|
}
|
|
141
145
|
export default FormBuilder;
|
package/esm/Field/index.js
CHANGED
|
@@ -157,7 +157,8 @@ var useField = function useField(name, customField) {
|
|
|
157
157
|
control = _useContext.control,
|
|
158
158
|
register = _useContext.register,
|
|
159
159
|
errors = _useContext.errors,
|
|
160
|
-
registerField = _useContext.registerField
|
|
160
|
+
registerField = _useContext.registerField,
|
|
161
|
+
componentRegistry = _useContext.componentRegistry;
|
|
161
162
|
|
|
162
163
|
useMemo(function () {
|
|
163
164
|
return (customField === null || customField === void 0 ? void 0 : customField.type) && registerField(_extends({}, customField, {
|
|
@@ -168,42 +169,44 @@ var useField = function useField(name, customField) {
|
|
|
168
169
|
field: customField || fieldsMap[name],
|
|
169
170
|
control: control,
|
|
170
171
|
register: register,
|
|
172
|
+
componentRegistry: componentRegistry,
|
|
171
173
|
error: errors[name]
|
|
172
174
|
};
|
|
173
175
|
};
|
|
174
176
|
|
|
175
|
-
function calculateField(children, field) {
|
|
177
|
+
function calculateField(children, field, componentRegistry) {
|
|
176
178
|
var _field$extra;
|
|
177
179
|
|
|
178
180
|
var calculatedField = _extends({}, field);
|
|
179
181
|
|
|
182
|
+
var FieldComponentRegistry = _extends({}, FIELD_COMPONENTS, componentRegistry);
|
|
183
|
+
|
|
180
184
|
if (children) {
|
|
181
185
|
calculatedField.component = children;
|
|
182
186
|
} else if (typeof field.component === 'function') {// leave as is
|
|
183
187
|
} else if (!field.component && !field.type) {
|
|
184
|
-
var
|
|
188
|
+
var _FieldComponentRegist;
|
|
185
189
|
|
|
186
|
-
calculatedField.component =
|
|
187
|
-
calculatedField.controlled = ((
|
|
190
|
+
calculatedField.component = FieldComponentRegistry.string.component;
|
|
191
|
+
calculatedField.controlled = ((_FieldComponentRegist = FieldComponentRegistry.string) === null || _FieldComponentRegist === void 0 ? void 0 : _FieldComponentRegist.controlled) || false;
|
|
188
192
|
} else if (typeof (field === null || field === void 0 ? void 0 : (_field$extra = field.extra) === null || _field$extra === void 0 ? void 0 : _field$extra.component) === 'string' && ALTERNATIVE_COMPONENTS[field.extra.component]) {
|
|
189
193
|
var _ALTERNATIVE_COMPONEN;
|
|
190
194
|
|
|
191
195
|
calculatedField.controlled = ((_ALTERNATIVE_COMPONEN = ALTERNATIVE_COMPONENTS[field.extra.component]) === null || _ALTERNATIVE_COMPONEN === void 0 ? void 0 : _ALTERNATIVE_COMPONEN.controlled) || false;
|
|
192
196
|
calculatedField.component = ALTERNATIVE_COMPONENTS[field.extra.component].component;
|
|
193
|
-
} else if (!field.component && field.type &&
|
|
194
|
-
var
|
|
197
|
+
} else if (!field.component && field.type && FieldComponentRegistry[field.type]) {
|
|
198
|
+
var _FieldComponentRegist2;
|
|
195
199
|
|
|
196
|
-
calculatedField.component =
|
|
197
|
-
calculatedField.wrapper =
|
|
198
|
-
calculatedField.controlled = ((
|
|
200
|
+
calculatedField.component = FieldComponentRegistry[field.type].component;
|
|
201
|
+
calculatedField.wrapper = FieldComponentRegistry[field.type].wrapper;
|
|
202
|
+
calculatedField.controlled = ((_FieldComponentRegist2 = FieldComponentRegistry[field.type]) === null || _FieldComponentRegist2 === void 0 ? void 0 : _FieldComponentRegist2.controlled) || false;
|
|
199
203
|
} else {
|
|
200
|
-
var
|
|
204
|
+
var _FieldComponentRegist3;
|
|
201
205
|
|
|
202
|
-
calculatedField.component =
|
|
203
|
-
calculatedField.controlled = ((
|
|
206
|
+
calculatedField.component = FieldComponentRegistry.string.component;
|
|
207
|
+
calculatedField.controlled = ((_FieldComponentRegist3 = FieldComponentRegistry.string) === null || _FieldComponentRegist3 === void 0 ? void 0 : _FieldComponentRegist3.controlled) || false;
|
|
204
208
|
}
|
|
205
209
|
|
|
206
|
-
calculatedField.wrapper = calculatedField.wrapper || 'label';
|
|
207
210
|
return calculatedField;
|
|
208
211
|
}
|
|
209
212
|
|
|
@@ -216,10 +219,11 @@ export var Field = function Field(_ref3) {
|
|
|
216
219
|
field = _useField.field,
|
|
217
220
|
control = _useField.control,
|
|
218
221
|
register = _useField.register,
|
|
219
|
-
error = _useField.error
|
|
222
|
+
error = _useField.error,
|
|
223
|
+
componentRegistry = _useField.componentRegistry;
|
|
220
224
|
|
|
221
225
|
var calculatedField = useMemo(function () {
|
|
222
|
-
return calculateField(children, field);
|
|
226
|
+
return calculateField(children, field, componentRegistry);
|
|
223
227
|
}, [field]);
|
|
224
228
|
|
|
225
229
|
if (calculatedField.condition) {
|
package/esm/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license Digigov v0.5.
|
|
1
|
+
/** @license Digigov v0.5.3
|
|
2
2
|
*
|
|
3
3
|
* This source code is licensed under the MIT license found in the
|
|
4
4
|
* LICENSE file in the root directory of this source tree.
|
|
@@ -32,7 +32,8 @@ export var FormBase = function FormBase(_ref) {
|
|
|
32
32
|
initial = _ref.initial,
|
|
33
33
|
reValidateMode = _ref.reValidateMode,
|
|
34
34
|
shouldFocusError = _ref.shouldFocusError,
|
|
35
|
-
criteriaMode = _ref.criteriaMode
|
|
35
|
+
criteriaMode = _ref.criteriaMode,
|
|
36
|
+
componentRegistry = _ref.componentRegistry;
|
|
36
37
|
var form = useForm({
|
|
37
38
|
resolver: resolver,
|
|
38
39
|
mode: mode,
|
|
@@ -57,7 +58,8 @@ export var FormBase = function FormBase(_ref) {
|
|
|
57
58
|
register: form.register,
|
|
58
59
|
registerField: registerField,
|
|
59
60
|
errors: form.errors,
|
|
60
|
-
reset: form.reset
|
|
61
|
+
reset: form.reset,
|
|
62
|
+
componentRegistry: componentRegistry
|
|
61
63
|
};
|
|
62
64
|
return /*#__PURE__*/React.createElement(FormContext.Provider, {
|
|
63
65
|
value: ctx
|
|
@@ -88,7 +90,8 @@ export function FormBuilder(_ref2) {
|
|
|
88
90
|
criteriaMode = _ref2$criteriaMode === void 0 ? 'firstError' : _ref2$criteriaMode,
|
|
89
91
|
_ref2$auto = _ref2.auto,
|
|
90
92
|
auto = _ref2$auto === void 0 ? false : _ref2$auto,
|
|
91
|
-
validatorRegistry = _ref2.validatorRegistry
|
|
93
|
+
validatorRegistry = _ref2.validatorRegistry,
|
|
94
|
+
componentRegistry = _ref2.componentRegistry;
|
|
92
95
|
var fieldsState = useRef(fields);
|
|
93
96
|
var setFieldsState = useCallback(function (newFields) {
|
|
94
97
|
fieldsState.current = newFields;
|
|
@@ -140,7 +143,8 @@ export function FormBuilder(_ref2) {
|
|
|
140
143
|
mode: mode,
|
|
141
144
|
shouldFocusError: shouldFocusError,
|
|
142
145
|
criteriaMode: criteriaMode,
|
|
143
|
-
onSubmit: onSubmit
|
|
146
|
+
onSubmit: onSubmit,
|
|
147
|
+
componentRegistry: componentRegistry
|
|
144
148
|
}, fieldChildren, children);
|
|
145
149
|
}
|
|
146
150
|
export default FormBuilder;
|
package/index.js
CHANGED
|
@@ -82,7 +82,8 @@ var FormBase = function FormBase(_ref) {
|
|
|
82
82
|
initial = _ref.initial,
|
|
83
83
|
reValidateMode = _ref.reValidateMode,
|
|
84
84
|
shouldFocusError = _ref.shouldFocusError,
|
|
85
|
-
criteriaMode = _ref.criteriaMode
|
|
85
|
+
criteriaMode = _ref.criteriaMode,
|
|
86
|
+
componentRegistry = _ref.componentRegistry;
|
|
86
87
|
var form = (0, _reactHookForm.useForm)({
|
|
87
88
|
resolver: resolver,
|
|
88
89
|
mode: mode,
|
|
@@ -107,7 +108,8 @@ var FormBase = function FormBase(_ref) {
|
|
|
107
108
|
register: form.register,
|
|
108
109
|
registerField: registerField,
|
|
109
110
|
errors: form.errors,
|
|
110
|
-
reset: form.reset
|
|
111
|
+
reset: form.reset,
|
|
112
|
+
componentRegistry: componentRegistry
|
|
111
113
|
};
|
|
112
114
|
return /*#__PURE__*/_react["default"].createElement(FormContext.Provider, {
|
|
113
115
|
value: ctx
|
|
@@ -141,7 +143,8 @@ function FormBuilder(_ref2) {
|
|
|
141
143
|
criteriaMode = _ref2$criteriaMode === void 0 ? 'firstError' : _ref2$criteriaMode,
|
|
142
144
|
_ref2$auto = _ref2.auto,
|
|
143
145
|
auto = _ref2$auto === void 0 ? false : _ref2$auto,
|
|
144
|
-
validatorRegistry = _ref2.validatorRegistry
|
|
146
|
+
validatorRegistry = _ref2.validatorRegistry,
|
|
147
|
+
componentRegistry = _ref2.componentRegistry;
|
|
145
148
|
var fieldsState = (0, _react.useRef)(fields);
|
|
146
149
|
var setFieldsState = (0, _react.useCallback)(function (newFields) {
|
|
147
150
|
fieldsState.current = newFields;
|
|
@@ -193,7 +196,8 @@ function FormBuilder(_ref2) {
|
|
|
193
196
|
mode: mode,
|
|
194
197
|
shouldFocusError: shouldFocusError,
|
|
195
198
|
criteriaMode: criteriaMode,
|
|
196
|
-
onSubmit: onSubmit
|
|
199
|
+
onSubmit: onSubmit,
|
|
200
|
+
componentRegistry: componentRegistry
|
|
197
201
|
}, fieldChildren, children);
|
|
198
202
|
}
|
|
199
203
|
|
package/libs/form/src/index.d.ts
CHANGED
|
@@ -2,6 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import { UseFormMethods, UseFormOptions } from 'react-hook-form';
|
|
3
3
|
import { GridProps } from '@material-ui/core/Grid';
|
|
4
4
|
import { ValidatorSchema } from '@digigov/form/validators';
|
|
5
|
+
import { FieldComponentRegistry } from '@digigov/form/Field';
|
|
5
6
|
export * from '@digigov/form/Fieldset';
|
|
6
7
|
export * from '@digigov/form/Field';
|
|
7
8
|
export declare type FieldError = {
|
|
@@ -45,6 +46,7 @@ export interface FormContextProps {
|
|
|
45
46
|
register: UseFormMethods['register'];
|
|
46
47
|
registerField: (field: FieldSpec) => void;
|
|
47
48
|
errors: UseFormMethods['errors'];
|
|
49
|
+
componentRegistry?: FieldComponentRegistry;
|
|
48
50
|
}
|
|
49
51
|
export declare const FormContext: React.Context<FormContextProps>;
|
|
50
52
|
export interface FormBuilderProps {
|
|
@@ -59,6 +61,7 @@ export interface FormBuilderProps {
|
|
|
59
61
|
shouldFocusError?: boolean;
|
|
60
62
|
auto?: boolean;
|
|
61
63
|
validatorRegistry?: Record<string, ValidatorSchema>;
|
|
64
|
+
componentRegistry?: FieldComponentRegistry;
|
|
62
65
|
}
|
|
63
66
|
interface FormBaseProps extends Omit<FormBuilderProps, 'fields' | 'fieldsets' | 'auto'> {
|
|
64
67
|
fieldsetsMap?: Record<string, FieldsetSpec>;
|
|
@@ -67,5 +70,5 @@ interface FormBaseProps extends Omit<FormBuilderProps, 'fields' | 'fieldsets' |
|
|
|
67
70
|
resolver: any;
|
|
68
71
|
}
|
|
69
72
|
export declare const FormBase: React.FC<FormBaseProps>;
|
|
70
|
-
export declare function FormBuilder({ fields, fieldsets, initial, onSubmit, children, reValidateMode, mode, shouldFocusError, criteriaMode, auto, validatorRegistry, }: FormBuilderProps): React.ReactElement;
|
|
73
|
+
export declare function FormBuilder({ fields, fieldsets, initial, onSubmit, children, reValidateMode, mode, shouldFocusError, criteriaMode, auto, validatorRegistry, componentRegistry, }: FormBuilderProps): React.ReactElement;
|
|
71
74
|
export default FormBuilder;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
|
|
3
|
-
export interface ArrowIconProps extends
|
|
2
|
+
import { SvgIconProps } from '@digigov/react-core/SvgIcon';
|
|
3
|
+
export interface ArrowIconProps extends SvgIconProps {
|
|
4
|
+
ref?: React.Ref<SVGSVGElement>;
|
|
4
5
|
/**
|
|
5
6
|
* direction is optional.
|
|
6
7
|
* direction prop declares the direction of the svg icon.
|
|
@@ -11,5 +12,5 @@ export interface ArrowIconProps extends SVGElementAttributes {
|
|
|
11
12
|
* ArrowIcon component is used to add arrow icon.
|
|
12
13
|
* ArrowIcon component can be used inside other components, for example CallToAction component.
|
|
13
14
|
*/
|
|
14
|
-
export declare const ArrowIcon: React.
|
|
15
|
+
export declare const ArrowIcon: React.FC<ArrowIconProps>;
|
|
15
16
|
export default ArrowIcon;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
|
|
3
|
-
export interface CaretIconProps extends
|
|
2
|
+
import { SvgIconProps } from '@digigov/react-core/SvgIcon';
|
|
3
|
+
export interface CaretIconProps extends SvgIconProps {
|
|
4
|
+
ref?: React.Ref<SVGSVGElement>;
|
|
4
5
|
/**
|
|
5
6
|
* direction is optional.
|
|
6
7
|
* direction prop declares the direction of the svg icon.
|
|
@@ -11,5 +12,5 @@ export interface CaretIconProps extends SVGElementAttributes {
|
|
|
11
12
|
* CaretIcon component is used to add caret icon.
|
|
12
13
|
* CaretIcon can be used inside other components, for example BackLink component.
|
|
13
14
|
*/
|
|
14
|
-
export declare const CaretIcon: React.
|
|
15
|
+
export declare const CaretIcon: React.FC<CaretIconProps>;
|
|
15
16
|
export default CaretIcon;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
declare type SVGElementAttributes = JSX.IntrinsicElements['svg'];
|
|
3
|
+
export interface SvgIconProps extends SVGElementAttributes {
|
|
4
|
+
/**
|
|
5
|
+
* size prop declares the size of the svg icon.
|
|
6
|
+
* size is optional. The default value is 'm'.
|
|
7
|
+
*/
|
|
8
|
+
size?: 's' | 'm' | 'l' | 'xl';
|
|
9
|
+
/**
|
|
10
|
+
* variant property styles svg icon with Gov.gr palette's basic colors.
|
|
11
|
+
* variant property is optional.
|
|
12
|
+
*/
|
|
13
|
+
variant?: 'dark' | 'light' | 'gray' | 'primary' | 'success' | 'warning' | 'error' | 'focus' | 'link';
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* Use SvgIcon as global svg component.
|
|
17
|
+
* SvgIcon can be used inside other svg components as childern such as CheckIcon, CaretIcon etc.
|
|
18
|
+
*/
|
|
19
|
+
export declare const SvgIcon: React.ForwardRefExoticComponent<Pick<SvgIconProps, "string" | "path" | "type" | "className" | "style" | "clipPath" | "filter" | "mask" | "key" | "id" | "lang" | "tabIndex" | "role" | "color" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "name" | "size" | "mode" | "min" | "max" | "crossOrigin" | "height" | "width" | "variant" | "fontSize" | "fontWeight" | "direction" | "spacing" | "media" | "method" | "target" | "accentHeight" | "accumulate" | "additive" | "alignmentBaseline" | "allowReorder" | "alphabetic" | "amplitude" | "arabicForm" | "ascent" | "attributeName" | "attributeType" | "autoReverse" | "azimuth" | "baseFrequency" | "baselineShift" | "baseProfile" | "bbox" | "begin" | "bias" | "by" | "calcMode" | "capHeight" | "clip" | "clipPathUnits" | "clipRule" | "colorInterpolation" | "colorInterpolationFilters" | "colorProfile" | "colorRendering" | "contentScriptType" | "contentStyleType" | "cursor" | "cx" | "cy" | "d" | "decelerate" | "descent" | "diffuseConstant" | "display" | "divisor" | "dominantBaseline" | "dur" | "dx" | "dy" | "edgeMode" | "elevation" | "enableBackground" | "end" | "exponent" | "externalResourcesRequired" | "fill" | "fillOpacity" | "fillRule" | "filterRes" | "filterUnits" | "floodColor" | "floodOpacity" | "focusable" | "fontFamily" | "fontSizeAdjust" | "fontStretch" | "fontStyle" | "fontVariant" | "format" | "from" | "fx" | "fy" | "g1" | "g2" | "glyphName" | "glyphOrientationHorizontal" | "glyphOrientationVertical" | "glyphRef" | "gradientTransform" | "gradientUnits" | "hanging" | "horizAdvX" | "horizOriginX" | "href" | "ideographic" | "imageRendering" | "in2" | "in" | "intercept" | "k1" | "k2" | "k3" | "k4" | "k" | "kernelMatrix" | "kernelUnitLength" | "kerning" | "keyPoints" | "keySplines" | "keyTimes" | "lengthAdjust" | "letterSpacing" | "lightingColor" | "limitingConeAngle" | "local" | "markerEnd" | "markerHeight" | "markerMid" | "markerStart" | "markerUnits" | "markerWidth" | "maskContentUnits" | "maskUnits" | "mathematical" | "numOctaves" | "offset" | "opacity" | "operator" | "order" | "orient" | "orientation" | "origin" | "overflow" | "overlinePosition" | "overlineThickness" | "paintOrder" | "panose1" | "pathLength" | "patternContentUnits" | "patternTransform" | "patternUnits" | "pointerEvents" | "points" | "pointsAtX" | "pointsAtY" | "pointsAtZ" | "preserveAlpha" | "preserveAspectRatio" | "primitiveUnits" | "r" | "radius" | "refX" | "refY" | "renderingIntent" | "repeatCount" | "repeatDur" | "requiredExtensions" | "requiredFeatures" | "restart" | "result" | "rotate" | "rx" | "ry" | "scale" | "seed" | "shapeRendering" | "slope" | "specularConstant" | "specularExponent" | "speed" | "spreadMethod" | "startOffset" | "stdDeviation" | "stemh" | "stemv" | "stitchTiles" | "stopColor" | "stopOpacity" | "strikethroughPosition" | "strikethroughThickness" | "stroke" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "surfaceScale" | "systemLanguage" | "tableValues" | "targetX" | "targetY" | "textAnchor" | "textDecoration" | "textLength" | "textRendering" | "to" | "transform" | "u1" | "u2" | "underlinePosition" | "underlineThickness" | "unicode" | "unicodeBidi" | "unicodeRange" | "unitsPerEm" | "vAlphabetic" | "values" | "vectorEffect" | "version" | "vertAdvY" | "vertOriginX" | "vertOriginY" | "vHanging" | "vIdeographic" | "viewBox" | "viewTarget" | "visibility" | "vMathematical" | "widths" | "wordSpacing" | "writingMode" | "x1" | "x2" | "x" | "xChannelSelector" | "xHeight" | "xlinkActuate" | "xlinkArcrole" | "xlinkHref" | "xlinkRole" | "xlinkShow" | "xlinkTitle" | "xlinkType" | "xmlBase" | "xmlLang" | "xmlns" | "xmlnsXlink" | "xmlSpace" | "y1" | "y2" | "y" | "yChannelSelector" | "z" | "zoomAndPan"> & React.RefAttributes<SVGSVGElement>>;
|
|
20
|
+
export default SvgIcon;
|