@itcase/forms 1.1.62 → 1.1.64

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