@mobx-ecosystem/mobx-form
Version:
provides the ability to use forms with validation in MobX stores
2 lines (1 loc) • 17.9 kB
JavaScript
import{makeAutoObservable as e}from"mobx";const i=e=>null!==e&&"object"==typeof e;function t(e,i){if(e===i)return!0;if(null===e||null===i||"object"!=typeof e||"object"!=typeof i)return!1;if(e instanceof Date&&i instanceof Date)return e.getTime()===i.getTime();if(e instanceof RegExp&&i instanceof RegExp)return e.toString()===i.toString();if(e instanceof Map&&i instanceof Map){if(e.size!==i.size)return!1;for(const[l,r]of e)if(!i.has(l)||!t(r,i.get(l)))return!1;return!0}if(e instanceof Set&&i instanceof Set){if(e.size!==i.size)return!1;for(const t of e)if(!i.has(t))return!1;return!0}if(Array.isArray(e)&&Array.isArray(i)){if(e.length!==i.length)return!1;for(let l=0;l<e.length;l++)if(!t(e[l],i[l]))return!1;return!0}const l=Object.keys(e),r=Object.keys(i);if(l.length!==r.length)return!1;for(const r of l)if(!Object.hasOwnProperty.call(i,r)||!t(e[r],i[r]))return!1;return!0}function l(e,i,t,l){return new(t||(t=Promise))((function(r,a){function s(e){try{u(l.next(e))}catch(e){a(e)}}function n(e){try{u(l.throw(e))}catch(e){a(e)}}function u(e){var i;e.done?r(e.value):(i=e.value,i instanceof t?i:new t((function(e){e(i)}))).then(s,n)}u((l=l.apply(e,i||[])).next())}))}let r,a;const s=e=>{r=e.validation.validate,a=e.validation.preSubmitValidationError},n=()=>{if(!r||!a)throw new Error("You must define configureForm to configure mobx-form")};class u{constructor(i){Object.defineProperty(this,"_touched",{enumerable:!0,configurable:!0,writable:!0,value:!1}),Object.defineProperty(this,"_disabled",{enumerable:!0,configurable:!0,writable:!0,value:!1}),Object.defineProperty(this,"_error",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"_initValue",{enumerable:!0,configurable:!0,writable:!0,value:[]}),Object.defineProperty(this,"_value",{enumerable:!0,configurable:!0,writable:!0,value:[]}),Object.defineProperty(this,"_validate",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"setTouched",{enumerable:!0,configurable:!0,writable:!0,value:e=>{this._touched=e}}),Object.defineProperty(this,"add",{enumerable:!0,configurable:!0,writable:!0,value:e=>{var i;this.value.push(e),this.setTouched(!0),null===(i=this.validate)||void 0===i||i.call(this,"only-touched")}}),Object.defineProperty(this,"removeByIndex",{enumerable:!0,configurable:!0,writable:!0,value:e=>{var i;this.value.splice(e,1),this.setTouched(!0),null===(i=this.validate)||void 0===i||i.call(this,"only-touched")}}),Object.defineProperty(this,"reset",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this._value=this.initValue.slice(0),this._value.forEach((e=>e.formService.reset())),this.setTouched(!1)}}),Object.defineProperty(this,"clear",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this._value=this.initValue.slice(0),this._value.forEach((e=>e.formService.clear())),this.setTouched(!1)}}),Object.defineProperty(this,"setAsInit",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.initValue=this.value,this._value.forEach((e=>e.formService.setAsInit())),this.setTouched(!1)}}),Object.defineProperty(this,"getValues",{enumerable:!0,configurable:!0,writable:!0,value:()=>this.value.map((e=>e.formService.getValues()))}),Object.defineProperty(this,"touch",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.value.forEach((e=>e.formService.touch())),this.setTouched(!0)}}),Object.defineProperty(this,"validateFields",{enumerable:!0,configurable:!0,writable:!0,value:(e="everything")=>Promise.all(this.value.map((i=>i.formService.validate(e))))}),Object.defineProperty(this,"validate",{enumerable:!0,configurable:!0,writable:!0,value:(e="everything")=>l(this,void 0,void 0,(function*(){var i;return Promise.all([null===(i=this._validate)||void 0===i?void 0:i.call(this),this.validateFields(e)])}))}),Object.defineProperty(this,"disable",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.disabled=!0}}),Object.defineProperty(this,"enable",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.disabled=!1}}),Object.defineProperty(this,"setDisabledFn",{enumerable:!0,configurable:!0,writable:!0,value:e=>{this.value.forEach((i=>i.formService.setDisabledFn(e)))}}),e(this),this.initValue=i||[]}get initValue(){return this._initValue}set initValue(e){var i;this._initValue=e,this._value=e.slice(0),this.setTouched(!1),null===(i=this.validate)||void 0===i||i.call(this,"only-touched")}get value(){return this._value}set value(e){this._value=e,this.setTouched(!0)}get disabled(){return this._disabled}set disabled(e){this._disabled=e,e?this.value.forEach((e=>e.formService.disable())):this.value.forEach((e=>e.formService.enable()))}get error(){return this._error}set error(e){this._error=e}get isValid(){return!this._error&&this.value.every((e=>e.formService.isValid))}get isTouched(){return this._touched||this.value.some((e=>e.formService.isTouched))}get isInit(){return!this.isTouched}get hasItems(){return Boolean(this.value.length)}}class o{constructor(i,t){Object.defineProperty(this,"field",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"inputField",{enumerable:!0,configurable:!0,writable:!0,value:new c("")}),Object.defineProperty(this,"options",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"setValue",{enumerable:!0,configurable:!0,writable:!0,value:(e,{inputValue:i="",withNotification:t=!0,withBlur:l=!0})=>{var r,a,s,n;if(t?(this.field.value=e,this.inputField.value=i):(this.field.value=e,this.inputField.value=i,null===(a=(r=this.field).validate)||void 0===a||a.call(r),null===(n=(s=this.inputField).validate)||void 0===n||n.call(s)),l)return this.field.isBlurred=!0}}),Object.defineProperty(this,"reset",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.field.reset()}}),Object.defineProperty(this,"clear",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.field.clear()}}),Object.defineProperty(this,"setAsInit",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.field.setAsInit()}}),Object.defineProperty(this,"onInputChange",{enumerable:!0,configurable:!0,writable:!0,value:(e,i)=>{var t,l,r,a;if("abort"===(null===(l=null===(t=this.options)||void 0===t?void 0:t.onInputBeforeChange)||void 0===l?void 0:l.call(t,i)))return;const s=this.inputField.value;this.inputField.value=i,s!==i&&(null===(a=null===(r=this.options)||void 0===r?void 0:r.onInputChange)||void 0===a||a.call(r,i))}}),Object.defineProperty(this,"touch",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.field.touch()}}),Object.defineProperty(this,"disable",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.field.disabled=!0}}),Object.defineProperty(this,"setDisabledFn",{enumerable:!0,configurable:!0,writable:!0,value:e=>{this.field.setDisabledFn(e)}}),Object.defineProperty(this,"enable",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.field.disabled=!1}}),e(this),this.options=t,this.field=new c(i,{onChange:null==t?void 0:t.onChange,beforeOnChange:null==t?void 0:t.beforeOnChange})}get validate(){return this.field.validate}set validate(e){this.field.validate=e}get value(){return this.field.value}set value(e){this.field.value=e}get error(){return this.field.error}set error(e){this.field.error=e}get disabled(){return this.field.disabled}set disabled(e){this.field.disabled=e}get isValid(){return this.field.isValid}get isInit(){return this.field.isInit}set initValue(e){this.field.initValue=e}get isTouched(){return this.field.isTouched}get initValue(){return this.field.initValue}get props(){return Object.assign(Object.assign({},this.field.props),{onSearchChange:this.onInputChange})}}class d{constructor(i,t){Object.defineProperty(this,"fields",{enumerable:!0,configurable:!0,writable:!0,value:{}}),Object.defineProperty(this,"validationSchema",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"onSubmit",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"setOnSubmit",{enumerable:!0,configurable:!0,writable:!0,value:e=>{this.onSubmit=e}}),Object.defineProperty(this,"submit",{enumerable:!0,configurable:!0,writable:!0,value:()=>l(this,void 0,void 0,(function*(){var e;if(yield this.validate("everything"),this.canBeSubmitted)return null===(e=this.onSubmit)||void 0===e?void 0:e.call(this);null==a||a()}))}),Object.defineProperty(this,"validate",{enumerable:!0,configurable:!0,writable:!0,value:(e="only-touched")=>l(this,void 0,void 0,(function*(){const i=this.getValues();if(yield this.bypassFields(this.fields,(i=>l(this,void 0,void 0,(function*(){var t;return h(i)?yield i.validate(e):i instanceof u?yield null===(t=i.validateFields)||void 0===t?void 0:t.call(i,e):null})))),i){const t=yield null==r?void 0:r(i,this.validationSchema);t&&0!=Object.keys(t||[]).length?this.setValidationError(t,e):this.resetValidationErrors()}}))}),Object.defineProperty(this,"setValidationSchema",{enumerable:!0,configurable:!0,writable:!0,value:e=>{this.validationSchema=e,this.setValidationToFields()}}),Object.defineProperty(this,"getValues",{enumerable:!0,configurable:!0,writable:!0,value:()=>{const e={};for(const i of this.keys){const t=this.fields[i];b(t)?e[i]=t.formService.getValues():e[i]=this.getValue(t)}return e}}),Object.defineProperty(this,"getValue",{enumerable:!0,configurable:!0,writable:!0,value:e=>{if(e instanceof c||e instanceof u||e instanceof o)return null==e?void 0:e.value;if("object"==typeof e){const i={};for(const t of Object.keys(e))i[t]=this.getValue(null==e?void 0:e[t]);return i}return e}}),Object.defineProperty(this,"setFieldsByThis",{enumerable:!0,configurable:!0,writable:!0,value:e=>{const i={};Object.keys(e).forEach((t=>{(e[t]&&e[t]instanceof c||e[t]instanceof u||e[t]instanceof o)&&(i[t]=e[t])})),this.fields=i,this.setValidationToFields()}}),Object.defineProperty(this,"bypassFields",{enumerable:!0,configurable:!0,writable:!0,value:(e,i,t)=>e instanceof c||e instanceof u||e instanceof o?i(e,t):b(e)?i(e.formService,t):"object"==typeof e?Promise.all(Object.keys(e||{}).map((l=>this.bypassFields(null==e?void 0:e[l],i,null==t?void 0:t[l])))):void 0}),Object.defineProperty(this,"setValidationToFields",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.bypassFields(this.fields,(e=>{h(e)||(e instanceof c||e instanceof o?e.validate=this.validate:e._validate=this.validate)}))}}),Object.defineProperty(this,"getFieldsByKeys",{enumerable:!0,configurable:!0,writable:!0,value:({keyType:e="include",keys:i=[]})=>{let t=[];t="include"===e?i:Object.keys(this.fields).filter((e=>!i.includes(e)));let l={};return t.forEach((e=>{var i;return l[e]=null===(i=this.fields)||void 0===i?void 0:i[e]})),l}}),Object.defineProperty(this,"setInitValues",{enumerable:!0,configurable:!0,writable:!0,value:(e,{validate:i}={})=>{const t=this.getFieldsByKeys({keyType:"include",keys:Object.keys(e)});this.bypassFields(t,((e,t)=>{h(e)?e.setInitValues(t,{validate:i}):e.initValue=t}),e),i&&this.validate()}}),Object.defineProperty(this,"setValues",{enumerable:!0,configurable:!0,writable:!0,value:(e,{validate:i}={})=>{const t=this.getFieldsByKeys({keyType:"include",keys:Object.keys(e)});this.bypassFields(t,((e,i)=>{h(e)?e.setValues(i):e.value=i}),e),i&&this.validate("everything")}}),Object.defineProperty(this,"resetValidationErrors",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.bypassFields(this.fields,(e=>{h(e)||(e.error=void 0)}))}}),Object.defineProperty(this,"resetErrors",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.bypassFields(this.fields,(e=>{h(e)?e.resetErrors():e.error=void 0}))}}),Object.defineProperty(this,"setValidationError",{enumerable:!0,configurable:!0,writable:!0,value:(e,i="only-touched")=>{this.bypassFields(this.fields,((e,t)=>{(e.isTouched||"everything"===i)&&(h(e)||(e.error=t))}),e)}}),Object.defineProperty(this,"setAsInit",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.bypassFields(this.fields,(e=>{e.setAsInit()}))}}),Object.defineProperty(this,"reset",{enumerable:!0,configurable:!0,writable:!0,value:(e,{validate:i}={validate:!0})=>{const t=(null==e?void 0:e.keys)?this.getFieldsByKeys(e):this.fields;this.bypassFields(t,(e=>{e.reset()})),i&&this.validate()}}),Object.defineProperty(this,"clear",{enumerable:!0,configurable:!0,writable:!0,value:e=>{const i=(null==e?void 0:e.keys)?this.getFieldsByKeys(e):this.fields;this.bypassFields(i,(e=>{e.clear()})),this.validate()}}),Object.defineProperty(this,"disable",{enumerable:!0,configurable:!0,writable:!0,value:e=>{const i=(null==e?void 0:e.keys)?this.getFieldsByKeys(e):this.fields;this.bypassFields(i,(e=>e.disable()))}}),Object.defineProperty(this,"enable",{enumerable:!0,configurable:!0,writable:!0,value:e=>{const i=(null==e?void 0:e.keys)?this.getFieldsByKeys(e):this.fields;this.bypassFields(i,(e=>e.enable()))}}),Object.defineProperty(this,"touch",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.bypassFields(this.fields,(e=>e.touch()))}}),Object.defineProperty(this,"setDisabledFn",{enumerable:!0,configurable:!0,writable:!0,value:e=>{this.bypassFields(this.fields,(i=>{h(i),i.setDisabledFn(e)}))}}),n(),e(this),this.fields=i,this.validationSchema=t,this.setValidationToFields()}get keys(){return Object.keys(this.fields)}get isValid(){let e=!0;return this.bypassFields(this.fields,(i=>{i.isValid||(e=!1)})),e}get isTouched(){let e=!1;return this.bypassFields(this.fields,(i=>{i.isTouched&&(e=!0)})),e}get canBeSubmitted(){return this.isTouched&&this.isValid}get disabled(){let e=!0;return this.bypassFields(this.fields,(i=>{i.disabled||(e=!1)})),e}setErrors(e,i="only-touched"){this.bypassFields(this.fields,((e,t)=>{(e.isTouched||"everything"===i)&&(h(e)?t&&e.setErrors(t,i):e.error=t)}),e)}}const b=e=>e&&"object"==typeof e&&"formService"in e,h=e=>e&&e instanceof d;class c{constructor(t,l){var r;Object.defineProperty(this,"_emptyValueType",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"validate",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"_serviceType",{enumerable:!0,configurable:!0,writable:!0,value:"field-service"}),Object.defineProperty(this,"_initValue",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"_value",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"_error",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"_disabled",{enumerable:!0,configurable:!0,writable:!0,value:!1}),Object.defineProperty(this,"_isBlurred",{enumerable:!0,configurable:!0,writable:!0,value:!1}),Object.defineProperty(this,"options",{enumerable:!0,configurable:!0,writable:!0,value:{}}),Object.defineProperty(this,"setDisabledFn",{enumerable:!0,configurable:!0,writable:!0,value:e=>{this.options.disabledFn=e}}),Object.defineProperty(this,"setOptions",{enumerable:!0,configurable:!0,writable:!0,value:e=>{this.options=e}}),Object.defineProperty(this,"setValue",{enumerable:!0,configurable:!0,writable:!0,value:(e,{validate:i}={})=>{var t;this.value=e,i&&(null===(t=this.validate)||void 0===t||t.call(this))}}),Object.defineProperty(this,"onChange",{enumerable:!0,configurable:!0,writable:!0,value:(e,i)=>{var t;this.value=i,null===(t=this.validate)||void 0===t||t.call(this)}}),Object.defineProperty(this,"onBlur",{enumerable:!0,configurable:!0,writable:!0,value:e=>{var i;this.isBlurred=!0,null===(i=this.validate)||void 0===i||i.call(this)}}),Object.defineProperty(this,"reset",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.value=this.initValue,this.isBlurred=!1}}),Object.defineProperty(this,"clear",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.value=this._emptyValueType,this.isBlurred=!0}}),Object.defineProperty(this,"setAsInit",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.initValue=this.value,this.isBlurred=!1}}),Object.defineProperty(this,"touch",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.isBlurred=!0}}),Object.defineProperty(this,"disable",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.disabled=!0}}),Object.defineProperty(this,"enable",{enumerable:!0,configurable:!0,writable:!0,value:()=>{this.disabled=!1}}),e(this),this._emptyValueType="string"==typeof(r=t)?"":(e=>"number"==typeof e)(r)?0:Array.isArray(r)?[]:null===r||i(r)||(e=>"boolean"==typeof e)(r)?null:void 0,this.initValue=t,this.options=l||{}}get initValue(){return this._initValue}set initValue(e){var i;e||e===this._emptyValueType?this._initValue=e:this._initValue=this._emptyValueType,this._value=this._initValue,null===(i=this.validate)||void 0===i||i.call(this)}get value(){return this._value}set value(e){var i,t,l,r;if("abort"===(null===(t=null===(i=this.options)||void 0===i?void 0:i.beforeOnChange)||void 0===t?void 0:t.call(i,e)))return;const a=this._value;this._value=e,a!==e&&(null===(r=null===(l=this.options)||void 0===l?void 0:l.onChange)||void 0===r||r.call(l,e))}get error(){return this._error}set error(e){this._error=e}get disabled(){var e,i;return this._disabled||Boolean(null===(i=null===(e=this.options)||void 0===e?void 0:e.disabledFn)||void 0===i?void 0:i.call(e))}set disabled(e){this._disabled=e}get isValid(){return!this._error}get isInit(){return i(this.value)?t(this.value,this._initValue):this._value===this._initValue}get isBlurred(){return this._isBlurred}set isBlurred(e){this._isBlurred=e}get isTouched(){return!this.isInit||this.isBlurred}get props(){var e;let i={value:this.value,error:this.error,disabled:this.disabled};return(null===(e=this.options)||void 0===e?void 0:e.onError)&&(i=Object.assign(Object.assign({},i),{onError:e=>{this.error=this.error||(null==e?void 0:e.toString())}})),Object.assign(Object.assign({},i),{onChange:this.onChange,onBlur:this.onBlur})}}export{o as AutocompleteFieldService,u as CombinedFormFieldService,c as FieldService,d as FormService,n as _checkConfiguration,s as configureForm,a as preSubmitValidationError,r as validate};