@corva/dc-platform-shared 0.0.0-75948fe → 0.0.0-761ed8d

package/components/Login/components/EmailField.js

@@ -1 +1 @@
-import e from"prop-types";import{withStyles as l,TextField as i}from"@material-ui/core";import{jsx as o}from"react/jsx-runtime";var a=function(e){var l=e.value,a=e.onChange,r=e.disabled,t=e.error,d=e.classes;return o(i,{"data-testid":"".concat("EmailField","_emailInput"),id:"email-input",label:"Email",type:"email",name:"email",autoComplete:"email",value:l,placeholder:"Enter your email address",variant:"outlined",InputLabelProps:{classes:{root:d.emailFieldLabelRoot,focused:d.emailFieldFocused}},InputProps:{classes:{root:d.emailFieldRoot,input:d.emailInput,disabled:d.emailFieldDisabled,focused:d.emailFieldFocused,error:d.emailFieldError}},onChange:a,disabled:r,error:!!t,helperText:t,fullWidth:!0})};a.defaultProps={disabled:!1,error:null},a.propTypes={value:e.string.isRequired,onChange:e.func.isRequired,disabled:e.bool,error:e.string,classes:e.shape({}).isRequired};var r=l((function(e){return{emailFieldRoot:{"&:hover:not($emailFieldDisabled):not($emailFieldFocused):not($emailFieldError) $emailFieldNotchedOutline":{borderColor:e.status.loginButton},"&$emailFieldFocused $emailFieldNotchedOutline":{borderColor:e.status.loginButton}},emailInput:{"&:-webkit-autofill":{WebkitBoxShadow:"0 0 0 100px #233 inset"}},emailFieldLabelRoot:{color:"#666","&$emailFieldFocused":{color:e.status.loginButton}}}}))(a);export{r as default};
+import e from"prop-types";import{withStyles as l,TextField as i}from"@material-ui/core";import{jsx as o}from"react/jsx-runtime";const a=({value:e,onChange:l,disabled:a=!1,error:t=null,classes:r})=>o(i,{"data-testid":"EmailField_emailInput",id:"email-input",label:"Email",type:"email",name:"email",autoComplete:"email",value:e,placeholder:"Enter your email address",variant:"outlined",InputLabelProps:{classes:{root:r.emailFieldLabelRoot,focused:r.emailFieldFocused}},InputProps:{classes:{root:r.emailFieldRoot,input:r.emailInput,disabled:r.emailFieldDisabled,focused:r.emailFieldFocused,error:r.emailFieldError}},onChange:l,disabled:a,error:!!t,helperText:t,fullWidth:!0});a.propTypes={value:e.string.isRequired,onChange:e.func.isRequired,disabled:e.bool,error:e.string,classes:e.shape({}).isRequired};var t=l((e=>({emailFieldRoot:{"&:hover:not($emailFieldDisabled):not($emailFieldFocused):not($emailFieldError) $emailFieldNotchedOutline":{borderColor:e.status.loginButton},"&$emailFieldFocused $emailFieldNotchedOutline":{borderColor:e.status.loginButton}},emailInput:{"&:-webkit-autofill":{WebkitBoxShadow:"0 0 0 100px #233 inset"}},emailFieldLabelRoot:{color:"#666","&$emailFieldFocused":{color:e.status.loginButton}}})))(a);export{t as default};

package/components/Login/components/HiddenEmailField.js

@@ -1 +1 @@
-import e from"prop-types";import{withStyles as i}from"@material-ui/core/styles";import{jsx as a}from"react/jsx-runtime";function r(e){return e.email?a("input",{name:"hidden-email",className:e.classes.input,type:"email",defaultValue:e.email}):null}r.propTypes={email:e.string,classes:e.shape({input:e.string.isRequired}).isRequired},r.defaultProps={email:null};var s=i({input:{display:"none"}})(r);export{s as default};
+import e from"prop-types";import{withStyles as i}from"@material-ui/core/styles";import{jsx as r}from"react/jsx-runtime";function s({email:e=null,classes:i}){return e?r("input",{name:"hidden-email",className:i.input,type:"email",defaultValue:e}):null}s.propTypes={email:e.string,classes:e.shape({input:e.string.isRequired}).isRequired};var t=i({input:{display:"none"}})(s);export{t as default};

package/components/Login/components/Login.js

@@ -1 +1 @@
-import o from"prop-types";import r from"classnames";import{styled as i,Tooltip as e}from"@material-ui/core";import{isMobileDetected as n,isTabletDetected as c}from"@corva/ui/utils/mobileDetect";import a from"./LogoIcon.js";import"./Login.global.css.js";import{jsx as l,jsxs as t}from"react/jsx-runtime";var m=window.innerHeight<window.innerWidth,p=i(e)({maxWidth:300,margin:0}),g=function(o){var i=o.children,e=o.location,a=o.logoIcon,g=o.logoTooltip,d=o.promoBackgroundImage,s=o.promoBackgroundWebM,u=o.promoBackgroundMp4,h=o.promoLink,v=s||u,b=t("a",{href:h,target:"_blank",rel:"noreferrer",className:r("c-login-promo",!v&&"c-login-promo__image"),style:{backgroundImage:!v&&"url(".concat(d,")")},children:["Promo",v&&t("video",{loop:!0,muted:!0,autoPlay:!0,playsinline:!0,className:"c-login-promo__video",children:[s&&l("source",{src:s,type:"video/webm"}),u&&l("source",{src:u,type:"video/mp4"})]})]});return t("div",{className:r("c-login",{"c-login-mobile":n||c,"c-login-large_content":"/login"!==e.path,"c-login-landscape":m}),children:[b,t("div",{className:"c-login-content",children:[l("div",{className:"c-login-logo",children:l(p,{title:g,placement:"bottom",children:l("div",{children:a})})}),i]})]})};g.propTypes={children:o.node,logoIcon:o.node,logoTooltip:o.string,promoLink:o.string,promoBackgroundImage:o.string,promoBackgroundWebM:o.string,promoBackgroundMp4:o.string},g.defaultProps={children:void 0,logoIcon:l(a,{}),logoTooltip:"",promoLink:"https://www.corva.ai/",promoBackgroundImage:"/static/media/67f05495a7dbbee777bb0c7974f4588a.jpg",promoBackgroundWebM:void 0,promoBackgroundMp4:void 0};export{g as default};
+import o from"prop-types";import r from"classnames";import{styled as e,Tooltip as i}from"@material-ui/core";import{isMobileDetected as n,isTabletDetected as c}from"@corva/ui/utils/mobileDetect";import l from"./LogoIcon.js";import"./Login.global.css.js";import{jsx as t,jsxs as a}from"react/jsx-runtime";const m=window.innerHeight<window.innerWidth,g=e(i)({maxWidth:300,margin:0}),p=t(l,{}),s=({children:o,location:e,logoIcon:i=p,logoTooltip:l="",promoBackgroundImage:s="/static/media/67f05495a7dbbee777bb0c7974f4588a.jpg",promoBackgroundWebM:d,promoBackgroundMp4:u,promoLink:h="https://www.corva.ai/"})=>{const b=d||u,f=a("a",{href:h,target:"_blank",rel:"noreferrer",className:r("c-login-promo",!b&&"c-login-promo__image"),style:{backgroundImage:!b&&`url(${s})`},children:["Promo",b&&a("video",{loop:!0,muted:!0,autoPlay:!0,playsinline:!0,className:"c-login-promo__video",children:[d&&t("source",{src:d,type:"video/webm"}),u&&t("source",{src:u,type:"video/mp4"})]})]});return a("div",{className:r("c-login",{"c-login-mobile":n||c,"c-login-large_content":"/login"!==e.path,"c-login-landscape":m}),children:[f,a("div",{className:"c-login-content",children:[t("div",{className:"c-login-logo",children:t(g,{title:l,placement:"bottom",children:t("div",{children:i})})}),o]})]})};s.propTypes={children:o.node,logoIcon:o.node,logoTooltip:o.string,promoLink:o.string,promoBackgroundImage:o.string,promoBackgroundWebM:o.string,promoBackgroundMp4:o.string};export{s as default};

package/components/Login/components/OrDivider.js

@@ -1 +1 @@
-import e from"prop-types";import{withStyles as t}from"@material-ui/core/styles";import r from"@material-ui/core/Divider";import i from"@material-ui/core/Grid";import s from"@material-ui/core/Typography";import{jsxs as a,jsx as m}from"react/jsx-runtime";function c(e){return a(i,{container:!0,justify:"space-between",alignItems:"center",wrap:"nowrap",children:[m(i,{item:!0,className:e.classes.dividerItem,children:m(r,{})}),m(i,{item:!0,className:e.classes.textItem,children:m(s,{variant:"subtitle1",className:e.classes.text,children:"OR"})}),m(i,{item:!0,className:e.classes.dividerItem,children:m(r,{})})]})}c.propTypes={classes:e.shape({dividerItem:e.string.isRequired,textItem:e.string.isRequired,text:e.string.isRequired}).isRequired};var l=t((function(e){return{dividerItem:{flex:10},textItem:{textAlign:"center",paddingLeft:24,paddingRight:24},text:{color:e.palette.primary.text6}}}))(c);export{l as default};
+import e from"prop-types";import{withStyles as t}from"@material-ui/core/styles";import i from"@material-ui/core/Divider";import r from"@material-ui/core/Grid";import s from"@material-ui/core/Typography";import{jsxs as a,jsx as m}from"react/jsx-runtime";function l(e){return a(r,{container:!0,justify:"space-between",alignItems:"center",wrap:"nowrap",children:[m(r,{item:!0,className:e.classes.dividerItem,children:m(i,{})}),m(r,{item:!0,className:e.classes.textItem,children:m(s,{variant:"subtitle1",className:e.classes.text,children:"OR"})}),m(r,{item:!0,className:e.classes.dividerItem,children:m(i,{})})]})}l.propTypes={classes:e.shape({dividerItem:e.string.isRequired,textItem:e.string.isRequired,text:e.string.isRequired}).isRequired};var c=t((e=>({dividerItem:{flex:10},textItem:{textAlign:"center",paddingLeft:24,paddingRight:24},text:{color:e.palette.primary.text6}})))(l);export{c as default};

package/components/Login/components/PasswordField.js

@@ -1 +1 @@
-import o from"@babel/runtime/helpers/slicedToArray";import{useState as r}from"react";import{withStyles as e,TextField as s,InputAdornment as i}from"@material-ui/core";import t from"@material-ui/core/IconButton";import d from"@material-ui/icons/Visibility";import a from"@material-ui/icons/VisibilityOff";import{jsx as l}from"react/jsx-runtime";var n=e((function(o){return{passwordFieldRoot:{"&:hover:not($passwordFieldDisabled):not($passwordFieldFocused):not($passwordFieldError) $passwordFieldNotchedOutline":{borderColor:o.status.loginButton},"&$passwordFieldFocused $passwordFieldNotchedOutline":{borderColor:o.status.loginButton}},passwordFieldLabelRoot:{"&$passwordFieldFocused":{color:o.status.loginButton}},passwordField:{"&:-webkit-autofill":{WebkitBoxShadow:"0 0 0 100px #233 inset"}}}}))((function(e){var n=e.value,p=e.onChange,u=e.disabled,c=e.error,w=e.classes,m=r(!1),F=o(m,2),b=F[0],f=F[1];return l(s,{id:"password-input",label:"Password",type:b?"text":"password",name:"password",value:n,variant:"outlined",onChange:p,autoComplete:"password",disabled:u,error:!!c,helperText:c,InputProps:{endAdornment:l(i,{position:"end",children:l(t,{"aria-label":"Toggle password visibility",onClick:function(){return f((function(o){return!o}))},children:l(b?d:a,{})})}),classes:{root:w.passwordFieldRoot,input:w.passwordField,disabled:w.passwordFieldDisabled,focused:w.passwordFieldFocused,error:w.passwordFieldError,notchedOutline:w.passwordFieldNotchedOutline}},InputLabelProps:{classes:{root:w.passwordFieldLabelRoot,focused:w.passwordFieldFocused}},fullWidth:!0})}));export{n as default};
+import{useState as o}from"react";import{withStyles as s,TextField as e,InputAdornment as r}from"@material-ui/core";import i from"@material-ui/core/IconButton";import d from"@material-ui/icons/Visibility";import t from"@material-ui/icons/VisibilityOff";import{jsx as a}from"react/jsx-runtime";var l=s((o=>({passwordFieldRoot:{"&:hover:not($passwordFieldDisabled):not($passwordFieldFocused):not($passwordFieldError) $passwordFieldNotchedOutline":{borderColor:o.status.loginButton},"&$passwordFieldFocused $passwordFieldNotchedOutline":{borderColor:o.status.loginButton}},passwordFieldLabelRoot:{"&$passwordFieldFocused":{color:o.status.loginButton}},passwordField:{"&:-webkit-autofill":{WebkitBoxShadow:"0 0 0 100px #233 inset"}}})))((({value:s,onChange:l,disabled:n,error:p,classes:u})=>{const[c,w]=o(!1);return a(e,{id:"password-input",label:"Password",type:c?"text":"password",name:"password",value:s,variant:"outlined",onChange:l,autoComplete:"password",disabled:n,error:!!p,helperText:p,InputProps:{endAdornment:a(r,{position:"end",children:a(i,{"aria-label":"Toggle password visibility",onClick:()=>w((o=>!o)),children:a(c?d:t,{})})}),classes:{root:u.passwordFieldRoot,input:u.passwordField,disabled:u.passwordFieldDisabled,focused:u.passwordFieldFocused,error:u.passwordFieldError,notchedOutline:u.passwordFieldNotchedOutline}},InputLabelProps:{classes:{root:u.passwordFieldLabelRoot,focused:u.passwordFieldFocused}},fullWidth:!0})}));export{l as default};

package/components/Login/components/StepContent.js

@@ -1 +1 @@
-import r from"prop-types";import{withStyles as e}from"@material-ui/core/styles";import i from"@material-ui/core/Grid";import{jsx as t}from"react/jsx-runtime";function s(r){return t(i,{item:!0,className:r.classes.gridItem,children:r.children})}s.propTypes={children:r.node.isRequired,classes:r.shape({gridItem:r.string.isRequired}).isRequired};var m=e((function(r){return{gridItem:{padding:r.spacing(2,4,2,4),width:"100%"}}}))(s);export{m as default};
+import r from"prop-types";import{withStyles as e}from"@material-ui/core/styles";import i from"@material-ui/core/Grid";import{jsx as s}from"react/jsx-runtime";function t(r){return s(i,{item:!0,className:r.classes.gridItem,children:r.children})}t.propTypes={children:r.node.isRequired,classes:r.shape({gridItem:r.string.isRequired}).isRequired};var m=e((r=>({gridItem:{padding:r.spacing(2,4,2,4),width:"100%"}})))(t);export{m as default};

package/components/Login/components/StepFooter.js

@@ -1 +1 @@
-import e from"prop-types";import{withStyles as r}from"@material-ui/core/styles";import i from"@material-ui/core/Grid";import{UniversalLink as n}from"@corva/ui/components";import{jsx as t,jsxs as l}from"react/jsx-runtime";function a(e){var r=e.children,a=e.classes,o=e.showNeedHelp,d=e.needHelpExternalLink;return t(i,{item:!0,className:a.gridItem,children:l(i,{container:!0,direction:"row",justify:"space-between",alignItems:"center",children:[l(i,{item:!0,children:[o&&!d&&t(n,{"data-testid":"".concat("EmailPo","_needHelp"),className:a.helpLink,href:"/login/help",children:"Need help?"}),o&&d&&t("a",{"data-testid":"".concat("EmailPo","_needHelp"),className:a.helpLink,href:d,target:"_blank",rel:"noreferrer",children:"Need help?"})]}),t(i,{item:!0,children:r})]})})}a.propTypes={children:e.node,showNeedHelp:e.bool,needHelpExternalLink:e.string,classes:e.shape({gridItem:e.string.isRequired,helpLink:e.string.isRequired}).isRequired},a.defaultProps={children:null,needHelpExternalLink:null,showNeedHelp:!0};var o=r((function(e){return{gridItem:{padding:e.spacing(2,4,4,4),width:"100%"},helpLink:{color:e.palette.primary.text6,textTransform:"uppercase",padding:e.spacing(1),borderRadius:4,"&:hover":{background:"#333",color:"#fff"}}}}))(a);export{o as default};
+import e from"prop-types";import{withStyles as r}from"@material-ui/core/styles";import i from"@material-ui/core/Grid";import{UniversalLink as t}from"@corva/ui/components";import{jsx as n,jsxs as l}from"react/jsx-runtime";function a({children:e=null,classes:r,showNeedHelp:a=!0,needHelpExternalLink:o=null}){return n(i,{item:!0,className:r.gridItem,children:l(i,{container:!0,direction:"row",justify:"space-between",alignItems:"center",children:[l(i,{item:!0,children:[a&&!o&&n(t,{"data-testid":"EmailPo_needHelp",className:r.helpLink,href:"/login/help",children:"Need help?"}),a&&o&&n("a",{"data-testid":"EmailPo_needHelp",className:r.helpLink,href:o,target:"_blank",rel:"noreferrer",children:"Need help?"})]}),n(i,{item:!0,children:e})]})})}a.propTypes={children:e.node,showNeedHelp:e.bool,needHelpExternalLink:e.string,classes:e.shape({gridItem:e.string.isRequired,helpLink:e.string.isRequired}).isRequired};var o=r((e=>({gridItem:{padding:e.spacing(2,4,4,4),width:"100%"},helpLink:{color:e.palette.primary.text6,textTransform:"uppercase",padding:e.spacing(1),borderRadius:4,"&:hover":{background:"#333",color:"#fff"}}})))(a);export{o as default};

package/components/Login/components/StepHeader.js

@@ -1 +1 @@
-import r from"prop-types";import{withStyles as e}from"@material-ui/core/styles";import i from"@material-ui/core/Grid";import t from"@material-ui/core/Typography";import{jsx as s}from"react/jsx-runtime";function a(r){return s(i,{item:!0,className:r.classes.gridItem,children:s(t,{variant:"h6",children:r.children})})}a.propTypes={children:r.string.isRequired,classes:r.shape({gridItem:r.string.isRequired}).isRequired};var m=e((function(r){return{gridItem:{padding:r.spacing(4),textAlign:"center",width:"100%"}}}))(a);export{m as default};
+import r from"prop-types";import{withStyles as e}from"@material-ui/core/styles";import i from"@material-ui/core/Grid";import t from"@material-ui/core/Typography";import{jsx as s}from"react/jsx-runtime";function a(r){return s(i,{item:!0,className:r.classes.gridItem,children:s(t,{variant:"h6",children:r.children})})}a.propTypes={children:r.string.isRequired,classes:r.shape({gridItem:r.string.isRequired}).isRequired};var m=e((r=>({gridItem:{padding:r.spacing(4),textAlign:"center",width:"100%"}})))(a);export{m as default};

package/components/Login/components/VerificationStep.js

@@ -1 +1 @@
-import e from"@babel/runtime/helpers/toConsumableArray";import t from"@babel/runtime/helpers/slicedToArray";import{useState as r,useRef as n,useEffect as i}from"react";import{Button as o}from"@corva/ui/components";import{makeStyles as a,Grid as c,Typography as l}from"@material-ui/core";import u from"classnames";import d from"./Step.js";import s from"./StepContent.js";import{jsxs as m,jsx as p,Fragment as f}from"react/jsx-runtime";var h=a((function(e){return{stepHeader:{padding:e.spacing(4),textAlign:"center",width:"100%",display:"flex",flexDirection:"column",alignItems:"center"},subtitle:{marginTop:e.spacing(2),color:e.palette.primary.text6,fontSize:16,letterSpacing:-.01,lineHeight:"normal"},form:{display:"flex",justifyContent:"space-between"},actions:{display:"flex",justifyContent:function(e){return e.isResendButtonVisible?"space-between":"end"},width:"100%",padding:"24px 32px 40px"},input:{"&::-webkit-outer-spin-button, &::-webkit-inner-spin-button":{"-webkit-appearance":"none",margin:0},padding:8,border:"1px solid ".concat(e.palette.primary.text9),borderRadius:4,backgroundColor:e.palette.background.b4,color:e.palette.primary.contrastText,fontSize:30,textAlign:"center","&:active, &:hover, &:focus-visible":{border:"1px solid ".concat(e.palette.primary.main),outline:"none"}},inputError:{border:"1px solid ".concat(e.palette.error.main," !important")},footer:{width:"100%",padding:"0 32px",fontSize:14,letterSpacing:-.01,color:e.palette.primary.text6,textAlign:"center"},divider:{borderTop:"1px solid rgba(255, 255, 255, 0.2)",width:"100%",marginBottom:40},footerButton:{cursor:"pointer",color:e.palette.primary.main}}})),b="email",v="sms",g=Array.from({length:6},(function(){return""}));function y(a){var y=a.email,x=a.identityVerification,S=a.loginVerificationFailure,C=a.onCodeProvided,N=a.requestVerification,w=r(x.enabled_modes[0]),k=t(w,2),B=k[0],T=k[1],j=r(g),V=t(j,2),A=V[0],D=V[1],E=r(S),I=t(E,2),R=I[0],z=I[1],H=r(!1),M=t(H,2),P=M[0],_=M[1],q=h({isResendButtonVisible:P}),F=n(null),W=n(null);i((function(){z(S),S&&(_(!0),W.current=null)}),[S]),i((function(){return N({email:y,mode:B}).then((function(){W.current=setTimeout((function(){_(!0),W.current=null}),15e3)})).catch(console.error),function(){W.current&&clearTimeout(W.current)}}),[]);var Y=function(){A.every(Boolean)&&C({code:A.join(""),mode:B})},G=A.every(Boolean);i((function(){G&&Y()}),[A.join(),G]);var J=function(e){e.preventDefault(),Y()},K=function(r){return function(n){var i=t(n.target.value,2),o=i[0],a=i[1],c=A[r],l=o;a&&a!==c&&(l=a);var u=e(A);u[r]=l,D(u),z(!1),void 0===l&&r>0?F.current.childNodes[r-1].focus():l&&r<5&&F.current.childNodes[r+1].focus()}},L=function(e){return function(){T(e),N({email:y,mode:e}).catch(console.error),_(!1),z(!1),D(g),W.current&&clearTimeout(W.current),W.current=setTimeout((function(){_(!0),W.current=null}),15e3)}};return m(d,{children:[m(c,{item:!0,className:q.stepHeader,children:[p(l,{variant:"h6",children:R?"Invalid Verification Code":"Verify Your Identity"}),p("div",{className:q.subtitle,children:B===b?"Enter a 6-digit code which was set to ".concat(y):"We have sent an SMS with one time verification code to your phone number"})]}),p(s,{children:p("form",{className:q.form,id:"verification-form",onSubmit:J,autoComplete:"on",ref:F,onPaste:function(e){var t=String(e.clipboardData.getData("text")).trim().slice(0,6).split("");t.every((function(e){return Number.isInteger(Number(e))}))&&6===t.length&&D(t)},children:A.map((function(e,t){return p("input",{type:"number",min:0,max:9,onChange:K(t),className:u(q.input,R&&q.inputError),value:e},t)}))})}),m("div",{className:q.actions,children:[P&&p(o,{onClick:L(B),variation:"secondary",children:"Resend Code"}),p(o,{disabled:!G||R,form:"verification-form",onClick:J,type:"submit",variation:"primary",children:"Next"})]}),x.enabled_modes.length>1&&m("div",{className:q.footer,children:[p("div",{className:q.divider}),m(f,B===b?{children:["Send a code via"," ",p("span",{className:q.footerButton,onClick:L(v),children:"SMS"})]}:{children:["Send a code to"," ",p("span",{className:q.footerButton,onClick:L(b),children:"Email"})]})]})]})}export{y as VerificationStep};
+import{useState as e,useRef as t,useEffect as r}from"react";import{Button as i}from"@corva/ui/components";import{makeStyles as n,Grid as o,Typography as a}from"@material-ui/core";import l from"classnames";import c from"./Step.js";import s from"./StepContent.js";import{jsxs as d,jsx as m,Fragment as p}from"react/jsx-runtime";const u=n((e=>({stepHeader:{padding:e.spacing(4),textAlign:"center",width:"100%",display:"flex",flexDirection:"column",alignItems:"center"},subtitle:{marginTop:e.spacing(2),color:e.palette.primary.text6,fontSize:16,letterSpacing:-.01,lineHeight:"normal"},form:{display:"flex",justifyContent:"space-between"},actions:{display:"flex",justifyContent:({isResendButtonVisible:e})=>e?"space-between":"end",width:"100%",padding:"24px 32px 40px"},input:{"&::-webkit-outer-spin-button, &::-webkit-inner-spin-button":{"-webkit-appearance":"none",margin:0},padding:8,border:`1px solid ${e.palette.primary.text9}`,borderRadius:4,backgroundColor:e.palette.background.b4,color:e.palette.primary.contrastText,fontSize:30,textAlign:"center","&:active, &:hover, &:focus-visible":{border:`1px solid ${e.palette.primary.main}`,outline:"none"}},inputError:{border:`1px solid ${e.palette.error.main} !important`},footer:{width:"100%",padding:"0 32px",fontSize:14,letterSpacing:-.01,color:e.palette.primary.text6,textAlign:"center"},divider:{borderTop:"1px solid rgba(255, 255, 255, 0.2)",width:"100%",marginBottom:40},footerButton:{cursor:"pointer",color:e.palette.primary.main}}))),f="email",h="sms",b=Array.from({length:6},(()=>""));function g({email:n,identityVerification:g,loginVerificationFailure:v,onCodeProvided:x,requestVerification:y}){const[S,N]=e(g.enabled_modes[0]),[C,w]=e(b),[k,B]=e(v),[j,T]=e(!1),V=u({isResendButtonVisible:j}),A=t(null),D=t(null);r((()=>{B(v),v&&(T(!0),D.current=null)}),[v]),r((()=>(y({email:n,mode:S}).then((()=>{D.current=setTimeout((()=>{T(!0),D.current=null}),15e3)})).catch(console.error),()=>{D.current&&clearTimeout(D.current)})),[]);const E=()=>{C.every(Boolean)&&x({code:C.join(""),mode:S})},I=C.every(Boolean);r((()=>{I&&E()}),[C.join(),I]);const R=e=>{e.preventDefault(),E()},$=e=>t=>{const[r,i]=t.target.value,n=C[e];let o=r;i&&i!==n&&(o=i);const a=[...C];a[e]=o,w(a),B(!1),void 0===o&&e>0?A.current.childNodes[e-1].focus():o&&e<5&&A.current.childNodes[e+1].focus()},z=e=>()=>{N(e),y({email:n,mode:e}).catch(console.error),T(!1),B(!1),w(b),D.current&&clearTimeout(D.current),D.current=setTimeout((()=>{T(!0),D.current=null}),15e3)};return d(c,{children:[d(o,{item:!0,className:V.stepHeader,children:[m(a,{variant:"h6",children:k?"Invalid Verification Code":"Verify Your Identity"}),m("div",{className:V.subtitle,children:S===f?`Enter a 6-digit code which was set to ${n}`:"We have sent an SMS with one time verification code to your phone number"})]}),m(s,{children:m("form",{className:V.form,id:"verification-form",onSubmit:R,autoComplete:"on",ref:A,onPaste:e=>{const t=String(e.clipboardData.getData("text")).trim().slice(0,6).split("");t.every((e=>Number.isInteger(Number(e))))&&6===t.length&&w(t)},children:C.map(((e,t)=>m("input",{type:"number",min:0,max:9,onChange:$(t),className:l(V.input,k&&V.inputError),value:e},t)))})}),d("div",{className:V.actions,children:[j&&m(i,{onClick:z(S),variation:"secondary",children:"Resend Code"}),m(i,{disabled:!I||k,form:"verification-form",onClick:R,type:"submit",variation:"primary",children:"Next"})]}),g.enabled_modes.length>1&&d("div",{className:V.footer,children:[m("div",{className:V.divider}),d(p,S===f?{children:["Send a code via"," ",m("span",{className:V.footerButton,onClick:z(h),children:"SMS"})]}:{children:["Send a code to"," ",m("span",{className:V.footerButton,onClick:z(f),children:"Email"})]})]})]})}export{g as VerificationStep};