https://muhimasri.com/component---src-pages-code-examples-mui-form…ol-custom-input-tsx-6205c479edaab58c3309.js

1"use strict";(self.webpackChunkgatsby_starter_blog=self.webpackChunkgatsby_starter_blog||[]).push([[5038,9444],{7666:function(e,r,t){t.d(r,{Z:function(){return z}});var a=t(3366),o=t(7462),n=t(7294),s=t(4780),i=t(5704),l=t(4423),d=t(6010),c=t(8216),m=t(1657),u=t(948),p=t(4867),f=t(1588);function x(e){return(0,p.Z)("MuiFormLabel",e)}var b=(0,f.Z)("MuiFormLabel",["root","colorSecondary","focused","disabled","error","filled","required","asterisk"]),h=t(5893);const v=["children","className","color","component","disabled","error","filled","focused","required"],Z=(0,u.ZP)("label",{name:"MuiFormLabel",slot:"Root",overridesResolver:({ownerState:e},r)=>(0,o.Z)({},r.root,"secondary"===e.color&&r.colorSecondary,e.filled&&r.filled)})((({theme:e,ownerState:r})=>(0,o.Z)({color:(e.vars||e).palette.text.secondary},e.typography.body1,{lineHeight:"1.4375em",padding:0,position:"relative",[`&.${b.focused}`]:{color:(e.vars||e).palette[r.color].main},[`&.${b.disabled}`]:{color:(e.vars||e).palette.text.disabled},[`&.${b.error}`]:{color:(e.vars||e).palette.error.main}}))),k=(0,u.ZP)("span",{name:"MuiFormLabel",slot:"Asterisk",overridesResolver:(e,r)=>r.asterisk})((({theme:e})=>({[`&.${b.error}`]:{color:(e.vars||e).palette.error.main}})));var w=n.forwardRef((function(e,r){const t=(0,m.Z)({props:e,name:"MuiFormLabel"}),{children:n,className:u,component:p="label"}=t,f=(0,a.Z)(t,v),b=(0,l.Z)(),w=(0,i.Z)({props:t,muiFormControl:b,states:["color","required","focused","disabled","error","filled"]}),g=(0,o.Z)({},t,{color:w.color||"primary",component:p,disabled:w.disabled,error:w.error,filled:w.filled,focused:w.focused,required:w.required}),S=(e=>{const{classes:r,color:t,focused:a,disabled:o,error:n,filled:i,required:l}=e,d={root:["root",`color${(0,c.Z)(t)}`,o&&"disabled",n&&"error",i&&"filled",a&&"focused",l&&"required"],asterisk:["asterisk",n&&"error"]};return(0,s.Z)(d,x,r)})(g);return(0,h.jsxs)(Z,(0,o.Z)({as:p,ownerState:g,className:(0,d.Z)(S.root,u),ref:r},f,{children:[n,w.required&&(0,h.jsxs)(k,{ownerState:g,"aria-hidden":!0,className:S.asterisk,children:[" ","*"]})]}))}));function g(e){return(0,p.Z)("MuiInputLabel",e)}(0,f.Z)("MuiInputLabel",["root","focused","disabled","error","required","asterisk","formControl","sizeSmall","shrink","animated","standard","filled","outlined"]);const S=["disableAnimation","margin","shrink","variant"],q=(0,u.ZP)(w,{shouldForwardProp:e=>(0,u.FO)(e)||"classes"===e,name:"MuiInputLabel",slot:"Root",overridesResolver:(e,r)=>{const{ownerState:t}=e;return[{[`& .${b.asterisk}`]:r.asterisk},r.root,t.formControl&&r.formControl,"small"===t.size&&r.sizeSmall,t.shrink&&r.shrink,!t.disableAnimation&&r.animated,r[t.variant]]}})((({theme:e,ownerState:r})=>(0,o.Z)({display:"block",transformOrigin:"top left",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",maxWidth:"100%"},r.formControl&&{position:"absolute",left:0,top:0,transform:"translate(0, 20px) scale(1)"},"small"===r.size&&{transform:"translate(0, 17px) scale(1)"},r.shrink&&{transform:"translate(0, -1.5px) scale(0.75)",transformOrigin:"top left",maxWidth:"133%"},!r.disableAnimation&&{transition:e.transitions.create(["color","transform","max-width"],{duration:e.transitions.duration.shorter,easing:e.transitions.easing.easeOut})},"filled"===r.variant&&(0,o.Z)({zIndex:1,pointerEvents:"none",transform:"translate(12px, 16px) scale(1)",maxWidth:"calc(100% - 24px)"},"small"===r.size&&{transform:"translate(12px, 13px) scale(1)"},r.shrink&&(0,o.Z)({userSelect:"none",pointerEvents:"auto",transform:"translate(12px, 7px) scale(0.75)",maxWidth:"calc(133% - 24px)"},"small"===r.size&&{transform:"translate(12px, 4px) scale(0.75)"})),"outlined"===r.variant&&(0,o.Z)({zIndex:1,pointerEvents:"none",transform:"translate(14px, 16px) scale(1)",maxWidth:"calc(100% - 24px)"},"small"===r.size&&{transform:"translate(14px, 9px) scale(1)"},r.shrink&&{userSelect:"none",pointerEvents:"auto",maxWidth:"calc(133% - 24px)",transform:"translate(14px, -9px) scale(0.75)"}))));var z=n.forwardRef((function(e,r){const t=(0,m.Z)({name:"MuiInputLabel",props:e}),{disableAnimation:n=!1,shrink:d}=t,c=(0,a.Z)(t,S),u=(0,l.Z)();let p=d;void 0===p&&u&&(p=u.filled||u.focused||u.adornedStart);const f=(0,i.Z)({props:t,muiFormControl:u,states:["size","variant","required"]}),x=(0,o.Z)({},t,{disableAnimation:n,formControl:u,shrink:p,size:f.size,variant:f.variant,required:f.required}),b=(e=>{const{classes:r,formControl:t,size:a,shrink:n,disableAnimation:i,variant:l,required:d}=e,c={root:["root",t&&"formControl",!i&&"animated",n&&"shrink","small"===a&&"sizeSmall",l],asterisk:[d&&"asterisk"]},m=(0,s.Z)(c,g,r);return(0,o.Z)({},r,m)})(x);return(0,h.jsx)(q,(0,o.Z)({"data-shrink":p,ownerState:x,ref:r},c,{classes:b}))}))},299:function(e,r,t){t.r(r),t.d(r,{default:function(){return n}});var a=t(7294),o=t(4593);function n(){return a.createElement(o.q,null,a.createElement("meta",{name:"robots",content:"noindex"}))}},6095:function(e,r,t){t.r(r),t.d(r,{default:function(){return m}});var a=t(7294),o=t(6446),n=t(9332),s=t(7666),i=t(948),l=t(299);const d=(0,i.ZP)(n.Z)({"&.MuiInput-root":{margin:0},"& .MuiInputBase-input":{borderRadius:5,position:"relative",border:"1px solid #ced4da",padding:"10px 12px"}}),c=(0,i.ZP)(s.Z)({position:"relative",transform:"none",marginBottom:"5px"});function m(){return a.createElement(a.Fragment,null,a.createElement(l.default,null),a.createElement(o.Z,{variant:"standard"},a.createElement(c,{htmlFor:"custom-input"},"Email"),a.createElement(d,{id:"custom-input",disableUnderline:!0})))}}}]);
2//# sourceMappingURL=component---src-pages-code-examples-mui-formcontrol-custom-input-tsx-6205c479edaab58c3309.js.map