@corva/dc-platform-shared 0.0.0-58393c2 → 0.0.0-59520c5

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};