@corva/dc-platform-shared 0.0.0-9dfc9bebbc → 0.0.0-ab9c6c3

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";const a="EmailPo",o="Need help?";function s(e){const{children:r,classes:s,showNeedHelp:d,needHelpExternalLink:p}=e;return t(i,{item:!0,className:s.gridItem,children:l(i,{container:!0,direction:"row",justify:"space-between",alignItems:"center",children:[l(i,{item:!0,children:[d&&!p&&t(n,{"data-testid":"".concat(a,"_needHelp"),className:s.helpLink,href:"/login/help",children:o}),d&&p&&t("a",{"data-testid":"".concat(a,"_needHelp"),className:s.helpLink,href:p,target:"_blank",rel:"noreferrer",children:o})]}),t(i,{item:!0,children:r})]})})}s.propTypes={children:e.node,showNeedHelp:e.bool,needHelpExternalLink:e.string,classes:e.shape({gridItem:e.string.isRequired,helpLink:e.string.isRequired}).isRequired},s.defaultProps={children:null,needHelpExternalLink:null,showNeedHelp:!0};var d=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"}}})))(s);export{d 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/VerificationStep.js

@@ -0,0 +1 @@
+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};

package/components/Login/index.js

@@ -1 +1 @@
-export{default as Login}from"./components/Login.js";export{default as PasswordField}from"./components/PasswordField.js";export{default as Chip}from"./components/Chip.js";export{default as StepFooter}from"./components/StepFooter.js";export{default as StepContent}from"./components/StepContent.js";export{default as StepHeader}from"./components/StepHeader.js";export{default as Step}from"./components/Step.js";export{default as OrDivider}from"./components/OrDivider.js";export{default as HiddenEmailField}from"./components/HiddenEmailField.js";export{default as EmailField}from"./components/EmailField.js";
+export{default as Chip}from"./components/Chip.js";export{default as EmailField}from"./components/EmailField.js";export{default as HiddenEmailField}from"./components/HiddenEmailField.js";export{default as Login}from"./components/Login.js";export{default as OrDivider}from"./components/OrDivider.js";export{default as PasswordField}from"./components/PasswordField.js";export{default as Step}from"./components/Step.js";export{default as StepContent}from"./components/StepContent.js";export{default as StepFooter}from"./components/StepFooter.js";export{default as StepHeader}from"./components/StepHeader.js";export{VerificationStep}from"./components/VerificationStep.js";