UNPKG

mui-rff

Version:

Set of modern wrapper components to facilitate using Material UI with React Final Form

3 lines (2 loc) 14.2 kB
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var r=e(require("@material-ui/core/TextField")),t=e(require("@material-ui/lab/Autocomplete")),n=e(require("react")),a=require("react-final-form"),o=require("@material-ui/core"),l=require("@material-ui/pickers");function i(){return(i=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])}return e}).apply(this,arguments)}function u(e,r){if(null==e)return{};var t,n,a={},o=Object.keys(e);for(n=0;n<o.length;n++)r.indexOf(t=o[n])>=0||(a[t]=e[t]);return a}function s(e){var r=e.meta,t=e.formHelperTextProps,a=e.helperText;return e.showError?n.createElement(o.FormHelperText,Object.assign({},t),r.error||r.submitError):a?n.createElement(o.FormHelperText,Object.assign({},t),a):n.createElement(n.Fragment,null)}var m={subscription:{error:!0,submitError:!0,dirtySinceLastSubmit:!0,touched:!0,modified:!0}};function c(e){return a.useField(e,m)}function p(e){var r=e.meta;return!(!(r.submitError&&!r.dirtySinceLastSubmit||r.error)||!r.touched&&!r.modified)}function d(e){var a,o=e.input,l=o.name,i=o.onChange,s=o.value,m=e.meta,c=e.options,d=e.label,f=e.required,h=e.multiple,b=e.textFieldProps,v=e.getOptionValue,E=e.showError,g=void 0===E?p:E,P=e.placeholder,x=e.onChange,O=u(e,["input","meta","options","label","required","multiple","textFieldProps","getOptionValue","showError","placeholder","onChange"]),T=O.helperText,y=u(O,["helperText"]),C=b||{},j=C.variant,F=u(C,["variant"]);v?null!==s||s&&c.forEach((function(e){var r=v(e);h?(a||(a=[]),s.forEach((function(t){t===r&&a.push(e)}))):s===r&&(a=e)})):a=s;var k=m.error,w=m.submitError,q=g({meta:m});return n.createElement(t,Object.assign({multiple:h,onChange:function(e,r,t,n){var a,o=(a=r,v?h?a?a.map(v):null:a?v(a):null:a);i(o),x&&x(e,r,t,n)},options:c,value:a,renderInput:function(e){return n.createElement(r,Object.assign({label:d,required:f,helperText:q?k||w:T,error:q,name:l,placeholder:P,variant:j},e,F,{fullWidth:!0}))}},y))}function f(e,r){return e?n.createElement(l.MuiPickersUtilsProvider,{utils:e},r):r}function h(e){var r=e.input,t=r.name,a=r.onChange,o=r.value,i=u(r,["name","onChange","value"]),s=e.meta,m=e.dateFunsUtils,c=e.showError,d=void 0===c?p:c,h=u(e,["input","meta","dateFunsUtils","showError"]),b=s.error,v=s.submitError,E=d({meta:s}),g=h.helperText,P=u(h,["helperText"]);return f(m,n.createElement(l.KeyboardDatePicker,Object.assign({disableToolbar:!0,fullWidth:!0,autoOk:!0,helperText:E?b||v:g,error:E,onChange:a,name:t,value:""===o?null:o,inputProps:i},P)))}function b(e){var r=e.input,t=r.name,a=r.onChange,o=r.value,i=u(r,["name","onChange","value"]),s=e.meta,m=e.dateFunsUtils,c=e.showError,d=void 0===c?p:c,h=u(e,["input","meta","dateFunsUtils","showError"]),b=s.error,v=s.submitError,E=d({meta:s}),g=h.helperText,P=u(h,["helperText"]);return f(m,n.createElement(l.KeyboardDateTimePicker,Object.assign({fullWidth:!0,autoOk:!0,helperText:E?b||v:g,error:E,onChange:a,name:t,value:""===o?null:o,inputProps:i},P)))}function v(e){var r=e.input,t=r.name,a=r.onChange,o=r.value,i=u(r,["name","onChange","value"]),s=e.meta,m=e.dateFunsUtils,c=e.showError,d=void 0===c?p:c,h=u(e,["input","meta","dateFunsUtils","showError"]),b=s.error,v=s.submitError,E=d({meta:s}),g=h.helperText,P=u(h,["helperText"]);return f(m,n.createElement(l.DatePicker,Object.assign({fullWidth:!0,autoOk:!0,helperText:E?b||v:g,error:E,onChange:a,name:t,value:""===o?null:o},P,{inputProps:i})))}function E(e){var r=e.input,t=r.name,a=r.onChange,o=r.value,i=u(r,["name","onChange","value"]),s=e.meta,m=e.dateFunsUtils,c=e.showError,d=void 0===c?p:c,h=u(e,["input","meta","dateFunsUtils","showError"]),b=s.error,v=s.submitError,E=d({meta:s}),g=h.helperText,P=u(h,["helperText"]);return f(m,n.createElement(l.DateTimePicker,Object.assign({fullWidth:!0,autoOk:!0,helperText:E?b||v:g,error:E,onChange:a,name:t,value:""===o?null:o},P,{inputProps:i})))}function g(e){var r=e.input,t=r.name,a=r.onChange,o=r.value,i=u(r,["name","onChange","value"]),s=e.meta,m=e.dateFunsUtils,c=e.showError,d=void 0===c?p:c,h=u(e,["input","meta","dateFunsUtils","showError"]),b=s.error,v=s.submitError,E=d({meta:s}),g=h.helperText,P=u(h,["helperText"]);return f(m,n.createElement(l.KeyboardTimePicker,Object.assign({fullWidth:!0,autoOk:!0,helperText:E?b||v:g,error:E,onChange:a,name:t,value:""===o?null:o},P,{inputProps:i})))}function P(e){var r=e.input,t=r.name,a=r.onChange,o=r.value,i=u(r,["name","onChange","value"]),s=e.meta,m=e.dateFunsUtils,c=e.showError,d=void 0===c?p:c,h=u(e,["input","meta","dateFunsUtils","showError"]),b=s.error,v=s.submitError,E=d({meta:s}),g=h.helperText,P=u(h,["helperText"]);return f(m,n.createElement(l.TimePicker,Object.assign({fullWidth:!0,autoOk:!0,helperText:E?b||v:g,error:E,onChange:a,name:t,value:""===o?null:o},P,{inputProps:i})))}function x(e){var r=e.input,t=r.name,a=r.value,l=r.type,s=r.onChange,m=u(r,["name","value","type","onChange"]),c=e.meta,d=e.required,f=e.fullWidth,h=void 0===f||f,b=e.helperText,v=e.showError,E=void 0===v?p:v,g=u(e,["input","meta","required","fullWidth","helperText","showError"]),P=c.error,x=c.submitError,O=E({meta:c});return n.createElement(o.TextField,Object.assign({fullWidth:h,helperText:O?P||x:b,error:O,onChange:s,name:t,value:a,type:l,required:d,inputProps:i({required:d},m)},g))}function O(e,r,t){return Object(e)!==e||(Array.isArray(r)||(r=r.toString().match(/[^.[\]]+/g)||[]),r.slice(0,-1).reduce((function(e,t,n){return Object(e[t])===e[t]?e[t]:e[t]=Math.abs(r[n+1])>>0==+r[n+1]?[]:{}}),e)[r[r.length-1]]=t),e}function T(e,r){return e.inner.reduce((function(e,t){var n,a=t.path,o=t.message;if(n=r?r(t):o,e.hasOwnProperty(a)){var l=function(e,r,t){var n=String.prototype.split.call(r,/[,[\].]+?/).filter(Boolean).reduce((function(e,r){return null!=e?e[r]:e}),e);return void 0===n||n===e?void 0:n}(e,a);l.push(n),O(e,a,l)}else O(e,a,[n]);return e}),{})}"undefined"!=typeof Symbol&&(Symbol.iterator||(Symbol.iterator=Symbol("Symbol.iterator"))),"undefined"!=typeof Symbol&&(Symbol.asyncIterator||(Symbol.asyncIterator=Symbol("Symbol.asyncIterator"))),exports.Autocomplete=function(e){var r=e.name,t=e.fieldProps,o=u(e,["name","fieldProps"]);return n.createElement(a.Field,Object.assign({name:r,render:function(e){return n.createElement(d,Object.assign({},e,o))}},t))},exports.Checkboxes=function(e){var r=e.required,t=e.label,l=e.data,m=e.name,d=e.helperText,f=e.fieldProps,h=e.formControlProps,b=e.formGroupProps,v=e.formLabelProps,E=e.formControlLabelProps,g=e.formHelperTextProps,P=e.showError,x=void 0===P?p:P,O=u(e,["required","label","data","name","helperText","fieldProps","formControlProps","formGroupProps","formLabelProps","formControlLabelProps","formHelperTextProps","showError"]),T=Array.isArray(l)?l:[l],y=1===T.length,C=c(m),j=x(C);return n.createElement(o.FormControl,Object.assign({required:r,error:j},h),t?n.createElement(o.FormLabel,Object.assign({},v),t):n.createElement(n.Fragment,null),n.createElement(o.FormGroup,Object.assign({},b),T.map((function(e,t){return n.createElement(o.FormControlLabel,Object.assign({key:t,name:m,label:e.label,value:y?void 0:e.value,disabled:e.disabled,control:n.createElement(a.Field,Object.assign({type:"checkbox",name:m,render:function(t){var a=t.input,l=a.name,s=a.value,m=a.onChange,c=a.checked,p=u(a,["name","value","onChange","checked"]);return n.createElement(o.Checkbox,Object.assign({name:l,value:s,onChange:m,checked:c,disabled:e.disabled,inputProps:i({required:r},p)},O))}},f))},E))}))),n.createElement(s,{showError:j,meta:C.meta,formHelperTextProps:g,helperText:d}))},exports.DatePicker=function(e){var r=e.name,t=e.fieldProps,o=u(e,["name","fieldProps"]);return n.createElement(a.Field,Object.assign({name:r,render:function(e){return n.createElement(v,Object.assign({},e,o))}},t))},exports.DateTimePicker=function(e){var r=e.name,t=e.fieldProps,o=u(e,["name","fieldProps"]);return n.createElement(a.Field,Object.assign({name:r,render:function(e){return n.createElement(E,Object.assign({},e,o))}},t))},exports.Debug=function(){return n.createElement(a.FormSpy,{subscription:{values:!0}},(function(e){return n.createElement("pre",null,JSON.stringify(e.values,void 0,2))}))},exports.ErrorMessage=s,exports.KeyboardDatePicker=function(e){var r=e.name,t=e.fieldProps,o=u(e,["name","fieldProps"]);return n.createElement(a.Field,Object.assign({name:r,render:function(e){return n.createElement(h,Object.assign({},e,o))}},t))},exports.KeyboardDateTimePicker=function(e){var r=e.name,t=e.fieldProps,o=u(e,["name","fieldProps"]);return n.createElement(a.Field,Object.assign({name:r,render:function(e){return n.createElement(b,Object.assign({},e,o))}},t))},exports.KeyboardTimePicker=function(e){var r=e.name,t=e.fieldProps,o=u(e,["name","fieldProps"]);return n.createElement(a.Field,Object.assign({name:r,render:function(e){return n.createElement(g,Object.assign({},e,o))}},t))},exports.Radios=function(e){var r=e.name,t=e.data,l=e.label,m=e.required,d=e.helperText,f=e.formLabelProps,h=e.formControlLabelProps,b=e.fieldProps,v=e.formControlProps,E=e.radioGroupProps,g=e.formHelperTextProps,P=e.showError,x=void 0===P?p:P,O=u(e,["name","data","label","required","helperText","formLabelProps","formControlLabelProps","fieldProps","formControlProps","radioGroupProps","formHelperTextProps","showError"]),T=c(r),y=x(T);return n.createElement(o.FormControl,Object.assign({required:m,error:y},v),!!l&&n.createElement(o.FormLabel,Object.assign({},f),l),n.createElement(o.RadioGroup,Object.assign({},E),t.map((function(e,t){return n.createElement(o.FormControlLabel,Object.assign({key:t,name:r,label:e.label,value:e.value,disabled:e.disabled,control:n.createElement(a.Field,Object.assign({name:r,type:"radio",render:function(r){var t=r.input,a=t.name,l=t.value,s=t.onChange,c=t.checked,p=u(t,["name","value","onChange","checked","disabled"]);return n.createElement(o.Radio,Object.assign({name:a,value:l,onChange:s,checked:c,disabled:e.disabled,required:m,inputProps:i({required:m},p)},O))}},b))},h))}))),n.createElement(s,{showError:y,meta:T.meta,formHelperTextProps:g,helperText:d}))},exports.Select=function(e){var r=e.name,t=e.label,l=e.data,m=e.children,d=e.required,f=e.multiple,h=e.helperText,b=e.fieldProps,v=e.inputLabelProps,E=e.formControlProps,g=e.formHelperTextProps,P=e.menuItemProps,x=e.labelWidth,O=e.showError,T=void 0===O?p:O,y=u(e,["name","label","data","children","required","multiple","helperText","fieldProps","inputLabelProps","formControlProps","formHelperTextProps","menuItemProps","labelWidth","showError"]);if(!l&&!m)throw new Error("Please specify either children or data as an attribute.");var C=y.variant,j=n.useRef(null),F=n.useState(0),k=F[0],w=F[1];n.useEffect((function(){t&&w(j.current.offsetWidth)}),[t]);var q=c(r),S=T(q);return n.createElement(o.FormControl,Object.assign({required:d,error:S,fullWidth:!0,variant:C},E),!!t&&n.createElement(o.InputLabel,Object.assign({ref:j,htmlFor:r},v),t),n.createElement(a.Field,Object.assign({name:r,render:function(e){var r=e.input,a=r.name,s=r.value,c=r.onChange,p=u(r,["name","value","onChange","checked"]);return n.createElement(o.Select,Object.assign({name:a,value:f&&!s?[]:s,onChange:c,multiple:f,label:t,labelWidth:"outlined"===C&&t?k:x,inputProps:i({required:d},p)},y),l?l.map((function(e){return n.createElement(o.MenuItem,Object.assign({value:e.value,key:e.value,disabled:e.disabled},P),e.label)})):m)}},b)),n.createElement(s,{showError:S,meta:q.meta,formHelperTextProps:g,helperText:h}))},exports.Switches=function(e){var r=e.name,t=e.data,l=e.label,m=e.required,d=e.helperText,f=e.fieldProps,h=e.formControlProps,b=e.formGroupProps,v=e.formLabelProps,E=e.formControlLabelProps,g=e.formHelperTextProps,P=e.showError,x=void 0===P?p:P,O=u(e,["name","data","label","required","helperText","fieldProps","formControlProps","formGroupProps","formLabelProps","formControlLabelProps","formHelperTextProps","showError"]),T=Array.isArray(t)?t:[t],y=1===T.length,C=c(r),j=x(C);return n.createElement(o.FormControl,Object.assign({required:m,error:j},h),l?n.createElement(o.FormLabel,Object.assign({},v),l):n.createElement(n.Fragment,null),n.createElement(o.FormGroup,Object.assign({},b),T.map((function(e,t){return n.createElement(o.FormControlLabel,Object.assign({key:t,name:r,label:e.label,value:y?void 0:e.value,disabled:e.disabled,control:n.createElement(a.Field,Object.assign({type:"checkbox",name:r,render:function(r){var t=r.input,a=t.name,l=t.value,s=t.onChange,c=t.checked,p=u(t,["name","value","onChange","checked"]);return n.createElement(o.Switch,Object.assign({name:a,value:l,onChange:s,checked:c,disabled:e.disabled,required:m,inputProps:i({required:m},p)},O))}},f))},E))}))),n.createElement(s,{showError:j,meta:C.meta,formHelperTextProps:g,helperText:d}))},exports.TextField=function(e){var r=e.name,t=e.type,o=e.fieldProps,l=u(e,["name","type","fieldProps"]);return n.createElement(a.Field,Object.assign({name:r,type:t,render:function(e){return n.createElement(x,Object.assign({input:e.input,meta:e.meta,name:r,type:t},l))}},o))},exports.TimePicker=function(e){var r=e.name,t=e.fieldProps,o=u(e,["name","fieldProps"]);return n.createElement(a.Field,Object.assign({name:r,render:function(e){return n.createElement(P,Object.assign({},e,o))}},t))},exports.makeRequired=function e(r){var t=r.fields;return Object.keys(t).reduce((function(r,n){return r[n]=t[n].fields?e(t[n]):!!t[n]._exclusive.required,r}),{})},exports.makeValidate=function(e,r){return function(t){try{return Promise.resolve(function(r,n){try{var a=Promise.resolve(e.validate(t,{abortEarly:!1})).then((function(){return{}}))}catch(e){return n(e)}return a&&a.then?a.then(void 0,n):a}(0,(function(e){return T(e,r)})))}catch(e){return Promise.reject(e)}}},exports.makeValidateSync=function(e,r){return function(t){try{return e.validateSync(t,{abortEarly:!1}),{}}catch(e){return T(e,r)}}},exports.showErrorOnBlur=function(e){var r=e.meta;return!(!(r.submitError&&!r.dirtySinceLastSubmit||r.error)||!r.touched)},exports.showErrorOnChange=p,exports.useFieldForErrors=c; //# sourceMappingURL=mui-rff.cjs.production.min.js.map