react-mui-formutil
Version:
Happy to use react-formutil in the project based on @mui/material ^_^
2 lines (1 loc) • 6.86 kB
JavaScript
import{EasyField as e}from"react-formutil";export*from"react-formutil";import r from"@babel/runtime/helpers/esm/defineProperty";import t from"@babel/runtime/helpers/esm/objectSpread2";import o from"@babel/runtime/helpers/esm/toPropertyKey";import n from"@babel/runtime/helpers/esm/objectWithoutProperties";import a from"@babel/runtime/helpers/esm/classCallCheck";import i from"@babel/runtime/helpers/esm/createClass";import l from"@babel/runtime/helpers/esm/inherits";import s from"@babel/runtime/helpers/esm/createSuper";import{FormGroup as u,Box as c,FormLabel as p,FormHelperText as d,Rating as m,Slider as f,Autocomplete as v,Select as h,Radio as b,Checkbox as y,Switch as g,FormControl as $,InputLabel as k,TextField as P,FormControlLabel as _,Input as C,OutlinedInput as E,FilledInput as V,ToggleButtonGroup as F}from"@mui/material";import T,{Children as x,cloneElement as A,Fragment as j,createElement as w,Component as B,createContext as O}from"react";import S from"react-fast-compare";var Y=["children","name","onChange","value","onFocus","onBlur"];var N=function(e){l(t,e);var r=s(t);function t(){a(this,t);return r.apply(this,arguments)}i(t,[{key:"render",value:function e(){var r=this.props,t=r.children,o=r.name,a=r.onChange,i=r.value,l=r.onFocus,s=r.onBlur,c=n(r,Y);var p=function e(r){var t=r.target,o=t.checked,n=t.value;var l=i||[];a===null||a===void 0?void 0:a(o?l.concat(n):l.filter((function(e){return e!==n})))};return T.createElement(u,c,x.map(t,(function(e){var r=e.props.value;return A(e,{checked:!!i&&i.indexOf(r)>-1,onChange:p,onFocus:l,onBlur:s,name:o})})))}}]);return t}(T.Component);N.formutilType="array";var U=["children","label","helperText","noStyle","errorLevel"];var H=O(null),I=H.Consumer,D=H.Provider;var L=1;var W=function e(r){L=r};function K(e){var r=e===null||e===void 0?void 0:e.type;if(r===_){r=K(e.props.control)}return r}var M=[P,C,E,V,v,h];var q=[h,E];var z=[m,v,F,f];var G=function(u){l(C,u);var _=s(C);function C(){var e;a(this,C);for(var r=arguments.length,t=new Array(r),o=0;o<r;o++){t[o]=arguments[o]}e=_.call.apply(_,[this].concat(t));e.$fieldutil=void 0;e.registerAncestorField=void 0;e.compositionValue=void 0;e.isComposing=void 0;e.fields={};e.registerField=function(r,t){return t?e.fields[r]=t:delete e.fields[r]};e.latestValidationProps=null;e.checkHasError=function(e,r,t,o){switch(e){case 0:return r&&t&&o;case 1:return r&&t;case 2:return r;default:return false}};e.fetchCurrentValidationProps=function(r){var t=Object.keys(e.fields).map((function(r){return e.fields[r].$new()}));var o=t.filter((function(e){return e.$invalid}));var n=o.length>0;var a=t.some((function(e){return e.$dirty}));var i=t.some((function(e){return e.$touched}));var l=t.some((function(e){return e.$focused}));var s=o.map((function(t){var o=t.$invalid,n=t.$touched,a=t.$dirty,i=t.$getFirstError;var l=e.checkHasError(r,o,a,n);return l&&i()})).filter(Boolean);return e.getValidationProps(r,n,a,i,l,s)};e.getValidationProps=function(r,t,o,n,a,i){var l=e.checkHasError(r,t,o,n);var s={};if(l){s.error=true}return{validationProps:s,error:l?Array.isArray(i)?i.map((function(e,r){return T.createElement(j,{key:r},r>0&&T.createElement("br",null),e)})):i:null}};return e}i(C,[{key:"componentDidMount",value:function e(){var r;(r=this.registerAncestorField)===null||r===void 0?void 0:r.call(this,this.props.name,this.$fieldutil)}},{key:"componentWillUnmount",value:function e(){var r;(r=this.registerAncestorField)===null||r===void 0?void 0:r.call(this,this.props.name,null)}},{key:"render",value:function a(){var i=this;var l=this.props;var s=l.children,u=l.label,_=l.helperText,C=l.noStyle,E=l.errorLevel,V=E===void 0?L:E,F=n(l,U);var x=K(s);if(!l.name){var j=this.latestValidationProps=this.fetchCurrentValidationProps(V),B=j.error,O=j.validationProps;Promise.resolve().then((function(){if(!S(i.latestValidationProps,i.fetchCurrentValidationProps(V))){i.forceUpdate()}}));var Y=typeof s==="function"?s():s;var H=B||_;return T.createElement(D,{value:this.registerField},T.createElement(c,F,u&&T.createElement(p,O,u),Y,H&&T.createElement(d,O,H)))}if(F.$memo===true){F.__DIFF__={children:s,compositionValue:this.compositionValue}}else if(Array.isArray(F.$memo)){F.$memo=F.$memo.concat(this.compositionValue)}switch(x){case g:case y:case b:F.__TYPE__="checked";break;case h:case v:if(s.props.multiple){F.__TYPE__="array"}else if(!("$defaultValue"in F)&&x===v){F.$defaultValue=null}break;case N:F.__TYPE__="array";break;case f:case m:if(!("$defaultValue"in F)){F.$defaultValue=null}break;case"checked":case"array":case"object":case"number":case"empty":F.__TYPE__=x;break}return T.createElement(e,Object.assign({},F,{passUtil:"$fieldutil",render:function e(a){var c,m,f;var h=l.valuePropName,b=h===void 0?"value":h,y=l.changePropName,g=y===void 0?"onChange":y,E=l.focusPropName,j=E===void 0?"onFocus":E,B=l.blurPropName,O=B===void 0?"onBlur":B;var S=a.$fieldutil,Y=a[g],N=a[j],U=a[O],H=a[b],D=n(a,["$fieldutil",g,j,O,b].map(o));var L=S.$invalid,W=S.$dirty,K=S.$touched,G=S.$focused,J=S.$getFirstError;var Q;switch(F.__TYPE__){case"checked":case"checkbox":case"radio":var R=l.checked,X=R===void 0?true:R,Z=l.unchecked,ee=Z===void 0?false:Z;Q={checked:H===X,onChange:function e(r){var t=r&&r.target?r.target.checked:r;Y(t?X:ee,r)}};break;default:var re=z.includes(x)?function(e,r){Y(r)}:Y;var te={onCompositionEnd:function e(r){i.isComposing=false;delete i.compositionValue;Y(r)},onCompositionStart:function e(){return i.isComposing=true}};Q=t(t({},z.includes(x)?{}:te),{},(m={},r(m,g,(function(e){if(i.isComposing){i.compositionValue=e.target[b];i.forceUpdate()}else{for(var r=arguments.length,t=new Array(r>1?r-1:0),o=1;o<r;o++){t[o-1]=arguments[o]}re.apply(void 0,[e].concat(t))}})),r(m,b,(c=i.compositionValue)!==null&&c!==void 0?c:H),r(m,O,(function(){if(i.isComposing){i.isComposing=false;delete i.compositionValue;Y.apply(void 0,arguments)}return U.apply(void 0,arguments)})),m));break}var oe=i.getValidationProps(V,L,W,K,G,J()),ne=oe.validationProps,ae=oe.error;Q=Object.assign((f={},r(f,j,N),r(f,O,U),f),Q);if(q.includes(x)&&u){Q.label=u}var ie=typeof s==="function"?s(Q):A(s,Q);return T.createElement(I,null,(function(e){var r;if(C){i.$fieldutil=S;i.registerAncestorField=e}switch(x){case P:return A(ie,t(t(t({},D),ne),{},{helperText:C?s.props.helperText:(r=ae||_)!==null&&r!==void 0?r:s.props.helperText,label:u!==null&&u!==void 0?u:s.props.label}));case v:var o=s.props.renderInput;return A(ie,{renderInput:function e(r){var n;var a=o(r);return A(a,t(t(t({},D),ne),{},{helperText:C?s.props.helperText:(n=ae||_)!==null&&n!==void 0?n:s.props.helperText,label:u!==null&&u!==void 0?u:a.props.label}))}});default:var n=ae||_;return T.createElement($,Object.assign({},D,ne),u&&w(M.includes(x)?k:p,{children:u}),ie,n&&!C&&T.createElement(d,null,n))}}))}}))}}]);return C}(B);export{N as CheckboxGroup,G as FormControl,W as setErrorLevel};