mui-rff/dist/mui-rff.cjs.js

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

"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),N=require("@mui/material/Autocomplete"),K=require("@mui/material/TextField"),k=require("react-final-form"),c=require("@mui/material"),O=require("@mui/x-date-pickers");function L({showError:s,meta:t,formHelperTextProps:e,helperText:r}){return s?o.jsx(c.FormHelperText,{...e,children:t.error||t.submitError}):r?o.jsx(c.FormHelperText,{...e,children:r}):o.jsx(o.Fragment,{})}const Q={subscription:{error:!0,submitError:!0,dirtySinceLastSubmit:!0,touched:!0,modified:!0}},D=s=>k.useField(s,Q),A=({meta:{submitError:s,dirtySinceLastSubmit:t,error:e,touched:r,modified:n}})=>!!((s&&!t||e)&&(r||n)),U=({meta:{submitError:s,dirtySinceLastSubmit:t,error:e,touched:r}})=>!!((s&&!t||e)&&r);function X(s){const{name:t,fieldProps:e,...r}=s;return o.jsx(k.Field,{name:t,render:n=>o.jsx(Y,{...n,...r}),...e})}function Y(s){const{input:{name:t,value:e,onChange:r,onFocus:n,onBlur:l},meta:u,options:d,label:h,required:f,multiple:a,textFieldProps:P,getOptionValue:p,showError:b=A,onChange:m,...x}=s;function i(j){return p?a?j?j.map(p):null:j?p(j):null:j}const{helperText:T,...F}=x,{variant:w,onFocus:C,onBlur:v,...g}=P||{};let E;p?e&&d.forEach(j=>{const S=p(j);a?(E||(E=[]),e.forEach(I=>{I===S&&E.push(j)})):e===S&&(E=j)}):E=e;const y=(j,S,I,B)=>{const R=i(S);r(R),m&&m(j,S,I,B)},{error:V,submitError:W}=u,G=b({meta:u});return o.jsx(N,{multiple:a,onChange:y,options:d,value:E||(a?[]:null),renderInput:j=>{var S,I,B,R,M;return o.jsx(K,{label:h,required:f,helperText:G?V||W:T,error:G,name:t,variant:w,onFocus:q=>{C==null||C(q),n(q)},onBlur:q=>{v==null||v(q),l(q)},...j,...g,InputProps:{...j.InputProps,...g.InputProps,...((S=g.InputProps)==null?void 0:S.startAdornment)&&{startAdornment:o.jsxs(o.Fragment,{children:[g.InputProps.startAdornment,(I=j.InputProps)==null?void 0:I.startAdornment]})},...((B=g.InputProps)==null?void 0:B.endAdornment)&&{endAdornment:o.jsxs(o.Fragment,{children:[(R=j.InputProps)==null?void 0:R.endAdornment,(M=g.InputProps)==null?void 0:M.endAdornment]})}},fullWidth:!0})},...F})}function Z(s){const{required:t,label:e,data:r,name:n,helperText:l,fieldProps:u,formControlProps:d,formGroupProps:h,formLabelProps:f,formControlLabelProps:a,formHelperTextProps:P,showError:p=A,...b}=s,m=Array.isArray(r)?r:[r],x=!Array.isArray(r),i=D(n),T=p(i);return o.jsxs(c.FormControl,{required:t,error:T,...d,children:[e?o.jsx(c.FormLabel,{...f,children:e}):o.jsx(o.Fragment,{}),o.jsx(c.FormGroup,{...h,children:m.map((F,w)=>o.jsx(c.FormControlLabel,{name:n,label:F.label,value:x?void 0:F.value,disabled:F.disabled,control:o.jsx(k.Field,{type:"checkbox",name:n,render:({input:{name:C,value:v,onChange:g,checked:E,onBlur:y,onFocus:V,...W}})=>o.jsx(c.Checkbox,{name:C,value:v,onChange:g,checked:E,disabled:F.disabled,slotProps:{input:{required:t,onBlur:y,onFocus:V,...W}},indeterminate:F.indeterminate,...b}),...u}),...a},w))}),o.jsx(L,{showError:T,meta:i.meta,formHelperTextProps:P,helperText:l})]})}function _(s){const{name:t,data:e,label:r,required:n,helperText:l,fieldProps:u,formControlProps:d,formGroupProps:h,formLabelProps:f,formControlLabelProps:a,formHelperTextProps:P,showError:p=A,...b}=s,m=Array.isArray(e)?e:[e],x=!Array.isArray(e),i=D(t),T=p(i);return o.jsxs(c.FormControl,{required:n,error:T,...d,children:[r?o.jsx(c.FormLabel,{...f,children:r}):o.jsx(o.Fragment,{}),o.jsx(c.FormGroup,{...h,children:m.map((F,w)=>o.jsx(c.FormControlLabel,{name:t,label:F.label,value:x?void 0:F.value,disabled:F.disabled,control:o.jsx(k.Field,{type:"checkbox",name:t,render:({input:{name:C,value:v,onChange:g,checked:E,...y}})=>o.jsx(c.Switch,{name:C,value:v,onChange:g,checked:E,disabled:F.disabled,required:n,inputProps:{required:n,...y},...b}),...u}),...a},w))}),o.jsx(L,{showError:T,meta:i.meta,formHelperTextProps:P,helperText:l})]})}function rr(s){const{name:t,data:e,label:r,required:n,helperText:l,formLabelProps:u,formControlLabelProps:d,fieldProps:h,formControlProps:f,radioGroupProps:a,formHelperTextProps:P,showError:p=A,...b}=s,m=D(t),x=p(m);return o.jsxs(c.FormControl,{required:n,error:x,...f,children:[!!r&&o.jsx(c.FormLabel,{...u,children:r}),o.jsx(c.RadioGroup,{...a,children:e.map((i,T)=>o.jsx(c.FormControlLabel,{name:t,label:i.label,value:i.value,disabled:i.disabled,control:o.jsx(k.Field,{name:t,type:"radio",render:({input:{name:F,value:w,onChange:C,checked:v,onBlur:g,onFocus:E,...y}})=>o.jsx(c.Radio,{name:F,value:w,onChange:C,checked:v,disabled:i.disabled,required:n,slotProps:{input:{required:n,onBlur:g,onFocus:E,...y}},...b}),...h}),...d},T))}),o.jsx(L,{showError:x,meta:m.meta,formHelperTextProps:P,helperText:l})]})}function er(s){const{name:t,label:e,data:r,children:n,required:l,multiple:u,helperText:d,fieldProps:h,inputLabelProps:f,formControlProps:a,formHelperTextProps:P,menuItemProps:p,showError:b=A,...m}=s;if(!r&&!n)throw new Error("Please specify either children or data as an attribute.");const{variant:x}=m,i=D(t),T=b(i);return o.jsx(k.Field,{name:t,render:({input:{name:F,value:w,onChange:C,...v}})=>{const g=u&&!w?[]:w,E=`select-input-${F}`;return o.jsxs(c.FormControl,{required:l,error:T,fullWidth:!0,variant:x,...a,children:[!!e&&o.jsx(c.InputLabel,{id:E,...f,children:e}),o.jsx(c.Select,{name:F,value:g,onChange:C,multiple:u,label:e,labelId:E,inputProps:{required:l,...v},...m,children:r?r.map(y=>o.jsx(c.MenuItem,{value:y.value,disabled:y.disabled,...p,children:y.label},y.value)):n}),o.jsx(L,{showError:T,meta:i.meta,formHelperTextProps:P,helperText:d})]})},...h})}function tr(s){const{name:t,fieldProps:e,...r}=s;return o.jsx(k.Field,{name:t,render:n=>o.jsx(or,{...n,...r}),...e})}function or(s){const{input:{name:t,onChange:e,value:r,...n},meta:l,showError:u=A,...d}=s,{error:h,submitError:f}=l,a=u({meta:l}),{helperText:P,textFieldProps:p,slotProps:b,required:m,...x}=d;return o.jsx(O.DatePicker,{onChange:e,value:r===""?null:r,...x,slotProps:{...b,textField:{...p,helperText:a?h||f:P,inputProps:{onBlur:i=>{n.onBlur(i)},onFocus:i=>{n.onFocus(i)}},error:a,fullWidth:!0,name:t,onChange:e,value:r===""?null:r,required:m}}})}function nr(s){const{name:t,fieldProps:e,...r}=s;return o.jsx(k.Field,{name:t,render:n=>o.jsx(sr,{...n,...r}),...e})}function sr(s){const{input:{name:t,onChange:e,value:r,...n},meta:l,showError:u=A,...d}=s,{error:h,submitError:f}=l,a=u({meta:l}),{helperText:P,textFieldProps:p,slotProps:b,required:m,...x}=d;return o.jsx(O.DateTimePicker,{onChange:e,value:r===""?null:r,...x,slotProps:{...b,textField:{...p,helperText:a?h||f:P,inputProps:{onBlur:i=>{n.onBlur(i)},onFocus:i=>{n.onFocus(i)}},error:a,fullWidth:!0,name:t,onChange:e,value:r===""?null:r,required:m}}})}function lr(s){const{name:t,fieldProps:e,...r}=s;return o.jsx(k.Field,{name:t,render:n=>o.jsx(ir,{...n,...r}),...e})}function ir(s){const{input:{name:t,onChange:e,value:r,...n},meta:l,showError:u=A,...d}=s,{error:h,submitError:f}=l,a=u({meta:l}),{helperText:P,textFieldProps:p,required:b,...m}=d;return o.jsx(O.TimePicker,{onChange:e,value:r===""?null:r,...m,slotProps:{textField:{...p,helperText:a?h||f:P,inputProps:{onBlur:x=>{n.onBlur(x)},onFocus:x=>{n.onFocus(x)}},error:a,fullWidth:!0,name:t,onChange:e,value:r===""?null:r,required:b}}})}function ur(s){const{name:t,type:e,fieldProps:r,...n}=s;return o.jsx(k.Field,{name:t,type:e,render:({input:l,meta:u})=>o.jsx(ar,{input:l,meta:u,name:t,type:e,...n}),...r})}function ar(s){const{input:{name:t,value:e,type:r,onChange:n,onBlur:l,onFocus:u,...d},meta:h,required:f,fullWidth:a=!0,helperText:P,showError:p=A,...b}=s,{error:m,submitError:x}=h,i=p({meta:h});return o.jsx(c.TextField,{fullWidth:a,helperText:i?m||x:P,error:i,onChange:n,onBlur:l,onFocus:u,name:t,value:e,type:r,required:f,inputProps:{required:f,...d},...b})}function H(s,t,e){const r=String.prototype.split.call(t,/[,[\].]+?/).filter(Boolean).reduce((n,l)=>n!=null?n[l]:n,s);return r===void 0||r===s?e:r}function $(s,t,e){return Object(s)!==s||(Array.isArray(t)||(t=t.toString().match(/[^.[\]]+/g)||[]),t.slice(0,-1).reduce((r,n,l)=>Object(r[n])===r[n]?r[n]:r[n]=Math.abs(t[l+1])>>0===+t[l+1]?[]:{},s)[t[t.length-1]]=e),s}function z(s,t){return s.inner.reduce((e,r)=>{const{path:n,message:l}=r,u=t?t(r):l;if(n&&H(e,n)){const d=H(e,n);d.push(u),$(e,n,d)}else $(e,n,[u]);return e},{})}function cr(s,t){return async e=>{try{return await s.validate(e,{abortEarly:!1}),{}}catch(r){return z(r,t)}}}function dr(s,t){return e=>{try{return s.validateSync(e,{abortEarly:!1}),{}}catch(r){return z(r,t)}}}function J(s){const t=s.fields;return Object.keys(t).reduce((e,r)=>(t[r].fields?e[r]=J(t[r]):e[r]=!t[r].spec.optional,e),{})}function pr(){return o.jsx(k.FormSpy,{subscription:{values:!0},children:({values:s})=>o.jsx("pre",{children:JSON.stringify(s,void 0,2)})})}exports.Autocomplete=X;exports.Checkboxes=Z;exports.DatePicker=tr;exports.DateTimePicker=nr;exports.Debug=pr;exports.ErrorMessage=L;exports.Radios=rr;exports.Select=er;exports.Switches=_;exports.TextField=ur;exports.TimePicker=lr;exports.makeRequired=J;exports.makeValidate=cr;exports.makeValidateSync=dr;exports.showErrorOnBlur=U;exports.showErrorOnChange=A;exports.useFieldForErrors=D;
//# sourceMappingURL=mui-rff.cjs.js.map