@itcase/forms 1.1.52 → 1.1.54
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/css/form/Field/InputNumber/FormFieldInputNumber.css +52 -0
- package/dist/css/styles/main.css +188 -0
- package/dist/itcase-forms.cjs.js +1682 -1348
- package/dist/itcase-forms.esm.js +1681 -1349
- package/package.json +25 -25
package/dist/itcase-forms.cjs.js
CHANGED
|
@@ -16,6 +16,7 @@ var Chips = require('@itcase/ui/components/Chips');
|
|
|
16
16
|
var Choice = require('@itcase/ui/components/Choice');
|
|
17
17
|
var Code = require('@itcase/ui/components/Code');
|
|
18
18
|
var Icon = require('@itcase/ui/components/Icon');
|
|
19
|
+
var Dadata = require('@itcase/ui/components/Dadata');
|
|
19
20
|
var DatePicker = require('@itcase/ui/components/DatePicker');
|
|
20
21
|
var useDevicePropsGenerator = require('@itcase/ui/hooks/useDevicePropsGenerator');
|
|
21
22
|
var axios = require('axios');
|
|
@@ -27,6 +28,7 @@ var Button = require('@itcase/ui/components/Button');
|
|
|
27
28
|
var Loader = require('@itcase/ui/components/Loader');
|
|
28
29
|
var Title = require('@itcase/ui/components/Title');
|
|
29
30
|
var Input = require('@itcase/ui/components/Input');
|
|
31
|
+
var InputNumber = require('@itcase/ui/components/InputNumber');
|
|
30
32
|
var reactImask = require('react-imask');
|
|
31
33
|
var InputPassword = require('@itcase/ui/components/InputPassword');
|
|
32
34
|
var Radio = require('@itcase/ui/components/Radio');
|
|
@@ -34,7 +36,6 @@ var Segmented = require('@itcase/ui/components/Segmented');
|
|
|
34
36
|
var Select = require('@itcase/ui/components/Select');
|
|
35
37
|
var Switch = require('@itcase/ui/components/Switch');
|
|
36
38
|
var Textarea = require('@itcase/ui/components/Textarea');
|
|
37
|
-
var Dadata = require('@itcase/ui/components/Dadata');
|
|
38
39
|
var Group = require('@itcase/ui/components/Group');
|
|
39
40
|
var Notification = require('@itcase/ui/components/Notification');
|
|
40
41
|
var createDecorator = require('final-form-focus');
|
|
@@ -49,31 +50,34 @@ var axios__default = /*#__PURE__*/_interopDefault(axios);
|
|
|
49
50
|
var castArray__default = /*#__PURE__*/_interopDefault(castArray);
|
|
50
51
|
var createDecorator__default = /*#__PURE__*/_interopDefault(createDecorator);
|
|
51
52
|
|
|
52
|
-
|
|
53
|
+
var phoneValidation = function phoneValidation(value) {
|
|
53
54
|
if (!value) {
|
|
54
55
|
return true;
|
|
55
56
|
}
|
|
56
57
|
return libphonenumberJs.isPossiblePhoneNumber(value, 'RU');
|
|
57
58
|
};
|
|
58
|
-
|
|
59
|
+
var emailValidation = function emailValidation(value) {
|
|
59
60
|
// from https://emailregex.com/
|
|
60
61
|
if (!value) {
|
|
61
62
|
return true;
|
|
62
63
|
}
|
|
63
64
|
|
|
64
65
|
// from https://www.regular-expressions.info/email.html
|
|
65
|
-
|
|
66
|
+
var regexp = /^[a-za-яёЁ0-9_-]+(?:\.[a-za-яёЁ0-9_-]+)*@(?:[a-za-яёЁ0-9](?:[a-za-яёЁ0-9-]*[a-za-яёЁ0-9])?\.)+[a-za-яёЁ0-9]+$/;
|
|
66
67
|
return regexp.test(String(value).toLowerCase());
|
|
67
68
|
};
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
69
|
+
var dateValidation = function dateValidation(value) {
|
|
70
|
+
var valueDate = value instanceof Date ? value : new Date(value);
|
|
71
|
+
var isDateValid = !isNaN(valueDate.getTime());
|
|
71
72
|
return isDateValid;
|
|
72
73
|
};
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
schema.requiredFields = fields.reduce((list,
|
|
76
|
-
|
|
74
|
+
var addRequiredFieldsParamToSchema = function addRequiredFieldsParamToSchema(schema) {
|
|
75
|
+
var fields = Object.entries(schema.fields);
|
|
76
|
+
schema.requiredFields = fields.reduce(function (list, _ref) {
|
|
77
|
+
var _validationProps$excl;
|
|
78
|
+
var fieldName = _ref[0],
|
|
79
|
+
validationProps = _ref[1];
|
|
80
|
+
if ((_validationProps$excl = validationProps.exclusiveTests) != null && _validationProps$excl.required) {
|
|
77
81
|
list.push(fieldName);
|
|
78
82
|
}
|
|
79
83
|
return list;
|
|
@@ -81,6 +85,169 @@ const addRequiredFieldsParamToSchema = schema => {
|
|
|
81
85
|
return schema;
|
|
82
86
|
};
|
|
83
87
|
|
|
88
|
+
function _arrayLikeToArray(r, a) {
|
|
89
|
+
(null == a || a > r.length) && (a = r.length);
|
|
90
|
+
for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
|
|
91
|
+
return n;
|
|
92
|
+
}
|
|
93
|
+
function asyncGeneratorStep(n, t, e, r, o, a, c) {
|
|
94
|
+
try {
|
|
95
|
+
var i = n[a](c),
|
|
96
|
+
u = i.value;
|
|
97
|
+
} catch (n) {
|
|
98
|
+
return void e(n);
|
|
99
|
+
}
|
|
100
|
+
i.done ? t(u) : Promise.resolve(u).then(r, o);
|
|
101
|
+
}
|
|
102
|
+
function _asyncToGenerator(n) {
|
|
103
|
+
return function () {
|
|
104
|
+
var t = this,
|
|
105
|
+
e = arguments;
|
|
106
|
+
return new Promise(function (r, o) {
|
|
107
|
+
var a = n.apply(t, e);
|
|
108
|
+
function _next(n) {
|
|
109
|
+
asyncGeneratorStep(a, r, o, _next, _throw, "next", n);
|
|
110
|
+
}
|
|
111
|
+
function _throw(n) {
|
|
112
|
+
asyncGeneratorStep(a, r, o, _next, _throw, "throw", n);
|
|
113
|
+
}
|
|
114
|
+
_next(void 0);
|
|
115
|
+
});
|
|
116
|
+
};
|
|
117
|
+
}
|
|
118
|
+
function _createForOfIteratorHelperLoose(r, e) {
|
|
119
|
+
var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
|
|
120
|
+
if (t) return (t = t.call(r)).next.bind(t);
|
|
121
|
+
if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e) {
|
|
122
|
+
t && (r = t);
|
|
123
|
+
var o = 0;
|
|
124
|
+
return function () {
|
|
125
|
+
return o >= r.length ? {
|
|
126
|
+
done: true
|
|
127
|
+
} : {
|
|
128
|
+
done: false,
|
|
129
|
+
value: r[o++]
|
|
130
|
+
};
|
|
131
|
+
};
|
|
132
|
+
}
|
|
133
|
+
throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
134
|
+
}
|
|
135
|
+
function _regenerator() {
|
|
136
|
+
/*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */
|
|
137
|
+
var e,
|
|
138
|
+
t,
|
|
139
|
+
r = "function" == typeof Symbol ? Symbol : {},
|
|
140
|
+
n = r.iterator || "@@iterator",
|
|
141
|
+
o = r.toStringTag || "@@toStringTag";
|
|
142
|
+
function i(r, n, o, i) {
|
|
143
|
+
var c = n && n.prototype instanceof Generator ? n : Generator,
|
|
144
|
+
u = Object.create(c.prototype);
|
|
145
|
+
return _regeneratorDefine(u, "_invoke", function (r, n, o) {
|
|
146
|
+
var i,
|
|
147
|
+
c,
|
|
148
|
+
u,
|
|
149
|
+
f = 0,
|
|
150
|
+
p = o || [],
|
|
151
|
+
y = false,
|
|
152
|
+
G = {
|
|
153
|
+
p: 0,
|
|
154
|
+
n: 0,
|
|
155
|
+
v: e,
|
|
156
|
+
a: d,
|
|
157
|
+
f: d.bind(e, 4),
|
|
158
|
+
d: function (t, r) {
|
|
159
|
+
return i = t, c = 0, u = e, G.n = r, a;
|
|
160
|
+
}
|
|
161
|
+
};
|
|
162
|
+
function d(r, n) {
|
|
163
|
+
for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) {
|
|
164
|
+
var o,
|
|
165
|
+
i = p[t],
|
|
166
|
+
d = G.p,
|
|
167
|
+
l = i[2];
|
|
168
|
+
r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0));
|
|
169
|
+
}
|
|
170
|
+
if (o || r > 1) return a;
|
|
171
|
+
throw y = true, n;
|
|
172
|
+
}
|
|
173
|
+
return function (o, p, l) {
|
|
174
|
+
if (f > 1) throw TypeError("Generator is already running");
|
|
175
|
+
for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) {
|
|
176
|
+
i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u);
|
|
177
|
+
try {
|
|
178
|
+
if (f = 2, i) {
|
|
179
|
+
if (c || (o = "next"), t = i[o]) {
|
|
180
|
+
if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object");
|
|
181
|
+
if (!t.done) return t;
|
|
182
|
+
u = t.value, c < 2 && (c = 0);
|
|
183
|
+
} else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1);
|
|
184
|
+
i = e;
|
|
185
|
+
} else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break;
|
|
186
|
+
} catch (t) {
|
|
187
|
+
i = e, c = 1, u = t;
|
|
188
|
+
} finally {
|
|
189
|
+
f = 1;
|
|
190
|
+
}
|
|
191
|
+
}
|
|
192
|
+
return {
|
|
193
|
+
value: t,
|
|
194
|
+
done: y
|
|
195
|
+
};
|
|
196
|
+
};
|
|
197
|
+
}(r, o, i), true), u;
|
|
198
|
+
}
|
|
199
|
+
var a = {};
|
|
200
|
+
function Generator() {}
|
|
201
|
+
function GeneratorFunction() {}
|
|
202
|
+
function GeneratorFunctionPrototype() {}
|
|
203
|
+
t = Object.getPrototypeOf;
|
|
204
|
+
var c = [][n] ? t(t([][n]())) : (_regeneratorDefine(t = {}, n, function () {
|
|
205
|
+
return this;
|
|
206
|
+
}), t),
|
|
207
|
+
u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c);
|
|
208
|
+
function f(e) {
|
|
209
|
+
return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e;
|
|
210
|
+
}
|
|
211
|
+
return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine(u), _regeneratorDefine(u, o, "Generator"), _regeneratorDefine(u, n, function () {
|
|
212
|
+
return this;
|
|
213
|
+
}), _regeneratorDefine(u, "toString", function () {
|
|
214
|
+
return "[object Generator]";
|
|
215
|
+
}), (_regenerator = function () {
|
|
216
|
+
return {
|
|
217
|
+
w: i,
|
|
218
|
+
m: f
|
|
219
|
+
};
|
|
220
|
+
})();
|
|
221
|
+
}
|
|
222
|
+
function _regeneratorDefine(e, r, n, t) {
|
|
223
|
+
var i = Object.defineProperty;
|
|
224
|
+
try {
|
|
225
|
+
i({}, "", {});
|
|
226
|
+
} catch (e) {
|
|
227
|
+
i = 0;
|
|
228
|
+
}
|
|
229
|
+
_regeneratorDefine = function (e, r, n, t) {
|
|
230
|
+
function o(r, n) {
|
|
231
|
+
_regeneratorDefine(e, r, function (e) {
|
|
232
|
+
return this._invoke(r, n, e);
|
|
233
|
+
});
|
|
234
|
+
}
|
|
235
|
+
r ? i ? i(e, r, {
|
|
236
|
+
value: n,
|
|
237
|
+
enumerable: !t,
|
|
238
|
+
configurable: !t,
|
|
239
|
+
writable: !t
|
|
240
|
+
}) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2));
|
|
241
|
+
}, _regeneratorDefine(e, r, n, t);
|
|
242
|
+
}
|
|
243
|
+
function _unsupportedIterableToArray(r, a) {
|
|
244
|
+
if (r) {
|
|
245
|
+
if ("string" == typeof r) return _arrayLikeToArray(r, a);
|
|
246
|
+
var t = {}.toString.call(r).slice(8, -1);
|
|
247
|
+
return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0;
|
|
248
|
+
}
|
|
249
|
+
}
|
|
250
|
+
|
|
84
251
|
/**
|
|
85
252
|
* Sets the `innerError.message` in an `errors` object at the key
|
|
86
253
|
* defined by `innerError.path`.
|
|
@@ -88,7 +255,7 @@ const addRequiredFieldsParamToSchema = schema => {
|
|
|
88
255
|
* @param {{ path: string, message: string }} innerError A `yup` field error.
|
|
89
256
|
* @returns {Object} The result of setting the new error message onto `errors`.
|
|
90
257
|
*/
|
|
91
|
-
|
|
258
|
+
var setInError = function setInError(errors, innerError) {
|
|
92
259
|
return finalForm.setIn(errors, innerError.path, innerError.message);
|
|
93
260
|
};
|
|
94
261
|
|
|
@@ -97,7 +264,7 @@ const setInError = (errors, innerError) => {
|
|
|
97
264
|
* value for reducing the `err.inner` array of errors
|
|
98
265
|
* from a `yup~ValidationError`.
|
|
99
266
|
*/
|
|
100
|
-
|
|
267
|
+
var emptyObj = Object.create(null);
|
|
101
268
|
|
|
102
269
|
/**
|
|
103
270
|
* Takes a `yup` validation schema and returns a function that expects
|
|
@@ -109,27 +276,50 @@ const emptyObj = Object.create(null);
|
|
|
109
276
|
* and resolves to either `undefined` or a map of field names to error messages.
|
|
110
277
|
*/
|
|
111
278
|
|
|
112
|
-
|
|
113
|
-
return
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
279
|
+
var makeValidate = function makeValidate(schema) {
|
|
280
|
+
return /*#__PURE__*/function () {
|
|
281
|
+
var _validate = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(values) {
|
|
282
|
+
var _t;
|
|
283
|
+
return _regenerator().w(function (_context) {
|
|
284
|
+
while (1) switch (_context.p = _context.n) {
|
|
285
|
+
case 0:
|
|
286
|
+
_context.p = 0;
|
|
287
|
+
_context.n = 1;
|
|
288
|
+
return schema.validate(values, {
|
|
289
|
+
abortEarly: false
|
|
290
|
+
});
|
|
291
|
+
case 1:
|
|
292
|
+
_context.n = 4;
|
|
293
|
+
break;
|
|
294
|
+
case 2:
|
|
295
|
+
_context.p = 2;
|
|
296
|
+
_t = _context.v;
|
|
297
|
+
if (!_t.inner) {
|
|
298
|
+
_context.n = 3;
|
|
299
|
+
break;
|
|
300
|
+
}
|
|
301
|
+
return _context.a(2, _t.inner.reduce(setInError, emptyObj));
|
|
302
|
+
case 3:
|
|
303
|
+
console.warn('itcase-forms schema.validate error: An error not related to the form occurred during validation. Validation ignored.');
|
|
304
|
+
case 4:
|
|
305
|
+
return _context.a(2);
|
|
306
|
+
}
|
|
307
|
+
}, _callee, null, [[0, 2]]);
|
|
308
|
+
}));
|
|
309
|
+
function validate(_x) {
|
|
310
|
+
return _validate.apply(this, arguments);
|
|
124
311
|
}
|
|
125
|
-
|
|
312
|
+
return validate;
|
|
313
|
+
}();
|
|
126
314
|
};
|
|
127
315
|
function useYupValidationSchema(schema, language) {
|
|
128
|
-
|
|
316
|
+
var validate = React.useMemo(function () {
|
|
317
|
+
return schema && makeValidate(schema);
|
|
318
|
+
}, [schema, language]);
|
|
129
319
|
return validate;
|
|
130
320
|
}
|
|
131
321
|
|
|
132
|
-
|
|
322
|
+
var defaultCheckboxProps = {
|
|
133
323
|
appearance: 'defaultPrimary sizeL solid',
|
|
134
324
|
width: 'fill',
|
|
135
325
|
// useValidationAppearanceInputProps
|
|
@@ -141,20 +331,22 @@ const defaultCheckboxProps = {
|
|
|
141
331
|
|
|
142
332
|
// Whether to display an error message based on "fieldProps" and meta-objects
|
|
143
333
|
function useFieldValidationState(props) {
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
334
|
+
var _meta$error;
|
|
335
|
+
var _props$fieldProps = props.fieldProps,
|
|
336
|
+
fieldProps = _props$fieldProps === void 0 ? {} : _props$fieldProps,
|
|
337
|
+
_props$input = props.input,
|
|
338
|
+
input = _props$input === void 0 ? {} : _props$input,
|
|
339
|
+
_props$meta = props.meta,
|
|
340
|
+
meta = _props$meta === void 0 ? {} : _props$meta;
|
|
149
341
|
// Determines if there's a submission error that hasn't been rectified since the last submission.
|
|
150
|
-
|
|
342
|
+
var submitError = !meta.modifiedSinceLastSubmit && meta.submitError;
|
|
151
343
|
|
|
152
344
|
// Determines a key for the error, defaulting to 'error' if no specific key is found.
|
|
153
|
-
|
|
154
|
-
|
|
345
|
+
var errorKey = ((_meta$error = meta.error) == null ? void 0 : _meta$error.key) || 'error';
|
|
346
|
+
var successKey = 'success';
|
|
155
347
|
|
|
156
348
|
// Determines if the field is in an error state based on various conditions.
|
|
157
|
-
|
|
349
|
+
var isErrorState = React.useMemo(function () {
|
|
158
350
|
if (fieldProps.showErrorsOnSubmit) {
|
|
159
351
|
return Boolean(meta.submitFailed && meta.touched && (meta.error || submitError));
|
|
160
352
|
} else {
|
|
@@ -163,15 +355,15 @@ function useFieldValidationState(props) {
|
|
|
163
355
|
}, [fieldProps.showErrorsOnSubmit, meta.submitFailed, meta.touched, meta.error, submitError]);
|
|
164
356
|
|
|
165
357
|
// Determines if the field's input state is valid
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
358
|
+
var isValidState = React.useMemo(function () {
|
|
359
|
+
var hasValue = Array.isArray(input == null ? void 0 : input.value) ? input == null ? void 0 : input.value.length : input == null ? void 0 : input.value;
|
|
360
|
+
var isModifiedAfterSubmit = meta.modifiedSinceLastSubmit && !meta.error && submitError;
|
|
169
361
|
return Boolean(hasValue && (meta.valid || isModifiedAfterSubmit));
|
|
170
|
-
}, [input
|
|
171
|
-
|
|
362
|
+
}, [input == null ? void 0 : input.value, meta.valid, meta.error, submitError, meta.modifiedSinceLastSubmit]);
|
|
363
|
+
var errorMessage = React.useMemo(function () {
|
|
172
364
|
// If final-form field has error in "meta" render-property.
|
|
173
365
|
// If field not modified after last form submit - use submit error
|
|
174
|
-
|
|
366
|
+
var error = meta.error || submitError || false;
|
|
175
367
|
if (error) {
|
|
176
368
|
// And error in "meta" is string
|
|
177
369
|
if (typeof error === 'string') {
|
|
@@ -189,24 +381,22 @@ function useFieldValidationState(props) {
|
|
|
189
381
|
return '';
|
|
190
382
|
}, [meta.error, submitError]);
|
|
191
383
|
return {
|
|
192
|
-
errorKey,
|
|
193
|
-
errorMessage,
|
|
194
|
-
isErrorState,
|
|
195
|
-
successKey,
|
|
196
|
-
isValidState
|
|
384
|
+
errorKey: errorKey,
|
|
385
|
+
errorMessage: errorMessage,
|
|
386
|
+
isErrorState: isErrorState,
|
|
387
|
+
successKey: successKey,
|
|
388
|
+
isValidState: isValidState
|
|
197
389
|
};
|
|
198
390
|
}
|
|
199
391
|
|
|
200
392
|
// This hook changes the props of the child component depending on the type of error,
|
|
201
393
|
// looks at what props were in initialProps, if they are there then changes
|
|
202
394
|
function useValidationAppearanceInputProps(props) {
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
validationStateKey
|
|
206
|
-
} = props;
|
|
395
|
+
var inputProps = props.inputProps,
|
|
396
|
+
validationStateKey = props.validationStateKey;
|
|
207
397
|
|
|
208
398
|
// TODO: need to add props that can change during errors in this field
|
|
209
|
-
|
|
399
|
+
var validationAppearanceInputProps = React.useMemo(function () {
|
|
210
400
|
// const resultAppearanceProps = {
|
|
211
401
|
// messageTextColor: props.errorMessageTextColor,
|
|
212
402
|
// messageTextSize: props.errorMessageTextSize,
|
|
@@ -214,24 +404,26 @@ function useValidationAppearanceInputProps(props) {
|
|
|
214
404
|
// // Override appearance(styled) props for child input
|
|
215
405
|
// inputProps: {},
|
|
216
406
|
// }
|
|
217
|
-
|
|
407
|
+
var updatedInputProps = {};
|
|
218
408
|
if (validationStateKey) {
|
|
219
|
-
Object.entries(inputProps || {}).forEach((
|
|
409
|
+
Object.entries(inputProps || {}).forEach(function (_ref) {
|
|
410
|
+
var propKey = _ref[0],
|
|
411
|
+
propValue = _ref[1];
|
|
220
412
|
// Convert the input property key to "snake_case" format.
|
|
221
413
|
// e.g. "requiredBorderColor" -> "required_border_color".
|
|
222
|
-
|
|
414
|
+
var propKeySnake = snakeCase__default.default(propKey);
|
|
223
415
|
// Check if this property is for appearance.
|
|
224
416
|
// Key maybe starts with: "error", "required", "success", etc from validation config.
|
|
225
|
-
|
|
417
|
+
var isPropForValidationState = propKeySnake.startsWith(validationStateKey + "_");
|
|
226
418
|
|
|
227
419
|
// If property is for appearance
|
|
228
420
|
if (isPropForValidationState) {
|
|
229
421
|
// Remove validation state part from begin of property key, to make clean appearance property.
|
|
230
422
|
// e.g. "required_border_color" -> "border_color".
|
|
231
|
-
|
|
423
|
+
var stateTargetKeySnake = propKeySnake.replace(validationStateKey + "_", '');
|
|
232
424
|
// Convert clean appearance property key to "camelCase" format.
|
|
233
425
|
// e.g. "border_color" -> "borderColor"
|
|
234
|
-
|
|
426
|
+
var stateTargetKey = camelCase__default.default(stateTargetKeySnake);
|
|
235
427
|
// And save the value with a new clean property key
|
|
236
428
|
updatedInputProps[stateTargetKey] = propValue;
|
|
237
429
|
// Else if not already added earlier
|
|
@@ -248,7 +440,7 @@ function useValidationAppearanceInputProps(props) {
|
|
|
248
440
|
return validationAppearanceInputProps;
|
|
249
441
|
}
|
|
250
442
|
|
|
251
|
-
|
|
443
|
+
var defaultFieldProps = {
|
|
252
444
|
width: 'fill',
|
|
253
445
|
direction: 'vertical',
|
|
254
446
|
labelTextColor: 'surfaceTextPrimary',
|
|
@@ -259,136 +451,134 @@ const defaultFieldProps = {
|
|
|
259
451
|
requiredMessageTextColor: 'warningTextSecondary',
|
|
260
452
|
showMessage: true
|
|
261
453
|
};
|
|
262
|
-
|
|
454
|
+
var defaultFieldSizeS = Object.assign({
|
|
263
455
|
size: 's',
|
|
264
456
|
labelTextSize: 's',
|
|
265
457
|
messageTextSize: 's',
|
|
266
458
|
errorMessageTextSize: 's',
|
|
267
459
|
helpTextSize: 's',
|
|
268
|
-
requiredMessageTextSize: 's'
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
const defaultFieldSizeM = {
|
|
460
|
+
requiredMessageTextSize: 's'
|
|
461
|
+
}, defaultFieldProps);
|
|
462
|
+
var defaultFieldSizeM = Object.assign({
|
|
272
463
|
size: 'm',
|
|
273
464
|
labelTextSize: 's',
|
|
274
465
|
messageTextSize: 's',
|
|
275
466
|
errorMessageTextSize: 's',
|
|
276
467
|
helpTextSize: 's',
|
|
277
|
-
requiredMessageTextSize: 's'
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
const defaultFieldSizeL = {
|
|
468
|
+
requiredMessageTextSize: 's'
|
|
469
|
+
}, defaultFieldProps);
|
|
470
|
+
var defaultFieldSizeL = Object.assign({
|
|
281
471
|
size: 'l',
|
|
282
472
|
labelTextSize: 's',
|
|
283
473
|
messageTextSize: 's',
|
|
284
474
|
errorMessageTextSize: 's',
|
|
285
475
|
helpTextSize: 's',
|
|
286
|
-
requiredMessageTextSize: 's'
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
const defaultFieldSizeXL = {
|
|
476
|
+
requiredMessageTextSize: 's'
|
|
477
|
+
}, defaultFieldProps);
|
|
478
|
+
var defaultFieldSizeXL = Object.assign({
|
|
290
479
|
size: 'xl',
|
|
291
480
|
labelTextSize: 's',
|
|
292
481
|
messageTextSize: 's',
|
|
293
482
|
errorMessageTextSize: 's',
|
|
294
483
|
helpTextSize: 's',
|
|
295
|
-
requiredMessageTextSize: 's'
|
|
296
|
-
|
|
297
|
-
};
|
|
484
|
+
requiredMessageTextSize: 's'
|
|
485
|
+
}, defaultFieldProps);
|
|
298
486
|
|
|
299
487
|
function FieldWrapperBase(props) {
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
before,
|
|
340
|
-
after,
|
|
341
|
-
isDisabled,
|
|
342
|
-
isErrorState,
|
|
343
|
-
isHidden,
|
|
344
|
-
isRequired,
|
|
345
|
-
isValidState,
|
|
346
|
-
children
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
488
|
+
var id = props.id,
|
|
489
|
+
className = props.className,
|
|
490
|
+
dataTour = props.dataTour,
|
|
491
|
+
type = props.type,
|
|
492
|
+
label = props.label,
|
|
493
|
+
labelHidden = props.labelHidden,
|
|
494
|
+
labelTextColor = props.labelTextColor,
|
|
495
|
+
labelTextSize = props.labelTextSize,
|
|
496
|
+
labelTextSizeMobile = props.labelTextSizeMobile,
|
|
497
|
+
labelTextSizeTablet = props.labelTextSizeTablet,
|
|
498
|
+
labelTextWeight = props.labelTextWeight,
|
|
499
|
+
messageTextSize = props.messageTextSize,
|
|
500
|
+
desc = props.desc,
|
|
501
|
+
descTextColor = props.descTextColor,
|
|
502
|
+
descTextSize = props.descTextSize,
|
|
503
|
+
descTextWeight = props.descTextWeight,
|
|
504
|
+
afterItem = props.afterItem,
|
|
505
|
+
beforeItem = props.beforeItem,
|
|
506
|
+
dividerDirection = props.dividerDirection,
|
|
507
|
+
dividerFill = props.dividerFill,
|
|
508
|
+
dividerSize = props.dividerSize,
|
|
509
|
+
dividerWidth = props.dividerWidth,
|
|
510
|
+
errorKey = props.errorKey,
|
|
511
|
+
errorMessage = props.errorMessage,
|
|
512
|
+
fieldClassName = props.fieldClassName,
|
|
513
|
+
helpText = props.helpText,
|
|
514
|
+
helpTextColor = props.helpTextColor,
|
|
515
|
+
helpTextColorSuccess = props.helpTextColorSuccess,
|
|
516
|
+
helpTextSize = props.helpTextSize,
|
|
517
|
+
helpTextSizeMobile = props.helpTextSizeMobile,
|
|
518
|
+
helpTextWeight = props.helpTextWeight,
|
|
519
|
+
inputName = props.inputName,
|
|
520
|
+
inputValue = props.inputValue,
|
|
521
|
+
metaActive = props.metaActive,
|
|
522
|
+
metaError = props.metaError,
|
|
523
|
+
showDivider = props.showDivider,
|
|
524
|
+
showMessage = props.showMessage,
|
|
525
|
+
_props$tag = props.tag,
|
|
526
|
+
Tag = _props$tag === void 0 ? 'div' : _props$tag,
|
|
527
|
+
before = props.before,
|
|
528
|
+
after = props.after,
|
|
529
|
+
isDisabled = props.isDisabled,
|
|
530
|
+
isErrorState = props.isErrorState,
|
|
531
|
+
isHidden = props.isHidden,
|
|
532
|
+
isRequired = props.isRequired,
|
|
533
|
+
isValidState = props.isValidState,
|
|
534
|
+
children = props.children;
|
|
535
|
+
var formFieldClass = React.useMemo(function () {
|
|
536
|
+
return clsx__default.default(className, isValidState && 'form__item_state_success', isRequired && 'form__item_state_required', isDisabled && 'form__item_state_disabled', metaActive && 'form__item_state_focus', inputValue && 'form__item_state_filled', isErrorState && "form__item_state_" + errorKey);
|
|
537
|
+
}, [className, isErrorState, isValidState, isRequired, metaActive, inputValue, isDisabled, metaError]);
|
|
538
|
+
var fieldClass = React.useMemo(function () {
|
|
539
|
+
return clsx__default.default(fieldClassName, isValidState && fieldClassName + "_state_success", metaActive && fieldClassName + "_state_focus", inputValue && fieldClassName + "_state_filled", isDisabled && fieldClassName + "_state_disabled", isErrorState && fieldClassName + "_state_" + errorKey);
|
|
540
|
+
}, [fieldClassName, isErrorState, isValidState, metaActive, inputValue, isDisabled, metaError]);
|
|
541
|
+
var sizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
351
542
|
prefix: 'form-field_size_',
|
|
352
543
|
propsKey: 'size'
|
|
353
544
|
});
|
|
354
|
-
|
|
545
|
+
var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
355
546
|
prefix: 'fill_',
|
|
356
547
|
propsKey: 'fill'
|
|
357
548
|
});
|
|
358
|
-
|
|
549
|
+
var inputFillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
359
550
|
prefix: 'fill_',
|
|
360
551
|
propsKey: 'inputFill'
|
|
361
552
|
});
|
|
362
|
-
|
|
553
|
+
var shapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
363
554
|
prefix: 'form-field_shape_',
|
|
364
555
|
propsKey: 'shape'
|
|
365
556
|
});
|
|
366
|
-
|
|
557
|
+
var inputShapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
367
558
|
prefix: 'form-field__item-value_shape_',
|
|
368
559
|
propsKey: 'inputShape'
|
|
369
560
|
});
|
|
370
|
-
|
|
561
|
+
var directionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
371
562
|
prefix: 'direction_',
|
|
372
563
|
propsKey: 'direction'
|
|
373
564
|
});
|
|
374
|
-
|
|
565
|
+
var widthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
375
566
|
prefix: 'width_',
|
|
376
567
|
propsKey: 'width'
|
|
377
568
|
});
|
|
378
|
-
|
|
379
|
-
styles
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
const errorTextWeight = props[`${errorKey}MessageTextWeight`];
|
|
569
|
+
var _useStyles = useStyles.useStyles(props),
|
|
570
|
+
formFieldStyles = _useStyles.styles;
|
|
571
|
+
var errorTextSize = props[errorKey + "MessageTextSize"];
|
|
572
|
+
var errorTextColor = props[errorKey + "MessageTextColor"];
|
|
573
|
+
var errorTextWeight = props[errorKey + "MessageTextWeight"];
|
|
384
574
|
return /*#__PURE__*/React__default.default.createElement(Tag, {
|
|
385
|
-
className: clsx__default.default(formFieldClass, 'form__item', 'form-field', type &&
|
|
386
|
-
"data-testid":
|
|
575
|
+
className: clsx__default.default(formFieldClass, 'form__item', 'form-field', type && "form-field_type_" + type, sizeClass, fillClass, shapeClass, isDisabled && "form-field_state_disabled", isHidden && "form-field_state_hidden", directionClass, widthClass),
|
|
576
|
+
"data-testid": inputName + "-field",
|
|
387
577
|
"data-tour": dataTour,
|
|
388
578
|
style: formFieldStyles
|
|
389
579
|
}, before, (label || labelHidden) && /*#__PURE__*/React__default.default.createElement("div", {
|
|
390
580
|
className: clsx__default.default('form-field__label'),
|
|
391
|
-
"data-testid":
|
|
581
|
+
"data-testid": inputName + "-field-label",
|
|
392
582
|
htmlFor: id
|
|
393
583
|
}, /*#__PURE__*/React__default.default.createElement(Text.Text, {
|
|
394
584
|
size: labelTextSize,
|
|
@@ -396,9 +586,9 @@ function FieldWrapperBase(props) {
|
|
|
396
586
|
textWeight: labelTextWeight,
|
|
397
587
|
sizeMobile: labelTextSizeMobile,
|
|
398
588
|
sizeTablet: labelTextSizeTablet
|
|
399
|
-
}, label, labelHidden &&
|
|
589
|
+
}, label, labelHidden && "\xA0")), desc && /*#__PURE__*/React__default.default.createElement("div", {
|
|
400
590
|
className: "form-field__desc",
|
|
401
|
-
"data-testid":
|
|
591
|
+
"data-testid": inputName + "-field-desc"
|
|
402
592
|
}, /*#__PURE__*/React__default.default.createElement(Text.Text, {
|
|
403
593
|
size: descTextSize,
|
|
404
594
|
textColor: descTextColor,
|
|
@@ -415,63 +605,59 @@ function FieldWrapperBase(props) {
|
|
|
415
605
|
fill: dividerFill
|
|
416
606
|
})), showMessage && /*#__PURE__*/React__default.default.createElement("div", {
|
|
417
607
|
className: "form-field__message",
|
|
418
|
-
"data-testid":
|
|
608
|
+
"data-testid": inputName + "-field-message"
|
|
419
609
|
}, isErrorState && errorMessage && /*#__PURE__*/React__default.default.createElement(Text.Text, {
|
|
420
|
-
id:
|
|
610
|
+
id: inputName + "-error",
|
|
421
611
|
className: "form-field__message-item form-field__message-item_type-error",
|
|
422
|
-
dataTestId:
|
|
612
|
+
dataTestId: inputName + "-field-message-error",
|
|
423
613
|
size: errorTextSize,
|
|
424
614
|
textColor: errorTextColor,
|
|
425
615
|
textWeight: errorTextWeight
|
|
426
616
|
}, errorMessage), Boolean(helpText) && (!isErrorState || !errorMessage) && /*#__PURE__*/React__default.default.createElement(Text.Text, {
|
|
427
617
|
className: "form-field__message-item form-field__message-item_type_help-text",
|
|
428
|
-
dataTestId:
|
|
618
|
+
dataTestId: inputName + "-field-message-help-text",
|
|
429
619
|
size: helpTextSize,
|
|
430
620
|
textColor: isValidState ? helpTextColorSuccess : helpTextColor,
|
|
431
621
|
textWeight: helpTextWeight,
|
|
432
622
|
sizeMobile: helpTextSizeMobile
|
|
433
623
|
}, helpText), (!isErrorState && !helpText || isErrorState && !helpText && !errorMessage) && /*#__PURE__*/React__default.default.createElement(Text.Text, {
|
|
434
624
|
className: "form-field__message-item form-field__message-item_type_help-text",
|
|
435
|
-
dataTestId:
|
|
625
|
+
dataTestId: inputName + "field-message-help-text",
|
|
436
626
|
size: messageTextSize
|
|
437
|
-
},
|
|
627
|
+
}, "\xA0")), after);
|
|
438
628
|
}
|
|
439
629
|
function FieldWrapper(props) {
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
React.useEffect(() => {
|
|
448
|
-
return () => {
|
|
630
|
+
var inputName = props.inputName;
|
|
631
|
+
var _useForm = reactFinalForm.useForm(),
|
|
632
|
+
change = _useForm.change; // , mutators
|
|
633
|
+
|
|
634
|
+
React.useEffect(function () {
|
|
635
|
+
return function () {
|
|
449
636
|
change(inputName, undefined);
|
|
450
637
|
};
|
|
451
638
|
}, []);
|
|
452
639
|
return /*#__PURE__*/React__default.default.createElement(FieldWrapperBase, props);
|
|
453
640
|
}
|
|
454
641
|
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
fieldProps = {},
|
|
462
|
-
inputProps =
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
642
|
+
var FormFieldCheckbox = /*#__PURE__*/React__default.default.memo(function FormFieldCheckbox(props) {
|
|
643
|
+
var name = props.name,
|
|
644
|
+
initialValue = props.initialValue,
|
|
645
|
+
isDisabled = props.isDisabled,
|
|
646
|
+
classNameGroupItem = props.classNameGroupItem,
|
|
647
|
+
_props$fieldProps = props.fieldProps,
|
|
648
|
+
fieldProps = _props$fieldProps === void 0 ? {} : _props$fieldProps,
|
|
649
|
+
_props$inputProps = props.inputProps,
|
|
650
|
+
inputProps = _props$inputProps === void 0 ? {} : _props$inputProps,
|
|
651
|
+
showMessage = props.showMessage,
|
|
652
|
+
isRequired = props.isRequired,
|
|
653
|
+
onChange = props.onChange;
|
|
467
654
|
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
468
655
|
type: "checkbox",
|
|
469
656
|
name: name,
|
|
470
657
|
initialValue: initialValue
|
|
471
|
-
}, function Render({
|
|
472
|
-
input,
|
|
473
|
-
|
|
474
|
-
}) {
|
|
658
|
+
}, function Render(_ref) {
|
|
659
|
+
var input = _ref.input,
|
|
660
|
+
meta = _ref.meta;
|
|
475
661
|
/** Note:
|
|
476
662
|
* Create "Render" function by "eslint-react-hooks/rules-of-hooks":
|
|
477
663
|
* React Hooks cannot be called inside a callback.
|
|
@@ -479,24 +665,23 @@ const FormFieldCheckbox = /*#__PURE__*/React__default.default.memo(function Form
|
|
|
479
665
|
* custom React Hook function.
|
|
480
666
|
*/
|
|
481
667
|
|
|
482
|
-
|
|
668
|
+
var onChangeField = React.useCallback(function (event) {
|
|
483
669
|
input.onChange(event);
|
|
484
670
|
if (onChange) {
|
|
485
671
|
onChange(event.target.checked, input.name);
|
|
486
672
|
}
|
|
487
673
|
}, [onChange, input.onChange]);
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
const updatedInputProps = useValidationAppearanceInputProps({
|
|
674
|
+
var _useFieldValidationSt = useFieldValidationState({
|
|
675
|
+
fieldProps: fieldProps,
|
|
676
|
+
input: input,
|
|
677
|
+
meta: meta
|
|
678
|
+
}),
|
|
679
|
+
errorKey = _useFieldValidationSt.errorKey,
|
|
680
|
+
errorMessage = _useFieldValidationSt.errorMessage,
|
|
681
|
+
isErrorState = _useFieldValidationSt.isErrorState,
|
|
682
|
+
successKey = _useFieldValidationSt.successKey,
|
|
683
|
+
isValidState = _useFieldValidationSt.isValidState;
|
|
684
|
+
var updatedInputProps = useValidationAppearanceInputProps({
|
|
500
685
|
inputProps: inputProps,
|
|
501
686
|
validationStateKey: isErrorState ? errorKey : isValidState ? successKey : null
|
|
502
687
|
});
|
|
@@ -529,7 +714,7 @@ const FormFieldCheckbox = /*#__PURE__*/React__default.default.memo(function Form
|
|
|
529
714
|
});
|
|
530
715
|
});
|
|
531
716
|
|
|
532
|
-
|
|
717
|
+
var defaultChipsProps = {
|
|
533
718
|
appearance: 'surfacePrimary sizeM rounded',
|
|
534
719
|
width: 'fill',
|
|
535
720
|
// useValidationAppearanceInputProps
|
|
@@ -542,32 +727,31 @@ const defaultChipsProps = {
|
|
|
542
727
|
};
|
|
543
728
|
|
|
544
729
|
function FormFieldChips(props) {
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
const {
|
|
561
|
-
change
|
|
562
|
-
} = reactFinalForm.useForm();
|
|
730
|
+
var name = props.name,
|
|
731
|
+
initialValue = props.initialValue,
|
|
732
|
+
classNameGroupItem = props.classNameGroupItem,
|
|
733
|
+
emptyMessage = props.emptyMessage,
|
|
734
|
+
emptyMessageTextColor = props.emptyMessageTextColor,
|
|
735
|
+
emptyMessageTextSize = props.emptyMessageTextSize,
|
|
736
|
+
fieldProps = props.fieldProps,
|
|
737
|
+
inputProps = props.inputProps,
|
|
738
|
+
options = props.options,
|
|
739
|
+
showMessage = props.showMessage,
|
|
740
|
+
isDisabled = props.isDisabled,
|
|
741
|
+
isRequired = props.isRequired,
|
|
742
|
+
onChange = props.onChange;
|
|
743
|
+
var _useForm = reactFinalForm.useForm(),
|
|
744
|
+
change = _useForm.change;
|
|
563
745
|
|
|
564
746
|
// Callback for value changes
|
|
565
|
-
|
|
566
|
-
|
|
747
|
+
var onChangeSomeInput = React.useCallback(function (inputValue, newOptionValue) {
|
|
748
|
+
var updatedValues = inputValue.includes(newOptionValue) ? inputValue.filter(function (selectedValue) {
|
|
749
|
+
return selectedValue !== newOptionValue;
|
|
750
|
+
}) : [].concat(inputValue, [newOptionValue]);
|
|
567
751
|
change(name, updatedValues);
|
|
568
752
|
onChange && onChange(updatedValues);
|
|
569
753
|
}, [change, name, onChange]);
|
|
570
|
-
React.useEffect(()
|
|
754
|
+
React.useEffect(function () {
|
|
571
755
|
initialValue && change(name, initialValue);
|
|
572
756
|
// update the form value only when the initialValue changes, so use disable eslint to ignore the warning
|
|
573
757
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
@@ -575,32 +759,33 @@ function FormFieldChips(props) {
|
|
|
575
759
|
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
576
760
|
name: name,
|
|
577
761
|
initialValue: initialValue
|
|
578
|
-
}, function Render({
|
|
579
|
-
input,
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
});
|
|
593
|
-
const updatedInputProps = useValidationAppearanceInputProps({
|
|
762
|
+
}, function Render(_ref) {
|
|
763
|
+
var input = _ref.input,
|
|
764
|
+
meta = _ref.meta;
|
|
765
|
+
var _useFieldValidationSt = useFieldValidationState({
|
|
766
|
+
fieldProps: fieldProps,
|
|
767
|
+
input: input,
|
|
768
|
+
meta: meta
|
|
769
|
+
}),
|
|
770
|
+
errorKey = _useFieldValidationSt.errorKey,
|
|
771
|
+
errorMessage = _useFieldValidationSt.errorMessage,
|
|
772
|
+
successKey = _useFieldValidationSt.successKey,
|
|
773
|
+
isErrorState = _useFieldValidationSt.isErrorState,
|
|
774
|
+
isValidState = _useFieldValidationSt.isValidState;
|
|
775
|
+
var updatedInputProps = useValidationAppearanceInputProps({
|
|
594
776
|
inputProps: inputProps,
|
|
595
777
|
validationStateKey: isErrorState ? errorKey : isValidState ? successKey : null
|
|
596
778
|
});
|
|
597
|
-
|
|
598
|
-
|
|
779
|
+
var activeOptionsList = React.useMemo(function () {
|
|
780
|
+
var emptyOptionsList = [{
|
|
599
781
|
label: null,
|
|
600
782
|
value: null
|
|
601
783
|
}];
|
|
602
|
-
if (input
|
|
603
|
-
|
|
784
|
+
if (input != null && input.value) {
|
|
785
|
+
var currentOptions = options.filter(function (option) {
|
|
786
|
+
var _input$value;
|
|
787
|
+
return (_input$value = input.value) == null ? void 0 : _input$value.includes(option.value);
|
|
788
|
+
});
|
|
604
789
|
return currentOptions || emptyOptionsList;
|
|
605
790
|
}
|
|
606
791
|
return emptyOptionsList;
|
|
@@ -623,22 +808,28 @@ function FormFieldChips(props) {
|
|
|
623
808
|
direction: "horizontal",
|
|
624
809
|
gap: "1m",
|
|
625
810
|
wrap: "wrap"
|
|
626
|
-
}, options.map(
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
|
|
632
|
-
|
|
633
|
-
|
|
634
|
-
|
|
811
|
+
}, options.map(function (option) {
|
|
812
|
+
return /*#__PURE__*/React__default.default.createElement(Chips.Chips, Object.assign({
|
|
813
|
+
className: clsx__default.default(meta.active && 'form-chips_state_focus', meta.error && meta.touched && "form-chips_state_" + errorKey),
|
|
814
|
+
key: option.value,
|
|
815
|
+
label: option.label,
|
|
816
|
+
value: option.value,
|
|
817
|
+
isActive: activeOptionsList.some(function (activeOption) {
|
|
818
|
+
return activeOption.value === option.value;
|
|
819
|
+
}),
|
|
820
|
+
isDisabled: option.isDisabled,
|
|
821
|
+
onClick: function onClick() {
|
|
822
|
+
return onChangeSomeInput(input.value, option.value);
|
|
823
|
+
}
|
|
824
|
+
}, updatedInputProps));
|
|
825
|
+
})) : /*#__PURE__*/React__default.default.createElement(Text.Text, {
|
|
635
826
|
size: emptyMessageTextSize,
|
|
636
827
|
textColor: emptyMessageTextColor
|
|
637
828
|
}, emptyMessage));
|
|
638
829
|
});
|
|
639
830
|
}
|
|
640
831
|
|
|
641
|
-
|
|
832
|
+
var defaultChoiceProps = {
|
|
642
833
|
appearance: 'defaultPrimary sizeM solid rounded',
|
|
643
834
|
width: 'fill',
|
|
644
835
|
// useValidationAppearanceInputProps
|
|
@@ -648,27 +839,24 @@ const defaultChoiceProps = {
|
|
|
648
839
|
requiredAppearance: 'requirePrimary sizeM solid rounded'
|
|
649
840
|
};
|
|
650
841
|
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
667
|
-
|
|
668
|
-
|
|
669
|
-
change
|
|
670
|
-
} = reactFinalForm.useForm();
|
|
671
|
-
const setActiveSegment = React.useCallback((option, isChecked) => {
|
|
842
|
+
var FormFieldChoice = /*#__PURE__*/React__default.default.memo(function FormFieldChoice(props) {
|
|
843
|
+
var name = props.name,
|
|
844
|
+
initialValue = props.initialValue,
|
|
845
|
+
label = props.label,
|
|
846
|
+
messageType = props.messageType,
|
|
847
|
+
isDisabled = props.isDisabled,
|
|
848
|
+
classNameGroupItem = props.classNameGroupItem,
|
|
849
|
+
fieldProps = props.fieldProps,
|
|
850
|
+
inputProps = props.inputProps,
|
|
851
|
+
options = props.options,
|
|
852
|
+
placeholder = props.placeholder,
|
|
853
|
+
showMessage = props.showMessage,
|
|
854
|
+
isCheckbox = props.isCheckbox,
|
|
855
|
+
isRequired = props.isRequired,
|
|
856
|
+
onChange = props.onChange;
|
|
857
|
+
var _useForm = reactFinalForm.useForm(),
|
|
858
|
+
change = _useForm.change;
|
|
859
|
+
var setActiveSegment = React.useCallback(function (option, isChecked) {
|
|
672
860
|
change(name, isChecked && option.value);
|
|
673
861
|
if (onChange) {
|
|
674
862
|
onChange(option.value, name, isChecked);
|
|
@@ -677,39 +865,39 @@ const FormFieldChoice = /*#__PURE__*/React__default.default.memo(function FormFi
|
|
|
677
865
|
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
678
866
|
initialValue: initialValue,
|
|
679
867
|
name: name
|
|
680
|
-
}, function Render({
|
|
681
|
-
input,
|
|
682
|
-
|
|
683
|
-
}) {
|
|
868
|
+
}, function Render(_ref) {
|
|
869
|
+
var input = _ref.input,
|
|
870
|
+
meta = _ref.meta;
|
|
684
871
|
/** Note:
|
|
685
872
|
* Create "Render" function by "eslint-react-hooks/rules-of-hooks":
|
|
686
873
|
* React Hooks cannot be called inside a callback.
|
|
687
874
|
* React Hooks must be called in a React function component or a
|
|
688
875
|
* custom React Hook function.
|
|
689
876
|
*/
|
|
690
|
-
|
|
691
|
-
|
|
877
|
+
var activeOption = React.useMemo(function () {
|
|
878
|
+
var emptyOption = {
|
|
692
879
|
value: null,
|
|
693
880
|
label: null
|
|
694
881
|
};
|
|
695
882
|
if (input.value) {
|
|
696
|
-
|
|
883
|
+
var currentOption = options.find(function (option) {
|
|
884
|
+
return option.value === input.value;
|
|
885
|
+
});
|
|
697
886
|
return currentOption || emptyOption;
|
|
698
887
|
}
|
|
699
888
|
return emptyOption;
|
|
700
889
|
}, [input.value]);
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
const updatedInputProps = useValidationAppearanceInputProps({
|
|
890
|
+
var _useFieldValidationSt = useFieldValidationState({
|
|
891
|
+
fieldProps: fieldProps,
|
|
892
|
+
input: input,
|
|
893
|
+
meta: meta
|
|
894
|
+
}),
|
|
895
|
+
errorKey = _useFieldValidationSt.errorKey,
|
|
896
|
+
errorMessage = _useFieldValidationSt.errorMessage,
|
|
897
|
+
isErrorState = _useFieldValidationSt.isErrorState,
|
|
898
|
+
successKey = _useFieldValidationSt.successKey,
|
|
899
|
+
isValidState = _useFieldValidationSt.isValidState;
|
|
900
|
+
var updatedInputProps = useValidationAppearanceInputProps({
|
|
713
901
|
inputProps: inputProps,
|
|
714
902
|
validationStateKey: isErrorState ? errorKey : isValidState ? successKey : null
|
|
715
903
|
});
|
|
@@ -730,7 +918,7 @@ const FormFieldChoice = /*#__PURE__*/React__default.default.memo(function FormFi
|
|
|
730
918
|
isRequired: isRequired,
|
|
731
919
|
isValidState: isValidState
|
|
732
920
|
}, fieldProps), /*#__PURE__*/React__default.default.createElement(Choice.Choice, Object.assign({
|
|
733
|
-
className: clsx__default.default(meta.active && 'form-choice_state_focus', meta.error && meta.touched &&
|
|
921
|
+
className: clsx__default.default(meta.active && 'form-choice_state_focus', meta.error && meta.touched && "form-choice_state_" + errorKey),
|
|
734
922
|
name: input.name,
|
|
735
923
|
isDisabled: isDisabled,
|
|
736
924
|
active: activeOption,
|
|
@@ -744,7 +932,7 @@ const FormFieldChoice = /*#__PURE__*/React__default.default.memo(function FormFi
|
|
|
744
932
|
});
|
|
745
933
|
});
|
|
746
934
|
|
|
747
|
-
|
|
935
|
+
var defaultCodeProps = {
|
|
748
936
|
appearance: 'defaultPrimary sizeL solid rounded',
|
|
749
937
|
// useValidationAppearanceInputProps
|
|
750
938
|
// Error
|
|
@@ -753,26 +941,25 @@ const defaultCodeProps = {
|
|
|
753
941
|
requiredAppearance: 'requirePrimary sizeM solid rounded'
|
|
754
942
|
};
|
|
755
943
|
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
|
|
759
|
-
|
|
760
|
-
|
|
761
|
-
|
|
762
|
-
|
|
763
|
-
|
|
764
|
-
fieldProps = {},
|
|
765
|
-
inputProps =
|
|
766
|
-
|
|
767
|
-
|
|
768
|
-
|
|
944
|
+
var FormFieldCode = /*#__PURE__*/React__default.default.memo(function FormFieldCode(props) {
|
|
945
|
+
var name = props.name,
|
|
946
|
+
initialValue = props.initialValue,
|
|
947
|
+
label = props.label,
|
|
948
|
+
messageType = props.messageType,
|
|
949
|
+
isDisabled = props.isDisabled,
|
|
950
|
+
classNameGroupItem = props.classNameGroupItem,
|
|
951
|
+
_props$fieldProps = props.fieldProps,
|
|
952
|
+
fieldProps = _props$fieldProps === void 0 ? {} : _props$fieldProps,
|
|
953
|
+
_props$inputProps = props.inputProps,
|
|
954
|
+
inputProps = _props$inputProps === void 0 ? {} : _props$inputProps,
|
|
955
|
+
showMessage = props.showMessage,
|
|
956
|
+
isRequired = props.isRequired;
|
|
769
957
|
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
770
958
|
name: name,
|
|
771
959
|
initialValue: initialValue
|
|
772
|
-
}, function Render({
|
|
773
|
-
input,
|
|
774
|
-
|
|
775
|
-
}) {
|
|
960
|
+
}, function Render(_ref) {
|
|
961
|
+
var input = _ref.input,
|
|
962
|
+
meta = _ref.meta;
|
|
776
963
|
/** Note:
|
|
777
964
|
* Create "Render" function by "eslint-react-hooks/rules-of-hooks":
|
|
778
965
|
* React Hooks cannot be called inside a callback.
|
|
@@ -780,18 +967,17 @@ const FormFieldCode = /*#__PURE__*/React__default.default.memo(function FormFiel
|
|
|
780
967
|
* custom React Hook function.
|
|
781
968
|
*/
|
|
782
969
|
|
|
783
|
-
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
|
|
787
|
-
|
|
788
|
-
|
|
789
|
-
|
|
790
|
-
|
|
791
|
-
|
|
792
|
-
|
|
793
|
-
|
|
794
|
-
const updatedInputProps = useValidationAppearanceInputProps({
|
|
970
|
+
var _useFieldValidationSt = useFieldValidationState({
|
|
971
|
+
fieldProps: fieldProps,
|
|
972
|
+
input: input,
|
|
973
|
+
meta: meta
|
|
974
|
+
}),
|
|
975
|
+
errorKey = _useFieldValidationSt.errorKey,
|
|
976
|
+
errorMessage = _useFieldValidationSt.errorMessage,
|
|
977
|
+
isErrorState = _useFieldValidationSt.isErrorState,
|
|
978
|
+
successKey = _useFieldValidationSt.successKey,
|
|
979
|
+
isValidState = _useFieldValidationSt.isValidState;
|
|
980
|
+
var updatedInputProps = useValidationAppearanceInputProps({
|
|
795
981
|
inputProps: inputProps,
|
|
796
982
|
validationStateKey: isErrorState ? errorKey : isValidState ? successKey : null
|
|
797
983
|
});
|
|
@@ -821,30 +1007,28 @@ const FormFieldCode = /*#__PURE__*/React__default.default.memo(function FormFiel
|
|
|
821
1007
|
});
|
|
822
1008
|
});
|
|
823
1009
|
|
|
824
|
-
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
|
|
831
|
-
fieldProps = {},
|
|
832
|
-
classNameGroupItem,
|
|
833
|
-
showMessage,
|
|
834
|
-
clearIcon,
|
|
835
|
-
clearIconFill,
|
|
836
|
-
clearIconFillHover,
|
|
837
|
-
clearIconShape,
|
|
838
|
-
clearIconSize,
|
|
839
|
-
onClickClearIcon
|
|
840
|
-
} = props;
|
|
1010
|
+
var FormFieldCustom = /*#__PURE__*/React__default.default.memo(function FormFieldCustom(props) {
|
|
1011
|
+
var Component = props.Component,
|
|
1012
|
+
isDisabled = props.isDisabled,
|
|
1013
|
+
isRequired = props.isRequired,
|
|
1014
|
+
name = props.name,
|
|
1015
|
+
initialValue = props.initialValue,
|
|
1016
|
+
_props$fieldProps = props.fieldProps,
|
|
1017
|
+
fieldProps = _props$fieldProps === void 0 ? {} : _props$fieldProps,
|
|
1018
|
+
classNameGroupItem = props.classNameGroupItem,
|
|
1019
|
+
showMessage = props.showMessage,
|
|
1020
|
+
clearIcon = props.clearIcon,
|
|
1021
|
+
clearIconFill = props.clearIconFill,
|
|
1022
|
+
clearIconFillHover = props.clearIconFillHover,
|
|
1023
|
+
clearIconShape = props.clearIconShape,
|
|
1024
|
+
clearIconSize = props.clearIconSize,
|
|
1025
|
+
onClickClearIcon = props.onClickClearIcon;
|
|
841
1026
|
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
842
1027
|
initialValue: initialValue,
|
|
843
1028
|
name: name
|
|
844
|
-
}, function Render({
|
|
845
|
-
input,
|
|
846
|
-
|
|
847
|
-
}) {
|
|
1029
|
+
}, function Render(_ref) {
|
|
1030
|
+
var input = _ref.input,
|
|
1031
|
+
meta = _ref.meta;
|
|
848
1032
|
/** Note:
|
|
849
1033
|
* Create "Render" function by "eslint-react-hooks/rules-of-hooks":
|
|
850
1034
|
* React Hooks cannot be called inside a callback.
|
|
@@ -852,17 +1036,16 @@ const FormFieldCustom = /*#__PURE__*/React__default.default.memo(function FormFi
|
|
|
852
1036
|
* custom React Hook function.
|
|
853
1037
|
*/
|
|
854
1038
|
|
|
855
|
-
|
|
856
|
-
|
|
857
|
-
|
|
858
|
-
|
|
859
|
-
|
|
860
|
-
|
|
861
|
-
|
|
862
|
-
|
|
863
|
-
|
|
864
|
-
|
|
865
|
-
const updatedInputProps = useValidationAppearanceInputProps({
|
|
1039
|
+
var _useFieldValidationSt = useFieldValidationState({
|
|
1040
|
+
fieldProps: fieldProps,
|
|
1041
|
+
input: input,
|
|
1042
|
+
meta: meta
|
|
1043
|
+
}),
|
|
1044
|
+
isErrorState = _useFieldValidationSt.isErrorState,
|
|
1045
|
+
isValidState = _useFieldValidationSt.isValidState,
|
|
1046
|
+
errorKey = _useFieldValidationSt.errorKey,
|
|
1047
|
+
errorMessage = _useFieldValidationSt.errorMessage;
|
|
1048
|
+
var updatedInputProps = useValidationAppearanceInputProps({
|
|
866
1049
|
validationStateKey: isErrorState ? errorKey : 'success',
|
|
867
1050
|
// For "Custom" field we pass all props. Can contain some special props, we don't known.
|
|
868
1051
|
inputProps: props
|
|
@@ -898,7 +1081,99 @@ const FormFieldCustom = /*#__PURE__*/React__default.default.memo(function FormFi
|
|
|
898
1081
|
});
|
|
899
1082
|
});
|
|
900
1083
|
|
|
901
|
-
|
|
1084
|
+
var defaultDadataInputProps = {
|
|
1085
|
+
appearance: 'defaultPrimary sizeM solid rounded',
|
|
1086
|
+
// useValidationAppearanceInputProps
|
|
1087
|
+
// Error
|
|
1088
|
+
errorAppearance: 'errorPrimary sizeM solid rounded',
|
|
1089
|
+
// Success
|
|
1090
|
+
successAppearance: 'successPrimary sizeM solid rounded',
|
|
1091
|
+
// Required
|
|
1092
|
+
requiredAppearance: 'requirePrimary sizeM solid rounded'
|
|
1093
|
+
};
|
|
1094
|
+
|
|
1095
|
+
var FormFieldDadataInput = /*#__PURE__*/React__default.default.memo(function FormFieldDadataInput(props) {
|
|
1096
|
+
var name = props.name,
|
|
1097
|
+
initialValue = props.initialValue,
|
|
1098
|
+
isDisabled = props.isDisabled,
|
|
1099
|
+
classNameGroupItem = props.classNameGroupItem,
|
|
1100
|
+
fieldProps = props.fieldProps,
|
|
1101
|
+
inputProps = props.inputProps,
|
|
1102
|
+
parse = props.parse,
|
|
1103
|
+
showMessage = props.showMessage,
|
|
1104
|
+
token = props.token,
|
|
1105
|
+
isRequired = props.isRequired,
|
|
1106
|
+
onDadataAutocomplete = props.onDadataAutocomplete;
|
|
1107
|
+
if (process.env.NODE_ENV === 'development') {
|
|
1108
|
+
var hint = "Check your form config at field \"" + name + "\".";
|
|
1109
|
+
if (!token) {
|
|
1110
|
+
var message = "FormFieldDadataInput: 'token' prop is missing, instead got " + token + ".";
|
|
1111
|
+
throw new Error(message + '\n' + hint);
|
|
1112
|
+
}
|
|
1113
|
+
if (!onDadataAutocomplete) {
|
|
1114
|
+
var _message = "FormFieldDadataInput: 'onDadataAutocomplete' prop is missing, instead got " + onDadataAutocomplete + ".";
|
|
1115
|
+
throw new Error(_message + '\n' + hint);
|
|
1116
|
+
}
|
|
1117
|
+
}
|
|
1118
|
+
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
1119
|
+
name: name,
|
|
1120
|
+
initialValue: initialValue,
|
|
1121
|
+
parse: parse
|
|
1122
|
+
}, function Render(_ref) {
|
|
1123
|
+
var input = _ref.input,
|
|
1124
|
+
meta = _ref.meta;
|
|
1125
|
+
/** Note:
|
|
1126
|
+
* Create "Render" function by "eslint-react-hooks/rules-of-hooks":
|
|
1127
|
+
* React Hooks cannot be called inside a callback.
|
|
1128
|
+
* React Hooks must be called in a React function component or a
|
|
1129
|
+
* custom React Hook function.
|
|
1130
|
+
*/
|
|
1131
|
+
|
|
1132
|
+
var _useFieldValidationSt = useFieldValidationState({
|
|
1133
|
+
fieldProps: fieldProps,
|
|
1134
|
+
input: input,
|
|
1135
|
+
meta: meta
|
|
1136
|
+
}),
|
|
1137
|
+
errorKey = _useFieldValidationSt.errorKey,
|
|
1138
|
+
errorMessage = _useFieldValidationSt.errorMessage,
|
|
1139
|
+
isErrorState = _useFieldValidationSt.isErrorState,
|
|
1140
|
+
successKey = _useFieldValidationSt.successKey,
|
|
1141
|
+
isValidState = _useFieldValidationSt.isValidState;
|
|
1142
|
+
var updatedInputProps = useValidationAppearanceInputProps({
|
|
1143
|
+
inputProps: inputProps,
|
|
1144
|
+
validationStateKey: isErrorState ? errorKey : isValidState ? successKey : null
|
|
1145
|
+
});
|
|
1146
|
+
return /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
|
|
1147
|
+
className: clsx__default.default('form-field_input-dadata', 'form__item_input-dadata', classNameGroupItem),
|
|
1148
|
+
errorKey: errorKey,
|
|
1149
|
+
errorMessage: errorMessage,
|
|
1150
|
+
isErrorState: isErrorState,
|
|
1151
|
+
metaError: meta.error,
|
|
1152
|
+
isDisabled: isDisabled,
|
|
1153
|
+
fieldClassName: "form-dadata",
|
|
1154
|
+
inputName: input.name,
|
|
1155
|
+
inputValue: input.value || '',
|
|
1156
|
+
metaActive: meta.active,
|
|
1157
|
+
showMessage: showMessage,
|
|
1158
|
+
isRequired: isRequired,
|
|
1159
|
+
isValidState: isValidState
|
|
1160
|
+
}, fieldProps), /*#__PURE__*/React__default.default.createElement(Dadata.Dadata
|
|
1161
|
+
// dataTestId={`${input.name}FieldInputDadata`}
|
|
1162
|
+
// className={clsx(
|
|
1163
|
+
// meta.active && 'input-dadata_state_focus',
|
|
1164
|
+
// meta.error && meta.touched && `input-dadata_state_${errorKey}`,
|
|
1165
|
+
// )}
|
|
1166
|
+
, {
|
|
1167
|
+
input: input,
|
|
1168
|
+
inputProps: updatedInputProps,
|
|
1169
|
+
meta: meta,
|
|
1170
|
+
setValue: onDadataAutocomplete,
|
|
1171
|
+
token: token
|
|
1172
|
+
}));
|
|
1173
|
+
});
|
|
1174
|
+
});
|
|
1175
|
+
|
|
1176
|
+
var defaultDatepickerProps = {
|
|
902
1177
|
appearance: 'surfacePrimary sizeS',
|
|
903
1178
|
dateFormat: 'dd/MM/yyyy - HH:mm',
|
|
904
1179
|
readOnly: false,
|
|
@@ -912,23 +1187,22 @@ const defaultDatepickerProps = {
|
|
|
912
1187
|
};
|
|
913
1188
|
|
|
914
1189
|
function FormFieldDatePicker(props) {
|
|
915
|
-
|
|
916
|
-
|
|
917
|
-
|
|
918
|
-
|
|
919
|
-
|
|
920
|
-
fieldProps = {},
|
|
921
|
-
inputProps =
|
|
922
|
-
|
|
923
|
-
|
|
924
|
-
|
|
925
|
-
|
|
1190
|
+
var name = props.name,
|
|
1191
|
+
isDisabled = props.isDisabled,
|
|
1192
|
+
classNameGroupItem = props.classNameGroupItem,
|
|
1193
|
+
datePickerProps = props.datePickerProps,
|
|
1194
|
+
_props$fieldProps = props.fieldProps,
|
|
1195
|
+
fieldProps = _props$fieldProps === void 0 ? {} : _props$fieldProps,
|
|
1196
|
+
_props$inputProps = props.inputProps,
|
|
1197
|
+
inputProps = _props$inputProps === void 0 ? {} : _props$inputProps,
|
|
1198
|
+
showMessage = props.showMessage,
|
|
1199
|
+
isRequired = props.isRequired,
|
|
1200
|
+
onChange = props.onChange;
|
|
926
1201
|
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
927
1202
|
name: name
|
|
928
|
-
}, function Render({
|
|
929
|
-
input,
|
|
930
|
-
|
|
931
|
-
}) {
|
|
1203
|
+
}, function Render(_ref) {
|
|
1204
|
+
var input = _ref.input,
|
|
1205
|
+
meta = _ref.meta;
|
|
932
1206
|
/** Note:
|
|
933
1207
|
* Create "Render" function by "eslint-react-hooks/rules-of-hooks":
|
|
934
1208
|
* React Hooks cannot be called inside a callback.
|
|
@@ -936,7 +1210,7 @@ function FormFieldDatePicker(props) {
|
|
|
936
1210
|
* custom React Hook function.
|
|
937
1211
|
*/
|
|
938
1212
|
|
|
939
|
-
|
|
1213
|
+
var onChangeField = React.useCallback(function (startDate, endDate) {
|
|
940
1214
|
if (!datePickerProps.selectsRange) {
|
|
941
1215
|
// When we need to save single date, value is date
|
|
942
1216
|
// TODO: make object with one date? need to check all forms with FormFieldDatePicker
|
|
@@ -944,26 +1218,25 @@ function FormFieldDatePicker(props) {
|
|
|
944
1218
|
} else {
|
|
945
1219
|
// When we need to save range, value is object with two date
|
|
946
1220
|
input.onChange({
|
|
947
|
-
endDate,
|
|
948
|
-
startDate
|
|
1221
|
+
endDate: endDate,
|
|
1222
|
+
startDate: startDate
|
|
949
1223
|
});
|
|
950
1224
|
}
|
|
951
1225
|
if (onChange) {
|
|
952
1226
|
onChange(startDate, endDate);
|
|
953
1227
|
}
|
|
954
1228
|
}, [input.onChange, onChange]);
|
|
955
|
-
|
|
956
|
-
|
|
957
|
-
|
|
958
|
-
|
|
959
|
-
|
|
960
|
-
|
|
961
|
-
|
|
962
|
-
|
|
963
|
-
|
|
964
|
-
|
|
965
|
-
|
|
966
|
-
const updatedInputProps = useValidationAppearanceInputProps({
|
|
1229
|
+
var _useFieldValidationSt = useFieldValidationState({
|
|
1230
|
+
fieldProps: fieldProps,
|
|
1231
|
+
input: input,
|
|
1232
|
+
meta: meta
|
|
1233
|
+
}),
|
|
1234
|
+
errorKey = _useFieldValidationSt.errorKey,
|
|
1235
|
+
errorMessage = _useFieldValidationSt.errorMessage,
|
|
1236
|
+
isErrorState = _useFieldValidationSt.isErrorState,
|
|
1237
|
+
successKey = _useFieldValidationSt.successKey,
|
|
1238
|
+
isValidState = _useFieldValidationSt.isValidState;
|
|
1239
|
+
var updatedInputProps = useValidationAppearanceInputProps({
|
|
967
1240
|
inputProps: inputProps,
|
|
968
1241
|
validationStateKey: isErrorState ? errorKey : isValidState ? successKey : null
|
|
969
1242
|
});
|
|
@@ -995,7 +1268,7 @@ function FormFieldDatePicker(props) {
|
|
|
995
1268
|
});
|
|
996
1269
|
}
|
|
997
1270
|
|
|
998
|
-
|
|
1271
|
+
var defaultDropzoneProps = {
|
|
999
1272
|
fill: 'surfaceSecondary',
|
|
1000
1273
|
fillHover: 'surfaceTertiary',
|
|
1001
1274
|
// borderColor: 'surfaceBorderTertiary',
|
|
@@ -1017,45 +1290,45 @@ const defaultDropzoneProps = {
|
|
|
1017
1290
|
isPreviews: true
|
|
1018
1291
|
};
|
|
1019
1292
|
|
|
1020
|
-
|
|
1021
|
-
|
|
1022
|
-
|
|
1023
|
-
|
|
1024
|
-
|
|
1025
|
-
|
|
1026
|
-
|
|
1027
|
-
|
|
1028
|
-
|
|
1029
|
-
|
|
1030
|
-
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1035
|
-
|
|
1036
|
-
onClickPreview,
|
|
1037
|
-
onDeleteFile
|
|
1038
|
-
} = props;
|
|
1293
|
+
var FileInputDropzone = /*#__PURE__*/React__default.default.memo(function FileInputDropzone(props) {
|
|
1294
|
+
var maxFiles = props.maxFiles,
|
|
1295
|
+
maxSize = props.maxSize,
|
|
1296
|
+
fileErrorText = props.fileErrorText,
|
|
1297
|
+
_props$dropzoneProps = props.dropzoneProps,
|
|
1298
|
+
dropzoneProps = _props$dropzoneProps === void 0 ? {} : _props$dropzoneProps,
|
|
1299
|
+
hintDescription = props.hintDescription,
|
|
1300
|
+
hintTitle = props.hintTitle,
|
|
1301
|
+
inputName = props.inputName,
|
|
1302
|
+
inputValue = props.inputValue,
|
|
1303
|
+
showFilename = props.showFilename,
|
|
1304
|
+
thumbColumn = props.thumbColumn,
|
|
1305
|
+
isPreviews = props.isPreviews,
|
|
1306
|
+
onAddFiles = props.onAddFiles,
|
|
1307
|
+
onClickPreview = props.onClickPreview,
|
|
1308
|
+
onDeleteFile = props.onDeleteFile;
|
|
1039
1309
|
|
|
1040
1310
|
// TODO: delete react-final-form things out of here?
|
|
1041
|
-
|
|
1042
|
-
change
|
|
1043
|
-
|
|
1044
|
-
|
|
1045
|
-
|
|
1046
|
-
|
|
1047
|
-
|
|
1048
|
-
|
|
1311
|
+
var _useForm = reactFinalForm.useForm(),
|
|
1312
|
+
change = _useForm.change;
|
|
1313
|
+
var _useState = React.useState(''),
|
|
1314
|
+
fileError = _useState[0],
|
|
1315
|
+
setFileError = _useState[1];
|
|
1316
|
+
var _useState2 = React.useState(false),
|
|
1317
|
+
fileIsLoading = _useState2[0],
|
|
1318
|
+
setFileIsLoading = _useState2[1];
|
|
1319
|
+
var prevFilesListRef = React.useRef(null);
|
|
1320
|
+
var filesList = React.useMemo(function () {
|
|
1321
|
+
var newFilesList = inputValue ? castArray__default.default(inputValue) : [];
|
|
1049
1322
|
if (prevFilesListRef.current === null) {
|
|
1050
1323
|
prevFilesListRef.current = newFilesList;
|
|
1051
1324
|
return newFilesList;
|
|
1052
1325
|
}
|
|
1053
1326
|
// keep track of previous state and revoke unused object urls
|
|
1054
|
-
prevFilesListRef.current.forEach(prevFile
|
|
1327
|
+
prevFilesListRef.current.forEach(function (prevFile) {
|
|
1055
1328
|
if (!prevFile.preview) {
|
|
1056
1329
|
return;
|
|
1057
1330
|
}
|
|
1058
|
-
|
|
1331
|
+
var isFileDeleted = !newFilesList.some(function (newFile) {
|
|
1059
1332
|
return newFile.preview === prevFile.preview;
|
|
1060
1333
|
});
|
|
1061
1334
|
if (isFileDeleted) {
|
|
@@ -1065,10 +1338,10 @@ const FileInputDropzone = /*#__PURE__*/React__default.default.memo(function File
|
|
|
1065
1338
|
prevFilesListRef.current = newFilesList;
|
|
1066
1339
|
return newFilesList;
|
|
1067
1340
|
}, [inputValue]);
|
|
1068
|
-
|
|
1341
|
+
var changeFormState = React.useCallback(function (newFiles) {
|
|
1069
1342
|
// If max files in dropzone is 1 - return file as it self, else as array of files
|
|
1070
1343
|
// ps: for old projects compatibility
|
|
1071
|
-
|
|
1344
|
+
var toSave = dropzoneProps.maxFiles == 1 ? newFiles[0] : newFiles;
|
|
1072
1345
|
change(inputName, toSave);
|
|
1073
1346
|
return toSave;
|
|
1074
1347
|
},
|
|
@@ -1077,28 +1350,57 @@ const FileInputDropzone = /*#__PURE__*/React__default.default.memo(function File
|
|
|
1077
1350
|
[dropzoneProps, change]);
|
|
1078
1351
|
|
|
1079
1352
|
//
|
|
1080
|
-
|
|
1081
|
-
|
|
1082
|
-
|
|
1083
|
-
|
|
1084
|
-
|
|
1085
|
-
|
|
1086
|
-
|
|
1087
|
-
|
|
1353
|
+
var convertFiledValueAndSaveAsFiles = React.useCallback(/*#__PURE__*/function () {
|
|
1354
|
+
var _ref = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(currentFilesList) {
|
|
1355
|
+
var newFiles, _iterator, _step, fileItem, newFile;
|
|
1356
|
+
return _regenerator().w(function (_context) {
|
|
1357
|
+
while (1) switch (_context.n) {
|
|
1358
|
+
case 0:
|
|
1359
|
+
setFileIsLoading(true);
|
|
1360
|
+
newFiles = [];
|
|
1361
|
+
_iterator = _createForOfIteratorHelperLoose(currentFilesList);
|
|
1362
|
+
case 1:
|
|
1363
|
+
if ((_step = _iterator()).done) {
|
|
1364
|
+
_context.n = 5;
|
|
1365
|
+
break;
|
|
1366
|
+
}
|
|
1367
|
+
fileItem = _step.value;
|
|
1368
|
+
if (!(typeof fileItem === 'string')) {
|
|
1369
|
+
_context.n = 3;
|
|
1370
|
+
break;
|
|
1371
|
+
}
|
|
1372
|
+
_context.n = 2;
|
|
1373
|
+
return convertToFile(fileItem, isPreviews);
|
|
1374
|
+
case 2:
|
|
1375
|
+
newFile = _context.v;
|
|
1376
|
+
if (newFile) {
|
|
1377
|
+
newFiles.push(newFile);
|
|
1378
|
+
}
|
|
1379
|
+
_context.n = 4;
|
|
1380
|
+
break;
|
|
1381
|
+
case 3:
|
|
1382
|
+
newFiles.push(fileItem);
|
|
1383
|
+
case 4:
|
|
1384
|
+
_context.n = 1;
|
|
1385
|
+
break;
|
|
1386
|
+
case 5:
|
|
1387
|
+
changeFormState(newFiles);
|
|
1388
|
+
setFileIsLoading(false);
|
|
1389
|
+
case 6:
|
|
1390
|
+
return _context.a(2);
|
|
1088
1391
|
}
|
|
1089
|
-
}
|
|
1090
|
-
|
|
1091
|
-
|
|
1092
|
-
|
|
1093
|
-
|
|
1094
|
-
|
|
1095
|
-
}, [isPreviews, changeFormState]);
|
|
1392
|
+
}, _callee);
|
|
1393
|
+
}));
|
|
1394
|
+
return function (_x) {
|
|
1395
|
+
return _ref.apply(this, arguments);
|
|
1396
|
+
};
|
|
1397
|
+
}(), [isPreviews, changeFormState]);
|
|
1096
1398
|
|
|
1097
1399
|
// Delete file from dropzone
|
|
1098
|
-
|
|
1400
|
+
var removeFile = React.useCallback(function (event, index) {
|
|
1099
1401
|
event.stopPropagation();
|
|
1100
1402
|
event.preventDefault();
|
|
1101
|
-
|
|
1403
|
+
var newFiles = [].concat(filesList);
|
|
1102
1404
|
newFiles.splice(index, 1);
|
|
1103
1405
|
if (onDeleteFile) {
|
|
1104
1406
|
onDeleteFile(filesList[index], inputName);
|
|
@@ -1110,165 +1412,184 @@ const FileInputDropzone = /*#__PURE__*/React__default.default.memo(function File
|
|
|
1110
1412
|
[filesList, changeFormState, onDeleteFile]);
|
|
1111
1413
|
|
|
1112
1414
|
// Create dropzone options
|
|
1113
|
-
|
|
1114
|
-
|
|
1115
|
-
|
|
1116
|
-
|
|
1117
|
-
|
|
1118
|
-
|
|
1119
|
-
|
|
1120
|
-
|
|
1121
|
-
|
|
1122
|
-
|
|
1123
|
-
|
|
1124
|
-
|
|
1125
|
-
|
|
1126
|
-
|
|
1127
|
-
|
|
1128
|
-
|
|
1129
|
-
|
|
1130
|
-
|
|
1131
|
-
|
|
1132
|
-
|
|
1133
|
-
|
|
1134
|
-
|
|
1415
|
+
var _useDropzone = reactDropzone.useDropzone(Object.assign({
|
|
1416
|
+
maxFiles: maxFiles || 5,
|
|
1417
|
+
maxSize: maxSize || 10485760
|
|
1418
|
+
}, dropzoneProps, {
|
|
1419
|
+
getFilesFromEvent: function () {
|
|
1420
|
+
var _getFilesFromEvent = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2(event) {
|
|
1421
|
+
var result, newFiles;
|
|
1422
|
+
return _regenerator().w(function (_context2) {
|
|
1423
|
+
while (1) switch (_context2.n) {
|
|
1424
|
+
case 0:
|
|
1425
|
+
_context2.n = 1;
|
|
1426
|
+
return fileSelector.fromEvent(event);
|
|
1427
|
+
case 1:
|
|
1428
|
+
result = _context2.v;
|
|
1429
|
+
newFiles = result.filter(function (item) {
|
|
1430
|
+
return item instanceof File;
|
|
1431
|
+
}); // Add exists and new files to accepted(or rejected)
|
|
1432
|
+
return _context2.a(2, [].concat(filesList, newFiles));
|
|
1433
|
+
}
|
|
1434
|
+
}, _callee2);
|
|
1435
|
+
}));
|
|
1436
|
+
function getFilesFromEvent(_x2) {
|
|
1437
|
+
return _getFilesFromEvent.apply(this, arguments);
|
|
1438
|
+
}
|
|
1439
|
+
return getFilesFromEvent;
|
|
1440
|
+
}(),
|
|
1441
|
+
onDropAccepted: function onDropAccepted(acceptedFiles) {
|
|
1442
|
+
// If dropped files has accepted and we need a previews
|
|
1443
|
+
if (isPreviews) {
|
|
1444
|
+
// Add preview to every file
|
|
1445
|
+
acceptedFiles.forEach(function (file) {
|
|
1446
|
+
if (!file.error && !file.preview) {
|
|
1447
|
+
file.preview = URL.createObjectURL(file);
|
|
1448
|
+
}
|
|
1449
|
+
});
|
|
1450
|
+
}
|
|
1451
|
+
// Save to form data (including empty when files are not valid)
|
|
1452
|
+
var filesToSave = changeFormState(acceptedFiles);
|
|
1453
|
+
setFileError('');
|
|
1454
|
+
|
|
1455
|
+
// Save DataURL for all files
|
|
1456
|
+
var readerPromisesList = acceptedFiles.map(function (file) {
|
|
1457
|
+
return new Promise(function (resolve) {
|
|
1458
|
+
return setFileDataURL(file, resolve);
|
|
1459
|
+
});
|
|
1460
|
+
});
|
|
1461
|
+
// Save files to form values
|
|
1462
|
+
Promise.all(readerPromisesList).then(function () {
|
|
1463
|
+
if (onAddFiles) {
|
|
1464
|
+
onAddFiles(filesToSave, inputName);
|
|
1135
1465
|
}
|
|
1136
1466
|
});
|
|
1137
|
-
}
|
|
1138
|
-
|
|
1139
|
-
|
|
1140
|
-
|
|
1141
|
-
|
|
1142
|
-
|
|
1143
|
-
|
|
1144
|
-
|
|
1145
|
-
|
|
1146
|
-
|
|
1147
|
-
|
|
1148
|
-
|
|
1149
|
-
onAddFiles(filesToSave, inputName);
|
|
1150
|
-
}
|
|
1151
|
-
});
|
|
1152
|
-
},
|
|
1153
|
-
onDropRejected: rejectedFiles => {
|
|
1154
|
-
// If dropped files has rejected
|
|
1155
|
-
if (rejectedFiles.length) {
|
|
1156
|
-
let fileErrorMessage = 'Ошибка при добавлении файла';
|
|
1157
|
-
const firstFileErrorItem = rejectedFiles[0].errors[0];
|
|
1158
|
-
if (firstFileErrorItem) {
|
|
1159
|
-
if (firstFileErrorItem.code === reactDropzone.ErrorCode.TooManyFiles) {
|
|
1160
|
-
fileErrorMessage = `Максимальное количество файлов: ${maxFiles}`;
|
|
1161
|
-
} else {
|
|
1162
|
-
fileErrorMessage = firstFileErrorItem.message;
|
|
1467
|
+
},
|
|
1468
|
+
onDropRejected: function onDropRejected(rejectedFiles) {
|
|
1469
|
+
// If dropped files has rejected
|
|
1470
|
+
if (rejectedFiles.length) {
|
|
1471
|
+
var fileErrorMessage = 'Ошибка при добавлении файла';
|
|
1472
|
+
var firstFileErrorItem = rejectedFiles[0].errors[0];
|
|
1473
|
+
if (firstFileErrorItem) {
|
|
1474
|
+
if (firstFileErrorItem.code === reactDropzone.ErrorCode.TooManyFiles) {
|
|
1475
|
+
fileErrorMessage = "\u041C\u0430\u043A\u0441\u0438\u043C\u0430\u043B\u044C\u043D\u043E\u0435 \u043A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0444\u0430\u0439\u043B\u043E\u0432: " + maxFiles;
|
|
1476
|
+
} else {
|
|
1477
|
+
fileErrorMessage = firstFileErrorItem.message;
|
|
1478
|
+
}
|
|
1163
1479
|
}
|
|
1480
|
+
// Show error
|
|
1481
|
+
setFileError(fileErrorMessage);
|
|
1482
|
+
} else {
|
|
1483
|
+
// Else clean error
|
|
1484
|
+
setFileError('');
|
|
1164
1485
|
}
|
|
1165
|
-
// Show error
|
|
1166
|
-
setFileError(fileErrorMessage);
|
|
1167
|
-
} else {
|
|
1168
|
-
// Else clean error
|
|
1169
|
-
setFileError('');
|
|
1170
1486
|
}
|
|
1171
|
-
}
|
|
1172
|
-
|
|
1173
|
-
|
|
1174
|
-
|
|
1175
|
-
|
|
1487
|
+
})),
|
|
1488
|
+
getInputProps = _useDropzone.getInputProps,
|
|
1489
|
+
getRootProps = _useDropzone.getRootProps;
|
|
1490
|
+
React.useEffect(function () {
|
|
1491
|
+
var currentFilesList = castArray__default.default(inputValue);
|
|
1492
|
+
var isNeedToConvert = currentFilesList.some(function (fileItem) {
|
|
1493
|
+
return typeof fileItem === 'string';
|
|
1494
|
+
});
|
|
1176
1495
|
if (isNeedToConvert) {
|
|
1177
1496
|
// First time convert value to Files and save to local and form state
|
|
1178
1497
|
convertFiledValueAndSaveAsFiles(currentFilesList);
|
|
1179
1498
|
}
|
|
1180
1499
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
1181
1500
|
}, [inputValue]);
|
|
1182
|
-
React.useEffect(()
|
|
1501
|
+
React.useEffect(function () {
|
|
1183
1502
|
// Make sure to revoke the data uris to avoid memory leaks, will run on unmount
|
|
1184
|
-
return ()
|
|
1185
|
-
prevFilesListRef.current.forEach(file
|
|
1503
|
+
return function () {
|
|
1504
|
+
prevFilesListRef.current.forEach(function (file) {
|
|
1186
1505
|
if (file.preview) {
|
|
1187
1506
|
URL.revokeObjectURL(file.preview);
|
|
1188
1507
|
}
|
|
1189
1508
|
});
|
|
1190
1509
|
};
|
|
1191
1510
|
}, []);
|
|
1192
|
-
|
|
1193
|
-
|
|
1194
|
-
|
|
1195
|
-
|
|
1196
|
-
|
|
1197
|
-
|
|
1198
|
-
|
|
1199
|
-
|
|
1200
|
-
|
|
1201
|
-
|
|
1202
|
-
|
|
1203
|
-
|
|
1204
|
-
|
|
1205
|
-
|
|
1206
|
-
|
|
1207
|
-
|
|
1208
|
-
|
|
1209
|
-
|
|
1210
|
-
|
|
1211
|
-
|
|
1212
|
-
|
|
1213
|
-
|
|
1214
|
-
|
|
1215
|
-
|
|
1216
|
-
|
|
1217
|
-
|
|
1218
|
-
|
|
1219
|
-
|
|
1220
|
-
|
|
1221
|
-
|
|
1222
|
-
|
|
1223
|
-
|
|
1224
|
-
thumbNameTextWrap
|
|
1225
|
-
} = propsGenerator;
|
|
1511
|
+
var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
|
|
1512
|
+
var fillClass = propsGenerator.fillClass,
|
|
1513
|
+
fillHoverClass = propsGenerator.fillHoverClass,
|
|
1514
|
+
borderColorClass = propsGenerator.borderColorClass,
|
|
1515
|
+
borderColorHoverClass = propsGenerator.borderColorHoverClass,
|
|
1516
|
+
borderTypeClass = propsGenerator.borderTypeClass,
|
|
1517
|
+
borderWidthClass = propsGenerator.borderWidthClass,
|
|
1518
|
+
errorMessageTextColor = propsGenerator.errorMessageTextColor,
|
|
1519
|
+
errorMessageTextSize = propsGenerator.errorMessageTextSize,
|
|
1520
|
+
errorMessageTextWeight = propsGenerator.errorMessageTextWeight,
|
|
1521
|
+
hintDescriptionTextColor = propsGenerator.hintDescriptionTextColor,
|
|
1522
|
+
hintDescriptionTextSize = propsGenerator.hintDescriptionTextSize,
|
|
1523
|
+
hintDescriptionTextWeight = propsGenerator.hintDescriptionTextWeight,
|
|
1524
|
+
hintDescriptionTextWrap = propsGenerator.hintDescriptionTextWrap,
|
|
1525
|
+
hintTitleTextColor = propsGenerator.hintTitleTextColor,
|
|
1526
|
+
hintTitleTextSize = propsGenerator.hintTitleTextSize,
|
|
1527
|
+
hintTitleTextWeight = propsGenerator.hintTitleTextWeight,
|
|
1528
|
+
hintTitleTextWrap = propsGenerator.hintTitleTextWrap,
|
|
1529
|
+
removeThumbAppearance = propsGenerator.removeThumbAppearance,
|
|
1530
|
+
removeThumbShape = propsGenerator.removeThumbShape,
|
|
1531
|
+
removeThumbText = propsGenerator.removeThumbText,
|
|
1532
|
+
removeThumbTextWeight = propsGenerator.removeThumbTextWeight,
|
|
1533
|
+
shapeClass = propsGenerator.shapeClass,
|
|
1534
|
+
thumbBorderColorClass = propsGenerator.thumbBorderColorClass,
|
|
1535
|
+
thumbBorderColorHoverClass = propsGenerator.thumbBorderColorHoverClass,
|
|
1536
|
+
thumbBorderTypeClass = propsGenerator.thumbBorderTypeClass,
|
|
1537
|
+
thumbBorderWidthClass = propsGenerator.thumbBorderWidthClass,
|
|
1538
|
+
thumbDirectionClass = propsGenerator.thumbDirectionClass,
|
|
1539
|
+
thumbNameTextColor = propsGenerator.thumbNameTextColor,
|
|
1540
|
+
thumbNameTextSize = propsGenerator.thumbNameTextSize,
|
|
1541
|
+
thumbNameTextWeight = propsGenerator.thumbNameTextWeight,
|
|
1542
|
+
thumbNameTextWrap = propsGenerator.thumbNameTextWrap;
|
|
1226
1543
|
return /*#__PURE__*/React__default.default.createElement(React__default.default.Fragment, null, /*#__PURE__*/React__default.default.createElement("div", getRootProps({
|
|
1227
1544
|
// className: `form-dropzone__dropzone dropzone ${className} form-dropzone__dropzone_size_${size} ${shapeClass}`,
|
|
1228
|
-
className:
|
|
1545
|
+
className: "form-dropzone__dropzone dropzone"
|
|
1229
1546
|
}), /*#__PURE__*/React__default.default.createElement("input", Object.assign({}, getInputProps(), {
|
|
1230
1547
|
name: inputName
|
|
1231
1548
|
})), /*#__PURE__*/React__default.default.createElement("div", {
|
|
1232
|
-
className: clsx__default.default('form-dropzone__dropzone-wrapper', thumbColumn &&
|
|
1233
|
-
}, filesList.map((file, index)
|
|
1234
|
-
|
|
1235
|
-
|
|
1236
|
-
|
|
1237
|
-
|
|
1238
|
-
|
|
1239
|
-
|
|
1240
|
-
|
|
1241
|
-
|
|
1242
|
-
|
|
1243
|
-
|
|
1244
|
-
|
|
1245
|
-
|
|
1246
|
-
|
|
1247
|
-
|
|
1248
|
-
|
|
1249
|
-
|
|
1250
|
-
|
|
1251
|
-
|
|
1252
|
-
|
|
1253
|
-
|
|
1254
|
-
|
|
1255
|
-
|
|
1256
|
-
|
|
1257
|
-
|
|
1258
|
-
|
|
1259
|
-
|
|
1260
|
-
|
|
1261
|
-
|
|
1262
|
-
|
|
1263
|
-
|
|
1264
|
-
|
|
1265
|
-
|
|
1266
|
-
|
|
1267
|
-
|
|
1268
|
-
|
|
1269
|
-
|
|
1270
|
-
|
|
1271
|
-
|
|
1549
|
+
className: clsx__default.default('form-dropzone__dropzone-wrapper', thumbColumn && "form-dropzone__dropzone-wrapper_column_" + thumbColumn, fillClass && "fill_" + fillClass, fillHoverClass && "fill_hover_" + fillHoverClass, borderWidthClass && "border-width_" + borderWidthClass, borderColorClass && "border-color_" + borderColorClass, borderColorHoverClass && "border-color_hover_" + borderColorHoverClass, borderTypeClass && "border_type_" + borderTypeClass, shapeClass && "shape_" + shapeClass)
|
|
1550
|
+
}, filesList.map(function (file, index) {
|
|
1551
|
+
return /*#__PURE__*/React__default.default.createElement("aside", {
|
|
1552
|
+
className: clsx__default.default('form-dropzone__thumb', fillClass, thumbDirectionClass, thumbBorderWidthClass, thumbBorderColorClass, thumbBorderColorHoverClass, thumbBorderTypeClass),
|
|
1553
|
+
key: file.id || file.name + "_" + index
|
|
1554
|
+
}, isPreviews && !file.error && /*#__PURE__*/React__default.default.createElement("div", {
|
|
1555
|
+
className: "form-dropzone__thumb-image"
|
|
1556
|
+
}, /*#__PURE__*/React__default.default.createElement("img", {
|
|
1557
|
+
className: "form-dropzone__thumb-image-inner",
|
|
1558
|
+
src: file.preview || file.image,
|
|
1559
|
+
onClick: function onClick(event) {
|
|
1560
|
+
onClickPreview && onClickPreview(file, event);
|
|
1561
|
+
}
|
|
1562
|
+
})), file.error && /*#__PURE__*/React__default.default.createElement("div", null, /*#__PURE__*/React__default.default.createElement(Text.Text, {
|
|
1563
|
+
size: thumbNameTextSize,
|
|
1564
|
+
textColor: thumbNameTextColor,
|
|
1565
|
+
textWeight: thumbNameTextWeight,
|
|
1566
|
+
textWrap: thumbNameTextWrap
|
|
1567
|
+
}, fileErrorText || file.error)), showFilename && /*#__PURE__*/React__default.default.createElement("div", {
|
|
1568
|
+
className: "form-dropzone__thumb-name"
|
|
1569
|
+
}, /*#__PURE__*/React__default.default.createElement(Text.Text, {
|
|
1570
|
+
className: "form-dropzone__thumb-name-inner",
|
|
1571
|
+
size: thumbNameTextSize,
|
|
1572
|
+
textColor: thumbNameTextColor,
|
|
1573
|
+
textWeight: thumbNameTextWeight,
|
|
1574
|
+
textWrap: thumbNameTextWrap
|
|
1575
|
+
}, file.name)), fileIsLoading && /*#__PURE__*/React__default.default.createElement("div", {
|
|
1576
|
+
className: "form-dropzone__thumb-loader"
|
|
1577
|
+
}, /*#__PURE__*/React__default.default.createElement(Loader.Loader, {
|
|
1578
|
+
width: "fill",
|
|
1579
|
+
height: "fill"
|
|
1580
|
+
})), /*#__PURE__*/React__default.default.createElement("div", {
|
|
1581
|
+
className: clsx__default.default('form-dropzone__thumb-remove')
|
|
1582
|
+
}, /*#__PURE__*/React__default.default.createElement(Button.Button, {
|
|
1583
|
+
className: "form-dropzone__thumb-remove-text",
|
|
1584
|
+
appearance: removeThumbAppearance,
|
|
1585
|
+
label: removeThumbText || 'Удалить',
|
|
1586
|
+
labelTextWeight: removeThumbTextWeight,
|
|
1587
|
+
shape: removeThumbShape,
|
|
1588
|
+
onClick: function onClick(event) {
|
|
1589
|
+
return removeFile(event, index);
|
|
1590
|
+
}
|
|
1591
|
+
})));
|
|
1592
|
+
}), !filesList.length ? /*#__PURE__*/React__default.default.createElement("div", {
|
|
1272
1593
|
className: "form-dropzone__hint"
|
|
1273
1594
|
}, /*#__PURE__*/React__default.default.createElement(Text.Text, {
|
|
1274
1595
|
className: "form-dropzone__hint-title",
|
|
@@ -1305,67 +1626,101 @@ const FileInputDropzone = /*#__PURE__*/React__default.default.memo(function File
|
|
|
1305
1626
|
textWeight: errorMessageTextWeight
|
|
1306
1627
|
}, fileError)));
|
|
1307
1628
|
});
|
|
1308
|
-
|
|
1309
|
-
|
|
1310
|
-
const response = await axios__default.default({
|
|
1311
|
-
url: url,
|
|
1312
|
-
responseType: 'blob'
|
|
1313
|
-
});
|
|
1314
|
-
const blobObject = response.data;
|
|
1315
|
-
const dirtyFilename = response.headers['content-disposition']?.split('filename=')[1];
|
|
1316
|
-
// Remove double quotes
|
|
1317
|
-
let filename = dirtyFilename?.substring(1).slice(0, -1);
|
|
1318
|
-
if (!filename) {
|
|
1319
|
-
filename = url.split('/').at(-1);
|
|
1320
|
-
// const typeParts = blobObject.type.split('/')
|
|
1321
|
-
// const fileType = typeParts[typeParts.length - 1]
|
|
1322
|
-
// filename = `${new Date().getTime()}.${fileType}`
|
|
1323
|
-
}
|
|
1324
|
-
return new File([blobObject], filename, {
|
|
1325
|
-
type: blobObject.type
|
|
1326
|
-
});
|
|
1327
|
-
} catch (error) {
|
|
1328
|
-
console.log('error: ', error);
|
|
1329
|
-
return null;
|
|
1330
|
-
}
|
|
1629
|
+
function getFileByURL(_x3) {
|
|
1630
|
+
return _getFileByURL.apply(this, arguments);
|
|
1331
1631
|
}
|
|
1332
|
-
|
|
1333
|
-
|
|
1334
|
-
|
|
1335
|
-
|
|
1336
|
-
|
|
1337
|
-
|
|
1338
|
-
|
|
1339
|
-
|
|
1340
|
-
|
|
1341
|
-
|
|
1342
|
-
|
|
1343
|
-
|
|
1344
|
-
|
|
1345
|
-
|
|
1346
|
-
|
|
1347
|
-
|
|
1348
|
-
|
|
1632
|
+
function _getFileByURL() {
|
|
1633
|
+
_getFileByURL = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee3(url) {
|
|
1634
|
+
var _response$headers$con, response, blobObject, dirtyFilename, filename, _t;
|
|
1635
|
+
return _regenerator().w(function (_context3) {
|
|
1636
|
+
while (1) switch (_context3.p = _context3.n) {
|
|
1637
|
+
case 0:
|
|
1638
|
+
_context3.p = 0;
|
|
1639
|
+
_context3.n = 1;
|
|
1640
|
+
return axios__default.default({
|
|
1641
|
+
url: url,
|
|
1642
|
+
responseType: 'blob'
|
|
1643
|
+
});
|
|
1644
|
+
case 1:
|
|
1645
|
+
response = _context3.v;
|
|
1646
|
+
blobObject = response.data;
|
|
1647
|
+
dirtyFilename = (_response$headers$con = response.headers['content-disposition']) == null ? void 0 : _response$headers$con.split('filename=')[1]; // Remove double quotes
|
|
1648
|
+
filename = dirtyFilename == null ? void 0 : dirtyFilename.substring(1).slice(0, -1);
|
|
1649
|
+
if (!filename) {
|
|
1650
|
+
filename = url.split('/').at(-1);
|
|
1651
|
+
// const typeParts = blobObject.type.split('/')
|
|
1652
|
+
// const fileType = typeParts[typeParts.length - 1]
|
|
1653
|
+
// filename = `${new Date().getTime()}.${fileType}`
|
|
1654
|
+
}
|
|
1655
|
+
return _context3.a(2, new File([blobObject], filename, {
|
|
1656
|
+
type: blobObject.type
|
|
1657
|
+
}));
|
|
1658
|
+
case 2:
|
|
1659
|
+
_context3.p = 2;
|
|
1660
|
+
_t = _context3.v;
|
|
1661
|
+
console.log('error: ', _t);
|
|
1662
|
+
return _context3.a(2, null);
|
|
1663
|
+
}
|
|
1664
|
+
}, _callee3, null, [[0, 2]]);
|
|
1665
|
+
}));
|
|
1666
|
+
return _getFileByURL.apply(this, arguments);
|
|
1667
|
+
}
|
|
1668
|
+
function convertToFile(_x4, _x5) {
|
|
1669
|
+
return _convertToFile.apply(this, arguments);
|
|
1670
|
+
}
|
|
1671
|
+
function _convertToFile() {
|
|
1672
|
+
_convertToFile = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee4(inputValue, isPreviews) {
|
|
1673
|
+
var newFile, isURL;
|
|
1674
|
+
return _regenerator().w(function (_context4) {
|
|
1675
|
+
while (1) switch (_context4.n) {
|
|
1676
|
+
case 0:
|
|
1677
|
+
newFile = null; // Download image by url and save as File instance
|
|
1678
|
+
isURL = typeof inputValue === 'string' && inputValue.includes('/');
|
|
1679
|
+
if (!(inputValue.image || isURL)) {
|
|
1680
|
+
_context4.n = 2;
|
|
1681
|
+
break;
|
|
1682
|
+
}
|
|
1683
|
+
_context4.n = 1;
|
|
1684
|
+
return getFileByURL(inputValue.image || inputValue);
|
|
1685
|
+
case 1:
|
|
1686
|
+
newFile = _context4.v;
|
|
1687
|
+
if (newFile) {
|
|
1688
|
+
setFileDataURL(newFile);
|
|
1689
|
+
}
|
|
1690
|
+
case 2:
|
|
1691
|
+
// Convert dataURL to File instance
|
|
1692
|
+
if (inputValue.dataURL) {
|
|
1693
|
+
newFile = common.createFileFromDataURL(inputValue.name || inputValue.path, inputValue.dataURL);
|
|
1694
|
+
newFile.dataURL = inputValue.dataURL;
|
|
1695
|
+
}
|
|
1349
1696
|
|
|
1350
|
-
|
|
1351
|
-
|
|
1352
|
-
|
|
1353
|
-
|
|
1354
|
-
|
|
1355
|
-
|
|
1356
|
-
|
|
1357
|
-
|
|
1697
|
+
// Save new File to state
|
|
1698
|
+
if (newFile) {
|
|
1699
|
+
newFile.id = inputValue.id;
|
|
1700
|
+
if (isPreviews) {
|
|
1701
|
+
newFile.preview = URL.createObjectURL(newFile);
|
|
1702
|
+
}
|
|
1703
|
+
}
|
|
1704
|
+
return _context4.a(2, newFile);
|
|
1705
|
+
}
|
|
1706
|
+
}, _callee4);
|
|
1707
|
+
}));
|
|
1708
|
+
return _convertToFile.apply(this, arguments);
|
|
1358
1709
|
}
|
|
1359
1710
|
function setFileDataURL(file, resolve) {
|
|
1360
|
-
resolve = resolve || (
|
|
1711
|
+
resolve = resolve || function () {};
|
|
1361
1712
|
// Init reader and save his file
|
|
1362
|
-
|
|
1713
|
+
var reader = new FileReader();
|
|
1363
1714
|
reader._readedFile = file;
|
|
1364
1715
|
|
|
1365
1716
|
// Set handlers
|
|
1366
|
-
reader.onabort = ()
|
|
1367
|
-
|
|
1368
|
-
|
|
1717
|
+
reader.onabort = function () {
|
|
1718
|
+
return resolve();
|
|
1719
|
+
};
|
|
1720
|
+
reader.onerror = function () {
|
|
1721
|
+
return resolve();
|
|
1722
|
+
};
|
|
1723
|
+
reader.onload = function (event) {
|
|
1369
1724
|
event.target._readedFile.dataURL = reader.result;
|
|
1370
1725
|
resolve();
|
|
1371
1726
|
};
|
|
@@ -1377,70 +1732,67 @@ function setFileDataURL(file, resolve) {
|
|
|
1377
1732
|
}
|
|
1378
1733
|
}
|
|
1379
1734
|
|
|
1380
|
-
|
|
1381
|
-
|
|
1382
|
-
|
|
1383
|
-
|
|
1384
|
-
|
|
1385
|
-
|
|
1386
|
-
|
|
1387
|
-
|
|
1388
|
-
|
|
1389
|
-
|
|
1390
|
-
|
|
1391
|
-
|
|
1392
|
-
|
|
1393
|
-
|
|
1394
|
-
|
|
1395
|
-
|
|
1396
|
-
|
|
1397
|
-
|
|
1398
|
-
|
|
1399
|
-
|
|
1400
|
-
|
|
1401
|
-
|
|
1402
|
-
|
|
1403
|
-
|
|
1404
|
-
|
|
1405
|
-
|
|
1406
|
-
|
|
1407
|
-
|
|
1408
|
-
|
|
1409
|
-
|
|
1410
|
-
|
|
1411
|
-
|
|
1412
|
-
|
|
1413
|
-
|
|
1414
|
-
|
|
1415
|
-
|
|
1416
|
-
|
|
1417
|
-
|
|
1418
|
-
|
|
1419
|
-
|
|
1420
|
-
|
|
1421
|
-
|
|
1422
|
-
|
|
1423
|
-
|
|
1424
|
-
|
|
1425
|
-
|
|
1426
|
-
|
|
1427
|
-
|
|
1428
|
-
|
|
1429
|
-
|
|
1430
|
-
|
|
1431
|
-
|
|
1432
|
-
|
|
1433
|
-
|
|
1434
|
-
|
|
1435
|
-
|
|
1436
|
-
thumbNameTextWrap
|
|
1437
|
-
} = propsGenerator;
|
|
1735
|
+
var FormFieldFileInput = /*#__PURE__*/React__default.default.memo(function FormFieldFileInput(props) {
|
|
1736
|
+
var className = props.className,
|
|
1737
|
+
name = props.name,
|
|
1738
|
+
width = props.width,
|
|
1739
|
+
maxFiles = props.maxFiles,
|
|
1740
|
+
maxSize = props.maxSize,
|
|
1741
|
+
label = props.label,
|
|
1742
|
+
fileErrorText = props.fileErrorText,
|
|
1743
|
+
classNameGroupItem = props.classNameGroupItem,
|
|
1744
|
+
dropzoneProps = props.dropzoneProps,
|
|
1745
|
+
fieldProps = props.fieldProps,
|
|
1746
|
+
hintDescription = props.hintDescription,
|
|
1747
|
+
hintTitle = props.hintTitle,
|
|
1748
|
+
showFilename = props.showFilename,
|
|
1749
|
+
showMessage = props.showMessage,
|
|
1750
|
+
isPreviews = props.isPreviews,
|
|
1751
|
+
isRequired = props.isRequired,
|
|
1752
|
+
onAddFiles = props.onAddFiles,
|
|
1753
|
+
onClickPreview = props.onClickPreview,
|
|
1754
|
+
onDeleteFile = props.onDeleteFile;
|
|
1755
|
+
var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
|
|
1756
|
+
var size = propsGenerator.size,
|
|
1757
|
+
fill = propsGenerator.fill,
|
|
1758
|
+
fillHover = propsGenerator.fillHover,
|
|
1759
|
+
labelTextColor = propsGenerator.labelTextColor,
|
|
1760
|
+
borderColorHover = propsGenerator.borderColorHover,
|
|
1761
|
+
borderType = propsGenerator.borderType,
|
|
1762
|
+
borderWidth = propsGenerator.borderWidth,
|
|
1763
|
+
errorMessageTextColor = propsGenerator.errorMessageTextColor,
|
|
1764
|
+
errorMessageTextSize = propsGenerator.errorMessageTextSize,
|
|
1765
|
+
errorMessageTextWeight = propsGenerator.errorMessageTextWeight,
|
|
1766
|
+
hintDescriptionTextColor = propsGenerator.hintDescriptionTextColor,
|
|
1767
|
+
hintDescriptionTextSize = propsGenerator.hintDescriptionTextSize,
|
|
1768
|
+
hintDescriptionTextWeight = propsGenerator.hintDescriptionTextWeight,
|
|
1769
|
+
hintDescriptionTextWrap = propsGenerator.hintDescriptionTextWrap,
|
|
1770
|
+
hintTitleTextColor = propsGenerator.hintTitleTextColor,
|
|
1771
|
+
hintTitleTextSize = propsGenerator.hintTitleTextSize,
|
|
1772
|
+
hintTitleTextWeight = propsGenerator.hintTitleTextWeight,
|
|
1773
|
+
hintTitleTextWrap = propsGenerator.hintTitleTextWrap,
|
|
1774
|
+
removeThumbAppearance = propsGenerator.removeThumbAppearance,
|
|
1775
|
+
removeThumbShape = propsGenerator.removeThumbShape,
|
|
1776
|
+
removeThumbText = propsGenerator.removeThumbText,
|
|
1777
|
+
removeThumbTextWeight = propsGenerator.removeThumbTextWeight,
|
|
1778
|
+
shape = propsGenerator.shape,
|
|
1779
|
+
thumbBorderColor = propsGenerator.thumbBorderColor,
|
|
1780
|
+
thumbBorderColorHover = propsGenerator.thumbBorderColorHover,
|
|
1781
|
+
thumbBorderType = propsGenerator.thumbBorderType,
|
|
1782
|
+
thumbBorderWidth = propsGenerator.thumbBorderWidth,
|
|
1783
|
+
_propsGenerator$thumb = propsGenerator.thumbColumn,
|
|
1784
|
+
thumbColumn = _propsGenerator$thumb === void 0 ? 1 : _propsGenerator$thumb,
|
|
1785
|
+
_propsGenerator$thumb2 = propsGenerator.thumbDirection,
|
|
1786
|
+
thumbDirection = _propsGenerator$thumb2 === void 0 ? 'vertical' : _propsGenerator$thumb2,
|
|
1787
|
+
thumbNameTextColor = propsGenerator.thumbNameTextColor,
|
|
1788
|
+
thumbNameTextSize = propsGenerator.thumbNameTextSize,
|
|
1789
|
+
thumbNameTextWeight = propsGenerator.thumbNameTextWeight,
|
|
1790
|
+
thumbNameTextWrap = propsGenerator.thumbNameTextWrap;
|
|
1438
1791
|
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
1439
1792
|
name: name
|
|
1440
|
-
}, function Render({
|
|
1441
|
-
input,
|
|
1442
|
-
|
|
1443
|
-
}) {
|
|
1793
|
+
}, function Render(_ref) {
|
|
1794
|
+
var input = _ref.input,
|
|
1795
|
+
meta = _ref.meta;
|
|
1444
1796
|
/** Note:
|
|
1445
1797
|
* Create "Render" function by "eslint-react-hooks/rules-of-hooks":
|
|
1446
1798
|
* React Hooks cannot be called inside a callback.
|
|
@@ -1448,17 +1800,16 @@ const FormFieldFileInput = /*#__PURE__*/React__default.default.memo(function For
|
|
|
1448
1800
|
* custom React Hook function.
|
|
1449
1801
|
*/
|
|
1450
1802
|
|
|
1451
|
-
|
|
1452
|
-
|
|
1453
|
-
|
|
1454
|
-
|
|
1455
|
-
|
|
1456
|
-
|
|
1457
|
-
|
|
1458
|
-
|
|
1459
|
-
|
|
1460
|
-
|
|
1461
|
-
const updatedInputProps = useValidationAppearanceInputProps({
|
|
1803
|
+
var _useFieldValidationSt = useFieldValidationState({
|
|
1804
|
+
fieldProps: fieldProps,
|
|
1805
|
+
input: input,
|
|
1806
|
+
meta: meta
|
|
1807
|
+
}),
|
|
1808
|
+
errorKey = _useFieldValidationSt.errorKey,
|
|
1809
|
+
errorMessage = _useFieldValidationSt.errorMessage,
|
|
1810
|
+
isErrorState = _useFieldValidationSt.isErrorState,
|
|
1811
|
+
isValidState = _useFieldValidationSt.isValidState;
|
|
1812
|
+
var updatedInputProps = useValidationAppearanceInputProps({
|
|
1462
1813
|
inputProps: props,
|
|
1463
1814
|
validationStateKey: isErrorState ? errorKey : 'success'
|
|
1464
1815
|
});
|
|
@@ -1537,7 +1888,7 @@ const FormFieldFileInput = /*#__PURE__*/React__default.default.memo(function For
|
|
|
1537
1888
|
});
|
|
1538
1889
|
});
|
|
1539
1890
|
|
|
1540
|
-
|
|
1891
|
+
var defaultGroupProps = {
|
|
1541
1892
|
width: 'fill',
|
|
1542
1893
|
labelTextSize: 's',
|
|
1543
1894
|
messageTextColor: 'surfaceTextPrimary',
|
|
@@ -1549,63 +1900,58 @@ const defaultGroupProps = {
|
|
|
1549
1900
|
requiredMessageTextSize: 's'
|
|
1550
1901
|
};
|
|
1551
1902
|
|
|
1552
|
-
|
|
1553
|
-
|
|
1554
|
-
|
|
1555
|
-
|
|
1556
|
-
|
|
1557
|
-
|
|
1558
|
-
|
|
1559
|
-
|
|
1560
|
-
|
|
1561
|
-
|
|
1562
|
-
|
|
1563
|
-
|
|
1564
|
-
|
|
1565
|
-
|
|
1566
|
-
|
|
1567
|
-
|
|
1568
|
-
|
|
1569
|
-
|
|
1570
|
-
|
|
1571
|
-
|
|
1572
|
-
|
|
1573
|
-
|
|
1574
|
-
children
|
|
1575
|
-
} = props;
|
|
1903
|
+
var FormBlockGroup = /*#__PURE__*/React__default.default.memo(function Group(props) {
|
|
1904
|
+
var dataTour = props.dataTour,
|
|
1905
|
+
className = props.className,
|
|
1906
|
+
name = props.name,
|
|
1907
|
+
title = props.title,
|
|
1908
|
+
titleTextColor = props.titleTextColor,
|
|
1909
|
+
titleTextSize = props.titleTextSize,
|
|
1910
|
+
titleTextWeight = props.titleTextWeight,
|
|
1911
|
+
label = props.label,
|
|
1912
|
+
labelTextColor = props.labelTextColor,
|
|
1913
|
+
labelTextSize = props.labelTextSize,
|
|
1914
|
+
labelTextWeight = props.labelTextWeight,
|
|
1915
|
+
message = props.message,
|
|
1916
|
+
messageTextColor = props.messageTextColor,
|
|
1917
|
+
messageTextSize = props.messageTextSize,
|
|
1918
|
+
messageTextWeight = props.messageTextWeight,
|
|
1919
|
+
column = props.column,
|
|
1920
|
+
showGroupMessage = props.showGroupMessage,
|
|
1921
|
+
before = props.before,
|
|
1922
|
+
after = props.after,
|
|
1923
|
+
isHidden = props.isHidden,
|
|
1924
|
+
children = props.children;
|
|
1576
1925
|
|
|
1577
1926
|
// @ts-expect-error
|
|
1578
|
-
|
|
1579
|
-
styles
|
|
1580
|
-
} = useStyles.useStyles(props);
|
|
1927
|
+
var _useStyles = useStyles.useStyles(props),
|
|
1928
|
+
styles = _useStyles.styles;
|
|
1581
1929
|
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
1582
1930
|
name: name
|
|
1583
|
-
}, function Render({
|
|
1584
|
-
input,
|
|
1585
|
-
|
|
1586
|
-
}) {
|
|
1931
|
+
}, function Render(_ref) {
|
|
1932
|
+
var input = _ref.input,
|
|
1933
|
+
meta = _ref.meta;
|
|
1587
1934
|
/** Note:
|
|
1588
1935
|
* Create "Render" function by "eslint-react-hooks/rules-of-hooks":
|
|
1589
1936
|
* React Hooks cannot be called inside a callback.
|
|
1590
1937
|
* React Hooks must be called in a React function component or a
|
|
1591
1938
|
* custom React Hook function.
|
|
1592
1939
|
*/
|
|
1593
|
-
|
|
1594
|
-
|
|
1595
|
-
|
|
1596
|
-
|
|
1597
|
-
|
|
1598
|
-
|
|
1599
|
-
|
|
1600
|
-
|
|
1601
|
-
|
|
1602
|
-
|
|
1603
|
-
const updatedProps = useValidationAppearanceInputProps({
|
|
1940
|
+
var _useFieldValidationSt = useFieldValidationState({
|
|
1941
|
+
fieldProps: props,
|
|
1942
|
+
// or fieldProps?
|
|
1943
|
+
input: input,
|
|
1944
|
+
meta: meta
|
|
1945
|
+
}),
|
|
1946
|
+
errorKey = _useFieldValidationSt.errorKey,
|
|
1947
|
+
errorMessage = _useFieldValidationSt.errorMessage,
|
|
1948
|
+
isErrorState = _useFieldValidationSt.isErrorState;
|
|
1949
|
+
var updatedProps = useValidationAppearanceInputProps({
|
|
1604
1950
|
inputProps: props,
|
|
1605
1951
|
validationStateKey: isErrorState ? errorKey : 'success'
|
|
1606
1952
|
});
|
|
1607
1953
|
return /*#__PURE__*/React__default.default.createElement("div", {
|
|
1608
|
-
className: clsx__default.default('form__group', className, isHidden && 'form__group_hidden', column &&
|
|
1954
|
+
className: clsx__default.default('form__group', className, isHidden && 'form__group_hidden', column && "form__group_column_" + column),
|
|
1609
1955
|
"data-tour": dataTour,
|
|
1610
1956
|
style: styles
|
|
1611
1957
|
}, /*#__PURE__*/React__default.default.createElement("div", {
|
|
@@ -1625,8 +1971,8 @@ const FormBlockGroup = /*#__PURE__*/React__default.default.memo(function Group(p
|
|
|
1625
1971
|
}, label)), /*#__PURE__*/React__default.default.createElement("div", {
|
|
1626
1972
|
className: "form__group-items"
|
|
1627
1973
|
}, children), after), showGroupMessage && /*#__PURE__*/React__default.default.createElement(React__default.default.Fragment, null, isErrorState && errorMessage && /*#__PURE__*/React__default.default.createElement(Text.Text, {
|
|
1628
|
-
id:
|
|
1629
|
-
className:
|
|
1974
|
+
id: name + "-error",
|
|
1975
|
+
className: "form__group-message form__group-message_type-" + errorKey,
|
|
1630
1976
|
size: updatedProps.messageTextSize,
|
|
1631
1977
|
textColor: updatedProps.messageTextColor,
|
|
1632
1978
|
textWeight: updatedProps.messageTextWeight
|
|
@@ -1638,11 +1984,11 @@ const FormBlockGroup = /*#__PURE__*/React__default.default.memo(function Group(p
|
|
|
1638
1984
|
}, message), !isErrorState && !message && /*#__PURE__*/React__default.default.createElement(Text.Text, {
|
|
1639
1985
|
className: "form__group-message",
|
|
1640
1986
|
size: messageTextSize
|
|
1641
|
-
},
|
|
1987
|
+
}, "\xA0")));
|
|
1642
1988
|
});
|
|
1643
1989
|
});
|
|
1644
1990
|
|
|
1645
|
-
|
|
1991
|
+
var defaultInputProps = {
|
|
1646
1992
|
appearance: 'defaultPrimary sizeM solid rounded',
|
|
1647
1993
|
width: 'fill',
|
|
1648
1994
|
// useValidationAppearanceInputProps
|
|
@@ -1654,33 +2000,32 @@ const defaultInputProps = {
|
|
|
1654
2000
|
successAppearance: 'successPrimary sizeM solid rounded'
|
|
1655
2001
|
};
|
|
1656
2002
|
|
|
1657
|
-
|
|
1658
|
-
|
|
1659
|
-
|
|
1660
|
-
|
|
1661
|
-
|
|
1662
|
-
|
|
1663
|
-
|
|
1664
|
-
|
|
1665
|
-
|
|
1666
|
-
|
|
1667
|
-
fieldProps = {},
|
|
1668
|
-
inputProps =
|
|
1669
|
-
|
|
1670
|
-
|
|
1671
|
-
|
|
1672
|
-
|
|
1673
|
-
|
|
1674
|
-
|
|
1675
|
-
|
|
2003
|
+
var FormFieldInput = /*#__PURE__*/React__default.default.memo(function FormFieldInput(props) {
|
|
2004
|
+
var name = props.name,
|
|
2005
|
+
initialValue = props.initialValue,
|
|
2006
|
+
classNameGroupItem = props.classNameGroupItem,
|
|
2007
|
+
clearIcon = props.clearIcon,
|
|
2008
|
+
clearIconFill = props.clearIconFill,
|
|
2009
|
+
clearIconFillHover = props.clearIconFillHover,
|
|
2010
|
+
clearIconShape = props.clearIconShape,
|
|
2011
|
+
clearIconSize = props.clearIconSize,
|
|
2012
|
+
_props$fieldProps = props.fieldProps,
|
|
2013
|
+
fieldProps = _props$fieldProps === void 0 ? {} : _props$fieldProps,
|
|
2014
|
+
_props$inputProps = props.inputProps,
|
|
2015
|
+
inputProps = _props$inputProps === void 0 ? {} : _props$inputProps,
|
|
2016
|
+
parse = props.parse,
|
|
2017
|
+
showMessage = props.showMessage,
|
|
2018
|
+
isDisabled = props.isDisabled,
|
|
2019
|
+
isRequired = props.isRequired,
|
|
2020
|
+
onClickClearIcon = props.onClickClearIcon,
|
|
2021
|
+
onChange = props.onChange;
|
|
1676
2022
|
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
1677
2023
|
name: name,
|
|
1678
2024
|
initialValue: initialValue,
|
|
1679
2025
|
parse: parse
|
|
1680
|
-
}, function Render({
|
|
1681
|
-
input,
|
|
1682
|
-
|
|
1683
|
-
}) {
|
|
2026
|
+
}, function Render(_ref) {
|
|
2027
|
+
var input = _ref.input,
|
|
2028
|
+
meta = _ref.meta;
|
|
1684
2029
|
/** Note:
|
|
1685
2030
|
* Create "Render" function by "eslint-react-hooks/rules-of-hooks":
|
|
1686
2031
|
* React Hooks cannot be called inside a callback.
|
|
@@ -1688,24 +2033,23 @@ const FormFieldInput = /*#__PURE__*/React__default.default.memo(function FormFie
|
|
|
1688
2033
|
* custom React Hook function.
|
|
1689
2034
|
*/
|
|
1690
2035
|
|
|
1691
|
-
|
|
2036
|
+
var onChangeField = React.useCallback(function (event) {
|
|
1692
2037
|
input.onChange(event);
|
|
1693
2038
|
if (onChange) {
|
|
1694
2039
|
onChange(event.target.value, input.name);
|
|
1695
2040
|
}
|
|
1696
2041
|
}, [onChange, input.onChange]);
|
|
1697
|
-
|
|
1698
|
-
|
|
1699
|
-
|
|
1700
|
-
|
|
1701
|
-
|
|
1702
|
-
|
|
1703
|
-
|
|
1704
|
-
|
|
1705
|
-
|
|
1706
|
-
|
|
1707
|
-
|
|
1708
|
-
const updatedInputProps = useValidationAppearanceInputProps({
|
|
2042
|
+
var _useFieldValidationSt = useFieldValidationState({
|
|
2043
|
+
fieldProps: fieldProps,
|
|
2044
|
+
input: input,
|
|
2045
|
+
meta: meta
|
|
2046
|
+
}),
|
|
2047
|
+
errorKey = _useFieldValidationSt.errorKey,
|
|
2048
|
+
errorMessage = _useFieldValidationSt.errorMessage,
|
|
2049
|
+
successKey = _useFieldValidationSt.successKey,
|
|
2050
|
+
isErrorState = _useFieldValidationSt.isErrorState,
|
|
2051
|
+
isValidState = _useFieldValidationSt.isValidState;
|
|
2052
|
+
var updatedInputProps = useValidationAppearanceInputProps({
|
|
1709
2053
|
inputProps: inputProps,
|
|
1710
2054
|
validationStateKey: isErrorState ? errorKey : isValidState ? successKey : null
|
|
1711
2055
|
});
|
|
@@ -1724,8 +2068,8 @@ const FormFieldInput = /*#__PURE__*/React__default.default.memo(function FormFie
|
|
|
1724
2068
|
isRequired: isRequired,
|
|
1725
2069
|
isValidState: isValidState
|
|
1726
2070
|
}, fieldProps), /*#__PURE__*/React__default.default.createElement(Input.Input, Object.assign({
|
|
1727
|
-
className: clsx__default.default(meta.active && 'input_state_focus', meta.error && meta.touched &&
|
|
1728
|
-
dataTestId:
|
|
2071
|
+
className: clsx__default.default(meta.active && 'input_state_focus', meta.error && meta.touched && "input_state_" + errorKey),
|
|
2072
|
+
dataTestId: input.name + "-field-input",
|
|
1729
2073
|
type: "text",
|
|
1730
2074
|
name: input.name,
|
|
1731
2075
|
autoComplete: "nope",
|
|
@@ -1747,32 +2091,101 @@ const FormFieldInput = /*#__PURE__*/React__default.default.memo(function FormFie
|
|
|
1747
2091
|
});
|
|
1748
2092
|
});
|
|
1749
2093
|
|
|
1750
|
-
|
|
1751
|
-
|
|
1752
|
-
|
|
1753
|
-
|
|
1754
|
-
|
|
1755
|
-
|
|
1756
|
-
|
|
1757
|
-
|
|
1758
|
-
|
|
1759
|
-
|
|
1760
|
-
|
|
1761
|
-
|
|
1762
|
-
|
|
1763
|
-
|
|
1764
|
-
|
|
1765
|
-
|
|
1766
|
-
|
|
1767
|
-
|
|
1768
|
-
|
|
2094
|
+
var defaultInputNumberProps = {
|
|
2095
|
+
appearance: 'surfaceSecondary sizeM solid rounded',
|
|
2096
|
+
width: 'fill'
|
|
2097
|
+
};
|
|
2098
|
+
|
|
2099
|
+
var FormFieldInputNumber = /*#__PURE__*/React__default.default.memo(function FormFieldInputNumber(props) {
|
|
2100
|
+
var _props$type = props.type,
|
|
2101
|
+
type = _props$type === void 0 ? 'custom' : _props$type,
|
|
2102
|
+
name = props.name,
|
|
2103
|
+
initialValue = props.initialValue,
|
|
2104
|
+
classNameGroupItem = props.classNameGroupItem,
|
|
2105
|
+
_props$fieldProps = props.fieldProps,
|
|
2106
|
+
fieldProps = _props$fieldProps === void 0 ? {} : _props$fieldProps,
|
|
2107
|
+
_props$inputProps = props.inputProps,
|
|
2108
|
+
inputProps = _props$inputProps === void 0 ? {} : _props$inputProps,
|
|
2109
|
+
parse = props.parse,
|
|
2110
|
+
showMessage = props.showMessage,
|
|
2111
|
+
isDisabled = props.isDisabled,
|
|
2112
|
+
isRequired = props.isRequired,
|
|
2113
|
+
onChange = props.onChange;
|
|
2114
|
+
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
2115
|
+
name: name,
|
|
2116
|
+
initialValue: initialValue,
|
|
2117
|
+
parse: parse
|
|
2118
|
+
}, function Render(_ref) {
|
|
2119
|
+
var input = _ref.input,
|
|
2120
|
+
meta = _ref.meta;
|
|
2121
|
+
var onChangeField = React.useCallback(function (event) {
|
|
2122
|
+
input.onChange(event);
|
|
2123
|
+
if (onChange) {
|
|
2124
|
+
onChange(event.target.value);
|
|
2125
|
+
}
|
|
2126
|
+
}, [onChange, input.onChange]);
|
|
2127
|
+
var _useFieldValidationSt = useFieldValidationState({
|
|
2128
|
+
fieldProps: fieldProps,
|
|
2129
|
+
input: input,
|
|
2130
|
+
meta: meta
|
|
2131
|
+
}),
|
|
2132
|
+
errorKey = _useFieldValidationSt.errorKey,
|
|
2133
|
+
errorMessage = _useFieldValidationSt.errorMessage,
|
|
2134
|
+
isErrorState = _useFieldValidationSt.isErrorState,
|
|
2135
|
+
isValidState = _useFieldValidationSt.isValidState;
|
|
2136
|
+
var updatedInputProps = useValidationAppearanceInputProps({
|
|
2137
|
+
inputProps: inputProps
|
|
2138
|
+
});
|
|
2139
|
+
return /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
|
|
2140
|
+
className: clsx__default.default('form-field_input-number', 'form__item_input-number', classNameGroupItem),
|
|
2141
|
+
errorKey: errorKey,
|
|
2142
|
+
errorMessage: errorMessage,
|
|
2143
|
+
fieldClassName: "form-input-number",
|
|
2144
|
+
inputName: input.name,
|
|
2145
|
+
inputValue: input.value || '',
|
|
2146
|
+
metaActive: meta.active,
|
|
2147
|
+
metaError: meta.error,
|
|
2148
|
+
showMessage: showMessage,
|
|
2149
|
+
isDisabled: isDisabled,
|
|
2150
|
+
isErrorState: isErrorState,
|
|
2151
|
+
isRequired: isRequired,
|
|
2152
|
+
isValidState: isValidState
|
|
2153
|
+
}, fieldProps), /*#__PURE__*/React__default.default.createElement(InputNumber.InputNumber, Object.assign({
|
|
2154
|
+
className: clsx__default.default(meta.active && 'input_state_focus', (meta.submitFailed || meta.touched) && meta.error && "input_state_" + errorKey),
|
|
2155
|
+
dataTestId: input.name + "FieldInputNumber",
|
|
2156
|
+
type: type,
|
|
2157
|
+
name: input.name,
|
|
2158
|
+
value: input.value || 0,
|
|
2159
|
+
onChange: onChangeField
|
|
2160
|
+
}, updatedInputProps)));
|
|
2161
|
+
});
|
|
2162
|
+
});
|
|
2163
|
+
|
|
2164
|
+
var FormFieldMaskedInput = /*#__PURE__*/React__default.default.memo(function FormFieldMaskedInput(props) {
|
|
2165
|
+
var name = props.name,
|
|
2166
|
+
initialValue = props.initialValue,
|
|
2167
|
+
classNameGroupItem = props.classNameGroupItem,
|
|
2168
|
+
clearIcon = props.clearIcon,
|
|
2169
|
+
clearIconFill = props.clearIconFill,
|
|
2170
|
+
clearIconFillHover = props.clearIconFillHover,
|
|
2171
|
+
clearIconShape = props.clearIconShape,
|
|
2172
|
+
clearIconSize = props.clearIconSize,
|
|
2173
|
+
_props$fieldProps = props.fieldProps,
|
|
2174
|
+
fieldProps = _props$fieldProps === void 0 ? {} : _props$fieldProps,
|
|
2175
|
+
_props$inputProps = props.inputProps,
|
|
2176
|
+
inputProps = _props$inputProps === void 0 ? {} : _props$inputProps,
|
|
2177
|
+
optionsMask = props.optionsMask,
|
|
2178
|
+
showMessage = props.showMessage,
|
|
2179
|
+
unmasked = props.unmasked,
|
|
2180
|
+
isDisabled = props.isDisabled,
|
|
2181
|
+
isRequired = props.isRequired,
|
|
2182
|
+
onClickClearIcon = props.onClickClearIcon;
|
|
1769
2183
|
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
1770
2184
|
name: name,
|
|
1771
2185
|
initialValue: initialValue
|
|
1772
|
-
}, function Render({
|
|
1773
|
-
input,
|
|
1774
|
-
|
|
1775
|
-
}) {
|
|
2186
|
+
}, function Render(_ref) {
|
|
2187
|
+
var input = _ref.input,
|
|
2188
|
+
meta = _ref.meta;
|
|
1776
2189
|
/** Note:
|
|
1777
2190
|
* Create "Render" function by "eslint-react-hooks/rules-of-hooks":
|
|
1778
2191
|
* React Hooks cannot be called inside a callback.
|
|
@@ -1780,36 +2193,34 @@ const FormFieldMaskedInput = /*#__PURE__*/React__default.default.memo(function F
|
|
|
1780
2193
|
* custom React Hook function.
|
|
1781
2194
|
*/
|
|
1782
2195
|
|
|
1783
|
-
|
|
1784
|
-
|
|
1785
|
-
|
|
1786
|
-
|
|
1787
|
-
|
|
1788
|
-
|
|
1789
|
-
defaultValue: initialValue,
|
|
1790
|
-
onAccept: (_newValue, event, element) => {
|
|
1791
|
-
if (element) {
|
|
1792
|
-
input.onChange(event._unmaskedValue);
|
|
2196
|
+
var _useIMask = reactImask.useIMask(optionsMask, {
|
|
2197
|
+
defaultValue: initialValue,
|
|
2198
|
+
onAccept: function onAccept(_newValue, event, element) {
|
|
2199
|
+
if (element) {
|
|
2200
|
+
input.onChange(event._unmaskedValue);
|
|
2201
|
+
}
|
|
1793
2202
|
}
|
|
1794
|
-
}
|
|
1795
|
-
|
|
1796
|
-
|
|
2203
|
+
}),
|
|
2204
|
+
ref = _useIMask.ref,
|
|
2205
|
+
unmaskedValue = _useIMask.unmaskedValue,
|
|
2206
|
+
value = _useIMask.value,
|
|
2207
|
+
setUnmaskedValue = _useIMask.setUnmaskedValue;
|
|
2208
|
+
React.useEffect(function () {
|
|
1797
2209
|
if (input.value !== unmaskedValue) {
|
|
1798
2210
|
setUnmaskedValue(input.value.replace(unmasked, ''));
|
|
1799
2211
|
}
|
|
1800
2212
|
}, [input.value]);
|
|
1801
|
-
|
|
1802
|
-
|
|
1803
|
-
|
|
1804
|
-
|
|
1805
|
-
|
|
1806
|
-
|
|
1807
|
-
|
|
1808
|
-
|
|
1809
|
-
|
|
1810
|
-
|
|
1811
|
-
|
|
1812
|
-
const updatedInputProps = useValidationAppearanceInputProps({
|
|
2213
|
+
var _useFieldValidationSt = useFieldValidationState({
|
|
2214
|
+
fieldProps: fieldProps,
|
|
2215
|
+
input: input,
|
|
2216
|
+
meta: meta
|
|
2217
|
+
}),
|
|
2218
|
+
errorKey = _useFieldValidationSt.errorKey,
|
|
2219
|
+
errorMessage = _useFieldValidationSt.errorMessage,
|
|
2220
|
+
successKey = _useFieldValidationSt.successKey,
|
|
2221
|
+
isErrorState = _useFieldValidationSt.isErrorState,
|
|
2222
|
+
isValidState = _useFieldValidationSt.isValidState;
|
|
2223
|
+
var updatedInputProps = useValidationAppearanceInputProps({
|
|
1813
2224
|
inputProps: inputProps,
|
|
1814
2225
|
validationStateKey: isErrorState ? errorKey : isValidState ? successKey : null
|
|
1815
2226
|
});
|
|
@@ -1828,7 +2239,7 @@ const FormFieldMaskedInput = /*#__PURE__*/React__default.default.memo(function F
|
|
|
1828
2239
|
isRequired: isRequired,
|
|
1829
2240
|
isValidState: isValidState
|
|
1830
2241
|
}, fieldProps), /*#__PURE__*/React__default.default.createElement(Input.Input, Object.assign({
|
|
1831
|
-
className: clsx__default.default(meta.active && 'input_state_focus', meta.error && meta.touched &&
|
|
2242
|
+
className: clsx__default.default(meta.active && 'input_state_focus', meta.error && meta.touched && "input_state_" + errorKey),
|
|
1832
2243
|
ref: ref,
|
|
1833
2244
|
value: value,
|
|
1834
2245
|
onBlur: input.onBlur,
|
|
@@ -1846,7 +2257,7 @@ const FormFieldMaskedInput = /*#__PURE__*/React__default.default.memo(function F
|
|
|
1846
2257
|
});
|
|
1847
2258
|
});
|
|
1848
2259
|
|
|
1849
|
-
|
|
2260
|
+
var defaultPasswordProps = {
|
|
1850
2261
|
appearance: 'defaultPrimary sizeM solid rounded',
|
|
1851
2262
|
// useValidationAppearanceInputProps
|
|
1852
2263
|
// Error
|
|
@@ -1857,27 +2268,24 @@ const defaultPasswordProps = {
|
|
|
1857
2268
|
successAppearance: 'successPrimary sizeM solid rounded'
|
|
1858
2269
|
};
|
|
1859
2270
|
|
|
1860
|
-
|
|
1861
|
-
|
|
1862
|
-
|
|
1863
|
-
|
|
1864
|
-
|
|
1865
|
-
|
|
1866
|
-
|
|
1867
|
-
|
|
1868
|
-
|
|
1869
|
-
|
|
1870
|
-
|
|
1871
|
-
onChange
|
|
1872
|
-
} = props;
|
|
2271
|
+
var FormFieldPassword = /*#__PURE__*/React__default.default.memo(function FormFieldPassword(props) {
|
|
2272
|
+
var name = props.name,
|
|
2273
|
+
initialValue = props.initialValue,
|
|
2274
|
+
classNameGroupItem = props.classNameGroupItem,
|
|
2275
|
+
fieldProps = props.fieldProps,
|
|
2276
|
+
inputProps = props.inputProps,
|
|
2277
|
+
parse = props.parse,
|
|
2278
|
+
showMessage = props.showMessage,
|
|
2279
|
+
isDisabled = props.isDisabled,
|
|
2280
|
+
isRequired = props.isRequired,
|
|
2281
|
+
onChange = props.onChange;
|
|
1873
2282
|
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
1874
2283
|
name: name,
|
|
1875
2284
|
initialValue: initialValue,
|
|
1876
2285
|
parse: parse
|
|
1877
|
-
}, function Render({
|
|
1878
|
-
input,
|
|
1879
|
-
|
|
1880
|
-
}) {
|
|
2286
|
+
}, function Render(_ref) {
|
|
2287
|
+
var input = _ref.input,
|
|
2288
|
+
meta = _ref.meta;
|
|
1881
2289
|
/** Note:
|
|
1882
2290
|
* Create "Render" function by "eslint-react-hooks/rules-of-hooks":
|
|
1883
2291
|
* React Hooks cannot be called inside a callback.
|
|
@@ -1885,24 +2293,23 @@ const FormFieldPassword = /*#__PURE__*/React__default.default.memo(function Form
|
|
|
1885
2293
|
* custom React Hook function.
|
|
1886
2294
|
*/
|
|
1887
2295
|
|
|
1888
|
-
|
|
2296
|
+
var onChangeField = React.useCallback(function (event) {
|
|
1889
2297
|
input.onChange(event);
|
|
1890
2298
|
if (onChange) {
|
|
1891
2299
|
onChange(event.target.value, input.name);
|
|
1892
2300
|
}
|
|
1893
2301
|
}, [onChange, input.onChange]);
|
|
1894
|
-
|
|
1895
|
-
|
|
1896
|
-
|
|
1897
|
-
|
|
1898
|
-
|
|
1899
|
-
|
|
1900
|
-
|
|
1901
|
-
|
|
1902
|
-
|
|
1903
|
-
|
|
1904
|
-
|
|
1905
|
-
const updatedInputProps = useValidationAppearanceInputProps({
|
|
2302
|
+
var _useFieldValidationSt = useFieldValidationState({
|
|
2303
|
+
fieldProps: fieldProps,
|
|
2304
|
+
input: input,
|
|
2305
|
+
meta: meta
|
|
2306
|
+
}),
|
|
2307
|
+
errorKey = _useFieldValidationSt.errorKey,
|
|
2308
|
+
errorMessage = _useFieldValidationSt.errorMessage,
|
|
2309
|
+
successKey = _useFieldValidationSt.successKey,
|
|
2310
|
+
isErrorState = _useFieldValidationSt.isErrorState,
|
|
2311
|
+
isValidState = _useFieldValidationSt.isValidState;
|
|
2312
|
+
var updatedInputProps = useValidationAppearanceInputProps({
|
|
1906
2313
|
inputProps: inputProps,
|
|
1907
2314
|
validationStateKey: isErrorState ? errorKey : isValidState ? successKey : null
|
|
1908
2315
|
});
|
|
@@ -1921,8 +2328,8 @@ const FormFieldPassword = /*#__PURE__*/React__default.default.memo(function Form
|
|
|
1921
2328
|
isRequired: isRequired,
|
|
1922
2329
|
isValidState: isValidState
|
|
1923
2330
|
}, fieldProps), /*#__PURE__*/React__default.default.createElement(InputPassword.InputPassword, Object.assign({
|
|
1924
|
-
className: clsx__default.default(meta.active && 'input-password_state_focus', meta.error && meta.touched &&
|
|
1925
|
-
dataTestId:
|
|
2331
|
+
className: clsx__default.default(meta.active && 'input-password_state_focus', meta.error && meta.touched && "input-password_state_" + errorKey),
|
|
2332
|
+
dataTestId: input.name + "-field-input-password",
|
|
1926
2333
|
name: input.name,
|
|
1927
2334
|
autoComplete: "nope",
|
|
1928
2335
|
value: input.value || '',
|
|
@@ -1934,20 +2341,18 @@ const FormFieldPassword = /*#__PURE__*/React__default.default.memo(function Form
|
|
|
1934
2341
|
});
|
|
1935
2342
|
});
|
|
1936
2343
|
|
|
1937
|
-
|
|
2344
|
+
var defaultRadioProps = {
|
|
1938
2345
|
appearance: 'defaultPrimary sizeM solid circular'
|
|
1939
2346
|
};
|
|
1940
2347
|
|
|
1941
2348
|
function FormFieldRadioGroupList(props) {
|
|
1942
|
-
|
|
1943
|
-
|
|
1944
|
-
|
|
1945
|
-
|
|
1946
|
-
onChange
|
|
1947
|
-
} = props;
|
|
2349
|
+
var input = props.input,
|
|
2350
|
+
inputProps = props.inputProps,
|
|
2351
|
+
options = props.options,
|
|
2352
|
+
onChange = props.onChange;
|
|
1948
2353
|
|
|
1949
2354
|
// Callback for value changes
|
|
1950
|
-
|
|
2355
|
+
var onChangeSomeInput = React.useCallback(function (value) {
|
|
1951
2356
|
// Save to form values
|
|
1952
2357
|
input.onChange(value);
|
|
1953
2358
|
if (onChange) {
|
|
@@ -1957,44 +2362,47 @@ function FormFieldRadioGroupList(props) {
|
|
|
1957
2362
|
}, [input, onChange]);
|
|
1958
2363
|
|
|
1959
2364
|
// Handle for radio inputs
|
|
1960
|
-
|
|
2365
|
+
var onChangeRadio = React.useCallback(function (event) {
|
|
1961
2366
|
if (event.target.checked) {
|
|
1962
2367
|
onChangeSomeInput(event.target.value);
|
|
1963
2368
|
}
|
|
1964
2369
|
}, [onChange]);
|
|
1965
|
-
return /*#__PURE__*/React__default.default.createElement(React__default.default.Fragment, null, options.map(
|
|
1966
|
-
|
|
1967
|
-
|
|
1968
|
-
|
|
1969
|
-
|
|
1970
|
-
|
|
1971
|
-
|
|
1972
|
-
|
|
1973
|
-
|
|
1974
|
-
|
|
1975
|
-
|
|
1976
|
-
|
|
2370
|
+
return /*#__PURE__*/React__default.default.createElement(React__default.default.Fragment, null, options.map(function (option) {
|
|
2371
|
+
return /*#__PURE__*/React__default.default.createElement(Radio.Radio, Object.assign({
|
|
2372
|
+
className: "form-radio__item",
|
|
2373
|
+
key: option.value,
|
|
2374
|
+
type: "radio",
|
|
2375
|
+
name: input.name,
|
|
2376
|
+
label: option.label,
|
|
2377
|
+
checked: option.value === input.value,
|
|
2378
|
+
value: option.value,
|
|
2379
|
+
onBlur: input.onBlur,
|
|
2380
|
+
onChange: onChangeRadio,
|
|
2381
|
+
onFocus: input.onFocus
|
|
2382
|
+
}, inputProps));
|
|
2383
|
+
}));
|
|
1977
2384
|
}
|
|
1978
2385
|
|
|
1979
|
-
|
|
1980
|
-
|
|
1981
|
-
|
|
1982
|
-
|
|
1983
|
-
editableProps = {},
|
|
1984
|
-
fieldProps =
|
|
1985
|
-
|
|
1986
|
-
|
|
1987
|
-
|
|
1988
|
-
|
|
1989
|
-
|
|
1990
|
-
|
|
1991
|
-
|
|
2386
|
+
var FormFieldRadioGroup = /*#__PURE__*/React__default.default.memo(function FormFieldRadioGroup(props) {
|
|
2387
|
+
var name = props.name,
|
|
2388
|
+
isDisabled = props.isDisabled,
|
|
2389
|
+
_props$editableProps = props.editableProps,
|
|
2390
|
+
editableProps = _props$editableProps === void 0 ? {} : _props$editableProps,
|
|
2391
|
+
_props$fieldProps = props.fieldProps,
|
|
2392
|
+
fieldProps = _props$fieldProps === void 0 ? {} : _props$fieldProps,
|
|
2393
|
+
_props$inputProps = props.inputProps,
|
|
2394
|
+
inputProps = _props$inputProps === void 0 ? {} : _props$inputProps,
|
|
2395
|
+
_props$options = props.options,
|
|
2396
|
+
options = _props$options === void 0 ? [] : _props$options,
|
|
2397
|
+
classNameGroupItem = props.classNameGroupItem,
|
|
2398
|
+
showMessage = props.showMessage,
|
|
2399
|
+
isRequired = props.isRequired,
|
|
2400
|
+
onChange = props.onChange;
|
|
1992
2401
|
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
1993
2402
|
name: name
|
|
1994
|
-
}, function Render({
|
|
1995
|
-
input,
|
|
1996
|
-
|
|
1997
|
-
}) {
|
|
2403
|
+
}, function Render(_ref) {
|
|
2404
|
+
var input = _ref.input,
|
|
2405
|
+
meta = _ref.meta;
|
|
1998
2406
|
/** Note:
|
|
1999
2407
|
* Create "Render" function by "eslint-react-hooks/rules-of-hooks":
|
|
2000
2408
|
* React Hooks cannot be called inside a callback.
|
|
@@ -2002,17 +2410,16 @@ const FormFieldRadioGroup = /*#__PURE__*/React__default.default.memo(function Fo
|
|
|
2002
2410
|
* custom React Hook function.
|
|
2003
2411
|
*/
|
|
2004
2412
|
|
|
2005
|
-
|
|
2006
|
-
|
|
2007
|
-
|
|
2008
|
-
|
|
2009
|
-
|
|
2010
|
-
|
|
2011
|
-
|
|
2012
|
-
|
|
2013
|
-
|
|
2014
|
-
|
|
2015
|
-
const updatedInputProps = useValidationAppearanceInputProps({
|
|
2413
|
+
var _useFieldValidationSt = useFieldValidationState({
|
|
2414
|
+
fieldProps: fieldProps,
|
|
2415
|
+
input: input,
|
|
2416
|
+
meta: meta
|
|
2417
|
+
}),
|
|
2418
|
+
errorKey = _useFieldValidationSt.errorKey,
|
|
2419
|
+
errorMessage = _useFieldValidationSt.errorMessage,
|
|
2420
|
+
isErrorState = _useFieldValidationSt.isErrorState,
|
|
2421
|
+
isValidState = _useFieldValidationSt.isValidState;
|
|
2422
|
+
var updatedInputProps = useValidationAppearanceInputProps({
|
|
2016
2423
|
inputProps: inputProps,
|
|
2017
2424
|
validationStateKey: isErrorState ? errorKey : 'success'
|
|
2018
2425
|
});
|
|
@@ -2041,7 +2448,7 @@ const FormFieldRadioGroup = /*#__PURE__*/React__default.default.memo(function Fo
|
|
|
2041
2448
|
});
|
|
2042
2449
|
});
|
|
2043
2450
|
|
|
2044
|
-
|
|
2451
|
+
var defaultSegmentedProps = {
|
|
2045
2452
|
appearance: 'defaultPrimary sizeM solid rounded',
|
|
2046
2453
|
width: 'fill',
|
|
2047
2454
|
// useValidationAppearanceInputProps
|
|
@@ -2052,27 +2459,23 @@ const defaultSegmentedProps = {
|
|
|
2052
2459
|
};
|
|
2053
2460
|
|
|
2054
2461
|
function FormFieldSegmented(props) {
|
|
2055
|
-
|
|
2056
|
-
|
|
2057
|
-
|
|
2058
|
-
|
|
2059
|
-
|
|
2060
|
-
|
|
2061
|
-
|
|
2062
|
-
|
|
2063
|
-
|
|
2064
|
-
|
|
2065
|
-
change
|
|
2066
|
-
} = reactFinalForm.useForm();
|
|
2067
|
-
const setActiveSegment = React.useCallback(option => {
|
|
2462
|
+
var name = props.name,
|
|
2463
|
+
isDisabled = props.isDisabled,
|
|
2464
|
+
fieldProps = props.fieldProps,
|
|
2465
|
+
inputProps = props.inputProps,
|
|
2466
|
+
options = props.options,
|
|
2467
|
+
showMessage = props.showMessage,
|
|
2468
|
+
isRequired = props.isRequired;
|
|
2469
|
+
var _useForm = reactFinalForm.useForm(),
|
|
2470
|
+
change = _useForm.change;
|
|
2471
|
+
var setActiveSegment = React.useCallback(function (option) {
|
|
2068
2472
|
change(name, option.value);
|
|
2069
2473
|
}, [change]);
|
|
2070
2474
|
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
2071
2475
|
name: name
|
|
2072
|
-
}, function Render({
|
|
2073
|
-
input,
|
|
2074
|
-
|
|
2075
|
-
}) {
|
|
2476
|
+
}, function Render(_ref) {
|
|
2477
|
+
var input = _ref.input,
|
|
2478
|
+
meta = _ref.meta;
|
|
2076
2479
|
/** Note:
|
|
2077
2480
|
* Create "Render" function by "eslint-react-hooks/rules-of-hooks":
|
|
2078
2481
|
* React Hooks cannot be called inside a callback.
|
|
@@ -2080,29 +2483,30 @@ function FormFieldSegmented(props) {
|
|
|
2080
2483
|
* custom React Hook function.
|
|
2081
2484
|
*/
|
|
2082
2485
|
|
|
2083
|
-
|
|
2084
|
-
|
|
2486
|
+
var activeOption = React.useMemo(function () {
|
|
2487
|
+
var emptyOption = {
|
|
2085
2488
|
label: null,
|
|
2086
2489
|
value: null
|
|
2087
2490
|
};
|
|
2088
2491
|
if (input.value) {
|
|
2089
|
-
|
|
2492
|
+
var currentOption = options.find(function (option) {
|
|
2493
|
+
return option.value === input.value;
|
|
2494
|
+
});
|
|
2090
2495
|
return currentOption || emptyOption;
|
|
2091
2496
|
}
|
|
2092
2497
|
return emptyOption;
|
|
2093
2498
|
}, [input.value]);
|
|
2094
|
-
|
|
2095
|
-
|
|
2096
|
-
|
|
2097
|
-
|
|
2098
|
-
|
|
2099
|
-
|
|
2100
|
-
|
|
2101
|
-
|
|
2102
|
-
|
|
2103
|
-
|
|
2104
|
-
|
|
2105
|
-
const updatedInputProps = useValidationAppearanceInputProps({
|
|
2499
|
+
var _useFieldValidationSt = useFieldValidationState({
|
|
2500
|
+
fieldProps: fieldProps,
|
|
2501
|
+
input: input,
|
|
2502
|
+
meta: meta
|
|
2503
|
+
}),
|
|
2504
|
+
errorKey = _useFieldValidationSt.errorKey,
|
|
2505
|
+
errorMessage = _useFieldValidationSt.errorMessage,
|
|
2506
|
+
isErrorState = _useFieldValidationSt.isErrorState,
|
|
2507
|
+
successKey = _useFieldValidationSt.successKey,
|
|
2508
|
+
isValidState = _useFieldValidationSt.isValidState;
|
|
2509
|
+
var updatedInputProps = useValidationAppearanceInputProps({
|
|
2106
2510
|
inputProps: inputProps,
|
|
2107
2511
|
validationStateKey: isErrorState ? errorKey : isValidState ? successKey : null
|
|
2108
2512
|
});
|
|
@@ -2129,7 +2533,7 @@ function FormFieldSegmented(props) {
|
|
|
2129
2533
|
});
|
|
2130
2534
|
}
|
|
2131
2535
|
|
|
2132
|
-
|
|
2536
|
+
var defaultSelectProps = {
|
|
2133
2537
|
appearance: 'defaultPrimary sizeM solid rounded',
|
|
2134
2538
|
// useValidationAppearanceInputProps
|
|
2135
2539
|
// Error
|
|
@@ -2141,12 +2545,12 @@ const defaultSelectProps = {
|
|
|
2141
2545
|
};
|
|
2142
2546
|
|
|
2143
2547
|
function getDefaultValue(options, selectValue) {
|
|
2144
|
-
|
|
2145
|
-
|
|
2146
|
-
options.forEach(item
|
|
2147
|
-
|
|
2148
|
-
|
|
2149
|
-
|
|
2548
|
+
var selectValues = Array.isArray(selectValue) ? selectValue : [selectValue];
|
|
2549
|
+
var result = [];
|
|
2550
|
+
options.forEach(function (item) {
|
|
2551
|
+
var isValue = selectValues.includes(item.value);
|
|
2552
|
+
var isLabel = selectValues.includes(item.label);
|
|
2553
|
+
var childOptions = [];
|
|
2150
2554
|
if (item.options) {
|
|
2151
2555
|
childOptions = getDefaultValue(item.options, selectValue);
|
|
2152
2556
|
}
|
|
@@ -2158,38 +2562,39 @@ function getDefaultValue(options, selectValue) {
|
|
|
2158
2562
|
});
|
|
2159
2563
|
return result;
|
|
2160
2564
|
}
|
|
2161
|
-
|
|
2162
|
-
|
|
2163
|
-
|
|
2164
|
-
|
|
2165
|
-
|
|
2166
|
-
|
|
2167
|
-
|
|
2168
|
-
|
|
2169
|
-
options = [],
|
|
2170
|
-
selectProps,
|
|
2171
|
-
selectRef,
|
|
2172
|
-
showMessage,
|
|
2173
|
-
onChange,
|
|
2174
|
-
onInputChange
|
|
2175
|
-
} = props;
|
|
2565
|
+
var FormFieldSelect = /*#__PURE__*/React__default.default.memo(function FormFieldSelect(props) {
|
|
2566
|
+
var isDisabled = props.isDisabled,
|
|
2567
|
+
isRequired = props.isRequired,
|
|
2568
|
+
classNameGroupItem = props.classNameGroupItem,
|
|
2569
|
+
fieldProps = props.fieldProps,
|
|
2570
|
+
initialValue = props.initialValue,
|
|
2571
|
+
name = props.name,
|
|
2572
|
+
_props$options = props.options,
|
|
2573
|
+
options = _props$options === void 0 ? [] : _props$options,
|
|
2574
|
+
selectProps = props.selectProps,
|
|
2575
|
+
selectRef = props.selectRef,
|
|
2576
|
+
showMessage = props.showMessage,
|
|
2577
|
+
onChange = props.onChange,
|
|
2578
|
+
onInputChange = props.onInputChange;
|
|
2176
2579
|
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
2177
2580
|
name: name,
|
|
2178
2581
|
initialValue: initialValue
|
|
2179
|
-
}, function Render({
|
|
2180
|
-
input,
|
|
2181
|
-
|
|
2182
|
-
}) {
|
|
2582
|
+
}, function Render(_ref) {
|
|
2583
|
+
var input = _ref.input,
|
|
2584
|
+
meta = _ref.meta;
|
|
2183
2585
|
/** Note:
|
|
2184
2586
|
* Create "Render" function by "eslint-react-hooks/rules-of-hooks":
|
|
2185
2587
|
* React Hooks cannot be called inside a callback.
|
|
2186
2588
|
* React Hooks must be called in a React function component or a
|
|
2187
2589
|
* custom React Hook function.
|
|
2188
2590
|
*/
|
|
2189
|
-
|
|
2190
|
-
|
|
2191
|
-
|
|
2192
|
-
|
|
2591
|
+
var _useState = React.useState(null),
|
|
2592
|
+
selectedOptions = _useState[0],
|
|
2593
|
+
setSelectedOptions = _useState[1];
|
|
2594
|
+
var defaultValue = React.useMemo(function () {
|
|
2595
|
+
var _input$value;
|
|
2596
|
+
var optionsValues = getDefaultValue(options, input.value);
|
|
2597
|
+
if (!optionsValues.length && (_input$value = input.value) != null && _input$value.length) {
|
|
2193
2598
|
optionsValues.push({
|
|
2194
2599
|
label: input.value,
|
|
2195
2600
|
value: input.value
|
|
@@ -2197,32 +2602,33 @@ const FormFieldSelect = /*#__PURE__*/React__default.default.memo(function FormFi
|
|
|
2197
2602
|
}
|
|
2198
2603
|
return optionsValues;
|
|
2199
2604
|
}, [input.value]);
|
|
2200
|
-
|
|
2605
|
+
var onChangeField = React.useCallback(function (value) {
|
|
2201
2606
|
input.onChange(value);
|
|
2202
2607
|
if (onChange) {
|
|
2203
2608
|
onChange(value, input.name);
|
|
2204
2609
|
}
|
|
2205
2610
|
}, [onChange, input.onChange]);
|
|
2206
|
-
|
|
2207
|
-
|
|
2611
|
+
var onChangeValue = React.useCallback(function (option, actionMeta) {
|
|
2612
|
+
var value = Array.isArray(option) ? option.map(function (o) {
|
|
2613
|
+
return o.value;
|
|
2614
|
+
}) : (option == null ? void 0 : option.value) || null;
|
|
2208
2615
|
setSelectedOptions(option);
|
|
2209
2616
|
onChangeField(value);
|
|
2210
2617
|
}, [onChangeField]);
|
|
2211
|
-
React.useEffect(()
|
|
2618
|
+
React.useEffect(function () {
|
|
2212
2619
|
setSelectedOptions(defaultValue);
|
|
2213
2620
|
}, [defaultValue]);
|
|
2214
|
-
|
|
2215
|
-
|
|
2216
|
-
|
|
2217
|
-
|
|
2218
|
-
|
|
2219
|
-
|
|
2220
|
-
|
|
2221
|
-
|
|
2222
|
-
|
|
2223
|
-
|
|
2224
|
-
|
|
2225
|
-
const updatedSelectProps = useValidationAppearanceInputProps({
|
|
2621
|
+
var _useFieldValidationSt = useFieldValidationState({
|
|
2622
|
+
fieldProps: fieldProps,
|
|
2623
|
+
input: input,
|
|
2624
|
+
meta: meta
|
|
2625
|
+
}),
|
|
2626
|
+
errorKey = _useFieldValidationSt.errorKey,
|
|
2627
|
+
errorMessage = _useFieldValidationSt.errorMessage,
|
|
2628
|
+
isErrorState = _useFieldValidationSt.isErrorState,
|
|
2629
|
+
successKey = _useFieldValidationSt.successKey,
|
|
2630
|
+
isValidState = _useFieldValidationSt.isValidState;
|
|
2631
|
+
var updatedSelectProps = useValidationAppearanceInputProps({
|
|
2226
2632
|
inputProps: selectProps,
|
|
2227
2633
|
validationStateKey: isErrorState ? errorKey : isValidState ? successKey : null
|
|
2228
2634
|
});
|
|
@@ -2244,7 +2650,7 @@ const FormFieldSelect = /*#__PURE__*/React__default.default.memo(function FormFi
|
|
|
2244
2650
|
className: "form-select-item",
|
|
2245
2651
|
ref: selectRef,
|
|
2246
2652
|
isDisabled: isDisabled,
|
|
2247
|
-
instanceId:
|
|
2653
|
+
instanceId: "id_" + input.name,
|
|
2248
2654
|
options: options,
|
|
2249
2655
|
value: selectedOptions,
|
|
2250
2656
|
onChange: onChangeValue,
|
|
@@ -2253,31 +2659,30 @@ const FormFieldSelect = /*#__PURE__*/React__default.default.memo(function FormFi
|
|
|
2253
2659
|
});
|
|
2254
2660
|
});
|
|
2255
2661
|
|
|
2256
|
-
|
|
2662
|
+
var defaultSwitchProps = {
|
|
2257
2663
|
appearance: 'defaultPrimary sizeL solid rounded',
|
|
2258
2664
|
errorAppearance: 'errorPrimary sizeL solid rounded',
|
|
2259
2665
|
successAppearance: 'successPrimary sizeL solid rounded',
|
|
2260
2666
|
requiredAppearance: 'requirePrimary sizeL solid rounded'
|
|
2261
2667
|
};
|
|
2262
2668
|
|
|
2263
|
-
|
|
2264
|
-
|
|
2265
|
-
|
|
2266
|
-
|
|
2267
|
-
|
|
2268
|
-
fieldProps = {},
|
|
2269
|
-
inputProps =
|
|
2270
|
-
|
|
2271
|
-
|
|
2272
|
-
|
|
2273
|
-
|
|
2669
|
+
var FormFieldSwitch = /*#__PURE__*/React__default.default.memo(function FormFieldSwitch(props) {
|
|
2670
|
+
var name = props.name,
|
|
2671
|
+
isDisabled = props.isDisabled,
|
|
2672
|
+
classNameGroupItem = props.classNameGroupItem,
|
|
2673
|
+
_props$fieldProps = props.fieldProps,
|
|
2674
|
+
fieldProps = _props$fieldProps === void 0 ? {} : _props$fieldProps,
|
|
2675
|
+
_props$inputProps = props.inputProps,
|
|
2676
|
+
inputProps = _props$inputProps === void 0 ? {} : _props$inputProps,
|
|
2677
|
+
showMessage = props.showMessage,
|
|
2678
|
+
isRequired = props.isRequired,
|
|
2679
|
+
onChange = props.onChange;
|
|
2274
2680
|
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
2275
2681
|
type: "checkbox",
|
|
2276
2682
|
name: name
|
|
2277
|
-
}, function Render({
|
|
2278
|
-
input,
|
|
2279
|
-
|
|
2280
|
-
}) {
|
|
2683
|
+
}, function Render(_ref) {
|
|
2684
|
+
var input = _ref.input,
|
|
2685
|
+
meta = _ref.meta;
|
|
2281
2686
|
/** Note:
|
|
2282
2687
|
* Create "Render" function by "eslint-react-hooks/rules-of-hooks":
|
|
2283
2688
|
* React Hooks cannot be called inside a callback.
|
|
@@ -2285,24 +2690,23 @@ const FormFieldSwitch = /*#__PURE__*/React__default.default.memo(function FormFi
|
|
|
2285
2690
|
* custom React Hook function.
|
|
2286
2691
|
*/
|
|
2287
2692
|
|
|
2288
|
-
|
|
2693
|
+
var onChangeField = React.useCallback(function (event) {
|
|
2289
2694
|
input.onChange(event);
|
|
2290
2695
|
if (onChange) {
|
|
2291
2696
|
onChange(event.target.checked, input.name);
|
|
2292
2697
|
}
|
|
2293
2698
|
}, [onChange, input.onChange]);
|
|
2294
|
-
|
|
2295
|
-
|
|
2296
|
-
|
|
2297
|
-
|
|
2298
|
-
|
|
2299
|
-
|
|
2300
|
-
|
|
2301
|
-
|
|
2302
|
-
|
|
2303
|
-
|
|
2304
|
-
|
|
2305
|
-
const updatedInputProps = useValidationAppearanceInputProps({
|
|
2699
|
+
var _useFieldValidationSt = useFieldValidationState({
|
|
2700
|
+
fieldProps: fieldProps,
|
|
2701
|
+
input: input,
|
|
2702
|
+
meta: meta
|
|
2703
|
+
}),
|
|
2704
|
+
errorKey = _useFieldValidationSt.errorKey,
|
|
2705
|
+
errorMessage = _useFieldValidationSt.errorMessage,
|
|
2706
|
+
isErrorState = _useFieldValidationSt.isErrorState,
|
|
2707
|
+
successKey = _useFieldValidationSt.successKey,
|
|
2708
|
+
isValidState = _useFieldValidationSt.isValidState;
|
|
2709
|
+
var updatedInputProps = useValidationAppearanceInputProps({
|
|
2306
2710
|
inputProps: inputProps,
|
|
2307
2711
|
validationStateKey: isErrorState ? errorKey : isValidState ? successKey : null
|
|
2308
2712
|
});
|
|
@@ -2334,7 +2738,7 @@ const FormFieldSwitch = /*#__PURE__*/React__default.default.memo(function FormFi
|
|
|
2334
2738
|
});
|
|
2335
2739
|
});
|
|
2336
2740
|
|
|
2337
|
-
|
|
2741
|
+
var defaultTextareaProps = {
|
|
2338
2742
|
appearance: 'defaultPrimary sizeM solid rounded',
|
|
2339
2743
|
// useValidationAppearanceInputProps
|
|
2340
2744
|
// Error
|
|
@@ -2345,22 +2749,21 @@ const defaultTextareaProps = {
|
|
|
2345
2749
|
requiredAppearance: 'requirePrimary sizeM solid rounded'
|
|
2346
2750
|
};
|
|
2347
2751
|
|
|
2348
|
-
|
|
2349
|
-
|
|
2350
|
-
|
|
2351
|
-
|
|
2352
|
-
fieldProps = {},
|
|
2353
|
-
inputProps =
|
|
2354
|
-
|
|
2355
|
-
|
|
2356
|
-
|
|
2357
|
-
|
|
2752
|
+
var FormFieldTextarea = /*#__PURE__*/React__default.default.memo(function FormFieldTextarea(props) {
|
|
2753
|
+
var name = props.name,
|
|
2754
|
+
classNameGroupItem = props.classNameGroupItem,
|
|
2755
|
+
_props$fieldProps = props.fieldProps,
|
|
2756
|
+
fieldProps = _props$fieldProps === void 0 ? {} : _props$fieldProps,
|
|
2757
|
+
_props$inputProps = props.inputProps,
|
|
2758
|
+
inputProps = _props$inputProps === void 0 ? {} : _props$inputProps,
|
|
2759
|
+
showMessage = props.showMessage,
|
|
2760
|
+
isDisabled = props.isDisabled,
|
|
2761
|
+
isRequired = props.isRequired;
|
|
2358
2762
|
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
2359
2763
|
name: name
|
|
2360
|
-
}, function Render({
|
|
2361
|
-
input,
|
|
2362
|
-
|
|
2363
|
-
}) {
|
|
2764
|
+
}, function Render(_ref) {
|
|
2765
|
+
var input = _ref.input,
|
|
2766
|
+
meta = _ref.meta;
|
|
2364
2767
|
/** Note:
|
|
2365
2768
|
* Create "Render" function by "eslint-react-hooks/rules-of-hooks":
|
|
2366
2769
|
* React Hooks cannot be called inside a callback.
|
|
@@ -2368,18 +2771,17 @@ const FormFieldTextarea = /*#__PURE__*/React__default.default.memo(function Form
|
|
|
2368
2771
|
* custom React Hook function.
|
|
2369
2772
|
*/
|
|
2370
2773
|
|
|
2371
|
-
|
|
2372
|
-
|
|
2373
|
-
|
|
2374
|
-
|
|
2375
|
-
|
|
2376
|
-
|
|
2377
|
-
|
|
2378
|
-
|
|
2379
|
-
|
|
2380
|
-
|
|
2381
|
-
|
|
2382
|
-
const updatedInputProps = useValidationAppearanceInputProps({
|
|
2774
|
+
var _useFieldValidationSt = useFieldValidationState({
|
|
2775
|
+
fieldProps: fieldProps,
|
|
2776
|
+
input: input,
|
|
2777
|
+
meta: meta
|
|
2778
|
+
}),
|
|
2779
|
+
errorKey = _useFieldValidationSt.errorKey,
|
|
2780
|
+
errorMessage = _useFieldValidationSt.errorMessage,
|
|
2781
|
+
successKey = _useFieldValidationSt.successKey,
|
|
2782
|
+
isErrorState = _useFieldValidationSt.isErrorState,
|
|
2783
|
+
isValidState = _useFieldValidationSt.isValidState;
|
|
2784
|
+
var updatedInputProps = useValidationAppearanceInputProps({
|
|
2383
2785
|
inputProps: inputProps,
|
|
2384
2786
|
validationStateKey: isErrorState ? errorKey : isValidState ? successKey : null
|
|
2385
2787
|
});
|
|
@@ -2398,8 +2800,8 @@ const FormFieldTextarea = /*#__PURE__*/React__default.default.memo(function Form
|
|
|
2398
2800
|
isRequired: isRequired,
|
|
2399
2801
|
isValidState: isValidState
|
|
2400
2802
|
}, fieldProps), /*#__PURE__*/React__default.default.createElement(Textarea.Textarea, Object.assign({
|
|
2401
|
-
className: clsx__default.default(meta.active && 'textarea_state_focus', meta.error && meta.touched &&
|
|
2402
|
-
dataTestId:
|
|
2803
|
+
className: clsx__default.default(meta.active && 'textarea_state_focus', meta.error && meta.touched && "textarea_state_" + errorKey),
|
|
2804
|
+
dataTestId: input.name + "-field-textarea",
|
|
2403
2805
|
name: input.name,
|
|
2404
2806
|
autoComplete: "nope",
|
|
2405
2807
|
value: input.value || '',
|
|
@@ -2411,108 +2813,12 @@ const FormFieldTextarea = /*#__PURE__*/React__default.default.memo(function Form
|
|
|
2411
2813
|
});
|
|
2412
2814
|
});
|
|
2413
2815
|
|
|
2414
|
-
|
|
2415
|
-
|
|
2416
|
-
// useValidationAppearanceInputProps
|
|
2417
|
-
// Error
|
|
2418
|
-
errorAppearance: 'errorPrimary sizeM solid rounded',
|
|
2419
|
-
// Success
|
|
2420
|
-
successAppearance: 'successPrimary sizeM solid rounded',
|
|
2421
|
-
// Required
|
|
2422
|
-
requiredAppearance: 'requirePrimary sizeM solid rounded'
|
|
2423
|
-
};
|
|
2424
|
-
|
|
2425
|
-
const FormFieldDadataInput = /*#__PURE__*/React__default.default.memo(function FormFieldDadataInput(props) {
|
|
2426
|
-
const {
|
|
2427
|
-
name,
|
|
2428
|
-
initialValue,
|
|
2429
|
-
isDisabled,
|
|
2430
|
-
classNameGroupItem,
|
|
2431
|
-
fieldProps,
|
|
2432
|
-
inputProps,
|
|
2433
|
-
parse,
|
|
2434
|
-
showMessage,
|
|
2435
|
-
token,
|
|
2436
|
-
isRequired,
|
|
2437
|
-
onDadataAutocomplete
|
|
2438
|
-
} = props;
|
|
2439
|
-
if (process.env.NODE_ENV === 'development') {
|
|
2440
|
-
const hint = `Check your form config at field "${name}".`;
|
|
2441
|
-
if (!token) {
|
|
2442
|
-
const message = `FormFieldDadataInput: 'token' prop is missing, instead got ${token}.`;
|
|
2443
|
-
throw new Error(message + '\n' + hint);
|
|
2444
|
-
}
|
|
2445
|
-
if (!onDadataAutocomplete) {
|
|
2446
|
-
const message = `FormFieldDadataInput: 'onDadataAutocomplete' prop is missing, instead got ${onDadataAutocomplete}.`;
|
|
2447
|
-
throw new Error(message + '\n' + hint);
|
|
2448
|
-
}
|
|
2449
|
-
}
|
|
2450
|
-
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
|
|
2451
|
-
name: name,
|
|
2452
|
-
initialValue: initialValue,
|
|
2453
|
-
parse: parse
|
|
2454
|
-
}, function Render({
|
|
2455
|
-
input,
|
|
2456
|
-
meta
|
|
2457
|
-
}) {
|
|
2458
|
-
/** Note:
|
|
2459
|
-
* Create "Render" function by "eslint-react-hooks/rules-of-hooks":
|
|
2460
|
-
* React Hooks cannot be called inside a callback.
|
|
2461
|
-
* React Hooks must be called in a React function component or a
|
|
2462
|
-
* custom React Hook function.
|
|
2463
|
-
*/
|
|
2464
|
-
|
|
2465
|
-
const {
|
|
2466
|
-
errorKey,
|
|
2467
|
-
errorMessage,
|
|
2468
|
-
isErrorState,
|
|
2469
|
-
successKey,
|
|
2470
|
-
isValidState
|
|
2471
|
-
} = useFieldValidationState({
|
|
2472
|
-
fieldProps: fieldProps,
|
|
2473
|
-
input: input,
|
|
2474
|
-
meta: meta
|
|
2475
|
-
});
|
|
2476
|
-
const updatedInputProps = useValidationAppearanceInputProps({
|
|
2477
|
-
inputProps: inputProps,
|
|
2478
|
-
validationStateKey: isErrorState ? errorKey : isValidState ? successKey : null
|
|
2479
|
-
});
|
|
2480
|
-
return /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
|
|
2481
|
-
className: clsx__default.default('form-field_input-dadata', 'form__item_input-dadata', classNameGroupItem),
|
|
2482
|
-
errorKey: errorKey,
|
|
2483
|
-
errorMessage: errorMessage,
|
|
2484
|
-
isErrorState: isErrorState,
|
|
2485
|
-
metaError: meta.error,
|
|
2486
|
-
isDisabled: isDisabled,
|
|
2487
|
-
fieldClassName: "form-dadata",
|
|
2488
|
-
inputName: input.name,
|
|
2489
|
-
inputValue: input.value || '',
|
|
2490
|
-
metaActive: meta.active,
|
|
2491
|
-
showMessage: showMessage,
|
|
2492
|
-
isRequired: isRequired,
|
|
2493
|
-
isValidState: isValidState
|
|
2494
|
-
}, fieldProps), /*#__PURE__*/React__default.default.createElement(Dadata.Dadata
|
|
2495
|
-
// dataTestId={`${input.name}FieldInputDadata`}
|
|
2496
|
-
// className={clsx(
|
|
2497
|
-
// meta.active && 'input-dadata_state_focus',
|
|
2498
|
-
// meta.error && meta.touched && `input-dadata_state_${errorKey}`,
|
|
2499
|
-
// )}
|
|
2500
|
-
, {
|
|
2501
|
-
input: input,
|
|
2502
|
-
inputProps: updatedInputProps,
|
|
2503
|
-
meta: meta,
|
|
2504
|
-
setValue: onDadataAutocomplete,
|
|
2505
|
-
token: token
|
|
2506
|
-
}));
|
|
2507
|
-
});
|
|
2508
|
-
});
|
|
2509
|
-
|
|
2510
|
-
const formTypes = {
|
|
2816
|
+
var formTypes = {
|
|
2817
|
+
custom: 'custom',
|
|
2511
2818
|
password: 'password',
|
|
2512
2819
|
code: 'code',
|
|
2513
2820
|
text: 'text',
|
|
2514
2821
|
textarea: 'textarea',
|
|
2515
|
-
custom: 'custom',
|
|
2516
2822
|
checkbox: 'checkbox',
|
|
2517
2823
|
chips: 'chips',
|
|
2518
2824
|
choice: 'choice',
|
|
@@ -2521,11 +2827,12 @@ const formTypes = {
|
|
|
2521
2827
|
dateRangePicker: 'dateRangePicker',
|
|
2522
2828
|
fileInput: 'fileInput',
|
|
2523
2829
|
group: 'group',
|
|
2830
|
+
inputNumber: 'inputNumber',
|
|
2524
2831
|
maskedInput: 'maskedInput',
|
|
2525
2832
|
radioGroup: 'radioGroup',
|
|
2526
2833
|
segmented: 'segmented',
|
|
2527
2834
|
select: 'select',
|
|
2528
|
-
switch: 'switch'
|
|
2835
|
+
"switch": 'switch'
|
|
2529
2836
|
};
|
|
2530
2837
|
function generateField(field, config, props) {
|
|
2531
2838
|
switch (field.type) {
|
|
@@ -2559,7 +2866,7 @@ function generateField(field, config, props) {
|
|
|
2559
2866
|
key: config.key
|
|
2560
2867
|
}, field, props));
|
|
2561
2868
|
}
|
|
2562
|
-
case formTypes
|
|
2869
|
+
case formTypes["switch"]:
|
|
2563
2870
|
{
|
|
2564
2871
|
return /*#__PURE__*/React__default.default.createElement(FormFieldSwitch, Object.assign({
|
|
2565
2872
|
key: config.key
|
|
@@ -2625,16 +2932,23 @@ function generateField(field, config, props) {
|
|
|
2625
2932
|
key: config.key
|
|
2626
2933
|
}, field, props));
|
|
2627
2934
|
}
|
|
2935
|
+
case formTypes.inputNumber:
|
|
2936
|
+
{
|
|
2937
|
+
return /*#__PURE__*/React__default.default.createElement(FormFieldInputNumber, Object.assign({
|
|
2938
|
+
key: config.key
|
|
2939
|
+
}, field, props));
|
|
2940
|
+
}
|
|
2628
2941
|
case formTypes.group:
|
|
2629
2942
|
{
|
|
2630
2943
|
return /*#__PURE__*/React__default.default.createElement(FormBlockGroup, Object.assign({
|
|
2631
2944
|
key: config.key
|
|
2632
|
-
}, field, props), Object.entries(field.group).map((
|
|
2633
|
-
|
|
2634
|
-
|
|
2945
|
+
}, field, props), Object.entries(field.group).map(function (_ref) {
|
|
2946
|
+
var key = _ref[0],
|
|
2947
|
+
value = _ref[1];
|
|
2948
|
+
var groupProps = Object.assign({}, value, {
|
|
2635
2949
|
classNameGroupItem: value.classNameGroupItem || 'form__group-item',
|
|
2636
2950
|
showMessage: field.showMessage
|
|
2637
|
-
};
|
|
2951
|
+
});
|
|
2638
2952
|
return generateField(groupProps, {
|
|
2639
2953
|
key: key + '_form_group'
|
|
2640
2954
|
}, props);
|
|
@@ -2643,32 +2957,32 @@ function generateField(field, config, props) {
|
|
|
2643
2957
|
}
|
|
2644
2958
|
}
|
|
2645
2959
|
|
|
2646
|
-
|
|
2647
|
-
|
|
2960
|
+
var focusOnError = function focusOnError(formElementsList, errors) {
|
|
2961
|
+
var selectsIds = Object.keys(errors).map(function (fieldName) {
|
|
2648
2962
|
if (fieldName === finalForm.FORM_ERROR) {
|
|
2649
2963
|
// TODO: get from somewhere
|
|
2650
2964
|
return 'notification__item_status_error';
|
|
2651
2965
|
}
|
|
2652
|
-
return
|
|
2966
|
+
return "react-select-id_" + fieldName + "-input";
|
|
2653
2967
|
});
|
|
2654
|
-
|
|
2968
|
+
var errorFieldElement = formElementsList.find(function (element) {
|
|
2655
2969
|
if (element.name) {
|
|
2656
2970
|
return finalForm.getIn(errors, element.name);
|
|
2657
2971
|
} else {
|
|
2658
2972
|
return selectsIds.includes(element.id);
|
|
2659
2973
|
}
|
|
2660
2974
|
});
|
|
2661
|
-
|
|
2975
|
+
var errorsList = Object.keys(errors);
|
|
2662
2976
|
if (!errorFieldElement && errorsList.length) {
|
|
2663
|
-
|
|
2977
|
+
var errorElement;
|
|
2664
2978
|
try {
|
|
2665
|
-
|
|
2979
|
+
var fieldName = errorsList[0];
|
|
2666
2980
|
if (fieldName === finalForm.FORM_ERROR) {
|
|
2667
2981
|
errorElement = document.querySelector('notification__item_status_error');
|
|
2668
2982
|
} else {
|
|
2669
|
-
errorElement = document.querySelector(
|
|
2983
|
+
errorElement = document.querySelector("#" + fieldName + "-error");
|
|
2670
2984
|
if (!errorElement) {
|
|
2671
|
-
errorElement = document.querySelector(
|
|
2985
|
+
errorElement = document.querySelector("#id_" + fieldName);
|
|
2672
2986
|
}
|
|
2673
2987
|
}
|
|
2674
2988
|
} catch (err) {
|
|
@@ -2690,11 +3004,12 @@ const focusOnError = (formElementsList, errors) => {
|
|
|
2690
3004
|
}
|
|
2691
3005
|
return null;
|
|
2692
3006
|
};
|
|
2693
|
-
|
|
2694
|
-
|
|
2695
|
-
|
|
2696
|
-
|
|
2697
|
-
|
|
3007
|
+
var focusOnErrorDecorator = createDecorator__default.default(null, focusOnError);
|
|
3008
|
+
var setErrorsMutator = function setErrorsMutator(args, state) {
|
|
3009
|
+
var fieldName = args[0],
|
|
3010
|
+
data = args[1];
|
|
3011
|
+
var submitError = data.submitError;
|
|
3012
|
+
var fieldError = data.error;
|
|
2698
3013
|
if (fieldName === 'non_field_errors' || fieldName === finalForm.FORM_ERROR) {
|
|
2699
3014
|
// state.formState.invalid = true
|
|
2700
3015
|
// state.formState.valid = false
|
|
@@ -2705,18 +3020,16 @@ const setErrorsMutator = (args, state) => {
|
|
|
2705
3020
|
|
|
2706
3021
|
// TODO: make clear error not by empty string check
|
|
2707
3022
|
if (fieldError || fieldError === '') {
|
|
2708
|
-
|
|
2709
|
-
|
|
2710
|
-
});
|
|
3023
|
+
var _Object$assign;
|
|
3024
|
+
var errorsState = Object.assign({}, state.formState.errors, (_Object$assign = {}, _Object$assign[fieldName] = fieldError, _Object$assign));
|
|
2711
3025
|
state.fields[fieldName].error = fieldError;
|
|
2712
3026
|
state.formState.errors = errorsState;
|
|
2713
3027
|
}
|
|
2714
3028
|
|
|
2715
3029
|
// TODO: make clear error not by empty string check
|
|
2716
3030
|
if (submitError || submitError === '') {
|
|
2717
|
-
|
|
2718
|
-
|
|
2719
|
-
});
|
|
3031
|
+
var _Object$assign2;
|
|
3032
|
+
var submitErrorsState = Object.assign({}, state.formState.submitErrors, (_Object$assign2 = {}, _Object$assign2[fieldName] = submitError, _Object$assign2));
|
|
2720
3033
|
state.fields[fieldName].submitFailed = true;
|
|
2721
3034
|
state.fields[fieldName].submitSucceeded = false;
|
|
2722
3035
|
state.fields[fieldName].submitError = submitError;
|
|
@@ -2727,163 +3040,186 @@ const setErrorsMutator = (args, state) => {
|
|
|
2727
3040
|
}
|
|
2728
3041
|
}
|
|
2729
3042
|
};
|
|
2730
|
-
|
|
2731
|
-
|
|
2732
|
-
|
|
2733
|
-
|
|
2734
|
-
|
|
2735
|
-
|
|
2736
|
-
|
|
2737
|
-
|
|
2738
|
-
|
|
2739
|
-
|
|
2740
|
-
|
|
2741
|
-
|
|
2742
|
-
|
|
2743
|
-
|
|
2744
|
-
|
|
2745
|
-
|
|
2746
|
-
|
|
2747
|
-
|
|
2748
|
-
|
|
2749
|
-
|
|
2750
|
-
|
|
2751
|
-
|
|
2752
|
-
|
|
2753
|
-
|
|
2754
|
-
|
|
2755
|
-
|
|
2756
|
-
|
|
2757
|
-
|
|
2758
|
-
|
|
2759
|
-
|
|
2760
|
-
|
|
2761
|
-
|
|
2762
|
-
|
|
2763
|
-
|
|
2764
|
-
|
|
2765
|
-
|
|
2766
|
-
|
|
2767
|
-
|
|
2768
|
-
|
|
2769
|
-
|
|
2770
|
-
|
|
2771
|
-
|
|
2772
|
-
|
|
2773
|
-
|
|
2774
|
-
|
|
2775
|
-
|
|
2776
|
-
|
|
2777
|
-
|
|
2778
|
-
|
|
2779
|
-
|
|
2780
|
-
|
|
2781
|
-
|
|
2782
|
-
|
|
2783
|
-
|
|
2784
|
-
|
|
2785
|
-
|
|
2786
|
-
|
|
2787
|
-
|
|
2788
|
-
|
|
2789
|
-
|
|
2790
|
-
|
|
2791
|
-
|
|
2792
|
-
|
|
2793
|
-
|
|
2794
|
-
|
|
2795
|
-
|
|
2796
|
-
|
|
2797
|
-
|
|
2798
|
-
|
|
2799
|
-
|
|
2800
|
-
|
|
2801
|
-
|
|
2802
|
-
|
|
2803
|
-
|
|
2804
|
-
|
|
2805
|
-
|
|
2806
|
-
|
|
2807
|
-
|
|
2808
|
-
|
|
2809
|
-
|
|
2810
|
-
|
|
2811
|
-
|
|
2812
|
-
|
|
2813
|
-
|
|
2814
|
-
|
|
2815
|
-
|
|
2816
|
-
|
|
2817
|
-
|
|
2818
|
-
|
|
2819
|
-
|
|
2820
|
-
|
|
2821
|
-
|
|
2822
|
-
|
|
2823
|
-
|
|
2824
|
-
|
|
2825
|
-
|
|
2826
|
-
|
|
2827
|
-
|
|
2828
|
-
|
|
2829
|
-
|
|
2830
|
-
|
|
2831
|
-
|
|
2832
|
-
|
|
2833
|
-
|
|
2834
|
-
|
|
2835
|
-
|
|
2836
|
-
|
|
2837
|
-
|
|
2838
|
-
|
|
2839
|
-
|
|
2840
|
-
|
|
2841
|
-
|
|
2842
|
-
|
|
2843
|
-
|
|
2844
|
-
|
|
2845
|
-
|
|
2846
|
-
|
|
2847
|
-
|
|
2848
|
-
|
|
2849
|
-
|
|
2850
|
-
|
|
2851
|
-
|
|
2852
|
-
|
|
2853
|
-
|
|
2854
|
-
|
|
2855
|
-
|
|
2856
|
-
|
|
3043
|
+
var sendFormDataToServer = /*#__PURE__*/function () {
|
|
3044
|
+
var _ref = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(url, data) {
|
|
3045
|
+
var response, _error$response, _error$response2, formErrors, _t;
|
|
3046
|
+
return _regenerator().w(function (_context) {
|
|
3047
|
+
while (1) switch (_context.p = _context.n) {
|
|
3048
|
+
case 0:
|
|
3049
|
+
_context.p = 0;
|
|
3050
|
+
_context.n = 1;
|
|
3051
|
+
return axios__default.default({
|
|
3052
|
+
url: url,
|
|
3053
|
+
method: 'POST',
|
|
3054
|
+
data: data
|
|
3055
|
+
});
|
|
3056
|
+
case 1:
|
|
3057
|
+
response = _context.v;
|
|
3058
|
+
return _context.a(2, {
|
|
3059
|
+
success: true,
|
|
3060
|
+
response: response
|
|
3061
|
+
});
|
|
3062
|
+
case 2:
|
|
3063
|
+
_context.p = 2;
|
|
3064
|
+
_t = _context.v;
|
|
3065
|
+
formErrors = {};
|
|
3066
|
+
if (typeof ((_error$response = _t.response) == null ? void 0 : _error$response.data) === 'string') {
|
|
3067
|
+
formErrors[finalForm.FORM_ERROR] = 'Something went wrong';
|
|
3068
|
+
}
|
|
3069
|
+
if (typeof ((_error$response2 = _t.response) == null ? void 0 : _error$response2.data) === 'object') {
|
|
3070
|
+
Object.entries(_t.response.data).forEach(function (_ref2) {
|
|
3071
|
+
var fieldName = _ref2[0],
|
|
3072
|
+
errorsList = _ref2[1];
|
|
3073
|
+
formErrors[fieldName] = errorsList[0];
|
|
3074
|
+
});
|
|
3075
|
+
}
|
|
3076
|
+
return _context.a(2, {
|
|
3077
|
+
error: _t,
|
|
3078
|
+
success: false,
|
|
3079
|
+
formErrors: formErrors
|
|
3080
|
+
});
|
|
3081
|
+
}
|
|
3082
|
+
}, _callee, null, [[0, 2]]);
|
|
3083
|
+
}));
|
|
3084
|
+
return function sendFormDataToServer(_x, _x2) {
|
|
3085
|
+
return _ref.apply(this, arguments);
|
|
3086
|
+
};
|
|
3087
|
+
}();
|
|
3088
|
+
|
|
3089
|
+
var FinalForm = /*#__PURE__*/React__default.default.forwardRef(function FinalForm(props, ref) {
|
|
3090
|
+
var className = props.className,
|
|
3091
|
+
dataTestId = props.dataTestId,
|
|
3092
|
+
dataTour = props.dataTour,
|
|
3093
|
+
type = props.type,
|
|
3094
|
+
name = props.name,
|
|
3095
|
+
initialValues = props.initialValues,
|
|
3096
|
+
initialValuesEqual = props.initialValuesEqual,
|
|
3097
|
+
config = props.config,
|
|
3098
|
+
validationSchema = props.validationSchema,
|
|
3099
|
+
title = props.title,
|
|
3100
|
+
titleFill = props.titleFill,
|
|
3101
|
+
titlePosition = props.titlePosition,
|
|
3102
|
+
titleTextColor = props.titleTextColor,
|
|
3103
|
+
titleTextSize = props.titleTextSize,
|
|
3104
|
+
titleTextWeight = props.titleTextWeight,
|
|
3105
|
+
desc = props.desc,
|
|
3106
|
+
descSize = props.descSize,
|
|
3107
|
+
descTextColor = props.descTextColor,
|
|
3108
|
+
descTextWeight = props.descTextWeight,
|
|
3109
|
+
buttonGap = props.buttonGap,
|
|
3110
|
+
_props$additionalProp = props.additionalProps,
|
|
3111
|
+
additionalProps = _props$additionalProp === void 0 ? {} : _props$additionalProp,
|
|
3112
|
+
_props$buttonDirectio = props.buttonDirection,
|
|
3113
|
+
buttonDirection = _props$buttonDirectio === void 0 ? 'vertical' : _props$buttonDirectio,
|
|
3114
|
+
buttonFill = props.buttonFill,
|
|
3115
|
+
buttonJustifyContent = props.buttonJustifyContent,
|
|
3116
|
+
buttonPadding = props.buttonPadding,
|
|
3117
|
+
buttonPosition = props.buttonPosition,
|
|
3118
|
+
dataTestIdButtons = props.dataTestIdButtons,
|
|
3119
|
+
dataTestIdPrimaryButton = props.dataTestIdPrimaryButton,
|
|
3120
|
+
dataTestIdSecondaryButton = props.dataTestIdSecondaryButton,
|
|
3121
|
+
dataTestIdTertiaryButton = props.dataTestIdTertiaryButton,
|
|
3122
|
+
dataTourButtons = props.dataTourButtons,
|
|
3123
|
+
dataTourPrimaryButton = props.dataTourPrimaryButton,
|
|
3124
|
+
dataTourSecondaryButton = props.dataTourSecondaryButton,
|
|
3125
|
+
dataTourTertiaryButton = props.dataTourTertiaryButton,
|
|
3126
|
+
_props$disableFieldsA = props.disableFieldsAutoComplete,
|
|
3127
|
+
disableFieldsAutoComplete = _props$disableFieldsA === void 0 ? false : _props$disableFieldsA,
|
|
3128
|
+
fieldsGap = props.fieldsGap,
|
|
3129
|
+
formName = props.formName,
|
|
3130
|
+
groupGap = props.groupGap,
|
|
3131
|
+
heightClass = props.heightClass,
|
|
3132
|
+
language = props.language,
|
|
3133
|
+
loader = props.loader,
|
|
3134
|
+
loaderAppearance = props.loaderAppearance,
|
|
3135
|
+
_props$loaderFill = props.loaderFill,
|
|
3136
|
+
loaderFill = _props$loaderFill === void 0 ? 'surfacePrimary' : _props$loaderFill,
|
|
3137
|
+
_props$loaderItemFill = props.loaderItemFill,
|
|
3138
|
+
loaderItemFill = _props$loaderItemFill === void 0 ? 'accentItemSecondary' : _props$loaderItemFill,
|
|
3139
|
+
loaderShape = props.loaderShape,
|
|
3140
|
+
_props$loaderSize = props.loaderSize,
|
|
3141
|
+
loaderSize = _props$loaderSize === void 0 ? 'l' : _props$loaderSize,
|
|
3142
|
+
loaderText = props.loaderText,
|
|
3143
|
+
_props$loaderType = props.loaderType,
|
|
3144
|
+
loaderType = _props$loaderType === void 0 ? 'simple' : _props$loaderType,
|
|
3145
|
+
mutators = props.mutators,
|
|
3146
|
+
notificationCloseButton = props.notificationCloseButton,
|
|
3147
|
+
notificationType = props.notificationType,
|
|
3148
|
+
primaryButton = props.primaryButton,
|
|
3149
|
+
primaryButtonAppearance = props.primaryButtonAppearance,
|
|
3150
|
+
primaryButtonFill = props.primaryButtonFill,
|
|
3151
|
+
primaryButtonFillHover = props.primaryButtonFillHover,
|
|
3152
|
+
primaryButtonHtmlType = props.primaryButtonHtmlType,
|
|
3153
|
+
primaryButtonIsDisabled = props.primaryButtonIsDisabled,
|
|
3154
|
+
primaryButtonIsLoading = props.primaryButtonIsLoading,
|
|
3155
|
+
primaryButtonLabel = props.primaryButtonLabel,
|
|
3156
|
+
primaryButtonLabelSize = props.primaryButtonLabelSize,
|
|
3157
|
+
primaryButtonLabelTextColor = props.primaryButtonLabelTextColor,
|
|
3158
|
+
primaryButtonLabelTextWeight = props.primaryButtonLabelTextWeight,
|
|
3159
|
+
primaryButtonSize = props.primaryButtonSize,
|
|
3160
|
+
primarySecondaryHtmlType = props.primarySecondaryHtmlType,
|
|
3161
|
+
_props$renderFieldsWr = props.renderFieldsWrapper,
|
|
3162
|
+
renderFieldsWrapper = _props$renderFieldsWr === void 0 ? function (wrapperChildren) {
|
|
3163
|
+
return wrapperChildren;
|
|
3164
|
+
} : _props$renderFieldsWr,
|
|
3165
|
+
secondaryButton = props.secondaryButton,
|
|
3166
|
+
secondaryButtonAppearance = props.secondaryButtonAppearance,
|
|
3167
|
+
secondaryButtonFill = props.secondaryButtonFill,
|
|
3168
|
+
secondaryButtonFillHover = props.secondaryButtonFillHover,
|
|
3169
|
+
secondaryButtonIsDisabled = props.secondaryButtonIsDisabled,
|
|
3170
|
+
secondaryButtonIsLoading = props.secondaryButtonIsLoading,
|
|
3171
|
+
secondaryButtonLabel = props.secondaryButtonLabel,
|
|
3172
|
+
secondaryButtonLabelSize = props.secondaryButtonLabelSize,
|
|
3173
|
+
secondaryButtonLabelTextColor = props.secondaryButtonLabelTextColor,
|
|
3174
|
+
secondaryButtonLabelTextWeight = props.secondaryButtonLabelTextWeight,
|
|
3175
|
+
secondaryButtonSize = props.secondaryButtonSize,
|
|
3176
|
+
shapeStrengthClass = props.shapeStrengthClass,
|
|
3177
|
+
tertiaryButton = props.tertiaryButton,
|
|
3178
|
+
tertiaryButtonFill = props.tertiaryButtonFill,
|
|
3179
|
+
tertiaryButtonFillHover = props.tertiaryButtonFillHover,
|
|
3180
|
+
tertiaryButtonLabel = props.tertiaryButtonLabel,
|
|
3181
|
+
tertiaryButtonLabelSize = props.tertiaryButtonLabelSize,
|
|
3182
|
+
tertiaryButtonLabelTextColor = props.tertiaryButtonLabelTextColor,
|
|
3183
|
+
tertiaryButtonLabelTextWeight = props.tertiaryButtonLabelTextWeight,
|
|
3184
|
+
tertiaryButtonSize = props.tertiaryButtonSize,
|
|
3185
|
+
widthClass = props.widthClass,
|
|
3186
|
+
before = props.before,
|
|
3187
|
+
after = props.after,
|
|
3188
|
+
isLoading = props.isLoading,
|
|
3189
|
+
onClickSecondaryButton = props.onClickSecondaryButton,
|
|
3190
|
+
onClickTertiaryButton = props.onClickTertiaryButton,
|
|
3191
|
+
onChangeFormValues = props.onChangeFormValues,
|
|
3192
|
+
onSubmit = props.onSubmit;
|
|
3193
|
+
var validate = useYupValidationSchema(validationSchema, language);
|
|
3194
|
+
var onRefFormInstance = React.useCallback(function (formInstance) {
|
|
2857
3195
|
if (ref) {
|
|
2858
3196
|
ref.current = formInstance;
|
|
2859
3197
|
}
|
|
2860
3198
|
}, [ref]);
|
|
2861
|
-
|
|
2862
|
-
|
|
2863
|
-
|
|
2864
|
-
|
|
2865
|
-
|
|
2866
|
-
|
|
2867
|
-
|
|
2868
|
-
|
|
2869
|
-
styles: formStyles,
|
|
2870
|
-
wrapper: wrapperStyles
|
|
2871
|
-
} = useStyles.useStyles(props);
|
|
3199
|
+
var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
|
|
3200
|
+
var directionClass = propsGenerator.directionClass,
|
|
3201
|
+
fillClass = propsGenerator.fillClass,
|
|
3202
|
+
elevationClass = propsGenerator.elevationClass,
|
|
3203
|
+
shapeClass = propsGenerator.shapeClass;
|
|
3204
|
+
var _useStyles = useStyles.useStyles(props),
|
|
3205
|
+
formStyles = _useStyles.styles,
|
|
3206
|
+
wrapperStyles = _useStyles.wrapper;
|
|
2872
3207
|
return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Form, {
|
|
2873
3208
|
initialValues: initialValues,
|
|
2874
3209
|
initialValuesEqual: initialValuesEqual,
|
|
2875
|
-
render: ({
|
|
2876
|
-
form,
|
|
2877
|
-
|
|
2878
|
-
|
|
2879
|
-
|
|
2880
|
-
}) => {
|
|
3210
|
+
render: function render(_ref) {
|
|
3211
|
+
var form = _ref.form,
|
|
3212
|
+
handleSubmit = _ref.handleSubmit,
|
|
3213
|
+
modifiedSinceLastSubmit = _ref.modifiedSinceLastSubmit,
|
|
3214
|
+
submitError = _ref.submitError;
|
|
2881
3215
|
return /*#__PURE__*/React__default.default.createElement("form", {
|
|
2882
|
-
className: clsx__default.default(className, 'form', type &&
|
|
3216
|
+
className: clsx__default.default(className, 'form', type && "form_type_" + type, widthClass && "width_" + widthClass, heightClass && "height_" + heightClass, titlePosition && "form_title-position_" + titlePosition, buttonPosition && "form_button-position_" + buttonPosition, directionClass && "direction_" + directionClass, fillClass && "fill_" + fillClass, shapeClass && "shape_" + shapeClass, shapeStrengthClass && "shape-strength_" + shapeStrengthClass, elevationClass && "elevation_" + elevationClass),
|
|
2883
3217
|
name: formName || 'form'
|
|
2884
3218
|
// We no need set reference to html element, we need reference to "final-form" instance
|
|
2885
3219
|
,
|
|
2886
|
-
ref: ()
|
|
3220
|
+
ref: function ref() {
|
|
3221
|
+
return onRefFormInstance(form);
|
|
3222
|
+
},
|
|
2887
3223
|
autoCapitalize: disableFieldsAutoComplete ? 'off' : undefined,
|
|
2888
3224
|
autoComplete: disableFieldsAutoComplete ? 'off' : undefined,
|
|
2889
3225
|
autoCorrect: disableFieldsAutoComplete ? 'off' : undefined,
|
|
@@ -2904,7 +3240,7 @@ const FinalForm = /*#__PURE__*/React__default.default.forwardRef(function FinalF
|
|
|
2904
3240
|
textColor: descTextColor,
|
|
2905
3241
|
textWeight: descTextWeight
|
|
2906
3242
|
}, desc), submitError && !modifiedSinceLastSubmit && /*#__PURE__*/React__default.default.createElement("div", {
|
|
2907
|
-
className: clsx__default.default('notification', 'form-notification', notificationType ?
|
|
3243
|
+
className: clsx__default.default('notification', 'form-notification', notificationType ? "form-notification_" + notificationType : 'form-notification_global')
|
|
2908
3244
|
}, /*#__PURE__*/React__default.default.createElement(Notification.Notification, {
|
|
2909
3245
|
appearance: "errorPrimary sizeM solid rounded",
|
|
2910
3246
|
type: "global",
|
|
@@ -2921,9 +3257,11 @@ const FinalForm = /*#__PURE__*/React__default.default.forwardRef(function FinalF
|
|
|
2921
3257
|
direction: "vertical",
|
|
2922
3258
|
gap: fieldsGap || groupGap,
|
|
2923
3259
|
style: wrapperStyles
|
|
2924
|
-
}, Object.keys(config).map(
|
|
2925
|
-
key
|
|
2926
|
-
|
|
3260
|
+
}, Object.keys(config).map(function (key) {
|
|
3261
|
+
return generateField(config[key], {
|
|
3262
|
+
key: key
|
|
3263
|
+
}, additionalProps[config[key].name]);
|
|
3264
|
+
}), isLoading && (loader || /*#__PURE__*/React__default.default.createElement(Loader.Loader, {
|
|
2927
3265
|
appearance: loaderAppearance,
|
|
2928
3266
|
className: "form__loader",
|
|
2929
3267
|
type: loaderType,
|
|
@@ -2944,7 +3282,7 @@ const FinalForm = /*#__PURE__*/React__default.default.forwardRef(function FinalF
|
|
|
2944
3282
|
}, primaryButtonLabel ? /*#__PURE__*/React__default.default.createElement(Button.Button, {
|
|
2945
3283
|
appearance: primaryButtonAppearance,
|
|
2946
3284
|
className: "form__button-item",
|
|
2947
|
-
dataTestId: dataTestIdPrimaryButton || (name ?
|
|
3285
|
+
dataTestId: dataTestIdPrimaryButton || (name ? name + "-primary" : 'form-primary'),
|
|
2948
3286
|
dataTour: dataTourPrimaryButton,
|
|
2949
3287
|
width: "fill",
|
|
2950
3288
|
size: primaryButtonSize,
|
|
@@ -2960,7 +3298,7 @@ const FinalForm = /*#__PURE__*/React__default.default.forwardRef(function FinalF
|
|
|
2960
3298
|
}) : primaryButton, secondaryButtonLabel ? /*#__PURE__*/React__default.default.createElement(Button.Button, {
|
|
2961
3299
|
appearance: secondaryButtonAppearance,
|
|
2962
3300
|
className: "form__button-item",
|
|
2963
|
-
dataTestId: dataTestIdSecondaryButton || (name ?
|
|
3301
|
+
dataTestId: dataTestIdSecondaryButton || (name ? name + "-secondary" : 'form-secondary'),
|
|
2964
3302
|
dataTour: dataTourSecondaryButton,
|
|
2965
3303
|
width: "fill",
|
|
2966
3304
|
size: secondaryButtonSize,
|
|
@@ -3005,31 +3343,31 @@ FinalForm.defaultProps = {
|
|
|
3005
3343
|
direction: 'vertical'
|
|
3006
3344
|
};
|
|
3007
3345
|
|
|
3008
|
-
|
|
3346
|
+
var DEFAULT_MESSAGES_REQUIRED = {
|
|
3009
3347
|
required: {
|
|
3010
3348
|
key: 'required',
|
|
3011
3349
|
message: 'Обязательное поле'
|
|
3012
3350
|
}
|
|
3013
3351
|
};
|
|
3014
|
-
|
|
3352
|
+
var DEFAULT_MESSAGES_ERROR = {
|
|
3015
3353
|
invalid_value: {
|
|
3016
3354
|
key: 'error',
|
|
3017
3355
|
message: 'Некорректное значение'
|
|
3018
3356
|
}
|
|
3019
3357
|
};
|
|
3020
|
-
|
|
3358
|
+
var DEFAULT_MESSAGES_URL = {
|
|
3021
3359
|
url: {
|
|
3022
3360
|
key: 'error',
|
|
3023
3361
|
message: 'Введите корректный URL-адрес'
|
|
3024
3362
|
}
|
|
3025
3363
|
};
|
|
3026
|
-
|
|
3364
|
+
var DEFAULT_MESSAGES_PASSWORD = {
|
|
3027
3365
|
password_required: {
|
|
3028
3366
|
key: 'required',
|
|
3029
3367
|
message: 'Введите пароль'
|
|
3030
3368
|
}
|
|
3031
3369
|
};
|
|
3032
|
-
|
|
3370
|
+
var DEFAULT_MESSAGES_NUMBER = {
|
|
3033
3371
|
matches: {
|
|
3034
3372
|
key: 'error',
|
|
3035
3373
|
message: 'Допускается ввод только цифр от 0 до 9'
|
|
@@ -3039,21 +3377,23 @@ const DEFAULT_MESSAGES_NUMBER = {
|
|
|
3039
3377
|
message: 'Только числовое значение'
|
|
3040
3378
|
}
|
|
3041
3379
|
};
|
|
3042
|
-
|
|
3380
|
+
var DEFAULT_MESSAGES_MIN_MAX = {
|
|
3043
3381
|
min: {
|
|
3044
3382
|
key: 'error',
|
|
3045
|
-
message: ({
|
|
3046
|
-
min
|
|
3047
|
-
|
|
3383
|
+
message: function message(_ref) {
|
|
3384
|
+
var min = _ref.min;
|
|
3385
|
+
return "\u0417\u043D\u0430\u0447\u0435\u043D\u0438\u0435 \u0434\u043E\u043B\u0436\u043D\u043E \u0431\u044B\u0442\u044C \u043D\u0435 \u043C\u0435\u043D\u0435\u0435 " + min + " \u0441\u0438\u043C\u0432\u043E\u043B\u043E\u0432";
|
|
3386
|
+
}
|
|
3048
3387
|
},
|
|
3049
3388
|
max: {
|
|
3050
3389
|
key: 'error',
|
|
3051
|
-
message: ({
|
|
3052
|
-
max
|
|
3053
|
-
|
|
3390
|
+
message: function message(_ref2) {
|
|
3391
|
+
var max = _ref2.max;
|
|
3392
|
+
return "\u0417\u043D\u0430\u0447\u0435\u043D\u0438\u0435 \u0434\u043E\u043B\u0436\u043D\u043E \u0431\u044B\u0442\u044C \u043D\u0435 \u043C\u0435\u043D\u0435\u0435 " + max + " \u0441\u0438\u043C\u0432\u043E\u043B\u043E\u0432";
|
|
3393
|
+
}
|
|
3054
3394
|
}
|
|
3055
3395
|
};
|
|
3056
|
-
|
|
3396
|
+
var DEFAULT_MESSAGES_PHONE = {
|
|
3057
3397
|
phone_error: {
|
|
3058
3398
|
key: 'error',
|
|
3059
3399
|
message: 'Введите корректный номер телефона'
|
|
@@ -3067,7 +3407,7 @@ const DEFAULT_MESSAGES_PHONE = {
|
|
|
3067
3407
|
message: 'Укажите номер телефона'
|
|
3068
3408
|
}
|
|
3069
3409
|
};
|
|
3070
|
-
|
|
3410
|
+
var DEFAULT_MESSAGES_EMAIL = {
|
|
3071
3411
|
email_error: {
|
|
3072
3412
|
key: 'error',
|
|
3073
3413
|
message: 'Введите корректный адрес электронной почты'
|
|
@@ -3142,20 +3482,11 @@ const DEFAULT_MESSAGES_EMAIL = {
|
|
|
3142
3482
|
... etc
|
|
3143
3483
|
*/
|
|
3144
3484
|
|
|
3145
|
-
|
|
3146
|
-
...DEFAULT_MESSAGES_EMAIL,
|
|
3147
|
-
...DEFAULT_MESSAGES_ERROR,
|
|
3148
|
-
...DEFAULT_MESSAGES_MIN_MAX,
|
|
3149
|
-
...DEFAULT_MESSAGES_NUMBER,
|
|
3150
|
-
...DEFAULT_MESSAGES_PASSWORD,
|
|
3151
|
-
...DEFAULT_MESSAGES_PHONE,
|
|
3152
|
-
...DEFAULT_MESSAGES_REQUIRED,
|
|
3153
|
-
...DEFAULT_MESSAGES_URL
|
|
3154
|
-
};
|
|
3485
|
+
var DEFAULT_MESSAGES_FIELDS = Object.assign({}, DEFAULT_MESSAGES_EMAIL, DEFAULT_MESSAGES_ERROR, DEFAULT_MESSAGES_MIN_MAX, DEFAULT_MESSAGES_NUMBER, DEFAULT_MESSAGES_PASSWORD, DEFAULT_MESSAGES_PHONE, DEFAULT_MESSAGES_REQUIRED, DEFAULT_MESSAGES_URL);
|
|
3155
3486
|
|
|
3156
|
-
|
|
3157
|
-
|
|
3158
|
-
|
|
3487
|
+
var parseNumericField = function parseNumericField(value) {
|
|
3488
|
+
var numberValue = value.slice(0, 10).replace(/,/g, '.').replace(/[^\d.]/g, '');
|
|
3489
|
+
var parsedValue = parseFloat(numberValue);
|
|
3159
3490
|
if (parsedValue || parsedValue === 0) {
|
|
3160
3491
|
if (numberValue.endsWith('.')) {
|
|
3161
3492
|
if ((numberValue.match(/\./g) || []).length > 1) {
|
|
@@ -3219,22 +3550,23 @@ const parseNumericField = value => {
|
|
|
3219
3550
|
// return formErrors
|
|
3220
3551
|
// }
|
|
3221
3552
|
|
|
3222
|
-
|
|
3553
|
+
var getErrorsForFinalForm = function getErrorsForFinalForm(error) {
|
|
3554
|
+
var _error$response;
|
|
3223
3555
|
/*
|
|
3224
3556
|
* error - its an "axios" error in many cases
|
|
3225
3557
|
*/
|
|
3226
3558
|
|
|
3227
|
-
|
|
3228
|
-
|
|
3559
|
+
var formErrors = {};
|
|
3560
|
+
var serverErrors = ((_error$response = error.response) == null ? void 0 : _error$response.data) || error;
|
|
3229
3561
|
if (serverErrors) {
|
|
3230
3562
|
// Collect errors for some fields, which in the response from server
|
|
3231
3563
|
if (typeof serverErrors === 'string') {
|
|
3232
3564
|
// Server may send an html page as error data
|
|
3233
3565
|
formErrors[finalForm.FORM_ERROR] = 'Во время обработки запроса произошла ошибка, попробуйте повторить запрос';
|
|
3234
3566
|
} else {
|
|
3235
|
-
for (
|
|
3567
|
+
for (var key in serverErrors) {
|
|
3236
3568
|
// "non_field_errors" and "detail" is special keys in django to mark errors not for fields
|
|
3237
|
-
|
|
3569
|
+
var errorFieldKey = key === 'non_field_errors' || key === 'detail' ? finalForm.FORM_ERROR : key;
|
|
3238
3570
|
|
|
3239
3571
|
// Say to "react-final-form" that we have some fields errors
|
|
3240
3572
|
formErrors[errorFieldKey] = castArray__default.default(serverErrors[key])[0];
|
|
@@ -3277,6 +3609,7 @@ exports.FormFieldDadataInput = FormFieldDadataInput;
|
|
|
3277
3609
|
exports.FormFieldDatePicker = FormFieldDatePicker;
|
|
3278
3610
|
exports.FormFieldFileInput = FormFieldFileInput;
|
|
3279
3611
|
exports.FormFieldInput = FormFieldInput;
|
|
3612
|
+
exports.FormFieldInputNumber = FormFieldInputNumber;
|
|
3280
3613
|
exports.FormFieldMaskedInput = FormFieldMaskedInput;
|
|
3281
3614
|
exports.FormFieldPassword = FormFieldPassword;
|
|
3282
3615
|
exports.FormFieldRadioGroup = FormFieldRadioGroup;
|
|
@@ -3299,6 +3632,7 @@ exports.defaultFieldSizeM = defaultFieldSizeM;
|
|
|
3299
3632
|
exports.defaultFieldSizeS = defaultFieldSizeS;
|
|
3300
3633
|
exports.defaultFieldSizeXL = defaultFieldSizeXL;
|
|
3301
3634
|
exports.defaultGroupProps = defaultGroupProps;
|
|
3635
|
+
exports.defaultInputNumberProps = defaultInputNumberProps;
|
|
3302
3636
|
exports.defaultInputProps = defaultInputProps;
|
|
3303
3637
|
exports.defaultPasswordProps = defaultPasswordProps;
|
|
3304
3638
|
exports.defaultRadioProps = defaultRadioProps;
|