@itcase/forms 1.0.37 → 1.0.38

package/dist/itcase-forms.cjs.js

@@ -1 +1,2339 @@
-"use strict";var e=require("libphonenumber-js"),t=require("react"),a=require("final-form"),r=require("react-final-form"),i=require("prop-types"),o=require("clsx"),l=require("@itcase/ui/components/Checkbox"),s=require("@itcase/ui/components/Divider"),n=require("@itcase/ui/components/Text"),u=require("@itcase/ui/hooks/useDeviceTargetClass"),d=require("@itcase/ui/hooks/useStyles"),m=require("@itcase/ui/components/Choice"),c=require("@itcase/ui/components/Code"),f=require("@itcase/ui/components/DatePicker"),p=require("axios"),b=require("react-dropzone"),g=require("file-selector"),h=require("lodash/castArray"),x=require("@itcase/common"),_=require("@itcase/ui/components/Loader"),T=require("@itcase/ui/components/Title"),v=require("@itcase/ui/components/Input"),y=require("@itcase/ui/components/Icon"),C=require("@itcase/ui/components/RadioButton"),S=require("@itcase/ui/components/Segmented"),E=require("@itcase/ui/components/Select"),F=require("@itcase/ui/components/Switch"),N=require("@itcase/ui/components/Textarea"),P=require("@itcase/ui/components/Button"),z=require("@itcase/ui/components/Group"),k=require("@itcase/ui/components/Notification"),R=require("final-form-focus");function q(e){return e&&e.__esModule?e:{default:e}}var j=q(t),B=q(i),M=q(o),W=q(p),O=q(h),D=q(R);const w=(e,t)=>a.setIn(e,t.path,t.message),L=Object.create(null);function V(e,a){const r=t.useMemo((()=>e&&(e=>async function(t){try{await e.validate(t,{abortEarly:!1})}catch(e){if(e.inner)return e.inner.reduce(w,L);console.warn("itcase-forms schema.validate error: An error not related to the form occurred during validation. Validation ignored.")}})(e)),[e,a]);return r}function I(e){const{after:a,afterItem:r,before:i,beforeItem:o,children:l,className:m,desc:c,descTextSize:f,descTextColor:p,descTextWidth:b,divider:g,dividerDirection:h,dividerFill:x,dividerSize:_,dividerWidth:T,fieldClassName:v,id:y,inputName:C,inputValue:S,isRequired:E,label:F,labelTextSize:N,labelTextColor:P,labelTextWidth:z,errorMessageTextSize:k,errorMessageTextWeight:R,errorMessageTextColor:q,message:B,messageTextSize:W,messageTextColor:O,messageTextWeight:D,metaActive:w,metaError:L,metaModifiedSinceLastSubmit:V,metaSubmitError:I,metaSubmitFailed:A,metaTouched:$,metaValid:H,set:G,type:K,hideMessage:U,isHidden:J,tag:Y,dataTour:Q,showErrorsOnSubmit:X}=e,Z=L||!V&&I||!1,ee=t.useMemo((()=>X?A&&$&&Z:$&&Z),[X,A,$,Z]),te=t.useMemo((()=>(Array.isArray(S)?S.length:S)&&(H||!L&&I&&V)),[S,H,L,I,V]),ae=t.useMemo((()=>M.default(m,ee&&"form__item_state_error",te&&"form__item_state_success",E&&"form__item_state_required",w&&"form__item_state_focus",S&&"form__item_state_filled")),[m,ee,te,E,w,S]),re=t.useMemo((()=>M.default(v,ee&&`${v}_state_error`,te&&`${v}_state_success`,w&&`${v}_state_focus`,S&&`${v}_state_filled`)),[v,ee,te,w,S]),ie=u.useDeviceTargetClass(e,{prefix:"form-field_size_",propsKey:"size"}),oe=u.useDeviceTargetClass(e,{prefix:"fill_",propsKey:"fill"}),le=u.useDeviceTargetClass(e,{prefix:"fill_",propsKey:"inputFill"}),se=u.useDeviceTargetClass(e,{prefix:"form-field_shape_",propsKey:"shape"}),ne=u.useDeviceTargetClass(e,{prefix:"form-field__item-value_shape_",propsKey:"inputShape"}),ue=u.useDeviceTargetClass(e,{prefix:"direction_",propsKey:"direction"}),de=u.useDeviceTargetClass(e,{prefix:"width_",propsKey:"width"}),{styles:me}=d.useStyles(e);return j.default.createElement(Y,{className:M.default(ae,"form__item","form-field",K&&`form-field_type_${K}`,G&&`form-field_set_${G}`,ie,oe,se,J&&"form-field_state_hidden",ue,de),"data-tour":Q,style:me},i,F&&j.default.createElement("div",{htmlFor:y,className:"form-field__label"},j.default.createElement(n.Text,{size:N,textWeight:z,textColor:P},F)),c&&j.default.createElement("div",{className:"form-field__desc"},j.default.createElement(n.Text,{size:f,textWeight:b,textColor:p},c)),j.default.createElement("div",{className:M.default("form-field__content",le,ne)},j.default.createElement("div",{className:M.default("form-field__content-inner",re)},o,l,r),g&&j.default.createElement(s.Divider,{className:"form-field__item-divider",width:T,direction:h,size:_,fill:x})),!U&&j.default.createElement("div",{className:"form-field__message"},Boolean(ee)&&j.default.createElement(n.Text,{className:"form-field__message-item form-field__message-item_type-error",size:k,textWeight:R,textColor:q,id:`${C}-error`},Z),Boolean(B)&&!ee&&j.default.createElement(n.Text,{className:"form-field__message-item form-field__message-item_type_message",size:W,textWeight:D,textColor:O},B),Boolean(!ee)&&Boolean(!B)&&j.default.createElement(n.Text,{className:"form-field__message-item form-field__message-item_type_message",size:W}," ")),a)}function A(e){const{inputName:a}=e,{change:i}=r.useForm();return t.useEffect((()=>()=>{i(a,void 0)}),[]),j.default.createElement(I,e)}I.defaultProps={tag:"div",type:"normal",errorMessageTextSize:"s",errorMessageTextColor:"errorTextSecondary"},I.propTypes={after:B.default.any,afterItem:B.default.any,autoComplete:B.default.string,before:B.default.any,beforeItem:B.default.any,children:B.default.any,className:B.default.string,desc:B.default.string,descTextSize:B.default.string,descTextColor:B.default.string,descTextWidth:B.default.string,dividerDirection:B.default.string,dividerFill:B.default.string,dividerSize:B.default.string,dividerWidth:B.default.string,fieldClassName:B.default.string,id:B.default.string,inputName:B.default.string,inputOnBlur:B.default.func,inputOnChange:B.default.func,inputOnFocus:B.default.func,inputValue:B.default.any,isRequired:B.default.bool,itemType:B.default.string,label:B.default.any,labelTextSize:B.default.string,labelTextColor:B.default.string,labelTextWidth:B.default.string,errorMessageTextSize:B.default.string,errorMessageTextWidth:B.default.string,errorMessageTextColor:B.default.string,message:B.default.string,messageSize:B.default.string,messageTextColor:B.default.string,messageTextWidth:B.default.string,metaActive:B.default.bool,metaError:B.default.string,metaModifiedSinceLastSubmit:B.default.bool,metaSubmitError:B.default.string,metaSubmitFailed:B.default.bool,metaTouched:B.default.bool,metaValid:B.default.bool,set:B.default.string,showErrorsOnSubmit:B.default.bool,type:B.default.string},A.propTypes={autoComplete:B.default.string,children:B.default.any,className:B.default.string,fieldClassName:B.default.string,hint:B.default.string,inputName:B.default.string,inputOnBlur:B.default.func,inputOnChange:B.default.func,inputOnFocus:B.default.func,inputValue:B.default.any,isRequired:B.default.bool,itemType:B.default.string,label:B.default.any,metaActive:B.default.bool,metaError:B.default.string,metaModifiedSinceLastSubmit:B.default.bool,metaSubmitError:B.default.string,metaSubmitFailed:B.default.bool,metaTouched:B.default.bool,metaValid:B.default.bool,showErrorsOnSubmit:B.default.bool};const $=j.default.memo((function(e){const{name:a,isRequired:i,onChange:o,fieldProps:s,inputProps:n,classNameGroupItem:u,hideMessage:d}=e;return j.default.createElement(r.Field,{name:a,type:"checkbox"},(({input:e,meta:a})=>{const r=t.useCallback((t=>{e.onChange(t),o&&o(t.target.checked,e.name)}),[o]);return j.default.createElement(A,Object.assign({className:M.default("form-field_type_checkbox","form__item_type_checkbox",u),fieldClassName:"form-checkbox",inputName:e.name,inputValue:e.checked,isRequired:i,metaActive:a.active,metaError:a.error,metaModifiedSinceLastSubmit:a.modifiedSinceLastSubmit,metaSubmitError:a.submitError,metaSubmitFailed:a.submitFailed,metaTouched:a.touched,metaValid:a.valid,tag:"label",hideMessage:d},s),j.default.createElement(l.Checkbox,Object.assign({autoComplete:"nope",checked:e.checked,name:e.name,type:"checkbox",onBlur:e.onBlur,onChange:r,onFocus:e.onFocus},n)))}))}));$.defaultProps={inputProps:{},fieldProps:{}},$.propTypes={fieldProps:B.default.object,inputProps:B.default.object,isRequired:B.default.bool,name:B.default.string,onChange:B.default.func};const H=j.default.memo((function(e){const{options:a,classNameGroupItem:i,fieldProps:o,inputProps:l,isMultiple:s,isRequired:n,initialValue:u,label:d,name:c,messageType:f,hideMessage:p,placeholder:b}=e,{change:g}=r.useForm();return j.default.createElement(r.Field,{name:c,initialValue:u},(({input:e,meta:r})=>{const u=t.useMemo((()=>{const t={value:null,label:null};if(e.value){return a.find((t=>t.value===e.value))||t}return t}),[e.value]),h=t.useCallback((e=>{g(c,e.value)}),[g]);return j.default.createElement(A,Object.assign({className:M.default("form-field_type_choice","form__item_type_choice",i),fieldClassName:"form-choice",inputName:e.name,inputValue:e.value||[],isRequired:n,label:d,messageType:f,metaActive:r.active,metaError:r.error,metaModifiedSinceLastSubmit:r.modifiedSinceLastSubmit,metaSubmitError:r.submitError,metaSubmitFailed:r.submitFailed,metaTouched:r.touched,metaValid:r.valid,hideMessage:p},o),j.default.createElement(m.Choice,Object.assign({className:M.default(r.active&&"form-choice_state_focus",r.error&&r.touched&&"form-choice_state_error"),options:a,inputName:e.name,inputValue:e.value||[],isMultiple:s,isRequired:n,placeholder:b,active:u,setActiveSegment:h},l)))}))}));H.propTypes={options:B.default.array.isRequired,name:B.default.string.isRequired,className:B.default.string,inputClass:B.default.string,isMultiple:B.default.bool,isRequired:B.default.bool,label:B.default.string,placeholder:B.default.string};const G=j.default.memo((function(e){const{Component:t,isRequired:a,name:i,fieldProps:o,classNameGroupItem:l,hideMessage:s}=e;return j.default.createElement(r.Field,{name:i},(({input:r,meta:i})=>j.default.createElement(A,Object.assign({className:M.default("form-field_type_custom","form__item_type_custom",l),fieldClassName:"form-custom",inputName:r.name,inputValue:r.value,isRequired:a,metaActive:i.active,metaError:i.error,metaModifiedSinceLastSubmit:i.modifiedSinceLastSubmit,metaSubmitError:i.submitError,metaSubmitFailed:i.submitFailed,metaTouched:i.touched,metaValid:i.valid,hideMessage:s},o),j.default.createElement(t,Object.assign({},e,{input:r,meta:i})))))}));G.defaultProps={inputProps:{},fieldProps:{}},G.propTypes={name:B.default.string.isRequired,isRequired:B.default.bool,fieldProps:B.default.object,inputProps:B.default.object};const K=j.default.memo((function(e){const{isRequired:t,name:a,fieldProps:i,inputProps:o,classNameGroupItem:l,hideMessage:s}=e;return j.default.createElement(r.Field,{name:a},(({input:e,meta:a})=>j.default.createElement(A,Object.assign({className:M.default("form-field_type_code","form__item_type_code",l),fieldClassName:"form-code",inputName:e.name,inputValue:e.value,isRequired:t,metaActive:a.active,metaError:a.error,metaModifiedSinceLastSubmit:a.modifiedSinceLastSubmit,metaSubmitError:a.submitError,metaSubmitFailed:a.submitFailed,metaTouched:a.touched,metaValid:a.valid,hideMessage:s},i),j.default.createElement(c.Code,Object.assign({autoComplete:"nope",name:e.name,value:e.value,onBlur:e.onBlur,onChange:e.onChange,onFocus:e.onFocus},o)))))}));function U(e){const{isRequired:a,fieldProps:i,inputProps:o,datePickerProps:l,name:s,iconSize:n,iconBorder:u,iconBorderHover:d,iconFill:m,iconFillHover:c,iconRevealableShow:p,iconRevealableHide:b,iconShape:g,hideMessage:h,onChange:x,classNameGroupItem:_}=e;return j.default.createElement(r.Field,{name:s},(({input:e,meta:r})=>{const s=t.useCallback((t=>{e.onChange(t),x&&x(t,e.name)}),[x]);return j.default.createElement(A,Object.assign({className:M.default("form-field_type_datepicker","form__item_type_datepicker",_),fieldClassName:"form-datepicker",inputName:e.name,inputValue:e.value||"",isRequired:a,metaActive:r.active,metaError:r.error,metaModifiedSinceLastSubmit:r.modifiedSinceLastSubmit,metaSubmitError:r.submitError,metaSubmitFailed:r.submitFailed,metaTouched:r.touched,metaValid:r.valid,hideMessage:h},i),j.default.createElement(f.DatePickerInput,{name:e.name,value:e.value||"",onBlur:e.onBlur,onChange:s,onFocus:e.onFocus,inputProps:o,datePickerProps:l}))}))}async function J(e){try{const t=await W.default({url:`/api/${e}/`,responseType:"blob"}),a=t.data,r=t.headers["content-disposition"]?.split("filename=")[1];let i=r?.substring(1).slice(0,-1);if(!i){const e=a.type.split("/"),t=e[e.length-1];i=`${(new Date).getTime()}.${t}`}return new File([a],i,{type:a.type})}catch(e){return console.log("error: ",e),null}}function Y(e,t){t=t||(()=>{});const a=new FileReader;a._readedFile=e,a.onabort=()=>t(),a.onerror=()=>t(),a.onload=e=>{e.target._readedFile.dataURL=a.result,t()},e instanceof File?a.readAsDataURL(e):t()}K.defaultProps={inputProps:{},fieldProps:{}},K.propTypes={name:B.default.string.isRequired,isRequired:B.default.bool,fieldProps:B.default.object,inputProps:B.default.object},U.defaultProps={inputProps:{},fieldProps:{}},U.propTypes={fieldProps:B.default.object,inputProps:B.default.object,isRequired:B.default.bool,name:B.default.string.isRequired,onChange:B.default.func};const Q=j.default.memo((function(e){const{inputName:a,size:i,className:o,fileErrorText:l,hintTitleTextSize:s,removeThumbTextSize:d,removeThumbTextColor:m,removeThumbTextWeight:c,thumbNameTextSize:f,thumbNameTextColor:p,removeThumbTextHoverColor:h,thumbNameTextWrap:T,thumbNameTextWeight:v,hintTitleTextColor:y,hintTitleTextWrap:C,thumbColumn:S,hintTitleTextWeight:E,hintDescriptionTextSize:F,hintDescriptionTextColor:N,hintDescriptionTextWrap:P,hintDescriptionTextWeight:z,errorMessageTextSize:k,errorMessageTextWeight:R,errorMessageTextColor:q,inputValue:B,maxFiles:W,maxSize:D,removeThumbText:w,hintTitle:L,hintDescription:V,isShowFilename:I,isPreviews:A,loadingText:$,dropzoneProps:H={},onAddFiles:G,onDeleteFile:K}=e,[U,Q]=t.useState(""),[X,Z]=t.useState(!1),[ee,te]=t.useState(B?O.default(B):[]),{change:ae}=r.useForm(),re=t.useCallback((e=>{const t=1==H.maxFiles?e[0]:e;return ae(a,t),t}),[H,ae]),{getRootProps:ie,getInputProps:oe}=b.useDropzone({maxSize:D||10485760,maxFiles:W||5,...H,getFilesFromEvent:async e=>{const t=(await g.fromEvent(e)).filter((e=>e instanceof File));return[...ee,...t]},onDropAccepted:(e,t)=>{A&&e.forEach((e=>{e.error||(e.preview=URL.createObjectURL(e))})),te(e),Q("");const r=e.map((e=>new Promise((t=>Y(e,t)))));Promise.all(r).then((()=>{const t=re(e);G&&G(t,a)}))},onDropRejected:(e,t)=>{if(e.length){const t=e[0].errors[0]?.message;Q(t||"Error on adding file")}else Q("")}}),le=t.useCallback(((e,t)=>{e.stopPropagation(),e.preventDefault();const r=[...ee];r.splice(t,1),K&&K(ee[t],a),re(r)}),[ee,re,K]),se=t.useCallback((async e=>{Z(!0);const t=await async function(e,t){const a=[];for await(const r of O.default(e)){let e=null;const i="string"==typeof r&&r.includes("/");(r.image||i)&&(e=await J(r.image||r),e&&Y(e)),r.dataURL&&(e=x.createFileFromDataURL(r.name||r.path,r.dataURL),e.dataURL=r.dataURL),e&&(e.id=r.id,t&&(e.preview=URL.createObjectURL(e)),a.push(e))}return a}(e,A);return Z(!1),te(t),t}),[A]);t.useEffect((()=>{se(B).then((e=>re(e)))}),[]),t.useEffect((()=>{B?se(B):te([])}),[B]),t.useEffect((()=>()=>ee.forEach((e=>URL.revokeObjectURL(e?.preview)))),[]);const ne=u.useDeviceTargetClass(e,{prefix:"fill_",propsKey:"fill"}),ue=u.useDeviceTargetClass(e,{prefix:"fill_hover_",propsKey:"fillHover"}),de=u.useDeviceTargetClass(e,{prefix:"border-width_",propsKey:"borderWidth"}),me=u.useDeviceTargetClass(e,{prefix:"border-color_",propsKey:"borderColor"}),ce=u.useDeviceTargetClass(e,{prefix:"border-color_hover_",propsKey:"borderColorHover"}),fe=u.useDeviceTargetClass(e,{prefix:"border_type_",propsKey:"borderType"}),pe=u.useDeviceTargetClass(e,{prefix:"form-dropzone_shape_",propsKey:"shape"}),be=u.useDeviceTargetClass(e,{prefix:"border-width_",propsKey:"thumbBorderWidth"}),ge=u.useDeviceTargetClass(e,{prefix:"form-dropzone__thumb_direction_",propsKey:"thumbDirection"}),he=u.useDeviceTargetClass(e,{prefix:"border-color_",propsKey:"thumbBorderColor"}),xe=u.useDeviceTargetClass(e,{prefix:"border-color_hover_",propsKey:"thumbBorderColorHover"}),_e=u.useDeviceTargetClass(e,{prefix:"border_type_",propsKey:"thumbBorderType"});return j.default.createElement(j.default.Fragment,null,j.default.createElement("div",ie({className:`form-dropzone__dropzone dropzone ${o} thumbColumn form-dropzone__dropzone_size_${i} ${pe}`}),j.default.createElement("input",Object.assign({},oe(),{name:a})),j.default.createElement("div",{className:M.default("form-dropzone__dropzone-wrapper",S&&`form-dropzone__dropzone-wrapper_column_${S}`,ne,ue,de,me,ce,fe)},ee.map(((e,t)=>j.default.createElement("aside",{className:M.default("form-dropzone__thumb",ne,ge,be,he,xe,_e),key:`${e.id||`${e.name}_${t}`||"i"+t}`},A&&!e.error&&j.default.createElement("div",{className:"form-dropzone__thumb-image"},j.default.createElement("img",{className:"form-dropzone__thumb-image-inner",src:e.preview||e.image,onLoad:()=>{URL.revokeObjectURL(e.preview)}})),e.error&&j.default.createElement("div",null,j.default.createElement(n.Text,{size:f,textColor:p,textWrap:T,textWeight:v},l||e.error)),I&&j.default.createElement("div",{className:"form-dropzone__thumb-name"},j.default.createElement(n.Text,{size:f,textColor:p,textWrap:T,textWeight:v,className:"form-dropzone__thumb-name-inner"},e.name)),X&&j.default.createElement("div",{className:"form-dropzone__thumb-loader"},j.default.createElement(_.Loader,{fill:"surfacePrimary",height:"fill",itemFill:"surfaceItemAccent",set:"simple",width:"fill"})),j.default.createElement("div",{className:"form-dropzone__thumb-remove",onClick:e=>le(e,t)},j.default.createElement(n.Text,{size:d,textColor:m,textWeight:c,textColorHover:h,className:"form-dropzone__thumb-remove-text"},w||"Remove"))))),ee.length?j.default.createElement("div",{className:"form-dropzone__hint form-dropzone__hint_type_add-more"},j.default.createElement(n.Text,{size:s,textColor:y,textWrap:C,textWeight:E,className:"form-dropzone__hint-title"},L||"Select a file or drag in form"),j.default.createElement(n.Text,{size:F,textColor:N,textWrap:P,textWeight:z,className:"form-dropzone__hint-text"},V)):j.default.createElement("div",{className:"form-dropzone__hint"},j.default.createElement(n.Text,{size:s,textColor:y,textWrap:C,textWeight:E,className:"form-dropzone__hint-title"},L||"Select a file or drag in form"),j.default.createElement(n.Text,{size:F,textColor:N,textWrap:P,textWeight:z,className:"form-dropzone__hint-text"},V)))),U&&j.default.createElement("div",{className:"form-field__message"},j.default.createElement(n.Text,{className:"form-field__message-item form-field__message-item_type_message",size:k,textWeight:R,textColor:q},U)))}));Q.propTypes={dropzoneProps:B.default.object,hintDescription:B.default.string,hintTitle:B.default.string,inputName:B.default.string,inputValue:B.default.any,isPreviews:B.default.bool,isShowFilename:B.default.bool,loadingText:B.default.string,metaError:B.default.string,metaTouched:B.default.bool,removeThumbText:B.default.string,onAddFiles:B.default.func,onDeleteFile:B.default.func};const X=j.default.memo((function(e){const{name:t,shape:a,size:i,borderWidth:o,borderColor:l,borderColorHover:s,borderType:n,label:u,thumbBorderWidth:d,thumbBorderColor:m,thumbBorderColorHover:c,thumbBorderType:f,removeThumbTextHoverColor:p,labelTextColor:b,fill:g,fillHover:h,className:x,removeThumbText:_,thumbNameTextSize:T,thumbNameTextColor:v,thumbNameTextWrap:y,thumbNameTextWeight:C,removeThumbTextSize:S,removeThumbTextColor:E,removeThumbTextWeight:F,hintTitle:N,errorMessageTextSize:P,errorMessageTextWeight:z,errorMessageTextColor:k,fieldProps:R,hintTitleTextSize:q,hintTitleTextColor:B,hintTitleTextWrap:W,hintTitleTextWeight:O,hintDescriptionTextSize:D,hintDescriptionTextColor:w,hintDescriptionTextWrap:L,hintDescriptionTextWeight:V,hideMessage:I,thumbDirection:$,hintDescription:H,isShowFilename:G,fileErrorText:K,dropzoneProps:U,maxFiles:J,maxSize:Y,thumbColumn:X,isRequired:Z,isPreviews:ee,onAddFiles:te,onDeleteFile:ae,classNameGroupItem:re}=e;return j.default.createElement(r.Field,{name:t},(({input:e,meta:t})=>j.default.createElement(A,Object.assign({className:M.default("form-field_type_dropzone","form__item_type_dropzone",re),fieldClassName:"form-dropzone",inputName:e.name,inputValue:e.value,isRequired:Z,label:u,labelTextColor:b,metaActive:t.active,metaError:t.error,metaModifiedSinceLastSubmit:t.modifiedSinceLastSubmit,metaSubmitError:t.submitError,metaSubmitFailed:t.submitFailed,metaTouched:t.touched,metaValid:t.valid,hideMessage:I},R),j.default.createElement(Q,{dropzoneProps:U,hintDescription:H,hintTitle:N,borderWidth:o,borderColor:l,borderColorHover:s,borderType:n,thumbBorderWidth:d,thumbBorderColor:m,thumbBorderColorHover:c,thumbBorderType:f,fileErrorText:K,fill:g,size:i,maxFiles:J,maxSize:Y,removeThumbTextHoverColor:p,fillHover:h,className:x,thumbColumn:X,thumbDirection:$,inputName:e.name,inputValue:e.value,thumbNameTextSize:T,thumbNameTextColor:v,thumbNameTextWrap:y,thumbNameTextWeight:C,hintTitleTextSize:q,hintTitleTextColor:B,hintTitleTextWrap:W,hintTitleTextWeight:O,removeThumbTextSize:S,removeThumbTextColor:E,removeThumbTextWeight:F,hintDescriptionTextSize:D,hintDescriptionTextColor:w,hintDescriptionTextWrap:L,hintDescriptionTextWeight:V,errorMessageTextSize:P,errorMessageWeight:z,errorMessageTextColor:k,isPreviews:ee,shape:a,isShowFilename:G,metaError:t.error,metaTouched:t.touched,removeThumbText:_,onAddFiles:te,onDeleteFile:ae}))))}));X.defaultProps={errorMessageTextSize:"s",errorMessageTextColor:"errorTextPrimary",thumbColumn:1,thumbDirection:"vertical"},X.propTypes={name:B.default.string.isRequired,className:B.default.string,classNameGroupItem:B.default.string,classNameInput:B.default.string,classNameInputWrapper:B.default.string,dropzoneProps:B.default.object,hintDescription:B.default.string,hintTitle:B.default.string,inputClass:B.default.string,isPreviews:B.default.bool,isRequired:B.default.bool,isShowFilename:B.default.bool,label:B.default.any,removeThumbText:B.default.string,onAddFiles:B.default.func,onDeleteFile:B.default.func};const Z=j.default.memo((function(e){const{after:a,before:i,className:o,label:l,labelTextColor:s,labelTextSize:u,labelTextWeight:d,message:m,errorMessageTextSize:c,errorMessageTextWeight:f,errorMessageTextColor:p,messageTextSize:b,messageTextWeight:g,messageTextColor:h,children:x,dataTour:_,hideMessage:v,name:y,showErrorsOnSubmit:C}=e;return j.default.createElement(r.Field,{name:y},(({input:e,meta:r})=>{const S=r.error||!r.modifiedSinceLastSubmit&&r.submitError||!1,E=t.useMemo((()=>C?r.submitFailed&&r.touched&&S:r.touched&&S),[C,r.submitFailed,r.touched,S]);return j.default.createElement("div",{className:M.default("form__group",o),"data-tour":_},j.default.createElement("div",{className:"form__group-wrapper"},i,j.default.createElement("div",{className:"form__group-label"},j.default.createElement(T.Title,{textColor:s,size:u,textWeight:d},l)),j.default.createElement("div",{className:"form__group-items"},x),a),!v&&j.default.createElement(j.default.Fragment,null,Boolean(E)&&j.default.createElement(n.Text,{className:"form__group-message form__group-message_type-error",size:c,textWeight:f,textColor:p,id:`${y}-error`},S),Boolean(m)&&!E&&j.default.createElement(n.Text,{className:"form__group-message",size:b,textWeight:g,textColor:h},m),Boolean(!E)&&Boolean(!m)&&j.default.createElement(n.Text,{className:"form__group-message",size:b}," ")))}))}));Z.defaultProps={inputProps:{},fieldProps:{},type:"normal",errorMessageTextSize:"s",errorMessageTextColor:"errorTextPrimary",messageTextSize:"s",messageTextColor:"surfaceTextTertiary"},Z.propTypes={name:B.default.string.isRequired,isRequired:B.default.bool,fieldProps:B.default.object,inputProps:B.default.object};const ee=j.default.memo((function(e){const{isPassword:a,isRequired:i,fieldProps:o,inputProps:l,isRevealable:s,name:n,parse:u,iconSize:d,iconBorder:m,iconBorderHover:c,iconFill:f,iconFillHover:p,iconRevealableShow:b,iconRevealableHide:g,iconShape:h,hideMessage:x,onChange:_,classNameGroupItem:T}=e,[C,S]=t.useState(!1),E=t.useMemo((()=>a?C?"text":"password":"text"),[C,a]),F=t.useCallback((e=>{e.preventDefault(),S((e=>!e))}),[S]);return j.default.createElement(r.Field,{name:n,parse:u},(({input:e,meta:a})=>{const r=t.useCallback((t=>{e.onChange(t),_&&_(t.target.value,e.name)}),[_]);return j.default.createElement(A,Object.assign({className:M.default("form-field_type_input","form__item_type_input",T),fieldClassName:s?"form-password":"form-input",inputName:e.name,inputValue:e.value||"",isRequired:i,metaActive:a.active,metaError:a.error,metaModifiedSinceLastSubmit:a.modifiedSinceLastSubmit,metaSubmitError:a.submitError,metaSubmitFailed:a.submitFailed,metaTouched:a.touched,metaValid:a.valid,hideMessage:x},o),j.default.createElement(v.Input,Object.assign({className:M.default(a.active&&"input_state_focus",a.error&&a.touched&&"input_state_error"),autoComplete:"nope",name:e.name,type:E,value:e.value||"",onBlur:e.onBlur,onChange:r,onFocus:e.onFocus},l)),s&&j.default.createElement(y.Icon,{className:"form-field__icon",iconFill:f,iconFillHover:p,SvgImage:C?g:b,imageSrc:C?g:b,shape:h,size:d,onClick:F}))}))}));function te(e){const{input:a,option:r,onChange:i,inputProps:o}=e,l=t.useCallback((e=>{e.target.checked&&i(r.value)}),[]);return j.default.createElement(C.RadioButton,Object.assign({className:"form-radio__item",checked:r.value===a.value,name:a.name,type:"radio",value:r.value,onBlur:a.onBlur,onChange:l,onFocus:a.onFocus,label:r.label},o))}function ae(e){const{input:a,value:r,onChange:i}=e,o=t.useCallback((e=>i(e.target.value)),[i]);return j.default.createElement(v.Input,Object.assign({autoComplete:"nope",name:a.name,onBlur:a.onBlur,onChange:o,onFocus:a.onFocus,value:r},e))}function re(e){const{input:a,options:r,editableProps:i,onChange:o,inputProps:l}=e,[s,n]=t.useState((()=>r.find((e=>e.value===a.value))?"":a.value));t.useEffect((()=>{if(a.value){const e=r.find((e=>e.value===a.value&&!e.editable));n(e?"":a.value)}else n("")}),[a.value]);const u=t.useCallback((e=>{a.onChange(e),o&&o(e,a.name)}),[a,o]),d=t.useCallback((e=>{n(""),u(e)}),[u]),m=t.useCallback((e=>{n(e),u(e)}),[u]);return j.default.createElement(j.default.Fragment,null,r.map((e=>e.editable?j.default.createElement(ae,{key:e.label,input:a,value:s,option:e,onChange:m,editableProps:i,inputProps:l}):j.default.createElement(te,{key:e.value,input:a,option:e,onChange:d,inputProps:l}))))}ee.defaultProps={inputProps:{},fieldProps:{}},ee.propTypes={fieldProps:B.default.object,inputProps:B.default.object,isPassword:B.default.bool,isRequired:B.default.bool,isRevealable:B.default.bool,name:B.default.string.isRequired,onChange:B.default.func},te.propTypes={inputProps:B.default.object,onChange:B.default.func,option:B.default.shape({label:B.default.string,value:B.default.string}),input:B.default.shape({name:B.default.string,value:B.default.string,onBlur:B.default.func,onFocus:B.default.func,onChange:B.default.func})},ae.propTypes={input:B.default.string,value:B.default.string,editableProps:B.default.object,onChange:B.default.func},re.propTypes={editableProps:B.default.object,input:B.default.object,inputProps:B.default.object,onChange:B.default.object,options:B.default.object};const ie=j.default.memo((function(e){const{isRequired:t,name:a,options:i,fieldProps:o,editableProps:l,inputProps:s,onChange:n,hideMessage:u}=e;return j.default.createElement(r.Field,{name:a},(({input:e,meta:a})=>j.default.createElement(A,Object.assign({className:"form__item_type_radio",fieldClassName:"form-radio",inputName:e.name,inputValue:e.value||"",isRequired:t,metaActive:a.active,metaError:a.error,metaModifiedSinceLastSubmit:a.modifiedSinceLastSubmit,metaSubmitError:a.submitError,metaSubmitFailed:a.submitFailed,metaTouched:a.touched,metaValid:a.valid,hideMessage:u},o),j.default.createElement(re,{input:e,options:i,onChange:n,editableProps:l,inputProps:s}))))}));function oe(e){const{options:a,isRequired:i,name:o,fieldProps:l,inputProps:s,hideMessage:n}=e,{change:u}=r.useForm();return j.default.createElement(r.Field,{name:o},(({input:e,meta:r})=>{const d=t.useMemo((()=>{const t={value:null,label:null};if(e.value){return a.find((t=>t.value===e.value))||t}return t}),[e.value]),m=t.useCallback((e=>{u(o,e.value)}),[u]);return j.default.createElement(A,Object.assign({className:M.default("form-field_type_segmented","form__item_type_segmented"),fieldClassName:"form-segmented",inputName:e.name,inputValue:e.value||[],isRequired:i,metaActive:r.active,metaError:r.error,metaModifiedSinceLastSubmit:r.modifiedSinceLastSubmit,metaSubmitError:r.submitError,metaSubmitFailed:r.submitFailed,metaTouched:r.touched,metaValid:r.valid,hideMessage:n},l),j.default.createElement(S.Segmented,Object.assign({segments:a,setActiveSegment:m,activeSegment:d},s)))}))}function le(e,t){const a=Array.isArray(t)?t:[t];let r=[];return e.forEach((e=>{const i=a.includes(e.value),o=a.includes(e.label);let l=[];e.options&&(l=le(e.options,t)),i||o?r.push(e):l.length&&(r=r.concat(l))})),r}ie.defaultProps={fieldProps:{},editableProps:{},inputProps:{},options:[]},ie.propTypes={name:B.default.string.isRequired,fieldProps:B.default.object,inputProps:B.default.object,editableProps:B.default.object,isRequired:B.default.bool,options:B.default.array,onChange:B.default.func},oe.propTypes={options:B.default.array.isRequired,name:B.default.string.isRequired,className:B.default.string,inputClass:B.default.string,isRequired:B.default.bool,label:B.default.string,placeholder:B.default.string,fieldProps:B.default.object,inputProps:B.default.object};const se=j.default.memo((function(e){const{isRequired:a,key:i,name:o,options:l,fieldProps:s,selectProps:n,selectRef:u,onChange:d,classNameGroupItem:m,hideMessage:c}=e;return j.default.createElement(r.Field,{name:o},(({input:e,meta:r})=>{const o=t.useCallback((t=>{e.onChange(t),d&&d(t,e.name)}),[d]),[f,p]=t.useState(null),b=t.useMemo((()=>{const t=le(l,e.value);return!t.length&&e.value?.length&&t.push({value:e.value,label:e.value}),t}),[e.value]);t.useEffect((()=>p(b)),[b]);const g=t.useCallback(((e,t)=>{const a=Array.isArray(e)?e.map((e=>e.value)):e?.value||null;p(e),o(a)}),[o]);return j.default.createElement(A,Object.assign({className:M.default("form-field_type_select","form__item_type_select",m),fieldClassName:"form-select",inputName:e.name,inputValue:e.value,isRequired:a,metaActive:r.active,metaError:r.error,metaModifiedSinceLastSubmit:r.modifiedSinceLastSubmit,metaSubmitError:r.submitError,metaSubmitFailed:r.submitFailed,metaTouched:r.touched,metaValid:r.valid,hideMessage:c},s),j.default.createElement(E.Select,Object.assign({className:"form-select-item",instanceId:`id_${e.name}`,value:f,onChange:g,options:l,ref:u,key:i},n)))}))}));se.propTypes={name:B.default.string.isRequired,selectProps:B.default.object,isRequired:B.default.bool,label:B.default.any,messageType:B.default.string,options:B.default.array,onChange:B.default.func};const ne=j.default.memo((function(e){const{name:a,isRequired:i,onChange:o,fieldProps:l,inputProps:s,classNameGroupItem:n,hideMessage:u}=e;return j.default.createElement(r.Field,{name:a,type:"checkbox"},(({input:e,meta:a})=>{const r=t.useCallback((t=>{e.onChange(t),o&&o(t.target.checked,e.name)}),[o]);return j.default.createElement(A,Object.assign({className:M.default("form-field_type_switch","form__item_type_switch",n),fieldClassName:"form-switch",inputName:e.name,inputValue:e.checked,isRequired:i,metaActive:a.active,metaError:a.error,metaModifiedSinceLastSubmit:a.modifiedSinceLastSubmit,metaSubmitError:a.submitError,metaSubmitFailed:a.submitFailed,metaTouched:a.touched,metaValid:a.valid,hideMessage:u,tag:"label"},l),j.default.createElement(F.Switch,Object.assign({autoComplete:"nope",checked:e.checked,name:e.name,type:"checkbox",onBlur:e.onBlur,onChange:r,onFocus:e.onFocus},s)))}))}));ne.defaultProps={inputProps:{},fieldProps:{}},ne.propTypes={fieldProps:B.default.object,inputProps:B.default.object,isRequired:B.default.bool,name:B.default.string,onChange:B.default.func};const ue=j.default.memo((function(e){const{isRequired:t,name:a,fieldProps:i,inputProps:o,classNameGroupItem:l,hideMessage:s}=e;return j.default.createElement(r.Field,{name:a},(({input:e,meta:a})=>j.default.createElement(A,Object.assign({className:M.default("form-field_type_textarea","form__item_type_textarea",l),fieldClassName:"form-textarea",inputName:e.name,inputValue:e.value,isRequired:t,metaActive:a.active,metaError:a.error,metaModifiedSinceLastSubmit:a.modifiedSinceLastSubmit,metaSubmitError:a.submitError,metaSubmitFailed:a.submitFailed,metaTouched:a.touched,metaValid:a.valid,hideMessage:s},i),j.default.createElement(N.Textarea,Object.assign({autoComplete:"nope",name:e.name,value:e.value,onBlur:e.onBlur,onChange:e.onChange,onFocus:e.onFocus},o)))))}));ue.defaultProps={inputProps:{},fieldProps:{}},ue.propTypes={name:B.default.string.isRequired,isRequired:B.default.bool,fieldProps:B.default.object,inputProps:B.default.object};const de=(e,t)=>{const r=Object.keys(t).map((e=>e===a.FORM_ERROR?"notification__item_status_error":`react-select-id_${e}-input`)),i=e.find((e=>e.name?a.getIn(t,e.name):r.includes(e.id))),o=Object.keys(t);if(!i&&o.length){let e;try{const t=o[0];t===a.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"})}return i&&i.scrollIntoView({block:"center"}),null},me=D.default(null,de),ce={checkbox:"checkbox",custom:"custom",choice:"choice",code:"code",datePicker:"datePicker",dateRangePicker:"dateRangePicker",fileInput:"fileInput",group:"group",radioGroup:"radioGroup",segmented:"segmented",select:"select",switch:"switch",text:"text",textarea:"textarea"};function fe(e,t,a){switch(e.type){case ce.checkbox:return j.default.createElement($,Object.assign({key:t.key},e,a));case ce.choice:return j.default.createElement(H,Object.assign({key:t.key},e,a));case ce.code:return j.default.createElement(K,Object.assign({key:t.key},e,a));case ce.switch:return j.default.createElement(ne,Object.assign({key:t.key},e,a));case ce.segmented:return j.default.createElement(oe,Object.assign({key:t.key},e,a));case ce.datePicker:return j.default.createElement(U,Object.assign({key:t.key},e,a));case ce.fileInput:return j.default.createElement(X,Object.assign({key:t.key},e,a));case ce.radioGroup:return j.default.createElement(ie,Object.assign({key:t.key},e,a));case ce.select:return j.default.createElement(se,Object.assign({key:t.key},e,a));case ce.text:return j.default.createElement(ee,Object.assign({key:t.key},e,a));case ce.textarea:return j.default.createElement(ue,Object.assign({key:t.key},e,a));case ce.custom:return j.default.createElement(G,Object.assign({key:t.key},e,a));case ce.group:return j.default.createElement(Z,Object.assign({key:t.key},e,a),Object.entries(e.group).map((([t,r])=>fe({...r,hideMessage:e.hideMessage,classNameGroupItem:r.classNameGroupItem||"form__group-item"},{key:t+"_form_group"},a))))}}const pe=j.default.forwardRef((function(e,a){const{additionalProps:i,after:o,before:l,buttonDirection:s,buttonGap:m,buttonPadding:c,groupGap:f,className:p,config:b,description:g,descriptionSize:h,descriptionTextColor:x,descriptionTextWeight:v,disableFieldsAutoComplete:y,fieldsGap:C,formName:S,initialValues:E,initialValuesEqual:F,isLoading:N,loader:R,loaderSet:q,loaderFill:B,loaderItemFill:W,loaderText:O,language:D,mutators:w,onChangeFormValues:L,onClickSecondaryButton:I,onClickTertiaryButton:A,onSubmit:$,primaryButton:H,primaryButtonLabel:G,secondaryButton:K,secondaryButtonLabel:U,primaryButtonFill:J,primaryButtonFillHover:Y,secondaryButtonFill:Q,secondaryButtonFillHover:X,primaryButtonSize:Z,primaryButtonLabelTextColor:ee,primaryButtonLabelSize:te,primaryButtonLabelTextWeight:ae,secondaryButtonSize:re,secondaryButtonLabelTextColor:ie,secondaryButtonLabelSize:oe,secondaryButtonLabelTextWeight:le,tertiaryButton:se,tertiaryButtonFill:ne,tertiaryButtonFillHover:ue,tertiaryButtonSize:de,tertiaryButtonLabelTextColor:ce,tertiaryButtonLabelSize:pe,tertiaryButtonLabelTextWeight:be,tertiaryButtonLabel:ge,set:he,type:xe,buttonJustifyContent:_e,title:Te,notificationType:ve,buttonFill:ye,titleTextSize:Ce,titleTextColor:Se,titleTextWeight:Ee,validationSchema:Fe,dataTour:Ne,dataTourButtons:Pe,dataTourPrimaryButton:ze,dataTourSecondaryButton:ke,dataTourTertiaryButton:Re}=e,qe=V(Fe,D),je=t.useCallback((e=>{a&&(a.current=e)}),[a]),Be=u.useDeviceTargetClass(e,{prefix:"fill_",propsKey:"fill"}),Me=u.useDeviceTargetClass(e,{prefix:"direction_",propsKey:"direction"}),We=u.useDeviceTargetClass(e,{prefix:"shape_",propsKey:"shape"}),Oe=u.useDeviceTargetClass(e,{prefix:"elevation_",propsKey:"elevation"}),{styles:De}=d.useStyles(e);return j.default.createElement(r.Form,{decorators:[me],initialValues:E,initialValuesEqual:F,mutators:w,render:({handleSubmit:e,submitError:t,modifiedSinceLastSubmit:a,form:u})=>j.default.createElement("form",{style:De,className:M.default(p,"form",he&&`form_set_${he}`,xe&&`form_type_${xe}`,Me,Be,We,Oe),name:S,"data-tour":Ne,ref:()=>je(u),onSubmit:e,autoComplete:y?"off":void 0,autoCorrect:y?"off":void 0,autoCapitalize:y?"off":void 0,spellCheck:y?"false":void 0},l,Te&&j.default.createElement(T.Title,{className:"form__title",size:Ce,textColor:Se,textWeight:Ee},Te),g&&j.default.createElement(n.Text,{className:"form__description",size:h,textColor:x,textWeight:v},g),t&&!a&&j.default.createElement("div",{className:M.default("notification","form-notification",ve?`form-notification_type_${ve}`:"form-notification_type_global")},j.default.createElement(k.NotificationItem,{className:"form-notification__item",titleTextSize:"h6",title:u.getState().submitError,set:"form",status:"error"})),L&&j.default.createElement(r.FormSpy,{subscription:{values:!0},onChange:L}),Boolean(Object.keys(b).length)&&j.default.createElement(z.Group,{direction:"vertical",gap:C||f,className:"form__wrapper"},Object.keys(b).map((e=>fe(b[e],{key:e},i[b[e].name]))),N&&(R||j.default.createElement(_.Loader,{className:"form__loader",set:q,fill:B,itemFill:W,text:O}))),(G||H||U||K||se||ge)&&j.default.createElement(z.Group,{fill:ye,justifyContent:_e,direction:s,padding:c,gap:m,className:"form__button",dataTour:Pe},G?j.default.createElement(P.Button,{width:"fill",className:"form__button-item",fill:J,fillHover:Y,size:Z,labelTextColor:ee,labelSize:te,labelTextWeight:ae,label:G,dataTour:ze}):H,U?j.default.createElement(P.Button,{width:"fill",className:"form__button-item",fill:Q,fillHover:X,size:re,labelTextColor:ie,labelSize:oe,labelTextWeight:le,label:U,onClick:I,dataTour:ke}):K,ge?j.default.createElement(P.Button,{width:"fill",className:"form__button-item",fill:ne,fillHover:ue,size:de,labelTextColor:ce,labelSize:pe,labelTextWeight:be,label:ge,onClick:A,dataTour:Re}):se),o),subscription:{submitting:!0,pristine:!0,modifiedSinceLastSubmit:!0,submitError:!0},validate:qe,onSubmit:$})}));pe.propTypes={additionalProps:B.default.object,after:B.default.any,before:B.default.any,buttonGap:B.default.string,className:B.default.string,config:B.default.object,description:B.default.string,descriptionSize:B.default.string,descriptionTextColor:B.default.string,descriptionTextWeight:B.default.string,disableFieldsAutoComplete:B.default.string,fieldsGap:B.default.string,formName:B.default.string,initialValues:B.default.any,initialValuesEqual:B.default.any,language:B.default.string,isLoading:B.default.bool,loaderText:B.default.string,mutators:B.default.any,onChangeFormValues:B.default.func,onClickSecondaryButton:B.default.func,onSubmit:B.default.func,primaryButton:B.default.string,primaryButtonFill:B.default.string,primaryButtonLabel:B.default.string,secondaryButton:B.default.string,secondaryButtonFill:B.default.string,secondaryButtonLabel:B.default.string,set:B.default.string,title:B.default.string,titleSize:B.default.string,titleTextColor:B.default.string,titleTextWeight:B.default.string,validationSchema:B.default.object},pe.defaultProps={additionalProps:{},isLoading:!1,loaderSet:"simple",loaderFill:"surfacePrimary",loaderItemFill:"surfaceItemAccent",language:"en",titleSize:"h1",buttonDirection:"vertical",direction:"vertical",disableFieldsAutoComplete:!1},Object.defineProperty(exports,"Field",{enumerable:!0,get:function(){return r.Field}}),Object.defineProperty(exports,"useForm",{enumerable:!0,get:function(){return r.useForm}}),Object.defineProperty(exports,"useFormState",{enumerable:!0,get:function(){return r.useFormState}}),exports.Checkbox=$,exports.ChoiceField=H,exports.CodeField=K,exports.CustomField=G,exports.DatePickerField=U,exports.FieldWrapper=A,exports.FieldWrapperBase=I,exports.FileInput=X,exports.FinalForm=pe,exports.Group=Z,exports.InputField=ee,exports.RadioGroup=ie,exports.SegmentedField=oe,exports.SelectField=se,exports.Switch=ne,exports.Textarea=ue,exports.addRequiredFieldsParamToSchema=e=>{const t=Object.entries(e.fields);return e.requiredFields=t.reduce(((e,[t,a])=>(a.exclusiveTests?.required&&e.push(t),e)),[]),e},exports.emailValidation=(e,t)=>{if(!e)return!0;return/^(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9]{2,}(?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])$/.test(String(e).toLowerCase())},exports.focusOnError=de,exports.focusOnErrorDecorator=me,exports.formTypes=ce,exports.generateField=fe,exports.phoneValidation=(t,a)=>!t||e.isPossiblePhoneNumber(t,"RU"),exports.sendFormDataToServer=async(e,t)=>{try{return{success:!0,response:await W.default({url:e,method:"POST",data:t})}}catch(e){const t={};return"string"==typeof e.response?.data&&(t[a.FORM_ERROR]="Something went wrong"),"object"==typeof e.response?.data&&Object.entries(e.response.data).forEach((([e,a])=>{t[e]=a[0]})),{success:!1,formErrors:t,error:e}}},exports.setErrorsMutator=(e,t)=>{const[a,r]=e,i=r.submitError,o=r.error;if("non_field_errors"===a)t.formState.error=o,t.formState.submitError=i;else if(a in t.fields){if(o){const e=Object.assign({},t.formState.errors,{[a]:o});t.fields[a].touched=!0,t.fields[a].error=o,t.formState.errors=e}if(i){const e=Object.assign({},t.formState.submitErrors,{[a]:i});t.fields[a].submitError=i,t.formState.submitErrors=e,t.formState.submitFailed=!0,t.formState.submitSucceeded=!1,t.formState.lastSubmittedValues=t.formState.values}}},exports.useYupValidationSchema=V;
+'use strict';
+
+var libphonenumberJs = require('libphonenumber-js');
+var React = require('react');
+var finalForm = require('final-form');
+var reactFinalForm = require('react-final-form');
+var PropTypes = require('prop-types');
+var clsx = require('clsx');
+var Checkbox = require('@itcase/ui/components/Checkbox');
+var Divider = require('@itcase/ui/components/Divider');
+var Text = require('@itcase/ui/components/Text');
+var useDeviceTargetClass = require('@itcase/ui/hooks/useDeviceTargetClass');
+var useStyles = require('@itcase/ui/hooks/useStyles');
+var Choice = require('@itcase/ui/components/Choice');
+var Code = require('@itcase/ui/components/Code');
+var DatePicker = require('@itcase/ui/components/DatePicker');
+var axios = require('axios');
+var reactDropzone = require('react-dropzone');
+var fileSelector = require('file-selector');
+var castArray = require('lodash/castArray');
+var common = require('@itcase/common');
+var Loader = require('@itcase/ui/components/Loader');
+var Title = require('@itcase/ui/components/Title');
+var Input = require('@itcase/ui/components/Input');
+var Icon = require('@itcase/ui/components/Icon');
+var RadioButton = require('@itcase/ui/components/RadioButton');
+var Segmented = require('@itcase/ui/components/Segmented');
+var Select = require('@itcase/ui/components/Select');
+var Switch = require('@itcase/ui/components/Switch');
+var Textarea = require('@itcase/ui/components/Textarea');
+var Button = require('@itcase/ui/components/Button');
+var Group$1 = require('@itcase/ui/components/Group');
+var Notification = require('@itcase/ui/components/Notification');
+var createDecorator = require('final-form-focus');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
+var clsx__default = /*#__PURE__*/_interopDefault(clsx);
+var axios__default = /*#__PURE__*/_interopDefault(axios);
+var castArray__default = /*#__PURE__*/_interopDefault(castArray);
+var createDecorator__default = /*#__PURE__*/_interopDefault(createDecorator);
+
+const phoneValidation = (value, context) => {
+  if (!value) {
+    return true;
+  }
+  return libphonenumberJs.isPossiblePhoneNumber(value, 'RU');
+};
+const emailValidation = (value, context) => {
+  // from https://emailregex.com/
+  if (!value) {
+    return true;
+  }
+  // eslint-disable-next-line
+  const regexp = /^(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9]{2,}(?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])$/;
+  return regexp.test(String(value).toLowerCase());
+};
+const addRequiredFieldsParamToSchema = schema => {
+  const fields = Object.entries(schema.fields);
+  schema.requiredFields = fields.reduce((list, [fieldName, validationProps]) => {
+    if (validationProps.exclusiveTests?.required) {
+      list.push(fieldName);
+    }
+    return list;
+  }, []);
+  return schema;
+};
+
+/**
+ * Sets the `innerError.message` in an `errors` object at the key
+ * defined by `innerError.path`.
+ * @param {Object} errors The object to set the error in.
+ * @param {{ path: string, message: string }} innerError A `yup` field error.
+ * @returns {Object} The result of setting the new error message onto `errors`.
+ */
+const setInError = (errors, innerError) => {
+  return finalForm.setIn(errors, innerError.path, innerError.message);
+};
+
+/**
+ * Empty object map with no prototype. Used as default
+ * value for reducing the `err.inner` array of errors
+ * from a `yup~ValidationError`.
+ */
+const emptyObj = Object.create(null);
+
+/**
+ * Takes a `yup` validation schema and returns a function that expects
+ * a map of values to validate. If the validation passes, the function resolves to `undefined`
+ * (signalling that the values are valid). If the validation doesn't pass, it resolves
+ * to a map of invalid field names to errors.
+ * @param {import('yup').ObjectSchema} schema `yup` schema definition.
+ * @returns {(values: Object) => Promise<?Object>} An async function that expects some `values`
+ *  and resolves to either `undefined` or a map of field names to error messages.
+ */
+
+const makeValidate = schema => {
+  return async function validate(values) {
+    try {
+      await schema.validate(values, {
+        abortEarly: false
+      });
+    } catch (error) {
+      if (error.inner) {
+        return error.inner.reduce(setInError, emptyObj);
+      } else {
+        console.warn('itcase-forms schema.validate error: An error not related to the form occurred during validation. Validation ignored.');
+      }
+    }
+  };
+};
+function useYupValidationSchema(schema, language) {
+  const validate = React.useMemo(() => schema && makeValidate(schema), [schema, language]);
+  return validate;
+}
+
+function FieldWrapperBase(props) {
+  const {
+    after,
+    afterItem,
+    before,
+    beforeItem,
+    children,
+    className,
+    desc,
+    descTextSize,
+    descTextColor,
+    descTextWidth,
+    divider,
+    dividerDirection,
+    dividerFill,
+    dividerSize,
+    dividerWidth,
+    fieldClassName,
+    id,
+    inputName,
+    inputValue,
+    isRequired,
+    label,
+    labelTextSize,
+    labelTextColor,
+    labelTextWidth,
+    errorMessageTextSize,
+    errorMessageTextWeight,
+    errorMessageTextColor,
+    message,
+    messageTextSize,
+    messageTextColor,
+    messageTextWeight,
+    metaActive,
+    metaError,
+    metaModifiedSinceLastSubmit,
+    metaSubmitError,
+    metaSubmitFailed,
+    metaTouched,
+    metaValid,
+    set,
+    type,
+    hideMessage,
+    isHidden,
+    tag: Tag,
+    dataTour,
+    showErrorsOnSubmit
+  } = props;
+  const error = metaError || !metaModifiedSinceLastSubmit && metaSubmitError || false;
+  const showError = React.useMemo(() => {
+    if (showErrorsOnSubmit) {
+      return metaSubmitFailed && metaTouched && error;
+    } else {
+      return metaTouched && error;
+    }
+  }, [showErrorsOnSubmit, metaSubmitFailed, metaTouched, error]);
+  const showValid = React.useMemo(() => {
+    const hasValue = Array.isArray(inputValue) ? inputValue.length : inputValue;
+    const isModifiedAfterSubmit = !metaError && metaSubmitError && metaModifiedSinceLastSubmit;
+    return hasValue && (metaValid || isModifiedAfterSubmit);
+  }, [inputValue, metaValid, metaError, metaSubmitError, metaModifiedSinceLastSubmit]);
+  const formFieldClass = React.useMemo(() => clsx__default.default(className, showError && 'form__item_state_error', showValid && 'form__item_state_success', isRequired && 'form__item_state_required', metaActive && 'form__item_state_focus', inputValue && 'form__item_state_filled'), [className, showError, showValid, isRequired, metaActive, inputValue]);
+  const fieldClass = React.useMemo(() => clsx__default.default(fieldClassName, showError && `${fieldClassName}_state_error`, showValid && `${fieldClassName}_state_success`, metaActive && `${fieldClassName}_state_focus`, inputValue && `${fieldClassName}_state_filled`), [fieldClassName, showError, showValid, metaActive, inputValue]);
+  const sizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'form-field_size_',
+    propsKey: 'size'
+  });
+  const fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'fill_',
+    propsKey: 'fill'
+  });
+  const inputFillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'fill_',
+    propsKey: 'inputFill'
+  });
+  const shapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'form-field_shape_',
+    propsKey: 'shape'
+  });
+  const inputShapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'form-field__item-value_shape_',
+    propsKey: 'inputShape'
+  });
+  const directionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'direction_',
+    propsKey: 'direction'
+  });
+  const widthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'width_',
+    propsKey: 'width'
+  });
+  const {
+    styles: formFieldStyles
+  } = useStyles.useStyles(props);
+  return /*#__PURE__*/React__default.default.createElement(Tag, {
+    className: clsx__default.default(formFieldClass, 'form__item', 'form-field', type && `form-field_type_${type}`, set && `form-field_set_${set}`, sizeClass, fillClass, shapeClass, isHidden && `form-field_state_hidden`, directionClass, widthClass),
+    "data-tour": dataTour,
+    style: formFieldStyles
+  }, before, label && /*#__PURE__*/React__default.default.createElement("div", {
+    htmlFor: id,
+    className: "form-field__label"
+  }, /*#__PURE__*/React__default.default.createElement(Text.Text, {
+    size: labelTextSize,
+    textWeight: labelTextWidth,
+    textColor: labelTextColor
+  }, label)), desc && /*#__PURE__*/React__default.default.createElement("div", {
+    className: "form-field__desc"
+  }, /*#__PURE__*/React__default.default.createElement(Text.Text, {
+    size: descTextSize,
+    textWeight: descTextWidth,
+    textColor: descTextColor
+  }, desc)), /*#__PURE__*/React__default.default.createElement("div", {
+    className: clsx__default.default('form-field__content', inputFillClass, inputShapeClass)
+  }, /*#__PURE__*/React__default.default.createElement("div", {
+    className: clsx__default.default('form-field__content-inner', fieldClass)
+  }, beforeItem, children, afterItem), divider && /*#__PURE__*/React__default.default.createElement(Divider.Divider, {
+    className: "form-field__item-divider",
+    width: dividerWidth,
+    direction: dividerDirection,
+    size: dividerSize,
+    fill: dividerFill
+  })), !hideMessage && /*#__PURE__*/React__default.default.createElement("div", {
+    className: "form-field__message"
+  }, Boolean(showError) && /*#__PURE__*/React__default.default.createElement(Text.Text, {
+    className: "form-field__message-item form-field__message-item_type-error",
+    size: errorMessageTextSize,
+    textWeight: errorMessageTextWeight,
+    textColor: errorMessageTextColor,
+    id: `${inputName}-error`
+  }, error), Boolean(message) && !showError && /*#__PURE__*/React__default.default.createElement(Text.Text, {
+    className: "form-field__message-item form-field__message-item_type_message",
+    size: messageTextSize,
+    textWeight: messageTextWeight,
+    textColor: messageTextColor
+  }, message), Boolean(!showError) && Boolean(!message) && /*#__PURE__*/React__default.default.createElement(Text.Text, {
+    className: "form-field__message-item form-field__message-item_type_message",
+    size: messageTextSize
+  }, '\u00A0')), after);
+}
+FieldWrapperBase.defaultProps = {
+  tag: 'div',
+  type: 'normal',
+  errorMessageTextSize: 's',
+  errorMessageTextColor: 'errorTextSecondary'
+};
+FieldWrapperBase.propTypes = {
+  after: PropTypes__default.default.any,
+  afterItem: PropTypes__default.default.any,
+  autoComplete: PropTypes__default.default.string,
+  before: PropTypes__default.default.any,
+  beforeItem: PropTypes__default.default.any,
+  children: PropTypes__default.default.any,
+  className: PropTypes__default.default.string,
+  desc: PropTypes__default.default.string,
+  descTextSize: PropTypes__default.default.string,
+  descTextColor: PropTypes__default.default.string,
+  descTextWidth: PropTypes__default.default.string,
+  dividerDirection: PropTypes__default.default.string,
+  dividerFill: PropTypes__default.default.string,
+  dividerSize: PropTypes__default.default.string,
+  dividerWidth: PropTypes__default.default.string,
+  fieldClassName: PropTypes__default.default.string,
+  id: PropTypes__default.default.string,
+  inputName: PropTypes__default.default.string,
+  inputOnBlur: PropTypes__default.default.func,
+  inputOnChange: PropTypes__default.default.func,
+  inputOnFocus: PropTypes__default.default.func,
+  inputValue: PropTypes__default.default.any,
+  isRequired: PropTypes__default.default.bool,
+  itemType: PropTypes__default.default.string,
+  label: PropTypes__default.default.any,
+  labelTextSize: PropTypes__default.default.string,
+  labelTextColor: PropTypes__default.default.string,
+  labelTextWidth: PropTypes__default.default.string,
+  errorMessageTextSize: PropTypes__default.default.string,
+  errorMessageTextWidth: PropTypes__default.default.string,
+  errorMessageTextColor: PropTypes__default.default.string,
+  message: PropTypes__default.default.string,
+  messageSize: PropTypes__default.default.string,
+  messageTextColor: PropTypes__default.default.string,
+  messageTextWidth: PropTypes__default.default.string,
+  metaActive: PropTypes__default.default.bool,
+  metaError: PropTypes__default.default.string,
+  metaModifiedSinceLastSubmit: PropTypes__default.default.bool,
+  metaSubmitError: PropTypes__default.default.string,
+  metaSubmitFailed: PropTypes__default.default.bool,
+  metaTouched: PropTypes__default.default.bool,
+  metaValid: PropTypes__default.default.bool,
+  set: PropTypes__default.default.string,
+  showErrorsOnSubmit: PropTypes__default.default.bool,
+  type: PropTypes__default.default.string
+};
+function FieldWrapper(props) {
+  const {
+    inputName
+  } = props;
+  const {
+    change
+  } = reactFinalForm.useForm(); // , mutators
+
+  React.useEffect(() => {
+    return () => {
+      change(inputName, undefined);
+    };
+  }, []);
+  return /*#__PURE__*/React__default.default.createElement(FieldWrapperBase, props);
+}
+FieldWrapper.propTypes = {
+  autoComplete: PropTypes__default.default.string,
+  children: PropTypes__default.default.any,
+  className: PropTypes__default.default.string,
+  fieldClassName: PropTypes__default.default.string,
+  hint: PropTypes__default.default.string,
+  inputName: PropTypes__default.default.string,
+  inputOnBlur: PropTypes__default.default.func,
+  inputOnChange: PropTypes__default.default.func,
+  inputOnFocus: PropTypes__default.default.func,
+  inputValue: PropTypes__default.default.any,
+  isRequired: PropTypes__default.default.bool,
+  itemType: PropTypes__default.default.string,
+  label: PropTypes__default.default.any,
+  metaActive: PropTypes__default.default.bool,
+  metaError: PropTypes__default.default.string,
+  metaModifiedSinceLastSubmit: PropTypes__default.default.bool,
+  metaSubmitError: PropTypes__default.default.string,
+  metaSubmitFailed: PropTypes__default.default.bool,
+  metaTouched: PropTypes__default.default.bool,
+  metaValid: PropTypes__default.default.bool,
+  showErrorsOnSubmit: PropTypes__default.default.bool
+};
+
+const CheckboxField = /*#__PURE__*/React__default.default.memo(function CheckboxField(props) {
+  const {
+    name,
+    isRequired,
+    onChange,
+    fieldProps,
+    inputProps,
+    classNameGroupItem,
+    hideMessage
+  } = props;
+  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
+    name: name,
+    type: "checkbox"
+  }, ({
+    input,
+    meta
+  }) => {
+    const onChangeField = React.useCallback(event => {
+      input.onChange(event);
+      if (onChange) {
+        onChange(event.target.checked, input.name);
+      }
+    }, [onChange]);
+    return /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
+      className: clsx__default.default('form-field_type_checkbox', 'form__item_type_checkbox', classNameGroupItem),
+      fieldClassName: "form-checkbox",
+      inputName: input.name,
+      inputValue: input.checked,
+      isRequired: isRequired,
+      metaActive: meta.active,
+      metaError: meta.error,
+      metaModifiedSinceLastSubmit: meta.modifiedSinceLastSubmit,
+      metaSubmitError: meta.submitError,
+      metaSubmitFailed: meta.submitFailed,
+      metaTouched: meta.touched,
+      metaValid: meta.valid,
+      tag: "label",
+      hideMessage: hideMessage
+    }, fieldProps), /*#__PURE__*/React__default.default.createElement(Checkbox.Checkbox, Object.assign({
+      autoComplete: "nope",
+      checked: input.checked,
+      name: input.name,
+      type: "checkbox",
+      onBlur: input.onBlur,
+      onChange: onChangeField,
+      onFocus: input.onFocus
+    }, inputProps)));
+  });
+});
+CheckboxField.defaultProps = {
+  inputProps: {},
+  fieldProps: {}
+};
+CheckboxField.propTypes = {
+  fieldProps: PropTypes__default.default.object,
+  inputProps: PropTypes__default.default.object,
+  isRequired: PropTypes__default.default.bool,
+  name: PropTypes__default.default.string,
+  onChange: PropTypes__default.default.func
+};
+
+const ChoiceField = /*#__PURE__*/React__default.default.memo(function ChoiceField(props) {
+  const {
+    options,
+    classNameGroupItem,
+    fieldProps,
+    inputProps,
+    isMultiple,
+    isRequired,
+    initialValue,
+    label,
+    name,
+    messageType,
+    hideMessage,
+    placeholder
+  } = props;
+  const {
+    change
+  } = reactFinalForm.useForm();
+  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
+    name: name,
+    initialValue: initialValue
+  }, ({
+    input,
+    meta
+  }) => {
+    const activeOption = React.useMemo(() => {
+      const emptyOption = {
+        value: null,
+        label: null
+      };
+      if (input.value) {
+        const currentOption = options.find(option => option.value === input.value);
+        return currentOption || emptyOption;
+      }
+      return emptyOption;
+    }, [input.value]);
+    const setActiveSegment = React.useCallback(option => {
+      change(name, option.value);
+    }, [change]);
+    return /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
+      className: clsx__default.default('form-field_type_choice', 'form__item_type_choice', classNameGroupItem),
+      fieldClassName: "form-choice",
+      inputName: input.name,
+      inputValue: input.value || [],
+      isRequired: isRequired,
+      label: label,
+      messageType: messageType,
+      metaActive: meta.active,
+      metaError: meta.error,
+      metaModifiedSinceLastSubmit: meta.modifiedSinceLastSubmit,
+      metaSubmitError: meta.submitError,
+      metaSubmitFailed: meta.submitFailed,
+      metaTouched: meta.touched,
+      metaValid: meta.valid,
+      hideMessage: hideMessage
+    }, fieldProps), /*#__PURE__*/React__default.default.createElement(Choice.Choice, Object.assign({
+      className: clsx__default.default(meta.active && 'form-choice_state_focus', meta.error && meta.touched && 'form-choice_state_error'),
+      options: options,
+      inputName: input.name,
+      inputValue: input.value || [],
+      isMultiple: isMultiple,
+      isRequired: isRequired,
+      placeholder: placeholder,
+      active: activeOption,
+      setActiveSegment: setActiveSegment
+    }, inputProps)));
+  });
+});
+ChoiceField.propTypes = {
+  options: PropTypes__default.default.array.isRequired,
+  name: PropTypes__default.default.string.isRequired,
+  className: PropTypes__default.default.string,
+  inputClass: PropTypes__default.default.string,
+  isMultiple: PropTypes__default.default.bool,
+  isRequired: PropTypes__default.default.bool,
+  label: PropTypes__default.default.string,
+  placeholder: PropTypes__default.default.string
+};
+
+const CustomField = /*#__PURE__*/React__default.default.memo(function CustomField(props) {
+  const {
+    Component,
+    isRequired,
+    name,
+    fieldProps,
+    classNameGroupItem,
+    hideMessage
+  } = props;
+  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
+    name: name
+  }, ({
+    input,
+    meta
+  }) => /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
+    className: clsx__default.default('form-field_type_custom', 'form__item_type_custom', classNameGroupItem),
+    fieldClassName: 'form-custom',
+    inputName: input.name,
+    inputValue: input.value,
+    isRequired: isRequired,
+    metaActive: meta.active,
+    metaError: meta.error,
+    metaModifiedSinceLastSubmit: meta.modifiedSinceLastSubmit,
+    metaSubmitError: meta.submitError,
+    metaSubmitFailed: meta.submitFailed,
+    metaTouched: meta.touched,
+    metaValid: meta.valid,
+    hideMessage: hideMessage
+  }, fieldProps), /*#__PURE__*/React__default.default.createElement(Component, Object.assign({}, props, {
+    input: input,
+    meta: meta
+  }))));
+});
+CustomField.defaultProps = {
+  inputProps: {},
+  fieldProps: {}
+};
+CustomField.propTypes = {
+  name: PropTypes__default.default.string.isRequired,
+  isRequired: PropTypes__default.default.bool,
+  fieldProps: PropTypes__default.default.object,
+  inputProps: PropTypes__default.default.object
+};
+
+const CodeField = /*#__PURE__*/React__default.default.memo(function CodeField(props) {
+  const {
+    isRequired,
+    name,
+    fieldProps,
+    inputProps,
+    classNameGroupItem,
+    hideMessage
+  } = props;
+  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
+    name: name
+  }, ({
+    input,
+    meta
+  }) => /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
+    className: clsx__default.default('form-field_type_code', 'form__item_type_code', classNameGroupItem),
+    fieldClassName: 'form-code',
+    inputName: input.name,
+    inputValue: input.value,
+    isRequired: isRequired,
+    metaActive: meta.active,
+    metaError: meta.error,
+    metaModifiedSinceLastSubmit: meta.modifiedSinceLastSubmit,
+    metaSubmitError: meta.submitError,
+    metaSubmitFailed: meta.submitFailed,
+    metaTouched: meta.touched,
+    metaValid: meta.valid,
+    hideMessage: hideMessage
+  }, fieldProps), /*#__PURE__*/React__default.default.createElement(Code.Code, Object.assign({
+    autoComplete: "nope",
+    name: input.name,
+    value: input.value,
+    onBlur: input.onBlur,
+    onChange: input.onChange,
+    onFocus: input.onFocus
+  }, inputProps))));
+});
+CodeField.defaultProps = {
+  inputProps: {},
+  fieldProps: {}
+};
+CodeField.propTypes = {
+  name: PropTypes__default.default.string.isRequired,
+  isRequired: PropTypes__default.default.bool,
+  fieldProps: PropTypes__default.default.object,
+  inputProps: PropTypes__default.default.object
+};
+
+function DatePickerField(props) {
+  const {
+    isRequired,
+    fieldProps,
+    inputProps,
+    datePickerProps,
+    name,
+    iconSize,
+    iconBorder,
+    iconBorderHover,
+    iconFill,
+    iconFillHover,
+    iconRevealableShow,
+    iconRevealableHide,
+    iconShape,
+    hideMessage,
+    onChange,
+    classNameGroupItem
+  } = props;
+  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
+    name: name
+  }, ({
+    input,
+    meta
+  }) => {
+    const onChangeField = React.useCallback(value => {
+      input.onChange(value);
+      if (onChange) {
+        onChange(value, input.name);
+      }
+    }, [onChange]);
+    return /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
+      className: clsx__default.default('form-field_type_datepicker', 'form__item_type_datepicker', classNameGroupItem),
+      fieldClassName: "form-datepicker",
+      inputName: input.name,
+      inputValue: input.value || '',
+      isRequired: isRequired,
+      metaActive: meta.active,
+      metaError: meta.error,
+      metaModifiedSinceLastSubmit: meta.modifiedSinceLastSubmit,
+      metaSubmitError: meta.submitError,
+      metaSubmitFailed: meta.submitFailed,
+      metaTouched: meta.touched,
+      metaValid: meta.valid,
+      hideMessage: hideMessage
+    }, fieldProps), /*#__PURE__*/React__default.default.createElement(DatePicker.DatePickerInput, {
+      name: input.name,
+      value: input.value || '',
+      onBlur: input.onBlur,
+      onChange: onChangeField,
+      onFocus: input.onFocus,
+      inputProps: inputProps,
+      datePickerProps: datePickerProps
+    }));
+  });
+}
+DatePickerField.defaultProps = {
+  inputProps: {},
+  fieldProps: {}
+};
+DatePickerField.propTypes = {
+  fieldProps: PropTypes__default.default.object,
+  inputProps: PropTypes__default.default.object,
+  isRequired: PropTypes__default.default.bool,
+  name: PropTypes__default.default.string.isRequired,
+  onChange: PropTypes__default.default.func
+};
+
+async function getFileByURL(url) {
+  try {
+    const response = await axios__default.default({
+      url: `/api/${url}/`,
+      responseType: 'blob'
+    });
+    const blobObject = response.data;
+    const dirtyFilename = response.headers['content-disposition']?.split('filename=')[1];
+    // Remove double quotes
+    let filename = dirtyFilename?.substring(1).slice(0, -1);
+    if (!filename) {
+      const typeParts = blobObject.type.split('/');
+      const fileType = typeParts[typeParts.length - 1];
+      filename = `${new Date().getTime()}.${fileType}`;
+    }
+    return new File([blobObject], filename, {
+      type: blobObject.type
+    });
+  } catch (error) {
+    console.log('error: ', error);
+    return null;
+  }
+}
+async function convertToFiles(inputValue, isPreviews) {
+  const newFiles = [];
+  for await (const value of castArray__default.default(inputValue)) {
+    let newFile = null;
+
+    // Download image by url and save as File instance
+    const isURL = typeof value === 'string' && value.includes('/');
+    if (value.image || isURL) {
+      newFile = await getFileByURL(value.image || value);
+      if (newFile) {
+        setFileDataURL(newFile);
+      }
+    }
+
+    // Convert dataURL to File instance
+    if (value.dataURL) {
+      newFile = common.createFileFromDataURL(value.name || value.path, value.dataURL);
+      newFile.dataURL = value.dataURL;
+    }
+
+    // Save new File to state
+    if (newFile) {
+      newFile.id = value.id;
+      if (isPreviews) {
+        newFile.preview = URL.createObjectURL(newFile);
+      }
+      newFiles.push(newFile);
+    }
+
+    // else if (value) {
+    //   newFiles.push({
+    //     name: value,
+    //     error: 'File is unavailable',
+    //   })
+    // }
+  }
+
+  return newFiles;
+}
+function setFileDataURL(file, resolve) {
+  resolve = resolve || (() => {});
+  // Init reader and save his file
+  const reader = new FileReader();
+  reader._readedFile = file;
+
+  // Set handlers
+  reader.onabort = () => resolve();
+  reader.onerror = () => resolve();
+  reader.onload = event => {
+    event.target._readedFile.dataURL = reader.result;
+    resolve();
+  };
+  // Run reader
+  if (file instanceof File) {
+    reader.readAsDataURL(file);
+  } else {
+    resolve();
+  }
+}
+const FileInputDropzone = /*#__PURE__*/React__default.default.memo(function FileInputDropzone(props) {
+  const {
+    inputName,
+    size,
+    className,
+    fileErrorText,
+    hintTitleTextSize,
+    removeThumbTextSize,
+    removeThumbTextColor,
+    removeThumbTextWeight,
+    thumbNameTextSize,
+    thumbNameTextColor,
+    removeThumbTextHoverColor,
+    thumbNameTextWrap,
+    thumbNameTextWeight,
+    hintTitleTextColor,
+    hintTitleTextWrap,
+    thumbColumn,
+    hintTitleTextWeight,
+    hintDescriptionTextSize,
+    hintDescriptionTextColor,
+    hintDescriptionTextWrap,
+    hintDescriptionTextWeight,
+    errorMessageTextSize,
+    errorMessageTextWeight,
+    errorMessageTextColor,
+    inputValue,
+    maxFiles,
+    maxSize,
+    removeThumbText,
+    hintTitle,
+    hintDescription,
+    isShowFilename,
+    isPreviews,
+    loadingText,
+    dropzoneProps = {},
+    onAddFiles,
+    onDeleteFile
+  } = props;
+  const [fileError, setFileError] = React.useState('');
+  const [fileIsLoading, setFileIsLoading] = React.useState(false);
+  // State with instances of "File" type
+  const [files, setFiles] = React.useState(inputValue ? castArray__default.default(inputValue) : []);
+
+  // Save to mobx state
+  const {
+    change
+  } = reactFinalForm.useForm();
+  const changeFormState = React.useCallback(newFiles => {
+    // If max files in dropzone is 1 - return file as it self, else as array of files
+    // ps: for old projects compatibility
+    const toSave = dropzoneProps.maxFiles == 1 ? newFiles[0] : newFiles;
+    change(inputName, toSave);
+    return toSave;
+  }, [dropzoneProps, change]);
+
+  // Create dropzone options
+  const {
+    getRootProps,
+    getInputProps
+  } = reactDropzone.useDropzone({
+    maxSize: maxSize || 10485760,
+    // 10mb
+    maxFiles: maxFiles || 5,
+    // accept: { 'image/*': [] },
+    ...dropzoneProps,
+    getFilesFromEvent: async event => {
+      const result = await fileSelector.fromEvent(event);
+      const newFiles = result.filter(item => item instanceof File);
+      // Add exists and new files to accepted(or rejected)
+      return [...files, ...newFiles];
+    },
+    onDropAccepted: (acceptedFiles, event) => {
+      // If dropped files has accepted and we need a previews
+      if (isPreviews) {
+        // Add preview to every file
+        acceptedFiles.forEach(file => {
+          if (!file.error) {
+            file.preview = URL.createObjectURL(file);
+          }
+        });
+      }
+      // Save to form data (including empty when files are not valid)
+      setFiles(acceptedFiles);
+      setFileError('');
+
+      // Save DataURL for all files
+      const readerPromisesList = acceptedFiles.map(file => {
+        return new Promise(resolve => setFileDataURL(file, resolve));
+      });
+      // Save files to form values
+      Promise.all(readerPromisesList).then(() => {
+        const filesToSave = changeFormState(acceptedFiles);
+        if (onAddFiles) {
+          onAddFiles(filesToSave, inputName);
+        }
+      });
+    },
+    onDropRejected: (rejectedFiles, event) => {
+      // If dropped files has rejected
+      if (rejectedFiles.length) {
+        const firstFileError = rejectedFiles[0].errors[0]?.message;
+        // Show error
+        setFileError(firstFileError || 'Error on adding file');
+      } else {
+        // Else clean error
+        setFileError('');
+      }
+    }
+  });
+
+  // Delete file from dropzone
+  const removeFile = React.useCallback((event, index) => {
+    event.stopPropagation();
+    event.preventDefault();
+    const newFiles = [...files];
+    newFiles.splice(index, 1);
+    if (onDeleteFile) {
+      onDeleteFile(files[index], inputName);
+    }
+    changeFormState(newFiles);
+  }, [files, changeFormState, onDeleteFile]);
+
+  //
+  const convertFiledValueAndSaveAsFiles = React.useCallback(async newInputValue => {
+    setFileIsLoading(true);
+    const newFiles = await convertToFiles(newInputValue, isPreviews);
+    setFileIsLoading(false);
+    setFiles(newFiles);
+    return newFiles;
+  }, [isPreviews]);
+  React.useEffect(() => {
+    // First time convert value to Files and save to local and form state
+    convertFiledValueAndSaveAsFiles(inputValue).then(newFiles => changeFormState(newFiles));
+  }, []); // eslint-disable-line
+
+  React.useEffect(() => {
+    // Everytime convert value to Files and save to local state
+    if (!inputValue) {
+      setFiles([]);
+    } else {
+      convertFiledValueAndSaveAsFiles(inputValue);
+    }
+    // only "inputValue"
+  }, [inputValue]); // eslint-disable-line
+
+  React.useEffect(() => {
+    // Make sure to revoke the data uris to avoid memory leaks, will run on unmount
+    return () => files.forEach(file => URL.revokeObjectURL(file?.preview));
+  }, []); // eslint-disable-line
+
+  const fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'fill_',
+    propsKey: 'fill'
+  });
+  const fillHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'fill_hover_',
+    propsKey: 'fillHover'
+  });
+  const borderWidthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'border-width_',
+    propsKey: 'borderWidth'
+  });
+  const borderColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'border-color_',
+    propsKey: 'borderColor'
+  });
+  const borderColorHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'border-color_hover_',
+    propsKey: 'borderColorHover'
+  });
+  const borderTypeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'border_type_',
+    propsKey: 'borderType'
+  });
+  const shapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'form-dropzone_shape_',
+    propsKey: 'shape'
+  });
+  const thumbBorderWidthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'border-width_',
+    propsKey: 'thumbBorderWidth'
+  });
+  const thumbDirectionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'form-dropzone__thumb_direction_',
+    propsKey: 'thumbDirection'
+  });
+  const thumbBorderColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'border-color_',
+    propsKey: 'thumbBorderColor'
+  });
+  const thumbBorderColorHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'border-color_hover_',
+    propsKey: 'thumbBorderColorHover'
+  });
+  const thumbBorderTypeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'border_type_',
+    propsKey: 'thumbBorderType'
+  });
+  return /*#__PURE__*/React__default.default.createElement(React__default.default.Fragment, null, /*#__PURE__*/React__default.default.createElement("div", getRootProps({
+    className: `form-dropzone__dropzone dropzone ${className} thumbColumn form-dropzone__dropzone_size_${size} ${shapeClass}`
+  }), /*#__PURE__*/React__default.default.createElement("input", Object.assign({}, getInputProps(), {
+    name: inputName
+  })), /*#__PURE__*/React__default.default.createElement("div", {
+    className: clsx__default.default('form-dropzone__dropzone-wrapper', thumbColumn && `form-dropzone__dropzone-wrapper_column_${thumbColumn}`, fillClass, fillHoverClass, borderWidthClass, borderColorClass, borderColorHoverClass, borderTypeClass)
+  }, files.map((file, i) => /*#__PURE__*/React__default.default.createElement("aside", {
+    className: clsx__default.default('form-dropzone__thumb', fillClass, thumbDirectionClass, thumbBorderWidthClass, thumbBorderColorClass, thumbBorderColorHoverClass, thumbBorderTypeClass),
+    key: `${file.id || `${file.name}_${i}` || 'i' + i}`
+  }, isPreviews && !file.error && /*#__PURE__*/React__default.default.createElement("div", {
+    className: "form-dropzone__thumb-image"
+  }, /*#__PURE__*/React__default.default.createElement("img", {
+    className: "form-dropzone__thumb-image-inner",
+    src: file.preview || file.image,
+    onLoad: () => {
+      // Revoke data uri after image is loaded
+      URL.revokeObjectURL(file.preview);
+    }
+  })), file.error && /*#__PURE__*/React__default.default.createElement("div", null, /*#__PURE__*/React__default.default.createElement(Text.Text, {
+    size: thumbNameTextSize,
+    textColor: thumbNameTextColor,
+    textWrap: thumbNameTextWrap,
+    textWeight: thumbNameTextWeight
+  }, fileErrorText || file.error)), isShowFilename && /*#__PURE__*/React__default.default.createElement("div", {
+    className: "form-dropzone__thumb-name"
+  }, /*#__PURE__*/React__default.default.createElement(Text.Text, {
+    size: thumbNameTextSize,
+    textColor: thumbNameTextColor,
+    textWrap: thumbNameTextWrap,
+    textWeight: thumbNameTextWeight,
+    className: "form-dropzone__thumb-name-inner"
+  }, file.name)), fileIsLoading && /*#__PURE__*/React__default.default.createElement("div", {
+    className: "form-dropzone__thumb-loader"
+  }, /*#__PURE__*/React__default.default.createElement(Loader.Loader, {
+    fill: "surfacePrimary",
+    height: "fill",
+    itemFill: "surfaceItemAccent",
+    set: "simple",
+    width: "fill"
+  })), /*#__PURE__*/React__default.default.createElement("div", {
+    className: "form-dropzone__thumb-remove",
+    onClick: event => removeFile(event, i)
+  }, /*#__PURE__*/React__default.default.createElement(Text.Text, {
+    size: removeThumbTextSize,
+    textColor: removeThumbTextColor,
+    textWeight: removeThumbTextWeight,
+    textColorHover: removeThumbTextHoverColor,
+    className: "form-dropzone__thumb-remove-text"
+  }, removeThumbText || 'Remove')))), !files.length ? /*#__PURE__*/React__default.default.createElement("div", {
+    className: "form-dropzone__hint"
+  }, /*#__PURE__*/React__default.default.createElement(Text.Text, {
+    size: hintTitleTextSize,
+    textColor: hintTitleTextColor,
+    textWrap: hintTitleTextWrap,
+    textWeight: hintTitleTextWeight,
+    className: "form-dropzone__hint-title"
+  }, hintTitle || 'Select a file or drag in form'), /*#__PURE__*/React__default.default.createElement(Text.Text, {
+    size: hintDescriptionTextSize,
+    textColor: hintDescriptionTextColor,
+    textWrap: hintDescriptionTextWrap,
+    textWeight: hintDescriptionTextWeight,
+    className: "form-dropzone__hint-text"
+  }, hintDescription)) : /*#__PURE__*/React__default.default.createElement("div", {
+    className: "form-dropzone__hint form-dropzone__hint_type_add-more"
+  }, /*#__PURE__*/React__default.default.createElement(Text.Text, {
+    size: hintTitleTextSize,
+    textColor: hintTitleTextColor,
+    textWrap: hintTitleTextWrap,
+    textWeight: hintTitleTextWeight,
+    className: "form-dropzone__hint-title"
+  }, hintTitle || 'Select a file or drag in form'), /*#__PURE__*/React__default.default.createElement(Text.Text, {
+    size: hintDescriptionTextSize,
+    textColor: hintDescriptionTextColor,
+    textWrap: hintDescriptionTextWrap,
+    textWeight: hintDescriptionTextWeight,
+    className: "form-dropzone__hint-text"
+  }, hintDescription)))), fileError && /*#__PURE__*/React__default.default.createElement("div", {
+    className: "form-field__message"
+  }, /*#__PURE__*/React__default.default.createElement(Text.Text, {
+    className: "form-field__message-item form-field__message-item_type_message",
+    size: errorMessageTextSize,
+    textWeight: errorMessageTextWeight,
+    textColor: errorMessageTextColor
+  }, fileError)));
+});
+FileInputDropzone.propTypes = {
+  dropzoneProps: PropTypes__default.default.object,
+  hintDescription: PropTypes__default.default.string,
+  hintTitle: PropTypes__default.default.string,
+  inputName: PropTypes__default.default.string,
+  inputValue: PropTypes__default.default.any,
+  isPreviews: PropTypes__default.default.bool,
+  isShowFilename: PropTypes__default.default.bool,
+  loadingText: PropTypes__default.default.string,
+  metaError: PropTypes__default.default.string,
+  metaTouched: PropTypes__default.default.bool,
+  removeThumbText: PropTypes__default.default.string,
+  onAddFiles: PropTypes__default.default.func,
+  onDeleteFile: PropTypes__default.default.func
+};
+
+const FileInput = /*#__PURE__*/React__default.default.memo(function FileInput(props) {
+  const {
+    name,
+    shape,
+    size,
+    borderWidth,
+    borderColor,
+    borderColorHover,
+    borderType,
+    label,
+    thumbBorderWidth,
+    thumbBorderColor,
+    thumbBorderColorHover,
+    thumbBorderType,
+    removeThumbTextHoverColor,
+    labelTextColor,
+    fill,
+    fillHover,
+    className,
+    removeThumbText,
+    thumbNameTextSize,
+    thumbNameTextColor,
+    thumbNameTextWrap,
+    thumbNameTextWeight,
+    removeThumbTextSize,
+    removeThumbTextColor,
+    removeThumbTextWeight,
+    hintTitle,
+    errorMessageTextSize,
+    errorMessageTextWeight,
+    errorMessageTextColor,
+    fieldProps,
+    hintTitleTextSize,
+    hintTitleTextColor,
+    hintTitleTextWrap,
+    hintTitleTextWeight,
+    hintDescriptionTextSize,
+    hintDescriptionTextColor,
+    hintDescriptionTextWrap,
+    hintDescriptionTextWeight,
+    hideMessage,
+    thumbDirection,
+    hintDescription,
+    isShowFilename,
+    fileErrorText,
+    dropzoneProps,
+    maxFiles,
+    maxSize,
+    thumbColumn,
+    isRequired,
+    isPreviews,
+    onAddFiles,
+    onDeleteFile,
+    classNameGroupItem
+  } = props;
+  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
+    name: name
+  }, ({
+    input,
+    meta
+  }) => /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
+    className: clsx__default.default('form-field_type_dropzone', 'form__item_type_dropzone', classNameGroupItem),
+    fieldClassName: "form-dropzone",
+    inputName: input.name,
+    inputValue: input.value,
+    isRequired: isRequired,
+    label: label,
+    labelTextColor: labelTextColor,
+    metaActive: meta.active,
+    metaError: meta.error,
+    metaModifiedSinceLastSubmit: meta.modifiedSinceLastSubmit,
+    metaSubmitError: meta.submitError,
+    metaSubmitFailed: meta.submitFailed,
+    metaTouched: meta.touched,
+    metaValid: meta.valid,
+    hideMessage: hideMessage
+  }, fieldProps), /*#__PURE__*/React__default.default.createElement(FileInputDropzone, {
+    dropzoneProps: dropzoneProps,
+    hintDescription: hintDescription,
+    hintTitle: hintTitle,
+    borderWidth: borderWidth,
+    borderColor: borderColor,
+    borderColorHover: borderColorHover,
+    borderType: borderType,
+    thumbBorderWidth: thumbBorderWidth,
+    thumbBorderColor: thumbBorderColor,
+    thumbBorderColorHover: thumbBorderColorHover,
+    thumbBorderType: thumbBorderType,
+    fileErrorText: fileErrorText,
+    fill: fill,
+    size: size,
+    maxFiles: maxFiles,
+    maxSize: maxSize,
+    removeThumbTextHoverColor: removeThumbTextHoverColor,
+    fillHover: fillHover,
+    className: className,
+    thumbColumn: thumbColumn,
+    thumbDirection: thumbDirection,
+    inputName: input.name,
+    inputValue: input.value,
+    thumbNameTextSize: thumbNameTextSize,
+    thumbNameTextColor: thumbNameTextColor,
+    thumbNameTextWrap: thumbNameTextWrap,
+    thumbNameTextWeight: thumbNameTextWeight,
+    hintTitleTextSize: hintTitleTextSize,
+    hintTitleTextColor: hintTitleTextColor,
+    hintTitleTextWrap: hintTitleTextWrap,
+    hintTitleTextWeight: hintTitleTextWeight,
+    removeThumbTextSize: removeThumbTextSize,
+    removeThumbTextColor: removeThumbTextColor,
+    removeThumbTextWeight: removeThumbTextWeight,
+    hintDescriptionTextSize: hintDescriptionTextSize,
+    hintDescriptionTextColor: hintDescriptionTextColor,
+    hintDescriptionTextWrap: hintDescriptionTextWrap,
+    hintDescriptionTextWeight: hintDescriptionTextWeight,
+    errorMessageTextSize: errorMessageTextSize,
+    errorMessageWeight: errorMessageTextWeight,
+    errorMessageTextColor: errorMessageTextColor,
+    isPreviews: isPreviews,
+    shape: shape,
+    isShowFilename: isShowFilename,
+    metaError: meta.error,
+    metaTouched: meta.touched,
+    removeThumbText: removeThumbText,
+    onAddFiles: onAddFiles,
+    onDeleteFile: onDeleteFile
+  })));
+});
+FileInput.defaultProps = {
+  errorMessageTextSize: 's',
+  errorMessageTextColor: 'errorTextPrimary',
+  thumbColumn: 1,
+  thumbDirection: 'vertical'
+};
+FileInput.propTypes = {
+  name: PropTypes__default.default.string.isRequired,
+  className: PropTypes__default.default.string,
+  classNameGroupItem: PropTypes__default.default.string,
+  classNameInput: PropTypes__default.default.string,
+  classNameInputWrapper: PropTypes__default.default.string,
+  dropzoneProps: PropTypes__default.default.object,
+  hintDescription: PropTypes__default.default.string,
+  hintTitle: PropTypes__default.default.string,
+  inputClass: PropTypes__default.default.string,
+  isPreviews: PropTypes__default.default.bool,
+  isRequired: PropTypes__default.default.bool,
+  isShowFilename: PropTypes__default.default.bool,
+  label: PropTypes__default.default.any,
+  removeThumbText: PropTypes__default.default.string,
+  onAddFiles: PropTypes__default.default.func,
+  onDeleteFile: PropTypes__default.default.func
+};
+
+const Group = /*#__PURE__*/React__default.default.memo(function Group(props) {
+  const {
+    after,
+    before,
+    className,
+    label,
+    labelTextColor,
+    labelTextSize,
+    labelTextWeight,
+    message,
+    errorMessageTextSize,
+    errorMessageTextWeight,
+    errorMessageTextColor,
+    messageTextSize,
+    messageTextWeight,
+    messageTextColor,
+    children,
+    dataTour,
+    hideMessage,
+    name,
+    showErrorsOnSubmit
+  } = props;
+  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
+    name: name
+  }, ({
+    input,
+    meta
+  }) => {
+    const error = meta.error || !meta.modifiedSinceLastSubmit && meta.submitError || false;
+    const showError = React.useMemo(() => {
+      if (showErrorsOnSubmit) {
+        return meta.submitFailed && meta.touched && error;
+      } else {
+        return meta.touched && error;
+      }
+    }, [showErrorsOnSubmit, meta.submitFailed, meta.touched, error]);
+    return /*#__PURE__*/React__default.default.createElement("div", {
+      className: clsx__default.default('form__group', className),
+      "data-tour": dataTour
+    }, /*#__PURE__*/React__default.default.createElement("div", {
+      className: "form__group-wrapper"
+    }, before, /*#__PURE__*/React__default.default.createElement("div", {
+      className: "form__group-label"
+    }, /*#__PURE__*/React__default.default.createElement(Title.Title, {
+      textColor: labelTextColor,
+      size: labelTextSize,
+      textWeight: labelTextWeight
+    }, label)), /*#__PURE__*/React__default.default.createElement("div", {
+      className: "form__group-items"
+    }, children), after), !hideMessage && /*#__PURE__*/React__default.default.createElement(React__default.default.Fragment, null, Boolean(showError) && /*#__PURE__*/React__default.default.createElement(Text.Text, {
+      className: "form__group-message form__group-message_type-error",
+      size: errorMessageTextSize,
+      textWeight: errorMessageTextWeight,
+      textColor: errorMessageTextColor,
+      id: `${name}-error`
+    }, error), Boolean(message) && !showError && /*#__PURE__*/React__default.default.createElement(Text.Text, {
+      className: "form__group-message",
+      size: messageTextSize,
+      textWeight: messageTextWeight,
+      textColor: messageTextColor
+    }, message), Boolean(!showError) && Boolean(!message) && /*#__PURE__*/React__default.default.createElement(Text.Text, {
+      className: "form__group-message",
+      size: messageTextSize
+    }, '\u00A0')));
+  });
+});
+Group.defaultProps = {
+  inputProps: {},
+  fieldProps: {},
+  type: 'normal',
+  errorMessageTextSize: 's',
+  errorMessageTextColor: 'errorTextPrimary',
+  messageTextSize: 's',
+  messageTextColor: 'surfaceTextTertiary'
+};
+Group.propTypes = {
+  name: PropTypes__default.default.string.isRequired,
+  isRequired: PropTypes__default.default.bool,
+  fieldProps: PropTypes__default.default.object,
+  inputProps: PropTypes__default.default.object
+};
+
+const InputField = /*#__PURE__*/React__default.default.memo(function InputField(props) {
+  const {
+    isPassword,
+    isRequired,
+    fieldProps,
+    inputProps,
+    isRevealable,
+    name,
+    parse,
+    iconSize,
+    iconBorder,
+    iconBorderHover,
+    iconFill,
+    iconFillHover,
+    iconRevealableShow,
+    iconRevealableHide,
+    iconShape,
+    hideMessage,
+    onChange,
+    classNameGroupItem
+  } = props;
+  const [isRevealed, setIsRevealed] = React.useState(false);
+  const inputType = React.useMemo(() => {
+    if (isPassword) {
+      return isRevealed ? 'text' : 'password';
+    } else {
+      return 'text';
+    }
+  }, [isRevealed, isPassword]);
+  const revealeHandler = React.useCallback(e => {
+    e.preventDefault();
+    setIsRevealed(prev => !prev);
+  }, [setIsRevealed]);
+  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
+    name: name,
+    parse: parse
+  }, ({
+    input,
+    meta
+  }) => {
+    const onChangeField = React.useCallback(event => {
+      input.onChange(event);
+      if (onChange) {
+        onChange(event.target.value, input.name);
+      }
+    }, [onChange]);
+    return /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
+      className: clsx__default.default('form-field_type_input', 'form__item_type_input', classNameGroupItem),
+      fieldClassName: isRevealable ? 'form-password' : 'form-input',
+      inputName: input.name,
+      inputValue: input.value || '',
+      isRequired: isRequired,
+      metaActive: meta.active,
+      metaError: meta.error,
+      metaModifiedSinceLastSubmit: meta.modifiedSinceLastSubmit,
+      metaSubmitError: meta.submitError,
+      metaSubmitFailed: meta.submitFailed,
+      metaTouched: meta.touched,
+      metaValid: meta.valid,
+      hideMessage: hideMessage
+    }, fieldProps), /*#__PURE__*/React__default.default.createElement(Input.Input, Object.assign({
+      className: clsx__default.default(meta.active && 'input_state_focus', meta.error && meta.touched && 'input_state_error'),
+      autoComplete: "nope",
+      name: input.name,
+      type: inputType,
+      value: input.value || '',
+      onBlur: input.onBlur,
+      onChange: onChangeField,
+      onFocus: input.onFocus
+    }, inputProps)), isRevealable && /*#__PURE__*/React__default.default.createElement(Icon.Icon, {
+      className: "form-field__icon",
+      iconFill: iconFill,
+      iconFillHover: iconFillHover,
+      SvgImage: isRevealed ? iconRevealableHide : iconRevealableShow,
+      imageSrc: isRevealed ? iconRevealableHide : iconRevealableShow,
+      shape: iconShape,
+      size: iconSize,
+      onClick: revealeHandler
+    }));
+  });
+});
+InputField.defaultProps = {
+  inputProps: {},
+  fieldProps: {}
+};
+InputField.propTypes = {
+  fieldProps: PropTypes__default.default.object,
+  inputProps: PropTypes__default.default.object,
+  isPassword: PropTypes__default.default.bool,
+  isRequired: PropTypes__default.default.bool,
+  isRevealable: PropTypes__default.default.bool,
+  name: PropTypes__default.default.string.isRequired,
+  onChange: PropTypes__default.default.func
+};
+
+function RadioGroupItem(props) {
+  const {
+    input,
+    option,
+    onChange,
+    inputProps
+  } = props;
+  const onChangeField = React.useCallback(event => {
+    if (event.target.checked) {
+      onChange(option.value);
+    }
+  }, []);
+  return /*#__PURE__*/React__default.default.createElement(RadioButton.RadioButton, Object.assign({
+    className: "form-radio__item",
+    checked: option.value === input.value,
+    name: input.name,
+    type: "radio",
+    value: option.value,
+    onBlur: input.onBlur,
+    onChange: onChangeField,
+    onFocus: input.onFocus,
+    label: option.label
+  }, inputProps));
+}
+RadioGroupItem.propTypes = {
+  inputProps: PropTypes__default.default.object,
+  onChange: PropTypes__default.default.func,
+  option: PropTypes__default.default.shape({
+    label: PropTypes__default.default.string,
+    value: PropTypes__default.default.string
+  }),
+  input: PropTypes__default.default.shape({
+    name: PropTypes__default.default.string,
+    value: PropTypes__default.default.string,
+    onBlur: PropTypes__default.default.func,
+    onFocus: PropTypes__default.default.func,
+    onChange: PropTypes__default.default.func
+  })
+};
+
+function RadioGroupInput(props) {
+  const {
+    input,
+    value,
+    onChange
+  } = props;
+  const onChangeField = React.useCallback(event => onChange(event.target.value), [onChange]);
+  return /*#__PURE__*/React__default.default.createElement(Input.Input, Object.assign({
+    autoComplete: "nope",
+    name: input.name,
+    onBlur: input.onBlur,
+    onChange: onChangeField,
+    onFocus: input.onFocus,
+    value: value
+  }, props));
+}
+RadioGroupInput.propTypes = {
+  input: PropTypes__default.default.string,
+  value: PropTypes__default.default.string,
+  editableProps: PropTypes__default.default.object,
+  onChange: PropTypes__default.default.func
+};
+
+function RadioGroupList(props) {
+  const {
+    input,
+    options,
+    editableProps,
+    onChange,
+    inputProps
+  } = props;
+  const [editableValue, setEditableValue] = React.useState(() => {
+    const isRadioValue = options.find(option => option.value === input.value);
+    if (!isRadioValue) {
+      return input.value;
+    }
+    return '';
+  });
+  React.useEffect(() => {
+    // When a new value from outside enters the form
+    if (input.value) {
+      // Check value for radio type
+      const isRadioValue = options.find(option => option.value === input.value && !option.editable);
+      // If new value not in radio list - set to editable input
+      setEditableValue(isRadioValue ? '' : input.value);
+    } else {
+      // If new value is empty - clear editable input
+      setEditableValue('');
+    }
+  }, [input.value]);
+
+  // Callback for value changes
+  const onChangeSomeInput = React.useCallback(value => {
+    // Save to form values
+    input.onChange(value);
+    if (onChange) {
+      // Pass to custom event
+      onChange(value, input.name);
+    }
+  }, [input, onChange]);
+
+  // Handle for radio inputs
+  const onChangeRadio = React.useCallback(value => {
+    setEditableValue('');
+    onChangeSomeInput(value);
+  }, [onChangeSomeInput]);
+
+  // Handle for text input
+  const onChangeEditable = React.useCallback(value => {
+    setEditableValue(value);
+    onChangeSomeInput(value);
+  }, [onChangeSomeInput]);
+  return /*#__PURE__*/React__default.default.createElement(React__default.default.Fragment, null, options.map(option => option.editable ? /*#__PURE__*/React__default.default.createElement(RadioGroupInput, {
+    key: option.label,
+    input: input,
+    value: editableValue,
+    option: option,
+    onChange: onChangeEditable,
+    editableProps: editableProps,
+    inputProps: inputProps
+  }) : /*#__PURE__*/React__default.default.createElement(RadioGroupItem, {
+    key: option.value,
+    input: input,
+    option: option,
+    onChange: onChangeRadio,
+    inputProps: inputProps
+  })));
+}
+RadioGroupList.propTypes = {
+  editableProps: PropTypes__default.default.object,
+  input: PropTypes__default.default.object,
+  inputProps: PropTypes__default.default.object,
+  onChange: PropTypes__default.default.object,
+  options: PropTypes__default.default.object
+};
+
+const RadioGroup = /*#__PURE__*/React__default.default.memo(function RadioGroup(props) {
+  const {
+    isRequired,
+    name,
+    options,
+    fieldProps,
+    editableProps,
+    inputProps,
+    onChange,
+    hideMessage
+  } = props;
+  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
+    name: name
+  }, ({
+    input,
+    meta
+  }) => /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
+    className: "form__item_type_radio",
+    fieldClassName: 'form-radio',
+    inputName: input.name,
+    inputValue: input.value || '',
+    isRequired: isRequired,
+    metaActive: meta.active,
+    metaError: meta.error,
+    metaModifiedSinceLastSubmit: meta.modifiedSinceLastSubmit,
+    metaSubmitError: meta.submitError,
+    metaSubmitFailed: meta.submitFailed,
+    metaTouched: meta.touched,
+    metaValid: meta.valid,
+    hideMessage: hideMessage
+  }, fieldProps), /*#__PURE__*/React__default.default.createElement(RadioGroupList, {
+    input: input,
+    options: options,
+    onChange: onChange,
+    editableProps: editableProps,
+    inputProps: inputProps
+  })));
+});
+RadioGroup.defaultProps = {
+  fieldProps: {},
+  editableProps: {},
+  inputProps: {},
+  options: []
+};
+RadioGroup.propTypes = {
+  name: PropTypes__default.default.string.isRequired,
+  fieldProps: PropTypes__default.default.object,
+  inputProps: PropTypes__default.default.object,
+  editableProps: PropTypes__default.default.object,
+  isRequired: PropTypes__default.default.bool,
+  options: PropTypes__default.default.array,
+  onChange: PropTypes__default.default.func
+};
+
+// const SegmentedField = React.memo(
+function SegmentedField(props) {
+  const {
+    options,
+    isRequired,
+    name,
+    fieldProps,
+    inputProps,
+    hideMessage
+  } = props;
+  const {
+    change
+  } = reactFinalForm.useForm();
+  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
+    name: name
+  }, ({
+    input,
+    meta
+  }) => {
+    const activeOption = React.useMemo(() => {
+      const emptyOption = {
+        value: null,
+        label: null
+      };
+      if (input.value) {
+        const currentOption = options.find(option => option.value === input.value);
+        return currentOption || emptyOption;
+      }
+      return emptyOption;
+    }, [input.value]);
+    const setActiveSegment = React.useCallback(option => {
+      change(name, option.value);
+    }, [change]);
+    return /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
+      className: clsx__default.default('form-field_type_segmented', 'form__item_type_segmented'),
+      fieldClassName: "form-segmented",
+      inputName: input.name,
+      inputValue: input.value || [],
+      isRequired: isRequired,
+      metaActive: meta.active,
+      metaError: meta.error,
+      metaModifiedSinceLastSubmit: meta.modifiedSinceLastSubmit,
+      metaSubmitError: meta.submitError,
+      metaSubmitFailed: meta.submitFailed,
+      metaTouched: meta.touched,
+      metaValid: meta.valid,
+      hideMessage: hideMessage
+    }, fieldProps), /*#__PURE__*/React__default.default.createElement(Segmented.Segmented, Object.assign({
+      segments: options,
+      setActiveSegment: setActiveSegment,
+      activeSegment: activeOption
+    }, inputProps)));
+  });
+}
+// )
+
+SegmentedField.propTypes = {
+  options: PropTypes__default.default.array.isRequired,
+  name: PropTypes__default.default.string.isRequired,
+  className: PropTypes__default.default.string,
+  inputClass: PropTypes__default.default.string,
+  isRequired: PropTypes__default.default.bool,
+  label: PropTypes__default.default.string,
+  placeholder: PropTypes__default.default.string,
+  fieldProps: PropTypes__default.default.object,
+  inputProps: PropTypes__default.default.object
+};
+
+function getDefaultValue(options, selectValue) {
+  const selectValues = Array.isArray(selectValue) ? selectValue : [selectValue];
+  let result = [];
+  options.forEach(item => {
+    const isValue = selectValues.includes(item.value);
+    const isLabel = selectValues.includes(item.label);
+    let childOptions = [];
+    if (item.options) {
+      childOptions = getDefaultValue(item.options, selectValue);
+    }
+    if (isValue || isLabel) {
+      result.push(item);
+    } else if (childOptions.length) {
+      result = result.concat(childOptions);
+    }
+  });
+  return result;
+}
+const SelectField = /*#__PURE__*/React__default.default.memo(function SelectField(props) {
+  const {
+    isRequired,
+    key,
+    name,
+    options,
+    fieldProps,
+    selectProps,
+    selectRef,
+    onChange,
+    classNameGroupItem,
+    hideMessage
+  } = props;
+  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
+    name: name
+  }, ({
+    input,
+    meta
+  }) => {
+    const onChangeField = React.useCallback(value => {
+      input.onChange(value);
+      if (onChange) {
+        onChange(value, input.name);
+      }
+    }, [onChange]);
+    const [selectedOptions, setSelectedOptions] = React.useState(null);
+    const defaultValue = React.useMemo(() => {
+      const optionsValues = getDefaultValue(options, input.value);
+      if (!optionsValues.length && input.value?.length) {
+        optionsValues.push({
+          value: input.value,
+          label: input.value
+        });
+      }
+      return optionsValues;
+    }, [input.value]);
+    React.useEffect(() => setSelectedOptions(defaultValue), [defaultValue]);
+    const onChangeValue = React.useCallback((option, actionMeta) => {
+      const value = Array.isArray(option) ? option.map(o => o.value) : option?.value || null;
+      setSelectedOptions(option);
+      onChangeField(value);
+    }, [onChangeField]);
+    return /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
+      className: clsx__default.default('form-field_type_select', 'form__item_type_select', classNameGroupItem),
+      fieldClassName: 'form-select',
+      inputName: input.name,
+      inputValue: input.value,
+      isRequired: isRequired,
+      metaActive: meta.active,
+      metaError: meta.error,
+      metaModifiedSinceLastSubmit: meta.modifiedSinceLastSubmit,
+      metaSubmitError: meta.submitError,
+      metaSubmitFailed: meta.submitFailed,
+      metaTouched: meta.touched,
+      metaValid: meta.valid,
+      hideMessage: hideMessage
+    }, fieldProps), /*#__PURE__*/React__default.default.createElement(Select.Select, Object.assign({
+      className: "form-select-item",
+      instanceId: `id_${input.name}`,
+      value: selectedOptions,
+      onChange: onChangeValue,
+      options: options,
+      ref: selectRef,
+      key: key
+    }, selectProps)));
+  });
+});
+SelectField.propTypes = {
+  name: PropTypes__default.default.string.isRequired,
+  selectProps: PropTypes__default.default.object,
+  isRequired: PropTypes__default.default.bool,
+  label: PropTypes__default.default.any,
+  messageType: PropTypes__default.default.string,
+  options: PropTypes__default.default.array,
+  onChange: PropTypes__default.default.func
+};
+
+const SwitchField = /*#__PURE__*/React__default.default.memo(function SwitchField(props) {
+  const {
+    name,
+    isRequired,
+    onChange,
+    fieldProps,
+    inputProps,
+    classNameGroupItem,
+    hideMessage
+  } = props;
+  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
+    name: name,
+    type: "checkbox"
+  }, ({
+    input,
+    meta
+  }) => {
+    const onChangeField = React.useCallback(event => {
+      input.onChange(event);
+      if (onChange) {
+        onChange(event.target.checked, input.name);
+      }
+    }, [onChange]);
+    return /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
+      className: clsx__default.default('form-field_type_switch', 'form__item_type_switch', classNameGroupItem),
+      fieldClassName: "form-switch",
+      inputName: input.name,
+      inputValue: input.checked,
+      isRequired: isRequired,
+      metaActive: meta.active,
+      metaError: meta.error,
+      metaModifiedSinceLastSubmit: meta.modifiedSinceLastSubmit,
+      metaSubmitError: meta.submitError,
+      metaSubmitFailed: meta.submitFailed,
+      metaTouched: meta.touched,
+      metaValid: meta.valid,
+      hideMessage: hideMessage,
+      tag: "label"
+    }, fieldProps), /*#__PURE__*/React__default.default.createElement(Switch.Switch, Object.assign({
+      autoComplete: "nope",
+      checked: input.checked,
+      name: input.name,
+      type: "checkbox",
+      onBlur: input.onBlur,
+      onChange: onChangeField,
+      onFocus: input.onFocus
+    }, inputProps)));
+  });
+});
+SwitchField.defaultProps = {
+  inputProps: {},
+  fieldProps: {}
+};
+SwitchField.propTypes = {
+  fieldProps: PropTypes__default.default.object,
+  inputProps: PropTypes__default.default.object,
+  isRequired: PropTypes__default.default.bool,
+  name: PropTypes__default.default.string,
+  onChange: PropTypes__default.default.func
+};
+
+const TextareaField = /*#__PURE__*/React__default.default.memo(function TextareaField(props) {
+  const {
+    isRequired,
+    name,
+    fieldProps,
+    inputProps,
+    classNameGroupItem,
+    hideMessage
+  } = props;
+  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
+    name: name
+  }, ({
+    input,
+    meta
+  }) => /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
+    className: clsx__default.default('form-field_type_textarea', 'form__item_type_textarea', classNameGroupItem),
+    fieldClassName: 'form-textarea',
+    inputName: input.name,
+    inputValue: input.value,
+    isRequired: isRequired,
+    metaActive: meta.active,
+    metaError: meta.error,
+    metaModifiedSinceLastSubmit: meta.modifiedSinceLastSubmit,
+    metaSubmitError: meta.submitError,
+    metaSubmitFailed: meta.submitFailed,
+    metaTouched: meta.touched,
+    metaValid: meta.valid,
+    hideMessage: hideMessage
+  }, fieldProps), /*#__PURE__*/React__default.default.createElement(Textarea.Textarea, Object.assign({
+    autoComplete: "nope",
+    name: input.name,
+    value: input.value,
+    onBlur: input.onBlur,
+    onChange: input.onChange,
+    onFocus: input.onFocus
+  }, inputProps))));
+});
+TextareaField.defaultProps = {
+  inputProps: {},
+  fieldProps: {}
+};
+TextareaField.propTypes = {
+  name: PropTypes__default.default.string.isRequired,
+  isRequired: PropTypes__default.default.bool,
+  fieldProps: PropTypes__default.default.object,
+  inputProps: PropTypes__default.default.object
+};
+
+const focusOnError = (formElementsList, errors) => {
+  const selectsIds = Object.keys(errors).map(fieldName => {
+    if (fieldName === finalForm.FORM_ERROR) {
+      // TODO: get from somewhere
+      return 'notification__item_status_error';
+    }
+    return `react-select-id_${fieldName}-input`;
+  });
+  const errorFieldElement = formElementsList.find(element => {
+    if (element.name) {
+      return finalForm.getIn(errors, element.name);
+    } else {
+      return selectsIds.includes(element.id);
+    }
+  });
+  const errorsList = Object.keys(errors);
+  if (!errorFieldElement && errorsList.length) {
+    let errorElement;
+    try {
+      const fieldName = errorsList[0];
+      if (fieldName === finalForm.FORM_ERROR) {
+        errorElement = document.querySelector('notification__item_status_error');
+      } else {
+        errorElement = document.querySelector(`#${fieldName}-error`);
+        if (!errorElement) {
+          errorElement = document.querySelector(`#id_${fieldName}`);
+        }
+      }
+    } catch (err) {
+      console.warn(err);
+    }
+    if (errorElement) {
+      errorElement.scrollIntoView({
+        block: 'center'
+      }); // , behavior: 'smooth'
+    }
+  }
+
+  // the field is covered by the header because header is "sticky",
+  // that's we scroll manually so that the field falls into the center of the visible area
+  if (errorFieldElement) {
+    errorFieldElement.scrollIntoView({
+      block: 'center'
+    });
+  }
+  return null;
+};
+const focusOnErrorDecorator = createDecorator__default.default(null, focusOnError);
+const setErrorsMutator = (args, state) => {
+  const [fieldName, data] = args;
+  const submitError = data.submitError;
+  const fieldError = data.error;
+  if (fieldName === 'non_field_errors') {
+    // state.formState.invalid = true
+    // state.formState.valid = false
+    state.formState.error = fieldError;
+    state.formState.submitError = submitError;
+  } else if (fieldName in state.fields) {
+    if (fieldError) {
+      const errorsState = Object.assign({}, state.formState.errors, {
+        [fieldName]: fieldError
+      });
+      state.fields[fieldName].touched = true;
+      state.fields[fieldName].error = fieldError;
+      state.formState.errors = errorsState;
+    }
+    if (submitError) {
+      const submitErrorsState = Object.assign({}, state.formState.submitErrors, {
+        [fieldName]: submitError
+      });
+
+      // state.fields[fieldName].submitFailed = true
+      // state.fields[fieldName].submitSucceeded = false
+      state.fields[fieldName].submitError = submitError;
+      state.formState.submitErrors = submitErrorsState;
+      state.formState.submitFailed = true;
+      state.formState.submitSucceeded = false;
+      state.formState.lastSubmittedValues = state.formState.values;
+    }
+  }
+};
+const sendFormDataToServer = async (url, data) => {
+  try {
+    const response = await axios__default.default({
+      url: url,
+      method: 'POST',
+      data: data
+    });
+    return {
+      success: true,
+      response
+    };
+  } catch (error) {
+    const formErrors = {};
+    if (typeof error.response?.data === 'string') {
+      formErrors[finalForm.FORM_ERROR] = 'Something went wrong';
+    }
+    if (typeof error.response?.data === 'object') {
+      Object.entries(error.response.data).forEach(([fieldName, errorsList]) => {
+        formErrors[fieldName] = errorsList[0];
+      });
+    }
+    return {
+      success: false,
+      formErrors,
+      error
+    };
+  }
+};
+
+const formTypes = {
+  checkbox: 'checkbox',
+  custom: 'custom',
+  choice: 'choice',
+  code: 'code',
+  datePicker: 'datePicker',
+  dateRangePicker: 'dateRangePicker',
+  fileInput: 'fileInput',
+  group: 'group',
+  radioGroup: 'radioGroup',
+  segmented: 'segmented',
+  select: 'select',
+  switch: 'switch',
+  text: 'text',
+  textarea: 'textarea'
+};
+function generateField(field, config, props) {
+  switch (field.type) {
+    case formTypes.checkbox:
+      {
+        return /*#__PURE__*/React__default.default.createElement(CheckboxField, Object.assign({
+          key: config.key
+        }, field, props));
+      }
+    case formTypes.choice:
+      {
+        return /*#__PURE__*/React__default.default.createElement(ChoiceField, Object.assign({
+          key: config.key
+        }, field, props));
+      }
+    case formTypes.code:
+      {
+        return /*#__PURE__*/React__default.default.createElement(CodeField, Object.assign({
+          key: config.key
+        }, field, props));
+      }
+    case formTypes.switch:
+      {
+        return /*#__PURE__*/React__default.default.createElement(SwitchField, Object.assign({
+          key: config.key
+        }, field, props));
+      }
+    case formTypes.segmented:
+      {
+        return /*#__PURE__*/React__default.default.createElement(SegmentedField, Object.assign({
+          key: config.key
+        }, field, props));
+      }
+    case formTypes.datePicker:
+      {
+        return /*#__PURE__*/React__default.default.createElement(DatePickerField, Object.assign({
+          key: config.key
+        }, field, props));
+      }
+    case formTypes.fileInput:
+      {
+        return /*#__PURE__*/React__default.default.createElement(FileInput, Object.assign({
+          key: config.key
+        }, field, props));
+      }
+    case formTypes.radioGroup:
+      {
+        return /*#__PURE__*/React__default.default.createElement(RadioGroup, Object.assign({
+          key: config.key
+        }, field, props));
+      }
+    case formTypes.select:
+      {
+        return /*#__PURE__*/React__default.default.createElement(SelectField, Object.assign({
+          key: config.key
+        }, field, props));
+      }
+    case formTypes.text:
+      {
+        return /*#__PURE__*/React__default.default.createElement(InputField, Object.assign({
+          key: config.key
+        }, field, props));
+      }
+    case formTypes.textarea:
+      {
+        return /*#__PURE__*/React__default.default.createElement(TextareaField, Object.assign({
+          key: config.key
+        }, field, props));
+      }
+    case formTypes.custom:
+      {
+        return /*#__PURE__*/React__default.default.createElement(CustomField, Object.assign({
+          key: config.key
+        }, field, props));
+      }
+    case formTypes.group:
+      {
+        return /*#__PURE__*/React__default.default.createElement(Group, Object.assign({
+          key: config.key
+        }, field, props), Object.entries(field.group).map(([key, value]) => {
+          const groupProps = {
+            ...value,
+            hideMessage: field.hideMessage,
+            classNameGroupItem: value.classNameGroupItem || 'form__group-item'
+          };
+          return generateField(groupProps, {
+            key: key + '_form_group'
+          }, props);
+        }));
+      }
+  }
+}
+
+const FinalForm = /*#__PURE__*/React__default.default.forwardRef(function FinalForm(props, ref) {
+  const {
+    additionalProps,
+    after,
+    before,
+    buttonDirection,
+    buttonGap,
+    buttonPadding,
+    groupGap,
+    className,
+    config,
+    description,
+    descriptionSize,
+    descriptionTextColor,
+    descriptionTextWeight,
+    disableFieldsAutoComplete,
+    fieldsGap,
+    formName,
+    initialValues,
+    initialValuesEqual,
+    isLoading,
+    loader,
+    loaderSet,
+    loaderFill,
+    loaderItemFill,
+    loaderText,
+    language,
+    mutators,
+    onChangeFormValues,
+    onClickSecondaryButton,
+    onClickTertiaryButton,
+    onSubmit,
+    primaryButton,
+    primaryButtonLabel,
+    secondaryButton,
+    secondaryButtonLabel,
+    primaryButtonFill,
+    primaryButtonFillHover,
+    secondaryButtonFill,
+    secondaryButtonFillHover,
+    primaryButtonSize,
+    primaryButtonLabelTextColor,
+    primaryButtonLabelSize,
+    primaryButtonLabelTextWeight,
+    secondaryButtonSize,
+    secondaryButtonLabelTextColor,
+    secondaryButtonLabelSize,
+    secondaryButtonLabelTextWeight,
+    tertiaryButton,
+    tertiaryButtonFill,
+    tertiaryButtonFillHover,
+    tertiaryButtonSize,
+    tertiaryButtonLabelTextColor,
+    tertiaryButtonLabelSize,
+    tertiaryButtonLabelTextWeight,
+    tertiaryButtonLabel,
+    set,
+    type,
+    buttonJustifyContent,
+    title,
+    notificationType,
+    notificationClose,
+    buttonFill,
+    titleTextSize,
+    titleTextColor,
+    titleTextWeight,
+    validationSchema,
+    dataTour,
+    dataTourButtons,
+    dataTourPrimaryButton,
+    dataTourSecondaryButton,
+    dataTourTertiaryButton
+  } = props;
+  const validate = useYupValidationSchema(validationSchema, language);
+  const onRefFormInstance = React.useCallback(formInstance => {
+    if (ref) {
+      ref.current = formInstance;
+    }
+  }, [ref]);
+  const fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'fill_',
+    propsKey: 'fill'
+  });
+  const directionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'direction_',
+    propsKey: 'direction'
+  });
+  const shapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'shape_',
+    propsKey: 'shape'
+  });
+  const elevationClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'elevation_',
+    propsKey: 'elevation'
+  });
+  const {
+    styles: formStyles
+  } = useStyles.useStyles(props);
+  return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Form, {
+    decorators: [focusOnErrorDecorator],
+    initialValues: initialValues,
+    initialValuesEqual: initialValuesEqual,
+    mutators: mutators,
+    render: ({
+      handleSubmit,
+      submitError,
+      modifiedSinceLastSubmit,
+      form
+    }) => {
+      return /*#__PURE__*/React__default.default.createElement("form", {
+        style: formStyles,
+        className: clsx__default.default(className, 'form', set && `form_set_${set}`, type && `form_type_${type}`, directionClass, fillClass, shapeClass, elevationClass),
+        name: formName,
+        "data-tour": dataTour,
+        ref: () => onRefFormInstance(form),
+        onSubmit: handleSubmit,
+        autoComplete: disableFieldsAutoComplete ? 'off' : undefined,
+        autoCorrect: disableFieldsAutoComplete ? 'off' : undefined,
+        autoCapitalize: disableFieldsAutoComplete ? 'off' : undefined,
+        spellCheck: disableFieldsAutoComplete ? 'false' : undefined
+      }, before, title && /*#__PURE__*/React__default.default.createElement(Title.Title, {
+        className: "form__title",
+        size: titleTextSize,
+        textColor: titleTextColor,
+        textWeight: titleTextWeight
+      }, title), description && /*#__PURE__*/React__default.default.createElement(Text.Text, {
+        className: "form__description",
+        size: descriptionSize,
+        textColor: descriptionTextColor,
+        textWeight: descriptionTextWeight
+      }, description), submitError && !modifiedSinceLastSubmit && /*#__PURE__*/React__default.default.createElement("div", {
+        className: clsx__default.default('notification', 'form-notification', notificationType ? `form-notification_type_${notificationType}` : 'form-notification_type_global')
+      }, /*#__PURE__*/React__default.default.createElement(Notification.NotificationItem, {
+        className: "form-notification__item",
+        titleTextSize: "h6",
+        notificationClose: notificationClose,
+        title: form.getState().submitError,
+        set: "form",
+        status: "error"
+      })), onChangeFormValues && /*#__PURE__*/React__default.default.createElement(reactFinalForm.FormSpy, {
+        subscription: {
+          values: true
+        },
+        onChange: onChangeFormValues
+      }), Boolean(Object.keys(config).length) && /*#__PURE__*/React__default.default.createElement(Group$1.Group, {
+        direction: "vertical",
+        gap: fieldsGap || groupGap,
+        className: "form__wrapper"
+      }, Object.keys(config).map(key => generateField(config[key], {
+        key
+      }, additionalProps[config[key].name])), isLoading && (loader || /*#__PURE__*/React__default.default.createElement(Loader.Loader, {
+        className: "form__loader",
+        set: loaderSet,
+        fill: loaderFill,
+        itemFill: loaderItemFill,
+        text: loaderText
+      }))), (primaryButtonLabel || primaryButton || secondaryButtonLabel || secondaryButton || tertiaryButton || tertiaryButtonLabel) && /*#__PURE__*/React__default.default.createElement(Group$1.Group, {
+        fill: buttonFill,
+        justifyContent: buttonJustifyContent,
+        direction: buttonDirection,
+        padding: buttonPadding,
+        gap: buttonGap,
+        className: "form__button",
+        dataTour: dataTourButtons
+      }, primaryButtonLabel ? /*#__PURE__*/React__default.default.createElement(Button.Button, {
+        width: "fill",
+        className: "form__button-item",
+        fill: primaryButtonFill,
+        fillHover: primaryButtonFillHover,
+        size: primaryButtonSize,
+        labelTextColor: primaryButtonLabelTextColor,
+        labelSize: primaryButtonLabelSize,
+        labelTextWeight: primaryButtonLabelTextWeight,
+        label: primaryButtonLabel,
+        dataTour: dataTourPrimaryButton
+      }) : primaryButton, secondaryButtonLabel ? /*#__PURE__*/React__default.default.createElement(Button.Button, {
+        width: "fill",
+        className: "form__button-item",
+        fill: secondaryButtonFill,
+        fillHover: secondaryButtonFillHover,
+        size: secondaryButtonSize,
+        labelTextColor: secondaryButtonLabelTextColor,
+        labelSize: secondaryButtonLabelSize,
+        labelTextWeight: secondaryButtonLabelTextWeight,
+        label: secondaryButtonLabel,
+        onClick: onClickSecondaryButton,
+        dataTour: dataTourSecondaryButton
+      }) : secondaryButton, tertiaryButtonLabel ? /*#__PURE__*/React__default.default.createElement(Button.Button, {
+        width: "fill",
+        className: "form__button-item",
+        fill: tertiaryButtonFill,
+        fillHover: tertiaryButtonFillHover,
+        size: tertiaryButtonSize,
+        labelTextColor: tertiaryButtonLabelTextColor,
+        labelSize: tertiaryButtonLabelSize,
+        labelTextWeight: tertiaryButtonLabelTextWeight,
+        label: tertiaryButtonLabel,
+        onClick: onClickTertiaryButton,
+        dataTour: dataTourTertiaryButton
+      }) : tertiaryButton), after);
+    },
+    subscription: {
+      submitting: true,
+      pristine: true,
+      modifiedSinceLastSubmit: true,
+      submitError: true
+    },
+    validate: validate,
+    onSubmit: onSubmit
+  });
+});
+FinalForm.propTypes = {
+  additionalProps: PropTypes__default.default.object,
+  after: PropTypes__default.default.any,
+  before: PropTypes__default.default.any,
+  buttonGap: PropTypes__default.default.string,
+  className: PropTypes__default.default.string,
+  config: PropTypes__default.default.object,
+  description: PropTypes__default.default.string,
+  descriptionSize: PropTypes__default.default.string,
+  descriptionTextColor: PropTypes__default.default.string,
+  descriptionTextWeight: PropTypes__default.default.string,
+  disableFieldsAutoComplete: PropTypes__default.default.string,
+  fieldsGap: PropTypes__default.default.string,
+  formName: PropTypes__default.default.string,
+  initialValues: PropTypes__default.default.any,
+  initialValuesEqual: PropTypes__default.default.any,
+  language: PropTypes__default.default.string,
+  isLoading: PropTypes__default.default.bool,
+  loaderText: PropTypes__default.default.string,
+  mutators: PropTypes__default.default.any,
+  onChangeFormValues: PropTypes__default.default.func,
+  onClickSecondaryButton: PropTypes__default.default.func,
+  onSubmit: PropTypes__default.default.func,
+  primaryButton: PropTypes__default.default.string,
+  primaryButtonFill: PropTypes__default.default.string,
+  primaryButtonLabel: PropTypes__default.default.string,
+  secondaryButton: PropTypes__default.default.string,
+  secondaryButtonFill: PropTypes__default.default.string,
+  secondaryButtonLabel: PropTypes__default.default.string,
+  set: PropTypes__default.default.string,
+  title: PropTypes__default.default.string,
+  titleSize: PropTypes__default.default.string,
+  titleTextColor: PropTypes__default.default.string,
+  titleTextWeight: PropTypes__default.default.string,
+  validationSchema: PropTypes__default.default.object
+};
+FinalForm.defaultProps = {
+  additionalProps: {},
+  isLoading: false,
+  loaderSet: 'simple',
+  loaderFill: 'surfacePrimary',
+  loaderItemFill: 'surfaceItemAccent',
+  language: 'en',
+  titleSize: 'h1',
+  buttonDirection: 'vertical',
+  direction: 'vertical',
+  disableFieldsAutoComplete: false
+};
+
+Object.defineProperty(exports, 'Field', {
+  enumerable: true,
+  get: function () { return reactFinalForm.Field; }
+});
+Object.defineProperty(exports, 'useForm', {
+  enumerable: true,
+  get: function () { return reactFinalForm.useForm; }
+});
+Object.defineProperty(exports, 'useFormState', {
+  enumerable: true,
+  get: function () { return reactFinalForm.useFormState; }
+});
+exports.Checkbox = CheckboxField;
+exports.ChoiceField = ChoiceField;
+exports.CodeField = CodeField;
+exports.CustomField = CustomField;
+exports.DatePickerField = DatePickerField;
+exports.FieldWrapper = FieldWrapper;
+exports.FieldWrapperBase = FieldWrapperBase;
+exports.FileInput = FileInput;
+exports.FinalForm = FinalForm;
+exports.Group = Group;
+exports.InputField = InputField;
+exports.RadioGroup = RadioGroup;
+exports.SegmentedField = SegmentedField;
+exports.SelectField = SelectField;
+exports.Switch = SwitchField;
+exports.Textarea = TextareaField;
+exports.addRequiredFieldsParamToSchema = addRequiredFieldsParamToSchema;
+exports.emailValidation = emailValidation;
+exports.focusOnError = focusOnError;
+exports.focusOnErrorDecorator = focusOnErrorDecorator;
+exports.formTypes = formTypes;
+exports.generateField = generateField;
+exports.phoneValidation = phoneValidation;
+exports.sendFormDataToServer = sendFormDataToServer;
+exports.setErrorsMutator = setErrorsMutator;
+exports.useYupValidationSchema = useYupValidationSchema;