@itcase/forms 1.1.1 → 1.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,10 +1,9 @@
1
1
  'use strict';
2
2
 
3
3
  var libphonenumberJs = require('libphonenumber-js');
4
- var React = require('react');
4
+ var React$1 = require('react');
5
5
  var finalForm = require('final-form');
6
6
  var reactFinalForm = require('react-final-form');
7
- var PropTypes = require('prop-types');
8
7
  var clsx = require('clsx');
9
8
  var Checkbox = require('@itcase/ui/components/Checkbox');
10
9
  var Divider = require('@itcase/ui/components/Divider');
@@ -17,6 +16,7 @@ var Choice = require('@itcase/ui/components/Choice');
17
16
  var Icon = require('@itcase/ui/components/Icon');
18
17
  var Code = require('@itcase/ui/components/Code');
19
18
  var DatePicker = require('@itcase/ui/components/DatePicker');
19
+ require('prop-types');
20
20
  var axios = require('axios');
21
21
  var fileSelector = require('file-selector');
22
22
  var castArray = require('lodash/castArray');
@@ -28,6 +28,7 @@ var Input = require('@itcase/ui/components/Input');
28
28
  var Radio = require('@itcase/ui/components/Radio');
29
29
  var Segmented = require('@itcase/ui/components/Segmented');
30
30
  var Select = require('@itcase/ui/components/Select');
31
+ var icons = require('src/icons');
31
32
  var Switch = require('@itcase/ui/components/Switch');
32
33
  var Textarea = require('@itcase/ui/components/Textarea');
33
34
  var reactImask = require('react-imask');
@@ -40,8 +41,7 @@ require('apisauce');
40
41
 
41
42
  function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
42
43
 
43
- var React__default = /*#__PURE__*/_interopDefault(React);
44
- var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
44
+ var React__default = /*#__PURE__*/_interopDefault(React$1);
45
45
  var clsx__default = /*#__PURE__*/_interopDefault(clsx);
46
46
  var camelCase__default = /*#__PURE__*/_interopDefault(camelCase);
47
47
  var snakeCase__default = /*#__PURE__*/_interopDefault(snakeCase);
@@ -125,63 +125,84 @@ const makeValidate = schema => {
125
125
  };
126
126
  };
127
127
  function useYupValidationSchema(schema, language) {
128
- const validate = React.useMemo(() => schema && makeValidate(schema), [schema, language]);
128
+ const validate = React$1.useMemo(() => schema && makeValidate(schema), [schema, language]);
129
129
  return validate;
130
130
  }
131
131
 
132
+ const defaultFieldProps = {
133
+ width: 'fill',
134
+ direction: 'vertical',
135
+ dividerFill: 'errorPrimary',
136
+ errorMessageTextColor: 'errorTextPrimary',
137
+ // error
138
+ errorMessageTextSize: 's',
139
+ fill: 'surfacePrimary',
140
+ helpTextColor: 'surfaceTextQuaternary',
141
+ // messageTextSize: 's',
142
+ // messageTextColor: 'surfaceTextSecondary',
143
+ helpTextSize: 's',
144
+ labelTextColor: 'surfaceTextPrimary',
145
+ labelTextSize: 'm',
146
+ requiredMessageTextColor: 'warningTextPrimary',
147
+ // appearance depending on the type of error
148
+ // required
149
+ requiredMessageTextSize: 's',
150
+ showMessage: true
151
+ };
152
+
132
153
  function FieldWrapperBase(props) {
133
154
  const {
134
155
  id,
135
- children,
136
- isDisabled,
137
- isErrorState,
138
- isHidden,
139
- isRequired,
140
- isValidState,
141
- after,
142
- afterItem,
143
- before,
144
- beforeItem,
145
156
  className,
146
- dataTour,
157
+ type = 'normal',
158
+ label,
159
+ labelHidden,
160
+ labelTextColor,
161
+ labelTextSize,
162
+ labelTextSizeMobile,
163
+ labelTextSizeTablet,
164
+ labelTextWeight,
147
165
  desc,
148
166
  descTextColor,
149
167
  descTextSize,
150
168
  descTextWeight,
169
+ errorKey,
170
+ errorMessage,
171
+ isErrorState,
172
+ metaError,
173
+ helpTextColorSuccess,
174
+ isDisabled,
175
+ afterItem,
176
+ beforeItem,
177
+ dataTour,
151
178
  dividerDirection,
152
179
  dividerFill,
153
180
  dividerSize,
154
181
  dividerWidth,
155
- errorKey,
156
- errorMessage,
157
182
  fieldClassName,
158
183
  helpText,
159
184
  helpTextColor,
160
- helpTextColorSuccess,
161
185
  helpTextSize,
162
186
  helpTextSizeMobile,
163
187
  helpTextWeight,
164
188
  inputName,
165
189
  inputValue,
166
- label,
167
- labelHidden,
168
- labelTextColor,
169
- labelTextSize,
170
- labelTextSizeMobile,
171
- labelTextSizeTablet,
172
- labelTextWeight,
173
190
  messageTextSize,
174
191
  metaActive,
175
- metaError,
176
- set,
177
192
  showDivider,
178
193
  showMessage,
179
- tag: Tag,
180
- type
194
+ tag: Tag = 'div',
195
+ before,
196
+ after,
197
+ isHidden,
198
+ isRequired,
199
+ isValidState,
200
+ set,
201
+ children
181
202
  } = props;
182
- const formFieldClass = React.useMemo(() => 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}`), [className, isErrorState, isValidState, isRequired, metaActive, inputValue, isDisabled, metaError]);
183
- const fieldClass = React.useMemo(() => clsx__default.default(fieldClassName, isValidState && `${fieldClassName}_state_success`, metaActive && `${fieldClassName}_state_focus`, inputValue && `${fieldClassName}_state_filled`, isDisabled && `${fieldClassName}_state_disabled`, isErrorState && `${fieldClassName}_state_${errorKey}`), [fieldClassName, isErrorState, isValidState, metaActive, inputValue, isDisabled, metaError]);
184
- const validationAppearance = React.useMemo(() => {
203
+ const formFieldClass = React$1.useMemo(() => 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}`), [className, isErrorState, isValidState, isRequired, metaActive, inputValue, isDisabled, metaError]);
204
+ const fieldClass = React$1.useMemo(() => clsx__default.default(fieldClassName, isValidState && `${fieldClassName}_state_success`, metaActive && `${fieldClassName}_state_focus`, inputValue && `${fieldClassName}_state_filled`, isDisabled && `${fieldClassName}_state_disabled`, isErrorState && `${fieldClassName}_state_${errorKey}`), [fieldClassName, isErrorState, isValidState, metaActive, inputValue, isDisabled, metaError]);
205
+ const validationAppearance = React$1.useMemo(() => {
185
206
  return {
186
207
  textColor: props[`${errorKey}MessageTextColor`],
187
208
  textSize: props[`${errorKey}MessageTextSize`],
@@ -230,10 +251,10 @@ function FieldWrapperBase(props) {
230
251
  htmlFor: id
231
252
  }, /*#__PURE__*/React__default.default.createElement(Text.Text, {
232
253
  size: labelTextSize,
233
- sizeMobile: labelTextSizeMobile,
234
- sizeTablet: labelTextSizeTablet,
235
254
  textColor: labelTextColor,
236
- textWeight: labelTextWeight
255
+ textWeight: labelTextWeight,
256
+ sizeMobile: labelTextSizeMobile,
257
+ sizeTablet: labelTextSizeTablet
237
258
  }, label, labelHidden && '\u00A0')), desc && /*#__PURE__*/React__default.default.createElement("div", {
238
259
  className: "form-field__desc",
239
260
  "data-test-id": `${inputName}FieldDesc`
@@ -248,86 +269,32 @@ function FieldWrapperBase(props) {
248
269
  }, beforeItem, children, afterItem), showDivider && /*#__PURE__*/React__default.default.createElement(Divider.Divider, {
249
270
  className: "form-field__item-divider",
250
271
  width: dividerWidth,
251
- fill: dividerFill,
252
272
  direction: dividerDirection,
253
- size: dividerSize
273
+ size: dividerSize,
274
+ fill: dividerFill
254
275
  })), showMessage && /*#__PURE__*/React__default.default.createElement("div", {
255
276
  className: "form-field__message",
256
277
  "data-test-id": `${inputName}FieldMessage`
257
278
  }, isErrorState && errorMessage && /*#__PURE__*/React__default.default.createElement(Text.Text, {
258
- className: "form-field__message-item form-field__message-item_type-error",
259
- dataTestId: `${inputName}FieldMessageError`,
260
279
  id: `${inputName}-error`,
280
+ className: "form-field__message-item form-field__message-item_type-error",
261
281
  size: validationAppearance?.textSize,
262
282
  textColor: validationAppearance?.textColor,
263
- textWeight: validationAppearance?.textWeight
283
+ textWeight: validationAppearance?.textWeight,
284
+ dataTestId: `${inputName}FieldMessageError`
264
285
  }, errorMessage), Boolean(helpText) && (!isErrorState || !errorMessage) && /*#__PURE__*/React__default.default.createElement(Text.Text, {
265
286
  className: "form-field__message-item form-field__message-item_type_help-text",
266
- dataTestId: `${inputName}FieldMessageHelpText`,
267
287
  size: helpTextSize,
268
- sizeMobile: helpTextSizeMobile,
269
288
  textColor: isValidState ? helpTextColorSuccess : helpTextColor,
270
- textWeight: helpTextWeight
289
+ textWeight: helpTextWeight,
290
+ dataTestId: `${inputName}FieldMessageHelpText`,
291
+ sizeMobile: helpTextSizeMobile
271
292
  }, helpText), (!isErrorState && !helpText || isErrorState && !helpText && !errorMessage) && /*#__PURE__*/React__default.default.createElement(Text.Text, {
272
293
  className: "form-field__message-item form-field__message-item_type_help-text",
273
- dataTestId: `${inputName}FieldMessageHelpText`,
274
- size: messageTextSize
294
+ size: messageTextSize,
295
+ dataTestId: `${inputName}FieldMessageHelpText`
275
296
  }, '\u00A0')), after);
276
297
  }
277
- FieldWrapperBase.defaultProps = {
278
- errorMessageTextColor: 'errorTextPrimary',
279
- errorMessageTextSize: 's',
280
- requiredMessageTextColor: 'warningTextPrimary',
281
- requiredMessageTextSize: 's',
282
- tag: 'div',
283
- type: 'normal'
284
- };
285
- FieldWrapperBase.propTypes = {
286
- id: PropTypes__default.default.string,
287
- children: PropTypes__default.default.any,
288
- isDisabled: PropTypes__default.default.bool,
289
- isHidden: PropTypes__default.default.bool,
290
- isRequired: PropTypes__default.default.bool,
291
- after: PropTypes__default.default.any,
292
- afterItem: PropTypes__default.default.any,
293
- autoComplete: PropTypes__default.default.string,
294
- before: PropTypes__default.default.any,
295
- beforeItem: PropTypes__default.default.any,
296
- className: PropTypes__default.default.string,
297
- dataTour: PropTypes__default.default.string,
298
- desc: PropTypes__default.default.string,
299
- descTextColor: PropTypes__default.default.string,
300
- descTextSize: PropTypes__default.default.string,
301
- descTextWeight: PropTypes__default.default.string,
302
- dividerDirection: PropTypes__default.default.string,
303
- dividerFill: PropTypes__default.default.string,
304
- dividerSize: PropTypes__default.default.string,
305
- dividerWidth: PropTypes__default.default.string,
306
- fieldClassName: PropTypes__default.default.string,
307
- inputName: PropTypes__default.default.string,
308
- inputOnBlur: PropTypes__default.default.func,
309
- inputOnChange: PropTypes__default.default.func,
310
- inputOnFocus: PropTypes__default.default.func,
311
- inputValue: PropTypes__default.default.any,
312
- itemType: PropTypes__default.default.string,
313
- label: PropTypes__default.default.any,
314
- labelHidden: PropTypes__default.default.bool,
315
- labelTextColor: PropTypes__default.default.string,
316
- labelTextSize: PropTypes__default.default.string,
317
- labelTextWeight: PropTypes__default.default.string,
318
- message: PropTypes__default.default.string,
319
- messageSize: PropTypes__default.default.string,
320
- messageTextColor: PropTypes__default.default.string,
321
- messageTextSize: PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.number]),
322
- messageTextWeight: PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.number]),
323
- metaActive: PropTypes__default.default.bool,
324
- metaError: PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.bool]),
325
- set: PropTypes__default.default.string,
326
- showDivider: PropTypes__default.default.bool,
327
- showMessage: PropTypes__default.default.bool,
328
- tag: PropTypes__default.default.oneOfType([PropTypes__default.default.elementType, PropTypes__default.default.string]),
329
- type: PropTypes__default.default.string
330
- };
331
298
  function FieldWrapper(props) {
332
299
  const {
333
300
  inputName
@@ -336,14 +303,13 @@ function FieldWrapper(props) {
336
303
  change
337
304
  } = reactFinalForm.useForm(); // , mutators
338
305
 
339
- React.useEffect(() => {
306
+ React$1.useEffect(() => {
340
307
  return () => {
341
308
  change(inputName, undefined);
342
309
  };
343
310
  }, []);
344
311
  return /*#__PURE__*/React__default.default.createElement(FieldWrapperBase, props);
345
312
  }
346
- FieldWrapper.propTypes = FieldWrapperBase.propTypes;
347
313
 
348
314
  // Whether to display an error message based on "fieldProps" and meta-objects
349
315
  function useFieldValidationState(props) {
@@ -360,7 +326,7 @@ function useFieldValidationState(props) {
360
326
  const successKey = 'success';
361
327
 
362
328
  // Determines if the field is in an error state based on various conditions.
363
- const isErrorState = React.useMemo(() => {
329
+ const isErrorState = React$1.useMemo(() => {
364
330
  if (fieldProps.showErrorsOnSubmit) {
365
331
  return Boolean(meta.submitFailed && meta.touched && (meta.error || submitError));
366
332
  } else {
@@ -369,12 +335,12 @@ function useFieldValidationState(props) {
369
335
  }, [fieldProps.showErrorsOnSubmit, meta.submitFailed, meta.touched, meta.error, submitError]);
370
336
 
371
337
  // Determines if the field's input state is valid
372
- const isValidState = React.useMemo(() => {
338
+ const isValidState = React$1.useMemo(() => {
373
339
  const hasValue = Array.isArray(input?.value) ? input?.value.length : input?.value;
374
340
  const isModifiedAfterSubmit = meta.modifiedSinceLastSubmit && !meta.error && submitError;
375
341
  return Boolean(hasValue && (meta.valid || isModifiedAfterSubmit));
376
342
  }, [input?.value, meta.valid, meta.error, submitError, meta.modifiedSinceLastSubmit]);
377
- const errorMessage = React.useMemo(() => {
343
+ const errorMessage = React$1.useMemo(() => {
378
344
  // If final-form field has error in "meta" render-property.
379
345
  // If field not modified after last form submit - use submit error
380
346
  const error = meta.error || submitError || false;
@@ -412,7 +378,7 @@ function useValidationAppearanceInputProps(props) {
412
378
  } = props;
413
379
 
414
380
  // TODO: need to add props that can change during errors in this field
415
- const validationAppearanceInputProps = React.useMemo(() => {
381
+ const validationAppearanceInputProps = React$1.useMemo(() => {
416
382
  // const resultAppearanceProps = {
417
383
  // messageTextColor: props.errorMessageTextColor,
418
384
  // messageTextSize: props.errorMessageTextSize,
@@ -454,20 +420,20 @@ function useValidationAppearanceInputProps(props) {
454
420
 
455
421
  const CheckboxField = /*#__PURE__*/React__default.default.memo(function CheckboxField(props) {
456
422
  const {
457
- classNameGroupItem,
458
- fieldProps,
423
+ name,
459
424
  initialValue,
460
- inputProps,
461
425
  isDisabled,
462
- isRequired,
463
- name,
426
+ classNameGroupItem,
427
+ fieldProps = {},
428
+ inputProps = {},
464
429
  showMessage,
430
+ isRequired,
465
431
  onChange
466
432
  } = props;
467
433
  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
468
- initialValue: initialValue,
434
+ type: "checkbox",
469
435
  name: name,
470
- type: "checkbox"
436
+ initialValue: initialValue
471
437
  }, function Render({
472
438
  input,
473
439
  meta
@@ -479,67 +445,74 @@ const CheckboxField = /*#__PURE__*/React__default.default.memo(function Checkbox
479
445
  * custom React Hook function.
480
446
  */
481
447
 
482
- const onChangeField = React.useCallback(event => {
448
+ const onChangeField = React$1.useCallback(event => {
483
449
  input.onChange(event);
484
450
  if (onChange) {
485
451
  onChange(event.target.checked, input.name);
486
452
  }
487
453
  }, [onChange, input.onChange]);
488
454
  const {
489
- isErrorState,
490
- isValidState,
491
455
  errorKey,
492
- errorMessage
456
+ errorMessage,
457
+ isErrorState,
458
+ isValidState
493
459
  } = useFieldValidationState({
494
460
  fieldProps: fieldProps,
495
461
  input: input,
496
462
  meta: meta
497
463
  });
498
464
  const updatedInputProps = useValidationAppearanceInputProps({
499
- validationStateKey: isErrorState ? errorKey : 'success',
500
- inputProps: inputProps
465
+ inputProps: inputProps,
466
+ validationStateKey: isErrorState ? errorKey : 'success'
501
467
  });
502
468
  return /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
503
469
  className: clsx__default.default('form-field_type_checkbox', 'form__item_type_checkbox', classNameGroupItem),
504
470
  errorKey: errorKey,
505
471
  errorMessage: errorMessage,
472
+ isErrorState: isErrorState,
473
+ metaError: meta.error,
474
+ isDisabled: isDisabled,
506
475
  fieldClassName: "form-checkbox",
507
476
  inputName: input.name,
508
477
  inputValue: input.checked,
509
- isDisabled: isDisabled,
510
- isErrorState: isErrorState,
511
- isRequired: isRequired,
512
- isValidState: isValidState,
513
478
  metaActive: meta.active,
514
- metaError: meta.error,
515
479
  showMessage: showMessage,
516
- tag: "label"
480
+ tag: "label",
481
+ isRequired: isRequired,
482
+ isValidState: isValidState
517
483
  }, fieldProps), /*#__PURE__*/React__default.default.createElement(Checkbox.Checkbox, Object.assign({
484
+ type: "checkbox",
485
+ name: input.name,
486
+ isDisabled: isDisabled,
518
487
  autoComplete: "nope",
519
488
  checked: input.checked,
520
- isDisabled: isDisabled,
521
- name: input.name,
522
- type: "checkbox",
523
489
  onBlur: input.onBlur,
524
490
  onChange: onChangeField,
525
491
  onFocus: input.onFocus
526
492
  }, updatedInputProps)));
527
493
  });
528
494
  });
529
- CheckboxField.defaultProps = {
530
- fieldProps: {},
531
- inputProps: {}
532
- };
533
- CheckboxField.propTypes = {
534
- classNameGroupItem: PropTypes__default.default.string,
535
- fieldProps: PropTypes__default.default.object,
536
- initialValue: PropTypes__default.default.bool,
537
- inputProps: PropTypes__default.default.object,
538
- isDisabled: PropTypes__default.default.bool,
539
- isRequired: PropTypes__default.default.bool,
540
- name: PropTypes__default.default.string,
541
- showMessage: PropTypes__default.default.bool,
542
- onChange: PropTypes__default.default.func
495
+
496
+ const defaultChoiceProps = {
497
+ width: 'fill',
498
+ borderColor: 'surfaceBorderTertiary',
499
+ // error
500
+ errorBorderColor: 'errorBorderPrimary',
501
+ fill: 'surfaceSecondary',
502
+ fillActive: 'accentPrimary',
503
+ fillActiveDisabled: 'surfaceTertiary',
504
+ fillHover: 'surfacePrimaryHover',
505
+ indicatorFill: 'accentPrimary',
506
+ labelTextActiveColor: 'accentTextPrimary',
507
+ labelTextActiveColorDisabled: 'surfaceTextDisabled',
508
+ labelTextColor: 'surfaceTextPrimary',
509
+ labelTextColorDisabled: 'surfaceTextDisabled',
510
+ labelTextSize: 'm',
511
+ // appearance depending on the type of error
512
+ // required
513
+ requiredBorderColor: 'warningBorderPrimary',
514
+ shape: 'rounded',
515
+ size: 'normal'
543
516
  };
544
517
 
545
518
  const ChoiceField = /*#__PURE__*/React__default.default.memo(function ChoiceField(props) {
@@ -562,7 +535,7 @@ const ChoiceField = /*#__PURE__*/React__default.default.memo(function ChoiceFiel
562
535
  const {
563
536
  change
564
537
  } = reactFinalForm.useForm();
565
- const setActiveSegment = React.useCallback((option, isChecked) => {
538
+ const setActiveSegment = React$1.useCallback((option, isChecked) => {
566
539
  change(name, isChecked && option.value);
567
540
  if (onChange) {
568
541
  onChange(option.value, name, isChecked);
@@ -581,7 +554,7 @@ const ChoiceField = /*#__PURE__*/React__default.default.memo(function ChoiceFiel
581
554
  * React Hooks must be called in a React function component or a
582
555
  * custom React Hook function.
583
556
  */
584
- const activeOption = React.useMemo(() => {
557
+ const activeOption = React$1.useMemo(() => {
585
558
  const emptyOption = {
586
559
  value: null,
587
560
  label: null
@@ -636,25 +609,6 @@ const ChoiceField = /*#__PURE__*/React__default.default.memo(function ChoiceFiel
636
609
  }, updatedInputProps)));
637
610
  });
638
611
  });
639
- ChoiceField.propTypes = {
640
- classNameGroupItem: PropTypes__default.default.string,
641
- fieldProps: PropTypes__default.default.object,
642
- initialValue: PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.number, PropTypes__default.default.bool]),
643
- inputProps: PropTypes__default.default.object,
644
- isCheckbox: PropTypes__default.default.bool,
645
- isDisabled: PropTypes__default.default.bool,
646
- isRequired: PropTypes__default.default.bool,
647
- label: PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.element]),
648
- messageType: PropTypes__default.default.string,
649
- name: PropTypes__default.default.string,
650
- options: PropTypes__default.default.arrayOf(PropTypes__default.default.shape({
651
- label: PropTypes__default.default.string,
652
- value: PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.number])
653
- })),
654
- placeholder: PropTypes__default.default.string,
655
- showMessage: PropTypes__default.default.bool,
656
- onChange: PropTypes__default.default.func
657
- };
658
612
 
659
613
  const CustomField = /*#__PURE__*/React__default.default.memo(function CustomField(props) {
660
614
  const {
@@ -663,7 +617,7 @@ const CustomField = /*#__PURE__*/React__default.default.memo(function CustomFiel
663
617
  isRequired,
664
618
  name,
665
619
  initialValue,
666
- fieldProps,
620
+ fieldProps = {},
667
621
  classNameGroupItem,
668
622
  showMessage,
669
623
  clearIcon,
@@ -732,32 +686,17 @@ const CustomField = /*#__PURE__*/React__default.default.memo(function CustomFiel
732
686
  }));
733
687
  });
734
688
  });
735
- CustomField.defaultProps = {
736
- inputProps: {},
737
- fieldProps: {}
738
- };
739
- CustomField.propTypes = {
740
- name: PropTypes__default.default.string.isRequired,
741
- classNameGroupItem: PropTypes__default.default.string,
742
- Component: PropTypes__default.default.element,
743
- fieldProps: PropTypes__default.default.object,
744
- initialValue: PropTypes__default.default.any,
745
- inputProps: PropTypes__default.default.object,
746
- isDisabled: PropTypes__default.default.bool,
747
- isRequired: PropTypes__default.default.bool,
748
- showMessage: PropTypes__default.default.bool
749
- };
750
689
 
751
690
  const CodeField = /*#__PURE__*/React__default.default.memo(function CodeField(props) {
752
691
  const {
753
- isRequired,
754
- isDisabled,
755
692
  name,
756
- fieldProps,
757
693
  initialValue,
758
- inputProps,
694
+ isDisabled,
759
695
  classNameGroupItem,
760
- showMessage
696
+ fieldProps = {},
697
+ inputProps = {},
698
+ showMessage,
699
+ isRequired
761
700
  } = props;
762
701
  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
763
702
  name: name,
@@ -812,34 +751,38 @@ const CodeField = /*#__PURE__*/React__default.default.memo(function CodeField(pr
812
751
  }, updatedInputProps)));
813
752
  });
814
753
  });
815
- CodeField.defaultProps = {
816
- inputProps: {},
817
- fieldProps: {}
818
- };
819
- CodeField.propTypes = {
820
- classNameGroupItem: PropTypes__default.default.string,
821
- fieldProps: PropTypes__default.default.object,
822
- initialValue: PropTypes__default.default.string,
823
- inputProps: PropTypes__default.default.object,
824
- isDisabled: PropTypes__default.default.bool,
825
- isRequired: PropTypes__default.default.bool,
826
- name: PropTypes__default.default.string.isRequired,
827
- showMessage: PropTypes__default.default.bool
754
+
755
+ const defaultDatepickerProps = {
756
+ daySize: 'xs',
757
+ dayTextColor: 'surfaceTextPrimary',
758
+ dayTextShape: 'rounded',
759
+ dayTextSize: 'm',
760
+ iconFillSize: 24,
761
+ iconItemFill: 'surfaceItemPrimary',
762
+ iconSize: 14,
763
+ monthTextColor: 'surfaceTextPrimary',
764
+ monthTextSize: 'm',
765
+ monthTextWeight: 400,
766
+ placeholderTextColor: 'surfaceTextSecondary',
767
+ size: 'normal',
768
+ yearTextColor: 'surfaceTextPrimary',
769
+ yearTextSize: 'm',
770
+ yearTextWeight: 400
828
771
  };
829
772
 
830
773
  function DatePickerField(props) {
831
774
  const {
832
775
  classNameGroupItem,
833
776
  datePickerProps,
834
- fieldProps,
835
- inputProps,
777
+ fieldProps = {},
778
+ inputProps = {},
836
779
  isDisabled,
837
780
  isRequired,
838
781
  name,
839
782
  showMessage,
840
783
  onChange
841
784
  } = props;
842
- return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
785
+ return /*#__PURE__*/React.createElement(reactFinalForm.Field, {
843
786
  name: name
844
787
  }, function Render({
845
788
  input,
@@ -852,7 +795,7 @@ function DatePickerField(props) {
852
795
  * custom React Hook function.
853
796
  */
854
797
 
855
- const onChangeField = React.useCallback((startDate, endDate) => {
798
+ const onChangeField = React$1.useCallback((startDate, endDate) => {
856
799
  if (!datePickerProps.selectsRange) {
857
800
  // When we need to save single date, value is date
858
801
  // TODO: make object with one date? need to check all forms with DatePickerField
@@ -882,7 +825,7 @@ function DatePickerField(props) {
882
825
  validationStateKey: isErrorState ? errorKey : 'success',
883
826
  inputProps: inputProps
884
827
  });
885
- return /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
828
+ return /*#__PURE__*/React.createElement(FieldWrapper, Object.assign({
886
829
  className: clsx__default.default('form-field_type_datepicker', 'form__item_type_datepicker', classNameGroupItem),
887
830
  errorKey: errorKey,
888
831
  errorMessage: errorMessage,
@@ -896,7 +839,7 @@ function DatePickerField(props) {
896
839
  metaActive: meta.active,
897
840
  metaError: meta.error,
898
841
  showMessage: showMessage
899
- }, fieldProps), /*#__PURE__*/React__default.default.createElement(DatePicker.DatePickerInput, {
842
+ }, fieldProps), /*#__PURE__*/React.createElement(DatePicker.DatePickerInput, {
900
843
  datePickerProps: datePickerProps,
901
844
  inputProps: updatedInputProps,
902
845
  isDisabled: isDisabled,
@@ -909,20 +852,28 @@ function DatePickerField(props) {
909
852
  }));
910
853
  });
911
854
  }
912
- DatePickerField.defaultProps = {
913
- inputProps: {},
914
- fieldProps: {}
915
- };
916
- DatePickerField.propTypes = {
917
- name: PropTypes__default.default.string.isRequired,
918
- classNameGroupItem: PropTypes__default.default.string,
919
- datePickerProps: PropTypes__default.default.object,
920
- fieldProps: PropTypes__default.default.object,
921
- inputProps: PropTypes__default.default.object,
922
- isDisabled: PropTypes__default.default.bool,
923
- isRequired: PropTypes__default.default.bool,
924
- showMessage: PropTypes__default.default.bool,
925
- onChange: PropTypes__default.default.func
855
+
856
+ const defaultDropzoneProps = {
857
+ width: 'fill',
858
+ borderColor: 'surfaceBorderTertiary',
859
+ isPreviews: true,
860
+ borderColorHover: 'surfaceBorderQuaternary',
861
+ fill: 'surfacePrimary',
862
+ hintTitle: 'Перетащите изображение или выберите файл с компьютера',
863
+ hintTitleTextColor: 'surfaceTextPrimary',
864
+ hintTitleTextSize: 'm',
865
+ removeThumbText: 'удалить',
866
+ removeThumbTextColor: 'errorTextPrimary',
867
+ removeThumbTextHoverColor: 'errorTextPrimaryHover',
868
+ removeThumbTextSize: 's',
869
+ shape: 'rounded',
870
+ showFilename: true,
871
+ size: 'normal',
872
+ thumbBorderColor: 'surfaceBorderTertiary',
873
+ thumbBorderColorHover: 'surfaceBorderQuaternary',
874
+ thumbBorderWidth: 1,
875
+ thumbNameTextColor: 'surfaceTextPrimary',
876
+ thumbNameTextSize: 's'
926
877
  };
927
878
 
928
879
  /* globals File, FileReader, URL, console */
@@ -970,10 +921,10 @@ const FileInputDropzone = /*#__PURE__*/React__default.default.memo(function File
970
921
  const {
971
922
  change
972
923
  } = reactFinalForm.useForm();
973
- const [fileError, setFileError] = React.useState('');
974
- const [fileIsLoading, setFileIsLoading] = React.useState(false);
975
- const filesList = React.useMemo(() => inputValue ? castArray__default.default(inputValue) : [], [inputValue]);
976
- const changeFormState = React.useCallback(newFiles => {
924
+ const [fileError, setFileError] = React$1.useState('');
925
+ const [fileIsLoading, setFileIsLoading] = React$1.useState(false);
926
+ const filesList = React$1.useMemo(() => inputValue ? castArray__default.default(inputValue) : [], [inputValue]);
927
+ const changeFormState = React$1.useCallback(newFiles => {
977
928
  // If max files in dropzone is 1 - return file as it self, else as array of files
978
929
  // ps: for old projects compatibility
979
930
  const toSave = dropzoneProps.maxFiles == 1 ? newFiles[0] : newFiles;
@@ -985,7 +936,7 @@ const FileInputDropzone = /*#__PURE__*/React__default.default.memo(function File
985
936
  [dropzoneProps, change]);
986
937
 
987
938
  //
988
- const convertFiledValueAndSaveAsFiles = React.useCallback(async currentFilesList => {
939
+ const convertFiledValueAndSaveAsFiles = React$1.useCallback(async currentFilesList => {
989
940
  setFileIsLoading(true);
990
941
  const newFiles = [];
991
942
  for (const fileItem of currentFilesList) {
@@ -1003,7 +954,7 @@ const FileInputDropzone = /*#__PURE__*/React__default.default.memo(function File
1003
954
  }, [isPreviews, changeFormState]);
1004
955
 
1005
956
  // Delete file from dropzone
1006
- const removeFile = React.useCallback((event, index) => {
957
+ const removeFile = React$1.useCallback((event, index) => {
1007
958
  event.stopPropagation();
1008
959
  event.preventDefault();
1009
960
  const newFiles = [...filesList];
@@ -1078,7 +1029,7 @@ const FileInputDropzone = /*#__PURE__*/React__default.default.memo(function File
1078
1029
  }
1079
1030
  }
1080
1031
  });
1081
- React.useEffect(() => {
1032
+ React$1.useEffect(() => {
1082
1033
  const currentFilesList = castArray__default.default(inputValue);
1083
1034
  const isNeedToConvert = currentFilesList.some(fileItem => typeof fileItem === 'string');
1084
1035
  if (isNeedToConvert) {
@@ -1229,25 +1180,11 @@ const FileInputDropzone = /*#__PURE__*/React__default.default.memo(function File
1229
1180
  textWeight: errorMessageTextWeight
1230
1181
  }, fileError)));
1231
1182
  });
1232
- FileInputDropzone.propTypes = {
1233
- isPreviews: PropTypes__default.default.bool,
1234
- dropzoneProps: PropTypes__default.default.object,
1235
- hintDescription: PropTypes__default.default.string,
1236
- hintTitle: PropTypes__default.default.string,
1237
- inputName: PropTypes__default.default.string,
1238
- inputValue: PropTypes__default.default.any,
1239
- metaError: PropTypes__default.default.string,
1240
- metaTouched: PropTypes__default.default.bool,
1241
- removeThumbText: PropTypes__default.default.string,
1242
- showFilename: PropTypes__default.default.bool,
1243
- onAddFiles: PropTypes__default.default.func,
1244
- onDeleteFile: PropTypes__default.default.func
1245
- };
1246
1183
  async function getFileByURL(url) {
1247
1184
  try {
1248
1185
  const response = await axios__default.default({
1249
- responseType: 'blob',
1250
- url: url
1186
+ url: url,
1187
+ responseType: 'blob'
1251
1188
  });
1252
1189
  const blobObject = response.data;
1253
1190
  const dirtyFilename = response.headers['content-disposition']?.split('filename=')[1];
@@ -1317,22 +1254,26 @@ function setFileDataURL(file, resolve) {
1317
1254
 
1318
1255
  const FileInput = /*#__PURE__*/React__default.default.memo(function FileInput(props) {
1319
1256
  const {
1257
+ className,
1258
+ name,
1320
1259
  width,
1321
- borderWidth,
1322
- isPreviews,
1323
- isRequired,
1260
+ maxFiles,
1261
+ maxSize,
1262
+ size,
1263
+ fill,
1264
+ fillHover,
1265
+ label,
1266
+ labelTextColor,
1324
1267
  borderColorHover,
1325
1268
  borderType,
1326
- className,
1327
- classNameGroupItem,
1328
- dropzoneProps,
1269
+ borderWidth,
1329
1270
  errorMessageTextColor = 'errorTextPrimary',
1330
1271
  errorMessageTextSize = 's',
1331
1272
  errorMessageTextWeight,
1332
- fieldProps,
1333
1273
  fileErrorText,
1334
- fill,
1335
- fillHover,
1274
+ classNameGroupItem,
1275
+ dropzoneProps,
1276
+ fieldProps,
1336
1277
  hintDescription,
1337
1278
  hintDescriptionTextColor,
1338
1279
  hintDescriptionTextSize,
@@ -1343,11 +1284,6 @@ const FileInput = /*#__PURE__*/React__default.default.memo(function FileInput(pr
1343
1284
  hintTitleTextSize,
1344
1285
  hintTitleTextWeight,
1345
1286
  hintTitleTextWrap,
1346
- label,
1347
- labelTextColor,
1348
- maxFiles,
1349
- maxSize,
1350
- name,
1351
1287
  removeThumbText,
1352
1288
  removeThumbTextColor,
1353
1289
  removeThumbTextHoverColor,
@@ -1356,7 +1292,6 @@ const FileInput = /*#__PURE__*/React__default.default.memo(function FileInput(pr
1356
1292
  shape,
1357
1293
  showFilename,
1358
1294
  showMessage,
1359
- size,
1360
1295
  thumbBorderColor,
1361
1296
  thumbBorderColorHover,
1362
1297
  thumbBorderType,
@@ -1367,6 +1302,8 @@ const FileInput = /*#__PURE__*/React__default.default.memo(function FileInput(pr
1367
1302
  thumbNameTextSize,
1368
1303
  thumbNameTextWeight,
1369
1304
  thumbNameTextWrap,
1305
+ isPreviews,
1306
+ isRequired,
1370
1307
  onAddFiles,
1371
1308
  onDeleteFile
1372
1309
  } = props;
@@ -1384,10 +1321,10 @@ const FileInput = /*#__PURE__*/React__default.default.memo(function FileInput(pr
1384
1321
  */
1385
1322
 
1386
1323
  const {
1387
- isErrorState,
1388
- isValidState,
1389
1324
  errorKey,
1390
- errorMessage
1325
+ errorMessage,
1326
+ isErrorState,
1327
+ isValidState
1391
1328
  } = useFieldValidationState({
1392
1329
  fieldProps: fieldProps,
1393
1330
  input: input,
@@ -1404,33 +1341,37 @@ const FileInput = /*#__PURE__*/React__default.default.memo(function FileInput(pr
1404
1341
  return /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
1405
1342
  className: clsx__default.default('form-field_type_dropzone', 'form__item_type_dropzone', classNameGroupItem),
1406
1343
  width: width,
1344
+ label: label,
1407
1345
  labelTextColor: labelTextColor,
1408
1346
  errorKey: errorKey,
1409
1347
  errorMessage: errorMessage,
1348
+ isErrorState: isErrorState,
1349
+ metaError: meta.error,
1410
1350
  fieldClassName: "form-dropzone",
1411
1351
  inputName: input.name,
1412
1352
  inputValue: input.value,
1413
- label: label,
1414
1353
  metaActive: meta.active,
1415
- metaError: meta.error,
1416
1354
  metaTouched: meta.touched,
1417
1355
  showMessage: showMessage,
1418
- isErrorState: isErrorState,
1419
1356
  isRequired: isRequired,
1420
1357
  isValidState: isValidState
1421
1358
  }, fieldProps), /*#__PURE__*/React__default.default.createElement(FileInputDropzone, {
1422
1359
  className: className,
1360
+ maxFiles: maxFiles,
1361
+ maxSize: maxSize,
1362
+ size: size,
1423
1363
  fill: fill,
1424
1364
  fillHover: fillHover,
1425
- borderWidth: borderWidth,
1426
1365
  borderColor: updatedInputProps.borderColor,
1427
1366
  borderColorHover: borderColorHover,
1428
1367
  borderType: borderType,
1429
- dropzoneProps: dropzoneProps,
1368
+ borderWidth: borderWidth,
1430
1369
  errorMessageTextColor: errorMessageTextColor,
1431
1370
  errorMessageTextSize: errorMessageTextSize,
1432
1371
  errorMessageWeight: errorMessageTextWeight,
1433
1372
  fileErrorText: fileErrorText,
1373
+ metaError: meta.error,
1374
+ dropzoneProps: dropzoneProps,
1434
1375
  hintDescription: hintDescription,
1435
1376
  hintDescriptionTextColor: hintDescriptionTextColor,
1436
1377
  hintDescriptionTextSize: hintDescriptionTextSize,
@@ -1443,9 +1384,6 @@ const FileInput = /*#__PURE__*/React__default.default.memo(function FileInput(pr
1443
1384
  hintTitleTextWrap: hintTitleTextWrap,
1444
1385
  inputName: input.name,
1445
1386
  inputValue: input.value,
1446
- maxFiles: maxFiles,
1447
- maxSize: maxSize,
1448
- metaError: meta.error,
1449
1387
  metaTouched: meta.touched,
1450
1388
  removeThumbText: removeThumbText,
1451
1389
  removeThumbTextColor: removeThumbTextColor,
@@ -1454,7 +1392,6 @@ const FileInput = /*#__PURE__*/React__default.default.memo(function FileInput(pr
1454
1392
  removeThumbTextWeight: removeThumbTextWeight,
1455
1393
  shape: shape,
1456
1394
  showFilename: showFilename,
1457
- size: size,
1458
1395
  thumbBorderColor: thumbBorderColor,
1459
1396
  thumbBorderColorHover: thumbBorderColorHover,
1460
1397
  thumbBorderType: thumbBorderType,
@@ -1471,43 +1408,25 @@ const FileInput = /*#__PURE__*/React__default.default.memo(function FileInput(pr
1471
1408
  }));
1472
1409
  });
1473
1410
  });
1474
- FileInput.propTypes = {
1475
- isPreviews: PropTypes__default.default.bool,
1476
- isRequired: PropTypes__default.default.bool,
1477
- className: PropTypes__default.default.string,
1478
- classNameGroupItem: PropTypes__default.default.string,
1479
- classNameInput: PropTypes__default.default.string,
1480
- classNameInputWrapper: PropTypes__default.default.string,
1481
- dropzoneProps: PropTypes__default.default.object,
1482
- hintDescription: PropTypes__default.default.string,
1483
- hintTitle: PropTypes__default.default.string,
1484
- inputClass: PropTypes__default.default.string,
1485
- label: PropTypes__default.default.any,
1486
- name: PropTypes__default.default.string.isRequired,
1487
- removeThumbText: PropTypes__default.default.string,
1488
- showFilename: PropTypes__default.default.bool,
1489
- onAddFiles: PropTypes__default.default.func,
1490
- onDeleteFile: PropTypes__default.default.func
1491
- };
1492
1411
 
1493
1412
  const Group = /*#__PURE__*/React__default.default.memo(function Group(props) {
1494
1413
  const {
1495
- children,
1496
- isHidden,
1497
- after,
1498
- before,
1499
1414
  className,
1500
- dataTour,
1415
+ name,
1501
1416
  label,
1502
1417
  labelTextColor,
1503
1418
  labelTextSize,
1504
1419
  labelTextWeight,
1505
1420
  message,
1506
- messageTextColor,
1507
- messageTextSize,
1421
+ dataTour,
1422
+ messageTextColor = 'surfaceTextTertiary',
1423
+ messageTextSize = 's',
1508
1424
  messageTextWeight,
1509
- name,
1510
- showGroupMessage
1425
+ showGroupMessage,
1426
+ before,
1427
+ after,
1428
+ isHidden,
1429
+ children
1511
1430
  } = props;
1512
1431
  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
1513
1432
  name: name
@@ -1565,20 +1484,22 @@ const Group = /*#__PURE__*/React__default.default.memo(function Group(props) {
1565
1484
  }, '\u00A0')));
1566
1485
  });
1567
1486
  });
1568
- Group.defaultProps = {
1569
- errorMessageTextColor: 'errorTextPrimary',
1570
- errorMessageTextSize: 's',
1571
- fieldProps: {},
1572
- inputProps: {},
1573
- messageTextColor: 'surfaceTextTertiary',
1574
- messageTextSize: 's',
1575
- type: 'normal'
1576
- };
1577
- Group.propTypes = {
1578
- isRequired: PropTypes__default.default.bool,
1579
- fieldProps: PropTypes__default.default.object,
1580
- inputProps: PropTypes__default.default.object,
1581
- name: PropTypes__default.default.string.isRequired
1487
+
1488
+ const defaultInputProps = {
1489
+ width: 'fill',
1490
+ borderColor: 'surfaceBorderTertiary',
1491
+ caret: 'secondaryItemSecondary',
1492
+ // error
1493
+ errorBorderColor: 'errorBorderPrimary',
1494
+ placeholderTextColor: 'surfaceTextQuaternary',
1495
+ // appearance depending on the type of error
1496
+ // required
1497
+ requiredBorderColor: 'warningBorderPrimary',
1498
+ shape: 'rounded',
1499
+ size: 'm',
1500
+ textColor: 'surfaceTextPrimary',
1501
+ textColorDisabled: 'surfaceTextDisabled',
1502
+ textSize: 'm'
1582
1503
  };
1583
1504
 
1584
1505
  const InputField = /*#__PURE__*/React__default.default.memo(function InputField(props) {
@@ -1596,7 +1517,8 @@ const InputField = /*#__PURE__*/React__default.default.memo(function InputField(
1596
1517
  clearIconFillHover,
1597
1518
  clearIconShape,
1598
1519
  clearIconSize,
1599
- fieldProps,
1520
+ fieldProps = {},
1521
+ inputProps = {},
1600
1522
  iconFill,
1601
1523
  iconFillHover,
1602
1524
  iconRevealableHide,
@@ -1604,22 +1526,21 @@ const InputField = /*#__PURE__*/React__default.default.memo(function InputField(
1604
1526
  iconShape,
1605
1527
  iconSize,
1606
1528
  initialValue,
1607
- inputProps,
1608
1529
  name,
1609
1530
  parse,
1610
1531
  showMessage,
1611
1532
  onChange,
1612
1533
  onClickClearIcon
1613
1534
  } = props;
1614
- const [isRevealed, setIsRevealed] = React.useState(false);
1615
- const inputType = React.useMemo(() => {
1535
+ const [isRevealed, setIsRevealed] = React$1.useState(false);
1536
+ const inputType = React$1.useMemo(() => {
1616
1537
  if (isPassword) {
1617
1538
  return isRevealed ? 'text' : 'password';
1618
1539
  } else {
1619
1540
  return 'text';
1620
1541
  }
1621
1542
  }, [isRevealed, isPassword]);
1622
- const onClickIconReveal = React.useCallback(event => {
1543
+ const onClickIconReveal = React$1.useCallback(event => {
1623
1544
  event.preventDefault();
1624
1545
  setIsRevealed(prev => !prev);
1625
1546
  }, []);
@@ -1638,7 +1559,7 @@ const InputField = /*#__PURE__*/React__default.default.memo(function InputField(
1638
1559
  * custom React Hook function.
1639
1560
  */
1640
1561
 
1641
- const onChangeField = React.useCallback(event => {
1562
+ const onChangeField = React$1.useCallback(event => {
1642
1563
  input.onChange(event);
1643
1564
  if (onChange) {
1644
1565
  onChange(event.target.value, input.name);
@@ -1704,113 +1625,65 @@ const InputField = /*#__PURE__*/React__default.default.memo(function InputField(
1704
1625
  }));
1705
1626
  });
1706
1627
  });
1707
- InputField.defaultProps = {
1708
- fieldProps: {},
1709
- inputProps: {}
1710
- };
1711
- InputField.propTypes = {
1712
- isDisabled: PropTypes__default.default.bool,
1713
- isPassword: PropTypes__default.default.bool,
1714
- isRequired: PropTypes__default.default.bool,
1715
- isRevealable: PropTypes__default.default.bool,
1716
- classNameGroupItem: PropTypes__default.default.string,
1717
- dataTestId: PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.number]),
1718
- fieldProps: PropTypes__default.default.object,
1719
- iconBorder: PropTypes__default.default.string,
1720
- iconBorderHover: PropTypes__default.default.string,
1721
- iconFill: PropTypes__default.default.string,
1722
- iconFillHover: PropTypes__default.default.string,
1723
- iconRevealableHide: PropTypes__default.default.oneOfType([PropTypes__default.default.elementType, PropTypes__default.default.func, PropTypes__default.default.object]),
1724
- iconRevealableShow: PropTypes__default.default.oneOfType([PropTypes__default.default.elementType, PropTypes__default.default.func, PropTypes__default.default.object]),
1725
- // iconShape: PropTypes.oneOf(shapeProps),
1726
- // iconSize: PropTypes.oneOf(iconSizeProps),
1727
- initialValue: PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.number]),
1728
- inputProps: PropTypes__default.default.object,
1729
- name: PropTypes__default.default.string.isRequired,
1730
- parse: PropTypes__default.default.func,
1731
- showMessage: PropTypes__default.default.bool,
1732
- onChange: PropTypes__default.default.func
1733
- };
1734
1628
 
1735
- function RadioGroupItem(props) {
1629
+ function RadioGroupInput(props) {
1736
1630
  const {
1737
1631
  input,
1738
- option,
1739
- onChange,
1740
- inputProps
1632
+ value,
1633
+ onChange
1741
1634
  } = props;
1742
- const onChangeField = React.useCallback(event => {
1743
- if (event.target.checked) {
1744
- onChange(option.value);
1745
- }
1746
- }, [onChange]);
1747
- return /*#__PURE__*/React__default.default.createElement(Radio.Radio, Object.assign({
1748
- className: "form-radio__item",
1749
- checked: option.value === input.value,
1635
+ const onChangeField = React$1.useCallback(event => onChange(event.target.value), [onChange]);
1636
+ return /*#__PURE__*/React.createElement(Input.Input, Object.assign({
1750
1637
  name: input.name,
1751
- type: "radio",
1752
- value: option.value,
1638
+ autoComplete: "nope",
1639
+ value: value,
1753
1640
  onBlur: input.onBlur,
1754
1641
  onChange: onChangeField,
1755
- onFocus: input.onFocus,
1756
- label: option.label
1757
- }, inputProps));
1642
+ onFocus: input.onFocus
1643
+ }, props));
1758
1644
  }
1759
- RadioGroupItem.propTypes = {
1760
- inputProps: PropTypes__default.default.object,
1761
- onChange: PropTypes__default.default.func,
1762
- option: PropTypes__default.default.shape({
1763
- label: PropTypes__default.default.string,
1764
- value: PropTypes__default.default.string
1765
- }),
1766
- input: PropTypes__default.default.shape({
1767
- name: PropTypes__default.default.string,
1768
- value: PropTypes__default.default.string,
1769
- onBlur: PropTypes__default.default.func,
1770
- onFocus: PropTypes__default.default.func,
1771
- onChange: PropTypes__default.default.func
1772
- })
1773
- };
1774
1645
 
1775
- function RadioGroupInput(props) {
1646
+ function RadioGroupItem(props) {
1776
1647
  const {
1777
1648
  input,
1778
- value,
1649
+ inputProps,
1650
+ option,
1779
1651
  onChange
1780
1652
  } = props;
1781
- const onChangeField = React.useCallback(event => onChange(event.target.value), [onChange]);
1782
- return /*#__PURE__*/React__default.default.createElement(Input.Input, Object.assign({
1783
- autoComplete: "nope",
1653
+ const onChangeField = React$1.useCallback(event => {
1654
+ if (event.target.checked) {
1655
+ onChange(option.value);
1656
+ }
1657
+ }, [onChange]);
1658
+ return /*#__PURE__*/React.createElement(Radio.Radio, Object.assign({
1659
+ className: "form-radio__item",
1660
+ type: "radio",
1784
1661
  name: input.name,
1662
+ label: option.label,
1663
+ checked: option.value === input.value,
1664
+ value: option.value,
1785
1665
  onBlur: input.onBlur,
1786
1666
  onChange: onChangeField,
1787
- onFocus: input.onFocus,
1788
- value: value
1789
- }, props));
1667
+ onFocus: input.onFocus
1668
+ }, inputProps));
1790
1669
  }
1791
- RadioGroupInput.propTypes = {
1792
- input: PropTypes__default.default.string,
1793
- value: PropTypes__default.default.string,
1794
- editableProps: PropTypes__default.default.object,
1795
- onChange: PropTypes__default.default.func
1796
- };
1797
1670
 
1798
1671
  function RadioGroupList(props) {
1799
1672
  const {
1673
+ editableProps,
1800
1674
  input,
1675
+ inputProps,
1801
1676
  options,
1802
- editableProps,
1803
- onChange,
1804
- inputProps
1677
+ onChange
1805
1678
  } = props;
1806
- const [editableValue, setEditableValue] = React.useState(() => {
1679
+ const [editableValue, setEditableValue] = React$1.useState(() => {
1807
1680
  const isRadioValue = options.find(option => option.value === input.value);
1808
1681
  if (!isRadioValue) {
1809
1682
  return input.value;
1810
1683
  }
1811
1684
  return '';
1812
1685
  });
1813
- React.useEffect(() => {
1686
+ React$1.useEffect(() => {
1814
1687
  // When a new value from outside enters the form
1815
1688
  if (input.value) {
1816
1689
  // Check value for radio type
@@ -1824,7 +1697,7 @@ function RadioGroupList(props) {
1824
1697
  }, [input.value]);
1825
1698
 
1826
1699
  // Callback for value changes
1827
- const onChangeSomeInput = React.useCallback(value => {
1700
+ const onChangeSomeInput = React$1.useCallback(value => {
1828
1701
  // Save to form values
1829
1702
  input.onChange(value);
1830
1703
  if (onChange) {
@@ -1834,53 +1707,43 @@ function RadioGroupList(props) {
1834
1707
  }, [input, onChange]);
1835
1708
 
1836
1709
  // Handle for radio inputs
1837
- const onChangeRadio = React.useCallback(value => {
1710
+ const onChangeRadio = React$1.useCallback(value => {
1838
1711
  setEditableValue('');
1839
1712
  onChangeSomeInput(value);
1840
1713
  }, [onChangeSomeInput]);
1841
1714
 
1842
1715
  // Handle for text input
1843
- const onChangeEditable = React.useCallback(value => {
1716
+ const onChangeEditable = React$1.useCallback(value => {
1844
1717
  setEditableValue(value);
1845
1718
  onChangeSomeInput(value);
1846
1719
  }, [onChangeSomeInput]);
1847
1720
  return /*#__PURE__*/React__default.default.createElement(React__default.default.Fragment, null, options.map(option => option.editable ? /*#__PURE__*/React__default.default.createElement(RadioGroupInput, {
1848
1721
  key: option.label,
1722
+ editableProps: editableProps,
1849
1723
  input: input,
1850
- value: editableValue,
1724
+ inputProps: inputProps,
1851
1725
  option: option,
1852
- onChange: onChangeEditable,
1853
- editableProps: editableProps,
1854
- inputProps: inputProps
1726
+ value: editableValue,
1727
+ onChange: onChangeEditable
1855
1728
  }) : /*#__PURE__*/React__default.default.createElement(RadioGroupItem, {
1856
1729
  key: option.value,
1857
1730
  input: input,
1731
+ inputProps: inputProps,
1858
1732
  option: option,
1859
- onChange: onChangeRadio,
1860
- inputProps: inputProps
1733
+ onChange: onChangeRadio
1861
1734
  })));
1862
1735
  }
1863
- RadioGroupList.propTypes = {
1864
- editableProps: PropTypes__default.default.object,
1865
- input: PropTypes__default.default.object,
1866
- inputProps: PropTypes__default.default.object,
1867
- options: PropTypes__default.default.arrayOf(PropTypes__default.default.shape({
1868
- value: PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.number, PropTypes__default.default.bool]),
1869
- label: PropTypes__default.default.string
1870
- })),
1871
- onChange: PropTypes__default.default.func
1872
- };
1873
1736
 
1874
1737
  const RadioGroup = /*#__PURE__*/React__default.default.memo(function RadioGroup(props) {
1875
1738
  const {
1876
- editableProps,
1877
- fieldProps,
1878
- inputProps,
1739
+ name,
1879
1740
  isDisabled,
1880
- isRequired,
1881
- name,
1882
- options,
1741
+ editableProps = {},
1742
+ fieldProps = {},
1743
+ inputProps = {},
1744
+ options = [],
1883
1745
  showMessage,
1746
+ isRequired,
1884
1747
  onChange
1885
1748
  } = props;
1886
1749
  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
@@ -1914,42 +1777,42 @@ const RadioGroup = /*#__PURE__*/React__default.default.memo(function RadioGroup(
1914
1777
  className: "form__item_type_radio",
1915
1778
  errorKey: errorKey,
1916
1779
  errorMessage: errorMessage,
1780
+ isErrorState: isErrorState,
1781
+ metaError: meta.error,
1782
+ isDisabled: isDisabled,
1917
1783
  fieldClassName: 'form-radio',
1918
1784
  inputName: input.name,
1919
1785
  inputValue: input.value || '',
1920
- isDisabled: isDisabled,
1921
- isErrorState: isErrorState,
1922
- isRequired: isRequired,
1923
- isValidState: isValidState,
1924
1786
  metaActive: meta.active,
1925
- metaError: meta.error,
1926
- showMessage: showMessage
1787
+ showMessage: showMessage,
1788
+ isRequired: isRequired,
1789
+ isValidState: isValidState
1927
1790
  }, fieldProps), /*#__PURE__*/React__default.default.createElement(RadioGroupList, {
1791
+ isDisabled: isDisabled,
1928
1792
  editableProps: editableProps,
1929
1793
  input: input,
1930
1794
  inputProps: updatedInputProps,
1931
- isDisabled: isDisabled,
1932
1795
  options: options,
1933
1796
  onChange: onChange
1934
1797
  }));
1935
1798
  });
1936
1799
  });
1937
- RadioGroup.defaultProps = {
1938
- editableProps: {},
1939
- fieldProps: {},
1940
- inputProps: {},
1941
- options: []
1942
- };
1943
- RadioGroup.propTypes = {
1944
- name: PropTypes__default.default.string.isRequired,
1945
- editableProps: PropTypes__default.default.object,
1946
- fieldProps: PropTypes__default.default.object,
1947
- inputProps: PropTypes__default.default.object,
1948
- isDisabled: PropTypes__default.default.bool,
1949
- isRequired: PropTypes__default.default.bool,
1950
- options: PropTypes__default.default.array,
1951
- showMessage: PropTypes__default.default.bool,
1952
- onChange: PropTypes__default.default.func
1800
+
1801
+ const defaultSegmentedProps = {
1802
+ width: 'fill',
1803
+ // error
1804
+ errorLabelTextColor: 'errorTextPrimary',
1805
+ fill: 'surfaceSecondary',
1806
+ fillHover: 'surfacePrimaryHover',
1807
+ indicatorFill: 'accentPrimary',
1808
+ labelTextActiveColor: 'accentTextPrimary',
1809
+ labelTextColor: 'surfaceTextPrimary',
1810
+ labelTextSize: 'm',
1811
+ // appearance depending on the type of error
1812
+ // required
1813
+ requiredLabelTextColor: 'warningTextPrimary',
1814
+ shape: 'rounded',
1815
+ size: 'normal'
1953
1816
  };
1954
1817
 
1955
1818
  function SegmentedField(props) {
@@ -1965,7 +1828,7 @@ function SegmentedField(props) {
1965
1828
  const {
1966
1829
  change
1967
1830
  } = reactFinalForm.useForm();
1968
- const setActiveSegment = React.useCallback(option => {
1831
+ const setActiveSegment = React$1.useCallback(option => {
1969
1832
  change(name, option.value);
1970
1833
  }, [change]);
1971
1834
  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
@@ -1981,7 +1844,7 @@ function SegmentedField(props) {
1981
1844
  * custom React Hook function.
1982
1845
  */
1983
1846
 
1984
- const activeOption = React.useMemo(() => {
1847
+ const activeOption = React$1.useMemo(() => {
1985
1848
  const emptyOption = {
1986
1849
  value: null,
1987
1850
  label: null
@@ -2028,18 +1891,73 @@ function SegmentedField(props) {
2028
1891
  }, updatedInputProps)));
2029
1892
  });
2030
1893
  }
2031
- SegmentedField.propTypes = {
2032
- name: PropTypes__default.default.string.isRequired,
2033
- options: PropTypes__default.default.array.isRequired,
2034
- className: PropTypes__default.default.string,
2035
- fieldProps: PropTypes__default.default.object,
2036
- inputClass: PropTypes__default.default.string,
2037
- inputProps: PropTypes__default.default.object,
2038
- isDisabled: PropTypes__default.default.bool,
2039
- isRequired: PropTypes__default.default.bool,
2040
- label: PropTypes__default.default.string,
2041
- placeholder: PropTypes__default.default.string,
2042
- showMessage: PropTypes__default.default.bool
1894
+
1895
+ const defaultSelectProps = {
1896
+ elevation: 8,
1897
+ isClearable: true,
1898
+ isSearchable: true,
1899
+ badgeAppearance: 'accent',
1900
+ badgeSize: 'm',
1901
+ badgeTextSize: 'm',
1902
+ clearIcon: icons.icon24.Clear,
1903
+ clearIconFill: 'surfaceItemPrimary',
1904
+ closeMenuOnSelect: true,
1905
+ // optionSelected: <Icon iconFill="surfaceItemAccent" SvgImage={icon24.Check} />,
1906
+
1907
+ dividerDirection: 'horizontal',
1908
+ dividerFill: 'surfaceTertiary',
1909
+ dividerSize: 'xxs',
1910
+ dropdownIcon: icons.icon24.ChevronDownSmall,
1911
+ dropdownIconFill: 'surfaceItemPrimary',
1912
+ // error
1913
+ errorInputBorderColor: 'errorBorderPrimary',
1914
+ headingFill: 'surfaceSecondary',
1915
+ headingTextColor: 'surfaceTextPrimary',
1916
+ headingTextSize: 'm',
1917
+ headingTextWeight: '600',
1918
+ inputBorderColor: 'surfaceBorderTertiary',
1919
+ inputBorderColorHover: 'surfaceBorderQuaternary',
1920
+ inputCaretColor: 'secondaryItemPrimary',
1921
+ inputFill: 'surfacePrimary',
1922
+ inputShape: 'rounded',
1923
+ inputTextColor: 'surfaceTextPrimary',
1924
+ inputTextSize: 'm',
1925
+ loadingMessage: /*#__PURE__*/React__default.default.createElement(Loader.Loader, {
1926
+ width: "fill",
1927
+ height: "fill",
1928
+ fill: "surfacePrimary",
1929
+ position: "absolute",
1930
+ left: "0px",
1931
+ right: "0px",
1932
+ zIndex: "1",
1933
+ itemFill: "surfaceItemAccent",
1934
+ set: "simple"
1935
+ }),
1936
+ multipleItemFill: 'accentPrimary',
1937
+ multipleItemFillHover: 'accentPrimaryHover',
1938
+ multipleItemIcon: icons.icon14.Remove,
1939
+ multipleItemIconFill: 'accentItemPrimary',
1940
+ multipleItemTextColor: 'accentTextPrimary',
1941
+ multipleItemTextSize: 'm',
1942
+ noOptionsSearchText: 'Ничего не найдено...',
1943
+ noOptionsText: 'Список пуст',
1944
+ noOptionsTextColor: 'surfaceTextPrimary',
1945
+ noOptionsTextSize: 'm',
1946
+ optionBorder: 'none',
1947
+ optionFill: 'surfacePrimary',
1948
+ optionFillHover: 'surfacePrimaryHover',
1949
+ optionShape: 'rounded',
1950
+ optionTextColor: 'surfaceTextPrimary',
1951
+ optionTextSize: 'm',
1952
+ placeholder: 'Выбрать...',
1953
+ placeholderTextColor: 'surfaceTextQuaternary',
1954
+ placeholderTextSize: 'm',
1955
+ // appearance depending on the type of error
1956
+ // required
1957
+ requiredInputBorderColor: 'warningBorderPrimary',
1958
+ showBadge: false,
1959
+ showDivider: true,
1960
+ size: 'm'
2043
1961
  };
2044
1962
 
2045
1963
  function getDefaultValue(options, selectValue) {
@@ -2088,8 +2006,8 @@ const SelectField = /*#__PURE__*/React__default.default.memo(function SelectFiel
2088
2006
  * React Hooks must be called in a React function component or a
2089
2007
  * custom React Hook function.
2090
2008
  */
2091
- const [selectedOptions, setSelectedOptions] = React.useState(null);
2092
- const defaultValue = React.useMemo(() => {
2009
+ const [selectedOptions, setSelectedOptions] = React$1.useState(null);
2010
+ const defaultValue = React$1.useMemo(() => {
2093
2011
  const optionsValues = getDefaultValue(options, input.value);
2094
2012
  if (!optionsValues.length && input.value?.length) {
2095
2013
  optionsValues.push({
@@ -2099,18 +2017,18 @@ const SelectField = /*#__PURE__*/React__default.default.memo(function SelectFiel
2099
2017
  }
2100
2018
  return optionsValues;
2101
2019
  }, [input.value]);
2102
- const onChangeField = React.useCallback(value => {
2020
+ const onChangeField = React$1.useCallback(value => {
2103
2021
  input.onChange(value);
2104
2022
  if (onChange) {
2105
2023
  onChange(value, input.name);
2106
2024
  }
2107
2025
  }, [onChange, input.onChange]);
2108
- const onChangeValue = React.useCallback((option, actionMeta) => {
2026
+ const onChangeValue = React$1.useCallback((option, actionMeta) => {
2109
2027
  const value = Array.isArray(option) ? option.map(o => o.value) : option?.value || null;
2110
2028
  setSelectedOptions(option);
2111
2029
  onChangeField(value);
2112
2030
  }, [onChangeField]);
2113
- React.useEffect(() => {
2031
+ React$1.useEffect(() => {
2114
2032
  setSelectedOptions(defaultValue);
2115
2033
  }, [defaultValue]);
2116
2034
  const {
@@ -2131,48 +2049,34 @@ const SelectField = /*#__PURE__*/React__default.default.memo(function SelectFiel
2131
2049
  className: clsx__default.default('form-field_type_select', 'form__item_type_select', classNameGroupItem),
2132
2050
  errorKey: errorKey,
2133
2051
  errorMessage: errorMessage,
2052
+ isErrorState: isErrorState,
2053
+ metaError: meta.error,
2054
+ isDisabled: isDisabled,
2134
2055
  fieldClassName: 'form-select',
2135
2056
  inputName: input.name,
2136
2057
  inputValue: input.value,
2137
2058
  metaActive: meta.active,
2138
- metaError: meta.error,
2139
2059
  showMessage: showMessage,
2140
- isDisabled: isDisabled,
2141
- isErrorState: isErrorState,
2142
2060
  isRequired: isRequired,
2143
2061
  isValidState: isValidState
2144
2062
  }, fieldProps), /*#__PURE__*/React__default.default.createElement(Select.Select, Object.assign({
2145
2063
  className: "form-select-item",
2146
- ref: selectRef,
2064
+ isDisabled: isDisabled,
2147
2065
  instanceId: `id_${input.name}`,
2148
2066
  options: options,
2067
+ ref: selectRef,
2149
2068
  value: selectedOptions,
2150
- isDisabled: isDisabled,
2151
2069
  onChange: onChangeValue,
2152
2070
  onInputChange: onInputChange
2153
2071
  }, updatedSelectProps)));
2154
2072
  });
2155
2073
  });
2156
- SelectField.propTypes = {
2157
- isDisabled: PropTypes__default.default.bool,
2158
- isRequired: PropTypes__default.default.bool,
2159
- classNameGroupItem: PropTypes__default.default.string,
2160
- fieldProps: PropTypes__default.default.object,
2161
- label: PropTypes__default.default.any,
2162
- messageType: PropTypes__default.default.string,
2163
- name: PropTypes__default.default.string.isRequired,
2164
- options: PropTypes__default.default.array,
2165
- selectProps: PropTypes__default.default.object,
2166
- selectRef: PropTypes__default.default.any,
2167
- showMessage: PropTypes__default.default.bool,
2168
- onChange: PropTypes__default.default.func
2169
- };
2170
2074
 
2171
2075
  const SwitchField = /*#__PURE__*/React__default.default.memo(function SwitchField(props) {
2172
2076
  const {
2173
2077
  classNameGroupItem,
2174
- fieldProps,
2175
- inputProps,
2078
+ fieldProps = {},
2079
+ inputProps = {},
2176
2080
  isDisabled,
2177
2081
  isRequired,
2178
2082
  name,
@@ -2193,7 +2097,7 @@ const SwitchField = /*#__PURE__*/React__default.default.memo(function SwitchFiel
2193
2097
  * custom React Hook function.
2194
2098
  */
2195
2099
 
2196
- const onChangeField = React.useCallback(event => {
2100
+ const onChangeField = React$1.useCallback(event => {
2197
2101
  input.onChange(event);
2198
2102
  if (onChange) {
2199
2103
  onChange(event.target.checked, input.name);
@@ -2240,30 +2144,32 @@ const SwitchField = /*#__PURE__*/React__default.default.memo(function SwitchFiel
2240
2144
  }, updatedInputProps)));
2241
2145
  });
2242
2146
  });
2243
- SwitchField.defaultProps = {
2244
- fieldProps: {},
2245
- inputProps: {}
2246
- };
2247
- SwitchField.propTypes = {
2248
- classNameGroupItem: PropTypes__default.default.string,
2249
- fieldProps: PropTypes__default.default.object,
2250
- inputProps: PropTypes__default.default.object,
2251
- isDisabled: PropTypes__default.default.bool,
2252
- isRequired: PropTypes__default.default.bool,
2253
- name: PropTypes__default.default.string,
2254
- showMessage: PropTypes__default.default.bool,
2255
- onChange: PropTypes__default.default.func
2147
+
2148
+ const defaultTextareaProps = {
2149
+ width: 'fill',
2150
+ borderColor: 'surfaceBorderTertiary',
2151
+ borderHover: 'surfaceBorderQuaternary',
2152
+ caret: 'secondaryItemSecondary',
2153
+ // error
2154
+ errorBorderColor: 'errorBorderPrimary',
2155
+ placeholderTextColor: 'surfaceTextSecondary',
2156
+ // appearance depending on the type of error
2157
+ // required
2158
+ requiredBorderColor: 'warningBorderPrimary',
2159
+ shape: 'rounded',
2160
+ textColor: 'surfaceTextPrimary',
2161
+ textSize: 's'
2256
2162
  };
2257
2163
 
2258
2164
  const TextareaField = /*#__PURE__*/React__default.default.memo(function TextareaField(props) {
2259
2165
  const {
2260
- isRequired,
2261
- isDisabled,
2262
2166
  name,
2263
- fieldProps,
2264
- inputProps,
2167
+ isDisabled,
2265
2168
  classNameGroupItem,
2266
- showMessage
2169
+ fieldProps = {},
2170
+ inputProps = {},
2171
+ showMessage,
2172
+ isRequired
2267
2173
  } = props;
2268
2174
  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
2269
2175
  name: name
@@ -2279,37 +2185,37 @@ const TextareaField = /*#__PURE__*/React__default.default.memo(function Textarea
2279
2185
  */
2280
2186
 
2281
2187
  const {
2282
- isErrorState,
2283
- isValidState,
2284
2188
  errorKey,
2285
- errorMessage
2189
+ errorMessage,
2190
+ isErrorState,
2191
+ isValidState
2286
2192
  } = useFieldValidationState({
2287
2193
  fieldProps: fieldProps,
2288
2194
  input: input,
2289
2195
  meta: meta
2290
2196
  });
2291
2197
  const updatedInputProps = useValidationAppearanceInputProps({
2292
- validationStateKey: isErrorState ? errorKey : 'success',
2293
- inputProps: inputProps
2198
+ inputProps: inputProps,
2199
+ validationStateKey: isErrorState ? errorKey : 'success'
2294
2200
  });
2295
2201
  return /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
2296
2202
  className: clsx__default.default('form-field_type_textarea', 'form__item_type_textarea', classNameGroupItem),
2297
2203
  errorKey: errorKey,
2298
2204
  errorMessage: errorMessage,
2205
+ isErrorState: isErrorState,
2206
+ metaError: meta.error,
2207
+ isDisabled: isDisabled,
2299
2208
  fieldClassName: 'form-textarea',
2300
2209
  inputName: input.name,
2301
2210
  inputValue: input.value,
2302
- isDisabled: isDisabled,
2303
- isErrorState: isErrorState,
2304
- isRequired: isRequired,
2305
- isValidState: isValidState,
2306
2211
  metaActive: meta.active,
2307
- metaError: meta.error,
2308
- showMessage: showMessage
2212
+ showMessage: showMessage,
2213
+ isRequired: isRequired,
2214
+ isValidState: isValidState
2309
2215
  }, fieldProps), /*#__PURE__*/React__default.default.createElement(Textarea.Textarea, Object.assign({
2310
- autoComplete: "nope",
2311
- isDisabled: isDisabled,
2312
2216
  name: input.name,
2217
+ isDisabled: isDisabled,
2218
+ autoComplete: "nope",
2313
2219
  value: input.value,
2314
2220
  onBlur: input.onBlur,
2315
2221
  onChange: input.onChange,
@@ -2317,42 +2223,29 @@ const TextareaField = /*#__PURE__*/React__default.default.memo(function Textarea
2317
2223
  }, updatedInputProps)));
2318
2224
  });
2319
2225
  });
2320
- TextareaField.defaultProps = {
2321
- inputProps: {},
2322
- fieldProps: {}
2323
- };
2324
- TextareaField.propTypes = {
2325
- name: PropTypes__default.default.string.isRequired,
2326
- classNameGroupItem: PropTypes__default.default.string,
2327
- fieldProps: PropTypes__default.default.object,
2328
- inputProps: PropTypes__default.default.object,
2329
- isDisabled: PropTypes__default.default.bool,
2330
- isRequired: PropTypes__default.default.bool,
2331
- showMessage: PropTypes__default.default.bool
2332
- };
2333
2226
 
2334
2227
  const MaskedInputField = /*#__PURE__*/React__default.default.memo(function MaskedInputField(props) {
2335
2228
  const {
2336
- isDisabled,
2337
- isRequired,
2338
2229
  name,
2339
2230
  initialValue,
2340
- fieldProps,
2231
+ isDisabled,
2341
2232
  classNameGroupItem,
2342
- showMessage,
2343
- inputProps,
2344
- optionsMask,
2345
- unmasked,
2346
2233
  clearIcon,
2347
2234
  clearIconFill,
2348
2235
  clearIconFillHover,
2349
2236
  clearIconShape,
2350
2237
  clearIconSize,
2238
+ fieldProps = {},
2239
+ inputProps = {},
2240
+ optionsMask,
2241
+ showMessage,
2242
+ unmasked,
2243
+ isRequired,
2351
2244
  onClickClearIcon
2352
2245
  } = props;
2353
2246
  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
2354
- initialValue: initialValue,
2355
- name: name
2247
+ name: name,
2248
+ initialValue: initialValue
2356
2249
  }, function Render({
2357
2250
  input,
2358
2251
  meta
@@ -2366,8 +2259,8 @@ const MaskedInputField = /*#__PURE__*/React__default.default.memo(function Maske
2366
2259
 
2367
2260
  const {
2368
2261
  ref,
2369
- value,
2370
2262
  unmaskedValue,
2263
+ value,
2371
2264
  setUnmaskedValue
2372
2265
  } = reactImask.useIMask(optionsMask, {
2373
2266
  onAccept: (newValue, event, element) => {
@@ -2376,39 +2269,39 @@ const MaskedInputField = /*#__PURE__*/React__default.default.memo(function Maske
2376
2269
  }
2377
2270
  }
2378
2271
  });
2379
- React.useEffect(() => {
2272
+ React$1.useEffect(() => {
2380
2273
  if (input.value !== unmaskedValue) {
2381
2274
  setUnmaskedValue(input.value.replace(unmasked, ''));
2382
2275
  }
2383
2276
  }, [input.value]);
2384
2277
  const {
2385
- isErrorState,
2386
- isValidState,
2387
2278
  errorKey,
2388
- errorMessage
2279
+ errorMessage,
2280
+ isErrorState,
2281
+ isValidState
2389
2282
  } = useFieldValidationState({
2390
2283
  fieldProps: fieldProps,
2391
2284
  input: input,
2392
2285
  meta: meta
2393
2286
  });
2394
2287
  const updatedInputProps = useValidationAppearanceInputProps({
2395
- validationStateKey: isErrorState ? errorKey : 'success',
2396
- inputProps: inputProps
2288
+ inputProps: inputProps,
2289
+ validationStateKey: isErrorState ? errorKey : 'success'
2397
2290
  });
2398
2291
  return /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
2399
2292
  className: clsx__default.default('form-field_type_maskedInput', 'form__item_type_maskedInput', classNameGroupItem),
2400
2293
  errorKey: errorKey,
2401
2294
  errorMessage: errorMessage,
2295
+ isErrorState: isErrorState,
2296
+ metaError: meta.error,
2297
+ isDisabled: isDisabled,
2402
2298
  fieldClassName: 'form-maskedInput',
2403
2299
  inputName: input.name,
2404
2300
  inputValue: input.value,
2405
- isDisabled: isDisabled,
2406
- isErrorState: isErrorState,
2407
- isRequired: isRequired,
2408
- isValidState: isValidState,
2409
2301
  metaActive: meta.active,
2410
- metaError: meta.error,
2411
- showMessage: showMessage
2302
+ showMessage: showMessage,
2303
+ isRequired: isRequired,
2304
+ isValidState: isValidState
2412
2305
  }, fieldProps), /*#__PURE__*/React__default.default.createElement(Input.Input, Object.assign({
2413
2306
  className: clsx__default.default(meta.active && 'input_state_focus', meta.error && meta.touched && `input_state_${errorKey}`),
2414
2307
  ref: ref,
@@ -2417,31 +2310,42 @@ const MaskedInputField = /*#__PURE__*/React__default.default.memo(function Maske
2417
2310
  onFocus: input.onFocus
2418
2311
  }, updatedInputProps)), clearIcon && /*#__PURE__*/React__default.default.createElement(Icon.Icon, {
2419
2312
  className: "form-field__icon",
2313
+ size: clearIconSize,
2420
2314
  iconFill: clearIconFill,
2421
2315
  iconFillHover: clearIconFillHover,
2422
2316
  imageSrc: clearIcon,
2423
2317
  shape: clearIconShape,
2424
- size: clearIconSize,
2425
2318
  SvgImage: clearIcon,
2426
2319
  onClick: onClickClearIcon
2427
2320
  }));
2428
2321
  });
2429
2322
  });
2430
- MaskedInputField.defaultProps = {
2431
- inputProps: {},
2432
- fieldProps: {}
2433
- };
2434
- MaskedInputField.propTypes = {
2435
- name: PropTypes__default.default.string.isRequired,
2436
- classNameGroupItem: PropTypes__default.default.string,
2437
- fieldProps: PropTypes__default.default.object,
2438
- initialValue: PropTypes__default.default.any,
2439
- inputProps: PropTypes__default.default.object,
2440
- isDisabled: PropTypes__default.default.bool,
2441
- isRequired: PropTypes__default.default.bool,
2442
- optionsMask: PropTypes__default.default.object,
2443
- showMessage: PropTypes__default.default.bool,
2444
- unmasked: PropTypes__default.default.string
2323
+
2324
+ const defaultChipsProps = {
2325
+ width: 'fill',
2326
+ borderColor: 'surfaceBorderTertiary',
2327
+ activeIconItemFill: 'surfaceItemSecondary',
2328
+ appearance: 'surfacePrimary',
2329
+ // error
2330
+ errorBorderColor: 'errorBorderPrimary',
2331
+ fill: 'surfacePrimary',
2332
+ fillActive: 'accentPrimary',
2333
+ fillActiveDisabled: 'surfaceTertiary',
2334
+ fillActiveHover: 'errorPrimary',
2335
+ fillHover: 'surfacePrimaryHover',
2336
+ iconItemFill: 'surfaceItemPrimary',
2337
+ iconSize: 14,
2338
+ indicatorFill: 'accentPrimary',
2339
+ labelSize: 's',
2340
+ labelTextActiveColor: 'accentTextPrimary',
2341
+ labelTextActiveColorDisabled: 'surfaceTextDisabled',
2342
+ labelTextColor: 'surfaceTextPrimary',
2343
+ labelTextColorDisabled: 'surfaceTextDisabled',
2344
+ // appearance depending on the type of error
2345
+ // required
2346
+ requiredBorderColor: 'warningBorderPrimary',
2347
+ shape: 'rounded',
2348
+ size: 'm'
2445
2349
  };
2446
2350
 
2447
2351
  function ChipsField(props) {
@@ -2462,12 +2366,12 @@ function ChipsField(props) {
2462
2366
  } = reactFinalForm.useForm();
2463
2367
 
2464
2368
  // Callback for value changes
2465
- const onChangeSomeInput = React.useCallback((inputValue, newOptionValue) => {
2369
+ const onChangeSomeInput = React$1.useCallback((inputValue, newOptionValue) => {
2466
2370
  const updatedValues = inputValue.includes(newOptionValue) ? inputValue.filter(selectedValue => selectedValue !== newOptionValue) : [...inputValue, newOptionValue];
2467
2371
  change(name, updatedValues);
2468
2372
  onChange && onChange(updatedValues);
2469
2373
  }, [change, name, onChange]);
2470
- React.useEffect(() => {
2374
+ React$1.useEffect(() => {
2471
2375
  initialValue && change(name, initialValue);
2472
2376
  // update the form value only when the initialValue changes, so use disable eslint to ignore the warning
2473
2377
  // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -2493,7 +2397,7 @@ function ChipsField(props) {
2493
2397
  inputProps: inputProps,
2494
2398
  validationStateKey: isErrorState ? errorKey : 'success'
2495
2399
  });
2496
- const activeOptionsList = React.useMemo(() => {
2400
+ const activeOptionsList = React$1.useMemo(() => {
2497
2401
  const emptyOptionsList = [{
2498
2402
  label: null,
2499
2403
  value: null
@@ -2529,22 +2433,6 @@ function ChipsField(props) {
2529
2433
  }, updatedInputProps))));
2530
2434
  });
2531
2435
  }
2532
- ChipsField.propTypes = {
2533
- name: PropTypes__default.default.string,
2534
- initialValue: PropTypes__default.default.array,
2535
- classNameGroupItem: PropTypes__default.default.string,
2536
- fieldProps: PropTypes__default.default.object,
2537
- input: PropTypes__default.default.object,
2538
- inputProps: PropTypes__default.default.object,
2539
- options: PropTypes__default.default.arrayOf(PropTypes__default.default.shape({
2540
- label: PropTypes__default.default.string,
2541
- value: PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.number, PropTypes__default.default.bool])
2542
- })),
2543
- showMessage: PropTypes__default.default.bool,
2544
- isDisabled: PropTypes__default.default.bool,
2545
- isRequired: PropTypes__default.default.bool,
2546
- onChange: PropTypes__default.default.func
2547
- };
2548
2436
 
2549
2437
  const formTypes = {
2550
2438
  code: 'code',
@@ -2780,48 +2668,19 @@ const sendFormDataToServer = async (url, data) => {
2780
2668
 
2781
2669
  const FinalForm = /*#__PURE__*/React__default.default.forwardRef(function FinalForm(props, ref) {
2782
2670
  const {
2783
- isLoading,
2784
- additionalProps,
2785
- after,
2786
- before,
2787
- buttonDirection,
2788
- buttonFill,
2789
- buttonGap,
2790
- buttonJustifyContent,
2791
- buttonPadding,
2792
2671
  className,
2672
+ type,
2673
+ initialValues,
2674
+ initialValuesEqual,
2793
2675
  config,
2794
- dataTestId,
2795
- dataTestIdButtons,
2796
- dataTestIdPrimaryButton,
2797
- dataTestIdSecondaryButton,
2798
- dataTestIdTertiaryButton,
2799
- dataTour,
2800
- dataTourButtons,
2801
- dataTourPrimaryButton,
2802
- dataTourSecondaryButton,
2803
- dataTourTertiaryButton,
2676
+ title,
2677
+ titleTextColor,
2678
+ titleTextSize,
2679
+ titleTextWeight,
2804
2680
  description,
2805
2681
  descriptionSize,
2806
2682
  descriptionTextColor,
2807
2683
  descriptionTextWeight,
2808
- disableFieldsAutoComplete,
2809
- fieldsGap,
2810
- formName,
2811
- groupGap,
2812
- initialValues,
2813
- initialValuesEqual,
2814
- language,
2815
- loader,
2816
- loaderFill,
2817
- loaderItemFill,
2818
- loaderShape,
2819
- loaderSize,
2820
- loaderText,
2821
- loaderType,
2822
- mutators,
2823
- notificationCloseButton,
2824
- notificationType,
2825
2684
  primaryButton,
2826
2685
  primaryButtonFill,
2827
2686
  primaryButtonFillHover,
@@ -2830,7 +2689,6 @@ const FinalForm = /*#__PURE__*/React__default.default.forwardRef(function FinalF
2830
2689
  primaryButtonLabelTextColor,
2831
2690
  primaryButtonLabelTextWeight,
2832
2691
  primaryButtonSize,
2833
- renderFieldsWrapper = wrapperChildren => wrapperChildren,
2834
2692
  secondaryButton,
2835
2693
  secondaryButtonFill,
2836
2694
  secondaryButtonFillHover,
@@ -2839,7 +2697,6 @@ const FinalForm = /*#__PURE__*/React__default.default.forwardRef(function FinalF
2839
2697
  secondaryButtonLabelTextColor,
2840
2698
  secondaryButtonLabelTextWeight,
2841
2699
  secondaryButtonSize,
2842
- set,
2843
2700
  tertiaryButton,
2844
2701
  tertiaryButtonFill,
2845
2702
  tertiaryButtonFillHover,
@@ -2848,19 +2705,50 @@ const FinalForm = /*#__PURE__*/React__default.default.forwardRef(function FinalF
2848
2705
  tertiaryButtonLabelTextColor,
2849
2706
  tertiaryButtonLabelTextWeight,
2850
2707
  tertiaryButtonSize,
2851
- title,
2852
- titleTextColor,
2853
- titleTextSize,
2854
- titleTextWeight,
2855
- type,
2856
- validationSchema,
2857
- onChangeFormValues,
2708
+ dataTestIdPrimaryButton,
2709
+ dataTourPrimaryButton,
2710
+ dataTestIdSecondaryButton,
2711
+ dataTourSecondaryButton,
2858
2712
  onClickSecondaryButton,
2713
+ dataTestIdTertiaryButton,
2714
+ dataTourTertiaryButton,
2859
2715
  onClickTertiaryButton,
2716
+ additionalProps = {},
2717
+ buttonDirection = 'vertical',
2718
+ buttonFill,
2719
+ buttonGap,
2720
+ buttonJustifyContent,
2721
+ buttonPadding,
2722
+ dataTestId,
2723
+ dataTestIdButtons,
2724
+ dataTour,
2725
+ dataTourButtons,
2726
+ disableFieldsAutoComplete = false,
2727
+ fieldsGap,
2728
+ formName,
2729
+ groupGap,
2730
+ language,
2731
+ loader,
2732
+ loaderFill,
2733
+ loaderItemFill,
2734
+ loaderShape,
2735
+ loaderSize,
2736
+ loaderText,
2737
+ loaderType,
2738
+ mutators,
2739
+ notificationCloseButton,
2740
+ notificationType,
2741
+ renderFieldsWrapper = wrapperChildren => wrapperChildren,
2742
+ validationSchema,
2743
+ before,
2744
+ after,
2745
+ isLoading,
2746
+ set,
2747
+ onChangeFormValues,
2860
2748
  onSubmit
2861
2749
  } = props;
2862
2750
  const validate = useYupValidationSchema(validationSchema, language);
2863
- const onRefFormInstance = React.useCallback(formInstance => {
2751
+ const onRefFormInstance = React$1.useCallback(formInstance => {
2864
2752
  if (ref) {
2865
2753
  ref.current = formInstance;
2866
2754
  }
@@ -2886,28 +2774,25 @@ const FinalForm = /*#__PURE__*/React__default.default.forwardRef(function FinalF
2886
2774
  wrapper: wrapperStyles
2887
2775
  } = useStyles.useStyles(props);
2888
2776
  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Form, {
2889
- decorators: [focusOnErrorDecorator],
2890
2777
  initialValues: initialValues,
2891
2778
  initialValuesEqual: initialValuesEqual,
2892
- mutators: mutators,
2893
- validate: validate,
2894
2779
  render: ({
2780
+ submitError,
2895
2781
  form,
2896
2782
  handleSubmit,
2897
- modifiedSinceLastSubmit,
2898
- submitError
2783
+ modifiedSinceLastSubmit
2899
2784
  }) => {
2900
2785
  return /*#__PURE__*/React__default.default.createElement("form", {
2901
- className: clsx__default.default(className, 'form', set && `form_set_${set}`, type && `form_type_${type}`, directionClass, fillClass, shapeClass, elevationClass)
2902
- // We no need set reference to html element, we need reference to "final-form" instance
2903
- ,
2904
- ref: () => onRefFormInstance(form),
2786
+ className: clsx__default.default(className, 'form', set && `form_set_${set}`, type && `form_type_${type}`, directionClass, fillClass, shapeClass, elevationClass),
2905
2787
  name: formName,
2906
2788
  autoCapitalize: disableFieldsAutoComplete ? 'off' : undefined,
2907
2789
  autoComplete: disableFieldsAutoComplete ? 'off' : undefined,
2908
2790
  autoCorrect: disableFieldsAutoComplete ? 'off' : undefined,
2909
2791
  "data-test-id": dataTestId,
2910
- "data-tour": dataTour,
2792
+ "data-tour": dataTour
2793
+ // We no need set reference to html element, we need reference to "final-form" instance
2794
+ ,
2795
+ ref: () => onRefFormInstance(form),
2911
2796
  spellCheck: disableFieldsAutoComplete ? 'false' : undefined,
2912
2797
  style: formStyles,
2913
2798
  onSubmit: handleSubmit
@@ -2925,10 +2810,10 @@ const FinalForm = /*#__PURE__*/React__default.default.forwardRef(function FinalF
2925
2810
  className: clsx__default.default('notification', 'form-notification', notificationType ? `form-notification_type_${notificationType}` : 'form-notification_type_global')
2926
2811
  }, /*#__PURE__*/React__default.default.createElement(Notification.NotificationItem, {
2927
2812
  className: "form-notification__item",
2928
- closeButton: notificationCloseButton,
2929
- status: "error",
2930
2813
  title: form.getState().submitError,
2931
2814
  titleTextSize: "h6",
2815
+ status: "error",
2816
+ closeButton: notificationCloseButton,
2932
2817
  set: "form"
2933
2818
  })), onChangeFormValues && /*#__PURE__*/React__default.default.createElement(reactFinalForm.FormSpy, {
2934
2819
  subscription: {
@@ -2944,154 +2829,75 @@ const FinalForm = /*#__PURE__*/React__default.default.forwardRef(function FinalF
2944
2829
  key
2945
2830
  }, additionalProps[config[key].name])), isLoading && (loader || /*#__PURE__*/React__default.default.createElement(Loader.Loader, {
2946
2831
  className: "form__loader",
2947
- fill: loaderFill,
2948
- itemFill: loaderItemFill,
2949
- shape: loaderShape,
2832
+ type: loaderType,
2950
2833
  size: loaderSize,
2834
+ fill: loaderFill,
2951
2835
  text: loaderText,
2952
- type: loaderType
2836
+ itemFill: loaderItemFill,
2837
+ shape: loaderShape
2953
2838
  }))))), (primaryButtonLabel || primaryButton || secondaryButtonLabel || secondaryButton || tertiaryButton || tertiaryButtonLabel) && /*#__PURE__*/React__default.default.createElement(Group$1.Group, {
2954
2839
  className: "form__button",
2840
+ direction: buttonDirection,
2841
+ justifyContent: buttonJustifyContent,
2955
2842
  fill: buttonFill,
2956
2843
  padding: buttonPadding,
2957
- dataTestId: dataTestIdButtons,
2958
- dataTour: dataTourButtons,
2959
- direction: buttonDirection,
2960
2844
  gap: buttonGap,
2961
- justifyContent: buttonJustifyContent
2845
+ dataTestId: dataTestIdButtons,
2846
+ dataTour: dataTourButtons
2962
2847
  }, primaryButtonLabel ? /*#__PURE__*/React__default.default.createElement(Button.Button, {
2963
2848
  className: "form__button-item",
2964
2849
  width: "fill",
2965
- labelTextColor: primaryButtonLabelTextColor,
2966
- labelTextSize: primaryButtonLabelSize,
2850
+ size: primaryButtonSize,
2967
2851
  fill: primaryButtonFill,
2968
2852
  fillHover: primaryButtonFillHover,
2969
- dataTestId: dataTestIdPrimaryButton,
2970
- dataTour: dataTourPrimaryButton,
2971
2853
  label: primaryButtonLabel,
2854
+ labelTextColor: primaryButtonLabelTextColor,
2855
+ labelTextSize: primaryButtonLabelSize,
2972
2856
  labelTextWeight: primaryButtonLabelTextWeight,
2973
- size: primaryButtonSize
2857
+ dataTestId: dataTestIdPrimaryButton,
2858
+ dataTour: dataTourPrimaryButton
2974
2859
  }) : primaryButton, secondaryButtonLabel ? /*#__PURE__*/React__default.default.createElement(Button.Button, {
2975
2860
  className: "form__button-item",
2976
2861
  width: "fill",
2977
- labelTextColor: secondaryButtonLabelTextColor,
2978
- labelTextSize: secondaryButtonLabelSize,
2862
+ size: secondaryButtonSize,
2979
2863
  fill: secondaryButtonFill,
2980
2864
  fillHover: secondaryButtonFillHover,
2981
- dataTestId: dataTestIdSecondaryButton,
2982
- dataTour: dataTourSecondaryButton,
2983
2865
  label: secondaryButtonLabel,
2866
+ labelTextColor: secondaryButtonLabelTextColor,
2867
+ labelTextSize: secondaryButtonLabelSize,
2984
2868
  labelTextWeight: secondaryButtonLabelTextWeight,
2985
- size: secondaryButtonSize,
2869
+ dataTestId: dataTestIdSecondaryButton,
2870
+ dataTour: dataTourSecondaryButton,
2986
2871
  onClick: onClickSecondaryButton
2987
2872
  }) : secondaryButton, tertiaryButtonLabel ? /*#__PURE__*/React__default.default.createElement(Button.Button, {
2988
2873
  className: "form__button-item",
2989
2874
  width: "fill",
2990
- labelTextColor: tertiaryButtonLabelTextColor,
2991
- labelTextSize: tertiaryButtonLabelSize,
2875
+ size: tertiaryButtonSize,
2992
2876
  fill: tertiaryButtonFill,
2993
2877
  fillHover: tertiaryButtonFillHover,
2994
- dataTestId: dataTestIdTertiaryButton,
2995
- dataTour: dataTourTertiaryButton,
2996
2878
  label: tertiaryButtonLabel,
2879
+ labelTextColor: tertiaryButtonLabelTextColor,
2880
+ labelTextSize: tertiaryButtonLabelSize,
2997
2881
  labelTextWeight: tertiaryButtonLabelTextWeight,
2998
- size: tertiaryButtonSize,
2882
+ dataTestId: dataTestIdTertiaryButton,
2883
+ dataTour: dataTourTertiaryButton,
2999
2884
  onClick: onClickTertiaryButton
3000
2885
  }) : tertiaryButton), after);
3001
2886
  },
2887
+ decorators: [focusOnErrorDecorator],
2888
+ mutators: mutators,
3002
2889
  subscription: {
2890
+ submitError: true,
3003
2891
  modifiedSinceLastSubmit: true,
3004
2892
  pristine: true,
3005
- submitError: true,
3006
2893
  submitting: true
3007
2894
  },
2895
+ validate: validate,
3008
2896
  onSubmit: onSubmit
3009
2897
  });
3010
2898
  });
3011
- FinalForm.propTypes = {
3012
- isLoading: PropTypes__default.default.bool,
3013
- additionalProps: PropTypes__default.default.object,
3014
- after: PropTypes__default.default.any,
3015
- before: PropTypes__default.default.any,
3016
- buttonDirection: PropTypes__default.default.string,
3017
- buttonFill: PropTypes__default.default.string,
3018
- buttonGap: PropTypes__default.default.string,
3019
- buttonJustifyContent: PropTypes__default.default.string,
3020
- buttonPadding: PropTypes__default.default.string,
3021
- className: PropTypes__default.default.string,
3022
- config: PropTypes__default.default.object,
3023
- dataTour: PropTypes__default.default.string,
3024
- dataTourButtons: PropTypes__default.default.string,
3025
- dataTourPrimaryButton: PropTypes__default.default.string,
3026
- dataTourSecondaryButton: PropTypes__default.default.string,
3027
- dataTourTertiaryButton: PropTypes__default.default.string,
3028
- description: PropTypes__default.default.string,
3029
- descriptionSize: PropTypes__default.default.string,
3030
- descriptionTextColor: PropTypes__default.default.string,
3031
- descriptionTextWeight: PropTypes__default.default.string,
3032
- disableFieldsAutoComplete: PropTypes__default.default.bool,
3033
- fieldsGap: PropTypes__default.default.string,
3034
- formName: PropTypes__default.default.string,
3035
- groupGap: PropTypes__default.default.string,
3036
- initialValues: PropTypes__default.default.any,
3037
- initialValuesEqual: PropTypes__default.default.any,
3038
- language: PropTypes__default.default.string,
3039
- loader: PropTypes__default.default.element,
3040
- loaderFill: PropTypes__default.default.string,
3041
- loaderItemFill: PropTypes__default.default.string,
3042
- loaderSet: PropTypes__default.default.string,
3043
- loaderText: PropTypes__default.default.string,
3044
- mutators: PropTypes__default.default.any,
3045
- notificationCloseButton: PropTypes__default.default.element,
3046
- notificationType: PropTypes__default.default.string,
3047
- primaryButton: PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.element]),
3048
- primaryButtonFill: PropTypes__default.default.string,
3049
- primaryButtonFillHover: PropTypes__default.default.string,
3050
- primaryButtonLabel: PropTypes__default.default.string,
3051
- primaryButtonLabelSize: PropTypes__default.default.string,
3052
- primaryButtonLabelTextColor: PropTypes__default.default.string,
3053
- primaryButtonLabelTextWeight: PropTypes__default.default.string,
3054
- primaryButtonSize: PropTypes__default.default.string,
3055
- secondaryButton: PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.element]),
3056
- secondaryButtonFill: PropTypes__default.default.string,
3057
- secondaryButtonFillHover: PropTypes__default.default.string,
3058
- secondaryButtonLabel: PropTypes__default.default.string,
3059
- secondaryButtonLabelSize: PropTypes__default.default.string,
3060
- secondaryButtonLabelTextColor: PropTypes__default.default.string,
3061
- secondaryButtonLabelTextWeight: PropTypes__default.default.string,
3062
- secondaryButtonSize: PropTypes__default.default.string,
3063
- set: PropTypes__default.default.string,
3064
- tertiaryButton: PropTypes__default.default.element,
3065
- tertiaryButtonFill: PropTypes__default.default.string,
3066
- tertiaryButtonFillHover: PropTypes__default.default.string,
3067
- tertiaryButtonLabel: PropTypes__default.default.string,
3068
- tertiaryButtonLabelSize: PropTypes__default.default.string,
3069
- tertiaryButtonLabelTextColor: PropTypes__default.default.string,
3070
- tertiaryButtonLabelTextWeight: PropTypes__default.default.string,
3071
- tertiaryButtonSize: PropTypes__default.default.string,
3072
- title: PropTypes__default.default.string,
3073
- titleSize: PropTypes__default.default.string,
3074
- titleTextColor: PropTypes__default.default.string,
3075
- titleTextSize: PropTypes__default.default.string,
3076
- titleTextWeight: PropTypes__default.default.string,
3077
- type: PropTypes__default.default.string,
3078
- validationSchema: PropTypes__default.default.object,
3079
- onChangeFormValues: PropTypes__default.default.func,
3080
- onClickSecondaryButton: PropTypes__default.default.func,
3081
- onClickTertiaryButton: PropTypes__default.default.func,
3082
- onSubmit: PropTypes__default.default.func
3083
- };
3084
2899
  FinalForm.defaultProps = {
3085
- direction: 'vertical',
3086
- isLoading: false,
3087
- additionalProps: {},
3088
- buttonDirection: 'vertical',
3089
- disableFieldsAutoComplete: false,
3090
- language: 'en',
3091
- loaderFill: 'surfacePrimary',
3092
- loaderItemFill: 'surfaceItemAccent',
3093
- loaderSet: 'simple',
3094
- titleSize: 'h1'
2900
+ direction: 'vertical'
3095
2901
  };
3096
2902
 
3097
2903
  const DEFAULT_MESSAGES_FIELDS = {
@@ -3316,7 +3122,7 @@ Object.defineProperty(exports, "useFormState", {
3316
3122
  enumerable: true,
3317
3123
  get: function () { return reactFinalForm.useFormState; }
3318
3124
  });
3319
- exports.Checkbox = CheckboxField;
3125
+ exports.CheckboxField = CheckboxField;
3320
3126
  exports.ChipsField = ChipsField;
3321
3127
  exports.ChoiceField = ChoiceField;
3322
3128
  exports.CodeField = CodeField;
@@ -3333,10 +3139,19 @@ exports.MaskedInputField = MaskedInputField;
3333
3139
  exports.RadioGroup = RadioGroup;
3334
3140
  exports.SegmentedField = SegmentedField;
3335
3141
  exports.SelectField = SelectField;
3336
- exports.Switch = SwitchField;
3337
- exports.Textarea = TextareaField;
3142
+ exports.SwitchField = SwitchField;
3143
+ exports.TextareaField = TextareaField;
3338
3144
  exports.addRequiredFieldsParamToSchema = addRequiredFieldsParamToSchema;
3339
3145
  exports.dateValidation = dateValidation;
3146
+ exports.defaultChipsProps = defaultChipsProps;
3147
+ exports.defaultChoiceProps = defaultChoiceProps;
3148
+ exports.defaultDatepickerProps = defaultDatepickerProps;
3149
+ exports.defaultDropzoneProps = defaultDropzoneProps;
3150
+ exports.defaultFieldProps = defaultFieldProps;
3151
+ exports.defaultInputProps = defaultInputProps;
3152
+ exports.defaultSegmentedProps = defaultSegmentedProps;
3153
+ exports.defaultSelectProps = defaultSelectProps;
3154
+ exports.defaultTextareaProps = defaultTextareaProps;
3340
3155
  exports.emailValidation = emailValidation;
3341
3156
  exports.focusOnError = focusOnError;
3342
3157
  exports.focusOnErrorDecorator = focusOnErrorDecorator;