UNPKG

authhaven

Version:

Customizable React and TypeScript authentication UI components with support for login, signup, 2FA, and more.

1 lines 70 kB
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useRef as n,useState as i,useEffect as o}from"react";import{Mail as a,EyeOff as l,Eye as r,Check as s}from"lucide-react";var p=function(){return p=Object.assign||function(e){for(var t,n=1,i=arguments.length;n<i;n++)for(var o in t=arguments[n])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e},p.apply(this,arguments)};function u(e,t){var n={};for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&t.indexOf(i)<0&&(n[i]=e[i]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(i=Object.getOwnPropertySymbols(e);o<i.length;o++)t.indexOf(i[o])<0&&Object.prototype.propertyIsEnumerable.call(e,i[o])&&(n[i[o]]=e[i[o]])}return n}"function"==typeof SuppressedError&&SuppressedError;var d=function(n){var i=n.buttonChildren,o=n.buttonVariant,a=void 0===o?"solid":o,l=n.buttonSize,r=void 0===l?"md":l,s=n.buttonColor,d=void 0===s?"primary":s,c=n.buttonLeftIcon,m=n.buttonRightIcon,C=n.buttonFullWidth,x=void 0!==C&&C,b=n.buttonRounded,y=void 0!==b&&b,g=n.buttonDisabled,h=void 0!==g&&g,S=n.buttonClassName,f=void 0===S?"":S,N=n.buttonStyle,v=n.buttonOnClick,I=n.primaryButtonColor,k=n.primaryButtonTextColor,L=u(n,["buttonChildren","buttonVariant","buttonSize","buttonColor","buttonLeftIcon","buttonRightIcon","buttonFullWidth","buttonRounded","buttonDisabled","buttonClassName","buttonStyle","buttonOnClick","primaryButtonColor","primaryButtonTextColor"]),w=I||"#2563EB",T=k||"white",F=I?H(I,-10):"#1D4ED8",B=function(){switch(a){case"solid":default:return E(d);case"outline":return O(d);case"ghost":return R(d);case"link":return D(d)}},E=function(e){switch(e){case"primary":default:return{backgroundColor:w,color:T,":hover":{backgroundColor:F}};case"secondary":return{backgroundColor:"#4B5563",color:"white",":hover":{backgroundColor:"#374151"}};case"success":return{backgroundColor:"#10B981",color:"white",":hover":{backgroundColor:"#059669"}};case"danger":return{backgroundColor:"#EF4444",color:"white",":hover":{backgroundColor:"#DC2626"}};case"warning":return{backgroundColor:"#F59E0B",color:"white",":hover":{backgroundColor:"#D97706"}};case"info":return{backgroundColor:"#06B6D4",color:"white",":hover":{backgroundColor:"#0891B2"}};case"light":return{backgroundColor:"#E5E7EB",color:"#1F2937",":hover":{backgroundColor:"#D1D5DB"}};case"dark":return{backgroundColor:"#1F2937",color:"white",":hover":{backgroundColor:"#111827"}}}},O=function(e){switch(e){case"primary":default:return{backgroundColor:"transparent",color:w,border:"1px solid ".concat(w),":hover":{backgroundColor:H(w,95,!0)}};case"secondary":return{backgroundColor:"transparent",color:"#4B5563",border:"1px solid #4B5563",":hover":{backgroundColor:"#F9FAFB"}};case"success":return{backgroundColor:"transparent",color:"#10B981",border:"1px solid #10B981",":hover":{backgroundColor:"#ECFDF5"}};case"danger":return{backgroundColor:"transparent",color:"#EF4444",border:"1px solid #EF4444",":hover":{backgroundColor:"#FEF2F2"}};case"warning":return{backgroundColor:"transparent",color:"#F59E0B",border:"1px solid #F59E0B",":hover":{backgroundColor:"#FFFBEB"}};case"info":return{backgroundColor:"transparent",color:"#06B6D4",border:"1px solid #06B6D4",":hover":{backgroundColor:"#ECFEFF"}};case"light":return{backgroundColor:"transparent",color:"#6B7280",border:"1px solid #E5E7EB",":hover":{backgroundColor:"#F9FAFB"}};case"dark":return{backgroundColor:"transparent",color:"#1F2937",border:"1px solid #1F2937",":hover":{backgroundColor:"#F9FAFB"}}}},R=function(e){switch(e){case"primary":default:return{backgroundColor:"transparent",color:w,":hover":{backgroundColor:H(w,95,!0)}};case"secondary":return{backgroundColor:"transparent",color:"#4B5563",":hover":{backgroundColor:"#F9FAFB"}};case"success":return{backgroundColor:"transparent",color:"#10B981",":hover":{backgroundColor:"#ECFDF5"}};case"danger":return{backgroundColor:"transparent",color:"#EF4444",":hover":{backgroundColor:"#FEF2F2"}};case"warning":return{backgroundColor:"transparent",color:"#F59E0B",":hover":{backgroundColor:"#FFFBEB"}};case"info":return{backgroundColor:"transparent",color:"#06B6D4",":hover":{backgroundColor:"#ECFEFF"}};case"light":return{backgroundColor:"transparent",color:"#9CA3AF",":hover":{backgroundColor:"#F9FAFB"}};case"dark":return{backgroundColor:"transparent",color:"#1F2937",":hover":{backgroundColor:"#F9FAFB"}}}},D=function(e){switch(e){case"primary":default:return{backgroundColor:"transparent",color:w,padding:0,":hover":{textDecoration:"underline"}};case"secondary":return{backgroundColor:"transparent",color:"#4B5563",padding:0,":hover":{textDecoration:"underline"}};case"success":return{backgroundColor:"transparent",color:"#10B981",padding:0,":hover":{textDecoration:"underline"}};case"danger":return{backgroundColor:"transparent",color:"#EF4444",padding:0,":hover":{textDecoration:"underline"}};case"warning":return{backgroundColor:"transparent",color:"#F59E0B",padding:0,":hover":{textDecoration:"underline"}};case"info":return{backgroundColor:"transparent",color:"#06B6D4",padding:0,":hover":{textDecoration:"underline"}};case"light":return{backgroundColor:"transparent",color:"#9CA3AF",padding:0,":hover":{textDecoration:"underline"}};case"dark":return{backgroundColor:"transparent",color:"#1F2937",padding:0,":hover":{textDecoration:"underline"}}}};function H(e,t,n){void 0===n&&(n=!1);var i=parseInt(e.substring(1,3),16),o=parseInt(e.substring(3,5),16),a=parseInt(e.substring(5,7),16);return n?(i=Math.min(255,i+Math.floor(i*(t/100))),o=Math.min(255,o+Math.floor(o*(t/100))),a=Math.min(255,a+Math.floor(a*(t/100)))):(i=Math.max(0,i-Math.floor(i*(t/100))),o=Math.max(0,o-Math.floor(o*(t/100))),a=Math.max(0,a-Math.floor(a*(t/100)))),"#".concat(((1<<24)+(i<<16)+(o<<8)+a).toString(16).slice(1))}var P=p(p(p(p(p(p({},{display:"inline-flex",alignItems:"center",justifyContent:"center",fontWeight:500,minWidth:"150px",minHeight:"44px",cursor:h?"not-allowed":"pointer",opacity:h?.6:1,transition:"background-color 0.2s, border-color 0.2s, color 0.2s"}),B()),function(){switch(r){case"xs":return{fontSize:"0.75rem",padding:"0.25rem 0.5rem"};case"sm":return{fontSize:"0.875rem",padding:"0.375rem 0.75rem"};case"md":default:return{fontSize:"1rem",padding:"0.5rem 1rem"};case"lg":return{fontSize:"1.125rem",padding:"0.625rem 1.25rem"};case"xl":return{fontSize:"1.25rem",padding:"0.75rem 1.5rem"}}}()),x?{width:"100%"}:{}),y?{borderRadius:"9999px"}:{borderRadius:"0.375rem"}),N);return e("button",p({className:f,style:P,disabled:h,onClick:v,onMouseOver:function(e){var t=B()[":hover"];t&&Object.entries(t).forEach((function(t){var n=t[0],i=t[1];e.currentTarget.style[n]=i}))},onMouseOut:function(e){var t=B(),n=t[":hover"];n&&Object.keys(n).forEach((function(n){e.currentTarget.style[n]=t[n]||""}))}},L,{children:[c&&t("span",p({style:{marginRight:"0.5rem"}},{children:c})),i,m&&t("span",p({style:{marginLeft:"0.5rem"}},{children:m}))]}))},c=function(l){var r=l.inputLabel,s=void 0===r?"":r,d=l.inputLabelStyle,c=l.inputHelperText,m=l.inputHelperTextStyle,C=l.inputFieldStyle,x=l.inputError,b=l.inputHideOnError,y=l.inputErrorStyle,g=l.inputValue,h=void 0===g?"":g,S=l.inputId,f=l.inputName,N=l.inputRequired,v=l.inputContainerClassName,I=l.inputLabelClassName,k=l.inputHelperTextClassName,L=l.inputFieldClassName,w=l.inputErrorClassName,T=l.inputLabelContainerClassName,F=l.inputLabelContainerStyle,B=l.inputLeftIcon,E=l.inputRightIcon,O=l.inputOnChange,R=l.inputstyletype,D=void 0===R?"text":R,H=l.inputRegex,P=l.inputOnValidation,V=l.inputPlaceholder,z=l.inputContainerStyle,A=l.labelMatchBackground,W=u(l,["inputLabel","inputLabelStyle","inputHelperText","inputHelperTextStyle","inputFieldStyle","inputError","inputHideOnError","inputErrorStyle","inputValue","inputId","inputName","inputRequired","inputContainerClassName","inputLabelClassName","inputHelperTextClassName","inputFieldClassName","inputErrorClassName","inputLabelContainerClassName","inputLabelContainerStyle","inputLeftIcon","inputRightIcon","inputOnChange","inputstyletype","inputRegex","inputOnValidation","inputPlaceholder","inputContainerStyle","labelMatchBackground"]),M=n(null),j=i(!1),q=j[0],U=j[1],Z=i(h),$=Z[0],G=Z[1],K=i(!0),Y=K[0],_=K[1],J=q||$.length>0,Q=function(e){if(!H)return!0;try{var t=new RegExp(H).test(e);return _(t),P&&P(t),t}catch(e){return console.error("Invalid regex pattern:",e),!0}};return o((function(){G(h),Q(h)}),[h,H]),e("div",p({style:p({display:"flex",flexDirection:"column",width:"100%",maxWidth:"560px",textAlign:"left",marginBottom:"10px"},z),className:v,id:S},{children:[e("div",p({className:T,style:p(p({backgroundColor:"transparent",display:"flex",flexDirection:"column",justifyContent:"left",alignItems:"flex-start",border:"1px solid ".concat(x?"red":q?"blue":"black"),borderRadius:"5px",padding:"4px",marginTop:"4px",marginBottom:"4px"},F),{position:"relative"})},{children:[e("div",p({style:p({position:"absolute",top:J?"-10px":"20px",left:J?"12px":B?"38px":"15px",fontSize:J?"14px":"17px",transition:"all 0.2s ease-in-out",backgroundColor:J?A||"white":"transparent",padding:J?"0 4px ":"0",zIndex:1,color:x?"red":"black"},d),className:I},{children:[s,N&&t("span",p({style:{color:"red",marginLeft:"2px"}},{children:"*"}))]})),e("div",p({className:L,style:p({display:"flex",flexDirection:"row",justifyContent:"space-between",alignItems:"center",width:"100%",paddingTop:J?"4px":"0",minHeight:"54px"},C)},{children:[B&&t("div",p({style:{display:"flex",alignItems:"center",marginLeft:"8px"}},{children:B})),t("input",p({ref:M,name:f,value:$,onChange:function(e){var t=e.target.value;G(t);var n=Q(t);O&&O(t,n)},onFocus:function(){U(!0)},onBlur:function(){U(!1),Q($)},placeholder:s?"":V,style:{borderColor:"transparent",outline:"none",padding:"8px",width:"100%",fontSize:"16px"},type:D},W)),B?"":E?t("div",p({style:{display:"flex",alignItems:"center",marginRight:"8px"}},{children:E})):t(a,{size:20,style:{marginRight:"12px"}})]}))]})),(x||!Y)&&t("div",p({style:p({color:"red",fontSize:"14px",marginTop:"4px"},y),className:w},{children:x})),c&&(b&&x?null:t("div",p({className:k,style:p({},m)},{children:c})))]}))},m=function(l){var r=l.inputValue,s=void 0===r?"":r,d=l.inputLabel,c=void 0===d?"":d,m=l.inputLabelStyle,C=l.inputHelperText,x=l.inputHelperTextStyle,b=l.inputFieldStyle,y=l.inputError,g=l.inputHideOnError,h=l.inputErrorStyle,S=l.inputPlaceholder,f=l.inputId,N=l.inputName,v=l.inputRequired,I=l.inputContainerClassName,k=l.inputLabelClassName,L=l.inputHelperTextClassName,w=l.inputFieldClassName,T=l.inputErrorClassName,F=l.inputLabelContainerClassName,B=l.inputLabelContainerStyle,E=l.inputLeftIcon,O=l.inputRightIcon,R=l.inputOnChange,D=l.inputstyletype,H=void 0===D?"text":D,P=l.inputRegex,V=l.inputContainerStyle,z=l.inputOnValidation,A=u(l,["inputValue","inputLabel","inputLabelStyle","inputHelperText","inputHelperTextStyle","inputFieldStyle","inputError","inputHideOnError","inputErrorStyle","inputPlaceholder","inputId","inputName","inputRequired","inputContainerClassName","inputLabelClassName","inputHelperTextClassName","inputFieldClassName","inputErrorClassName","inputLabelContainerClassName","inputLabelContainerStyle","inputLeftIcon","inputRightIcon","inputOnChange","inputstyletype","inputRegex","inputContainerStyle","inputOnValidation"]),W=n(null),M=i(!1),j=M[0],q=M[1],U=i(s),Z=U[0],$=U[1],G=i(!0),K=G[0],Y=G[1];j||Z.length;var _=function(e){if(!P)return!0;try{var t=new RegExp(P).test(e);return Y(t),z&&z(t),t}catch(e){return console.error("Invalid regex pattern:",e),!0}};return o((function(){$(s),_(s)}),[s,P]),e("div",p({style:p({display:"flex",flexDirection:"column",width:"100%",maxWidth:"560px",textAlign:"left"},V),className:I,id:f},{children:[e("div",p({style:p(p({display:"flex",flexDirection:"row",alignItems:"center"},m),{color:y?"red":"black"}),className:k},{children:[c,v&&t("span",p({style:{color:"red",marginLeft:"4px"}},{children:"*"}))]})),e("div",p({className:F,style:p({display:"flex",flexDirection:"row",justifyContent:"space-between",alignItems:"center",border:"1px solid ".concat(y?"red":j?"blue":"black"),borderRadius:"5px",padding:"4px",marginTop:"4px",marginBottom:"4px",minHeight:"54px"},B)},{children:[E&&t("div",p({style:{display:"flex",alignItems:"center",marginLeft:"8px"}},{children:E})),t("input",p({ref:W,name:N,value:Z,onChange:function(e){var t=e.target.value;$(t),_(t),R&&R(t,K)},onFocus:function(){q(!0)},onBlur:function(){q(!1),_(Z)},placeholder:S,className:w,style:p({borderColor:"transparent",outline:"none",padding:"8px",width:"100%",fontSize:"16px"},b),type:H},A)),O?t("div",p({style:{display:"flex",alignItems:"center",marginRight:"8px"}},{children:O})):t(a,{size:20,style:{color:"#666",marginRight:"8px"}})]})),(y||!K)&&t("div",p({style:p({color:"red",fontSize:"14px",marginTop:"4px"},h),className:T},{children:y})),C&&(g&&y?null:t("div",p({className:L,style:p({},x)},{children:C})))]}))},C=function(a){var s=a.inputLabel,d=void 0===s?"":s,c=a.inputLabelStyle,m=a.inputHelperText,C=a.inputHelperTextStyle,x=a.inputFieldStyle,b=a.inputError,y=a.inputHideOnError,g=a.inputErrorStyle,h=a.inputValue,S=void 0===h?"":h,f=a.inputId,N=a.inputName,v=a.inputRequired,I=a.inputContainerClassName,k=a.inputLabelClassName,L=a.inputHelperTextClassName,w=a.inputFieldClassName,T=a.inputErrorClassName,F=a.inputLabelContainerClassName,B=a.inputLabelContainerStyle,E=a.inputLeftIcon,O=a.inputRightIcon,R=a.inputOnChange,D=a.inputContainerStyle,H=a.inputPlaceholder,P=a.labelMatchBackground,V=u(a,["inputLabel","inputLabelStyle","inputHelperText","inputHelperTextStyle","inputFieldStyle","inputError","inputHideOnError","inputErrorStyle","inputValue","inputId","inputName","inputRequired","inputContainerClassName","inputLabelClassName","inputHelperTextClassName","inputFieldClassName","inputErrorClassName","inputLabelContainerClassName","inputLabelContainerStyle","inputLeftIcon","inputRightIcon","inputOnChange","inputContainerStyle","inputPlaceholder","labelMatchBackground"]),z=n(null),A=i(!1),W=A[0],M=A[1],j=i(S),q=j[0],U=j[1],Z=i(!1),$=Z[0],G=Z[1];console.log("inputHideOnError",y);var K=W||q.length>0;return o((function(){U(S)}),[S]),e("div",p({style:p({display:"flex",flexDirection:"column",width:"100%",maxWidth:"560px",textAlign:"left",marginBottom:"10px"},D),className:I,id:f},{children:[e("div",p({className:F,style:p(p({backgroundColor:"transparent",display:"flex",flexDirection:"column",justifyContent:"left",alignItems:"flex-start",border:"1px solid ".concat(b?"red":W?"blue":"black"),borderRadius:"5px",padding:"4px",marginTop:"4px",marginBottom:"4px"},B),{position:"relative"})},{children:[e("div",p({style:p({position:"absolute",top:K?"-10px":"20px",left:K?"12px":E?"38px":"15px",fontSize:K?"14px":"17px",transition:"all 0.2s ease-in-out",backgroundColor:K?P||"white":"transparent",padding:K?"0 4px ":"0",zIndex:1,color:b?"red":"black"},c),className:k},{children:[d,v&&t("span",p({style:{color:"red",marginLeft:"2px"}},{children:"*"}))]})),e("div",p({className:F,style:p({display:"flex",flexDirection:"row",justifyContent:"space-between",alignItems:"center",width:"100%",paddingTop:K?"4px":"0",minHeight:"54px"},B)},{children:[E&&t("div",p({style:{display:"flex",alignItems:"center",marginLeft:"8px"}},{children:E})),t("input",p({ref:z,name:N,value:q,onChange:function(e){var t=e.target.value;U(t),R&&R(t)},onFocus:function(){M(!0)},onBlur:function(){M(!1)},className:w,style:p({borderColor:"transparent",outline:"none",padding:"8px",width:"100%",fontSize:"16px"},x),type:$?"text":"password",placeholder:d?"":H},V)),O&&t("div",p({style:{display:"flex",alignItems:"center",marginRight:"8px"}},{children:O})),t("button",p({type:"button",onClick:function(){G(!$)},style:{background:"transparent",border:"none",cursor:"pointer",padding:"4px",marginRight:"8px",display:"flex",alignItems:"center",justifyContent:"center"},"aria-label":$?"Hide password":"Show password"},{children:t($?l:r,{size:20,style:{color:"#666"}})}))]}))]})),b&&t("div",p({style:p({color:"red",fontSize:"14px",marginTop:"4px"},g),className:T},{children:b})),m&&(y&&b?null:t("div",p({className:L,style:p({},C)},{children:m})))]}))},x=function(a){var s=a.inputValue,d=void 0===s?"":s,c=a.inputLabel,m=void 0===c?"":c,C=a.inputLabelStyle,x=a.inputHelperText,b=a.inputHelperTextStyle,y=a.inputFieldStyle,g=a.inputError,h=a.inputHideOnError,S=a.inputErrorStyle,f=a.inputPlaceholder,N=a.inputId,v=a.inputName,I=a.inputRequired,k=a.inputContainerClassName,L=a.inputLabelClassName,w=a.inputHelperTextClassName,T=a.inputFieldClassName,F=a.inputErrorClassName,B=a.inputLabelContainerClassName,E=a.inputLabelContainerStyle,O=a.inputLeftIcon,R=a.inputRightIcon,D=a.inputOnChange,H=a.inputContainerStyle,P=u(a,["inputValue","inputLabel","inputLabelStyle","inputHelperText","inputHelperTextStyle","inputFieldStyle","inputError","inputHideOnError","inputErrorStyle","inputPlaceholder","inputId","inputName","inputRequired","inputContainerClassName","inputLabelClassName","inputHelperTextClassName","inputFieldClassName","inputErrorClassName","inputLabelContainerClassName","inputLabelContainerStyle","inputLeftIcon","inputRightIcon","inputOnChange","inputContainerStyle"]),V=n(null),z=i(!1),A=z[0],W=z[1],M=i(d),j=M[0],q=M[1],U=i(!1),Z=U[0],$=U[1];return o((function(){q(d)}),[d]),e("div",p({style:p({display:"flex",flexDirection:"column",width:"100%",maxWidth:"560px",textAlign:"left"},H),className:k,id:N},{children:[e("div",p({style:p(p({display:"flex",flexDirection:"row",alignItems:"center"},C),{color:g?"red":"black"}),className:L},{children:[m,I&&t("span",p({style:{color:"red",marginLeft:"4px"}},{children:"*"}))]})),e("div",p({className:B,style:p({display:"flex",flexDirection:"row",justifyContent:"space-between",alignItems:"center",border:"1px solid ".concat(g?"red":A?"blue":"black"),borderRadius:"5px",padding:"4px",marginTop:"4px",marginBottom:"4px",minHeight:"54px"},E)},{children:[O&&t("div",p({style:{display:"flex",alignItems:"center",marginLeft:"8px"}},{children:O})),t("input",p({ref:V,name:v,value:j,onChange:function(e){var t=e.target.value;q(t),D&&D(t)},onFocus:function(){W(!0)},onBlur:function(){W(!1)},placeholder:f,className:T,style:p({borderColor:"transparent",outline:"none",padding:"8px",width:"100%",fontSize:"16px"},y),type:Z?"text":"password"},P)),R&&t("div",p({style:{display:"flex",alignItems:"center",marginRight:"8px"}},{children:R})),t("button",p({type:"button",onClick:function(){$(!Z)},style:{background:"transparent",border:"none",cursor:"pointer",padding:"4px",marginRight:"4px",display:"flex",alignItems:"center",justifyContent:"center"},"aria-label":Z?"Hide password":"Show password"},{children:t(Z?l:r,{size:20,style:{color:"#666"}})}))]})),g&&t("div",p({style:p({color:"red",fontSize:"14px",marginTop:"4px"},S),className:F},{children:g})),x&&(h&&g?null:t("div",p({className:w,style:p({},b)},{children:x})))]}))},b=function(e){var n=e.text,i=e.textStyle,o=e.textClassName,a=void 0===o?"":o,l=e.as,r=void 0===l?"p":l,s=e.containerStyle,u=e.containerClassName,d=void 0===u?"":u,c=e.children,m=e.onClick,C=r,x=n||c;return s||d?t("div",p({style:s,className:d},{children:t(C,p({style:i,className:a,onClick:m},{children:x}))})):t(C,p({style:i,className:a,onClick:m},{children:x}))},y=function(n){var i=n.mainContainerStyle,o=n.mainContainerClassName,a=void 0===o?"":o,l=n.logo,r=n.logoSectionClassName,s=n.logoStyle,c=n.title,m=void 0===c?"Forgot Password?":c,C=n.titleStyle,x=n.titleClassName,y=void 0===x?"":x,g=n.subtitleText,h=void 0===g?"Please select option to send link reset password":g,S=n.subtitleStyle,f=n.subtitleClassName,N=void 0===f?"":f,v=n.optionsContainerStyle,I=n.optionsContainerClassName,k=void 0===I?"":I,L=n.emailOptionTitle,w=void 0===L?"Reset Via Email":L,T=n.emailOptionDescription,F=void 0===T?"Code will be sent to your registered email address.":T,B=n.emailOptionContainerStyle,E=n.emailOptionContainerClassName,O=void 0===E?"":E,R=n.emailOptionTitleStyle,D=n.emailOptionTitleClassName,H=void 0===D?"":D,P=n.emailOptionDescriptionStyle,V=n.emailOptionDescriptionClassName,z=void 0===V?"":V,A=n.emailIcon,W=n.emailIconContainerStyle,M=n.emailIconContainerClassName,j=void 0===M?"":M,q=n.phoneOptionTitle,U=void 0===q?"Reset Via Phone":q,Z=n.phoneOptionDescription,$=void 0===Z?"Code will be sent to your registered Phone Number.":Z,G=n.phoneOptionContainerStyle,K=n.phoneOptionContainerClassName,Y=void 0===K?"":K,_=n.phoneOptionTitleStyle,J=n.phoneOptionTitleClassName,Q=void 0===J?"":J,X=n.phoneOptionDescriptionStyle,ee=n.phoneOptionDescriptionClassName,te=void 0===ee?"":ee,ne=n.phoneIcon,ie=n.phoneIconContainerStyle,oe=n.phoneIconContainerClassName,ae=void 0===oe?"":oe,le=n.selectedOption,re=void 0===le?null:le,se=n.onOptionSelect,pe=void 0===se?function(){}:se,ue=n.selectedOptionIndicatorStyle,de=n.selectedOptionIndicatorClassName,ce=void 0===de?"":de,me=n.sendCodeButtonText,Ce=void 0===me?"Send Code":me,xe=n.onSendCode,be=void 0===xe?function(){}:xe,ye=n.sendCodeButtonStyle,ge=n.sendCodeButtonClassName,he=void 0===ge?"":ge,Se=n.resendLinkText,fe=void 0===Se?"Resend":Se,Ne=n.onResend,ve=void 0===Ne?function(){}:Ne,Ie=n.resendContainerStyle,ke=n.resendContainerClassName,Le=void 0===ke?"":ke,we=n.didntReceiveText,Te=void 0===we?"Didn't received link?":we,Fe=n.didntReceiveTextStyle,Be=n.didntReceiveTextClassName,Ee=void 0===Be?"":Be,Oe=n.resendLinkStyle,Re=n.resendLinkClassName,De=void 0===Re?"":Re,He=n.cancelButtonText,Pe=void 0===He?"Cancel":He,Ve=n.onCancel,ze=void 0===Ve?function(){}:Ve,Ae=n.cancelButtonStyle,We=n.cancelButtonClassName,Me=void 0===We?"":We,je=n.buttonColor,qe=void 0===je?"primary":je,Ue=n.buttonVariant,Ze=void 0===Ue?"solid":Ue,$e=n.buttonDisabled,Ge=void 0!==$e&&$e,Ke=n.buttonFullWidth,Ye=void 0===Ke||Ke,_e=u(n,["mainContainerStyle","mainContainerClassName","logo","logoSectionClassName","logoStyle","title","titleStyle","titleClassName","subtitleText","subtitleStyle","subtitleClassName","optionsContainerStyle","optionsContainerClassName","emailOptionTitle","emailOptionDescription","emailOptionContainerStyle","emailOptionContainerClassName","emailOptionTitleStyle","emailOptionTitleClassName","emailOptionDescriptionStyle","emailOptionDescriptionClassName","emailIcon","emailIconContainerStyle","emailIconContainerClassName","phoneOptionTitle","phoneOptionDescription","phoneOptionContainerStyle","phoneOptionContainerClassName","phoneOptionTitleStyle","phoneOptionTitleClassName","phoneOptionDescriptionStyle","phoneOptionDescriptionClassName","phoneIcon","phoneIconContainerStyle","phoneIconContainerClassName","selectedOption","onOptionSelect","selectedOptionIndicatorStyle","selectedOptionIndicatorClassName","sendCodeButtonText","onSendCode","sendCodeButtonStyle","sendCodeButtonClassName","resendLinkText","onResend","resendContainerStyle","resendContainerClassName","didntReceiveText","didntReceiveTextStyle","didntReceiveTextClassName","resendLinkStyle","resendLinkClassName","cancelButtonText","onCancel","cancelButtonStyle","cancelButtonClassName","buttonColor","buttonVariant","buttonDisabled","buttonFullWidth"]),Je=t("div",p({style:p({width:"40px",height:"40px",borderRadius:"50%",backgroundColor:"#6B68D8",display:"flex",justifyContent:"center",alignItems:"center"},W),className:j},{children:e("svg",p({width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[t("path",{d:"M3 7.8C3 6.11984 3 5.27976 3.32698 4.63803C3.6146 4.07354 4.07354 3.6146 4.63803 3.32698C5.27976 3 6.11984 3 7.8 3H16.2C17.8802 3 18.7202 3 19.362 3.32698C19.9265 3.6146 20.3854 4.07354 20.673 4.63803C21 5.27976 21 6.11984 21 7.8V16.2C21 17.8802 21 18.7202 20.673 19.362C20.3854 19.9265 19.9265 20.3854 19.362 20.673C18.7202 21 17.8802 21 16.2 21H7.8C6.11984 21 5.27976 21 4.63803 20.673C4.07354 20.3854 3.6146 19.9265 3.32698 19.362C3 18.7202 3 17.8802 3 16.2V7.8Z",stroke:"white",strokeWidth:"2"}),t("path",{d:"M3 9L10.2 13.65C10.8802 14.1 11.2202 14.325 11.5839 14.3941C11.8279 14.4514 12.1721 14.4514 12.4161 14.3941C12.7798 14.325 13.1198 14.1 13.8 13.65L21 9",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}))})),Qe=t("div",p({style:p({width:"40px",height:"40px",borderRadius:"50%",backgroundColor:"#6B68D8",display:"flex",justifyContent:"center",alignItems:"center"},ie),className:ae},{children:t("svg",p({width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:t("path",{d:"M14.5 6.5C15.2372 6.64382 15.9689 6.96892 16.5 7.5C17.0311 8.03108 17.3562 8.76284 17.5 9.5M15 3C16.5768 3.16 18.0268 3.75543 19.1679 4.75944C20.309 5.76345 21.0023 7.11769 21 8.5M20.9995 16.4767V19.1864C21.0037 20.2223 20.0723 21.0873 19.0265 20.9929C10.0001 21 3.00006 13.935 3.00713 4.96919C2.91294 3.92895 3.77364 3.00106 4.80817 3.00009H7.52331C7.96253 2.99577 8.38835 3.151 8.72138 3.43684C9.66819 4.24949 10.2772 7.00777 10.0429 8.10428C9.85994 8.96036 8.99696 9.55929 8.41026 10.1448C9.69864 12.4062 11.5747 14.2785 13.8405 15.5644C14.4272 14.9788 15.0274 14.1176 15.8851 13.935C16.9855 13.7008 19.7615 14.3106 20.5709 15.264C20.858 15.6021 21.0105 16.0337 20.9995 16.4767Z",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}))})),Xe=t("div",p({style:p({width:"24px",height:"24px",borderRadius:"50%",backgroundColor:"#6B68D8",display:"flex",justifyContent:"center",alignItems:"center"},ue),className:ce},{children:t("svg",p({width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:t("path",{d:"M13.3334 4L6.00008 11.3333L2.66675 8",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}))}));return e("div",p({style:p({maxWidth:"500px",margin:"0 auto",padding:"24px",backgroundColor:"#FFFFFF",borderRadius:"16px",boxShadow:"0px 4px 20px rgba(0, 0, 0, 0.1)",height:"fit-content"},i),className:a},{children:[l&&t("div",p({className:r,style:p(p({},s),{display:"flex",justifyContent:"center",alignItems:"center",width:"100%",height:"100%",padding:"12px 0",margin:"12px 0"})},{children:l})),t(b,{as:"h1",text:m,textStyle:p({color:"black",fontSize:"32px",fontWeight:"bold",textAlign:"center",marginBottom:"12px"},C),textClassName:y}),t(b,{text:h,textStyle:p({color:"darkgray",fontSize:"16px",textAlign:"center",marginBottom:"24px"},S),textClassName:N}),e("div",p({style:p({display:"flex",flexDirection:"column",gap:"16px",marginBottom:"24px"},v),className:k},{children:[e("div",p({style:p({display:"flex",alignItems:"center",padding:"16px",borderRadius:"12px",cursor:"pointer",border:"email"===re?"1px solid #6B68D8":"1px solid black"},B),className:O,onClick:function(){return pe("email")}},{children:[A||Je,e("div",p({style:{marginLeft:"16px",flex:1}},{children:[t(b,{as:"h3",text:w,textStyle:p({color:"black",fontSize:"18px",fontWeight:"600",marginBottom:"4px"},R),textClassName:H}),t(b,{text:F,textStyle:p({color:"darkgray",fontSize:"14px"},P),textClassName:z})]})),"email"===re&&Xe]})),e("div",p({style:p({display:"flex",alignItems:"center",padding:"16px",borderRadius:"12px",cursor:"pointer",border:"phone"===re?"1px solid #6B68D8":"1px solid black"},G),className:Y,onClick:function(){return pe("phone")}},{children:[ne||Qe,e("div",p({style:{marginLeft:"16px",flex:1}},{children:[t(b,{as:"h3",text:U,textStyle:p({color:"black",fontSize:"18px",fontWeight:"600",marginBottom:"4px"},_),textClassName:Q}),t(b,{text:$,textStyle:p({color:"darkgray",fontSize:"14px"},X),textClassName:te})]})),"phone"===re&&Xe]}))]})),t(d,p({buttonChildren:Ce,buttonColor:qe,buttonVariant:Ze,buttonFullWidth:Ye,buttonDisabled:!re||Ge,buttonOnClick:be,buttonStyle:p({padding:"16px",backgroundColor:"#9D8DF8",fontSize:"16px",fontWeight:"600",marginBottom:"16px"},ye),buttonClassName:he},_e)),t(d,{buttonChildren:Pe,buttonColor:"light",buttonVariant:"ghost",buttonFullWidth:Ye,buttonOnClick:ze,buttonStyle:p({padding:"16px",fontSize:"16px",fontWeight:"600",marginBottom:"16px"},Ae),buttonClassName:Me}),e("div",p({style:p({display:"flex",justifyContent:"center",alignItems:"center",gap:"8px"},Ie),className:Le},{children:[t(b,{text:Te,textStyle:p({color:"#C8C8D8",fontSize:"14px"},Fe),textClassName:Ee}),t(b,{as:"span",text:fe,textStyle:p({color:"#9D8DF8",fontSize:"14px",fontWeight:"600",cursor:"pointer"},Oe),textClassName:De,onClick:ve})]}))]}))},g=function(n){var i=n.mainContainerStyle,o=n.mainContainerClassName,a=void 0===o?"":o,l=n.logo,r=n.logoSectionClassName,s=n.logoStyle,c=n.title,x=void 0===c?"Forgot your password?":c,y=n.titleStyle,g=n.titleClassName,h=void 0===g?"":g,S=n.descriptionText,f=void 0===S?"A code will be sent to your email to help reset password":S,N=n.descriptionStyle,v=n.descriptionClassName,I=void 0===v?"":v,k=n.formContainerStyle,L=n.formContainerClassName,w=void 0===L?"":L,T=n.emailInputLabel,F=void 0===T?"Email Address":T,B=n.emailInputValue,E=void 0===B?"":B,O=n.handleEmailChange,R=n.labelPosition,D=void 0===R?"over":R,H=n.emailInputError,P=n.emailInputHelperText,V=n.emailInputPlaceholder,z=void 0===V?"Enter your email address":V,A=n.onResetPassword,W=void 0===A?function(){}:A,M=n.resetButtonText,j=void 0===M?"Reset password":M,q=n.resetButtonStyle,U=n.resetButtonClassName,Z=void 0===U?"":U,$=n.backToLoginText,G=void 0===$?"Back to login":$,K=n.onBackToLogin,Y=void 0===K?function(){}:K,_=n.backToLoginStyle,J=n.backToLoginClassName,Q=void 0===J?"":J,X=n.cancelButtonText,ee=void 0===X?"Cancel":X,te=n.onCancel,ne=void 0===te?function(){}:te,ie=n.cancelButtonStyle,oe=n.cancelButtonClassName,ae=void 0===oe?"":oe,le=n.buttonColor,re=void 0===le?"primary":le,se=n.buttonVariant,pe=void 0===se?"solid":se,ue=n.buttonDisabled,de=void 0!==ue&&ue,ce=n.buttonFullWidth,me=void 0===ce||ce,Ce=n.inputLeftIcon,xe=n.inputRightIcon,be=n.inputContainerClassName,ye=void 0===be?"":be,ge=n.inputContainerStyle,he=n.inputLabelClassName,Se=void 0===he?"":he,fe=n.inputLabelStyle,Ne=n.inputFieldClassName,ve=void 0===Ne?"":Ne,Ie=n.inputFieldStyle,ke=n.inputErrorClassName,Le=void 0===ke?"":ke,we=n.inputErrorStyle,Te=n.inputHelperTextClassName,Fe=void 0===Te?"":Te,Be=n.inputHelperTextStyle,Ee=u(n,["mainContainerStyle","mainContainerClassName","logo","logoSectionClassName","logoStyle","title","titleStyle","titleClassName","descriptionText","descriptionStyle","descriptionClassName","formContainerStyle","formContainerClassName","emailInputLabel","emailInputValue","handleEmailChange","labelPosition","emailInputError","emailInputHelperText","emailInputPlaceholder","onResetPassword","resetButtonText","resetButtonStyle","resetButtonClassName","backToLoginText","onBackToLogin","backToLoginStyle","backToLoginClassName","cancelButtonText","onCancel","cancelButtonStyle","cancelButtonClassName","buttonColor","buttonVariant","buttonDisabled","buttonFullWidth","inputLeftIcon","inputRightIcon","inputContainerClassName","inputContainerStyle","inputLabelClassName","inputLabelStyle","inputFieldClassName","inputFieldStyle","inputErrorClassName","inputErrorStyle","inputHelperTextClassName","inputHelperTextStyle"]),Oe={inputLabel:F,inputValue:E,inputOnChange:O,inputError:H,inputHelperText:P,inputPlaceholder:z,inputLeftIcon:Ce,inputRightIcon:xe,inputContainerClassName:ye,inputContainerStyle:ge,inputLabelClassName:Se,inputLabelStyle:fe,inputFieldClassName:ve,inputFieldStyle:Ie,inputErrorClassName:Le,inputErrorStyle:we,inputHelperTextClassName:Fe,inputHelperTextStyle:Be,inputRegex:"^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,}$",inputstyletype:"email",inputRequired:!0};return e("div",p({style:p({maxWidth:"500px",margin:"0 auto",padding:"24px",backgroundColor:"#FFFFFF",borderRadius:"16px",boxShadow:"0px 4px 20px rgba(0, 0, 0, 0.1)",height:"fit-content"},i),className:a},{children:[l&&t("div",p({className:r,style:p(p({},s),{display:"flex",justifyContent:"center",alignItems:"center",width:"100%",height:"100%",padding:"12px 0",margin:"12px 0"})},{children:l})),t(b,{as:"h1",text:x,textStyle:p({fontSize:"28px",fontWeight:"bold",textAlign:"center",marginBottom:"12px",color:"#333333"},y),textClassName:h}),t(b,{text:f,textStyle:p({fontSize:"16px",textAlign:"center",marginBottom:"24px",color:"#666666"},N),textClassName:I}),e("form",p({style:p({display:"flex",flexDirection:"column",gap:"20px"},k),className:w,onSubmit:function(e){e.preventDefault(),W()}},{children:[t("over"===D?m:C,p({},Oe)),t(d,p({buttonChildren:j,buttonColor:re,buttonVariant:pe,buttonFullWidth:me,buttonDisabled:!E||de,buttonOnClick:W,type:"submit",buttonStyle:p({padding:"12px",fontSize:"16px",fontWeight:"600",marginTop:"8px"},q),buttonClassName:Z},Ee)),t(d,{buttonChildren:ee,buttonColor:"light",buttonVariant:"ghost",buttonFullWidth:me,buttonOnClick:ne,buttonStyle:p({padding:"12px",fontSize:"16px",fontWeight:"600"},ie),buttonClassName:ae}),t("div",p({style:{display:"flex",justifyContent:"center",alignItems:"center",marginTop:"8px"}},{children:t(b,{as:"span",text:G,textStyle:p({color:"#3B82F6",fontSize:"14px",fontWeight:"600",cursor:"pointer"},_),textClassName:Q,onClick:Y})}))]}))]}))},h=function(n){var i=n.mainLoginSectionStyle,o=n.emailInputLabel,a=n.emailInputValue,l=n.handleInputEmailChange,r=n.emailInputId,b=n.emailInputRequired,y=n.emailInputRegex,g=n.emailInputError,h=n.emailInputRightIcon,S=n.emailInputHelperText,f=n.labelPosition,N=void 0===f?"over":f,v=n.passwordInputLabel,I=n.passwordInputValue,k=n.handleInputPasswordChange,L=n.passwordInputId,w=n.passwordInputRequired,T=n.passwordInputError,F=n.passwordInputHelperText,B=n.passwordInputLeftIcon,E=n.logo,O=n.logoSectionClassName,R=n.logoStyle,D=n.title,H=n.subTitle,P=n.titleSectionStyle,V=n.titleSectionClassName,z=n.titleStyle,A=n.titleClassName,W=n.subTitleStyle,M=n.subTitleClassName,j=n.checkBokSectionClassName,q=n.checkBoxSectionStyle,U=n.checkboxStyle,Z=n.primaryColorCheckbox,$=n.checkboxClassName,G=n.onCheckboxClick,K=n.rememberMeValue,Y=n.rememberMeLabel,_=n.rememberMeLabelStyle,J=n.rememberMeLabelClassName,Q=n.buttonSectionClassName,X=n.buttonSectionStyle,ee=n.submitLabel,te=n.primaryButtonColor,ne=n.primaryButtonTextColor,ie=n.buttonStyle,oe=n.buttonRightIcon,ae=n.buttonVariant,le=n.buttonSize,re=n.buttonColor,se=n.buttonLeftIcon,pe=n.buttonFullWidth,ue=n.buttonRounded,de=n.buttonDisabled,ce=n.buttonClassName,me=n.buttonOnClick,Ce=n.buttonType,xe=void 0===Ce?"submit":Ce,be=n.buttonChildren,ye=n.linksSectionStyle,ge=n.linksSectionClassName,he=n.noAccountLabel,Se=void 0===he?"Don't have an account?".concat(" "):he,fe=n.onCreateAccount,Ne=n.noAccountLabelStyle,ve=n.noAccountLabelClassName,Ie=n.createAccountLabellinkStyle,ke=n.createAccountLabellinkClassName,Le=n.createAccountLabel,we=void 0===Le?"Sign Up":Le,Te=n.forgotPasswordLabel,Fe=void 0===Te?"Forgot password":Te,Be=n.forgotPasswordLabelPStyle,Ee=n.forgotPasswordLabelPClassName,Oe=n.forgotPasswordLabelAStyle,Re=n.forgotPasswordLabelAClassName,De=n.onForgotPassword,He=n.emailInputLabelStyle,Pe=n.emailHelperTextStyle,Ve=n.emailInputFieldStyle,ze=n.emailInputHideOnError,Ae=n.emailInputErrorStyle,We=n.emailInputContainerClassName,Me=n.emailInputLabelClassName,je=n.emailInputHelperTextClassName,qe=n.emailInputFieldClassName,Ue=n.emailInputErrorClassName,Ze=n.emailInputLabelContainerClassName,$e=n.emailInputLabelContainerStyle,Ge=n.emailInputLeftIcon,Ke=n.emailInputOnValidation,Ye=n.emailInputPlaceholder,_e=n.emailInputContainerStyle,Je=n.passwordInputLabelStyle,Qe=n.passwordInputHelperTextStyle,Xe=n.passwordInputFieldStyle,et=n.passwordInputHideOnError,tt=n.passwordInputErrorStyle,nt=n.passwordInputPlaceholder,it=n.passwordInputContainerClassName,ot=n.passwordInputLabelClassName,at=n.passwordInputHelperTextClassName,lt=n.passwordInputFieldClassName,rt=n.passwordInputErrorClassName,st=n.passwordInputLabelContainerClassName,pt=n.passwordInputLabelContainerStyle,ut=n.passwordInputContainerStyle,dt=n.labelMatchBackground,ct=u(n,["mainLoginSectionStyle","emailInputLabel","emailInputValue","handleInputEmailChange","emailInputId","emailInputRequired","emailInputRegex","emailInputError","emailInputRightIcon","emailInputHelperText","labelPosition","passwordInputLabel","passwordInputValue","handleInputPasswordChange","passwordInputId","passwordInputRequired","passwordInputError","passwordInputHelperText","passwordInputLeftIcon","logo","logoSectionClassName","logoStyle","title","subTitle","titleSectionStyle","titleSectionClassName","titleStyle","titleClassName","subTitleStyle","subTitleClassName","checkBokSectionClassName","checkBoxSectionStyle","checkboxStyle","primaryColorCheckbox","checkboxClassName","onCheckboxClick","rememberMeValue","rememberMeLabel","rememberMeLabelStyle","rememberMeLabelClassName","buttonSectionClassName","buttonSectionStyle","submitLabel","primaryButtonColor","primaryButtonTextColor","buttonStyle","buttonRightIcon","buttonVariant","buttonSize","buttonColor","buttonLeftIcon","buttonFullWidth","buttonRounded","buttonDisabled","buttonClassName","buttonOnClick","buttonType","buttonChildren","linksSectionStyle","linksSectionClassName","noAccountLabel","onCreateAccount","noAccountLabelStyle","noAccountLabelClassName","createAccountLabellinkStyle","createAccountLabellinkClassName","createAccountLabel","forgotPasswordLabel","forgotPasswordLabelPStyle","forgotPasswordLabelPClassName","forgotPasswordLabelAStyle","forgotPasswordLabelAClassName","onForgotPassword","emailInputLabelStyle","emailHelperTextStyle","emailInputFieldStyle","emailInputHideOnError","emailInputErrorStyle","emailInputContainerClassName","emailInputLabelClassName","emailInputHelperTextClassName","emailInputFieldClassName","emailInputErrorClassName","emailInputLabelContainerClassName","emailInputLabelContainerStyle","emailInputLeftIcon","emailInputOnValidation","emailInputPlaceholder","emailInputContainerStyle","passwordInputLabelStyle","passwordInputHelperTextStyle","passwordInputFieldStyle","passwordInputHideOnError","passwordInputErrorStyle","passwordInputPlaceholder","passwordInputContainerClassName","passwordInputLabelClassName","passwordInputHelperTextClassName","passwordInputFieldClassName","passwordInputErrorClassName","passwordInputLabelContainerClassName","passwordInputLabelContainerStyle","passwordInputContainerStyle","labelMatchBackground"]);console.log("emailInputHideOnError",ze),console.log("passwordInputHideOnError",et);var mt;return e("div",p({style:p({minWidth:"270px",height:"fit-content",backgroundColor:"#ffff",display:"flex",justifyContent:"center",alignItems:"center",flexDirection:"column",maxWidth:"500px",margin:"0 auto",padding:"24px",borderRadius:"16px",boxShadow:"0px 4px 20px rgba(0, 0, 0, 0.1)"},i)},{children:[E&&t("div",p({className:O,style:p(p({},R),{display:"flex",justifyContent:"center",alignItems:"center",width:"100%",height:"100%",padding:"12px 0",margin:"12px 0"})},{children:E})),D&&e("div",p({style:p(p({},P),{display:"flex",flexDirection:"column",justifyContent:"center",alignItems:"center",width:"100%",height:"100%",padding:"12px 0",margin:"12px 0"}),className:V},{children:[t("p",p({style:p(p({},z),{fontSize:"32px",margin:"5px"}),className:A},{children:D})),t("p",p({style:p(p({},W),{fontSize:"18px",margin:"5px"}),className:M},{children:H}))]})),e("div",p({style:{width:"100%",height:"fit-content"}},{children:[(mt=p({inputLabel:o,inputValue:a,inputOnChange:l,inputstyletype:"email",inputName:"email",inputId:r,inputRequired:b,inputRegex:y,inputError:g,inputHelperText:S,inputRightIcon:h,inputLabelStyle:He,inputHelperTextStyle:Pe,inputFieldStyle:Ve,inputHideOnError:ze,inputErrorStyle:Ae,inputContainerClassName:We,inputLabelClassName:Me,inputHelperTextClassName:je,inputFieldClassName:qe,inputErrorClassName:Ue,inputLabelContainerClassName:Ze,inputLabelContainerStyle:$e,inputLeftIcon:Ge,inputOnValidation:Ke,inputPlaceholder:Ye,inputContainerStyle:_e,labelMatchBackground:dt},ct),t("internal"===N?c:m,p({},mt))),function(){var e={inputLabel:v,inputValue:I,inputOnChange:k,inputstyletype:"password",inputName:"password",inputId:L,inputRequired:w,inputError:T,inputHelperText:F,inputLeftIcon:B,inputLabelStyle:Je,inputHelperTextStyle:Qe,inputFieldStyle:Xe,inputHideOnError:et,inputErrorStyle:tt,inputPlaceholder:nt,inputContainerClassName:it,inputLabelClassName:ot,inputHelperTextClassName:at,inputFieldClassName:lt,inputErrorClassName:rt,inputLabelContainerClassName:st,inputLabelContainerStyle:pt,inputContainerStyle:ut,labelMatchBackground:dt,props:ct};return t("internal"===N?C:x,p({},e))}()]})),e("div",p({style:p(p({},q),{display:"flex",alignItems:"center",marginBottom:"22px",width:"100%",padding:"12px 0"}),className:j},{children:[t("div",p({style:p(p({},U),{width:"24px",height:"24px",backgroundColor:K?Z:"white",borderRadius:"6px",border:"2px solid ".concat(K?Z:"#CBD5E0"),display:"flex",alignItems:"center",justifyContent:"center",marginRight:"12px",cursor:"pointer"}),className:$,onClick:function(e){return G&&G(e)},role:"checkbox","aria-checked":K,tabIndex:0},{children:K&&t(s,{size:16,color:"red"})})),t("label",p({style:p({cursor:"pointer"},_),className:J},{children:Y}))]})),t("div",p({style:p({},X),className:Q},{children:t(d,{primaryButtonColor:te,primaryButtonTextColor:ne,buttonStyle:ie,buttonRightIcon:oe,buttonVariant:ae,buttonSize:le,buttonColor:re,buttonLeftIcon:se,buttonFullWidth:pe,buttonRounded:ue,buttonDisabled:de,buttonClassName:ce,buttonOnClick:me,type:xe,buttonChildren:be||ee})})),e("div",p({style:p(p({},ye),{display:"flex",flexDirection:"column",width:"100%",justifyContent:"center",alignItems:"center",margin:"10px 0"}),className:ge},{children:[e("p",p({style:p(p({},Ne),{padding:"0",margin:"2px 0"}),className:ve},{children:[Se,t("a",p({href:"#",onClick:function(e){e.preventDefault(),fe&&fe()},style:p({},Ie),className:ke},{children:we}))]})),t("p",p({style:p(p({},Be),{padding:" 0",margin:"2px 0"}),className:Ee},{children:t("a",p({href:"#",onClick:function(e){e.preventDefault(),De&&De()},style:p({},Oe),className:Re},{children:Fe}))}))]}))]}))},S=function(n){var i=n.mainSignUpSectionStyle,o=n.gridView,a=void 0!==o&&o,l=n.fields,r=void 0===l?[]:l,b=n.labelPosition,y=void 0===b?"internal":b,g=n.labelMatchBackground,h=n.logo,S=n.logoSectionClassName,f=n.logoStyle,N=n.title,v=n.subTitle,I=n.titleSectionStyle,k=n.titleSectionClassName,L=n.titleStyle,w=n.titleClassName,T=n.subTitleStyle,F=n.subTitleClassName,B=n.checkBokSectionClassName,E=n.checkBoxSectionStyle,O=n.checkboxStyle,R=n.primaryColorCheckbox,D=n.checkboxClassName,H=n.onCheckboxClick,P=n.termsValue,V=n.termsLabel,z=n.termsLabelStyle,A=n.termsLabelClassName,W=n.buttonSectionClassName,M=n.buttonSectionStyle,j=n.submitLabel,q=void 0===j?"Sign Up":j,U=n.primaryButtonColor,Z=n.primaryButtonTextColor,$=n.buttonStyle,G=n.buttonRightIcon,K=n.buttonVariant,Y=n.buttonSize,_=n.buttonColor,J=n.buttonLeftIcon,Q=n.buttonFullWidth,X=n.buttonRounded,ee=n.buttonDisabled,te=n.buttonClassName,ne=n.buttonOnClick,ie=n.buttonType,oe=void 0===ie?"submit":ie,ae=n.buttonChildren,le=n.linksSectionStyle,re=n.linksSectionClassName,se=n.haveAccountLabel,pe=void 0===se?"Already have an account? ":se,ue=n.onLogin,de=n.loginLabelStyle,ce=n.loginLabelClassName,me=n.loginLabellinkStyle,Ce=n.loginLabellinkClassName,xe=n.loginLabel,be=void 0===xe?"Log In":xe,ye=n.termsAndConditionsLabel,ge=void 0===ye?"Terms and Conditions":ye,he=n.termsAndConditionsLabelPStyle,Se=n.termsAndConditionsLabelPClassName,fe=n.termsAndConditionsLabelAStyle,Ne=n.termsAndConditionsLabelAClassName,ve=n.onTermsAndConditions,Ie=u(n,["mainSignUpSectionStyle","gridView","fields","labelPosition","labelMatchBackground","logo","logoSectionClassName","logoStyle","title","subTitle","titleSectionStyle","titleSectionClassName","titleStyle","titleClassName","subTitleStyle","subTitleClassName","checkBokSectionClassName","checkBoxSectionStyle","checkboxStyle","primaryColorCheckbox","checkboxClassName","onCheckboxClick","termsValue","termsLabel","termsLabelStyle","termsLabelClassName","buttonSectionClassName","buttonSectionStyle","submitLabel","primaryButtonColor","primaryButtonTextColor","buttonStyle","buttonRightIcon","buttonVariant","buttonSize","buttonColor","buttonLeftIcon","buttonFullWidth","buttonRounded","buttonDisabled","buttonClassName","buttonOnClick","buttonType","buttonChildren","linksSectionStyle","linksSectionClassName","haveAccountLabel","onLogin","loginLabelStyle","loginLabelClassName","loginLabellinkStyle","loginLabellinkClassName","loginLabel","termsAndConditionsLabel","termsAndConditionsLabelPStyle","termsAndConditionsLabelPClassName","termsAndConditionsLabelAStyle","termsAndConditionsLabelAClassName","onTermsAndConditions"]),ke=function(e,n){var i=p({inputLabel:e.inputLabel,inputValue:e.inputValue,inputOnChange:e.inputOnChange,inputstyletype:e.type||"text",inputName:e.inputName||"field-".concat(n),inputId:e.inputId||"field-".concat(n),inputRequired:e.inputRequired,inputRegex:e.inputRegex,inputError:e.inputError,inputHelperText:e.inputHelperText,inputRightIcon:e.inputRightIcon,inputLabelStyle:e.inputLabelStyle,inputHelperTextStyle:e.inputHelperTextStyle,inputFieldStyle:e.inputFieldStyle,inputHideOnError:e.inputHideOnError,inputErrorStyle:e.inputErrorStyle,inputContainerClassName:e.inputContainerClassName,inputLabelClassName:e.inputLabelClassName,inputHelperTextClassName:e.inputHelperTextClassName,inputFieldClassName:e.inputFieldClassName,inputErrorClassName:e.inputErrorClassName,inputLabelContainerClassName:e.inputLabelContainerClassName,inputLabelContainerStyle:e.inputLabelContainerStyle,inputLeftIcon:e.inputLeftIcon,inputOnValidation:e.inputOnValidation,inputPlaceholder:e.inputPlaceholder,inputContainerStyle:e.inputContainerStyle,labelMatchBackground:g},Ie);return"password"===e.type?t("internal"===y?C:x,p({},i),n):t("internal"===y?c:m,p({},i),n)};return e("div",p({style:p({minWidth:"270px",height:"fit-content",backgroundColor:"#ffff",display:"flex",justifyContent:"center",alignItems:"center",flexDirection:"column",maxWidth:"500px",margin:"0 auto",padding:"24px",borderRadius:"16px",boxShadow:"0px 4px 20px rgba(0, 0, 0, 0.1)"},i)},{children:[h&&t("div",p({className:S,style:p(p({},f),{display:"flex",justifyContent:"center",alignItems:"center",width:"100%",height:"100%",padding:"12px 0",margin:"12px 0"})},{children:h})),N&&e("div",p({style:p(p({},I),{display:"flex",flexDirection:"column",justifyContent:"center",alignItems:"center",width:"100%",height:"100%",padding:"12px 0",margin:"12px 0"}),className:k},{children:[t("p",p({style:p(p({},L),{fontSize:"32px",margin:"5px"}),className:w},{children:N})),t("p",p({style:p(p({},T),{fontSize:"18px",margin:"5px"}),className:F},{children:v}))]})),t("div",p(a?{style:{width:"100%",height:"fit-content",display:"grid",justifyContent:"center",alignItems:"baseline",gridTemplateColumns:"48% 48%",gap:"4%",marginBottom:"25px"}}:{style:{width:"100%",height:"fit-content",display:"flex",justifyContent:"center",alignItems:"center"}},{children:r.map((function(e,t){return ke(e,t)}))})),V&&e("div",p({style:p(p({},E),{display:"flex",alignItems:"center",marginBottom:"22px",width:"100%",padding:"12px 0"}),className:B},{children:[t("div",p({style:p(p({},O),{width:"24px",height:"24px",backgroundColor:P?R:"white",borderRadius:"6px",border:"2px solid ".concat(P?R:"#CBD5E0"),display:"flex",alignItems:"center",justifyContent:"center",marginRight:"12px",cursor:"pointer"}),className:D,onClick:function(e){return H&&H(e)},role:"checkbox","aria-checked":P,tabIndex:0},{children:P&&t(s,{size:16,color:"white"})})),t("label",p({style:p({cursor:"pointer"},z),className:A},{children:V}))]})),t("div",p({style:p({},M),className:W},{children:t(d,{primaryButtonColor:U,primaryButtonTextColor:Z,buttonStyle:$,buttonRightIcon:G,buttonVariant:K,buttonSize:Y,buttonColor:_,buttonLeftIcon:J,buttonFullWidth:Q,buttonRounded:X,buttonDisabled:ee,buttonClassName:te,buttonOnClick:ne,type:oe,buttonChildren:ae||q})})),e("div",p({style:p(p({},le),{display:"flex",flexDirection:"column",width:"100%",justifyContent:"center",alignItems:"center",margin:"10px 0"}),className:re},{children:[e("p",p({style:p(p({},de),{padding:"0",margin:"2px 0"}),className:ce},{children:[pe,t("a",p({href:"#",onClick:function(e){e.preventDefault(),ue&&ue()},style:p({},me),className:Ce},{children:be}))]})),ve&&t("p",p({style:p(p({},he),{padding:"0",margin:"2px 0"}),className:Se},{children:t("a",p({href:"#",onClick:function(e){e.preventDefault(),ve&&ve()},style:p({},fe),className:Ne},{children:ge}))}))]}))]}))},f=function(n){var i=n.mainContainerStyle,o=n.mainContainerClassName,a=void 0===o?"":o,l=n.logo,r=n.logoSectionClassName,s=n.logoStyle,c=n.title,m=void 0===c?"2-Factor Authentication Setup":c,C=n.titleStyle,x=n.titleClassName,y=void 0===x?"":x,g=n.subtitleText,h=void 0===g?"How would you like to receive your authentication codes?":g,S=n.subtitleStyle,f=n.subtitleClassName,N=void 0===f?"":f,v=n.optionsContainerStyle,I=n.optionsContainerClassName,k=void 0===I?"":I,L=n.selectedMethod,w=void 0===L?null:L,T=n.onMethodSelect,F=void 0===T?function(){}:T,B=n.appOptionTitle,E=void 0===B?"Authentication App":B,O=n.appOptionDescription,R=void 0===O?"Use an app like Authy or Google Authenticator to generate your authentication code.":O,D=n.appOptionContainerStyle,H=n.appOptionContainerClassName,P=void 0===H?"":H,V=n.appOptionTitleStyle,z=n.appOptionTitleClassName,A=void 0===z?"":z,W=n.appOptionDescriptionStyle,M=n.appOptionDescriptionClassName,j=void 0===M?"":M,q=n.smsOptionTitle,U=void 0===q?"SMS Text Messages":q,Z=n.smsOptionDescription,$=void 0===Z?"Receive an authentication code via text message on your mobile device.":Z,G=n.smsOptionContainerStyle,K=n.smsOptionContainerClassName,Y=void 0===K?"":K,_=n.smsOptionTitleStyle,J=n.smsOptionTitleClassName,Q=void 0===J?"":J,X=n.smsOptionDescriptionStyle,ee=n.smsOptionDescriptionClassName,te=void 0===ee?"":ee,ne=n.recommendedText,ie=void 0===ne?"RECOMMENDED":ne,oe=n.recommendedBadgeStyle,ae=n.recommendedBadgeClassName,le=void 0===ae?"":ae,re=n.radioContainerStyle,se=n.radioContainerClassName,pe=void 0===se?"":se,ue=n.radioStyle,de=n.radioClassName,ce=void 0===de?"":de,me=n.continueButtonText,Ce=void 0===me?"Continue":me,xe=n.onContinue,be=void 0===xe?function(){}:xe,ye=n.continueButtonStyle,ge=n.continueButtonClassName,he=void 0===ge?"":ge,Se=n.cancelButtonText,fe=void 0===Se?"Cancel":Se,Ne=n.onCancel,ve=void 0===Ne?function(){}:Ne,Ie=n.cancelButtonStyle,ke=n.cancelB